@font-face{font-family:Public;src:url('/assets/PublicSans-Variable.woff') format('woff');font-display:swap;font-weight:100 900}
@font-face{font-family:Literata;src:url('/assets/Literata-Variable.woff') format('woff');font-display:swap;font-weight:200 900}
@font-face{font-family:Plex;src:url('/assets/IBMPlexMono-Regular.woff') format('woff');font-display:swap;font-weight:400}
:root{color-scheme:light;--paper:#f4f5f6;--ink:#17243b;--muted:#536075;--line:#cdd3dc;--accent:#236c47;--surface:#e5e9ee;--white:#fff;--measure:1160px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:28px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Public,system-ui,sans-serif;line-height:1.65;font-size:17px}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:5px}
a:hover{color:var(--accent)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:6px}
button,summary{cursor:pointer}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,p{margin:0}
h1,h2{font-family:Literata,Georgia,serif;font-weight:480;letter-spacing:-.055em;line-height:1.12}
h1{font-size:clamp(52px,5.7vw,76px)}
h2{font-size:clamp(35px,4vw,52px)}
h3{font-size:20px;line-height:1.3}
p+p{margin-top:16px}
.wrap{width:min(var(--measure),calc(100% - 64px));margin-inline:auto}
.skip{position:absolute;left:16px;top:-70px;z-index:10;background:var(--white);padding:12px}
.skip:focus{top:12px}
.nav{height:88px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:24px}
.brand{display:flex;align-items:center;gap:13px;text-decoration:none;font-size:22px;font-weight:650;letter-spacing:-.04em}
.brand img{width:38px;border-radius:9px}
.nav nav{display:flex;gap:28px;font-size:14px}
.nav nav a{text-decoration:none;padding-block:12px}
.hero{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:40px;padding:36px 0 56px}
.eyebrow{font-family:Plex,monospace;font-size:13px;letter-spacing:.04em;color:var(--muted);margin-bottom:20px}
.hero-intro{margin-top:25px}
.hero-intro p{font-size:19px;color:var(--muted);max-width:370px}
.hero-intro .action{margin-top:26px}
.action{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:10px 24px;background:var(--ink);color:var(--white);border-radius:5px;font-size:15px;font-weight:600;text-decoration:none;transition:background .16s}
.action:hover{background:var(--accent);color:var(--white)}
/* Both panels show the actual inner-display capture. Perspective illustrates laptop mode. */
.laptop-stage{--panel: min(61vw,660px);--bezel:calc(var(--panel)*.015);position:relative;display:grid;place-items:start center;height:calc(var(--panel)*1.21 + 56px);margin:36px 0 0;perspective:calc(var(--panel)*3.8)}
.hero-laptop{--panel:min(36vw,420px);margin:0}
.laptop-model{width:var(--panel);height:calc(var(--panel)*1.42);position:relative;transform-style:preserve-3d;transform:rotateY(-12deg) rotateZ(-2deg)}
.laptop-lid,.laptop-base{position:absolute;width:100%;height:calc(var(--panel)*.710762);overflow:hidden;background:#22262b;backface-visibility:hidden}
.laptop-lid{top:0;border-radius:28px 28px 0 0;transform-origin:center bottom;transform:rotateX(-8deg);box-shadow:0 0 0 var(--bezel) #22262b,1px -3px 0 var(--bezel) #92979c}
.laptop-base{top:calc(var(--panel)*.710762);border-radius:0 0 28px 28px;transform-origin:center top;transform:rotateX(56deg);box-shadow:0 0 0 var(--bezel) #22262b,0 9px 0 var(--bezel) #8b9097,0 25px 30px #17243b2b}
.laptop-lid img,.laptop-base img{width:100%;height:auto;max-width:none}
.laptop-lid img{border-radius:20px 20px 0 0}
.laptop-base img{transform:translateY(-50%);border-radius:0 0 20px 20px}
.laptop-stage figcaption{position:absolute;bottom:0;left:0;right:0;text-align:center;font-family:Plex,monospace;font-size:12px;color:var(--muted)}
.section{padding:76px 0;border-top:1px solid var(--line)}
.intro{max-width:690px}
.intro p{color:var(--muted);max-width:540px;margin-top:20px}
.theme-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:28px 0 22px}
.theme-tabs button{font-family:Plex,monospace;font-size:13px;min-height:44px;padding:10px 18px;border:1px solid var(--line);border-radius:4px;background:transparent;color:var(--ink)}
.theme-tabs button[aria-pressed=true]{background:var(--ink);color:var(--white);border-color:var(--ink)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:100px}
.split h2{max-width:430px}
.details{display:grid;gap:30px}
.details p{margin-top:10px;color:var(--muted)}
.privacy-strip{display:grid;grid-template-columns:1fr 1fr;gap:100px}
.privacy-strip p{color:var(--muted);margin:14px 0 20px}
.footer{padding:28px 0 38px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:25px;font-family:Plex,monospace;font-size:12px;color:var(--muted)}
.footer-links{display:flex;flex-wrap:wrap;gap:24px}
.document{max-width:760px;margin:64px auto 100px}
.document h1{font-size:clamp(42px,5vw,64px);margin-bottom:22px}
.document .lead{font-size:20px;color:var(--muted);margin-bottom:32px}
.document h2{font-family:Public,system-ui,sans-serif;letter-spacing:-.025em;font-size:25px;line-height:1.3;margin-top:42px;margin-bottom:14px}
.document ul{padding-left:24px}
.document li+li{margin-top:10px}
.document .updated{font-family:Plex,monospace;font-size:12px;color:var(--muted);margin-bottom:36px}
.contact{background:var(--surface);padding:28px 32px;border-radius:5px;margin-top:32px}
.contact p{margin:12px 0 18px}
.contact .email{font-size:clamp(16px,3vw,22px);overflow-wrap:anywhere}
details{border-bottom:1px solid var(--line);padding:19px 0}
summary{font-size:18px;font-weight:600;padding:6px 0;min-height:44px}
details p{padding:10px 0 12px;color:var(--muted)}
[hidden]{display:none!important}
@media(max-width:760px){
 .wrap{width:calc(100% - 40px)}.nav{height:76px}.nav nav{gap:18px}
 .hero{grid-template-columns:1fr;gap:24px;padding:36px 0 42px}.hero h1{font-size:clamp(50px,9vw,70px)}
 .hero-intro p{font-size:17px;line-height:1.55;max-width:480px}.eyebrow{margin-bottom:16px}
 .laptop-stage{--panel: min(68vw,500px);height:calc(var(--panel)*1.24 + 60px);margin-top:24px}
 .laptop-stage figcaption{font-size:11px;max-width:300px;margin:auto}
 .laptop-lid{border-radius:17px 17px 0 0}.laptop-base{border-radius:0 0 17px 17px}
 .section{padding:50px 0}.split,.privacy-strip{grid-template-columns:1fr;gap:30px}
 .document{margin:44px auto 72px}.footer{flex-direction:column}.contact{padding:24px}
 .brand{font-size:20px;gap:9px}.brand img{width:32px}.theme-tabs button{padding:9px 13px}
}
@media(max-width:520px){.hero h1{font-size:56px}.nav nav{font-size:13px}.brand{font-size:18px}.theme-tabs{gap:6px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}