/* ===========================================================================
   Design tokens — the only file in v2 that contains a raw colour or size.
   Every value here was measured from the original Tilda export, so changing
   one here changes it everywhere, correctly.
   =========================================================================== */

:root {
  /* ── Colour ─────────────────────────────────────────────────────────── */
  --c-bg:            #f9f0e0;  /* cream — every section shares this */
  --c-gold:          #a67d2b;  /* section headings, hero names */
  --c-gold-soft:     #a07b33;  /* the "و" between the names */
  --c-gold-count:    #b48c3d;  /* countdown digits, labels, separators */
  --c-gold-shine-1:  #cda95a;  /* countdown shimmer, mid stop */
  --c-gold-shine-2:  #d8ba72;  /* countdown shimmer, peak */
  --c-brown:         #6c513f;  /* body copy */
  --c-brown-soft:    #846f61;  /* schedule times */
  --c-brown-muted:   #6a5140;  /* hero sub-paragraph */
  --c-dot:           #8c7666;  /* timeline dots */
  --c-line:          #9c8575;  /* timeline rule */
  --c-ink:           #937100;  /* chevron strokes */
  --c-wine:          #5a0f1b;  /* RSVP submit background */
  --c-wine-ink:      #f6f1e8;  /* RSVP submit text */
  --c-field-ink:     #4f4f4f;  /* form input text */
  --c-field-border:  #c9c9c9;  /* form input border */
  --c-popup-bg:      #fffaf8;  /* RSVP dialog surface */
  --c-error:         #a3352f;

  /* The countdown's gold sweep. 300% wide so it can be panned across the
     glyphs by animating background-position. */
  --grad-gold: linear-gradient(105deg,
    var(--c-gold-count)   0%,  var(--c-gold-count)  25%,
    var(--c-gold-shine-1) 46%, var(--c-gold-shine-2) 52%,
    var(--c-gold-shine-1) 58%, var(--c-gold-count)  75%,
    var(--c-gold-count)  100%);

  /* ── Type ───────────────────────────────────────────────────────────── */
  --font: "IranNastaliq", "Noto Nastaliq Urdu", serif;

  /* Flat rem sizes, not clamp(). Nastaliq carries a lot of its detail in thin
     strokes and deep descenders, so the sizes a fluid scale bottoms out at on
     a phone were too small to read comfortably. Each value below is the one
     the original 1200px artboard used, applied at every width; the type stays
     legible on a phone and the layout absorbs it by wrapping.
     Sizes still respond to the reader's browser font-size setting, which is
     the one form of scaling that should never be overridden. */
  --fs-hero:    5rem;      /* 80px */
  --fs-h2:      2.5625rem; /* 41px */
  --fs-h3:      2rem;      /* 32px */
  --fs-count:   2.8125rem; /* 45px */
  --fs-body:    1.3125rem; /* 21px */
  --fs-body-sm: 1.25rem;   /* 20px */
  --fs-label:   1.1875rem; /* 19px */
  --fs-small:   1.0625rem; /* 17px */

  /* IranNastaliq's own metrics give a 2.71em line box (hhea ascent 3000,
     descent -2550, upem 2048). Nastaliq needs deep descenders, but left at
     the default every heading floats in dead space — so line-height is set
     explicitly per role and never inherited by accident. */
  --lh-display: 1.15;  /* hero names, headings — art-directed tight */
  --lh-body:    1.75;  /* prose: enough room for descenders to sweep */
  --lh-digit:   1.2;   /* countdown digits sit in a fixed-height cell */

  /* ── Space ──────────────────────────────────────────────────────────── */
  --col:        35rem;                        /* 560px content column */
  --page-max:   75rem;                        /* 1200px original artboard */
  --gutter:     clamp(1rem, 4vw, 2rem);
  --section-pad: clamp(3rem, 8vw, 5.5rem);

  --s-1: 0.5rem;   --s-2: 1rem;    --s-3: 1.5rem;
  --s-4: 2.5rem;   --s-5: 4rem;    --s-6: 6rem;

  /* ── Radii ──────────────────────────────────────────────────────────── */
  --r-btn:   20px;
  --r-field: 5px;
  --r-map:   15px;

  /* ── Depth ──────────────────────────────────────────────────────────── */
  --z-art-behind: 0;   /* ornaments sit behind content by default */
  --z-content:    1;
  --z-art-front:  2;   /* …except the wreath framing the couple photo */

  /* ── Motion ─────────────────────────────────────────────────────────── */
  --dur-reveal: 900ms;
  --dur-flip:   550ms;
  --ease-out:   cubic-bezier(0.22, 0.61, 0.36, 1);
}
