/* ============================================================================
   YOGAMO × SIGNE SØNDERGAARD — Virksomhedsretreat
   DESIGN TOKENS  (single source of truth — do not hardcode values elsewhere)
   ----------------------------------------------------------------------------
   Brief-låste inputs:
     bg        #f5e9dc   (varm creme)
     kant      #e8cebc   (blød fersken/sand)
     tekst     #5a665a   (salviegrøn / eucalyptus)
     skrift    Futura + Futura PT i forskellige weights
   Vibe: åbenhed · varme · nærvær · feminin · sundhed · classyness · loose
   ========================================================================== */

:root {
  /* ---- CORE PALETTE -------------------------------------------------
     Brief-baseret, men trukket ~5-10% lysere & friskere væk fra sand/brun
     pr. kundeønske. Samme nuancer — bare renere og luftigere. */
  --c-bg:            #f7f1e8;  /* baggrund — lys, frisk creme       */
  --c-edge:          #eed9c9;  /* kant/linjer/bølger — frisk fersken */
  --c-ink:           #566a5b;  /* primær tekst — frisk salviegrøn   */

  /* ---- AFLEDTE TONER (harmonisk udvidelse af de 3 kernefarver) ------- */
  --c-bg-soft:       #fbf6ee;  /* lysere creme — kort/felter         */
  --c-bg-deep:       #f1e5d7;  /* blød sand — alternerende sektion   */
  --c-cream-0:       #fefcf8;  /* næsten hvid — input/felt-flader    */

  --c-ink-strong:    #3c4a41;  /* mørk frisk salvie — overskrifter   */
  --c-ink-soft:      #78867c;  /* dæmpet salvie — sekundær tekst     */
  --c-ink-faint:     #a6b0a6;  /* meget let — labels/hjælpetekst     */

  --c-edge-deep:     #e2c5ad;  /* dybere fersken — hover/aktive kanter */
  --c-accent:        #cc8e6a;  /* terracotta — sparsom highlight/CTA  */
  --c-accent-soft:   #ecccb4;  /* lys terracotta — badges/wash        */

  --c-white:         #ffffff;
  --c-shadow:        rgba(63, 74, 64, 0.14);  /* salvie-tonet skygge   */
  --c-shadow-soft:   rgba(63, 74, 64, 0.07);
  --c-overlay-warm:  rgba(90, 70, 50, 0.28);  /* billede-tekst overlay */

  /* ---- TYPOGRAFI ----------------------------------------------------- */
  /* Render-stack: Futura PT (Adobe) → Futura (lokal) → Jost (web-stand-in) */
  --font-display: "Futura PT", "Futura", "Jost", "Century Gothic", "Avenir Next", system-ui, sans-serif;
  --font-body:    "Futura PT", "Futura", "Jost", "Century Gothic", "Avenir Next", system-ui, sans-serif;

  /* Weights (Futura PT-skala) */
  --fw-light:   300;
  --fw-book:    400;
  --fw-medium:  500;
  --fw-demi:    600;
  --fw-bold:    700;
  --fw-heavy:   800;

  /* Rolle-weights — TYND, elegant, feminin profil (ikke robust).
     Overskrifter bæres af STØRRELSE + luft, ikke af tykkelse. */
  --fw-display: var(--fw-light);    /* 300 — hero, stort & let           */
  --fw-h1:      var(--fw-book);     /* 400                                */
  --fw-h2:      var(--fw-book);     /* 400 — sektionsoverskrifter         */
  --fw-h3:      var(--fw-medium);   /* 500                                */
  --fw-h4:      var(--fw-medium);   /* 500 — kort-titler                  */
  --fw-lead:    var(--fw-light);    /* 300 — manchet, luftig              */
  --fw-body:    var(--fw-book);     /* 400                                */
  --fw-eyebrow: var(--fw-medium);   /* 500 caps                           */
  --fw-btn:     var(--fw-book);     /* 400 — slank knaptekst              */

  /* Fluid type-skala (clamp: min .. viewport .. max) */
  --fs-eyebrow:   clamp(0.72rem, 0.68rem + 0.2vw, 0.82rem);
  --fs-small:     clamp(0.84rem, 0.80rem + 0.2vw, 0.92rem);
  --fs-body:      clamp(1.0rem,  0.96rem + 0.3vw, 1.13rem);
  --fs-lead:      clamp(1.18rem, 1.05rem + 0.7vw, 1.45rem);
  --fs-h4:        clamp(1.08rem, 1.0rem + 0.35vw, 1.28rem);
  --fs-h3:        clamp(1.28rem, 1.15rem + 0.6vw, 1.6rem);
  --fs-h2:        clamp(1.55rem, 1.35rem + 1.0vw, 2.2rem);
  --fs-h1:        clamp(1.85rem, 1.55rem + 1.2vw, 2.55rem);
  --fs-display:   clamp(1.95rem, 1.6rem + 1.3vw, 2.75rem);

  --lh-tight:   1.02;
  --lh-snug:    1.16;
  --lh-normal:  1.5;
  --lh-loose:   1.7;

  --ls-tight:   -0.02em;
  --ls-normal:  0;
  --ls-wide:    0.04em;
  --ls-eyebrow: 0.22em;   /* uppercase labels */

  /* ---- SPACING (4px base) ------------------------------------------- */
  --sp-1:  0.25rem;  --sp-2: 0.5rem;   --sp-3: 0.75rem;  --sp-4: 1rem;
  --sp-5:  1.5rem;   --sp-6: 2rem;     --sp-7: 3rem;     --sp-8: 4rem;
  --sp-9:  6rem;     --sp-10: 8rem;    --sp-11: 11rem;

  /* Sektions-rytme (luftig, magasin-agtig) */
  --section-y:   clamp(4.5rem, 3rem + 7vw, 9rem);
  --gutter:      clamp(1.25rem, 0.5rem + 3vw, 3rem);

  /* ---- LAYOUT -------------------------------------------------------- */
  --maxw:        1240px;   /* fuld container        */
  --maxw-text:   62ch;     /* læsbar tekstbredde     */
  --maxw-narrow: 880px;    /* form / fokus-indhold   */

  /* ---- RADIER (bløde, organiske, feminine) -------------------------- */
  --r-xs:    8px;
  --r-sm:    14px;
  --r-md:    22px;
  --r-lg:    32px;
  --r-xl:    48px;
  --r-pill:  999px;
  /* ÉN konsistent, STOR billed-radius på ALLE fotos/video (ingen arch/portal, ingen blob) */
  --r-img:   12px;

  /* ---- SKYGGER ------------------------------------------------------- */
  --shadow-sm:  0 2px 10px var(--c-shadow-soft);
  --shadow-md:  0 14px 40px var(--c-shadow-soft), 0 4px 12px var(--c-shadow-soft);
  --shadow-lg:  0 30px 70px var(--c-shadow), 0 10px 24px var(--c-shadow-soft);
  --shadow-img: 0 24px 60px rgba(63, 74, 64, 0.20);

  /* ---- BORDERS ------------------------------------------------------- */
  --bw:         1.5px;
  --border:     var(--bw) solid var(--c-edge);
  --border-ink: var(--bw) solid var(--c-ink);

  /* ---- MOTION (blid, nærværende — aldrig hektisk) ------------------- */
  --ease-soft:  cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast:   180ms;
  --dur:        420ms;
  --dur-slow:   800ms;

  /* ---- Z-INDEX ------------------------------------------------------- */
  --z-base: 1; --z-raised: 10; --z-sticky: 100; --z-overlay: 1000; --z-modal: 2000;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur: 0ms; --dur-slow: 0ms; }
}
