:root {
    --navy: #080F1C;
    --navy-2: #0B1829;
    --navy-3: #0F2035;
    --navy-4: #162840;
    --green: #78BE20;
    --green-hi: #95D632;
    --green-lo: #B8EA72;
    --green-dk: #5E9910;
    --white: #FFFFFF;
    --gray-50: #F8FAFC;
    --gray-100: #F1F4F8;
    --gray-200: #E2E8F0;
    --gray-500: #64748B;
    --gray-700: #334155;
    --gray-900: #0F172A;
    --muted: rgba(255,255,255,.55);
    --border-g: rgba(120,190,32,.2);
    --font-h: 'Space Grotesk', sans-serif;
    --font-b: 'Inter', sans-serif;
    --ease: cubic-bezier(.4,0,.2,1);
    --t: .28s var(--ease);
}

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

html { scroll-behavior: smooth; }

body {
    font-family: var(--font-b);
    background: var(--navy);
    color: var(--white);
    overflow-x: hidden;
    line-height: 1.6;
}

a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }

#progress-bar {
    position: fixed; top: 0; left: 0; height: 3px; z-index: 200;
    background: linear-gradient(90deg, var(--green), var(--green-hi));
    width: 0%; transition: width .08s linear;
    box-shadow: 0 0 8px rgba(120,190,32,.6);
}

.dot-grid {
    position: absolute; inset: 0; pointer-events: none;
    background-image: radial-gradient(circle, rgba(120,190,32,.2) 1px, transparent 1px);
    background-size: 36px 36px;
    mask-image: radial-gradient(ellipse 80% 75% at 50% 45%, black 35%, transparent 100%);
    -webkit-mask-image: radial-gradient(ellipse 80% 75% at 50% 45%, black 35%, transparent 100%);
}

.wave { position: relative; height: 80px; overflow: hidden; line-height: 0; }
.wave svg { position: absolute; bottom: 0; width: 100%; height: 100%; }

nav {
    position: fixed; top: 0; left: 0; right: 0; z-index: 100;
    padding: 1rem 0; transition: var(--t);
}

nav.scrolled {
    background: rgba(8,15,28,.9);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--border-g);
    padding: .65rem 0;
}

.nav-inner {
    max-width: 1200px; margin: 0 auto; padding: 0 2.5rem;
    display: flex; align-items: center; justify-content: space-between;
}

.nav-brand {
    display: flex; align-items: center; gap: 10px;
    font-family: var(--font-h); font-weight: 700; font-size: 1.05rem;
    color: var(--white);
}

.nav-brand .epl { font-size: 1.4rem; color: var(--green); letter-spacing: -.04em; }
.nav-brand .sep { width: 1px; height: 20px; background: rgba(255,255,255,.2); }
.nav-brand .tagline { font-size: .7rem; font-weight: 400; color: var(--muted); letter-spacing: .06em; text-transform: uppercase; }

.nav-links { display: flex; align-items: center; gap: 1.45rem; list-style: none; }
.nav-links a { font-family: var(--font-h); font-size: .84rem; font-weight: 500; color: rgba(255,255,255,.65); transition: var(--t); }
.nav-links a:hover, .nav-links a.active { color: var(--green-hi); }
.nav-btn {
    background: var(--green) !important; color: var(--navy) !important;
    font-weight: 600 !important; padding: .48rem 1.2rem !important;
    border-radius: 100px; box-shadow: 0 4px 20px rgba(120,190,32,.3);
}
.nav-btn:hover { background: var(--green-hi) !important; }
.nav-toggle { display: none; flex-direction: column; gap: 5px; cursor: pointer; }
.nav-toggle span { display: block; width: 24px; height: 2px; background: var(--white); transition: var(--t); }

.sub-hero {
    position: relative;
    min-height: 88vh;
    display: flex;
    align-items: center;
    background: linear-gradient(145deg, #050c18 0%, #080f1c 50%, #0b1829 100%);
    overflow: hidden;
}

.hero-glow-1 {
    position: absolute; width: 700px; height: 500px; border-radius: 50%;
    background: radial-gradient(ellipse, rgba(120,190,32,.13) 0%, transparent 70%);
    top: -120px; right: -80px; pointer-events: none;
}

.hero-glow-2 {
    position: absolute; width: 400px; height: 400px; border-radius: 50%;
    background: radial-gradient(ellipse, rgba(120,190,32,.07) 0%, transparent 70%);
    bottom: -100px; left: 5%; pointer-events: none;
}

.sub-hero-inner {
    position: relative; z-index: 2;
    max-width: 1200px; margin: 0 auto; padding: 130px 2.5rem 90px;
    width: 100%;
}

.hero-crumb {
    display: flex; align-items: center; gap: 6px;
    font-family: var(--font-h); font-size: .68rem; font-weight: 500;
    color: var(--muted); letter-spacing: .08em; text-transform: uppercase;
    margin-bottom: 1.5rem;
}

.hero-crumb .arr { color: var(--green); }
.hero-crumb .act { color: var(--green-hi); }

@keyframes grad-flow { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} }

