/* ============================================================
   KINTSUGI — design tokens
   The whole UI is dark ceramic + one cold celadon accent.
   Gold ( --seam-* ) appears ONLY inside the vessel artwork.
   ============================================================ */

:root {
  /* ---- Ground & surfaces ---- */
  --ground:        #14161A;   /* base canvas */
  --deepest:       #0E1013;   /* vignette floor, footer */
  --raised:        #1A1E24;   /* glass surfaces, cards */
  --raised-hi:     #1F242B;   /* hovered surface */
  --plinth:        #101317;   /* dark display plinths */

  /* ---- Text ---- */
  --text:          #E9E6DF;   /* porcelain */
  --text-dim:      #8C8A84;   /* secondary */
  --text-faint:    #5E5E5A;   /* tertiary / disabled */

  /* ---- Hairlines & strokes ---- */
  --line:          rgba(255,255,255,0.08);
  --line-soft:     rgba(255,255,255,0.05);
  --line-strong:   rgba(255,255,255,0.14);

  /* ---- The single accent: cold moonlit celadon ---- */
  --accent:        #88A39A;
  --accent-dim:    #5E726B;
  --accent-glow:   rgba(136,163,154,0.22);
  --accent-faint:  rgba(136,163,154,0.10);
  --accent-line:   rgba(136,163,154,0.32);

  /* ---- Gold — RESTRICTED to ceramic seams only ---- */
  --seam-core:     #E8C271;
  --seam-bright:   #F6E4B0;
  --seam-deep:     #B98A3C;
  --seam-glow:     rgba(232,194,113,0.55);

  /* ---- Type families ---- */
  --serif: "Cormorant", Georgia, "Times New Roman", serif;
  --sans:  "Hanken Grotesk", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --mono:  "Space Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* ---- Fluid type scale (clamped) ---- */
  --fs-mega:   clamp(4.5rem, 11vw, 11rem);    /* hero display */
  --fs-h1:     clamp(3rem, 6.5vw, 6rem);
  --fs-h2:     clamp(2.2rem, 4.4vw, 3.9rem);
  --fs-h3:     clamp(1.6rem, 2.6vw, 2.4rem);
  --fs-lead:   clamp(1.15rem, 1.7vw, 1.6rem);
  --fs-body:   1.0625rem;
  --fs-sm:     0.875rem;
  --fs-eyebrow:0.72rem;
  --fs-micro:  0.66rem;

  /* ---- Spacing scale (8pt-ish, ceramic-generous) ---- */
  --s-1: 0.5rem;
  --s-2: 1rem;
  --s-3: 1.5rem;
  --s-4: 2rem;
  --s-5: 3rem;
  --s-6: 4.5rem;
  --s-7: 7rem;
  --s-8: 10rem;
  --s-9: 14rem;

  /* ---- Layout ---- */
  --maxw:      1320px;
  --maxw-text: 720px;
  --gutter:    clamp(1.25rem, 5vw, 5rem);
  --nav-h:     76px;
  --nav-h-condensed: 58px;

  /* ---- Radii ---- */
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 14px;
  --r-pill: 999px;

  /* ---- Motion ---- */
  --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft: cubic-bezier(0.33, 0, 0.2, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --t-fast:   220ms;
  --t-med:    480ms;
  --t-slow:   900ms;
  --t-rise:   1100ms;

  /* ---- Depth ---- */
  --shadow-soft: 0 24px 60px -28px rgba(0,0,0,0.7);
  --shadow-deep: 0 40px 120px -40px rgba(0,0,0,0.85);
}