:root {
  --headens-yellow: #F5C400;
  --accent-ink: #0D1117;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --motion-fast: 160ms;
  --motion-base: 240ms;
  --ease-headens: cubic-bezier(.2, .8, .2, 1);
  --headens-crt-safe-inline: clamp(12px, 1.1vw, 20px);
  --headens-crt-safe-block: clamp(8px, .8vw, 14px);
}

html[data-theme="light"] {
  --headens-yellow: #F5C400;
  --canvas: #F6F8FA;
  --surface: #FFFFFF;
  --surface-raised: #FFFFFF;
  --surface-subtle: #EAEEF2;
  --text: #0D1117;
  --text-muted: #59636E;
  --border: #D0D7DE;
  --border-strong: #A8B3BD;
  --accent: #F5C400;
  --accent-strong: #6F5100;
  --danger: var(--accent);
  --focus-ring: rgba(245, 196, 0, .38);
  --site-shadow: 0 18px 50px rgba(31, 35, 40, .10);
  --section-wipe-pixel: #F6F8FA;
  --section-wipe-underlay: #F6F8FA;
  --section-wipe-opacity: 1;
  --whatif-ascii: #8A6B00;
}

html[data-theme="dark"] {
  --headens-yellow: #FFD43B;
  --canvas: #000000;
  --surface: #151B23;
  --surface-raised: #1C2128;
  --surface-subtle: #21262D;
  --text: #F0F6FC;
  --text-muted: #9198A1;
  --border: #30363D;
  --border-strong: #484F58;
  --accent: #FFD43B;
  --accent-strong: #FFD43B;
  --danger: var(--accent);
  --focus-ring: rgba(255, 212, 59, .42);
  --site-shadow: 0 18px 50px rgba(0, 0, 0, .28);
  --section-wipe-pixel: #000000;
  --section-wipe-underlay: #000000;
  --section-wipe-opacity: 1;
  --whatif-ascii: #4E4E4E;
}

body.headens-entered,
body.headens-entered #app,
body.headens-entered .app-container {
  background: var(--canvas) !important;
  color: var(--text) !important;
  transition: background-color var(--motion-base) var(--ease-headens), color var(--motion-base) var(--ease-headens);
}

body.headens-entered::after {
  opacity: .42;
  mix-blend-mode: soft-light;
}

body.headens-entered .stacking-section + .stacking-section {
  margin-top: -1px;
}

body.headens-entered .headens-section-wipe {
  left: 0;
  width: 100%;
  padding: 0;
  opacity: var(--section-wipe-opacity);
}

html[data-theme="light"] body.headens-entered .canvas-container canvas {
  filter: invert(1) hue-rotate(180deg) contrast(1.12);
}

body:not(.headens-entered) .canvas-container canvas {
  filter: invert(1) hue-rotate(180deg);
  transition: opacity 600ms var(--ease-headens);
}

body:not(.headens-loader-ready):not(.headens-entered) .canvas-container canvas {
  opacity: 0;
}

body.headens-loader-ready:not(.headens-entered) .canvas-container canvas {
  opacity: 1;
}

.preloader-title {
  opacity: 1;
  filter: blur(0);
  transition: opacity 600ms var(--ease-headens), filter 600ms var(--ease-headens);
}

body.headens-loader-ready .preloader-title {
  opacity: 0;
  filter: blur(3px);
}

body.headens-loader-ready .enter-trigger {
  animation: headens-loader-enter 220ms 420ms both var(--ease-headens);
}

@keyframes headens-loader-enter {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

.preloader-overlay {
  background-color: transparent !important;
  color: #F0F6FC !important;
  cursor: pointer;
}

.preloader-overlay .md\:text-black,
.preloader-overlay .text-black:not([data-scramble-text]) {
  color: #F0F6FC !important;
}

.preloader-overlay [data-scramble-text] {
  color: #0D1117 !important;
}

.preloader-overlay svg path {
  stroke: #F0F6FC !important;
}

html[data-theme="dark"] body.headens-entered .canvas-container canvas {
  filter: none;
}

html[data-theme="light"] body.headens-entered .footer-canvas-wrapper canvas {
  filter: invert(1);
}

html[data-theme="dark"] body.headens-entered .footer-canvas-wrapper canvas {
  filter: none;
}

body.headens-entered .headens-social-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  column-gap: 14px;
  row-gap: 8px;
}

