/* ==========================================================================
   TOKENS — Ivory & Antique Gold, royal engraved
   ========================================================================== */

:root {
  /* ---- Paper -------------------------------------------------------- */
  --paper:        #FBF7F2;
  --paper-2:      #F6EEE2;
  --paper-3:      #F1E7D6;
  --paper-edge:   #E8DAC2;

  /* ---- Ink ---------------------------------------------------------- */
  --ink:          #2E2A24;
  --ink-soft:     #6B6154;
  --ink-faint:    #A2977F;

  /* ---- Gold --------------------------------------------------------- */
  --gold:         #C6A15B;
  --gold-deep:    #8C6A2F;
  --gold-dark:    #6F5222;
  --gold-light:   #E3C88D;
  --gold-pale:    #F0DCA6;

  --rule:         rgba(140, 106, 47, .38);
  --rule-soft:    rgba(140, 106, 47, .18);
  --rule-faint:   rgba(140, 106, 47, .10);

  /* Real foil is never one flat yellow — it is a run of light and shadow.
     Sized to 250% so a highlight can travel across the glyphs.           */
  /* Anchored in dark bronze at both ends. An evenly bright gold gradient
     disappears against ivory at display sizes — the darks are what make
     the letterforms read. */
  --foil: linear-gradient(115deg,
            #5E4419  0%,
            #8C6A2F  7%,
            #C6A15B 14%,
            #F0DCA6 20%,
            #C6A15B 26%,
            #7A5A26 34%,
            #A17E3C 43%,
            #E3C88D 50%,
            #A17E3C 57%,
            #6F5222 66%,
            #A17E3C 74%,
            #E3C88D 82%,
            #B8934E 90%,
            #5E4419 100%);

  --foil-soft: linear-gradient(115deg, #6F5222 0%, #A88246 26%, #D8B978 46%, #8C6A2F 70%, #6F5222 100%);

  /* ---- Type --------------------------------------------------------- */
  /* Aref Ruqaa, NOT "Aref Ruqaa Ink": the Ink cut ships COLR/CPAL colour
     tables that paint their own red ink accents, which overrides both
     `color` and the foil gradient clipped to the text. */
  /* Gulzar is Nastaliq — «الخط الفارسي» — used for the groom's full name
     only. It needs roughly double the line-height of any other script here:
     its baseline cascades downward within a single line. */
  --ff-ar-nastaliq: 'Gulzar', 'Noto Nastaliq Urdu', serif;
  --ff-ar-display: 'Aref Ruqaa', 'Amiri', serif;
  --ff-ar-head:    'Amiri', 'Aref Ruqaa', serif;
  --ff-ar-ui:      'IBM Plex Sans Arabic', system-ui, sans-serif;

  --ff-en-display: 'Cinzel', 'Cormorant Garamond', serif;
  --ff-en-head:    'Cormorant Garamond', Georgia, serif;
  --ff-en-ui:      'Inter', system-ui, sans-serif;

  /* Resolved per-language in base.css via [lang] */
  --ff-display: var(--ff-ar-display);
  --ff-head:    var(--ff-ar-head);
  --ff-ui:      var(--ff-ar-ui);

  /* Also bounded by viewport HEIGHT: on a short screen the name is what
     pushes the invitation past one screenful. */
  --fs-names:   min(clamp(2.25rem, 11vw, 5rem), 11svh);
  --fs-display: clamp(2.25rem, 8vw, 4rem);
  --fs-h2:      clamp(1.5rem, 5vw, 2.5rem);
  --fs-h3:      clamp(1.125rem, 3.4vw, 1.5rem);
  --fs-body:    clamp(1rem, 2.6vw, 1.125rem);
  --fs-small:   clamp(.8125rem, 2.2vw, .9375rem);
  --fs-micro:   clamp(.6875rem, 1.9vw, .75rem);

  /* ---- The envelope only ---------------------------------------------
     Burgundy, beige and silver belong to the sealed envelope and its wax
     seal. The invitation inside stays ivory and antique gold, so these
     tokens are used by .envelope* and nothing else. */
  --wine:         #6B1F2E;
  --wine-deep:    #4A1220;
  --wine-dark:    #2A0810;
  --wine-light:   #8E3243;
  --silver-light: #DCE0E6;
  --silver-pale:  #F0F2F5;

  /* ---- Space -------------------------------------------------------- */
  --sp-1: .25rem;  --sp-2: .5rem;   --sp-3: .75rem;  --sp-4: 1rem;
  --sp-5: 1.5rem;  --sp-6: 2rem;    --sp-7: 3rem;    --sp-8: 4rem;
  --sp-9: 6rem;    --sp-10: 8rem;

  --section-pad: clamp(3.5rem, 11vw, 7.5rem);
  --measure:     72ch;
  --shell:       min(100% - 2.5rem, 60rem);

  /* ---- Depth -------------------------------------------------------- */
  --deboss: 0 1px 0 rgba(255,255,255,.65), 0 -1px 0 rgba(0,0,0,.07);
  --emboss: 0 1px 1px rgba(110,82,34,.22);
  --lift:   0 1px 2px rgba(88,66,28,.05),
            0 8px 24px -12px rgba(88,66,28,.18);
  --lift-lg:0 2px 4px rgba(88,66,28,.06),
            0 24px 60px -28px rgba(88,66,28,.30);

  /* ---- Motion ------------------------------------------------------- */
  --ease:      cubic-bezier(.22, .61, .36, 1);
  --ease-out:  cubic-bezier(.16, 1, .3, 1);
  --dur-fast:  .28s;
  --dur:       .6s;
  --dur-slow:  1.1s;
  --dur-draw:  2.4s;
}