/* ===== Poggengerd Design Tokens + Base (self-hosted fonts) ===== */

/* ---- Self-hosted webfonts (Archivo, IBM Plex Sans/Mono) ---- */
@font-face{font-family:'Archivo';font-style:normal;font-weight:700;font-display:swap;src:local('Archivo'),url('../fonts/archivo-700.woff2') format('woff2')}
@font-face{font-family:'Archivo';font-style:normal;font-weight:900;font-display:swap;src:local('Archivo Black'),url('../fonts/archivo-900.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:local('IBM Plex Sans'),url('../fonts/ibm-plex-sans-400.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:500;font-display:swap;src:local('IBM Plex Sans Medium'),url('../fonts/ibm-plex-sans-500.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:local('IBM Plex Sans SemiBold'),url('../fonts/ibm-plex-sans-600.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:local('IBM Plex Mono'),url('../fonts/ibm-plex-mono-400.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:local('IBM Plex Mono Medium'),url('../fonts/ibm-plex-mono-500.woff2') format('woff2')}

:root{
  /* fonts */
  --font-display:'Archivo','Helvetica Neue',Arial,sans-serif;
  --font-body:'IBM Plex Sans','Segoe UI',system-ui,sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,'SFMono-Regular',monospace;
  --fw-regular:400;--fw-medium:500;--fw-semibold:600;--fw-bold:700;--fw-black:900;
  --fs-display:clamp(3rem,6.5vw,6.5rem);--fs-h1:clamp(2.4rem,5vw,4rem);--fs-h2:clamp(1.9rem,3.4vw,2.85rem);
  --fs-h3:1.5rem;--fs-h4:1.2rem;--fs-lead:clamp(1.15rem,1.6vw,1.5rem);--fs-body:1.0625rem;--fs-sm:.9375rem;--fs-xs:.8125rem;--fs-eyebrow:.8125rem;
  --lh-tight:1.02;--lh-snug:1.15;--lh-normal:1.5;--lh-relaxed:1.65;
  --ls-tight:-.02em;--ls-normal:0;--ls-eyebrow:.22em;--ls-label:.06em;
  /* colors */
  --pg-indigo:#2c2a7a;--pg-yellow:#f7f300;
  --indigo-950:#0d0c2b;--indigo-900:#14133f;--indigo-800:#1c1a5c;--indigo-700:#232179;--indigo-600:#2c2a7a;--indigo-500:#3a37a3;--indigo-400:#5754c6;--indigo-300:#8b89dd;--indigo-200:#c2c1ef;--indigo-100:#e6e6f9;--indigo-50:#f3f3fc;
  --yellow-600:#c9c600;--yellow-500:#f7f300;--yellow-400:#fdf94a;--yellow-200:#fdfaa0;--yellow-100:#fefce0;
  --steel-950:#0e0e16;--steel-900:#16161f;--steel-800:#232531;--steel-700:#353846;--steel-600:#4d5160;--steel-500:#6b6f7e;--steel-400:#9499a6;--steel-300:#c0c4cd;--steel-200:#dde0e6;--steel-100:#eef0f3;--steel-50:#f7f8fa;--white:#fff;
  --surface-page:var(--white);--surface-muted:var(--steel-50);--surface-card:var(--white);--surface-dark:var(--indigo-900);--surface-indigo:var(--pg-indigo);--surface-inverse:var(--steel-950);
  --text-strong:var(--indigo-900);--text-body:var(--steel-700);--text-muted:var(--steel-500);--text-on-dark:var(--white);--text-on-dark-dim:var(--indigo-200);--text-on-yellow:var(--indigo-900);--text-accent:var(--pg-indigo);
  --border-subtle:var(--steel-200);--border-strong:var(--steel-300);--border-on-dark:rgba(255,255,255,.14);
  --link:var(--pg-indigo);--focus-ring:var(--yellow-500);
  /* spacing */
  --sp-1:.25rem;--sp-2:.5rem;--sp-3:.75rem;--sp-4:1rem;--sp-5:1.5rem;--sp-6:2rem;--sp-7:3rem;--sp-8:4rem;--sp-9:6rem;--sp-10:8rem;
  --section-y:clamp(4rem,9vw,9rem);--gutter:clamp(1.25rem,4vw,3.5rem);--container-max:1280px;--container-wide:1480px;
  /* radii + borders */
  --radius-none:0;--radius-xs:2px;--radius-sm:4px;--radius-md:8px;--radius-lg:14px;--radius-pill:999px;
  --bw-hairline:1px;--bw-medium:2px;--bw-accent:3px;
  /* shadows */
  --shadow-sm:0 1px 2px rgba(20,19,63,.06),0 1px 3px rgba(20,19,63,.08);
  --shadow-md:0 4px 12px rgba(20,19,63,.08),0 2px 4px rgba(20,19,63,.06);
  --shadow-lg:0 18px 40px rgba(20,19,63,.14),0 6px 12px rgba(20,19,63,.08);
  --shadow-xl:0 32px 70px rgba(13,12,43,.22);
  --shadow-yellow:0 10px 30px rgba(247,243,0,.30);
  /* motion */
  --ease-out:cubic-bezier(.16,1,.3,1);--ease-in-out:cubic-bezier(.65,0,.35,1);--dur-fast:160ms;--dur-med:320ms;--dur-slow:620ms;
  /* z */
  --z-rail:40;--z-header:50;--z-overlay:100;
}

/* ---- base reset ---- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:var(--font-body);font-size:var(--fs-body);line-height:var(--lh-relaxed);color:var(--text-body);background:var(--surface-page);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4{font-family:var(--font-display);color:var(--text-strong);line-height:var(--lh-snug);letter-spacing:var(--ls-tight);font-weight:var(--fw-bold);text-wrap:balance}
p{text-wrap:pretty}
a{color:var(--link);text-decoration:none}
img,svg,video{display:block;max-width:100%}
button{font:inherit;cursor:pointer}
:focus-visible{outline:var(--bw-medium) solid var(--focus-ring);outline-offset:2px}

/* ---- shared brand utilities ---- */
.pg-eyebrow{font-family:var(--font-mono);font-size:var(--fs-eyebrow);font-weight:var(--fw-medium);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--text-accent);display:inline-flex;align-items:center;gap:var(--sp-2)}
.pg-eyebrow::before{content:"";width:28px;height:var(--bw-accent);background:var(--pg-yellow);flex:none}
.pg-eyebrow--on-dark{color:var(--yellow-500)}
.pg-container{width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:var(--gutter)}
.pg-rule{width:64px;height:var(--bw-accent);background:var(--pg-yellow);border:0}
.pg-visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}}