body.headens-entered .headens-social-links a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
}

@media (min-width: 1024px) {
  body.headens-entered .headens-social-links {
    justify-content: flex-end;
  }
}

@media (min-width: 640px) and (max-width: 1100px) {
  body.headens-entered #contact footer .col-span-full.grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.headens-entered #contact footer .col-span-full.grid > * {
    grid-column: 1 !important;
  }

  body.headens-entered #contact footer .col-span-full.grid > :last-child {
    align-items: flex-start !important;
  }

  body.headens-entered #contact footer .headens-social-links {
    width: 100%;
    max-width: 100%;
    justify-content: flex-start;
  }

  body.headens-entered #contact footer [class*="col-start-3"][class*="row-start-1"] {
    grid-column: 1 / -1 !important;
    width: 100%;
    max-width: 100%;
    justify-content: flex-start !important;
  }

  body.headens-entered #contact footer [class*="col-start-3"][class*="row-start-1"] > button {
    max-width: 100%;
    white-space: normal;
  }
}

body.headens-entered .navbar {
  mix-blend-mode: normal !important;
  color: var(--text) !important;
  padding-inline: calc(6.5vw + var(--headens-crt-safe-inline)) !important;
  padding-top: calc(5svh + env(safe-area-inset-top) + var(--headens-crt-safe-block)) !important;
}

body.headens-entered .main-text-con {
  mix-blend-mode: normal !important;
  color: var(--text) !important;
  left: calc(6.5vw + var(--headens-crt-safe-inline)) !important;
  bottom: calc(5svh + var(--headens-crt-safe-block)) !important;
}

body.headens-entered .main-text-word + .main-text-word {
  margin-left: 1.4em;
}

body.headens-entered .main-text-con > div > div {
  width: max-content;
  max-width: none !important;
}

body.headens-entered .bt-text,
body.headens-entered .navbar-about,
body.headens-entered .navbar-address,
body.headens-entered .sound-toggle-parent {
  color: var(--text) !important;
  opacity: 1 !important;
}

body.headens-entered .coords-text {
  mix-blend-mode: normal !important;
  color: var(--text-muted) !important;
}

body.headens-entered .hero-section :has(> .bt-text),
body.headens-entered .hero-section :has(> .coords-text) {
  mix-blend-mode: normal !important;
}

body.headens-entered .hero-section :has(> .bt-text) {
  left: calc(9.72vw + var(--headens-crt-safe-inline)) !important;
}

body.headens-entered .hero-section :has(> .coords-text) {
  right: calc(6.5vw + var(--headens-crt-safe-inline)) !important;
}

body.headens-entered .WhatifThis-Section {
  padding-inline: calc(5vw + var(--headens-crt-safe-inline)) !important;
  padding-block: calc(80px + var(--headens-crt-safe-block)) !important;
}

html[data-theme="light"] body.headens-entered .WhatifThis-Section > .mix-blend-screen {
  mix-blend-mode: multiply !important;
  opacity: .34 !important;
}

body.headens-entered .WhatifThis-Section pre {
  color: var(--whatif-ascii) !important;
}

body.headens-entered #contact footer {
  padding-inline: calc(5vw + var(--headens-crt-safe-inline)) !important;
  padding-bottom: calc(5svh + var(--headens-crt-safe-block)) !important;
}

html[data-theme="dark"] body.headens-entered .navbar {
  mix-blend-mode: normal !important;
  color: var(--text) !important;
}

html[data-theme="dark"] body.headens-entered .main-text-con {
  mix-blend-mode: normal !important;
  color: var(--text) !important;
}

html[data-theme="dark"] body.headens-entered .coords-text {
  mix-blend-mode: normal !important;
  color: var(--text-muted) !important;
}

html[data-theme="dark"] body.headens-entered .bt-text,
html[data-theme="dark"] body.headens-entered .navbar-about,
html[data-theme="dark"] body.headens-entered .navbar-address,
html[data-theme="dark"] body.headens-entered .sound-toggle-parent {
  color: var(--text) !important;
  opacity: 1 !important;
}

body.headens-entered .logo-mask {
  background-color: var(--text) !important;
}

body.headens-entered .navbar .logo-mask {
  width: 3.04vw !important;
}

