:root{
  --paper:#f3f2ee; --ink:#0f0f0e; --soft:#57564f; --rule:#0f0f0e; --hair:#d6d4cc;
  --blue:#3242b0; --hl:#e4ff3d; --on-blue:#ffffff; --block:#1f2437; --on-block:#e7e8ef; --block-mark:#cdd2f2; --tint:#e9e8e2; --term:#0f0f0e; --term-ink:#e9e8e2;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#0e0e0d; --ink:#efeee8; --soft:#a3a299; --rule:#efeee8; --hair:#2a2a27;
    --blue:#9ba6ec; --hl:#e4ff3d; --on-blue:#0e0e0d; --block:#1b1f2d; --on-block:#e2e4ec; --block-mark:#cdd2f2; --tint:#1a1a18; --term:#181816; --term-ink:#e9e8e2;
  }
}
:root[data-theme="dark"]{
  --paper:#0e0e0d; --ink:#efeee8; --soft:#a3a299; --rule:#efeee8; --hair:#2a2a27;
  --blue:#9ba6ec; --hl:#e4ff3d; --on-blue:#0e0e0d; --block:#1b1f2d; --on-block:#e2e4ec; --block-mark:#cdd2f2; --tint:#1a1a18; --term:#181816; --term-ink:#e9e8e2;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font:400 19px/1.55 Newsreader,Georgia,serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
::selection{background:var(--hl);color:#0f0f0e}
.mono{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:13px;letter-spacing:.02em}
.wrap{max-width:1320px;margin:0 auto;padding:0 32px}
.display{font-family:Archivo,sans-serif;font-variation-settings:"wdth" 72;font-weight:850;text-transform:uppercase;line-height:.88;letter-spacing:-.01em}
mark{background:linear-gradient(transparent 12%,var(--hl) 12%,var(--hl) 88%,transparent 88%);color:#0f0f0e;padding:0 .12em}

/* top bar */
.bar{border-bottom:1px solid var(--rule)}
.bar .wrap{display:flex;align-items:center;height:58px;gap:24px}
.brand{font-size:26px;text-decoration:none;line-height:1}
.brand span{color:var(--blue)}
.clock-wrap{color:var(--soft);margin-left:auto}
.bar nav{display:flex;gap:28px}
.bar nav a{text-decoration:none}
.bar nav a[href]:hover,.bar nav a[aria-current]{color:var(--blue)}
.bar nav a:not([href]){cursor:default}
.bar nav a b{color:var(--soft);font-weight:400;margin-right:6px}

/* hero */
.hero{padding-top:28px}
.name{font-size:clamp(40px,15.2vw,206px);white-space:nowrap}
.name span{color:var(--blue)}
.hero-row{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--rule);margin-top:28px}
.hero-row>div{padding:36px 0}
.hero-row>div+div{border-left:1px solid var(--rule);padding-left:40px}
.statement{font-size:clamp(26px,2.6vw,38px);line-height:1.22;padding-right:40px;font-weight:400}
.statement em{color:var(--blue)}
.meta-line{margin-top:28px;color:var(--soft);display:flex;flex-wrap:wrap;gap:8px 22px}

/* serp mock */
.serp{font-family:Arial,Helvetica,sans-serif;max-width:520px}
.serp .q{display:flex;align-items:center;gap:12px;border:1px solid var(--hair);background:color-mix(in srgb,var(--paper) 60%,#fff);border-radius:24px;padding:11px 18px;font-size:16px;margin-bottom:22px}
:root[data-theme="dark"] .serp .q{background:#1a1a18}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .serp .q{background:#1a1a18}}
.serp .q svg{flex:none;color:var(--soft)}
.serp .q .caret{width:1px;height:18px;background:var(--ink);animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.serp .res{position:relative;padding-left:44px}
.serp .rank{position:absolute;left:0;top:2px;font:800 15px Archivo,sans-serif;background:var(--blue);color:var(--on-blue);width:32px;height:32px;display:grid;place-items:center}
.serp .site{font-size:14px;line-height:1.3}
.serp .site small{display:block;color:var(--soft);font-size:12px}
.serp .title{font-size:20px;color:var(--blue);margin:6px 0 4px;line-height:1.3}
.serp .snip{font-size:14px;line-height:1.55;color:var(--soft)}
.serp .snip b{color:var(--ink)}
.serp .chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.serp .chips span{font-size:12px;border:1px solid var(--hair);padding:4px 10px;border-radius:14px;color:var(--soft)}

/* fact strip */
.strip{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);display:grid;grid-template-columns:repeat(4,1fr)}
.strip div{padding:22px 0 22px 0;border-right:1px solid var(--hair);padding-left:20px}
.strip div:first-child{padding-left:0}
.strip div:last-child{border-right:0}
.strip b{display:block;font:800 48px/1 Archivo,sans-serif;font-variation-settings:"wdth" 72;margin-bottom:6px}
.strip span{color:var(--soft)}

/* section heading */
.sec{padding:110px 0 0}
.sec-head{display:grid;grid-template-columns:200px 1fr;gap:32px;align-items:end;margin-bottom:44px}
.sec-head .mono{color:var(--soft);padding-bottom:10px}
.sec-head h2{font-size:clamp(44px,6vw,88px)}

/* services rows */
.rows{border-top:1px solid var(--rule)}
.row{display:grid;grid-template-columns:200px 1fr 1fr;gap:32px;padding:30px 0;border-bottom:1px solid var(--rule);align-items:baseline;transition:background .2s,color .2s,padding .2s}
.row:hover{background:var(--tint);padding-left:20px;padding-right:20px}
.row:hover h3{color:var(--blue)}
.row .mono{color:var(--soft)}
.row h3{font:800 clamp(30px,3.4vw,48px)/1 Archivo,sans-serif;font-variation-settings:"wdth" 80;text-transform:uppercase}
.row p{color:var(--soft);max-width:460px}

/* hire */
.hire{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;margin-top:56px;padding:48px;background:var(--block);color:var(--on-block)}
.hire .mono{opacity:.75;margin-bottom:12px}
.hire .big{font-size:clamp(24px,2.2vw,32px);line-height:1.3}
.hire mark{background:var(--block-mark);color:var(--block)}
.hire .cta{display:inline-block;margin-top:28px;font:800 20px Archivo,sans-serif;font-variation-settings:"wdth" 85;text-transform:uppercase;text-decoration:none;border-bottom:3px solid currentColor}
.hire .cta:hover{opacity:.75}
.skills{list-style:none;display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start}
.skills li{border:1px solid var(--rule);padding:6px 12px}
.hire .skills li{border-color:color-mix(in srgb,currentColor 30%,transparent)}
.exp tr.now td.mono::after{content:" ● now";color:var(--soft)}
.exp td:first-child{width:34%}
.exp td.mono{width:22%}

/* lab terminal */
.lab{display:grid;grid-template-columns:1fr 1.15fr;gap:56px;align-items:start}
.lab p.big{font-size:clamp(24px,2.2vw,32px);line-height:1.3}
.lab p.small{color:var(--soft);margin-top:20px}
.term{background:var(--term);color:var(--term-ink);font-family:"IBM Plex Mono",monospace;font-size:14px;line-height:1.9;padding:0 0 22px}
.term .top{display:flex;justify-content:space-between;padding:12px 18px;border-bottom:1px solid #2c2c29;color:#8d8c84;font-size:12px}
.term pre{font:inherit;padding:18px 22px 0;white-space:pre-wrap}
.term .ok{color:var(--hl)}
.term .dim{color:#8d8c84}
.term .cmd{color:#9aa4ff}

/* tools table */
.tools{width:100%;border-collapse:collapse}
.tools th{font:500 12px "IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.06em;color:var(--soft);text-align:left;padding:0 0 12px;border-bottom:1px solid var(--rule)}
.tools td{padding:22px 0;border-bottom:1px solid var(--hair);vertical-align:baseline}
.tools td:first-child{font:700 26px/1.1 Archivo,sans-serif;font-variation-settings:"wdth" 85;width:38%;padding-right:24px}
.tools td.mono{width:18%;color:var(--blue)}
.tools td:last-child{color:var(--soft)}
.tools tr:hover td:first-child{color:var(--blue)}

/* log */
.log{border-top:1px solid var(--rule)}
.log li{list-style:none;display:grid;grid-template-columns:330px 1fr;gap:32px;padding:30px 0;border-bottom:1px solid var(--hair);align-items:baseline}
.log .yr{font-size:clamp(48px,5.4vw,80px)}
.log .yr.peak{color:var(--blue)}
.log h3{font:700 24px/1.2 Archivo,sans-serif;font-variation-settings:"wdth" 90;margin-bottom:6px}
.log p{color:var(--soft);max-width:620px}

/* contact */
.contact{padding:130px 0 70px}
.contact .mono{color:var(--soft);margin-bottom:22px}
.contact a.mail{display:inline-block;font-size:clamp(44px,8.4vw,128px);text-decoration:none;border-bottom:.08em solid var(--blue);word-break:break-all;transition:color .2s}
.contact a.mail:hover{color:var(--blue)}
.contact .links{display:flex;gap:28px;margin-top:40px;flex-wrap:wrap}
.contact .links a{text-decoration:none;border-bottom:1px solid var(--rule)}
.contact .links a:hover{color:var(--blue);border-color:var(--blue)}
footer{border-top:1px solid var(--rule)}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:20px;padding-bottom:20px;color:var(--soft)}
.foot-links{display:flex;gap:22px;flex-wrap:wrap}
.foot-links a{text-decoration:none}
.foot-links a:hover{color:var(--blue)}

@media (max-width:980px){
  .hero-row,.lab,.hire{grid-template-columns:1fr}
  .hero-row>div+div{border-left:0;border-top:1px solid var(--rule);padding-left:0}
  .statement{padding-right:0}
  .strip{grid-template-columns:1fr 1fr}
  .strip div:nth-child(2){border-right:0}
  .strip div:nth-child(3){padding-left:0}
  .strip div:nth-child(-n+2){border-bottom:1px solid var(--hair)}
  .sec-head,.row,.log li{grid-template-columns:1fr;gap:10px}
}
@media (max-width:640px){
  .clock-wrap{display:none}
  .bar nav{margin-left:auto;gap:16px}
  .bar nav a b{display:none}
  .wrap{padding:0 16px}
  body{font-size:18px}
  .sec{padding-top:80px}
  .strip b{font-size:38px}
  .tools thead{display:none}
  .tools tr{display:block;padding:18px 0;border-bottom:1px solid var(--hair)}
  .tools td{display:block;padding:2px 0;border:0;width:auto!important}
  .row:hover{padding-left:12px;padding-right:12px}
  .hire{padding:28px 20px;gap:28px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* inner pages */
.page-head{padding:56px 0 44px;border-bottom:1px solid var(--rule)}
.page-head .mono{color:var(--soft);margin-bottom:18px}
.page-title{font-size:clamp(64px,13vw,180px)}
.page-title span{color:var(--blue)}
.page-head .lead{font-size:clamp(22px,2.3vw,32px);line-height:1.3;max-width:860px;margin-top:30px}
.prose{max-width:760px}
.prose h2{font:800 26px/1.15 Archivo,sans-serif;font-variation-settings:"wdth" 85;text-transform:uppercase;margin:52px 0 14px}
.prose h2:first-child{margin-top:0}
.prose p,.prose li{margin-bottom:14px}
.prose ul{padding-left:22px}
.prose a{color:var(--blue)}
.legal{padding:64px 0 96px}
.legal .updated{color:var(--soft);margin-bottom:40px}
.split{display:grid;grid-template-columns:200px 1fr;gap:32px}
.split>.mono{color:var(--soft);padding-top:8px}
a.row{text-decoration:none}
.channel h3{text-transform:none;font-size:clamp(24px,2.5vw,36px);font-variation-settings:"wdth" 75;overflow-wrap:anywhere}
.band{margin-top:110px;padding:56px 48px;background:var(--block);color:var(--on-block);display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
.band h2{font-size:clamp(36px,4.6vw,64px)}
.band a{font:800 20px Archivo,sans-serif;font-variation-settings:"wdth" 85;text-transform:uppercase;text-decoration:none;border-bottom:3px solid currentColor}
@media (max-width:980px){.split{grid-template-columns:1fr;gap:10px}}
@media (max-width:640px){.band{padding:36px 20px}.legal{padding:44px 0 72px}}