:root {
    --color-ivory: #F5F1E9;
    --color-ink: #18201E;
    --color-stone: #D8D1C5;
    --color-white: #FFFFFF;
    --color-terracotta: #B85C3B;
    --color-terracotta-hover: #95472F;
    --color-terracotta-soft: #E9A186;
    --font-sans: "Manrope", Arial, sans-serif;
    --content-width: 1280px;
    --focus-ring: #B85C3B;

  /* ── Standard Tokens (auto-injected) ── */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --text-6xl: 3.75rem;
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;
  --radius-default: 4px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.12);
  --shadow-xl: 0 20px 40px rgba(0, 0, 0, 0.15);
}

html {
    scroll-behavior: smooth;
    background: var(--color-ivory);
}

body {
    margin: 0;
    min-width: 320px;
    background: var(--color-ivory);
    color: var(--color-ink);
    font-family: var(--font-sans);
    font-size: 17px;
    font-weight: 400;
    line-height: 1.65;
    text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-sans);
    font-weight: 700;
    line-height: 1.08;
    text-wrap: balance;
}

p {
    text-wrap: pretty;
}

button,
input,
select,
textarea {
    font: inherit;
}

a,
button,
input,
select,
textarea {
    outline: 2px solid transparent;
    outline-offset: 3px;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline-color: var(--focus-ring);
}

::selection {
    background: var(--color-terracotta);
    color: var(--color-white);
}

img {
    height: auto;
}

[data-nav-menu][hidden] {
    display: none;
}

[data-nav-menu].is-open,
[data-nav-menu][data-open="true"] {
    display: block;
}

[data-nav-toggle][aria-expanded="true"] [data-nav-icon] span:first-child {
    top: 9px;
    transform: rotate(45deg);
}

[data-nav-toggle][aria-expanded="true"] [data-nav-icon] span:nth-child(2) {
    opacity: 0;
}

[data-nav-toggle][aria-expanded="true"] [data-nav-icon] span:last-child {
    top: 9px;
    transform: rotate(-45deg);
}

[data-reveal] {
    opacity: 0;
    transform: translateY(18px);
    transition:
        opacity 650ms cubic-bezier(0.22, 1, 0.36, 1),
        transform 650ms cubic-bezier(0.22, 1, 0.36, 1);
}

[data-reveal="left"] {
    transform: translateX(-18px);
}

[data-reveal="right"] {
    transform: translateX(18px);
}

[data-reveal].is-visible,
[data-reveal][data-visible="true"] {
    opacity: 1;
    transform: translate(0, 0);
}

@keyframes gentle-rise {
    from {
        opacity: 0;
        transform: translateY(14px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (min-width: 1024px) {
    [data-nav-menu] {
        display: none !important;
    }
}

@media (max-width: 639px) {
    body {
        font-size: 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }

    [data-reveal] {
        opacity: 1;
        transform: none;
    }
}

/* -- Cosmic Jaunt typography quality guard -- */
:where(html) {
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
}

:where(body) {
  font-weight: 400;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

:where(p, li, dd, blockquote, figcaption, input, textarea, select) {
  font-weight: 450;
}

:where(h1, h2, h3, h4, h5, h6, .font-heading, .nav-logo, .site-title, strong, b) {
  font-weight: 700;
}

:where(.font-thin, .font-extralight, .font-light):not(.cj-allow-thin) {
  font-weight: 450;
}

:where(h1, h2, h3, h4, h5, h6, .font-heading):where(.font-thin, .font-extralight, .font-light):not(.cj-allow-thin) {
  font-weight: 650;
}

:where(footer, .site-footer, [data-cj-readable]) :where(p, li, a, span, small) {
  font-weight: 500;
}

:where(footer, .site-footer) :where(p, li, a, span, small):where(.text-white\/30, .text-white\/40, .text-white\/50, .text-white\/60) {
  color: rgba(255, 255, 255, 0.78);
}