/* AccuCell — shared foundation for every design option.
   Colours come from the AccuCell design system (deck-measured values).
   Fonts are self-hosted (SIL OFL): Petrona display, Inter text, JetBrains Mono data. */

@font-face{font-family:"Petrona";src:url("../fonts/petrona-300.woff2") format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Petrona";src:url("../fonts/petrona-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Petrona";src:url("../fonts/petrona-600.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Petrona";src:url("../fonts/petrona-700.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/inter-var.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url("../fonts/jetbrains-mono-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url("../fonts/jetbrains-mono-500.woff2") format("woff2");font-weight:500;font-display:swap}

:root{
  /* Brand ramp (deck) */
  --blue-50:#cceeff; --blue-100:#b2d4e5; --blue-200:#66ccff; --blue-300:#14b1ff;
  --blue-400:#00a7fa; --blue-500:#008bd1; --blue-600:#007ebd; --blue-700:#0070a8;
  --blue-800:#006699; --blue-900:#005580; --blue-950:#004466;
  --periwinkle:#91a8d1;               /* logo only, never text */
  --ink:#272525; --ink-700:#4a4747; --ink-600:#6b6767; --ink-500:#8a8686;
  --ink-300:#c9c7c7; --ink-200:#e2e0e0; --ink-100:#eeeded; --ink-50:#f5f5f6;
  --white:#fff;
  --hairline:rgba(39,37,37,.078);
  --navy-deep:#021a28;                /* authored: darker than blue-950, for night scenes */

  --font-display:"Petrona",ui-serif,Georgia,serif;
  --font-body:"Inter",ui-sans-serif,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

  --ease-out:cubic-bezier(.22,.61,.36,1);
  --ease-expo:cubic-bezier(.16,1,.3,1);
  --gutter:clamp(20px,5.4vw,72px);
  --maxw:1320px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html,body{overflow-x:clip}
body{margin:0;font-family:var(--font-body);color:var(--ink);background:var(--white);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
img,svg,canvas,video{display:block;max-width:100%}
h1,h2,h3,h4,p,figure,blockquote,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}

.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:fixed;left:12px;top:-60px;z-index:1000;background:var(--blue-950);color:#fff;padding:10px 16px;border-radius:5px;transition:top .2s}
.skip:focus{top:12px}
:focus-visible{outline:2px solid var(--blue-600);outline-offset:3px;border-radius:3px}
[tabindex="-1"]:focus{outline:none}   /* sections focused by in-page links: the content itself, not a control */

/* Lenis */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}
.nw{white-space:nowrap}

/* Round 2 reveal contract (shared/js/reveal.js): copy shows as soon as any of it
   enters the viewport, with short motion. Pages may restyle the hidden state. */
.rv-on [data-rv]{transition:opacity .55s var(--ease-out),transform .7s var(--ease-expo),clip-path .7s var(--ease-expo),filter .6s var(--ease-out);transition-delay:var(--rv-d,0s)}
.rv-on [data-rv]:not(.is-in){opacity:0;transform:translateY(14px)}