/* base.css — reset + tokens */

/* ── HumanityAGSI brand type (self-hosted, license-safe) ───────────────
   Display/headlines : Fraunces  (editorial high-contrast serif)
   Body & UI         : Schibsted Grotesk  (editorial grotesk)
   Labels & eyebrows : IBM Plex Mono  (brand mono)
   All woff2, font-src 'self' — no external font CDN.                     */
@font-face{
  font-family:'Fraunces';
  font-style:normal;
  font-weight:300 700;
  font-display:swap;
  src:url('./assets/fonts/fraunces-var.woff2') format('woff2');
}
@font-face{
  font-family:'Schibsted Grotesk';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url('./assets/fonts/schibsted-var.woff2') format('woff2');
}
@font-face{
  font-family:'IBM Plex Mono';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('./assets/fonts/ibmplexmono-400.woff2') format('woff2');
}
@font-face{
  font-family:'IBM Plex Mono';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('./assets/fonts/ibmplexmono-500.woff2') format('woff2');
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  scroll-behavior:smooth;
  scroll-padding-top:var(--space-16);
}
body{
  min-height:100dvh;
  line-height:1.55;
  font-family:var(--font-body, system-ui, sans-serif);
  font-size:var(--text-base);
  color:var(--color-text);
  background-color:var(--color-bg);
  overflow-x:hidden;
}
img,picture,video,canvas,svg{display:block;max-width:100%;height:auto}
ul[role='list'],ol[role='list']{list-style:none}
input,button,textarea,select{font:inherit;color:inherit}
h1,h2,h3,h4,h5,h6{text-wrap:balance;line-height:1.1;font-family:var(--font-display, var(--font-body))}
p,li,figcaption{text-wrap:pretty;max-width:72ch}
::selection{background:color-mix(in oklab, var(--color-accent) 35%, transparent);color:var(--color-text)}
:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px;border-radius:var(--radius-sm)}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}
button{cursor:pointer;background:none;border:none}
a{color:inherit;text-decoration-color:color-mix(in oklab, var(--color-accent) 60%, transparent);text-underline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

:root{
  /* Type scale */
  --text-xs:clamp(0.75rem, 0.7rem + 0.2vw, 0.85rem);
  --text-sm:clamp(0.875rem, 0.83rem + 0.25vw, 0.95rem);
  --text-base:clamp(1rem, 0.95rem + 0.2vw, 1.0625rem);
  --text-lg:clamp(1.125rem, 1rem + 0.55vw, 1.375rem);
  --text-xl:clamp(1.5rem, 1.2rem + 1.25vw, 2.25rem);
  --text-2xl:clamp(2rem, 1.2rem + 2.5vw, 3.5rem);
  --text-hero:clamp(2.5rem, 0.8rem + 6vw, 6rem);
  /* Spacing */
  --space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;
  --space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;
  --space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--space-32:8rem;
  --radius-sm:.375rem;--radius-md:.625rem;--radius-lg:1rem;--radius-xl:1.5rem;--radius-full:9999px;
  --transition:200ms cubic-bezier(.16,1,.3,1);
  --content-narrow:680px;--content-default:1080px;--content-wide:1320px;
  --font-body:'Schibsted Grotesk', system-ui, sans-serif;
  --font-display:'Fraunces', Georgia, 'Times New Roman', serif;
  --font-mono:'IBM Plex Mono', ui-monospace, monospace;
}