/* ==========================================================================
   The Goa Wedding Co. — design tokens
   --------------------------------------------------------------------------
   Every colour here is sampled from the brand logo, so the site and the mark
   are the same object rather than two things that happen to sit together.

     #003D42  the deep petrol teal of the wordmark and the waves — dominant
     #EAE5DC  the paper the mark is printed on — our page ground
     #C89B3C  the gold of the sunburst rays — the one call-to-action colour
     #2E5A22  the palm green — hairlines and small marks

   The teal is deliberately far darker and bluer than the sister studio's
   #1B7B6E. At a glance the two brands must not look related.
   ========================================================================== */

:root {
  /* ---- colour ---------------------------------------------------------- */
  --marine:         #003D42;  /* logo wordmark teal — dominant field */
  --marine-lift:    #0B535A;  /* one step up, for hover and inner panels */
  --tinta:          #04252A;  /* near-black petrol — body text, footer */
  --limewash:       #F4EFE4;  /* the logo's paper, lifted for reading contrast */
  --limewash-warm:  #E9E2D3;  /* a shade deeper, for card fills and rules */
  --gold:           #C89B3C;  /* the sunburst rays — the one call-to-action colour */
  --gold-bright:    #E0B45B;  /* for gold text sitting on the teal */
  --palm:           #2E5A22;  /* the palm fronds — hairlines, small marks */

  /* Season band states. These carry meaning, so they are named for it. */
  --season-peak:    #C89B3C;
  --season-shoulder:#6E8C4A;
  --season-monsoon: #3E7480;
  --season-premium: #A85A32;

  /* ---- ink on ground --------------------------------------------------- */
  --ink:            var(--tinta);
  --ink-soft:       #40595C;
  --ink-faint:      #7B8B8C;
  --on-marine:      var(--limewash);
  --on-marine-soft: #A9C4C6;

  /* ---- type ------------------------------------------------------------ */
  /* Fraunces carries the personality: its optical-size and soft/wonk axes
     read like hand-cut colonial signpainting rather than a fashion serif.
     Archivo is the workhorse — a grotesque that holds up at signage sizes. */
  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body:    'Archivo', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --wght-display: 400;
  --wght-display-bold: 600;

  /* Fluid scale. Ratio tightens on small screens so headlines stay readable. */
  --t-xs:   0.75rem;
  --t-sm:   0.8125rem;
  --t-base: 1rem;
  --t-md:   clamp(1.0625rem, 0.4vw + 0.98rem, 1.1875rem);
  --t-lg:   clamp(1.25rem, 0.7vw + 1.1rem, 1.5rem);
  --t-xl:   clamp(1.5rem, 1.4vw + 1.2rem, 2.125rem);
  --t-2xl:  clamp(1.9rem, 2.6vw + 1.3rem, 3rem);
  --t-3xl:  clamp(2.4rem, 4.6vw + 1.35rem, 4.5rem);
  --t-4xl:  clamp(2.4rem, 4.4vw + 1.1rem, 4.4rem);

  --lh-tight: 1.04;
  --lh-snug:  1.22;
  --lh-body:  1.62;

  --track-eyebrow: 0.16em;
  --track-tight: -0.022em;

  /* ---- space ----------------------------------------------------------- */
  --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: 4rem;
  --s-9: 6rem;
  --s-10: 8rem;

  --section-y: clamp(3.5rem, 7vw, 7rem);
  --gutter: clamp(1.25rem, 4vw, 3rem);
  --measure: 62ch;
  --wrap: 1240px;
  --wrap-narrow: 780px;

  /* ---- form ------------------------------------------------------------ */
  /* Near-zero radius throughout, so nothing reads as a generic rounded web
     card. The logo's own geometry is crisp-edged; the page follows it. */
  --radius: 2px;
  --radius-pill: 999px;
  --hairline: 1px solid color-mix(in srgb, var(--tinta) 14%, transparent);
  --hairline-light: 1px solid color-mix(in srgb, var(--limewash) 22%, transparent);

  --shadow-lift: 0 1px 2px rgba(4, 37, 42, 0.06), 0 12px 32px -12px rgba(4, 37, 42, 0.22);
  --shadow-tile: 0 2px 0 0 color-mix(in srgb, var(--tinta) 10%, transparent);

  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --dur: 420ms;
}

/* Anyone who has asked their OS to calm down gets a calm page. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