@media (min-width: 640px) and (max-width: 1023px) {
  body.headens-entered .navbar {
    min-height: calc(92px + env(safe-area-inset-top));
    padding-inline: calc(6vw + var(--headens-crt-safe-inline)) !important;
    padding-top: calc(env(safe-area-inset-top) + var(--headens-crt-safe-block)) !important;
    align-items: center !important;
  }

  body.headens-entered .navbar .logo-mask {
    width: clamp(44px, 5vw, 56px) !important;
  }

  body.headens-entered .navbar-about,
  body.headens-entered .navbar-address,
  body.headens-entered .sound-toggle-parent,
  body.headens-entered .headens-theme-toggle,
  body.headens-entered .headens-locale-switcher {
    font-size: clamp(11px, 1.5vw, 14px) !important;
  }

  body.headens-entered .hero-section :has(> .bt-text) {
    top: clamp(118px, 15svh, 170px) !important;
    bottom: auto !important;
    left: calc(6vw + var(--headens-crt-safe-inline)) !important;
    transform: none !important;
  }

  body.headens-entered .hero-section :has(> .coords-text) {
    top: clamp(118px, 15svh, 170px) !important;
    right: calc(6vw + var(--headens-crt-safe-inline)) !important;
    bottom: auto !important;
  }

  body.headens-entered .main-text-con {
    left: calc(6vw + var(--headens-crt-safe-inline)) !important;
    right: calc(6vw + var(--headens-crt-safe-inline)) !important;
    bottom: calc(clamp(30px, 5svh, 54px) + var(--headens-crt-safe-block)) !important;
    width: auto !important;
    max-width: 88vw !important;
    overflow: visible !important;
  }

  body.headens-entered .main-text-con > div,
  body.headens-entered .main-text-con > div > div {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.headens-entered .main-text-con > div > div > div {
    overflow: visible !important;
    white-space: nowrap;
  }

  body.headens-entered .main-text-word + .main-text-word {
    margin-left: .9em;
  }
}

/* The legacy mobile-only tagline duplicated the complete statement below. */
body.headens-entered .hero-section p.max-w-\[56\.2vw\] {
  display: none !important;
}

@media (max-width: 639px) {
  :root {
    --headens-crt-safe-inline: 10px;
    --headens-crt-safe-block: 8px;
  }

  body.headens-entered .navbar-mobile {
    min-height: calc(80px + env(safe-area-inset-top));
    padding-top: calc(env(safe-area-inset-top) + var(--headens-crt-safe-block)) !important;
    padding-inline: calc(5vw + var(--headens-crt-safe-inline)) !important;
    padding-bottom: 0 !important;
    grid-template-columns: 52px 1fr 52px !important;
    align-items: center !important;
  }

  body.headens-entered .navbar-mobile > a,
  body.headens-entered .navbar-mobile > button,
  body.headens-entered .navbar-mobile > .navbar-address {
    align-self: center !important;
  }

  body.headens-entered .navbar-mobile > button {
    min-width: 52px;
    min-height: 44px;
    padding-top: 0 !important;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
  }

  body.headens-entered .navbar-mobile .logo-mask {
    width: 36px !important;
  }

  body.headens-entered .headens-locale-switcher {
    min-width: 0;
    width: 100%;
    max-width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    box-sizing: border-box;
    padding-inline: 4vw;
    align-items: flex-start;
    color: var(--text);
  }

  body.headens-entered .headens-locale-switcher__choices {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    width: 100%;
    justify-content: flex-start;
    gap: 0;
  }

  body.headens-entered .headens-locale-switcher [data-headens-locale] {
    min-width: 0;
    min-height: 44px;
    width: 100%;
    padding-inline: 0;
  }

  body.headens-entered .hero-section :has(> .bt-text) {
    top: clamp(112px, 16svh, 150px) !important;
    bottom: auto !important;
    left: calc(6vw + var(--headens-crt-safe-inline)) !important;
    transform: none !important;
  }

  body.headens-entered .hero-section :has(> .coords-text) {
    top: clamp(112px, 16svh, 150px) !important;
    right: calc(6vw + var(--headens-crt-safe-inline)) !important;
    bottom: auto !important;
  }

  body.headens-entered .bt-text,
  body.headens-entered .coords-text {
    font-size: clamp(11px, 3.1vw, 13px) !important;
    line-height: 1.4 !important;
    white-space: nowrap;
  }

  body.headens-entered .main-text-con {
    left: calc(6vw + var(--headens-crt-safe-inline)) !important;
    right: calc(6vw + var(--headens-crt-safe-inline)) !important;
    bottom: calc(clamp(24px, 4svh, 42px) + var(--headens-crt-safe-block)) !important;
    width: auto !important;
    max-width: none !important;
    overflow: visible !important;
  }

  body.headens-entered .main-text-con > div,
  body.headens-entered .main-text-con > div > div {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.headens-entered .main-text-con > div > div > div {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    white-space: nowrap;
    font-size: clamp(11px, 3.15vw, 13px) !important;
    line-height: 1.55 !important;
  }

  body.headens-entered .main-text-word + .main-text-word {
    margin-left: .62em;
  }

  body.headens-entered .WhatifThis-Section {
    padding-inline: calc(6vw + var(--headens-crt-safe-inline)) !important;
    padding-block: calc(8svh + var(--headens-crt-safe-block)) !important;
  }
}

body.headens-entered .canvas-container {
  touch-action: pan-y;
}

body.headens-entered .bg-black,
body.headens-entered .bg-\[\#000000\],
body.headens-entered .bg-\[\#0b0b0b\] {
  background-color: var(--canvas) !important;
}

body.headens-entered .bg-\[\#111111\],
body.headens-entered .bg-\[\#151515\] {
  background-color: var(--surface) !important;
}

body.headens-entered .text-\[\#c5c4c2\],
body.headens-entered .text-white {
  color: var(--text) !important;
}

body.headens-entered .text-\[\#7d7d7d\],
body.headens-entered .text-\[\#888888\] {
  color: var(--text-muted) !important;
}

body.headens-entered .border-\[\#333333\],
body.headens-entered .border-white,
body.headens-entered .border-white\/20 {
  border-color: var(--border) !important;
}

body.headens-entered .bg-\[\#F5C400\],
body.headens-entered .hover\:bg-\[\#F5C400\]:hover {
  background-color: var(--headens-yellow) !important;
  color: var(--accent-ink) !important;
}

body.headens-entered .text-\[\#F5C400\] {
  color: var(--accent-strong) !important;
}

/* Preserve the readable editorial accent without muting interactive controls. */
body.headens-entered :is(button, a, [role="button"]).text-\[\#F5C400\],
body.headens-entered :is(button, a, [role="button"]) .text-\[\#F5C400\],
body.headens-entered .text-\[\#F5C400\] :is(button, a, [role="button"]) {
  color: var(--headens-yellow) !important;
}

body.headens-entered .pixel-transition {
  background-image:
    linear-gradient(color-mix(in srgb, var(--accent) 8%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--accent) 8%, transparent) 1px, transparent 1px) !important;
}

.headens-theme-toggle {
  min-width: max-content;
  min-height: 44px;
  padding: 0;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: .27vw;
  border: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: .04em;
  text-transform: uppercase;
  cursor: pointer;
  transition: color var(--motion-fast);
}

.headens-theme-toggle__label { font-weight: 400; }
.headens-theme-toggle__choices {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1.39vw;
  font-weight: 600;
}
.headens-theme-toggle [data-theme-choice] { color: var(--text); }
.headens-theme-toggle[data-mode="light"] [data-theme-choice="light"],
.headens-theme-toggle[data-mode="dark"] [data-theme-choice="dark"] { color: var(--headens-yellow); }
.headens-theme-toggle:hover .headens-theme-toggle__label { text-decoration: line-through; }

.headens-theme-toggle:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 3px;
}

.headens-locale-switcher {
  min-width: max-content;
  min-height: 44px;
  padding: 0;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: .27vw;
  color: var(--text);
  font: inherit;
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.headens-locale-switcher__label { font-weight: 400; }
.headens-locale-switcher__choices {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1.39vw;
  font-weight: 600;
}
.headens-locale-switcher [data-headens-locale] {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  cursor: pointer;
}
.headens-locale-switcher [data-headens-locale][aria-current="true"] { color: var(--headens-yellow); }
.headens-locale-switcher [data-headens-locale]:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: -3px;
}

#eng-terminal-section { color-scheme: dark; }

@media (prefers-reduced-motion: reduce) {
  .headens-theme-toggle { transition-duration: .01ms !important; }
  body:not(.headens-entered) .canvas-container canvas,
  .preloader-title { transition-duration: .01ms !important; }
  body.headens-loader-ready .enter-trigger { animation-duration: .01ms !important; animation-delay: 0ms !important; }
}