/* Zen w/ Jen design tokens — ACSS-aligned names.
   Loaded on the front end, in the editor canvas, AND in the admin document
   so theme.json's var() palette resolves in editor color pickers. */
:root {
  /* COLOR — Primary · Sage "Drift" */
  --primary-ultra-light: #eaf0ee;
  --primary-light:       #c9d8d3;
  --primary-semi-light:  #bccec8;
  --primary:             #aec4be;
  --primary-semi-dark:   #8aa8a1;
  --primary-dark:        #6b8b83;
  --primary-ultra-dark:  #46615b;
  --primary-hover:       #9bb5ae;

  /* COLOR — Secondary · Ocean Blue */
  --secondary-ultra-light: #e1ecf0;
  --secondary-light:       #a9c8d3;
  --secondary-semi-light:  #8db5c3;
  --secondary:             #6f9fb3;
  --secondary-semi-dark:   #5c8a9d;
  --secondary-dark:        #4a7a8d;
  --secondary-ultra-dark:  #2e5060;
  --secondary-hover:       #5f93a8;

  /* COLOR — Tertiary · Sun Yellow */
  --tertiary-ultra-light: #fcf0cf;
  --tertiary-light:       #f8dd96;
  --tertiary-semi-light:  #f6d37a;
  --tertiary:             #f4c95b;
  --tertiary-semi-dark:   #e8b73f;
  --tertiary-dark:        #d9a92e;
  --tertiary-ultra-dark:  #a87e1a;
  --tertiary-hover:       #eebe45;

  /* COLOR — Accent · Light Salmon */
  --accent-ultra-light: #fceae4;
  --accent-light:       #f8c8b8;
  --accent-semi-light:  #f6b4a0;
  --accent:             #f4a28c;
  --accent-semi-dark:   #ed8e76;
  --accent-dark:        #a84e3b;
  --accent-ultra-dark:  #8c3e2e;
  --accent-hover:       #ef9479;

  /* COLOR — Blossom Pink */
  --blossom-ultra-light: #fbeaec;
  --blossom-light:       #f8d6d9;
  --blossom:             #f2b6bb;
  --blossom-dark:        #e08a92;
  --blossom-ultra-dark:  #b85d66;

  /* COLOR — Base */
  --base:            #f9fff7;
  --bg-ultra-light:  #fcfbf6;
  --bg-light:        #f4f1e7;
  --bg-sand:         #e9dfca;
  --bg-dark:         #2e3a39;
  --bg-ultra-dark:   #193d40;
  --body-bg-color:   var(--base);
  --white:           #ffffff;
  --black:           #14201f;

  /* COLOR — Neutral */
  --neutral-ultra-light: #f1efe6;
  --neutral-light:       #d9d3c4;
  --neutral:             #6e7c7a;
  --neutral-dark:        #4a5655;
  --neutral-ultra-dark:  #2e3a39;
  --text:                #2e3a39;
  --text-muted:          #6e7c7a;
  --heading-color:       #193d40;
  --border-color:        #e4decf;

  /* COLOR — Semantic / status */
  --info:    #6f9fb3;
  --success: #7fa88a;
  --warning: #f4c95b;
  --danger:  #d96b5a;

  /* TYPOGRAPHY */
  --heading-font-family: "Fraunces", Georgia, "Times New Roman", serif;
  --text-font-family:    "DM Sans", -apple-system, BlinkMacSystemFont, sans-serif;
  --script-font-family:  "Caveat", "Segoe Script", cursive;

  --h1: clamp(2.75rem, 1.9rem + 4.2vw, 5rem);
  --h2: clamp(2.15rem, 1.6rem + 2.7vw, 3.5rem);
  --h3: clamp(1.7rem, 1.4rem + 1.5vw, 2.5rem);
  --h4: clamp(1.4rem, 1.25rem + 0.8vw, 1.85rem);
  --h5: clamp(1.2rem, 1.12rem + 0.4vw, 1.4rem);
  --h6: clamp(1.05rem, 1rem + 0.25vw, 1.15rem);

  --heading-line-height:    1.08;
  --heading-letter-spacing: -0.015em;
  --heading-weight:         600;

  --text-xs:  clamp(0.75rem, 0.72rem + 0.15vw, 0.8125rem);
  --text-s:   clamp(0.875rem, 0.85rem + 0.15vw, 0.9375rem);
  --text-m:   clamp(1rem, 0.96rem + 0.2vw, 1.0625rem);
  --text-l:   clamp(1.125rem, 1.06rem + 0.3vw, 1.25rem);
  --text-xl:  clamp(1.3rem, 1.2rem + 0.5vw, 1.5rem);
  --text-xxl: clamp(1.5rem, 1.35rem + 0.75vw, 1.875rem);

  --text-line-height:    1.7;
  --text-letter-spacing: 0;

  --eyebrow-letter-spacing: 0.18em;
  --eyebrow-size:           var(--text-xs);

  /* SPACING */
  --space-xs:  clamp(0.5rem, 0.45rem + 0.25vw, 0.75rem);
  --space-s:   clamp(0.875rem, 0.8rem + 0.4vw, 1.25rem);
  --space-m:   clamp(1.25rem, 1.1rem + 0.75vw, 2rem);
  --space-l:   clamp(2rem, 1.7rem + 1.5vw, 3.25rem);
  --space-xl:  clamp(3rem, 2.5rem + 2.5vw, 5rem);
  --space-xxl: clamp(4.5rem, 3.6rem + 4.5vw, 8rem);

  --section-space-s:   clamp(2.5rem, 2rem + 2.5vw, 4rem);
  --section-space-m:   clamp(3.5rem, 2.8rem + 3.5vw, 6rem);
  --section-space-l:   clamp(4.5rem, 3.5rem + 5vw, 8rem);
  --section-space-xl:  clamp(6rem, 4.5rem + 7vw, 10rem);

  --content-width:   75rem;
  --content-narrow:  44rem;
  --gutter:          clamp(1.25rem, 0.8rem + 2.25vw, 2.5rem);
  --container-gap:   var(--space-l);
  --content-gap:     var(--space-s);
  --grid-gap:        var(--space-m);

  /* RADII · BORDERS · SHADOWS · MOTION */
  --radius-s:     0.375rem;
  --radius:       0.625rem;
  --radius-l:     1.25rem;
  --radius-xl:    2rem;
  --radius-round: 999px;

  --border:       1px solid var(--border-color);
  --border-width: 1px;

  --shadow-s:  0 1px 2px rgba(25, 61, 64, 0.06), 0 2px 6px rgba(25, 61, 64, 0.05);
  --shadow-m:  0 4px 10px rgba(25, 61, 64, 0.07), 0 10px 24px rgba(25, 61, 64, 0.06);
  --shadow-l:  0 12px 28px rgba(25, 61, 64, 0.10), 0 24px 56px rgba(25, 61, 64, 0.08);
  --shadow-photo: 0 2px 4px rgba(25, 61, 64, 0.10), 0 14px 30px rgba(25, 61, 64, 0.12);

  --transition-duration: 0.3s;
  --transition-timing:   cubic-bezier(0.4, 0, 0.2, 1);
  --transition:          var(--transition-duration) var(--transition-timing);
}
