/* Typefaces.
   Body / UI:  Figtree        — geometric-humanist, soft round terminals, high
                                x-height, wide apertures. Comfortable spacing and
                                very high readability at small sizes.
   Display:    Outfit          — wide, round, geometric. Open counters and generous
                                widths; set at 400 for headlines, 300 for large
                                title caps. Never below 20px.
   Both are freely licensed (Google Fonts). No brand font binaries were supplied;
   if licences exist for other faces, send the .woff2 files and this becomes
   local @font-face rules with no external dependency. */
/* latin-ext */
@font-face {
  font-family: 'Figtree';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/264e8ffd.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Figtree';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/2ef39b2a.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/assets/fonts/09d760a8.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/assets/fonts/dc22913b.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/09d760a8.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/dc22913b.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/09d760a8.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/dc22913b.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/09d760a8.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/dc22913b.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/09d760a8.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/dc22913b.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/assets/fonts/880fa527.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/assets/fonts/88f6f0f9.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/880fa527.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/88f6f0f9.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/880fa527.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/88f6f0f9.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/880fa527.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/fonts/88f6f0f9.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


:root {
  --font-display: "Outfit", system-ui, sans-serif;
  --font-sans: "Figtree", system-ui, -apple-system, sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", "Menlo", monospace;
  /* Second display register, taken from the mood board: the body face set in
     light, wide-tracked caps. Use for eyebrows and film-title moments. */
  --font-caps: var(--font-sans);
}

:root {
  /* ---- Base ramps ----------------------------------------------------
     Sampled from the mood board: sunlit dune, terracotta rock, and the
     midnight-navy twilight that closes the sequence. Paul's suit navy sits
     in the same family as the twilight sky. */

  /* Terracotta orange — the single accent. Warmed toward burnt sienna at the
     dark end so it reads like shadowed rock, not like a UI alert. */
  --orange-50: #FDF2E9; /* @kind color */
  --orange-100: #F9DCC2; /* @kind color */
  --orange-200: #F4BE93; /* @kind color */
  --orange-300: #EF9D67; /* @kind color */
  --orange-400: #F08544; /* @kind color */
  --orange-500: #E8701F; /* @kind color */
  --orange-600: #CB5613; /* @kind color */
  --orange-700: #A2400F; /* @kind color */
  --orange-800: #742D0D; /* @kind color */
  --orange-900: #4A1D0A; /* @kind color */

  /* Sand / dune — paper and warm fills. The pale end is limestone from the
     colonnade, the deep end is lit dune crest. */
  --sand-50: #FCF8F3; /* @kind color */
  --sand-100: #F5EDE2; /* @kind color */
  --sand-200: #EADCC9; /* @kind color */
  --sand-300: #DCC5A7; /* @kind color */
  --sand-400: #C6A87F; /* @kind color */
  --sand-500: #A9855A; /* @kind color */

  /* Stone — warm neutrals for text and quiet chrome. Brown bias throughout. */
  --stone-300: #C8C0B6; /* @kind color */
  --stone-400: #ABA096; /* @kind color */
  --stone-500: #8C8075; /* @kind color */
  --stone-600: #6E6459; /* @kind color */
  --stone-700: #524A41; /* @kind color */
  --stone-800: #37312A; /* @kind color */
  --stone-900: #201B16; /* @kind color */
  --stone-950: #14100C; /* @kind color */

  /* Midnight — the dusk-to-night blue. This is the brand's dark surface and
     its cool counterweight; it replaces a neutral black everywhere. */
  --navy-50: #EEF2F7; /* @kind color */
  --navy-100: #D6DFEB; /* @kind color */
  --navy-200: #AFC0D6; /* @kind color */
  --navy-300: #7C95B6; /* @kind color */
  --navy-500: #3C5B8A; /* @kind color */
  --navy-600: #2B4570; /* @kind color */
  --navy-700: #1D3153; /* @kind color */
  --navy-800: #132339; /* @kind color */
  --navy-900: #0C1727; /* @kind color */
  --navy-950: #070E19; /* @kind color */

  /* Legacy slate aliases — now point at the midnight family. */
  --slate-200: var(--navy-100); /* @kind color */
  --slate-300: var(--navy-200); /* @kind color */
  --slate-500: var(--navy-500); /* @kind color */
  --slate-700: var(--navy-700); /* @kind color */
  --slate-900: var(--navy-900); /* @kind color */

  /* Semantic hues, desaturated and warmed so they belong to the palette. */
  --green-100: #E3E9DC; /* @kind color */
  --green-500: #6B8558; /* @kind color */
  --green-700: #4A5F3B; /* @kind color */
  --amber-100: #FAEACB; /* @kind color */
  --amber-500: #CE9526; /* @kind color */
  --amber-700: #8F6412; /* @kind color */
  --red-100: #F5DED7; /* @kind color */
  --red-500: #AE4B34; /* @kind color */
  --red-700: #82311F; /* @kind color */

  --white: #FFFFFF; /* @kind color */
  --black: #000000; /* @kind color */

  /* ---- Semantic aliases ---------------------------------------------- */
  --accent: var(--orange-500); /* @kind color */
  --accent-hover: var(--orange-600); /* @kind color */
  --accent-press: var(--orange-700); /* @kind color */
  --accent-soft: var(--orange-50); /* @kind color */
  --accent-on: var(--white); /* @kind color */

  --text-strong: var(--stone-900); /* @kind color */
  --text-body: var(--stone-800); /* @kind color */
  --text-muted: var(--stone-600); /* @kind color */
  --text-subtle: var(--stone-500); /* @kind color */
  --text-inverse: var(--sand-50); /* @kind color */
  --text-accent: var(--orange-700); /* @kind color */
  --text-on-accent: var(--white); /* @kind color */

  --surface-page: var(--sand-50); /* @kind color */
  --surface-card: var(--white); /* @kind color */
  --surface-sunken: var(--sand-100); /* @kind color */
  --surface-raised: var(--white); /* @kind color */
  --surface-inverse: var(--navy-900); /* @kind color */
  --surface-accent: var(--orange-500); /* @kind color */
  --surface-quiet: var(--sand-200); /* @kind color */

  --border-hairline: rgba(32, 27, 22, 0.08); /* @kind color */
  --border-soft: rgba(32, 27, 22, 0.14); /* @kind color */
  --border-strong: rgba(32, 27, 22, 0.26); /* @kind color */
  --border-accent: var(--orange-500); /* @kind color */
  --border-inverse: rgba(214, 223, 235, 0.16); /* @kind color */

  --focus-ring: rgba(232, 112, 31, 0.42); /* @kind color */

  --success-fg: var(--green-700); /* @kind color */
  --success-bg: var(--green-100); /* @kind color */
  --warning-fg: var(--amber-700); /* @kind color */
  --warning-bg: var(--amber-100); /* @kind color */
  --danger-fg: var(--red-700); /* @kind color */
  --danger-bg: var(--red-100); /* @kind color */
  --info-fg: var(--navy-700); /* @kind color */
  --info-bg: var(--navy-100); /* @kind color */
}

:root {
  /* Sizes — 1.200 minor-third ramp off a 17px body. */
  --text-2xs: 11px;
  --text-xs: 12px;
  --text-sm: 14px;
  --text-base: 17px;
  --text-lg: 20px;
  --text-xl: 24px;
  --text-2xl: 30px;
  --text-3xl: 38px;
  --text-4xl: 48px;
  --text-5xl: 62px;
  --text-6xl: 80px;

  --leading-tight: 1.04; /* @kind other */
  --leading-snug: 1.16; /* @kind other */
  --leading-normal: 1.5; /* @kind other */
  --leading-relaxed: 1.65; /* @kind other */

  --weight-light: 300;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  /* Tracking. Geometric sans set in caps needs generous letterspacing;
     the slab display face is set tight. */
  /* Outfit is wide and open; a touch of negative tracking keeps large headlines
     from drifting apart. Figtree in caps needs a lot of positive tracking. */
  --tracking-display: -0.018em; /* @kind other */
  --tracking-normal: 0; /* @kind other */
  --tracking-wide: 0.04em; /* @kind other */
  --tracking-eyebrow: 0.2em; /* @kind other */
  --tracking-title-caps: 0.14em; /* @kind other */

  /* Semantic roles */
  --font-eyebrow: var(--font-sans);
  --measure-prose: 66ch; /* @kind other */
  --measure-narrow: 46ch; /* @kind other */
}

:root {
  /* 4px base, with a 6px half-step kept because the brand's inputs and chips
     sit on 10/14/18 rather than a strict 8-grid. */
  --space-0: 0px;
  --space-1: 2px;
  --space-2: 4px;
  --space-3: 6px;
  --space-4: 10px;
  --space-5: 14px;
  --space-6: 18px;
  --space-7: 24px;
  --space-8: 32px;
  --space-9: 44px;
  --space-10: 60px;
  --space-11: 80px;
  --space-12: 112px;
  --space-13: 152px;

  --gutter-page: 32px;
  --gutter-page-lg: 64px;
  --container-max: 1200px;
  --container-prose: 720px;
  --section-y: var(--space-12);
}

:root {
  /* Slightly rounded, never soft. Nothing above 20px except pills. */
  --radius-xs: 3px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 20px;
  --radius-pill: 999px;

  --radius-control: var(--radius-sm);
  --radius-card: var(--radius-lg);
  --radius-sheet: var(--radius-xl);
  --radius-media: var(--radius-md);
}

:root {
  /* Depth comes only from shadow and stacking — never from perspective or 3D forms.
     Shadows are warm-tinted (stone-900 at low alpha), two-part: a tight contact
     shadow plus a wide ambient one. */
  --shadow-0: none;
  --shadow-1: 0 1px 2px rgba(32, 27, 22, 0.06), 0 1px 1px rgba(32, 27, 22, 0.04);
  --shadow-2: 0 2px 4px rgba(32, 27, 22, 0.06), 0 6px 16px rgba(32, 27, 22, 0.07);
  --shadow-3: 0 4px 8px rgba(32, 27, 22, 0.07), 0 16px 32px rgba(32, 27, 22, 0.09);
  --shadow-4: 0 8px 16px rgba(32, 27, 22, 0.08), 0 32px 64px rgba(32, 27, 22, 0.12);
  --shadow-accent: 0 4px 10px rgba(203, 86, 19, 0.22), 0 14px 30px rgba(203, 86, 19, 0.18);

  /* Inner light — the top hairline that reads as gloss on raised surfaces. */
  --inset-gloss: inset 0 1px 0 rgba(255, 255, 255, 0.7);
  --inset-gloss-dark: inset 0 1px 0 rgba(255, 255, 255, 0.16);
  --inset-well: inset 0 1px 2px rgba(32, 27, 22, 0.1);

  --z-base: 0; /* @kind other */
  --z-raised: 10; /* @kind other */
  --z-sticky: 100; /* @kind other */
  --z-overlay: 500; /* @kind other */
  --z-modal: 1000; /* @kind other */
  --z-toast: 1500; /* @kind other */
}

:root {
  /* Restrained. Fades and short travel only — no bounce, no spring overshoot. */
  --duration-instant: 90ms; /* @kind other */
  --duration-fast: 140ms; /* @kind other */
  --duration-base: 220ms; /* @kind other */
  --duration-slow: 380ms; /* @kind other */
  --duration-reveal: 640ms; /* @kind other */

  --ease-standard: cubic-bezier(0.2, 0, 0, 1); /* @kind other */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --ease-in: cubic-bezier(0.6, 0, 1, 1); /* @kind other */

  --transition-control: color var(--duration-fast) var(--ease-standard),
    background-color var(--duration-fast) var(--ease-standard),
    border-color var(--duration-fast) var(--ease-standard),
    box-shadow var(--duration-base) var(--ease-standard),
    transform var(--duration-fast) var(--ease-standard); /* @kind other */
  --travel-hover: -1px; /* @kind other */
  --travel-press: 0px; /* @kind other */
  --scale-press: 0.985; /* @kind other */
}

:root {
  /* Glass — used for elements that float over content (sticky nav, overlays,
     badges on imagery). Always paired with a hairline border. There is no gloss,
     sheen or inner highlight anywhere in this system. */
  --glass-light-bg: rgba(255, 255, 255, 0.62);
  --glass-light-border: rgba(255, 255, 255, 0.7);
  --glass-tint-bg: rgba(252, 248, 243, 0.72);
  --glass-dark-bg: rgba(12, 23, 39, 0.58);
  --glass-dark-border: rgba(255, 255, 255, 0.14);
  --glass-blur: saturate(160%) blur(18px); /* @kind other */
  --glass-blur-strong: saturate(180%) blur(32px); /* @kind other */

  /* Protection gradients for text over imagery. */
  --scrim-bottom: linear-gradient(180deg, rgba(7, 14, 25, 0) 0%, rgba(7, 14, 25, 0.74) 100%); /* @kind other */
  --scrim-top: linear-gradient(180deg, rgba(7, 14, 25, 0.6) 0%, rgba(7, 14, 25, 0) 100%); /* @kind other */

  /* Surface washes. Two-stop, low-contrast, warm. */
  --wash-sand: linear-gradient(180deg, #FCF8F3 0%, #F5EDE2 100%); /* @kind other */
  /* Dusk: the twilight gradient from the mood board — navy deepening to night. */
  --wash-ink: linear-gradient(180deg, #1D3153 0%, #070E19 100%); /* @kind other */
  --wash-dusk: linear-gradient(180deg, #3C5B8A 0%, #132339 58%, #070E19 100%); /* @kind other */
  --wash-dune: linear-gradient(165deg, #EADCC9 0%, #C6A87F 52%, #A2400F 100%); /* @kind other */
  --wash-accent: linear-gradient(180deg, #F08544 0%, #CB5613 100%); /* @kind other */

  --hairline-top: linear-gradient(90deg, rgba(32,27,22,0) 0%, rgba(32,27,22,0.12) 50%, rgba(32,27,22,0) 100%); /* @kind other */
}

*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--surface-page);
  color: var(--text-body);
  font-family: var(--font-sans);
  font-size: var(--text-base);
  font-weight: var(--weight-regular);
  line-height: var(--leading-normal);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 400;
  line-height: var(--leading-snug);
  letter-spacing: var(--tracking-display);
  color: var(--text-strong);
  margin: 0;
  text-wrap: balance;
}

p { margin: 0; text-wrap: pretty; }

a { color: var(--text-accent); text-decoration: none; border-bottom: 1px solid rgba(232, 112, 31, 0.35); transition: color var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard); }
a:hover { color: var(--orange-500); border-bottom-color: var(--orange-500); }

::selection { background: var(--orange-100); color: var(--stone-900); }

:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}


html,body{margin:0;height:100%}
#scroller{height:100vh;height:100dvh;overflow-y:auto;overflow-x:hidden;background:var(--surface-page)}
.foot-link,a.foot-link,.legal a,[href^="tel:"],[href^="mailto:"]{border-bottom:0}
a.foot-link:hover{color:var(--sand-50)!important}
@media (max-width: 900px){
  :root{--gutter-page-lg:20px;--text-5xl:40px;--text-4xl:32px;--text-3xl:28px;--text-2xl:24px}
  #root [style*="grid-template-columns"]{grid-template-columns:1fr!important;gap:28px!important}
  #root .slot-grid[style]{grid-template-columns:1fr 1fr!important;gap:10px!important}
  #root section[style]{padding-top:56px!important;padding-bottom:56px!important}
  #root header[style]{height:auto!important;flex-wrap:wrap;row-gap:10px;padding-top:12px!important;padding-bottom:10px!important;gap:12px!important}
  #root header nav[style]{order:3;width:100%;margin-left:0!important;overflow-x:auto;scrollbar-width:none}
  #root header nav[style]::-webkit-scrollbar{display:none}
  #root header nav button{white-space:nowrap}
  #root header > *:last-child{margin-left:auto}
  #root header > div:first-child > span:first-child{font-size:17px!important}
  #root header > div:first-child > span:last-child{letter-spacing:0.2em!important;font-size:8px!important}
  #root header > :last-child button,#root header > button:last-child{padding:9px 12px!important;font-size:13px!important}
  #root h1[style]{line-height:1.1!important}
  #root [style*="left: -28px"]{left:12px!important;bottom:12px!important}
  #root .booking-aside[style]{position:static!important}
  #root section [style*="grid-template-columns: 1fr auto"]{padding:36px 24px!important}
  #root [style*="display: flex"][style*="gap: 12px"]{flex-wrap:wrap}
}
@media (max-width: 420px){
  #root [style*="repeat(4, minmax(0, 1fr))"]{grid-template-columns:1fr 1fr!important;gap:12px!important}
}