/* ============================================================
   THE SC CREATIONS — Design Tokens
   "A quiet room where light moves."
   Editorial Luxury / Gallery — whites & beiges
   ============================================================ */

:root {
  /* ---- Palette: layered neutrals ---- */
  --paper:    #F7F3ED;   /* warm white — primary background */
  --ivory:    #F1EAE0;   /* secondary surface */
  --oat:      #E7DDCF;   /* panels, cards */
  --sand:     #DBCDB9;   /* dust-sheet, dividers */
  --greige:   #C9BEB0;   /* muted mid */
  --taupe:    #A8957B;   /* hairlines, accents */
  --clay:     #8C7458;   /* warm secondary text */
  --espresso: #2B2420;   /* primary text / CTAs */
  --charcoal: #1C1A17;   /* deepest ink */

  /* alpha helpers */
  --ink-90: rgba(28, 26, 23, 0.90);
  --ink-60: rgba(43, 36, 32, 0.62);
  --ink-40: rgba(43, 36, 32, 0.40);
  --ink-12: rgba(43, 36, 32, 0.12);
  --ink-08: rgba(43, 36, 32, 0.08);
  --paper-80: rgba(247, 243, 237, 0.80);
  --paper-00: rgba(247, 243, 237, 0.00);

  /* ---- Typography ---- */
  --font-display: "Fraunces", "Times New Roman", serif;
  --font-body: "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;

  /* Fluid type scale (min 320px → max 1440px) */
  --step--1: clamp(0.78rem, 0.74rem + 0.18vw, 0.88rem);
  --step-0:  clamp(1rem, 0.95rem + 0.25vw, 1.08rem); /* min 16px — readable without zoom */
  --step-1:  clamp(1.15rem, 1.05rem + 0.5vw, 1.45rem);
  --step-2:  clamp(1.45rem, 1.25rem + 1.0vw, 2.1rem);
  --step-3:  clamp(1.9rem, 1.5rem + 2.0vw, 3.2rem);
  --step-4:  clamp(2.6rem, 1.9rem + 3.4vw, 4.8rem);
  --step-5:  clamp(3.3rem, 2.1rem + 6.0vw, 7.2rem);
  --step-6:  clamp(4.0rem, 2.0rem + 9.5vw, 10rem);

  --leading-tight: 1.02;
  --leading-snug: 1.18;
  --leading-body: 1.65;
  --tracking-label: 0.28em;
  --tracking-wide: 0.08em;

  /* ---- Spacing rhythm (8px base, fluid) ---- */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs:  0.75rem;
  --space-s:   1rem;
  --space-m:   clamp(1.25rem, 1rem + 1vw, 2rem);
  --space-l:   clamp(2rem, 1.4rem + 2.5vw, 3.5rem);
  --space-xl:  clamp(3rem, 2rem + 4vw, 6rem);
  --space-2xl: clamp(4.5rem, 3rem + 7vw, 10rem);
  --space-3xl: clamp(6rem, 3.5rem + 11vw, 14rem);

  /* ---- Layout ---- */
  --measure: 64ch;
  --gutter: clamp(1.25rem, 5vw, 6rem);
  --maxw: 1560px;
  --maxw-text: 760px;
  --radius: 2px;
  --radius-img: 3px;

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-soft: cubic-bezier(0.33, 0, 0.12, 1);
  --dur-fast: 0.45s;
  --dur-med: 0.8s;
  --dur-slow: 1.2s;
  --dur-reveal: 1.1s;

  /* ---- Elevation (very soft, warm) ---- */
  --shadow-sm: 0 1px 2px rgba(43, 36, 32, 0.04);
  --shadow-md: 0 18px 40px -24px rgba(43, 36, 32, 0.30);
  --shadow-lg: 0 40px 80px -40px rgba(43, 36, 32, 0.40);

  /* ---- z-index ---- */
  --z-grain: 1;
  --z-content: 2;
  --z-header: 50;
  --z-overlay: 80;
  --z-cursor: 9999;
}
