/* Layout: 12-column grid inside a column that is two-thirds of the page on desktop and full width (16px gutters) below 1000px.
   Pinned intro (scroll-driven) → Find me shelf → work → about → how I think → tools shelf → contact. Side nav ≥1000px, bottom-bar sheet below. */
/* Manrope, self-hosted: one variable file covers every weight the site uses (400–700). */
@font-face{font-family:'Manrope';src:url('../assets/fonts/manrope-latin-var.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  /* colour: UI stays neutral; the photo's palette only lives in the mesh */
  --bg:#F4F2F0; --surface:#F9F8F6; --chip:#EDEBE7; --paper:#FFFFFF;
  --ink-1:#0B0B0B; --ink-2:#606060; --line:#E2DFDA; --accent:#3F5A4E;
  --stage:#EAE8E4; --skel:rgba(96,96,96,.22);
  /* mesh, sampled from the portrait: marble (3 values), shirt blue, skin warmth */
  --m1:#E8EBE7; --m2:#B4BCB4; --m3:#7E8B82; --m4:#CBD1DC; --m5:#DCC8BA;
  --shadow:0 1px 2px rgba(0,0,0,.08);

  /* type */
  --sans:'Manrope',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --fs-display:clamp(44px,5.2vw,76px);
  --fs-h2:clamp(24px,2.3vw,32px);
  --fs-h3:clamp(16px,calc(.2vw + 15.2px),18px);
  --fs-lede:clamp(19px,1.7vw,24px);
  --fs-body-l:clamp(16px,calc(.3vw + 14.8px),19px);
  --fs-body:clamp(14.5px,calc(.12vw + 14px),16px);
  --fs-meta:13px;
  --fs-caption:12px;

  /* space */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px;
  /* fluid: grow continuously with the viewport instead of jumping at breakpoints */
  --gut:clamp(16px,calc(.8vw + 10px),28px);
  --section:clamp(64px,calc(3.6vw + 50px),120px);
  --edge:clamp(16px,4vw,40px);

  /* shape */
  --r-media:12px; --r-pill:99px;

  /* motion: fast for feedback, med for components, slow for sections */
  --ease:cubic-bezier(.22,1,.36,1); --ease-io:cubic-bezier(.65,0,.35,1);
  --d-fast:180ms; --d-med:420ms; --d-slow:800ms;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0F0E0D; --surface:#171614; --chip:#21201D; --paper:#1A1917;
  --ink-1:#F2EFEB; --ink-2:#A39E97; --line:#2B2926; --accent:#8FB3A2;
  --stage:#191816; --skel:rgba(163,158,151,.22);
  --m1:#101311; --m2:#262C28; --m3:#3B4840; --m4:#262A33; --m5:#33291F;
  --shadow:0 1px 2px rgba(0,0,0,.5); color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0F0E0D; --surface:#171614; --chip:#21201D; --paper:#1A1917;
  --ink-1:#F2EFEB; --ink-2:#A39E97; --line:#2B2926; --accent:#8FB3A2;
  --stage:#191816; --skel:rgba(163,158,151,.22);
  --m1:#101311; --m2:#262C28; --m3:#3B4840; --m4:#262A33; --m5:#33291F;
  --shadow:0 1px 2px rgba(0,0,0,.5); color-scheme:dark}