:root {
  --radius: 0.3rem;
  --navy: oklch(27.2% 0.072 268);
  --navy-soft: oklch(38% 0.072 268);
  --orange: oklch(77.1% 0.156 71);
  --ink: oklch(25.3% 0.051 267);
  --grey: oklch(56.5% 0.06 267);
  --steel: oklch(56.5% 0.06 267);
  --accent-glow: oklch(85.5% 0.12 76);
  --logo-surface: oklch(100% 0 0 / 0.96);
  --warm: oklch(96.5% 0.002 267);
  --surface-raised: oklch(100% 0 0);
  --surface-lit: oklch(97.5% 0.002 267);
  --background: oklch(100% 0 0);
  --foreground: oklch(25.3% 0.051 267);
  --card: oklch(100% 0 0);
  --card-foreground: oklch(25.3% 0.051 267);
  --primary: oklch(27.2% 0.072 268);
  --primary-foreground: oklch(100% 0 0);
  --hero-blueprint-line: oklch(100% 0 0);
  --hero-blueprint-accent: oklch(77.1% 0.156 71);
  --secondary: oklch(95.5% 0.003 267);
  --secondary-foreground: oklch(25.3% 0.051 267);
  --muted: oklch(96% 0.003 267);
  --muted-foreground: oklch(50% 0.055 267);
  --accent: oklch(77.1% 0.156 71);
  --accent-foreground: oklch(25.3% 0.051 267);
  --border: oklch(56.5% 0.06 267 / 0.24);
  --footer: oklch(22.6% 0.048 267);
  --footer-foreground: oklch(97.5% 0.008 87);
  --footer-border: oklch(100% 0 0 / 0.14);
  --nav-panel: oklch(22.6% 0.048 267);
  --nav-panel-foreground: oklch(97.5% 0.008 87);
  --nav-panel-muted: oklch(78% 0.036 267);
  --nav-panel-border: oklch(100% 0 0 / 0.14);
  --font-sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-display: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

html.dark,
html.dark body,
.dark {
  color-scheme: dark;
  --navy: oklch(27.2% 0.072 268);
  --navy-soft: oklch(38% 0.072 268);
  --orange: oklch(77.1% 0.156 71);
  --ink: oklch(97.5% 0.008 87);
  --grey: oklch(68% 0.05 267);
  --steel: oklch(63% 0.075 268);
  --accent-glow: oklch(85.5% 0.12 76);
  --logo-surface: oklch(100% 0 0 / 0.96);
  --warm: oklch(23.5% 0.056 268);
  --surface-raised: oklch(33.5% 0.065 268);
  --surface-lit: oklch(30.5% 0.062 268);
  --background: oklch(27.2% 0.072 268);
  --foreground: oklch(97.5% 0.008 87);
  --card: oklch(33.5% 0.065 268);
  --card-foreground: oklch(97.5% 0.008 87);
  --primary: oklch(22.6% 0.048 267);
  --primary-foreground: oklch(97.5% 0.008 87);
  --hero-blueprint-line: oklch(100% 0 0);
  --hero-blueprint-accent: oklch(77.1% 0.156 71);
  --secondary: oklch(38% 0.072 268);
  --secondary-foreground: oklch(97.5% 0.008 87);
  --muted: oklch(33.5% 0.065 268);
  --muted-foreground: oklch(79% 0.034 267);
  --accent: oklch(77.1% 0.156 71);
  --accent-foreground: oklch(25.3% 0.051 267);
  --border: oklch(100% 0 0 / 0.18);
  --footer: oklch(19.6% 0.045 267);
  --footer-foreground: oklch(97.5% 0.008 87);
  --footer-border: oklch(100% 0 0 / 0.14);
  --nav-panel: oklch(97.5% 0.01 87);
  --nav-panel-foreground: oklch(25.3% 0.051 267);
  --nav-panel-muted: oklch(46% 0.05 267);
  --nav-panel-border: oklch(25.3% 0.051 267 / 0.16);
}

html:not(.dark) {
  color-scheme: light;
}

html,
body {
  background-color: var(--background);
  color: var(--foreground);
}

@keyframes word-rise {
  0% { opacity: 0; transform: translateY(0.6em); }
  100% { opacity: 1; transform: none; }
}

@keyframes chevron-chase {
  0% { opacity: 0.15; transform: translateX(-4px); }
  40% { opacity: 1; transform: translateX(0); }
  100% { opacity: 0.15; transform: translateX(5px); }
}

@keyframes marquee-left {
  0% { transform: translate(0); }
  100% { transform: translate(-50%); }
}

@keyframes marquee-right {
  0% { transform: translate(-50%); }
  100% { transform: translate(0); }
}

@keyframes peek-pulse {
  0%, 100% { transform: translateX(3.5rem) translateY(-50%); }
  50% { transform: translateX(3rem) translateY(-50%); }
}

#floating-cta {
  position: fixed;
  right: 0;
  top: 60%;
  z-index: 100;
  display: flex;
  width: 7rem;
  min-width: 7rem;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
  transform: translateX(4rem) translateY(-50%);
  border-radius: 9999px 0 0 9999px;
  background: var(--accent);
  color: var(--accent-foreground);
  padding: 1rem;
  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1);
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), gap 0.3s ease, padding 0.3s ease, box-shadow 0.3s ease;
  text-decoration: none;
}

