/* ================================================================
   Gornelvia — Warm editorial, sage green accent
   Headings: DM Serif Display · Body: DM Sans
   ================================================================ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

:root{
    --bg:#FAFAF5;--white:#FFFFFF;--cream:#F5F3EE;--warm-50:#FAF9F6;--warm-100:#F3F1EC;--warm-200:#E8E5DD;
    --ink:#1B1B18;--ink-light:#2D2D28;--slate:#4A4A42;--muted:#7A7A6E;--dim:#A3A396;
    --green:#16A34A;--green-hover:#15803D;--green-light:#F0FDF4;--green-100:#DCFCE7;--green-glow:rgba(22,163,74,.08);
    --amber:#D97706;--amber-light:#FFFBEB;
    --red:#DC2626;--red-light:#FEF2F2;
    --border:#E5E2DB;--border-light:#EDEBE5;
    --shadow-sm:0 1px 2px rgba(27,27,24,.04);--shadow:0 2px 8px rgba(27,27,24,.06);--shadow-md:0 4px 16px rgba(27,27,24,.08);--shadow-lg:0 8px 30px rgba(27,27,24,.1);
    --serif:'Outfit',system-ui,sans-serif;
    --sans:'Outfit',system-ui,sans-serif;
    --r:10px;--r-sm:6px;--r-lg:14px;--r-pill:50px;
    --ease:.2s ease;
}

html{scroll-behavior:smooth}
body{font-family:var(--sans);font-size:16px;line-height:1.7;color:var(--slate);background:var(--bg);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--green);text-decoration:none;transition:color var(--ease)}
a:hover{color:var(--green-hover)}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}

h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.2;color:var(--ink)}
h4{font-family:var(--sans);font-weight:700;color:var(--ink)}
h1{font-size:clamp(32px,5vw,54px);letter-spacing:-.01em}
h2{font-size:clamp(24px,3.5vw,38px)}
h3{font-size:clamp(18px,2vw,24px)}
p{margin-bottom:16px;color:var(--muted)}

/* ── Buttons ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 26px;font-family:var(--sans);font-size:14px;font-weight:600;border-radius:var(--r-sm);border:none;cursor:pointer;transition:all var(--ease);text-decoration:none;line-height:1.4}
.btn-green{background:var(--green);color:var(--white)}.btn-green:hover{background:var(--green-hover);color:var(--white);box-shadow:0 4px 14px rgba(22,163,74,.2);transform:translateY(-1px)}
.btn-outline{background:var(--white);color:var(--ink);border:1px solid var(--border)}.btn-outline:hover{border-color:var(--green);color:var(--green)}
.btn-ghost{background:none;color:var(--muted);padding:8px 12px;font-weight:500}.btn-ghost:hover{color:var(--ink)}
.btn-sm{padding:9px 18px;font-size:13px}
.btn-dark{background:var(--ink);color:var(--white)}.btn-dark:hover{background:var(--ink-light);color:var(--white)}

/* ── Header ── */
.hd{position:sticky;top:0;z-index:100;background:rgba(250,250,245,.95);backdrop-filter:blur(10px);border-bottom:1px solid var(--border-light)}
.hd-row{display:flex;align-items:center;justify-content:space-between;height:64px}
.hd-logo{font-family:var(--serif);font-size:22px;font-weight:700;color:var(--ink);letter-spacing:-.02em}
.hd-logo span{color:var(--green)}
.ft .hd-logo{color:#fff!important}
.hd-nav{display:flex;gap:4px}
.hd-link{padding:7px 14px;border-radius:var(--r-sm);font-size:14px;font-weight:500;color:var(--muted);transition:all var(--ease)}
.hd-link:hover{color:var(--ink);background:var(--warm-100)}
.hd-link.on{color:var(--ink);font-weight:600}
.hd-cta{padding:9px 20px;background:var(--green);color:var(--white)!important;font-size:13px;font-weight:600;border-radius:var(--r-sm);transition:all var(--ease)}
.hd-cta:hover{background:var(--green-hover)}
.hd-burger{display:none;background:none;border:none;cursor:pointer;width:32px;height:32px;position:relative}
.hd-burger span{position:absolute;left:4px;width:24px;height:2px;background:var(--ink);border-radius:2px;transition:all .2s}
.hd-burger span:first-child{top:11px}.hd-burger span:last-child{top:19px}
@media(max-width:768px){.hd-nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;background:var(--bg);padding:16px 24px;border-bottom:1px solid var(--border)}.hd-nav.open{display:flex}.hd-burger{display:block}.hd-cta{display:none}}

