:root {
    --navy: #1a2b4b;
    --mint-bg: #e8f5ed;
    --mint-accent: #c8e6d4;
    --gold: #dcae5d;
    --cream: #fdfaf3;
}

body { margin: 0; font-family: 'Inter', sans-serif; color: var(--navy); line-height: 1.4; }
.container { max-width: 1000px; margin: 0 auto; padding: 0 20px; }

/* Sections */
.section-cream { background-color: var(--cream); padding-bottom: 20px; }
.section-mint { background-color: var(--mint-bg); padding: 40px 0; }

/* Logo & Nav */
.logo-group { display: flex; flex-direction: column; align-items: center; text-decoration: none; color: var(--navy); }
.nav-logo { width: 45px; height: 45px; border-radius: 50%; border: 1px solid #ccc; background: white; }
.logo-text { font-weight: bold; font-size: 0.8rem; margin-top: 2px; }

.nav-bar { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; }
nav a { margin: 0 15px; text-decoration: none; color: var(--navy); font-weight: 600; font-size: 0.9rem; }
.btn-download { background-color: var(--mint-accent); padding: 8px 18px; border-radius: 20px; text-decoration: none; color: var(--navy); font-size: 0.85rem; }

/* Hero */
.hero { display: flex; align-items: center; padding: 30px 20px; gap: 40px; }
.hero-content { flex: 1.2; }
h1 { font-family: 'Playfair Display', serif; font-size: 2.8rem; margin: 0 0 10px 0; line-height: 1.1; }
.btn-primary { display: inline-block; background-color: var(--gold); padding: 12px 25px; border-radius: 25px; text-decoration: none; font-weight: bold; color: var(--navy); margin-top: 15px; }
.hero-image img { max-width: 100%; height: auto; max-height: 280px; }

/* Bars & Lists */
.trust-bar { background-color: var(--mint-accent); text-align: center; padding: 8px; font-size: 0.85rem; font-weight: 500; }
.value-prop { display: flex; align-items: center; gap: 50px; padding-bottom: 30px; }
.features-list { padding: 0; list-style: none; font-size: 0.9rem; }
.features-list li { margin-bottom: 10px; }

/* Update Grids to handle 3 pricing boxes */
.grid-three { 
    display: grid; 
    grid-template-columns: repeat(3, 1fr); 
    gap: 15px; 
    margin-top: 20px; 
}

/* Updated Pricing Card Styles */
.card { 
    background: var(--mint-accent); /* Standard color for Free and Basic */
    padding: 20px; 
    border-radius: 10px; 
    text-align: center; 
}

.card.highlight { 
    border: 2px solid var(--gold); 
    background: var(--mint-accent); /* Now matches the color of Free and Basic */
}

/* Ensure mobile responsiveness for the 3-box layout */
@media (max-width: 768px) {
    .grid-three {
        grid-template-columns: 1fr;
    }
}
/* Footer */
footer { background-color: var(--navy); color: white; padding: 30px 0; }
.footer-content { display: flex; justify-content: space-between; align-items: center; }
.footer-links a { color: white; margin-right: 20px; text-decoration: none; font-size: 0.8rem; }

/* Support Form Styling */
.support-form { background: white; padding: 30px; border-radius: 15px; box-shadow: 0 4px 15px rgba(26, 43, 75, 0.05); }
.form-group { margin-bottom: 20px; }
.form-group label { display: block; font-weight: 600; margin-bottom: 8px; font-size: 0.9rem; }
.form-group input, .form-group select, .form-group textarea {
    width: 100%; padding: 12px; border: 1px solid var(--mint-accent); border-radius: 8px;
    font-family: 'Inter', sans-serif; font-size: 1rem; box-sizing: border-box;
}
.form-group input:focus, .form-group textarea:focus { outline: none; border-color: var(--gold); }