:root {
        --primary: #006799;
        --dark: #1e1e1e;
        --light: #f4f4f4;
        --accent: #2ba1cb;
    }
    * { box-sizing: border-box; margin: 0; padding: 0; }
    body { font-family: 'Montserrat', 'Helvetica Neue', Arial, sans-serif; line-height: 1.6; color: var(--dark); background: #fff; }
    
    header { background: #fff; border-bottom: 2px solid var(--primary); padding: 1rem; display: flex; justify-content: space-between; align-items: center; }
    .logo-container { width: 150px; }
    .logo-container img { width: 100%; height: auto; }
    
    nav { display: flex; gap: 15px; flex-wrap: wrap; }
    nav a { text-decoration: none; color: var(--primary); font-size: 0.9rem; font-weight: 600; }
    
    .hero { height: 400px; background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), #222; display: flex; align-items: center; justify-content: center; color: white; text-align: center; }
    
    .container { max-width: 1200px; margin: 2rem auto; padding: 0 1rem; }
    .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2rem; }
    
    .card { border: 1px solid #ddd; padding: 1.5rem; border-radius: 8px; box-shadow: 0 4px 6px rgba(0,0,0,0.1); }
    
    footer { background: var(--dark); color: white; padding: 2rem; text-align: center; margin-top: 3rem; }
    .payment-icons { margin-top: 1rem; }
    .payment-icons img { height: 30px; }

    @media (max-width: 768px) {
        header { flex-direction: column; }
        nav { margin-top: 1rem; justify-content: center; }
    }