:root{
  --bg:#0B0F14; --surface:#141A22; --line:rgba(255,255,255,.08);
  --text:#E6EDF3; --muted:#8B98A8; --accent:#4C7DFF; --accent-ink:#0B1020;
  --sp-1:8px; --sp-2:16px; --sp-3:24px; --sp-4:32px; --sp-6:48px; --sp-8:64px; --sp-12:96px;
  --r-card:16px; --r-btn:10px;
  --display:"Space Grotesk",Inter,system-ui,sans-serif;
  --body:Inter,system-ui,-apple-system,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,monospace;
  --ease:cubic-bezier(.22,1,.36,1);
  --maxw:1080px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--text);
  font:400 17px/1.6 var(--body);
  -webkit-font-smoothing:antialiased;
  background-image:radial-gradient(900px 500px at 78% -8%,rgba(76,125,255,.16),transparent 62%);
  background-repeat:no-repeat;
}
h1,h2,h3,.brand,.card-kicker,.t-date{font-family:var(--display);letter-spacing:-.02em;margin:0}
h1{font-size:clamp(2.1rem,5.4vw,3.4rem);line-height:1.08;font-weight:700}
h1 em{font-style:normal;color:var(--accent)}
h2{font-size:clamp(1.35rem,2.6vw,1.75rem);line-height:1.2;margin-bottom:var(--sp-4)}
h3{font-size:1.13rem;line-height:1.3;margin-bottom:var(--sp-1)}
p{margin:0 0 var(--sp-2)}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}

main,header,footer{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--sp-3)}
section{padding-block:var(--sp-12);scroll-margin-top:88px;border-top:1px solid var(--line)}
ul,ol{list-style:none;margin:0;padding:0}

.progress{position:fixed;inset:0 auto auto 0;height:2px;width:0;background:var(--accent);z-index:20;
  transition:width 80ms linear}

.site-head{position:sticky;top:0;z-index:15;display:flex;align-items:center;justify-content:space-between;
  gap:var(--sp-2);padding-block:var(--sp-2);background:rgba(11,15,20,.78);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);max-width:none}
.site-head>*{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--sp-3)}
.brand{font-weight:700;text-decoration:none;font-size:.95rem;letter-spacing:.08em}
.brand-full{margin-left:var(--sp-1);color:var(--muted);font-weight:500;letter-spacing:0}
.nav{display:flex;gap:var(--sp-3);font-size:.93rem}
.nav a{text-decoration:none;color:var(--muted);transition:color 180ms var(--ease)}
.nav a:hover,.nav a:focus-visible{color:var(--text)}

.eyebrow{font-family:var(--mono);font-size:.78rem;letter-spacing:.09em;text-transform:uppercase;
  color:var(--accent);margin-bottom:var(--sp-3)}
.hero{padding-block:clamp(96px,18vh,180px) var(--sp-12);border-top:0}
.lede{max-width:62ch;color:var(--muted);font-size:1.06rem;margin-top:var(--sp-3)}
.hero-actions{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;margin-top:var(--sp-4)}
.btn{display:inline-flex;align-items:center;gap:8px;font:600 .95rem/1 var(--body);padding:14px 22px;
  border-radius:var(--r-btn);text-decoration:none;border:1px solid transparent;cursor:pointer;
  transition:transform 200ms var(--ease),background-color 200ms var(--ease),border-color 200ms var(--ease)}
.btn-primary{background:var(--accent);color:var(--accent-ink)}
.btn-primary:hover{transform:translateY(-2px)}
.btn-ghost{background:transparent;color:var(--text);border-color:var(--line)}
.btn-ghost:hover{border-color:var(--accent);transform:translateY(-2px)}
.copy-state{font-size:.85rem;color:var(--accent);opacity:0;transition:opacity 200ms var(--ease)}
.copy-state[data-on="1"]{opacity:1}
.scroll-hint{margin-top:var(--sp-8);font-family:var(--mono);font-size:.75rem;color:var(--muted)}

.now-lead{font-size:1.28rem;line-height:1.45;max-width:44ch;font-weight:500}
.now-grid{display:grid;gap:var(--sp-4)}
.now-list li{font-family:var(--mono);font-size:.9rem;color:var(--muted);padding-left:var(--sp-2);position:relative}
.now-list li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:1px;background:var(--accent)}

.cards{display:grid;gap:var(--sp-3)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);
  padding:var(--sp-4);transition:transform 260ms var(--ease),border-color 260ms var(--ease)}
