/* ============================================================
   TOKENS — the re-skin layer.
   The entire visual identity of the site lives in this file:
   colors, fonts, texture, shape, motion. main.css only ever
   references these variables, so changing the design language
   (fiesta pop, travel poster, disco tropical, …) means editing
   or swapping THIS file and the Google Fonts <link> — nothing else.

   Current theme: "Sunset neutral" — a warm, classy placeholder
   direction while the real creative direction develops.
   ============================================================ */

:root {
  /* ---- Color: core ---- */
  --paper:        #fdf6ee;   /* page background */
  --paper-tint:   #faeddd;   /* alternating section background */
  --ink:          #33241f;   /* body text */
  --ink-soft:     #6e5a50;   /* secondary text */

  /* ---- Color: accents ---- */
  --accent:       #d4543c;   /* primary accent — terracotta sunset */
  --accent-2:     #e89b3c;   /* secondary accent — mango */
  --accent-3:     #1e7f74;   /* tertiary accent — palm teal */
  --accent-ink:   #ffffff;   /* text on accent backgrounds */
  --accent-2-ink: #33241f;   /* text on accent-2 (buttons, chips) */

  /* ---- Form fields (gate input) ---- */
  --field-bg:     rgba(255, 255, 255, 0.92);
  --field-ink:    #33241f;

  /* ---- Color: hero & gate wash ---- */
  --wash: linear-gradient(170deg, #2b1a3d 0%, #7a2d4e 45%, #d4543c 80%, #e89b3c 100%);
  --wash-ink:      #fff6ec;  /* text on the wash */
  --wash-ink-soft: #f7d9bd;

  /* ---- Type ---- */
  --font-display: "Fraunces", Georgia, serif;
  --font-text:    "Outfit", "Helvetica Neue", Arial, sans-serif;
  --display-weight: 560;
  --display-italic-style: italic;   /* set to normal to kill italic flourishes */
  --scale-hero:   clamp(2.4rem, 8vw, 5rem);
  --scale-h2:     clamp(1.7rem, 5vw, 2.6rem);
  --scale-body:   1.06rem;

  /* ---- Shape & texture ---- */
  --radius:       18px;
  --radius-small: 10px;
  --card-bg:      #ffffff;
  --card-border:  1px solid #eadbc9;
  --card-shadow:  0 10px 30px -18px rgba(51, 36, 31, 0.35);
  --slot-border:  2px dashed #d9c3a8;  /* photo placeholder slots */

  /* ---- Motion ---- */
  --reveal-shift: 18px;
  --reveal-time:  0.6s;
}