/* ============================================================
   Kahyve — design tokens
   Custom properties only. Load before site.css.
   Fonts are loaded from Google Fonts in each page's <head>.
   ============================================================ */

:root {
  /* ---- Colour: dark surfaces ------------------------------ */
  --c-bg:          #17100C;   /* espresso — default page surface */
  --c-roast:       #2B1A11;   /* lifted dark, hero gradient      */
  --c-brown:       #5E3A24;   /* icon tiles                      */
  --c-brown-hover: #6D4429;
  --c-bean:        #6E4027;   /* decorative beans                */
  --c-cream:       #F8E1CD;   /* text on dark                    */
  --c-caramel:     #D8A480;   /* accent on dark                  */
  --c-gold:        #C8963E;   /* filled buttons, highlights      */

  /* ---- Colour: light surfaces ----------------------------- */
  --c-paper:       #F6EDE2;
  --c-paper-2:     #EFE1CF;   /* inset panels, chips             */
  --c-card:        #FFFBF6;
  --c-ink:         #241710;   /* text on light and on gold       */
  --c-muted:       #5E4A3B;   /* secondary text on light         */
  --c-caramel-deep:#8C5A34;   /* accent on light (AA on paper)   */

  /* ---- Colour: roles (re-pointed by .light) --------------- */
  --c-accent: var(--c-caramel);
  --c-rule:   rgba(248, 225, 205, .35);

  /* ---- Type families -------------------------------------- */
  --f-display: "Instrument Serif", Georgia, serif;
  --f-body:    "Nunito Sans", system-ui, -apple-system, sans-serif;

  /* ---- Display scale (serif) ------------------------------ */
  --fs-hero: 20vw;          /* hero wordmark, bleeds edge to edge */
  --fs-d1:   6.5rem;        /* section titles                     */
  --fs-d2:   4rem;          /* sub-section titles                 */
  --fs-d3:   2rem;          /* card and list titles               */
  --lh-display: .8;
  --ls-display: -1px;

  /* ---- UI / body scale (sans) ----------------------------- */
  --fs-eyebrow: 1.25rem;
  --fs-lead:    1.125rem;
  --fs-body:    1rem;
  --fs-btn:     .9375rem;
  --fs-nav:     .875rem;
  --fs-meta:    .8125rem;
  --fs-caption: .75rem;
  --lh-body:    1.5;
  --ls-eyebrow: 3px;
  --ls-meta:    1px;

  /* ---- Spacing -------------------------------------------- */
  --space-1: 1rem;
  --space-2: 1.5rem;
  --space-3: 2rem;
  --space-4: 3rem;
  --space-5: 4.5rem;

  /* ---- Layout --------------------------------------------- */
  --container: 1440px;
  --gutter:    32px;
  --measure:   582px;       /* max line length for body copy      */
  --section-y: 100px;       /* vertical section padding           */
  --header-h:  100px;

  /* ---- Shape ---------------------------------------------- */
  --radius:    20px;        /* photos, large cards                */
  --radius-sm: 12px;        /* tiles, small panels                */
  --pill:      999px;       /* buttons, chips                     */
  --rule:      1px;

  /* ---- Motion --------------------------------------------- */
  --ease: cubic-bezier(.22, .61, .36, 1);
  --dur:  .45s;
}

/* Breakpoints (not expressible as custom properties):
   1024px tablet landscape · 768px tablet portrait · 480px phone */