:root {
  --ink: #142b49;
  --surface: 246, 242, 233;
  --journey-progress: 0;
  --sky-energy: 0;
}
body {
  font-family: Roboto, Nimbus, Arial, sans-serif;
  color: var(--ink);
  background: #142b49;
}
h1,
h2,
h3 {
  font-family: Montserrat, Gothic, Arial, sans-serif;
}
h2 {
  font-weight: 700;
  letter-spacing: -2.3px;
}
h3 {
  font-weight: 700;
}
.brand img {
  width: 185px;
  height: auto;
}
.header {
  height: 94px;
  gap: 25px;
}
.header nav {
  gap: 25px;
  font-size: 12px;
}
.nav-cta {
  font-size: 11px;
  gap: 18px;
  padding: 12px 14px;
}
.header .brand {
  order: 0;
}
.header nav {
  order: 1;
}
.theme-switch {
  order: 2;
  display: flex;
  gap: 2px;
  border: 1px solid #ffffff60;
  padding: 3px;
  border-radius: 30px;
  background: #122b4940;
  flex-shrink: 0;
  backdrop-filter: blur(15px);
}
.theme-switch button {
  border: 0;
  border-radius: 25px;
  padding: 7px 10px;
  color: #ffffffbd;
  background: transparent;
  font-size: 10px;
  display: flex;
  align-items: center;
  gap: 5px;
  transition:
    background 0.4s,
    color 0.4s;
}
.theme-switch button span {
  font-size: 15px;
  line-height: 1;
}
.theme-switch button[aria-pressed='true'] {
  color: #142b49;
  background: #f6f2e9;
}
.header .nav-cta {
  order: 3;
}
.header .menu-toggle {
  order: 4;
}
.header.scrolled .theme-switch {
  background: #142b490a;
  border-color: #142b4930;
}
.header.scrolled .theme-switch button {
  color: #142b49a0;
}
.header.scrolled .theme-switch button[aria-pressed='true'] {
  background: #142b49;
  color: white;
}
.header.scrolled {
  background: rgba(246, 242, 233, 0.97);
}
.journey-backdrop {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: #142b49;
  overflow: hidden;
}
.habitat-scene {
  position: absolute;
  inset: -4%;
  background-position: center;
  background-size: cover;
  opacity: 0;
  transform: scale(1.04) translateY(calc(var(--journey-progress) * -2%));
  transition:
    opacity 1.3s ease,
    filter 1.2s;
  will-change: opacity;
}
.habitat-scene.active {
  opacity: 1;
}
.habitat-scene[data-landscape='forest'] {
  background-position: 65% center;
}
.habitat-scene[data-landscape='amazon'] {
  background-position: 50% 55%;
}
.habitat-tint {
  position: absolute;
  inset: 0;
  background: #10243a12;
  transition: background 1.2s;
}
#wildlife {
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  width: 100%;
  height: 100%;
}
main,
.ocean-footer {
  position: relative;
  z-index: 2;
}
.scene {
  isolation: isolate;
}
.hero-copy {
  top: 23%;
  width: 94%;
  left: 3%;
}
.hero-copy .eyebrow {
  font-family: Montserrat;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 2.3px;
  margin-bottom: 25px;
  text-shadow: 0 2px 10px #142b4980;
}
.hero h1 {
  font-family: Montserrat;
  font-weight: 900;
  letter-spacing: -2.6px;
  font-size: clamp(35px, 4.15vw, 65px);
  line-height: 1.12;
  text-shadow: 0 2px 30px #142b4950;
}
.hero h1 span {
  display: block;
}
.hero h1 em {
  font-weight: 900;
  color: #ffbc8c;
}
.hero-description {
  font-family: Montserrat;
  font-weight: 400;
  font-size: 19px;
  letter-spacing: 0.3px;
  margin-top: 24px;
  text-shadow: 0 1px 12px #142b49;
}
.mobile-break {
  display: none;
}
.hero-actions {
  margin-top: 25px;
}
.hero-actions .button {
  font-family: Roboto;
  font-weight: 500;
}
.hero {
  height: 215svh;
}
.hero .world {
  filter: saturate(calc(0.82 + var(--p) * 0.25));
  transition: filter 1.3s;
}
.hero .base {
  filter: brightness(calc(0.76 + var(--p) * 0.36));
}
.hero .middle,
.hero .foreground {
  filter: brightness(calc(0.76 + var(--p) * 0.36));
}
.scene-shade {
  background: linear-gradient(
    180deg,
    #101f3e80 0%,
    #12233b0a 32%,
    #12233b00 54%,
    #07172530 74%,
    #071725b0 100%
  );
}
.sun {
  width: 8%;
  left: 46%;
  background: radial-gradient(circle at 38% 35%, #fffce9, #ffe0a1);
  box-shadow:
    0 0 50px 28px #ffd49770,
    0 0 160px 90px #ffae6030;
  top: calc(57% - var(--p) * 29%);
}
.sun-rays {
  position: absolute;
  z-index: 1;
  width: 95%;
  height: 120%;
  left: 2.5%;
  top: -22%;
  background: repeating-conic-gradient(
    from 0deg at 50% 50%,
    #fff3d400 0deg 13deg,
    #ffe9bc22 15deg 17deg,
    #fff3d400 20deg 30deg
  );
  mask-image: radial-gradient(ellipse, #0009 0%, transparent 65%);
  opacity: calc(var(--p) * 0.5);
  transform: rotate(calc(var(--p) * 12deg));
  pointer-events: none;
}
.sun-glow {
  background: radial-gradient(ellipse at 50% 42%, #ffcf8b95 0%, #ffb87526 30%, transparent 62%);
}
.hero-stars {
  position: absolute;
  inset: 0;
  z-index: 1;
  opacity: 0;
  transition: opacity 1.2s;
  background-image:
    radial-gradient(circle at 13% 14%, #fff 0 1px, transparent 1.7px),
    radial-gradient(circle at 35% 9%, #fff 0 1px, transparent 2px),
    radial-gradient(circle at 65% 16%, #d6e8ff 0 1px, transparent 2px),
    radial-gradient(circle at 85% 23%, #fff 0 1.3px, transparent 2px),
    radial-gradient(circle at 47% 24%, #fff 0 0.8px, transparent 1.5px);
  background-size:
    320px 210px,
    470px 340px,
    370px 260px,
    510px 360px,
    430px 310px;
  animation: starBreath 5s ease-in-out infinite;
}
.birds {
  width: 18%;
  height: auto;
  left: 60%;
  top: 32%;
  opacity: 0.8;
  color: #1b3446;
  animation: flockTravel 25s ease-in-out infinite;
}
.flying-bird {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
}
.wing {
  transform-box: fill-box;
  transform-origin: 50% 85%;
  animation: wingBeat 1s ease-in-out infinite;
}
.b2 .wing {
  animation-delay: -0.4s;
  animation-duration: 1.15s;
}
.b3 .wing {
  animation-delay: -0.7s;
  animation-duration: 0.9s;
}
.b4 .wing {
  animation-delay: -0.15s;
  animation-duration: 1.3s;
}
.cloud-one,
.cloud-two {
  animation: mistBreath 15s ease-in-out infinite;
}
.brand-reveal {
  top: 24%;
  gap: 0;
  color: #142b49;
  isolation: isolate;
}
.logo-aura {
  position: absolute;
  z-index: -1;
  width: 520px;
  height: 520px;
  top: -130px;
  border-radius: 50%;
  background: radial-gradient(circle, #fff5d7bb 0%, #fff0cc85 30%, #ffdab72e 50%, transparent 68%);
  transform: scale(calc(0.7 + var(--p) * 0.4));
  pointer-events: none;
}
.reveal-overline {
  font-family: Montserrat;
  font-size: 9px;
  letter-spacing: 2.7px;
  font-weight: 700;
  margin-bottom: 30px;
  white-space: nowrap;
}
.reveal-mark {
  width: 135px;
  height: 135px;
  object-fit: contain;
  transform: translateY(calc(24px - var(--p) * 24px)) scale(calc(0.8 + var(--p) * 0.2));
  filter: none;
}
.reveal-word {
  width: 365px;
  height: auto;
  filter: none;
  margin-top: 20px;
  max-width: 74vw;
}
.brand-reveal p {
  font-family: Montserrat;
  font-size: 14px;
  letter-spacing: 0.5px;
  font-weight: 600;
  margin-top: 18px;
}
.hero-bottom .place {
  font-size: 9px;
}
.hero-bottom {
  bottom: 30px;
}
.section {
  position: relative;
  background: rgba(var(--surface), 0.9);
  transition:
    background 0.9s,
    color 0.9s;
}
.section:before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at 100% 100%, transparent, #ffffff00);
  z-index: -1;
}
.purpose {
  background: linear-gradient(90deg, rgba(var(--surface), 0.98), rgba(var(--surface), 0.85));
}
.ecosystem {
  background: rgba(var(--surface), 0.94);
}
.process {
  background: linear-gradient(90deg, rgba(var(--surface), 0.96), rgba(var(--surface), 0.87));
}
.for-you {
  background: linear-gradient(90deg, #142b49ed, #142b49aa);
  color: #f6f2e9;
  backdrop-filter: blur(3px);
}
.contact {
  background: rgba(var(--surface), 0.94);
}
.section-heading h2 {
  font-weight: 700;
}
.purpose-grid h2 {
  font-size: clamp(34px, 4vw, 60px);
}
.side-note {
  font-family: Roboto;
}
.biome-window {
  position: relative;
  min-height: 53svh;
  display: flex;
  align-items: end;
  padding: 70px max(6%, calc((100vw - 1320px) / 2));
  color: white;
  overflow: hidden;
  background:
    linear-gradient(90deg, #071d2c83, #071d2c15 75%),
    linear-gradient(0deg, #071d2c35, transparent 70%);
}
.biome-window:before,
.biome-window:after {
  content: '';
  position: absolute;
  pointer-events: none;
  inset: 0;
}
.biome-window:before {
  background: linear-gradient(120deg, #ffffff10, transparent 35%, #fff5c90b 55%, transparent 80%);
  transform: translateX(calc(var(--section-progress, 0) * 12%));
}
.biome-window:after {
  border-top: 1px solid #ffffff15;
  border-bottom: 1px solid #ffffff15;
}
.window-caption {
  position: relative;
  z-index: 2;
  max-width: 670px;
}
.window-kicker {
  font-family: Montserrat;
  font-size: 10px;
  letter-spacing: 2.7px;
  display: block;
  margin-bottom: 22px;
}
.window-caption h2 {
  font-size: clamp(36px, 4.5vw, 67px);
  line-height: 1.12;
  letter-spacing: -2.4px;
  text-shadow: 0 1px 30px #071d2c40;
}
.window-caption p {
  font-size: 14px;
  margin-top: 20px;
  max-width: 480px;
  color: #f7f6f1dd;
  line-height: 1.6;
}
.landscape-note {
  position: absolute;
  bottom: 25px;
  right: 5%;
  font-size: 9px;
  letter-spacing: 0.4px;
  color: #ffffffb0;
}
.window-trail {
  display: block;
  margin-top: 30px;
  width: 90px;
  height: 1px;
  background: #ffffff50;
  position: relative;
}
.window-trail i {
  position: absolute;
  left: 0;
  top: 0;
  height: 1px;
  width: calc(15% + var(--section-progress, 0) * 85%);
  background: #ffad7e;
}
.window-trail i:after {
  content: '';
  display: block;
  position: absolute;
  right: 0;
  top: -3px;
  width: 7px;
  height: 7px;
  background: #ffad7e;
  border-radius: 50%;
}
.journey-compass {
  position: fixed;
  z-index: 15;
  right: 15px;
  top: 47%;
  display: flex;
  align-items: center;
  gap: 10px;
  writing-mode: vertical-rl;
  color: white;
  mix-blend-mode: difference;
  pointer-events: none;
  font-size: 8px;
  letter-spacing: 1.7px;
  opacity: 0.7;
}
.compass-line {
  height: 45px;
  width: 1px;
  background: currentColor;
}
.initiative-art svg {
  animation: iconAlive 7s ease-in-out infinite;
  transform-origin: 50% 55%;
  will-change: transform;
}
.initiative:nth-child(2n) svg {
  animation-delay: -2s;
}
.initiative:nth-child(3n) svg {
  animation-delay: -4s;
}
.initiative:nth-child(4n) svg {
  animation-delay: -1s;
}
.initiative-open:hover .initiative-art svg {
  animation-play-state: paused;
  transform: scale(1.08) rotate(-3deg);
}
.initiative-art:before {
  content: '';
  width: 6px;
  height: 6px;
  position: absolute;
  left: 15%;
  top: 21%;
  background: var(--art-ink);
  border-radius: 50%;
  opacity: 0.35;
  animation: orbitDot 9s ease-in-out infinite;
}
.initiative-art:after {
  content: '';
  position: absolute;
  inset: 0;
  border: 1px solid #142b4908;
  border-radius: inherit;
  pointer-events: none;
  transition: box-shadow 0.4s;
}
.initiative-open:hover .initiative-art:after {
  box-shadow: inset 0 0 30px #ffffff45;
}
.initiative-status.available:before {
  background: #278556;
}
.initiative-status.development:before {
  background: #c2822d;
}
.initiative-status {
  font-size: 9px;
}
.initiative-name h3 {
  font-size: 17px;
  letter-spacing: -0.6px;
}
.initiative-name {
  align-items: start;
}
.initiative-info p {
  font-size: 12px;
  min-height: 54px;
}
.art-caption {
  font-size: 8px;
}
.catalog {
  grid-template-columns: repeat(3, 1fr);
  gap: 35px 24px;
}
.initiative-art {
  aspect-ratio: 1.55;
}
.initiative-art svg {
  width: 70%;
  height: 84%;
}
.filters {
  max-width: 850px;
}
.detail-art {
  animation: iconAlive 8s ease-in-out infinite;
}
.detail-art svg {
  color: var(--art-ink);
}
.detail-status {
  display: inline-flex;
  padding: 7px 12px;
  border-radius: 25px;
  font-size: 11px;
  background: #dde8de;
  color: #246446;
}
.detail-status.development {
  background: #f0e0c9;
  color: #80551c;
}
.detail-extra {
  font-size: 12px !important;
  padding: 15px;
  border-left: 2px solid #ef6b2e;
  background: #142b4905;
}
.detail-actions {
  align-items: center;
}
.detail-actions .text-link {
  font-size: 11px;
}
.outline {
  border: 1px solid #142b4940;
  background: transparent;
  color: var(--navy);
}
.story {
  background: linear-gradient(90deg, rgba(var(--surface), 0.97), rgba(var(--surface), 0.9));
}
.story-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 95px;
  align-items: start;
}
.story-heading {
  position: sticky;
  top: 125px;
}
.story-heading h2 {
  font-size: clamp(34px, 4.2vw, 63px);
  line-height: 1.1;
}
.story-heading > p {
  font-size: 15px;
  color: var(--muted);
  max-width: 430px;
  margin-top: 26px;
  line-height: 1.7;
}
.story-heading > p + p {
  margin-top: 15px;
}
.story-signature {
  display: inline-block;
  margin-top: 38px;
  font-family: Montserrat;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 1px;
}
.story-signature small {
  font-family: Roboto;
  font-size: 11px;
  letter-spacing: 0;
  font-weight: 400;
}
.timeline {
  list-style: none;
  padding: 0 0 0 15px;
  margin: 0;
  position: relative;
  isolation: isolate;
}
.timeline:after {
  content: '';
  position: absolute;
  top: 16px;
  bottom: 30px;
  left: 32px;
  width: 1px;
  background: var(--line);
  z-index: -2;
}
.timeline:before {
  content: '';
  position: absolute;
  top: 16px;
  left: 32px;
  width: 1px;
  height: calc(var(--section-progress, 0) * 92%);
  max-height: calc(100% - 46px);
  background: linear-gradient(#ef6b2e, #2457d6);
  z-index: -1;
}
.timeline li {
  display: flex;
  gap: 24px;
  padding-bottom: 45px;
}
.timeline li:last-child {
  padding-bottom: 0;
}
.timeline-marker {
  display: flex;
  width: 35px;
  height: 35px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: rgb(var(--surface));
  font-size: 9px;
  letter-spacing: 1px;
  color: var(--blue);
  transition:
    background 0.5s,
    border-color 0.5s,
    color 0.5s;
}
.timeline li.revealed .timeline-marker {
  background: var(--blue);
  border-color: var(--blue);
  color: white;
}
.timeline-era {
  font-size: 8px;
  letter-spacing: 1.6px;
  font-family: Montserrat;
  display: block;
  margin: 6px 0 13px;
  color: var(--muted);
}
.timeline h3 {
  font-size: 21px;
  letter-spacing: -0.7px;
  line-height: 1.25;
}
.timeline p {
  font-size: 13px;
  line-height: 1.7;
  margin-top: 13px;
  color: var(--muted);
}
.direct-contact {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 9px;
  margin-top: 22px;
  font-size: 12px;
}
.direct-contact a:hover {
  color: var(--blue);
}
.direct-contact a:first-child {
  font-size: 18px;
  font-family: Montserrat;
  font-weight: 700;
  margin-bottom: 5px;
  letter-spacing: -0.5px;
}
.contact-copy h2 {
  font-family: Montserrat;
}
.wizard h3 {
  font-size: 23px;
  font-family: Montserrat;
  letter-spacing: -0.9px;
}
.wizard {
  background: #f9f8f4f5;
}
.send-options {
  display: flex;
  gap: 9px;
  margin-top: 20px;
  flex-wrap: wrap;
}
.send-options .button {
  font-size: 11px;
  padding: 14px 17px;
  gap: 14px;
}
.whatsapp {
  background: #276e50;
  color: white;
}
.summary-actions {
  gap: 14px;
  margin-top: 12px;
}
.summary-actions .button {
  background: transparent;
  border: 1px solid #142b4930;
  color: var(--navy);
  font-size: 10px;
  padding: 10px 14px;
}
.summary-actions .text-link {
  font-size: 11px;
}
.closing {
  background: linear-gradient(0deg, #05203f75, #05203f50);
  color: #fff;
  padding: 100px 6% 90px;
  backdrop-filter: none;
  border-top: 1px solid #ffffff25;
}
.closing-symbol {
  color: #ffffff08;
  left: -80px;
  top: -80px;
}
.closing h2 {
  font-size: clamp(38px, 5vw, 74px);
  font-family: Montserrat;
  line-height: 1.09;
}
.ocean-kicker {
  display: block;
  font-family: Montserrat;
  font-size: 9px;
  letter-spacing: 2.3px;
  position: relative;
  margin-bottom: 45px;
  color: #c8e9ec;
}
.closing > p {
  font-size: 12px;
  color: #dceaf4;
}
.ocean-footer {
  background: linear-gradient(#0620398a, #031223ed);
  color: #f6f2e9;
  padding: 45px 6% 45px;
  overflow: hidden;
  min-height: 420px;
}
.footer-top,
.footer-columns,
.footer-bottom {
  position: relative;
  z-index: 2;
}
.footer-top img {
  width: 210px;
  height: auto;
}
.footer-top > span {
  font-family: Montserrat;
  font-size: 12px;
}
.footer-top {
  padding-bottom: 35px;
}
.footer-columns {
  display: grid;
  grid-template-columns: 1.15fr 1fr 0.8fr;
  gap: 40px;
  padding: 30px 0 40px;
  border-top: 1px solid #ffffff22;
}
.footer-columns > div {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 9px;
}
.footer-label {
  font-family: Montserrat;
  letter-spacing: 2px;
  font-size: 8px;
  color: #b5d5dc;
  display: block;
  margin-bottom: 15px;
}
.footer-columns a {
  font-size: 12px;
  color: #f1f3f5dd;
}
.footer-columns a:hover {
  color: #ffbc8c;
}
.footer-phone {
  margin-top: 9px;
  font-size: 15px !important;
}
.influence-countries {
  font-family: Montserrat;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1px;
}
.influence-cities {
  font-size: 12px;
  color: #c4d3db;
  margin-top: 7px;
  line-height: 1.8;
}
.footer-bottom {
  font-size: 9px;
  padding-top: 20px;
  color: #b5cbd5;
}
.marine-floor {
  position: absolute;
  bottom: -10px;
  left: 0;
  right: 0;
  height: 120px;
  opacity: 0.3;
  pointer-events: none;
  border-radius: 50% 40% 0 0;
  background: radial-gradient(ellipse at 30% 100%, #0d4d50, transparent 65%);
}
.seaweed {
  display: block;
  position: absolute;
  bottom: -10px;
  width: 18px;
  height: 95px;
  border-radius: 90% 0 80% 0;
  background: #387978;
  transform-origin: 50% 100%;
  animation: kelpSway 6s ease-in-out infinite;
}
.w1 {
  left: 3%;
  height: 115px;
}
.w2 {
  left: 6%;
  height: 80px;
  animation-delay: -2s;
}
.w3 {
  right: 7%;
  height: 100px;
  animation-delay: -4s;
}
.w4 {
  right: 10%;
  height: 65px;
}
.w5 {
  left: 10%;
  height: 50px;
  animation-delay: -1s;
}
.motion-enabled .reveal-item {
  transition:
    opacity 0.8s ease,
    transform 0.8s ease;
}
.motion-enabled .reveal-item:not(.revealed) {
  opacity: 0;
  transform: translateY(25px);
}
.motion-enabled .reveal-item.revealed {
  opacity: 1;
  transform: none;
}
body[data-theme='night'] {
  --ink: #eaf0f9;
  --surface: 12, 25, 42;
  --muted: #b7c8d8;
  --line: #ffffff28;
  --blue: #85b1ff;
  color: #eaf0f9;
}
body[data-theme='night'] .habitat-scene {
  filter: brightness(0.43) saturate(0.65) hue-rotate(10deg);
}
body[data-theme='night'] .habitat-tint {
  background: #06132d66;
}
body[data-theme='night'] .header.scrolled {
  background: #0c192aef;
  color: #ecf0f6;
  box-shadow: 0 1px 0 #ffffff20;
}
body[data-theme='night'] .header.scrolled .theme-switch {
  background: #ffffff0c;
  border-color: #ffffff35;
}
body[data-theme='night'] .header.scrolled .theme-switch button {
  color: #dce6f4;
}
body[data-theme='night'] .header.scrolled .theme-switch button[aria-pressed='true'] {
  background: #eaf0f9;
  color: #142b49;
}
body[data-theme='night'] .scrolled .nav-cta {
  border-color: #ffffff45;
}
body[data-theme='night'] .hero .world {
  filter: brightness(0.49) saturate(0.55) hue-rotate(10deg);
}
body[data-theme='night'] .hero-stars {
  opacity: 1;
  filter: brightness(2.8);
}
body[data-theme='night'] .sun {
  background: radial-gradient(circle at 35% 35%, #edf1f4 0%, #d1dfed 55%, #e8eef4 80%);
  box-shadow:
    0 0 70px 15px #c6deff50,
    0 0 160px 60px #b9d8ff28;
  filter: brightness(2);
}
body[data-theme='night'] .sun:after {
  content: '';
  position: absolute;
  inset: 15%;
  border-radius: 50%;
  background:
    radial-gradient(circle at 30% 30%, #667d9325 0 13%, transparent 15%),
    radial-gradient(circle at 63% 65%, #667d931f 0 16%, transparent 18%);
}
body[data-theme='night'] .sun-rays {
  display: none;
}
body[data-theme='night'] .sun-glow {
  background: radial-gradient(ellipse at 50% 42%, #85b5ff50, transparent 55%);
}
body[data-theme='night'] .hero h1 em {
  color: #ffc6a2;
}
body[data-theme='night'] .birds {
  color: #9ebad9;
  opacity: 0.7;
}
body[data-theme='night'] .brand-reveal {
  color: #f4f5f7;
}
body[data-theme='night'] .logo-aura {
  background: radial-gradient(circle, #acd2ff55 0%, #86b4fb25 30%, #abcfff12 45%, transparent 67%);
}
body[data-theme='night'] .reveal-overline {
  color: #dae5fa;
}
body[data-theme='night'] .biome-window {
  background:
    linear-gradient(90deg, #030d225e, #030d2225), linear-gradient(0deg, #030d2266, transparent 60%);
}
body[data-theme='night'] .section {
  background: rgba(var(--surface), 0.92);
}
body[data-theme='night'] .for-you {
  background: linear-gradient(90deg, #081426ee, #081426b8);
}
body[data-theme='night'] .filter {
  border-color: #a0b2ca50;
  color: #dfe8f3;
}
body[data-theme='night'] .filter.active {
  background: #b3ceff;
  color: #10243d;
  border-color: #b3ceff;
}
body[data-theme='night'] .filter:hover:not(.active) {
  background: #a0b2ca15;
}
body[data-theme='night'] .search {
  border-color: #d5e4ff;
}
body[data-theme='night'] .search input {
  color: #eaf0f9;
}
body[data-theme='night'] .search input::placeholder {
  color: #9fb0c8;
}
body[data-theme='night'] .initiative-art {
  background: color-mix(in srgb, var(--art-ink) 23%, #0b1b32);
  color: #b8d2f9;
}
body[data-theme='night'] .initiative-art svg {
  color: #b8d2f9;
}
body[data-theme='night'] .initiative-art:before {
  background: #d9f3ad;
  box-shadow: 0 0 8px #d9f3ad;
  opacity: 0.8;
}
body[data-theme='night'] .initiative-art:after {
  background-image:
    radial-gradient(circle at 15% 30%, #e4edff 0 1px, transparent 1.5px),
    radial-gradient(circle at 85% 20%, #ffd6a7 0 1px, transparent 1.5px),
    radial-gradient(circle at 80% 65%, #e4edff 0 1px, transparent 1.5px);
  border-color: #ffffff15;
}
body[data-theme='night'] .art-caption,
body[data-theme='night'] .art-number {
  color: #b6cbed;
}
body[data-theme='night'] .initiative-status {
  color: #b5c4d6;
}
body[data-theme='night'] .initiative-status.available:before {
  background: #8ed6ae;
}
body[data-theme='night'] .initiative-status.development:before {
  background: #e9bc6c;
}
body[data-theme='night'] .recommendation {
  background: #172d48;
  color: #ecf2fa;
  border: 1px solid #ffffff20;
}
body[data-theme='night'] .recommendation > p {
  color: #c0cedd;
}
body[data-theme='night'] .recommendation .rec-art {
  filter: brightness(1.8);
}
body[data-theme='night'] .rec-tags button {
  border-color: #ffffff40;
  color: #dce7f8;
}
body[data-theme='night'] .recommendation .text-link {
  border-color: #ffffff30;
}
body[data-theme='night'] .wizard,
body[data-theme='night'] dialog {
  background: #14283e;
  color: #eef3fa;
  border-color: #ffffff30;
}
body[data-theme='night'] .help-options label {
  background: #102137;
  border-color: #ffffff25;
}
body[data-theme='night'] .help-options label:has(input:checked) {
  background: #244166;
  border-color: #93b9fb;
}
body[data-theme='night'] .field input,
body[data-theme='night'] .field textarea,
body[data-theme='night'] .field select {
  background: #0a1c2f;
  color: #eef3fa;
  border-color: #99aacc66;
  color-scheme: dark;
}
body[data-theme='night'] .field input::placeholder,
body[data-theme='night'] .field textarea::placeholder {
  color: #9eb0c6;
}
body[data-theme='night'] .summary-actions .button {
  border-color: #a6bfdd66;
  color: #eaf0f9;
}
body[data-theme='night'] .navy {
  background: #2457d6;
  color: white;
}
body[data-theme='night'] .text-link:hover {
  color: #b4ceff;
}
body[data-theme='night'] .detail-art {
  background: color-mix(in srgb, var(--art-ink) 25%, #0b1b32);
}
body[data-theme='night'] .detail-art svg {
  color: #b8d2f9;
}
body[data-theme='night'] .detail-status {
  background: #254a40;
  color: #c4f1d8;
}
body[data-theme='night'] .detail-status.development {
  background: #52432b;
  color: #f3d7a6;
}
body[data-theme='night'] .detail-meta,
body[data-theme='night'] .outline {
  border-color: #ffffff35;
}
body[data-theme='night'] .outline {
  color: #e8effa;
}
body[data-theme='night'] .detail-extra {
  background: #ffffff06;
}
body[data-theme='night'] .empty-state {
  background: #172e48;
}
body[data-theme='night'] .closing {
  background: linear-gradient(#020e2377, #020e23a0);
}
body[data-theme='night'] .ocean-footer {
  background: linear-gradient(#020e2399, #020a18ed);
}
body[data-theme='night'] .menu-toggle {
  border-color: #ffffff50;
}
@keyframes wingBeat {
  0%,
  100% {
    transform: scaleY(1);
  }
  50% {
    transform: scaleY(-0.65);
  }
}
@keyframes flockTravel {
  0%,
  100% {
    transform: translate(0, 0) rotate(-2deg);
  }
  50% {
    transform: translate(-100px, -12px) rotate(2deg);
  }
}
@keyframes mistBreath {
  0%,
  100% {
    opacity: 0.12;
  }
  50% {
    opacity: 0.25;
  }
}
@keyframes iconAlive {
  0%,
  100% {
    transform: translateY(0) rotate(-1deg);
  }
  50% {
    transform: translateY(-5px) rotate(1.5deg);
  }
}
@keyframes orbitDot {
  0%,
  100% {
    transform: translate(0, 0);
    opacity: 0.25;
  }
  50% {
    transform: translate(8px, -10px);
    opacity: 0.65;
  }
}
@keyframes starBreath {
  0%,
  100% {
    filter: brightness(0.8);
  }
  50% {
    filter: brightness(1.6);
  }
}
@keyframes kelpSway {
  0%,
  100% {
    transform: rotate(-8deg);
  }
  50% {
    transform: rotate(9deg);
  }
}
@media (min-width: 1600px) {
  .hero-copy {
    top: 26%;
  }
  .brand-reveal {
    top: 27%;
  }
}
@media (max-width: 1200px) {
  .header {
    gap: 18px;
  }
  .brand img {
    width: 160px;
  }
  .header nav {
    gap: 19px;
    font-size: 11px;
  }
  .nav-cta {
    gap: 10px;
    padding: 11px;
    font-size: 10px;
  }
  .theme-switch button {
    padding: 6px 8px;
  }
  .story-layout {
    gap: 55px;
  }
  .initiative-name h3 {
    font-size: 16px;
  }
  .journey-compass {
    right: 6px;
  }
  .section {
    padding-left: 6%;
    padding-right: 6%;
  }
  .hero h1 {
    font-size: 4.2vw;
  }
}
@media (max-width: 960px) {
  .nav-cta {
    display: none;
  }
  .header nav {
    margin-left: auto;
    gap: 22px;
    font-size: 12px;
  }
  .theme-switch {
    margin-left: 5px;
  }
  .catalog {
    grid-template-columns: repeat(3, 1fr);
    gap: 28px 18px;
  }
  .initiative-art {
    aspect-ratio: 1.2;
  }
  .initiative-name h3 {
    font-size: 14px;
  }
  .initiative-info p {
    min-height: 72px;
  }
  .story-layout {
    gap: 35px;
  }
  .story-heading h2 {
    font-size: 40px;
  }
  .timeline h3 {
    font-size: 19px;
  }
  .timeline li {
    gap: 18px;
  }
  .timeline p {
    font-size: 12px;
  }
  .hero-description {
    font-size: 17px;
  }
  .hero-copy {
    top: 24%;
  }
}
@media (max-width: 800px) {
  .header {
    height: 82px;
    gap: 15px;
  }
  .header nav {
    margin: 0;
    order: 5;
  }
  .theme-switch {
    margin-left: auto;
  }
  .menu-toggle {
    margin-left: 0;
  }
  .header nav.open {
    background: rgb(var(--surface));
    color: var(--ink);
  }
  body[data-theme='night'] .header nav.open {
    background: #0c192a;
    color: #f4f5f7;
  }
  .hero h1 {
    font-size: clamp(29px, 4.8vw, 42px);
    letter-spacing: -1.6px;
  }
  .hero-copy {
    top: 25%;
  }
  .hero-copy .eyebrow {
    font-size: 9px;
    letter-spacing: 1.5px;
  }
  .hero-description {
    font-size: 15px;
  }
  .hero .birds {
    width: 23%;
    left: 58%;
    top: 35%;
  }
  .brand-reveal {
    top: 26%;
  }
  .reveal-mark {
    width: 115px;
    height: 115px;
  }
  .reveal-word {
    width: 320px;
  }
  .reveal-overline {
    font-size: 8px;
    letter-spacing: 1.7px;
  }
  .journey-compass {
    display: none;
  }
  .biome-window {
    min-height: 44svh;
    padding: 60px 6%;
  }
  .window-caption h2 {
    font-size: 45px;
  }
  .window-kicker {
    font-size: 9px;
  }
  .window-caption p {
    font-size: 13px;
  }
  .landscape-note {
    font-size: 8px;
    bottom: 15px;
    right: 6%;
  }
  .catalog {
    grid-template-columns: repeat(2, 1fr);
    gap: 30px 20px;
  }
  .initiative-art {
    aspect-ratio: 1.4;
  }
  .initiative-name h3 {
    font-size: 16px;
  }
  .initiative-info p {
    min-height: 54px;
  }
  .story-layout {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .story-heading {
    position: static;
  }
  .story-heading h2 {
    font-size: 45px;
  }
  .story-heading h2 br:last-of-type {
    display: none;
  }
  .story-heading > p {
    max-width: 600px;
  }
  .story-signature {
    margin-top: 25px;
  }
  .timeline {
    max-width: 620px;
  }
  .timeline li {
    gap: 25px;
  }
  .timeline h3 {
    font-size: 22px;
  }
  .timeline p {
    font-size: 14px;
  }
  .footer-columns {
    grid-template-columns: 1.1fr 1fr;
    gap: 30px;
  }
  .footer-columns > div:last-child {
    grid-column: 1/-1;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 15px;
  }
  .footer-columns > div:last-child .footer-label {
    width: 100%;
    margin-bottom: 0;
  }
  .hero-bottom .place {
    font-size: 8px;
    max-width: 150px;
  }
  .footer-top img {
    width: 180px;
  }
}
@media (max-width: 560px) {
  .brand img {
    width: 142px;
  }
  .header {
    padding-left: 5%;
    padding-right: 5%;
    gap: 10px;
  }
  .theme-switch {
    gap: 1px;
    padding: 2px;
  }
  .theme-switch button {
    font-size: 8px;
    padding: 6px 7px;
    gap: 3px;
  }
  .theme-switch button span {
    font-size: 12px;
  }
  .menu-toggle {
    width: 33px;
    height: 33px;
  }
  .hero-copy {
    top: 22%;
    width: 92%;
    left: 4%;
  }
  .hero-copy .eyebrow {
    max-width: 310px;
    line-height: 1.7;
    font-size: 8px;
    letter-spacing: 1.4px;
    margin-bottom: 23px;
  }
  .hero h1 {
    font-size: clamp(28px, 6.7vw, 37px);
    letter-spacing: -1.25px;
    line-height: 1.16;
  }
  .hero h1 span {
    max-width: 400px;
    margin: auto;
  }
  .hero h1 span + span {
    margin-top: 8px;
  }
  .hero-description {
    font-size: 14px;
    line-height: 1.6;
    margin-top: 21px;
  }
  .mobile-break {
    display: block;
  }
  .hero-actions {
    margin-top: 25px;
  }
  .hero-actions .button {
    padding: 14px 15px;
    font-size: 11px;
    gap: 12px;
  }
  .hero {
    height: 185svh;
  }
  .brand-reveal {
    top: 26%;
  }
  .reveal-mark {
    width: 110px;
    height: 110px;
  }
  .reveal-word {
    width: 265px;
    max-width: 76vw;
  }
  .brand-reveal p {
    font-size: 12px;
  }
  .reveal-overline {
    max-width: 260px;
    white-space: normal;
    text-align: center;
    font-size: 7px;
    line-height: 1.7;
    margin-bottom: 25px;
  }
  .logo-aura {
    width: 380px;
    height: 380px;
    top: -70px;
  }
  .hero .birds {
    top: 37%;
    left: 49%;
    width: 32%;
  }
  .biome-window {
    min-height: 48svh;
    padding: 55px 6% 60px;
    align-items: end;
  }
  .window-caption h2 {
    font-size: 35px;
    letter-spacing: -1.5px;
  }
  .window-kicker {
    font-size: 8px;
    letter-spacing: 2px;
    margin-bottom: 18px;
  }
  .window-caption p {
    font-size: 12px;
    max-width: 290px;
    margin-top: 16px;
  }
  .landscape-note {
    font-size: 7px;
    left: 6%;
    right: auto;
  }
  .section {
    padding-top: 65px;
    padding-bottom: 65px;
  }
  .purpose-grid h2 {
    font-size: 34px;
  }
  .initiative-art {
    aspect-ratio: 1.07;
  }
  .initiative-art svg {
    width: 85%;
    height: 85%;
  }
  .catalog {
    gap: 26px 13px;
  }
  .initiative-name h3 {
    font-size: 13px;
    line-height: 1.3;
    letter-spacing: -0.5px;
  }
  .initiative-info p {
    font-size: 11px;
    line-height: 1.5;
    min-height: 66px;
  }
  .initiative-status {
    font-size: 8px;
    margin-top: 12px;
    line-height: 1.6;
  }
  .art-caption {
    font-size: 6px;
    letter-spacing: 1px;
  }
  .art-number {
    font-size: 7px;
  }
  .filters {
    gap: 6px;
  }
  .filter {
    font-size: 9px;
    padding: 9px 11px;
  }
  .catalog-note {
    font-size: 10px;
  }
  .profile-layout h2 {
    font-size: 35px;
    letter-spacing: -1.6px;
  }
  .recommendation h3 {
    font-size: 27px;
  }
  .story-heading h2 {
    font-size: 37px;
  }
  .story-heading h2 br:last-of-type {
    display: block;
  }
  .story-heading > p {
    font-size: 14px;
    line-height: 1.7;
  }
  .story-signature {
    font-size: 12px;
  }
  .timeline {
    padding-left: 0;
  }
  .timeline:before,
  .timeline:after {
    left: 17px;
  }
  .timeline li {
    gap: 19px;
    padding-bottom: 35px;
  }
  .timeline-marker {
    width: 35px;
    height: 35px;
    font-size: 8px;
  }
  .timeline-era {
    font-size: 7px;
    letter-spacing: 1.3px;
  }
  .timeline h3 {
    font-size: 20px;
  }
  .timeline p {
    font-size: 12px;
    line-height: 1.8;
  }
  .contact-copy h2 {
    font-size: 38px;
  }
  .direct-contact a:first-child {
    font-size: 16px;
  }
  .direct-contact {
    font-size: 11px;
  }
  .wizard h3 {
    font-size: 22px;
  }
  .send-options {
    gap: 8px;
  }
  .send-options .button {
    font-size: 10px;
    padding: 13px 12px;
    gap: 12px;
  }
  .closing {
    padding: 65px 6% 70px;
  }
  .closing h2 {
    font-size: 36px;
    letter-spacing: -1.8px;
  }
  .ocean-kicker {
    font-size: 7px;
    letter-spacing: 1.5px;
    line-height: 1.7;
    max-width: 240px;
    margin: 0 auto 30px;
  }
  .closing > p {
    font-size: 10px;
  }
  .ocean-footer {
    padding: 35px 6%;
  }
  .footer-top img {
    width: 165px;
  }
  .footer-top > span {
    font-size: 9px;
  }
  .footer-columns {
    grid-template-columns: 1fr;
    gap: 30px;
    padding-top: 25px;
  }
  .footer-columns > div:last-child {
    grid-column: auto;
    gap: 12px;
  }
  .footer-label {
    font-size: 8px;
    margin-bottom: 8px;
    letter-spacing: 1.6px;
  }
  .footer-columns a {
    font-size: 12px;
  }
  .influence-countries {
    font-size: 12px;
  }
  .influence-cities {
    font-size: 12px;
  }
  .footer-columns > div:last-child a {
    font-size: 10px;
  }
  .footer-bottom {
    font-size: 9px;
    line-height: 1.7;
  }
  .footer-bottom > div {
    gap: 14px;
    font-size: 9px;
  }
  .footer-bottom > span:last-child {
    display: block;
  }
  .footer-top > span {
    margin-left: auto;
  }
  .footer-top > a:last-child {
    font-size: 11px;
  }
  .ocean-footer .footer-top {
    padding-bottom: 25px;
  }
  .detail-art {
    width: 110px;
    height: 110px;
  }
  .detail-actions .text-link {
    margin: 5px 0;
  }
  .outline {
    font-size: 12px;
  }
  .sun-rays {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero {
    height: 100svh;
  }
  .hero-copy {
    opacity: 1;
    transform: none;
  }
  .brand-reveal {
    display: none;
  }
  .habitat-scene {
    transform: none;
  }
  .motion-enabled .reveal-item:not(.revealed) {
    opacity: 1;
    transform: none;
  }
  .hero-stars {
    animation: none;
  }
  .hero .world {
    filter: saturate(1);
  }
  body[data-theme='night'] .hero .world {
    filter: brightness(0.49) saturate(0.55);
  }
  .timeline:before {
    height: calc(100% - 46px);
  }
  .sun {
    top: 37%;
  }
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.field-observer {
  position: absolute;
  z-index: 6;
  bottom: 16%;
  left: 19%;
  height: 48px;
  width: 43px;
  opacity: 0.8;
  transform: translateY(calc(var(--p) * 3px));
}
.sensor-beacon {
  animation: sensorPulse 3s ease-in-out infinite;
}
body[data-theme='night'] .sensor-screen {
  filter: drop-shadow(0 0 4px #9adcf5);
  fill: #b7e9ff;
}
body[data-theme='night'] .sensor-beacon {
  fill: #bde9e8;
  filter: drop-shadow(0 0 4px #a1efff);
}
.motion-enabled .reveal-item:focus-within {
  opacity: 1 !important;
  transform: none !important;
}
@keyframes sensorPulse {
  0%,
  100% {
    opacity: 0.35;
  }
  50% {
    opacity: 1;
  }
}
@media (max-width: 560px) {
  .field-observer {
    left: 44%;
    height: 35px;
    width: 31px;
    bottom: 17%;
  }
}

.habitat-scene[data-landscape='sierra'] {
  background-position: 50% 72%;
  filter: saturate(1.05) brightness(1.1);
}
body[data-theme='night'] .habitat-scene[data-landscape='sierra'] {
  filter: brightness(0.43) saturate(0.65);
}
body[data-theme='night'] .purpose-text .text-link {
  border-color: #a5bfdd80;
}