#floating-cta:hover,
#floating-cta:focus-visible {
  transform: translateX(0) translateY(-50%);
  gap: 0.5rem;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  box-shadow: 0 12px 32px -8px oklch(77.1% 0.156 71 / 0.45);
  outline: none;
}

#floating-cta.peek-pulse {
  animation: peek-pulse 3.2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

#floating-cta.peek-pulse:hover,
#floating-cta.peek-pulse:focus-visible {
  animation: none;
}

#floating-cta span {
  overflow: hidden;
  font-size: 0.875rem;
  font-weight: 700;
  white-space: nowrap;
  opacity: 0;
  max-width: 0;
  transition: opacity 0.3s ease, max-width 0.3s ease;
}

#floating-cta:hover span,
#floating-cta:focus-visible span {
  opacity: 1;
  max-width: 8rem;
}

.theme-toggle-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: transparent;
}

.theme-toggle-btn svg[hidden] {
  display: none !important;
}

.peek-pulse:not(#floating-cta) {
  animation: peek-pulse 3.2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.reveal[data-visible="true"],
.reveal.visible {
  opacity: 1;
  transform: none;
}

.marquee-row:hover .marquee-track {
  animation-play-state: paused;
}

.marquee-track[data-direction="left"] {
  animation: marquee-left linear infinite;
}

.marquee-track[data-direction="right"] {
  animation: marquee-right linear infinite;
}

.marquee-mask {
  mask-image: linear-gradient(to right, transparent, black 8%, black 92%, transparent);
}

.marquee-track {
  display: flex;
  width: max-content;
}

html { font-size: 100%; }
@media (width >= 768px) { html { font-size: 106%; } }

body {
  background-color: var(--background);
  color: var(--foreground);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  font-size: 1.0625rem;
  font-weight: 600;
  line-height: 1.7;
  transition: background-color 0.25s ease, color 0.25s ease;
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  letter-spacing: -0.025em;
  font-weight: 800;
}

nav a.relative:hover .nav-underline,
nav a.relative.is-active .nav-underline,
nav a.nav-link:hover .nav-underline,
nav a.nav-link.text-accent .nav-underline {
  width: calc(100% - 1.5rem);
}

.nav-desktop {
  display: none;
  align-items: center;
  gap: 0.125rem;
}

@media (width >= 1024px) {
  .nav-desktop {
    display: flex;
  }
}

@media (width >= 1280px) {
  .nav-desktop {
    gap: 0.25rem;
  }
}

.nav-link,
.nav-trigger {
  color: oklch(97.5% 0.008 87 / 0.85);
}

.nav-link:hover,
.nav-trigger:hover,
.nav-link.text-accent,
.nav-trigger.text-accent {
  color: var(--accent);
}

#site-header.is-transparent .nav-link,
#site-header.is-transparent .nav-trigger {
  color: oklch(97.5% 0.008 87 / 0.85);
}

#site-header.is-transparent .nav-link:hover,
#site-header.is-transparent .nav-trigger:hover,
#site-header.is-transparent .nav-link.text-accent,
#site-header.is-transparent .nav-trigger.text-accent {
  color: var(--accent);
}

#site-header.bg-navy .nav-link,
#site-header.bg-navy .nav-trigger {
  color: oklch(97.5% 0.008 87 / 0.85);
}

#site-header.bg-navy .nav-link:hover,
#site-header.bg-navy .nav-trigger:hover,
#site-header.bg-navy .nav-link.text-accent,
#site-header.bg-navy .nav-trigger.text-accent {
  color: var(--accent);
}

.nav-underline {
  position: absolute;
  bottom: 0;
  left: 1rem;
  height: 2px;
  width: 0;
  background: var(--accent);
  transition: width 0.3s ease;
}

#site-header.is-transparent .nav-link {
  color: oklch(97.5% 0.008 87 / 0.85);
}

#site-header.is-transparent .nav-link:hover,
#site-header.is-transparent .nav-link.is-active {
  color: var(--accent);
}

#hero-backdrop {
  will-change: transform;
  transform: scale(1.04);
}

@media (prefers-reduced-motion: reduce) {
  .word-rise, .chevron-chase, .marquee-track, .peek-pulse {
    animation: none !important;
    opacity: 1;
    transform: none;
  }
  .reveal { opacity: 1; transform: none; }
}