
:root{--bg:#f5f7fb;--surface:#fff;--ink:#172033;--muted:#5d687a;--line:#dde3ec;--accent:#2857d9;--accent2:#173a9e;--soft:#eef3ff;--good:#ebf8ef;--warn:#fff7e2;--dark:#101827;--max:1160px;--radius:18px;--shadow:0 14px 38px rgba(23,32,51,.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(--bg);line-height:1.68}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.wrap{width:min(var(--max),calc(100% - 36px));margin:auto}.topbar{background:var(--dark);color:#d9e0eb;font-size:.86rem}.topbar .wrap{padding:9px 0;text-align:center}.site-header{background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50;backdrop-filter:blur(10px)}.nav{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{font-weight:850;font-size:1.16rem;color:var(--ink);letter-spacing:-.025em}.brand span{display:block;font-size:.68rem;color:var(--muted);font-weight:650;letter-spacing:.02em}.navlinks{display:flex;align-items:center;gap:19px;font-size:.94rem}.navlinks a{color:var(--ink);font-weight:700}.menu-btn{display:none;background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 11px;font-size:1rem}.hero{padding:76px 0 58px;background:linear-gradient(180deg,#fff 0%,#f5f7fb 100%)}.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:48px;align-items:center}.eyebrow,.tag,.pill{display:inline-flex;align-items:center;border-radius:999px;font-size:.78rem;font-weight:850;letter-spacing:.045em;text-transform:uppercase}.eyebrow{background:var(--soft);color:var(--accent2);padding:7px 11px}.tag{color:var(--accent2);margin-bottom:8px}.pill{background:#fff;border:1px solid var(--line);color:var(--muted);padding:5px 9px}.hero h1,.prose h1{font-size:clamp(2.45rem,5vw,4.3rem);line-height:1.04;letter-spacing:-.052em;margin:18px 0}.hero p,.lead{font-size:1.12rem;color:var(--muted);max-width:780px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:27px 0}.btn{display:inline-flex;justify-content:center;align-items:center;border-radius:11px;padding:12px 17px;font-weight:800;border:1px solid var(--accent);background:var(--accent);color:#fff}.btn:hover{background:var(--accent2);text-decoration:none}.btn.secondary{background:#fff;color:var(--ink);border-color:var(--line)}.btn.secondary:hover{background:#f8fafc}.panel,.card,.hero-card,.legal-box,.toc,.callout{background:#fff;border:1px solid var(--line);border-radius:var(--radius)}.hero-card{box-shadow:var(--shadow);padding:26px}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.metric{border:1px solid var(--line);border-radius:14px;padding:17px;background:#fff}.metric b{display:block;font-size:1.08rem}.metric span{font-size:.88rem;color:var(--muted)}.notice{border:1px solid #cbd5e1;border-left:4px solid var(--accent);background:#fff;padding:15px 17px;border-radius:12px;margin:21px 0}.section{padding:64px 0}.section.alt{background:#fff}.section h2{font-size:clamp(1.8rem,3vw,2.55rem);letter-spacing:-.035em;margin:0 0 12px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}.card{padding:22px;box-shadow:0 7px 22px rgba(23,32,51,.035)}.card h3{margin:0 0 8px;font-size:1.18rem}.card p{color:var(--muted);margin:0 0 14px}.card .meta{font-size:.82rem;color:var(--muted);margin-top:12px}.split{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:start}.prose{max-width:860px;padding-bottom:30px}.prose h1{font-size:clamp(2.25rem,4.8vw,3.75rem)}.prose h2{margin-top:42px;font-size:1.72rem;letter-spacing:-.025em}.prose h3{margin-top:29px;font-size:1.22rem}.prose p,.prose li{color:#334155}.prose ul,.prose ol{padding-left:1.35rem}.prose li{margin:6px 0}.prose table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;margin:22px 0}.prose th,.prose td{padding:12px 13px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.prose th{background:#f8fafc;font-size:.91rem}.prose tr:last-child td{border-bottom:0}.breadcrumbs{font-size:.9rem;color:var(--muted);margin-top:28px}.breadcrumbs a{color:var(--muted)}.toc{padding:20px;margin:24px 0}.toc b{display:block;margin-bottom:8px}.toc a{display:block;padding:4px 0}.callout{padding:17px 19px;margin:22px 0;background:var(--soft);border-color:#d8e1ff}.callout.warn{background:var(--warn);border-color:#efdba8}.callout.good{background:var(--good);border-color:#c9e9d3}.sourcebox{background:#f8fafc;border:1px solid var(--line);border-radius:14px;padding:18px;margin:26px 0}.sourcebox p{margin:5px 0}.article-meta{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 18px}.faq{border-top:1px solid var(--line);margin-top:24px}.faq details{padding:15px 0;border-bottom:1px solid var(--line)}.faq summary{font-weight:800;cursor:pointer}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.checklist li{margin-bottom:9px}.ad-hero{padding:58px 0 32px;background:#fff}.ad-proof{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:24px 0}.ad-proof .panel{padding:18px}.ad-proof b{display:block}.ad-proof span{color:var(--muted);font-size:.9rem}.footer{background:var(--dark);color:#dbe1eb;margin-top:58px}.footer .wrap{padding:44px 0}.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:30px}.footer h3{color:#fff;margin-top:0}.footer a{color:#dbe1eb}.footer small{color:#a6b1c2}.footer-bottom{border-top:1px solid #2b3443;margin-top:28px;padding-top:18px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}.prelaunch{background:#fff2f2;border:2px solid #d33;color:#6f1515;padding:18px;border-radius:14px;margin:24px 0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:900px){.hero-grid,.split{grid-template-columns:1fr}.cards{grid-template-columns:1fr 1fr}.navlinks{display:none;position:absolute;left:18px;right:18px;top:73px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:var(--shadow);flex-direction:column;align-items:flex-start}.navlinks.open{display:flex}.menu-btn{display:block}.footer-grid{grid-template-columns:1fr 1fr}.ad-proof{grid-template-columns:1fr}}
@media(max-width:600px){.cards,.metric-grid,.footer-grid,.grid2{grid-template-columns:1fr}.wrap{width:min(var(--max),calc(100% - 24px))}.hero{padding-top:50px}.hero h1,.prose h1{font-size:2.5rem}.section{padding:48px 0}.prose table{display:block;overflow-x:auto;font-size:.9rem}.topbar .wrap{font-size:.77rem}}

.byline{font-size:.92rem;color:var(--muted,#5c6573);margin:.35rem 0 1.35rem}.byline b{color:inherit}


.hero-visual,.guide-cover,.visual-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.hero-visual{padding:16px}
.hero-visual img,.guide-cover img,.visual-card img{display:block;width:100%;height:auto;border-radius:14px}
.hero-visual .caption,.guide-cover figcaption{font-size:.92rem;color:var(--muted);margin-top:10px}
.hero-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.hero-kpis div{border:1px solid var(--line);border-radius:12px;padding:12px;background:#f8fafc}
.hero-kpis b{display:block;font-size:1.05rem;color:var(--ink)}
.hero-kpis span{font-size:.86rem;color:var(--muted)}
.visual-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}
.visual-card{overflow:hidden}
.visual-card img{aspect-ratio:3/2;object-fit:cover;border-radius:0}
.visual-card .body{padding:18px}
.visual-card h3{margin:0 0 8px;font-size:1.15rem}
.visual-card p{margin:0 0 14px;color:var(--muted)}
.guide-cover{padding:10px;margin:20px 0 26px}
.guide-cover img{border-radius:12px}
.prose .guide-cover{max-width:100%}
@media(max-width:900px){.visual-grid,.hero-kpis{grid-template-columns:1fr}}


/* Production interaction, accessibility and responsive polish */
@view-transition{navigation:auto}
::view-transition-old(root){animation:dmgFadeOut .16s ease both}
::view-transition-new(root){animation:dmgFadeIn .28s ease both}
@keyframes dmgFadeOut{to{opacity:.72;transform:translateY(-2px)}}
@keyframes dmgFadeIn{from{opacity:.72;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes dmgEnter{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.skip-link{position:fixed;left:16px;top:10px;z-index:1000;background:#fff;color:var(--ink);border:2px solid var(--accent);border-radius:10px;padding:10px 14px;font-weight:800;transform:translateY(-160%);transition:transform .18s ease;box-shadow:var(--shadow)}
.skip-link:focus{transform:translateY(0)}
:focus-visible{outline:3px solid rgba(40,87,217,.38);outline-offset:3px;border-radius:5px}
.btn,.card,.visual-card,.metric,.hero-visual,.legal-box,.navlinks a{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background-color .22s ease,color .22s ease,opacity .22s ease}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(40,87,217,.18)}
.card:hover,.visual-card:hover{transform:translateY(-5px);box-shadow:0 16px 38px rgba(23,32,51,.10);border-color:#c8d3e3;text-decoration:none}
.metric:hover{transform:translateY(-2px);border-color:#c8d3e3}
.hero-visual{overflow:hidden;background:linear-gradient(145deg,#fff,#f7faff)}
.hero-visual img{transition:transform .55s cubic-bezier(.2,.75,.2,1)}
.hero-visual:hover img{transform:scale(1.018)}
.visual-card{position:relative}
.visual-card img{transition:transform .5s cubic-bezier(.2,.75,.2,1),filter .3s ease}
.visual-card:hover img{transform:scale(1.025);filter:saturate(1.04)}
.navlinks a{position:relative;padding:10px 2px;min-height:44px;display:inline-flex;align-items:center}
.navlinks a::after{content:"";position:absolute;left:2px;right:2px;bottom:6px;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .22s ease;border-radius:99px}
.navlinks a:hover{text-decoration:none;color:var(--accent2)}
.navlinks a:hover::after,.navlinks a:focus-visible::after{transform:scaleX(1)}
.menu-btn{min-width:48px;min-height:44px;font-weight:750;color:var(--ink)}
img{max-width:100%}
.enter{animation:dmgEnter .58s cubic-bezier(.2,.75,.2,1) both}
.cards.enter{animation-delay:.04s}.visual-grid.enter{animation-delay:.08s}.prose.enter{animation-delay:.03s}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 82% 16%,rgba(40,87,217,.09),transparent 30%),radial-gradient(circle at 12% 18%,rgba(25,183,199,.06),transparent 24%)}
.hero{position:relative;overflow:hidden}
.hero>.wrap{position:relative;z-index:1}
.card a,.visual-card a{font-weight:800}
.footer a{display:inline-block;padding:3px 0}
@media(max-width:900px){
  .nav{min-height:66px}.brand{font-size:1.05rem}.brand span{font-size:.63rem}
  .navlinks{max-height:calc(100vh - 96px);overflow:auto}
  .navlinks a{width:100%;padding:11px 8px;border-radius:8px}
  .hero-grid{gap:30px}.hero-visual{max-width:720px;margin:0 auto}
}
@media(max-width:600px){
  body{line-height:1.62}.topbar .wrap{padding:7px 0}.site-header{position:sticky}
  .hero{padding:42px 0 38px}.hero h1,.prose h1{font-size:clamp(2.1rem,10vw,2.7rem);line-height:1.06}
  .hero p,.lead{font-size:1.02rem}.actions{gap:10px}.actions .btn{width:100%}
  .hero-visual{padding:9px;border-radius:15px}.hero-visual img{border-radius:10px}.hero-visual .caption{font-size:.84rem}
  .section{padding:42px 0}.section h2{font-size:1.75rem}.card{padding:19px}
  .nav{gap:10px}.brand{max-width:220px}.navlinks{left:12px;right:12px;top:68px}
  .prose{font-size:1rem}.toc{padding:17px}.article-meta{gap:7px}.pill{font-size:.69rem}
  .guide-cover{margin:16px -2px 22px;padding:7px}.footer{margin-top:42px}.footer .wrap{padding:36px 0}
}
@media(max-width:380px){.brand span{display:none}.hero h1,.prose h1{font-size:2rem}.wrap{width:calc(100% - 20px)}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}.hero-visual:hover img,.visual-card:hover img,.card:hover,.visual-card:hover,.btn:hover{transform:none!important}
}
