/* ==========================================================================
   LEID GALLERY — Design tokens
   Every colour, type size, space and motion value lives here.
   WordPress: enqueue first; map to theme.json later if needed.
   ========================================================================== */

/* ---- Fonts (self-hosted, subsetted, variable) ---------------------------- */
@font-face {
  font-family: "Bodoni Moda";
  src: url("../fonts/bodoni-moda-latin-var.woff2") format("woff2-variations"),
       url("../fonts/bodoni-moda-latin-var.woff2") format("woff2");
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2122, U+2212;
}
@font-face {
  font-family: "Bodoni Moda";
  src: url("../fonts/bodoni-moda-latin-italic-var.woff2") format("woff2-variations"),
       url("../fonts/bodoni-moda-latin-italic-var.woff2") format("woff2");
  font-weight: 400 900;
  font-style: italic;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2122, U+2212;
}
/* Roman numerals of the collection chapters only (I, II, III).
   Cinzel: inscriptional Roman capitals with clear bracketed serifs. */
@font-face {
  font-family: "Cinzel";
  src: url("../fonts/cinzel-latin-var.woff2") format("woff2-variations"),
       url("../fonts/cinzel-latin-var.woff2") format("woff2");
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF;
}
/* Persian/Arabic subset */
@font-face {
  font-family: "Vazirmatn";
  src: url("../fonts/vazirmatn-arabic-var.woff2") format("woff2-variations"),
       url("../fonts/vazirmatn-arabic-var.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}
/* Latin subset (punctuation, Latin digits inside Persian text) */
@font-face {
  font-family: "Vazirmatn";
  src: url("../fonts/vazirmatn-latin-var.woff2") format("woff2-variations"),
       url("../fonts/vazirmatn-latin-var.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2122, U+2212;
}

:root {
  /* ---- Palette (approved) ---- */
  --c-ivory: #F3EDE3;
  --c-cream: #E8DCCB;
  --c-sand: #CDB89C;
  --c-brown: #4A3F36;
  --c-charcoal: #111111;
  /* Derived neutrals — only mixes of the approved palette */
  --c-ivory-deep: #ECE3D6;         /* ivory toward cream, hero floor */
  --c-charcoal-soft: #1A1714;      /* charcoal warmed by brown, editorial */
  --c-ink: var(--c-charcoal);
  --c-ink-muted: #5E544B;          /* brown lifted for small text on light (AA on ivory) */
  --c-paper-muted: #B4A894;        /* sand dimmed for small text on dark (AA on charcoal) */
  --c-rule-light: rgb(17 17 17 / 0.18);
  --c-rule-dark: rgb(243 237 227 / 0.18);

  /* ---- Type families ---- */
  --f-display: "Bodoni Moda", "Didot", "Bodoni 72", "Times New Roman", serif;
  --f-text: "Vazirmatn", "Tahoma", system-ui, sans-serif;
  --f-numeral: "Cinzel", "Trajan Pro", "Times New Roman", serif;   /* collection numerals only */

  /* ---- Persian text scale (light, modest) ---- */
  --t-micro: 0.75rem;                                   /* 12px — labels */
  --t-small: 0.8125rem;                                 /* 13px */
  --t-body: clamp(0.875rem, 0.85rem + 0.1vw, 0.9375rem); /* 14–15px */
  --t-lead: clamp(0.9375rem, 0.9rem + 0.25vw, 1.0625rem); /* 15–17px */
  --t-title: clamp(1.25rem, 1.1rem + 0.7vw, 1.75rem);   /* 20–28px section titles */
  --t-quote: clamp(1.25rem, 1.05rem + 1vw, 2rem);        /* 20–32px editorial line */

  /* ---- Latin display scale ---- */
  --t-numeral: clamp(4.5rem, 3rem + 7vw, 10rem);
  --t-latin-label: 0.6875rem;                           /* 11px tracked caps */

  --lh-tight: 1.05;
  --lh-text: 1.95;     /* Persian needs generous leading */
  --lh-title: 1.6;

  --track-caps: 0.32em;
  --track-display: 0.02em;

  /* ---- Weights (no bold Persian) ---- */
  --w-light: 300;
  --w-regular: 400;

  /* ---- Space ---- */
  --gutter: clamp(1rem, 0.6rem + 2vw, 2.5rem);          /* 16px on phones */
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-7: 3rem;
  --s-8: clamp(3.5rem, 2.5rem + 4vw, 6rem);
  --s-9: clamp(5rem, 3rem + 8vw, 10rem);               /* section rhythm */
  --s-10: clamp(6rem, 3rem + 12vw, 14rem);

  --page-max: 90rem;      /* 1440px */
  --header-h: 4rem;

  /* ---- Lines ---- */
  --hairline: 1px;

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --d-fast: 200ms;
  --d-base: 450ms;
  --d-slow: 900ms;
  --d-reveal: 1100ms;
  --d-tone: 1000ms;

  /* ---- Layers ---- */
  --z-hero-type: 1;
  --z-hero-model: 2;
  --z-hero-copy: 3;
  --z-header: 50;
  --z-menu: 60;
  --z-skip: 100;

  /* ---- Current tone (switched per section by JS; see tone.js) ---- */
  --tone-bg: var(--c-ivory);
  --tone-fg: var(--c-ink);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --d-base: 200ms;
    --d-slow: 200ms;
    --d-reveal: 200ms;
    --d-tone: 200ms;
  }
}
