:root {
    --brand-blue: #0052cc;
    --brand-dark: #091e42;
    --success: #00875a;
    --text-main: #172b4d;
    --bg-light: #f4f5f7;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
    font-family: 'Inter', sans-serif;
    color: var(--text-main);
    background: #fff;
    line-height: 1.5;
}

.container { max-width: 1100px; margin: 0 auto; padding: 0 20px; }

/* Navbar */
.navbar { padding: 20px 0; border-bottom: 1px solid #eee; }
.logo { font-size: 1.5rem; letter-spacing: -1px; }
.logo strong { color: var(--brand-blue); }
.trust-badge { float: right; font-size: 0.8rem; background: var(--bg-light); padding: 5px 12px; border-radius: 20px; font-weight: bold; }

/* Hero */
.hero { padding: 80px 0; background: radial-gradient(circle at top right, #f0f7ff, #fff); }
.hero .container { display: flex; align-items: center; gap: 50px; }

.hero-content { flex: 1; }
.pre-title { color: var(--brand-blue); font-weight: 900; font-size: 0.8rem; letter-spacing: 2px; }

h1 { font-size: 3.5rem; font-weight: 900; line-height: 1.1; margin: 20px 0; color: var(--brand-dark); }
.highlight { color: var(--brand-blue); }

.subtitle { font-size: 1.2rem; color: #505f79; margin-bottom: 30px; }

.benefits-grid { display: flex; gap: 15px; margin-bottom: 40px; }
.b-item { background: #fff; border: 1px solid #ddd; padding: 10px 15px; border-radius: 8px; font-weight: bold; font-size: 0.9rem; box-shadow: 0 4px 6px rgba(0,0,0,0.05); }

.cta-main-btn {
    display: inline-block;
    background: var(--brand-blue);
    color: #fff;
    text-decoration: none;
    padding: 22px 40px;
    border-radius: 50px;
    font-weight: 900;
    font-size: 1.1rem;
    box-shadow: 0 10px 20px rgba(0, 82, 204, 0.3);
    transition: 0.3s;
}

.hero-image img { max-width: 400px; filter: drop-shadow(0 20px 30px rgba(0,0,0,0.1)); }

/* Info Cards */
.scientific-proof { padding: 80px 0; background: var(--bg-light); text-align: center; }
.cards-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 30px; margin-top: 50px; }
.info-card { background: #fff; padding: 40px; border-radius: 20px; border: 1px solid #eee; }
.info-card h3 { color: var(--brand-blue); margin-bottom: 15px; }

/* Offer Box */
.offer-section { padding: 100px 0; text-align: center; }
.offer-box { background: var(--brand-dark); color: #fff; padding: 60px; border-radius: 30px; position: relative; overflow: hidden; }
.promo-tag { background: #ffab00; color: #000; padding: 5px 20px; border-radius: 50px; font-weight: bold; margin-bottom: 20px; display: inline-block; }
.cta-secondary-btn {
    display: inline-block;
    background: var(--success);
    color: #fff;
    text-decoration: none;
    padding: 20px 60px;
    border-radius: 10px;
    font-weight: 900;
    font-size: 1.5rem;
    margin: 30px 0;
}

.footer { padding: 40px; font-size: 0.8rem; color: #999; text-align: center; }

@media (max-width: 768px) {
    .hero .container { flex-direction: column-reverse; text-align: center; }
    h1 { font-size: 2.2rem; }
    .hero-image img { max-width: 250px; }
    .benefits-grid { justify-content: center; }
}