/* Godam Leaf Inn · v6.1 palette: white, black, and one light grey — nothing else.
 * Every other tone below is one of these three mixed together (a softer black for
 * secondary text, a slightly deeper grey for hairlines), so the UI stays monochrome
 * and the photos carry all the colour. */
:root {
  --mono-white: oklch(100% 0 0);          /* #FFFFFF */
  --mono-black: oklch(16% 0 0);           /* #0D0D0D */
  --mono-grey: oklch(95.2% 0.001 95);     /* #F0F0EF — the light "gallery" grey */

  --color-paper: var(--mono-white);
  --color-paper-raised: var(--mono-white);
  --color-surface: var(--mono-grey);
  --color-ink: var(--mono-black);
  --color-ink-soft: color-mix(in oklch, var(--mono-black) 62%, var(--mono-white));
  --color-accent: color-mix(in oklch, var(--mono-black) 78%, var(--mono-white));
  --color-accent-soft: var(--mono-grey);
  --color-rule: color-mix(in oklch, var(--mono-black) 11%, var(--mono-white));
  --color-scrim: oklch(16% 0 0 / 0.62);
  --color-scrim-soft: oklch(16% 0 0 / 0.25);
  --color-focus: var(--mono-black);
  --color-white: var(--mono-white);
  --color-alert: var(--mono-black);
  --font-display: "Inter Tight", "Helvetica Neue", Helvetica, sans-serif;
  --font-body: "Inter Tight", "Helvetica Neue", Helvetica, sans-serif;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;
  --text-display: clamp(3.8rem, 7.6vw, 7.5rem);
  --text-section: clamp(2.9rem, 5.5vw, 5.25rem);
  --text-card: clamp(2.25rem, 4vw, 4rem);
  --ease-out: cubic-bezier(.2, .7, .2, 1);
  --ease-in: cubic-bezier(.4, 0, 1, 1);
  --ease-in-out: cubic-bezier(.4, 0, .2, 1);
  --dur-fast: 180ms;
  --dur-base: 260ms;
  --dur-slow: 400ms;
  --radius-card: 20px;
  --radius-small: 12px;
  --radius-pill: 999px;
  --rule-thin: 1px;
  --page-gutter: clamp(20px, 4.2vw, 60px);
  --max-width: 1440px;
}

@media (max-width: 767px) {
  :root {
    --page-gutter: 20px;
    --space-32: 88px;
    --space-24: 72px;
    --space-20: 56px;
  }
}