/* ── Sections ── */
.sec{padding:80px 0}
.sec-cream{background:var(--cream)}
.sec-green{background:var(--green-light)}
.sec-dark{background:var(--ink);color:var(--white)}
.sec-dark h2,.sec-dark h3{color:var(--white)}.sec-dark p{color:var(--dim)}
.sec-head{max-width:620px;margin-bottom:48px}
.sec-head.centered{text-align:center;margin-left:auto;margin-right:auto}
.sec-head p{font-size:17px;margin-top:10px}
.label{display:inline-block;font-family:var(--sans);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:var(--green);margin-bottom:12px}

/* ── Hero (full-width centered, dark gradient) ── */
.hero{padding:100px 0 80px;text-align:center;background:linear-gradient(160deg,#0a1a0f 0%,#0f2918 35%,#132f1c 60%,#0d1f12 100%);position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;top:-40%;left:20%;width:60%;height:80%;background:radial-gradient(ellipse,rgba(22,163,74,.12),transparent 70%);pointer-events:none}
.hero::after{content:'';position:absolute;bottom:-30%;right:10%;width:50%;height:60%;background:radial-gradient(ellipse,rgba(22,163,74,.06),transparent 70%);pointer-events:none}
.hero .wrap{position:relative;z-index:1}
.hero h1{max-width:700px;margin:0 auto 20px;color:#fff}
.hero>p,.hero .wrap>p{font-size:19px;max-width:560px;margin:0 auto 32px;line-height:1.7;color:rgba(255,255,255,.6)}
.hero .label{color:var(--green);background:rgba(22,163,74,.12);border:1px solid rgba(22,163,74,.2)}
.hero .btn-outline{background:transparent;border-color:rgba(255,255,255,.15);color:rgba(255,255,255,.7)}.hero .btn-outline:hover{border-color:var(--green);color:#fff;background:rgba(22,163,74,.1)}
.hero-chips{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:40px}
.hero-chip{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:var(--r-pill);font-size:13px;font-weight:500;color:rgba(255,255,255,.5)}
.hero-chip i{color:var(--green);font-size:12px}
.hero-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
@media(max-width:768px){.hero{padding:56px 0 48px}.hero h1{font-size:32px}}

/* ── Trust Bar (horizontal numbers) ── */
.trust-bar{display:flex;justify-content:center;gap:56px;padding:40px 0;background:var(--cream);border-bottom:1px solid var(--border-light)}
.trust-item{text-align:center}
.trust-n{font-family:var(--serif);font-size:36px;color:var(--green);line-height:1}
.trust-l{font-size:12px;color:var(--dim);margin-top:4px;font-weight:500;text-transform:uppercase;letter-spacing:.5px}
@media(max-width:600px){.trust-bar{flex-wrap:wrap;gap:32px}}

/* ── Comparison Table ── */
.cmp-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.cmp{width:100%;border-collapse:collapse;min-width:700px}
.cmp th{font-family:var(--sans);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--dim);padding:12px 14px;text-align:left;border-bottom:2px solid var(--border);background:var(--warm-50);position:sticky;top:0}
.cmp td{padding:16px 14px;border-bottom:1px solid var(--border-light);font-size:14px;color:var(--slate);vertical-align:middle}
.cmp tr:hover td{background:var(--green-light)}
.cmp-logo{height:18px;width:auto;max-width:70px;object-fit:contain;display:inline-block}
.cmp-name{font-weight:700;color:var(--ink);display:flex;align-items:center;gap:10px}
.cmp-score{font-family:var(--serif);font-size:20px;color:var(--green)}
.cmp-badge{font-size:9px;font-weight:700;background:var(--green);color:var(--white);padding:2px 8px;border-radius:var(--r-pill);text-transform:uppercase;white-space:nowrap}

/* ── Spotlight Card ── */
.spot{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:40px;box-shadow:var(--shadow)}
.spot-img{border-radius:var(--r);overflow:hidden;border:1px solid var(--border-light)}
.spot-img img{width:100%;display:block}
.spot h3{margin-bottom:8px}
.spot-meta{font-size:13px;color:var(--dim);margin-bottom:16px}
.spot-score{font-family:var(--serif);font-size:48px;color:var(--green);line-height:1;margin-bottom:4px}
.spot-score-label{font-size:12px;color:var(--dim);margin-bottom:16px}
.spot-feats{list-style:none;margin-bottom:20px}
.spot-feats li{font-size:14px;color:var(--slate);padding:5px 0;display:flex;gap:8px;align-items:center}
.spot-feats li i{color:var(--green);font-size:12px;flex-shrink:0}
.spot-btns{display:flex;gap:8px}
@media(max-width:768px){.spot{grid-template-columns:1fr;padding:24px}.spot-score{font-size:36px}}

/* ── Compact Platform List ── */
.plist{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:24px}
.plist-item{background:var(--white);border:1px solid var(--border);border-radius:var(--r-sm);padding:20px 16px;text-align:center;transition:all var(--ease)}
.plist-item:hover{border-color:var(--green);box-shadow:var(--shadow-md);transform:translateY(-2px)}
.plist-item img{height:18px;max-width:60px;margin:0 auto 10px;object-fit:contain}
.plist-name{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:2px}
.plist-score{font-family:var(--serif);font-size:18px;color:var(--green);margin-bottom:8px}
.plist-item a{font-size:12px;font-weight:600;color:var(--green)}
@media(max-width:900px){.plist{grid-template-columns:repeat(3,1fr)}}
@media(max-width:500px){.plist{grid-template-columns:1fr 1fr}}

/* ── Editorial Articles (1 big + 2 small) ── */
.edit-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.edit-big{grid-row:span 2;background:var(--white);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-sm);transition:all var(--ease)}
.edit-big:hover{box-shadow:var(--shadow-md);border-color:var(--green)}
.edit-big-bar{height:5px;background:linear-gradient(to right,var(--green),var(--amber))}
.edit-big-body{padding:32px}
.edit-big .label{margin-bottom:8px}
.edit-big h3{font-size:24px;margin-bottom:12px}.edit-big h3 a{color:var(--ink)}.edit-big h3 a:hover{color:var(--green)}
.edit-big p{font-size:15px;color:var(--muted);line-height:1.7}
.edit-sm{background:var(--white);border:1px solid var(--border);border-radius:var(--r);padding:24px;box-shadow:var(--shadow-sm);transition:all var(--ease);display:flex;flex-direction:column;justify-content:center}
.edit-sm:hover{box-shadow:var(--shadow-md);border-color:var(--green)}
.edit-sm .label{margin-bottom:6px}
.edit-sm h3{font-size:17px;margin-bottom:6px}.edit-sm h3 a{color:var(--ink)}.edit-sm h3 a:hover{color:var(--green)}
.edit-sm p{font-size:13px;color:var(--muted);margin:0}
@media(max-width:768px){.edit-grid{grid-template-columns:1fr}.edit-big{grid-row:auto}}

/* ── FAQ Accordion ── */
.faq-item{border-bottom:1px solid var(--border);padding:0}
.faq-q{display:flex;justify-content:space-between;align-items:center;padding:20px 0;cursor:pointer;background:none;border:none;width:100%;text-align:left;font-family:var(--sans);font-size:16px;font-weight:600;color:var(--ink);transition:color var(--ease)}
.faq-q:hover{color:var(--green)}
.faq-q i{color:var(--dim);font-size:14px;transition:transform .2s;flex-shrink:0}
.faq-q.open i{transform:rotate(180deg);color:var(--green)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease}
.faq-a.open{max-height:500px}
.faq-a p{padding-bottom:20px;font-size:15px;color:var(--muted);line-height:1.7}

/* ── How It Works (3 big numbered blocks) ── */
.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.how-block{background:var(--white);border:1px solid var(--border);border-radius:var(--r);padding:32px;position:relative;box-shadow:var(--shadow-sm)}
.how-n{font-family:var(--serif);font-size:64px;color:var(--green-100);line-height:1;margin-bottom:12px}
.how-block h3{font-size:19px;margin-bottom:8px}
.how-block p{font-size:14px;color:var(--muted);margin:0;line-height:1.7}
@media(max-width:768px){.how-grid{grid-template-columns:1fr}}

/* ── Platform Rows (for subpages) ── */
.prow{display:flex;align-items:center;gap:16px;padding:18px 20px;background:var(--white);border:1px solid var(--border);border-radius:var(--r-sm);margin-bottom:10px;box-shadow:var(--shadow-sm);transition:all var(--ease)}
.prow:hover{box-shadow:var(--shadow-md);border-color:var(--green)}
.prow-top{border-color:var(--green);background:var(--green-light)}
.prow-rank{width:28px;height:28px;background:var(--warm-100);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--muted);flex-shrink:0}
.prow-top .prow-rank{background:var(--green);color:var(--white)}
.prow-logo{flex-shrink:0;width:80px;display:flex;align-items:center}
.prow-logo img{height:20px;width:auto;max-width:75px;object-fit:contain}
.prow-info{flex:1;min-width:0}
.prow-name{font-size:15px;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.prow-tag{font-size:9px;font-weight:700;background:var(--green);color:var(--white);padding:2px 8px;border-radius:var(--r-pill);text-transform:uppercase}
.prow-meta{font-size:12px;color:var(--dim);margin-top:2px}
.prow-score{font-family:var(--serif);font-size:22px;color:var(--ink);flex-shrink:0}
.prow-acts{display:flex;gap:6px;flex-shrink:0}
@media(max-width:768px){.prow{flex-wrap:wrap}.prow-acts{width:100%}.prow-acts a{flex:1;justify-content:center}}

/* ── Review Page ── */
.rv-hero{padding:40px 0;border-bottom:1px solid var(--border);background:var(--white)}
.rv-hero-inner{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.rv-logo{width:56px;height:56px;background:var(--warm-50);border:1px solid var(--border);border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.rv-logo img{max-width:36px;max-height:36px;object-fit:contain}
.rv-body{display:grid;grid-template-columns:1fr 280px;gap:48px;padding:48px 0}
.rv-text h2{margin-top:32px;margin-bottom:10px;font-size:22px}.rv-text h2:first-child{margin-top:0}
.rv-text p{color:var(--muted)}
.rv-text ul,.rv-text ol{color:var(--muted);padding-left:20px;margin-bottom:16px}
.rv-text li{margin-bottom:6px}
.rv-side{position:sticky;top:84px}
.rv-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r);padding:24px;box-shadow:var(--shadow)}

.pro-con{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0}
.pro{background:var(--green-light);border:1px solid #BBF7D0;padding:20px;border-radius:var(--r-sm)}
.con{background:var(--red-light);border:1px solid #FECACA;padding:20px;border-radius:var(--r-sm)}
.pro h4{color:var(--green);font-size:13px;font-weight:700;margin-bottom:8px}.con h4{color:var(--red);font-size:13px;font-weight:700;margin-bottom:8px}
.pro ul,.con ul{list-style:none}.pro li,.con li{font-size:13px;padding:3px 0}
.pro li{color:#166534}.con li{color:#991B1B}

.info-tbl{width:100%;border-collapse:collapse;margin:20px 0}
.info-tbl th,.info-tbl td{padding:10px 14px;text-align:left;border-bottom:1px solid var(--border);font-size:13px}
.info-tbl th{color:var(--dim);font-weight:600;width:40%;background:var(--warm-50)}
.info-tbl td{color:var(--ink)}

@media(max-width:768px){.rv-body{grid-template-columns:1fr}.rv-side{position:static}.rv-hero-inner{flex-direction:column;align-items:flex-start}.pro-con{grid-template-columns:1fr}}

/* ── Breadcrumbs ── */
.crumbs{padding:12px 0;font-size:13px;color:var(--dim);background:var(--white);border-bottom:1px solid var(--border-light)}
.crumbs a{color:var(--dim)}.crumbs a:hover{color:var(--green)}
.crumbs span{margin:0 6px}

/* ── Risk strip ── */
.risk-strip{background:var(--red-light);border-top:1px solid #FECACA;padding:14px 0}
.risk-strip p{font-size:12px;color:#991B1B;margin:0;text-align:center}
.risk-strip i{color:var(--red);margin-right:4px}

/* ── Regulator strip ── */
.reg-strip{display:flex;justify-content:center;gap:20px;align-items:center;padding:28px 0;background:var(--cream);border-bottom:1px solid var(--border)}
.reg-strip a{display:flex;align-items:center;justify-content:center;width:110px;height:52px;padding:10px 16px;border-radius:var(--r-sm);transition:all var(--ease)}
.reg-strip a:hover{background:var(--warm-100)}
.reg-strip img{max-height:36px;max-width:90px;width:auto;height:auto;object-fit:contain;filter:grayscale(100%);opacity:.5;transition:all var(--ease)}
.reg-strip a:hover img{opacity:1;filter:none}

/* ── Footer ── */
.ft{background:var(--ink);color:var(--dim);padding:48px 0 0}
.ft-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:32px;padding-bottom:32px}
.ft-brand p{font-size:13px;line-height:1.6;margin-top:12px;color:var(--dim)}
.ft-col h4{font-family:var(--sans);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--dim);margin-bottom:12px}
.ft-col a{display:block;font-size:13px;color:rgba(255,255,255,.5);margin-bottom:8px;transition:color var(--ease)}.ft-col a:hover{color:var(--white)}
.ft-bottom{border-top:1px solid rgba(255,255,255,.08);padding:18px 0;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-size:12px;color:var(--dim)}
.ft-bottom a{color:rgba(255,255,255,.4)}.ft-bottom a:hover{color:var(--white)}
.ft-18{background:var(--red);color:var(--white);font-size:9px;font-weight:700;padding:2px 6px;border-radius:3px;margin-right:6px}
@media(max-width:768px){.ft-grid{grid-template-columns:1fr 1fr;gap:24px}}
@media(max-width:480px){.ft-grid{grid-template-columns:1fr}.ft-bottom{flex-direction:column;text-align:center}}

/* ── Cookie ── */
.ck{position:fixed;bottom:0;left:0;right:0;background:var(--white);border-top:1px solid var(--border);box-shadow:0 -4px 20px rgba(0,0,0,.06);z-index:10000;padding:16px 0}
.ck-row{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.ck p{font-size:13px;color:var(--muted);margin:0}.ck a{color:var(--green)}
.ck-btns{display:flex;gap:8px;flex-shrink:0}
.ck-prefs{padding:10px 0;border-top:1px solid var(--border)}
.ck-prefs label{display:inline-block;padding:4px 12px;font-size:13px;color:var(--muted);cursor:pointer}
.ck-prefs input{accent-color:var(--green);margin-right:4px}
.ck-reopen{position:fixed;bottom:20px;left:20px;width:40px;height:40px;background:var(--white);color:var(--green);border:1px solid var(--border);border-radius:50%;font-size:14px;cursor:pointer;z-index:9999;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow);transition:all var(--ease)}.ck-reopen:hover{box-shadow:var(--shadow-md);transform:scale(1.1)}

/* ── Cards (generic) ── */
.card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{background:var(--white);border:1px solid var(--border);border-radius:var(--r);padding:24px;box-shadow:var(--shadow-sm);transition:all var(--ease)}
.card:hover{box-shadow:var(--shadow-md);border-color:var(--green)}
.card-icon{width:40px;height:40px;background:var(--green-light);border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;color:var(--green);font-size:16px;margin-bottom:14px}
.card h4{font-size:15px;margin-bottom:4px}
.card p{font-size:13px;margin:0;color:var(--muted)}
@media(max-width:768px){.card-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.card-grid{grid-template-columns:1fr}}

/* ── Legal ── */
.legal-block{padding-bottom:24px;margin-bottom:24px;border-bottom:1px solid var(--border)}
.legal-block:last-of-type{border:none}
.legal-block h2{font-size:18px;margin-bottom:8px;display:flex;align-items:center;gap:10px}
.legal-block h2 i{color:var(--green);font-size:16px}
.legal-block p{color:var(--muted);margin-bottom:8px;font-size:15px}
.legal-block ul{color:var(--muted);padding-left:20px;margin-bottom:8px;font-size:14px}
.legal-block li{margin-bottom:4px}

/* ── Utils ── */
.text-center{text-align:center}
.divider{width:48px;height:3px;background:var(--green);border-radius:2px;margin:16px 0}
.divider-center{margin-left:auto;margin-right:auto}
