@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');

@font-face { font-family:'Geogrotesque'; font-weight:400; font-style:normal; font-display:swap; src:url('fonts/Geogtq-Lg.otf') format('opentype'); }
@font-face { font-family:'Geogrotesque'; font-weight:500; font-style:normal; font-display:swap; src:url('fonts/Geogtq-Rg.otf') format('opentype'); }
@font-face { font-family:'Geogrotesque'; font-weight:600; font-style:normal; font-display:swap; src:url('fonts/Geogtq-Md.otf') format('opentype'); }
@font-face { font-family:'Geogrotesque'; font-weight:700; font-style:normal; font-display:swap; src:url('fonts/Geogtq-Sb.otf') format('opentype'); }
@font-face { font-family:'Geogrotesque'; font-weight:800; font-style:normal; font-display:swap; src:url('fonts/Geogtq-Bd.otf') format('opentype'); }

:root {
  --folx-magenta:#DC1D4D;
  --folx-magenta-ink:#B21340;
  --folx-magenta-soft:#F4C6D3;
  --folx-black:#0A0A0A;
  --folx-off-black:#1A1A1A;
  --folx-white:#FFFFFF;
  --folx-cream:#F6F3EE;
  --folx-gray-900:#1A1A1A;
  --folx-gray-700:#3A3A3A;
  --folx-gray-500:#6B6B6B;
  --folx-gray-300:#C8C6C2;
  --folx-gray-100:#EDEAE4;

  --fg1:var(--folx-black);
  --fg2:var(--folx-gray-700);
  --fg3:var(--folx-gray-500);
  --accent:var(--folx-magenta);
  --accent-ink:var(--folx-magenta-ink);
  --border:var(--folx-gray-300);

  --font-display:'Geogrotesque', system-ui, sans-serif;
  --font-body:'Geogrotesque', system-ui, -apple-system, sans-serif;
  --font-mono:'JetBrains Mono', ui-monospace, Menlo, monospace;

  --tracking-display:0.04em;
  --tracking-wide:0.14em;

  --shadow-brutal:6px 6px 0 var(--folx-black);
  --shadow-brutal-red:6px 6px 0 var(--folx-magenta);
  --shadow-2:0 4px 12px rgba(0,0,0,0.10);

  --ease-out:cubic-bezier(0.2,0.7,0.1,1);
  --dur-fast:140ms;
  --dur-med:240ms;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:var(--font-body);
  font-weight:500;
  color:var(--fg1);
  background:var(--folx-cream);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
::selection{background:var(--folx-magenta);color:#fff;}