:root {
  --c-cream: #F2EAD3;
  --c-bg: #030305;
  --c-secondary: #000000;
  --c-text: #FFFFFF;
  --c-muted: #A1A1AA;
  --c-border: #27272A;
  --section-pad: 80px;
  --r-card: 8px;
  --r-ctrl: 8px;
  --r-pill: 9999px;
  --gap: 16px;
  --unit: 8px;
  --font-d: "Inter", system-ui, sans-serif;
  --font-b: "Playfair Display", Georgia, serif;
  --font-m: "JetBrains Mono", ui-monospace, monospace;
}

*, *::before, *::after { box-sizing: border-box; }
html { background: var(--c-bg); color: var(--c-text); }
html.no-js .reveal { opacity: 1 !important; transform: none !important; }
body { margin: 0; font-family: var(--font-b); font-size: 16px; font-weight: 400; line-height: 1.6; background: var(--c-bg); color: var(--c-text); }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; color: inherit; background: transparent; }
.container { width: min(1200px, 92%); margin-inline: auto; }
.container.narrow { width: min(720px, 92%); }
.relative { position: relative; z-index: 1; }
.sr-only, .hp { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.skip-link { position: absolute; left: -999px; top: 0; }
.skip-link:focus { left: 8px; top: 8px; background: var(--c-cream); color: #000; padding: 8px 16px; z-index: 9999; }

.display-xl, .display-md, h1, h2, h3 {
  font-family: var(--font-d);
  font-weight: 600;
  line-height: 1.04;
  letter-spacing: -0.03em;
  margin: 0 0 24px;
}
.display-xl { font-size: clamp(56px, 8vw, 92px); }
.display-md { font-size: clamp(36px, 5vw, 64px); }
em { font-family: var(--font-b); font-style: italic; color: var(--c-cream); font-weight: 400; }

.mono-label, .eyebrow {
  font-family: var(--font-m);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--c-cream);
  margin: 0 0 16px;
}
.muted { color: var(--c-muted); }
.lede { font-size: 1.25rem; max-width: 42ch; color: var(--c-muted); }

.section { padding: var(--section-pad) 0; position: relative; overflow: hidden; }
.section--tight { padding: 40px 0; }
.center { text-align: center; }

.btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 12px 22px; border-radius: var(--r-pill);
  border: 1px solid transparent; cursor: pointer;
  font-family: var(--font-d); font-size: 14px; font-weight: 600;
  transition: transform .3s, background .3s, color .3s, border-color .3s;
}
.btn--primary { background: var(--c-cream); color: #111; }
.btn--ghost { border-color: var(--c-border); color: var(--c-text); }
.btn:hover { transform: translateY(-2px); }
.cta-row { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 32px; }

.announcement {
  background: var(--c-cream); color: #111; font-family: var(--font-m);
  font-size: 12px; letter-spacing: .12em; text-transform: uppercase;
  display: flex; justify-content: center; gap: 16px; padding: 8px 16px;
}
.announcement__close { border: 0; cursor: pointer; }

.site-header {
  position: sticky; top: 0; z-index: 40;
  transition: background .3s, border-color .3s;
  border-bottom: 1px solid transparent;
}
.site-header.is-scrolled { background: #030305ee; border-bottom-color: var(--c-border); }
.header-inner { display: flex; align-items: center; gap: 16px; min-height: 72px; }
.logo { font-family: var(--font-d); font-weight: 700; letter-spacing: .2em; font-size: 14px; }
.primary-nav { flex: 1; display: flex; justify-content: center; }
.primary-nav ul { display: flex; gap: 24px; list-style: none; margin: 0; padding: 0; }
.header-ctas { display: flex; gap: 8px; }
.hamburger {
  width: 44px; height: 44px; border: 1px solid var(--c-border); border-radius: var(--r-ctrl);
  display: flex; flex-direction: column; justify-content: center; gap: 6px; padding: 12px; cursor: pointer;
}
.hamburger span:not(.sr-only) { display: block; height: 1px; background: var(--c-cream); }
@media (max-width: 1059px) {
  .primary-nav, .header-ctas { display: none; }
}

#site-wrap { transition: transform .45s cubic-bezier(.22,1,.36,1); }
body.menu-open #site-wrap { transform: translateX(calc(-1 * min(26vw, 300px))); }
body.menu-open { overflow: hidden; }

.push-menu {
  position: fixed; top: 0; right: 0; height: 100%; width: min(520px, 94vw);
  background: #060609; border-left: 1px solid var(--c-cream);
  z-index: 80; transform: translateX(100%); transition: transform .45s cubic-bezier(.22,1,.36,1);
  padding: 32px; overflow: auto;
}
body.menu-open .push-menu { transform: translateX(0); }
.menu-overlay {
  position: fixed; inset: 0; background: #0008; z-index: 70;
}
.push-menu__list { list-style: none; padding: 0; counter-reset: m; }
.push-menu__list > li { counter-increment: m; border-bottom: 1px solid var(--c-border); }
.push-menu__list > li > a, .acc-toggle {
  display: flex; width: 100%; padding: 16px 0; font-family: var(--font-d); font-size: 28px; background: 0; border: 0; text-align: left; cursor: pointer;
}
.push-menu__list > li > a::before, .acc-toggle::before {
  content: counter(m, decimal-leading-zero); font-family: var(--font-m); font-size: 12px; margin-right: 16px; color: var(--c-cream);
}
.push-menu .has-acc ul { display: none; padding-left: 40px; }
.push-menu .has-acc.is-open ul { display: block; }
.push-menu__close { position: absolute; top: 16px; right: 16px; font-size: 28px; border: 0; background: 0; cursor: pointer; }

.hero { min-height: 100vh; display: flex; align-items: center; }
.hero--compact { min-height: 56vh; }
.scroll-cue { margin-top: 80px; animation: pulse 2s infinite; }
@keyframes pulse { 50% { opacity: .4; } }

.spectral-mount { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.spectral-canvas, .sp-fallback { position: absolute; inset: 0; width: 100%; height: 100%; }
.sp-fallback { background: radial-gradient(ellipse at 30% 20%, #2a2618 0%, #030305 55%); }

.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.tile, .panel {
  padding: 24px; border-radius: var(--r-card);
}
.tile { border-bottom: 1px solid var(--c-border); }
.panel { border: 1px solid var(--c-border); background: #0a0a0e; }
.ph { background: #111; aspect-ratio: 4/5; border-radius: var(--r-card); }

.marquee { overflow: hidden; }
.marquee__track { display: flex; gap: 48px; width: max-content; }
.marquee__item { font-family: var(--font-d); font-size: 18px; letter-spacing: .2em; color: var(--c-muted); }

.process__stage { display: none; }
.process__mobile { list-style: none; padding: 0; }
.process__mobile li { padding: 24px 0; border-bottom: 1px solid var(--c-border); }
.outline-num { font-family: var(--font-d); font-size: 64px; color: transparent; -webkit-text-stroke: 1px var(--c-cream); }
@media (min-width: 783px) and (hover: hover) {
  .process__mobile { display: none; }
  .process__stage {
    display: flex; flex-direction: column; min-height: 100vh;
    justify-content: space-between;
  }
  .process__track { display: flex; gap: 24px; padding: 0 4%; }
  .process__card { min-width: 70vw; }
  .process__progress { height: 2px; background: #222; margin: 24px 4%; }
  .process__progress span { display: block; height: 100%; width: 0; background: var(--c-cream); transform-origin: left; }
}

.swiper-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 24px; }
.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.stat__num { font-family: var(--font-d); font-size: clamp(40px, 6vw, 72px); display: block; }
@media (max-width: 782px) { .stats { grid-template-columns: 1fr 1fr; } }

.site-footer { padding: 80px 0 40px; border-top: 1px solid var(--c-border); }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 32px; }
.footer-legal { display: flex; justify-content: space-between; margin-top: 48px; color: var(--c-muted); font-size: 14px; }
@media (max-width: 782px) { .footer-grid { grid-template-columns: 1fr; } }

.alify-form label { display: block; margin-bottom: 16px; font-family: var(--font-m); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.alify-form input, .alify-form textarea, .alify-form select {
  display: block; width: 100%; margin-top: 8px; padding: 12px 14px;
  border: 1px solid var(--c-border); border-radius: var(--r-ctrl); background: #0a0a0e;
}
.steps-dots { display: flex; gap: 8px; margin-bottom: 24px; }
.steps-dots span { width: 8px; height: 8px; border-radius: 99px; background: #333; }
.steps-dots span.on { background: var(--c-cream); }
.toggle { display: inline-flex; border: 1px solid var(--c-border); border-radius: var(--r-pill); overflow: hidden; }
.toggle button { padding: 8px 16px; border: 0; cursor: pointer; }
.toggle button.on { background: var(--c-cream); color: #111; }
.panels { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.price { font-family: var(--font-d); font-size: 40px; }

.cookie-banner {
  position: fixed; bottom: 16px; left: 16px; right: 16px; z-index: 90;
  background: #0a0a0e; border: 1px solid var(--c-border); border-radius: var(--r-card);
  padding: 16px 24px; display: flex; justify-content: space-between; gap: 16px; align-items: center; flex-wrap: wrap;
}
.cookie-banner[hidden], [hidden] { display: none !important; }

.preloader {
  position: fixed; inset: 0; z-index: 200; background: #030305;
  display: flex; align-items: center; justify-content: center;
}
.preloader__logo { font-family: var(--font-d); font-size: 48px; letter-spacing: .3em; }
.preloader__line { height: 1px; background: var(--c-cream); width: 0; margin: 16px 0; }
.page-curtain {
  position: fixed; inset: 0; background: var(--c-cream); color: #111;
  z-index: 180; display: flex; align-items: center; justify-content: center;
  font-family: var(--font-d); font-size: 64px; pointer-events: none;
  transform: translateY(-100%);
}

.cursor { position: fixed; top: 0; left: 0; pointer-events: none; z-index: 300; mix-blend-mode: difference; }
.cursor__dot { width: 6px; height: 6px; background: #fff; border-radius: 99px; }
.cursor__ring { width: 32px; height: 32px; border: 1px solid #fff; border-radius: 99px; position: absolute; top: -13px; left: -13px; }
.cursor__label { display: none; font-family: var(--font-m); font-size: 10px; }
.scroll-rail { position: fixed; right: 8px; top: 20%; bottom: 20%; width: 2px; background: #222; z-index: 50; }
.scroll-rail__thumb { width: 100%; background: var(--c-cream); height: 20%; }
.scroll-rail__pct { font-family: var(--font-m); font-size: 10px; position: absolute; bottom: -20px; right: 0; }

.reveal { opacity: 0; transform: translateY(24px); }
html.mobile-anim .reveal { transition: opacity .6s, transform .6s; }
html.mobile-anim .reveal.in-view { opacity: 1; transform: none; }

.thank-you, .maintenance { min-height: 100vh; background: #030305; }
.ty-mark { position: fixed; top: 24px; left: 24px; }
.ty-center { min-height: 100vh; display: grid; place-items: center; text-align: center; position: relative; }
.check { width: 64px; height: 64px; border: 1px solid var(--c-cream); border-radius: 99px; display: grid; place-items: center; margin: 0 auto 24px; }

.breadcrumbs ol { display: flex; gap: 8px; list-style: none; padding: 0; color: var(--c-muted); font-size: 12px; font-family: var(--font-m); }
.prose { max-width: 68ch; }
.reading-progress { position: fixed; top: 0; left: 0; height: 2px; background: var(--c-cream); width: 0; z-index: 60; }

@media (hover: none), (max-width: 782px) {
  .scroll-rail, .cursor { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .reveal { opacity: 1; transform: none; }
}
