/* Hallmark · route: custom (bespoke) · structure: blooming botanical letter · idea: "un baile que se volvió hogar"
 * paper: oklch(97.93% 0.007 88.64) · accent: oklch(52% 0.12 136)
 * script: Italianno · gate title: Cinzel · display: Cormorant Garamond · gate: Montserrat · body: Atkinson Hyperlegible Next
 * axes: light / romantic-editorial / chromatic-sage · enrichment: ImageGen watercolor suite · v2.0.0
 */

:root {
  color-scheme: light;

  /* Paper and ink */
  --color-white: #fff;
  --color-paper: oklch(97.93% 0.007 88.64);
  --color-paper-2: oklch(95.43% 0.0136 78.26);
  --color-paper-3: oklch(93.93% 0.0156 126.83);
  --color-paper-deep: oklch(93.87% 0.016 82.79);
  --color-ink: oklch(28.91% 0.012 128);
  --color-ink-2: oklch(42.16% 0.037 132.07);
  --color-muted: oklch(46.75% 0.0098 91.58);
  --color-placeholder: oklch(54.94% 0.0099 84.59);

  /* Botanical identity */
  --color-sage: oklch(72.88% 0.0585 128.92);
  --color-sage-mist: oklch(80.36% 0.0394 126.85);
  --color-sage-wash: oklch(93.93% 0.0156 126.83);
  --color-olive: oklch(49.19% 0.0418 130.19);
  --color-olive-deep: oklch(42.16% 0.037 132.07);
  --color-night: oklch(24.5% 0.027 126.5);
  --color-night-soft: oklch(31.5% 0.034 125.5);
  --color-night-rule: oklch(81% 0.052 87 / 0.34);
  --color-accent: oklch(52% 0.12 136);
  --color-accent-ink: oklch(97.93% 0.007 88.64);
  --color-wine: oklch(43% 0.075 18);

  /* Champagne details */
  --color-gold: oklch(74.5% 0.0895 81.67);
  --color-gold-deep: oklch(52.21% 0.0797 82.72);
  --color-rule: oklch(74.5% 0.0895 81.67 / 0.34);
  --color-rule-soft: oklch(74.5% 0.0895 81.67 / 0.22);
  --color-focus: oklch(55% 0.18 136);
  --color-focus-dark: oklch(83% 0.11 88);

  /* Form and reserved-colour states */
  --color-swatch-white: oklch(98.5% 0.006 88.64);
  --color-swatch-beige: oklch(86.16% 0.0366 83.77);
  --color-swatch-green: oklch(58.57% 0.0523 132.86);
  --color-error: oklch(48% 0.16 28);
  --color-success: oklch(47% 0.12 145);

  /* Transparent surfaces and shadows */
  --color-paper-glass: oklch(97.93% 0.007 88.64 / 0.88);
  --color-paper-veil: oklch(97.93% 0.007 88.64 / 0.72);
  --color-disabled-rule: oklch(46.75% 0.0098 91.58 / 0.28);
  --color-swatch-outline: oklch(28.91% 0.012 128 / 0.24);
  --shadow-paper: 0 22px 62px oklch(42.16% 0.037 132.07 / 0.14);
  --shadow-envelope: drop-shadow(0 22px 18px oklch(42.16% 0.037 132.07 / 0.18));
  --shadow-card: 0 8px 24px oklch(42.16% 0.037 132.07 / 0.07);

  /* Type: formal display paired with a body designed for character recognition */
  --font-script: "Cinzel", "Times New Roman", serif;
  --font-gate-title: "Cinzel", "Times New Roman", serif;
  --font-display: "Cinzel", "Times New Roman", serif;
  --font-gate: "Montserrat", "Avenir Next", "Helvetica Neue", sans-serif;
  --font-body: "Montserrat", "Avenir Next", "Helvetica Neue", sans-serif;

  /* Major-third type scale, raised for older guests */
  --text-xs: 0.875rem;
  --text-sm: 1rem;
  --text-base: 1.1875rem;
  --text-md: 1.25rem;
  --text-lg: 1.5625rem;
  --text-xl: 1.953rem;
  --text-2xl: 2.441rem;
  --text-3xl: 3.052rem;
  --text-4xl: 3.815rem;
  --text-display: clamp(3rem, 7vw + 0.25rem, 4.9rem);

  /* The letter is read at one width: a phone column, on every screen */
  --sheet-max: 580px;
  --page-backdrop:
    url("./assets/botanical/pattern-olive-background.webp") 0 0 / 340px auto repeat,
    var(--color-sage-wash);

  /* One vertical rhythm and one gutter for every band of the letter */
  --section-y: var(--space-3xl);
  --section-gutter: clamp(var(--space-md), 8vw, 92px);

  /* Shared measure: every band aligns its content to the same column */
  --content-max: 1180px;
  --content-wide: 1320px;

  /* Four-point spacing scale */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;
  --space-4xl: 8rem;
  --space-5xl: 10rem;

  /* Torn-paper edge used to hand one section over to the next */
  --torn-edge: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 80' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M0 42 38 12 72 48 104 18 140 54 168 22 206 50 246 14 278 46 318 20 352 56 390 24 428 50 462 12 500 44 536 20 574 54 612 26 648 46 688 16 722 52 760 22 798 44 836 18 872 54 910 24 948 42 986 14 1022 50 1060 22 1098 48 1136 18 1170 44 1200 26V80H0Z'/%3E%3C/svg%3E");

  /* Motion */
  --duration-fast: 180ms;
  --duration-medium: 420ms;
  --duration-slow: 760ms;
  --ease-out: cubic-bezier(0.22, 0.8, 0.24, 1);
}