.anim-grad {
    background: linear-gradient(90deg, #78BE20 0%, #B8EA72 30%, #95D632 55%, #CCFF66 75%, #78BE20 100%);
    background-size: 300% auto;
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: grad-flow 3.5s ease infinite;
}

.sub-h1 {
    font-family: var(--font-h); font-weight: 700;
    font-size: clamp(2.8rem,5.4vw,5rem); line-height: 1.02;
    letter-spacing: -.04em; color: var(--white);
    max-width: 980px; margin-bottom: 1.4rem;
}

.sub-lead {
    font-size: clamp(.95rem,1.2vw,1.02rem);
    color: var(--muted); line-height: 1.8; max-width: 760px;
    margin-bottom: 2rem;
}

.hero-chip-row, .cta-row {
    display: flex; gap: .85rem; flex-wrap: wrap;
}

.hero-chip {
    display: inline-flex; align-items: center; gap: 6px;
    background: rgba(8,15,28,.94); border: 1px solid var(--border-g);
    border-radius: 8px; padding: .42rem .9rem;
    backdrop-filter: blur(12px); font-family: var(--font-h);
    font-size: .7rem; font-weight: 600; color: var(--white);
    letter-spacing: .06em; text-transform: uppercase;
}

.btn-green {
    display: inline-flex; align-items: center; gap: 7px;
    background: var(--green); color: var(--navy);
    font-family: var(--font-h); font-size: .88rem; font-weight: 600;
    padding: .82rem 1.65rem; border-radius: 8px; border: none;
    cursor: pointer; transition: var(--t); box-shadow: 0 6px 24px rgba(120,190,32,.32);
}

.btn-green:hover {
    background: var(--green-hi);
    transform: translateY(-2px);
    box-shadow: 0 10px 32px rgba(120,190,32,.45);
}

.btn-outline {
    display: inline-flex; align-items: center; gap: 7px;
    background: transparent; color: var(--white);
    font-family: var(--font-h); font-size: .88rem; font-weight: 500;
    padding: .82rem 1.65rem; border-radius: 8px;
    border: 1px solid rgba(255,255,255,.22);
    cursor: pointer; transition: var(--t);
}

.btn-outline:hover {
    background: rgba(255,255,255,.07);
    border-color: rgba(255,255,255,.42);
    transform: translateY(-2px);
}

.hero-bento {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 2.5rem;
}

.hero-bento .bento-card,
.section-card,
.quote-card,
.stat-card,
.cta-band,
.faq-shell {
    position: relative;
    overflow: hidden;
    border-radius: 22px;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(120,190,32,.15);
}

a.bento-card {
    display: block;
    color: inherit;
    text-decoration: none;
}

a.section-card {
    display: block;
    color: inherit;
    text-decoration: none;
}

.hero-bento .bento-card::before,
.section-card::before,
.quote-card::before,
.stat-card::before,
.cta-band::before,
.faq-shell::before {
    content: "";
    position: absolute; inset: 0; pointer-events: none;
    background: linear-gradient(135deg, rgba(120,190,32,.08), transparent 42%);
}

.hero-bento .bento-card,
.section-card,
.quote-card,
.cta-band,
.faq-shell { padding: 1.4rem; }

.stat-card { padding: 1.1rem 1.2rem; }

.hero-bento .bento-card > *,
.section-card > *,
.quote-card > *,
.stat-card > *,
.cta-band > *,
.faq-shell > * { position: relative; z-index: 1; }

.bento-kicker,
.section-kicker {
    display: inline-flex; align-items: center; gap: 8px;
    font-family: var(--font-h); font-size: .68rem; font-weight: 600;
    letter-spacing: .12em; text-transform: uppercase;
    color: var(--green-hi); margin-bottom: .75rem;
}

.bento-kicker::before,
.section-kicker::before {
    content: ""; width: 16px; height: 2px; background: var(--green);
}

.bento-title,
.section-title {
    font-family: var(--font-h); font-weight: 700; letter-spacing: -.03em;
    line-height: 1.12; color: var(--white);
}

.bento-title { font-size: 1.22rem; margin-bottom: .6rem; }
.section-title { font-size: clamp(1.9rem,3.7vw,2.8rem); margin-bottom: .85rem; }

.bento-text,
.section-text,
.quote-text,
.faq-item p,
.foot-copy {
    color: var(--muted);
    line-height: 1.75;
}

.section-dark {
    background: var(--navy);
    padding: 5.5rem 0;
    position: relative;
    overflow: hidden;
}

.section-dark .dot-grid { opacity: .18; }

.section-light {
    background: var(--white);
    color: var(--gray-900);
    padding: 5rem 0;
    position: relative;
}

.section-light .section-title,
.section-light .bento-title { color: var(--gray-900); }
.section-light .section-text,
.section-light .bento-text,
.section-light .quote-text,
.section-light .foot-copy { color: var(--gray-500); }

.section-light .section-card,
.section-light .quote-card,
.section-light .stat-card,
.section-light .cta-band,
.section-light .faq-shell {
    background: var(--white);
    border: 1px solid var(--gray-200);
    box-shadow: 0 18px 48px rgba(15,23,42,.08);
}

.section-light .section-card::before,
.section-light .quote-card::before,
.section-light .stat-card::before,
.section-light .cta-band::before,
.section-light .faq-shell::before {
    background: linear-gradient(135deg, rgba(120,190,32,.05), transparent 40%);
}

.section-inner {
    max-width: 1200px; margin: 0 auto; padding: 0 2.5rem;
}

.section-head {
    margin-bottom: 2rem;
    max-width: 860px;
}

.section-grid-2,
.section-grid-3,
.section-grid-4 {
    display: grid; gap: 1rem;
}

.section-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.section-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.section-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.stat-value {
    font-family: var(--font-h);
    font-size: clamp(2rem,3.5vw,3rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.04em;
    margin-bottom: .35rem;
    color: var(--green-hi);
}

.section-list,
.link-list {
    list-style: none;
    display: grid;
    gap: .7rem;
    margin-top: 1rem;
}

.section-list li,
.link-list li {
    position: relative;
    padding-left: 1rem;
}

.section-list li::before,
.link-list li::before {
    content: "";
    position: absolute; left: 0; top: .62rem;
    width: 6px; height: 6px; border-radius: 50%;
    background: var(--green);
}

.link-list a { font-weight: 600; }

.cta-band {
    display: grid;
    gap: 1rem;
}

.quote-card { font-style: italic; }

footer { background: #070e1a; padding: 3.5rem 0 2rem; border-top: 1px solid rgba(120,190,32,.1); }
.foot-inner { max-width: 1200px; margin: 0 auto; padding: 0 2.5rem; }
.foot-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 3rem; margin-bottom: 2.5rem; }
.fb-name { font-family: var(--font-h); font-size: 1.05rem; font-weight: 700; color: var(--white); margin-bottom: .7rem; }
.fb-name span { color: var(--green); }
.fb-tag { font-size: .85rem; color: rgba(255,255,255,.35); line-height: 1.7; max-width: 250px; margin-bottom: 1.25rem; }
.f-social { display: flex; gap: .6rem; }
.fsoc { width: 34px; height: 34px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); border-radius: 7px; display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,.4); font-size: .82rem; transition: var(--t); cursor: pointer; }
.fsoc:hover { background: rgba(120,190,32,.15); border-color: var(--border-g); color: var(--green); }
.f-col-h { font-family: var(--font-h); font-size: .76rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.45); margin-bottom: 1.1rem; }
.f-ul { list-style: none; display: flex; flex-direction: column; gap: .65rem; }
.f-ul a { font-size: .85rem; color: rgba(255,255,255,.35); transition: var(--t); }
.f-ul a:hover { color: var(--green); }
.f-bar { display: flex; justify-content: space-between; align-items: center; padding-top: 1.75rem; border-top: 1px solid rgba(255,255,255,.07); font-size: .76rem; color: rgba(255,255,255,.25); }

.faq-item + .faq-item { margin-top: 1rem; }
.faq-item summary {
    cursor: pointer; font-family: var(--font-h); font-weight: 600;
    color: inherit;
}

@media (max-width: 980px) {
    .hero-bento,
    .section-grid-2,
    .section-grid-3,
    .section-grid-4,
    .foot-grid {
        grid-template-columns: 1fr;
    }

    .nav-inner {
        flex-direction: column;
        align-items: start;
        gap: .9rem;
    }
}

@media (max-width: 640px) {
    .nav-inner,
    .sub-hero-inner,
    .section-inner,
    .foot-inner { padding-left: 1.4rem; padding-right: 1.4rem; }
}