@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;700&display=swap');
/* Brand display font: 'Elevon' (trial cuts, grades 0G–4G mapped to weights).
   Swap for licensed webfonts (woff2) when purchased. 'New Science' still TBD. */
@font-face{ font-family:'Elevon Trial'; src:url('../assets/fonts/Elevon_Trial_ZeroG.ttf') format('truetype'); font-weight:100 300; font-display:swap; }
@font-face{ font-family:'Elevon Trial'; src:url('../assets/fonts/Elevon_Trial_OneG.ttf') format('truetype'); font-weight:400; font-display:swap; }
@font-face{ font-family:'Elevon Trial'; src:url('../assets/fonts/Elevon_Trial_TwoG.ttf') format('truetype'); font-weight:500 600; font-display:swap; }
@font-face{ font-family:'Elevon Trial'; src:url('../assets/fonts/Elevon_Trial_ThreeG.ttf') format('truetype'); font-weight:700; font-display:swap; }
@font-face{ font-family:'Elevon Trial'; src:url('../assets/fonts/Elevon_Trial_FourG.ttf') format('truetype'); font-weight:800 900; font-display:swap; }

/* ============================================================
   WINE GLASS — design tokens
   Single source of truth. Every page pulls from here.
   Maps 1:1 to a future tailwind.config / Astro theme.
   ============================================================ */
:root{
  /* ---- Wine / maroon (dark spine of the brand) ---- */
  --wine-950:#120308;
  --wine-900:#150409;
  --wine-850:#1a0710;
  --wine-800:#2a0f1c;
  --wine-750:#2a1014;
  --wine-700:#3a1828;
  --wine-600:#4a1f33;
  --wine-500:#5c2436;
  --wine-400:#7a2840;

  /* ---- Rose (accents, links, glow) ---- */
  --rose-600:#a85870;
  --rose-500:#a06880;
  --rose-400:#c4748b;   /* primary accent */
  --rose-300:#c08090;
  --rose-200:#e8b0bf;
  --rose-150:#e8c0cc;
  --rose-100:#f0c0cc;   /* bright accent text on dark */
  --rose-50:#f7d2dc;

  /* ---- Cream (deliberate contrast surface — "paper") ---- */
  --cream-50:#fff5f0;
  --cream-100:#fdf8f5;
  --cream-150:#fbf0f3;
  --cream-200:#f5ebe0;

  /* ---- Ink (text on light) ---- */
  --ink:#2a1014;
  --ink-soft:#5c3848;
  --ink-faint:#9a7080;

  /* ---- Semantic ---- */
  --bg:var(--wine-900);
  --bg-elevated:var(--wine-800);
  --fg:var(--cream-100);
  --fg-dim:rgba(253,248,245,0.72);
  --fg-faint:rgba(253,248,245,0.46);
  --accent:var(--rose-400);
  --accent-bright:var(--rose-100);
  --hairline:rgba(240,192,204,0.18);
  --hairline-strong:rgba(240,192,204,0.34);

  /* ---- The sacred gradient headline ---- */
  --grad-head:linear-gradient(180deg,#fff5f0 0%,#f7d2dc 35%,#c08090 60%,#5c2436 100%);
  --grad-head-soft:linear-gradient(180deg,#fff5f0 0%,#f7d2dc 50%,#c08090 100%);
  --grad-pill:linear-gradient(135deg,#c4748b 0%,#7a2840 100%);

  /* ---- Jelly glass tints ---- */
  --glass-fill:rgba(255,255,255,0.05);
  --glass-fill-2:rgba(255,255,255,0.08);
  --glass-stroke:rgba(255,255,255,0.14);
  --glass-iris:linear-gradient(135deg,
      rgba(240,192,204,0.55) 0%,
      rgba(196,116,139,0.30) 28%,
      rgba(122,40,64,0.35) 55%,
      rgba(232,176,191,0.40) 78%,
      rgba(245,210,220,0.55) 100%);

  /* ---- Typography ---- */
  --font-display:'Elevon Trial','Space Grotesk','Helvetica Neue',Helvetica,Arial,sans-serif; /* name + big impact titles */
  --font-display-alt:'Elevon Trial','Space Grotesk','Helvetica Neue',Helvetica,Arial,sans-serif;  /* editorial page titles */
  --font-serif:'Helvetica Now Text','Helvetica Neue',Helvetica,Arial,sans-serif;  /* serif RETIRED (full-Rhode) — var kept for legacy rules, now grotesk */
  --font-ui:'Helvetica Now Text','Helvetica Neue',Helvetica,Arial,sans-serif; /* labels, nav, UI, body */

  /* fluid type scale */
  --t-mega:clamp(3.5rem,9vw,7.6rem);
  --t-h1:clamp(2.6rem,6vw,5rem);
  --t-h2:clamp(1.9rem,3.6vw,3rem);
  --t-h3:clamp(1.4rem,2.4vw,2rem);
  --t-lead:clamp(1.05rem,1.5vw,1.3rem);
  --t-body:1rem;
  --t-small:0.84rem;
  --t-label:0.7rem;
  --label-track:0.2em;

  /* ---- Spacing rhythm ---- */
  --sp-1:0.5rem; --sp-2:1rem; --sp-3:1.5rem; --sp-4:2rem;
  --sp-5:3rem; --sp-6:4rem; --sp-7:6rem; --sp-8:8rem;
  --gutter:clamp(1.2rem,4vw,3rem);
  --measure:1240px;
  --measure-text:1100px;

  /* ---- Radii ---- */
  --r-sm:10px; --r-md:16px; --r-lg:22px; --r-xl:30px; --r-pill:100px;

  /* ---- Shadows (layered, joshwcomeau-style) ---- */
  --shadow-sm:0 1px 2px rgba(10,2,5,0.35),0 2px 6px rgba(10,2,5,0.25);
  --shadow-md:0 4px 8px rgba(10,2,5,0.30),0 12px 28px rgba(10,2,5,0.35);
  --shadow-lg:0 12px 24px rgba(10,2,5,0.35),0 30px 80px rgba(10,2,5,0.55);
  --glow-rose:0 12px 32px rgba(196,116,139,0.45),inset 0 1px 0 rgba(255,255,255,0.2);
  --glow-rose-strong:0 18px 48px rgba(196,116,139,0.6),inset 0 1px 0 rgba(255,255,255,0.28);

  /* ---- Easing (easings.net) ---- */
  --ease-out-expo:cubic-bezier(0.16,1,0.3,1);
  --ease-out-back:cubic-bezier(0.34,1.56,0.64,1);
  --ease-in-out:cubic-bezier(0.65,0,0.35,1);
  --ease-out-quint:cubic-bezier(0.22,1,0.36,1);

  /* ---- Motion durations ---- */
  --dur-fast:0.25s; --dur-mid:0.45s; --dur-slow:0.8s;
}


/* ---- blur radii as vars: halved on hi-DPI (mobile/retina) for cheaper raster cost.
   Dial the radii down only there; 1x desktops keep the exact original look. ---- */
:root{
  --bl8:8px; --bl10:10px; --bl12:12px; --bl14:14px; --bl16:16px; --bl17:17px;
  --bl34:34px; --bl38:38px; --bl44:44px; --bl60:60px;
}
@media (min-resolution: 2dppx), (-webkit-min-device-pixel-ratio: 2){
  :root{
    --bl8:5px; --bl10:6px; --bl12:7px; --bl14:8px; --bl16:9px; --bl17:9px;
    --bl34:18px; --bl38:20px; --bl44:22px; --bl60:30px;
  }
}