
:root{
  --ink:#0b1426; --ink-2:#17233a; --paper:#f7f8fb; --white:#fff;
  --line:#dfe4ec; --muted:#5b667a; --accent:#6d5dfc; --accent-2:#18b89a;
  --warn:#fff6dd; --radius:18px; --shadow:0 18px 50px rgba(11,20,38,.08);
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--white);line-height:1.68}
a{color:#4737db;text-decoration-thickness:1px;text-underline-offset:3px}
img{max-width:100%}.wrap{width:min(1140px,calc(100% - 36px));margin:auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:70px;gap:24px}
.brand{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none;font-weight:850;letter-spacing:-.02em}
.mark{width:34px;height:34px;border-radius:11px;background:linear-gradient(135deg,var(--accent),#9489ff 55%,var(--accent-2));display:grid;place-items:center;color:white;font-weight:900;box-shadow:0 7px 18px rgba(109,93,252,.23)}
.links{display:flex;align-items:center;gap:20px}.links a{color:var(--ink-2);text-decoration:none;font-weight:650;font-size:.95rem}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;padding:12px 17px;font-weight:800;text-decoration:none;border:1px solid transparent;transition:.2s ease}
.btn:hover{transform:translateY(-1px)}.btn-primary{background:var(--ink);color:white}.btn-accent{background:var(--accent);color:white}.btn-outline{border-color:var(--line);color:var(--ink);background:white}
.menu{display:none;border:0;background:transparent;font-size:1.45rem}
.hero{background:radial-gradient(circle at 80% 0%,rgba(109,93,252,.14),transparent 34%),linear-gradient(180deg,#fbfbfe,#fff);padding:78px 0 68px;border-bottom:1px solid var(--line)}
.eyebrow{display:inline-block;text-transform:uppercase;letter-spacing:.13em;font-size:.76rem;font-weight:850;color:#4f43d4;margin-bottom:13px}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:52px}
h1{font-size:clamp(2.45rem,5vw,5rem);line-height:1.01;letter-spacing:-.055em;margin:.05em 0 .28em}
h2{font-size:clamp(1.65rem,3vw,2.55rem);line-height:1.15;letter-spacing:-.035em;margin:1.4em 0 .45em}
h3{font-size:1.18rem;line-height:1.3;margin:1.35em 0 .35em}
.lede{font-size:1.16rem;color:var(--muted);max-width:760px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.hero-card{background:var(--ink);color:white;border-radius:26px;padding:28px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.hero-card:after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;background:rgba(109,93,252,.28);right:-70px;top:-70px}
.hero-card h3{font-size:1.45rem;margin-top:0}.hero-card p{color:#c7d0df}.metric{display:flex;justify-content:space-between;gap:20px;padding:13px 0;border-top:1px solid rgba(255,255,255,.13)}
.metric strong{color:white}.metric span{color:#c7d0df}
.section{padding:64px 0}.section.alt{background:var(--paper)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.card{border:1px solid var(--line);border-radius:var(--radius);padding:24px;background:white;box-shadow:0 8px 22px rgba(11,20,38,.035)}
.card h3{margin-top:0}.card p:last-child{margin-bottom:0}.card-link{display:inline-block;font-weight:800;margin-top:8px}
.kicker{font-size:.82rem;font-weight:850;color:#4f43d4;text-transform:uppercase;letter-spacing:.08em}
.article-shell{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:46px;align-items:start}
.article{max-width:790px}.article p,.article li{font-size:1.03rem}.article ul,.article ol{padding-left:1.3rem}
.breadcrumbs{font-size:.88rem;color:var(--muted);padding-top:22px}.breadcrumbs a{color:var(--muted)}
.article-hero{padding:34px 0 18px}.article-hero h1{font-size:clamp(2.25rem,5vw,4.2rem);max-width:900px}
.meta{display:flex;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:.9rem}.pill{display:inline-flex;background:#efedff;color:#4737db;border-radius:999px;padding:5px 9px;font-size:.8rem;font-weight:800}
.callout{border:1px solid #d9d5ff;border-left:4px solid var(--accent);background:#faf9ff;padding:18px 20px;border-radius:12px;margin:25px 0}
.disclosure{background:var(--warn);border:1px solid #f0d98e;border-radius:12px;padding:15px 17px;font-size:.91rem;margin:22px 0}
.sidebar{position:sticky;top:92px}.sidebox{border:1px solid var(--line);border-radius:16px;padding:19px;background:#fff;box-shadow:var(--shadow)}.sidebox .btn{width:100%}.sidebox small{display:block;color:var(--muted);margin-top:10px}
.toc{margin-top:16px;border-top:1px solid var(--line);padding-top:14px}.toc a{display:block;color:var(--ink-2);text-decoration:none;padding:5px 0;font-size:.91rem}
table{width:100%;border-collapse:separate;border-spacing:0;margin:24px 0;border:1px solid var(--line);border-radius:14px;overflow:hidden;font-size:.94rem}
th,td{text-align:left;padding:13px 14px;border-bottom:1px solid var(--line);vertical-align:top}tr:last-child td{border-bottom:0}th{background:#f5f6fa}
.verdict{background:var(--ink);color:white;border-radius:20px;padding:24px;margin:30px 0}.verdict p{color:#d0d6e2}.verdict a{color:white}
.source-note{font-size:.88rem;color:var(--muted);border-top:1px solid var(--line);padding-top:18px;margin-top:34px}
.faq details{border-top:1px solid var(--line);padding:15px 0}.faq summary{font-weight:800;cursor:pointer}
.footer{background:var(--ink);color:#dbe2ef;padding:48px 0 32px;margin-top:72px}.footer a{color:#fff}.footer-grid{display:grid;grid-template-columns:1.3fr .7fr .7fr;gap:32px}.footer small{color:#97a4ba}
.sticky-aff{display:none}
.badge-row{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.badge{border:1px solid var(--line);padding:7px 10px;border-radius:999px;font-size:.82rem;font-weight:750;color:var(--ink-2)}
@media(max-width:860px){
  .hero-grid,.article-shell,.footer-grid,.grid-3,.grid-2{grid-template-columns:1fr}
  .links{display:none;position:absolute;top:70px;left:0;right:0;background:white;padding:18px 22px;border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start}
  .links.open{display:flex}.menu{display:block}.sidebar{display:none}.hero{padding-top:54px}
  .sticky-aff{display:flex;position:fixed;bottom:12px;left:12px;right:12px;z-index:60;box-shadow:0 12px 30px rgba(11,20,38,.25)}
  .sticky-aff .btn{width:100%;padding:14px 18px}
  body{padding-bottom:72px}
}


.category-links{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:26px}
.category-link{border:1px solid var(--line);border-radius:14px;padding:14px 16px;background:#fff;text-decoration:none;color:var(--ink);font-weight:800}
.category-link span{display:block;color:var(--muted);font-weight:500;font-size:.84rem;margin-top:3px}
.inline-cta{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 22px;border:1px solid #d9d5ff;background:#f7f5ff;border-radius:16px;margin:28px 0}
.inline-cta p{margin:4px 0 0!important;color:var(--muted)}.inline-cta .btn{flex:0 0 auto}
.checklist{list-style:none!important;padding-left:0!important}.checklist li{padding:7px 0 7px 30px;position:relative}.checklist li:before{content:"✓";position:absolute;left:0;top:7px;font-weight:900;color:var(--accent-2)}
.hub-intro{max-width:800px}.related{margin-top:38px;padding-top:25px;border-top:1px solid var(--line)}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.related a{display:block;border:1px solid var(--line);border-radius:12px;padding:13px;text-decoration:none;color:var(--ink);font-weight:750;background:white}
.note{font-size:.91rem;color:var(--muted)}.legal-note{border:1px solid var(--line);background:var(--paper);padding:16px 18px;border-radius:12px;margin:22px 0}
@media(max-width:860px){.category-links,.related-grid{grid-template-columns:1fr 1fr}.inline-cta{align-items:flex-start;flex-direction:column}}
@media(max-width:520px){.category-links,.related-grid{grid-template-columns:1fr}}


/* Header CTA contrast: .links a is more specific than .btn-primary. */
.links a.btn-primary,
.links a.btn-primary:visited,
.links a.btn-primary:hover,
.links a.btn-primary:focus {
  color: #fff;
}
