:root {

  /* ── Colors ─────────────────────────────────────────── */
  --ink-black:      #1A1A1A;
  --parchment:      #F1E8D0;
  --cloud-white:    #FAFAF7;
  --aged-sepia:     #B89668;
  --atlas-blue:     #7A99B0;
  --soft-rose:      #E2BFB1;
  --compass-red:    #C8453A;
  --compass-red-dark: #a3362e; /* button hover */
  --stone-gray:     #6B6B68;

  /* Semantic aliases */
  --color-surface-primary: var(--parchment);
  --color-surface-card:    var(--cloud-white);
  --color-text-primary:    var(--ink-black);
  --color-text-muted:      var(--stone-gray);
  --color-border:          var(--aged-sepia);
  --color-cta:             var(--compass-red);
  --color-link:            var(--atlas-blue);
  --color-error:           var(--compass-red);

  /* ── Typography ─────────────────────────────────────── */
  --font-display: "Playfair Display", serif;
  --font-body:    "Lato", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-accent:  "Mansalva", system-ui, -apple-system, BlinkMacSystemFont, cursive;

  /* ── Spacing ─────────────────────────────────────────── */
  --space-1:  4px;   /* inferred */
  --space-2:  8px;   /* inferred */
  --space-3:  12px;  /* inferred */
  --space-4:  16px;  /* inferred */
  --space-5:  20px;  /* inferred */
  --space-6:  24px;  /* container padding = 1.5rem */
  --space-8:  32px;  /* inferred */
  --space-10: 40px;  /* inferred */
  --space-12: 48px;  /* = --section-padding-mobile */
  --space-16: 64px;  /* inferred */
  --space-20: 80px;  /* = --section-padding-desktop */
  --space-24: 96px;  /* hero top padding */

  /* Layout */
  --max-width:               1180px;
  --reading-width:           720px;
  --section-padding-desktop: 80px;
  --section-padding-mobile:  48px;

  /* ── Borders & Radius ───────────────────────────────── */
  --card-radius:  4px;
  --radius-sm:    2px;   /* inferred; polaroid inset, stamps, tags */
  --radius-md:    4px;   /* buttons, cards, inputs = --card-radius */
  --radius-pin:   999px; /* map pins, push pins */

  /* ── Shadows ─────────────────────────────────────────── */
  --shadow-sm:           0 4px 10px rgba(0, 0, 0, 0.06);
  --shadow-md:           0 10px 24px rgba(0, 0, 0, 0.12);
  --shadow-lg:           0 14px 36px rgba(0, 0, 0, 0.2);
  --shadow-btn-primary:  0 8px 18px rgba(200, 69, 58, 0.22);
  --shadow-btn-secondary:0 6px 14px rgba(0, 0, 0, 0.2);
  --shadow-focus:        0 0 0 3px rgba(122, 153, 176, 0.25);
  --shadow-focus-error:  0 0 0 2px rgba(200, 69, 58, 0.18);
  --shadow-pin:          0 0 0 4px rgba(200, 69, 58, 0.3);

  /* ── Motion ──────────────────────────────────────────── */
  --transition-fast:   200ms ease;
  --duration-fast:     200ms;   /* UI hover states */
  --duration-base:     300ms;   /* inferred; scroll reveals */
  --duration-slow:     600ms;   /* inferred; SVG draw-ins */
  --ease-default:      ease;
  --ease-out:          cubic-bezier(0, 0, 0.2, 1); /* inferred */

}