:root {color-scheme:dark;--bg:#050a12;--surface:#0c1724;--ink:#f1f6fa;--muted:#b4c4d4;--line:#29404e;--cyan:#60e4f6;--mint:#7fe7c4;--font:"Avenir Next","Trebuchet MS",Arial,sans-serif}
* {box-sizing:border-box}
body {margin:0;background:var(--bg);color:var(--ink);font:1.06rem/1.7 var(--font);overflow-wrap:anywhere}
.wrap {width:min(72rem,calc(100% - 3rem));margin-inline:auto}
a {color:var(--cyan);text-underline-offset:.2em}
a:hover {text-decoration:underline}
a:focus-visible {outline:3px solid var(--mint);outline-offset:4px}
.skip {position:absolute;top:-6rem;left:1rem;background:var(--bg);padding:.6rem;z-index:2}
.skip:focus {top:.5rem}
header,footer {border-block:1px solid var(--line)}
.bar,.lang,.brand,.actions {display:flex;align-items:center;gap:.7rem;flex-wrap:wrap}
.bar {justify-content:space-between;min-height:4.5rem;padding-block:.6rem}
.brand {color:var(--ink);font-size:1.3rem;letter-spacing:-.04em;text-decoration:none;font-weight:750}
.brand img {object-fit:contain}
.lang {gap:.15rem;border-radius:3rem;border:1px solid var(--line);padding:.2rem;background:var(--surface)}
.lang a {text-decoration:none;color:var(--muted);font-size:.86rem;padding:.45rem .9rem;border-radius:2rem}
.lang [aria-current] {color:var(--bg);background:var(--cyan);font-weight:bold}
.hero {padding:clamp(2.8rem,7vw,6rem) 0 2rem;border-bottom:1px solid var(--line);background:radial-gradient(ellipse at 96% 95%,#103642 0,transparent 55%),var(--surface)}
.eyebrow,.num {font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;font-weight:bold;color:var(--mint)}
.eyebrow span {display:inline-block;width:2rem;border-top:2px solid var(--mint);vertical-align:middle;margin-right:.65rem}
h1,h2 {text-wrap:balance;line-height:1.1;letter-spacing:-.045em}
h1 {font-size:clamp(2.7rem,7vw,5.5rem);margin:.7rem 0}
.lead {max-width:43rem;color:var(--muted);font-size:clamp(1.15rem,2vw,1.45rem);line-height:1.5}
.actions {gap:1rem 1.6rem;margin-block:1.7rem}
.action {display:inline-block;background:var(--cyan);color:var(--bg);padding:.7rem 1.1rem;border-radius:.8rem;text-decoration:none;font-weight:700}
.plain,footer a {font-size:.95rem}
.date {color:var(--muted);font-size:.84rem;margin:0}
.layout {display:grid;grid-template-columns:minmax(12rem,15rem) minmax(0,44rem);gap:clamp(2rem,7vw,7rem);padding-block:3rem;align-items:start}
.outline {padding-right:1.2rem;border-right:1px solid var(--line)}
.outline ol {padding-left:1.5rem;list-style:decimal-leading-zero}
.outline li {padding-block:.25rem;font-size:.94rem}
.outline li::marker {color:var(--mint);font-size:.7rem}
.outline a {color:var(--muted)}
section {border-bottom:1px solid var(--line);padding:2.2rem 0;scroll-margin-top:1rem}
section:first-child {padding-top:0}
.num {margin:0;color:var(--cyan)}
h2 {font-size:clamp(1.65rem,3vw,2.35rem);margin:.4rem 0 1rem}
article p {color:var(--muted);margin:.85rem 0}
article b {color:var(--ink)}
.tail {font-size:.9rem}
@media(max-width:52rem){.layout{display:block}.outline{border:0;border-bottom:1px solid var(--line);padding:0 0 1rem;margin:0 0 2rem}.outline ol{columns:2 13rem}.outline li{break-inside:avoid}}
@media(max-width:32rem){.wrap{width:calc(100% - 2rem)}.brand{font-size:1.08rem}.lang a{padding:.4rem .65rem}.layout{padding-block:1.6rem}}
