/* ==========================================================================
   Design tokens — extracted from Figma
   "Other website design" → Desktop-2 (node 2165:2)
   Every value below is lifted from the file, not invented.
   ========================================================================== */

:root {
  /* --- Surface reds -------------------------------------------------------
     The page is built from one oxblood family. Depth comes from how dark the
     red is, never from a grey or a shadow.                                  */
  --ink-deepest:  #2a0303;  /* gallery edge fade, page floor                 */
  --ink-form:     #2f0506;  /* stall-booking panel                           */
  --ink-hero:     #320605;  /* hero gradient base (rgb 50,6,5)               */
  --ink-faq:      #3b0e0d;  /* FAQ panel                                     */
  --ink-card:     #401211;  /* pass + gallery panel gradient top             */
  --ink-field:    #411213;  /* form inputs                                   */
  --ink-band:     #440405;  /* marquee band                                  */
  --ink-arch:     #460406;  /* arch silhouette fill (from the SVG itself)    */

  /* --- Gold ---------------------------------------------------------------
     One gold does nearly all the work: type, hairlines, borders, CTAs.      */
  --gold:         #dfbb83;
  --gold-deep:    #dab16a;  /* Submit button                                 */
  --gold-ink:     #332817;  /* type on gold — nav CTA                        */
  --gold-ink-alt: #44361c;  /* type on gold — Submit                         */
  --crimson-ink:  #752031;  /* type on gold — pass buttons                   */
  --rose:         #dfbaba;  /* long-form body copy                           */

  --gold-hair:    rgba(223, 187, 131, 0.3);   /* dashed form border          */
  --gold-line:    rgba(223, 187, 131, 0.18);  /* FAQ dividers                */
  --on-dark-mute: rgba(255, 255, 255, 0.44);  /* placeholders, chevrons      */

  /* --- Type ---------------------------------------------------------------
     Figma uses Erstoria (display), Inter Display (UI), Apple Garamond
     (numerals) and Bricolage Grotesque (pass buttons). Erstoria and Apple
     Garamond are not web-licensed here, so each is matched to its nearest
     Google equivalent — same contrast, same axis, same personality.         */
  --font-display: "Playfair Display", "Erstoria", Georgia, serif;
  --font-ui:      "Inter", "Inter Display", system-ui, -apple-system, sans-serif;
  --font-numeral: "EB Garamond", "Apple Garamond", Garamond, Georgia, serif;
  --font-button:  "Bricolage Grotesque", var(--font-ui);
  --font-gujarati:"Noto Sans Gujarati", "Noto Serif Gujarati", sans-serif;

  /* Figma's desktop sizes, expressed so they can shrink on small screens.
     clamp() floors are chosen to stay readable at 375px.                    */
  --fs-display:  clamp(2rem, 1.30rem + 2.98vw, 3rem);      /* 48px section heads */
  --fs-lede:     clamp(1.25rem, 1.05rem + 0.85vw, 1.75rem);/* 28px hero sub      */
  --fs-body:     clamp(1rem, 0.96rem + 0.17vw, 1.125rem);  /* 18px paragraph     */
  --fs-faq:      0.948rem;                                  /* 15.17px            */
  --fs-feature:  0.941rem;                                  /* 15.057px           */
  --fs-field:    0.824rem;                                  /* 13.187px           */
  --fs-price:    clamp(3rem, 2.10rem + 3.83vw, 4.404rem);  /* 70.464px           */
  --fs-nav:      1.75rem;                                   /* 28px               */
  --fs-contact:  1.08rem;                                   /* 17.284px           */

  /* --- Geometry -----------------------------------------------------------  */
  --r-panel:  50px;    /* pass + gallery panels   */
  --r-faq:    13.791px;
  --r-form:   17.819px;
  --r-field:  5.94px;
  --r-photo:  24px;
  --r-reel:   18.181px;
  --r-pill:   99px;

  --shell:      1440px;  /* Figma canvas                                     */
  --col-narrow: 887px;   /* FAQ + form column                                */
  --col-cards:  960px;   /* pass cards                                       */
  --col-wide:   1250px;  /* gallery                                          */
  --gutter:     clamp(1rem, 0.45rem + 2.3vw, 3.875rem);

  /* --- Motion -------------------------------------------------------------
     One easing family. Theatrical but controlled — never bouncy.            */
  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft:  cubic-bezier(0.33, 1, 0.68, 1);
  --t-fast:     180ms;
  --t-mid:      320ms;
  --t-slow:     640ms;

  --z-bg: 0;
  --z-content: 2;
  --z-menu: 60;
  --z-nav: 70;   /* above the sheet, so the burger's close state stays reachable */
}