.card:hover{transform:translateY(-4px);border-color:rgba(76,125,255,.45)}
.card-kicker{font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:var(--sp-2)}
.card p:last-child{margin-bottom:0}
.card-note{font-family:var(--mono);font-size:.82rem;color:var(--muted);border-left:2px solid var(--accent);
  padding-left:var(--sp-2);margin-top:var(--sp-3)}

.timeline{display:grid;gap:var(--sp-4);counter-reset:t}
.timeline li{padding-left:var(--sp-3);border-left:1px solid var(--line);position:relative}
.timeline li::before{content:"";position:absolute;left:-5px;top:6px;width:9px;height:9px;border-radius:50%;
  background:var(--bg);border:2px solid var(--accent)}
.timeline li:last-child p{color:var(--muted)}
.t-date{display:block;font-size:.8rem;letter-spacing:.06em;color:var(--muted);margin-bottom:var(--sp-1)}

.chips{display:flex;flex-wrap:wrap;gap:var(--sp-1)}
.chips li{font-size:.88rem;padding:8px 14px;border:1px solid var(--line);border-radius:999px;color:var(--muted);
  transition:color 200ms var(--ease),border-color 200ms var(--ease)}
.chips li:hover{color:var(--text);border-color:var(--accent)}
.langs{margin-top:var(--sp-3);font-size:.9rem;color:var(--muted)}

.contact-lede{font-size:1.1rem;color:var(--muted)}
.contact-list{display:grid;gap:var(--sp-2);margin-top:var(--sp-3);font-size:1.05rem}
.contact-list a{text-decoration:none;border-bottom:1px solid var(--line);transition:border-color 200ms var(--ease)}
.contact-list a:hover{border-color:var(--accent)}
.site-foot{padding-block:var(--sp-6);border-top:1px solid var(--line);font-size:.85rem;color:var(--muted)}

.reveal{transition:opacity 400ms var(--ease),transform 400ms var(--ease);transition-delay:calc(var(--i,0)*70ms)}
.js-anim .reveal{opacity:0;transform:translateY(20px)}
.js-anim .reveal.in{opacity:1;transform:none}

@media (min-width:760px){
  .now-grid{grid-template-columns:1.4fr 1fr;align-items:start}
  .cards{grid-template-columns:repeat(2,1fr)}
  .contact-list{grid-auto-flow:column;justify-content:start;gap:var(--sp-4)}
}
@media (max-width:759px){
  .nav{gap:var(--sp-2);font-size:.85rem}
  .brand-full{display:none}
  section{padding-block:var(--sp-8)}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js-anim .reveal{opacity:1;transform:none}
  .reveal,.btn,.card,.chips li,.copy-state,.progress{transition:none}
  .btn:hover,.card:hover{transform:none}
}
.no-js .reveal{opacity:1;transform:none}
.no-js .progress,.no-js .scroll-hint{display:none}

@media print{
  :root{--bg:#fff;--surface:#fff;--text:#111827;--muted:#4b5563;--accent:#1d4ed8;--line:rgba(0,0,0,.18)}
  body{background:#fff;background-image:none;color:#111827;font-size:11pt;line-height:1.5;
    -webkit-print-color-adjust:exact;print-color-adjust:exact}
  .site-head,.progress,.scroll-hint,.hero-actions,.copy-state,.site-foot{display:none}
  main{padding-inline:0;max-width:none}
  section{padding-block:14pt;border-top:1px solid #d1d5db;max-width:none;margin:0}
  h2{break-after:avoid}
  h1{font-size:22pt}
  h2{font-size:14pt;margin-bottom:10pt}
  h3{font-size:11.5pt}
  .hero{padding-block:0 14pt;border-top:0}
  .lede{color:#111827;max-width:none}
  .cards{grid-template-columns:repeat(2,1fr);gap:10pt}
  .card,.card-note{border:1px solid #d1d5db;border-radius:0;background:#fff;box-shadow:none}
  .card{padding:10pt;break-inside:avoid}
  .card:hover{transform:none}
  .chips li{border-color:#d1d5db;color:#111827}
  .reveal{opacity:1!important;transform:none!important}
  .timeline{gap:10pt}
  .timeline li{break-inside:avoid;padding-left:12pt}
  .timeline li::before{display:none}
  .card-kicker,.t-date,.eyebrow{color:#1d4ed8}
  a{color:#111827;text-decoration:none}
  .contact-list a{border-bottom:0}
  .contact-list a[href^="http"]::after{content:" (" attr(href) ")";font-size:.85em;color:#4b5563}
}