:root {
  color-scheme: dark;
  --ink: #151838;
  --purple: #663ed0;
  --azure: #3ea8c9;
  --blue: #446bc1;
  --ice: #f5f7f7;
  --muted: #b7bfd6;
  --line: rgba(245, 247, 247, 0.14);
  --panel: rgba(245, 247, 247, 0.055);
  --panel-strong: rgba(245, 247, 247, 0.09);
  --shadow: 0 28px 80px rgba(4, 7, 30, 0.35);
  --radius: 1.5rem;
  font-family:
    ui-sans-serif,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
  font-synthesis: none;
}

* {
  box-sizing: border-box;
}

html {
  overflow-x: clip;
  scroll-behavior: smooth;
}

body {
  --page-field-angle: 132deg;
  --page-field-a: rgba(62, 168, 201, 0.11);
  --page-field-b: rgba(68, 107, 193, 0.055);
  --page-field-c: rgba(102, 62, 208, 0.1);
  isolation: isolate;
  min-width: 320px;
  margin: 0;
  overflow-x: clip;
  background-color: var(--ink);
  background-image:
    linear-gradient(rgba(245, 247, 247, 0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(245, 247, 247, 0.025) 1px, transparent 1px),
    linear-gradient(
      var(--page-field-angle),
      var(--page-field-a) 0%,
      transparent 24%,
      var(--page-field-b) 53%,
      transparent 72%,
      var(--page-field-c) 100%
    );
  background-size:
    48px 48px,
    48px 48px,
    auto,
    auto;
  color: var(--ice);
  font-size: 1rem;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
}

.about-page {
  --page-field-angle: 118deg;
  --page-field-a: rgba(62, 168, 201, 0.12);
  --page-field-b: rgba(68, 107, 193, 0.065);
  --page-field-c: rgba(102, 62, 208, 0.09);
}

.approach-page {
  --page-field-angle: 224deg;
  --page-field-a: rgba(102, 62, 208, 0.11);
  --page-field-b: rgba(68, 107, 193, 0.07);
  --page-field-c: rgba(62, 168, 201, 0.1);
}

.frostie-page {
  --page-field-angle: 146deg;
  --page-field-a: rgba(62, 168, 201, 0.14);
  --page-field-b: rgba(68, 107, 193, 0.08);
  --page-field-c: rgba(102, 62, 208, 0.14);
}

.contact-page {
  --page-field-angle: 126deg;
  --page-field-a: rgba(62, 168, 201, 0.12);
  --page-field-b: rgba(68, 107, 193, 0.055);
  --page-field-c: rgba(102, 62, 208, 0.1);
}

.legal-page,
.not-found-page {
  --page-field-angle: 142deg;
  --page-field-a: rgba(62, 168, 201, 0.055);
  --page-field-b: rgba(68, 107, 193, 0.035);
  --page-field-c: rgba(102, 62, 208, 0.045);
}

body > .site-header,
body > main,
body > .site-footer {
  position: relative;
  z-index: 1;
}

a {
  color: inherit;
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.2em;
}

a:hover {
  text-decoration-color: var(--azure);
}

a:focus-visible {
  border-radius: 0.2rem;
  outline: 3px solid var(--azure);
  outline-offset: 4px;
}

img {
  display: block;
  max-width: 100%;
}

.skip-link {
  position: fixed;
  z-index: 20;
  top: 0.75rem;
  left: 0.75rem;
  padding: 0.65rem 0.9rem;
  transform: translateY(-160%);
  border-radius: 999px;
  background: var(--ice);
  color: var(--ink);
  font-weight: 800;
}

.skip-link:focus {
  transform: translateY(0);
}

.shell {
  width: min(1280px, calc(100% - 2rem));
  margin-inline: auto;
}

.site-header {
  position: relative;
  z-index: 5;
  border-bottom: 1px solid var(--line);
  background: rgba(21, 24, 56, 0.82);
  backdrop-filter: blur(18px);
}

.nav {
  display: flex;
  min-height: 5.25rem;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  color: var(--ice);
  font-weight: 800;
  letter-spacing: -0.02em;
  text-decoration: none;
}

.brand img {
  width: 3.25rem;
  height: 3.25rem;
  object-fit: contain;
  filter: drop-shadow(-0.12rem 0 0.45rem rgba(46, 215, 226, 0.18))
    drop-shadow(0.12rem 0 0.45rem rgba(132, 82, 224, 0.16));
}

.nav-links {
  display: flex;
  align-items: center;
  gap: 1.4rem;
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 650;
}

.nav-links a {
  text-decoration: none;
}

.nav-links a:hover,
.nav-links a[aria-current="page"] {
  color: var(--ice);
}

.nav-toggle {
  display: none;
  min-width: 4.75rem;
  min-height: 2.75rem;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  padding: 0.55rem 0.8rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(245, 247, 247, 0.055);
  color: var(--ice);
  font: inherit;
  font-size: 0.85rem;
  font-weight: 800;
  cursor: pointer;
}

.nav-toggle__icon,
.nav-toggle__icon::before,
.nav-toggle__icon::after {
  display: block;
  width: 1rem;
  height: 1px;
  background: currentcolor;
  content: "";
  transition: transform 180ms ease;
}

.nav-toggle__icon {
  position: relative;
}

.nav-toggle__icon::before {
  position: absolute;
  transform: translateY(-0.32rem);
}

.nav-toggle__icon::after {
  position: absolute;
  transform: translateY(0.32rem);
}

.nav[data-nav-open="true"] .nav-toggle__icon {
  background: transparent;
}

.nav[data-nav-open="true"] .nav-toggle__icon::before {
  transform: rotate(45deg);
}

.nav[data-nav-open="true"] .nav-toggle__icon::after {
  transform: rotate(-45deg);
}

.button {
  display: inline-flex;
  min-height: 3rem;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 1.15rem;
  border: 1px solid rgba(245, 247, 247, 0.16);
  border-radius: 999px;
  background: linear-gradient(
    135deg,
    var(--azure),
    var(--blue) 52%,
    var(--purple)
  );
  box-shadow: 0 12px 35px rgba(68, 107, 193, 0.28);
  color: white;
  font-size: 0.92rem;
  font-weight: 800;
  text-decoration: none;
  transition:
    transform 220ms ease,
    box-shadow 220ms ease;
}

.button:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 42px rgba(68, 107, 193, 0.38);
  text-decoration: none;
}

.button.secondary {
  background: rgba(245, 247, 247, 0.06);
  box-shadow: none;
}

.hero {
  display: grid;
  min-height: 42rem;
  align-items: center;
  gap: 4rem;
  padding-block: 6rem;
  grid-template-columns: minmax(0, 1.2fr) minmax(18rem, 0.8fr);
}

.hero > *,
.section-intro > *,
.frostie-panel > *,
.contact-panel > * {
  min-width: 0;
}

.hero > :first-child {
  position: relative;
  z-index: 2;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0 0 1.3rem;
  color: #bdeff9;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.eyebrow::before {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: var(--azure);
  box-shadow: 0 0 18px var(--azure);
  content: "";
}

.eyebrow-ink {
  color: var(--blue);
}

h1,
h2,
h3 {
  margin-top: 0;
  line-height: 1.08;
  letter-spacing: -0.04em;
}

h1 {
  max-width: 13ch;
  margin-bottom: 1.5rem;
  font-size: clamp(3rem, 7vw, 6.6rem);
}

h1 > span {
  display: block;
}

h2 {
  max-width: 18ch;
  margin-bottom: 1rem;
  font-size: clamp(2rem, 4.2vw, 3.7rem);
}

h3 {
  margin-bottom: 0.7rem;
  font-size: 1.25rem;
}

.lead {
  max-width: 63ch;
  margin: 0;
  color: #d6dced;
  font-size: clamp(1.08rem, 1.8vw, 1.3rem);
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin-top: 2rem;
}

.energy-badge {
  position: relative;
  display: grid;
  width: min(100%, 25rem);
  aspect-ratio: 1;
  isolation: isolate;
  place-items: center;
  justify-self: end;
  z-index: 1;
}

.lensing-logo,
.soft-signal {
  pointer-events: none;
}

.energy-badge__atmosphere,
.energy-badge__disc {
  position: absolute;
  border-radius: 50%;
}

.energy-badge__atmosphere {
  z-index: 0;
  inset: -72%;
  background:
    radial-gradient(
      ellipse at 24% 42%,
      rgba(62, 168, 201, 0.27),
      transparent 46%
    ),
    radial-gradient(
      ellipse at 76% 58%,
      rgba(102, 62, 208, 0.23),
      transparent 49%
    ),
    radial-gradient(ellipse, rgba(68, 107, 193, 0.17) 12%, transparent 67%);
  filter: blur(48px);
  opacity: 0.5;
  pointer-events: none;
  will-change: opacity, transform;
}

.energy-badge__corona {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.energy-badge__disc {
  z-index: 2;
  inset: 7%;
  overflow: hidden;
  background: transparent;
  box-shadow:
    0 0 62px rgba(62, 168, 201, 0.08),
    0 0 110px rgba(102, 62, 208, 0.06);
}

.energy-badge__disc img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  mix-blend-mode: screen;
  opacity: 1;
  mask-image: radial-gradient(
    circle,
    #000 0 50%,
    rgba(0, 0, 0, 0.92) 58%,
    rgba(0, 0, 0, 0.58) 69%,
    rgba(0, 0, 0, 0.2) 81%,
    transparent 96%
  );
  -webkit-mask-image: radial-gradient(
    circle,
    #000 0 50%,
    rgba(0, 0, 0, 0.92) 58%,
    rgba(0, 0, 0, 0.58) 69%,
    rgba(0, 0, 0, 0.2) 81%,
    transparent 96%
  );
}

.energy-badge__disc::before {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: url("/assets/belfrost-logo-transparent.png") center / contain
    no-repeat;
  content: "";
  mask-image: radial-gradient(circle, #000 0 54%, transparent 70%);
  -webkit-mask-image: radial-gradient(circle, #000 0 54%, transparent 70%);
  mix-blend-mode: screen;
  pointer-events: none;
}

.brand-emblem {
  position: relative;
  display: grid;
  width: min(100%, 20rem);
  aspect-ratio: 1;
  isolation: isolate;
  place-items: center;
  justify-self: end;
}

.brand-emblem::before {
  display: none;
}

.brand-emblem .energy-badge__disc {
  inset: -1%;
}

.lensing-logo--frostie .energy-badge__disc::before {
  background-image: url("/assets/frostie-os-logo.png");
}

.lensing-logo--belfrost .energy-badge__disc {
  overflow: visible;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.lensing-logo--belfrost .energy-badge__disc::before {
  display: none;
}

.lensing-logo--belfrost .energy-badge__disc img {
  border-radius: 0;
  object-fit: contain;
  mix-blend-mode: normal;
  mask-image: none;
  -webkit-mask-image: none;
  filter: drop-shadow(-0.4rem 0 1.1rem rgba(46, 215, 226, 0.17))
    drop-shadow(0.4rem 0 1.1rem rgba(132, 82, 224, 0.15));
}

/* Shared brand-mark energy field: focus comes from the logo, not surrounding waves. */
.lensing-logo {
  isolation: isolate;
  background:
    radial-gradient(circle, rgba(46, 215, 226, 0.17), transparent 52%),
    radial-gradient(
      circle at 57% 44%,
      rgba(132, 82, 224, 0.14),
      transparent 68%
    );
  animation: mark-resolve 1s ease-out both;
}

.lensing-logo::before {
  position: absolute;
  z-index: 1;
  inset: 0;
  border-radius: 48%;
  background:
    radial-gradient(circle at 79% 28%, #d8fbff 0 0.55%, transparent 1.5%),
    radial-gradient(circle at 22% 67%, #78e8f2 0 0.42%, transparent 1.25%),
    radial-gradient(circle at 65% 84%, #8452e0 0 0.35%, transparent 1.1%),
    conic-gradient(
      from 214deg,
      transparent 0 10%,
      rgba(46, 215, 226, 0.18) 14%,
      rgba(189, 248, 249, 0.9) 24%,
      rgba(68, 107, 193, 0.46) 38%,
      rgba(132, 82, 224, 0.32) 49%,
      transparent 62% 100%
    );
  content: "";
  filter: drop-shadow(0 0 12px rgba(46, 215, 226, 0.3));
  mask: radial-gradient(
    circle closest-side,
    transparent 0 88%,
    #000 89% 91%,
    transparent 92%
  );
  opacity: 0.96;
  pointer-events: none;
  animation:
    orbit-energy 5.8s linear infinite,
    orbit-illumination 3.6s ease-in-out infinite alternate;
}

.lensing-logo::after {
  position: absolute;
  z-index: 1;
  inset: -4% -2%;
  border-radius: 50%;
  background:
    radial-gradient(circle at 18% 44%, #b8a7ff 0 0.5%, transparent 1.5%),
    radial-gradient(circle at 72% 80%, #78e8f2 0 0.34%, transparent 1.1%),
    conic-gradient(
      from 42deg,
      transparent 0 24%,
      rgba(132, 82, 224, 0.22) 30%,
      rgba(102, 62, 208, 0.64) 39%,
      rgba(68, 107, 193, 0.38) 50%,
      transparent 62% 100%
    );
  content: "";
  filter: drop-shadow(0 0 10px rgba(102, 62, 208, 0.28));
  mask: radial-gradient(
    ellipse closest-side,
    transparent 0 90%,
    #000 91% 93%,
    transparent 94%
  );
  opacity: 0.8;
  pointer-events: none;
  animation: orbit-energy-reverse 8.4s linear infinite;
}

.lensing-logo--frostie::before {
  inset: -10%;
  filter: drop-shadow(0 0 15px rgba(46, 215, 226, 0.4));
  mask: radial-gradient(
    circle closest-side,
    transparent 0 91%,
    #000 92% 94%,
    transparent 95%
  );
  opacity: 1;
}

.lensing-logo--frostie::after {
  inset: -15% -12%;
  filter: drop-shadow(0 0 13px rgba(102, 62, 208, 0.38));
  mask: radial-gradient(
    ellipse closest-side,
    transparent 0 91%,
    #000 92% 94%,
    transparent 95%
  );
  opacity: 0.88;
}

.energy-badge__atmosphere {
  inset: -48%;
  background:
    radial-gradient(
      circle at 38% 46%,
      rgba(46, 215, 226, 0.2),
      transparent 43%
    ),
    radial-gradient(
      circle at 62% 55%,
      rgba(132, 82, 224, 0.15),
      transparent 68%
    );
  filter: blur(28px);
  opacity: 0.68;
  animation: field-breathe 4.6s ease-in-out infinite alternate;
}

.energy-badge__corona {
  display: none;
}

.energy-badge__disc {
  background: radial-gradient(
    circle,
    rgba(18, 23, 57, 0.48) 0 42%,
    rgba(18, 23, 57, 0.24) 58%,
    transparent 88%
  );
  box-shadow: none;
}

.energy-badge__disc::before {
  inset: 8%;
  border: 0;
  background: conic-gradient(
    from 210deg,
    transparent,
    rgba(128, 232, 242, 0.22),
    transparent 32%,
    rgba(102, 62, 208, 0.2),
    transparent 70%
  );
  mix-blend-mode: screen;
  opacity: 0.56;
  animation: facet-light 6.5s ease-in-out infinite alternate;
}

@keyframes orbit-energy {
  0% {
    transform: rotate(0deg) scale(0.99);
  }
  38% {
    transform: rotate(137deg) scale(1.015);
  }
  72% {
    transform: rotate(258deg) scale(0.995);
  }
  100% {
    transform: rotate(360deg) scale(0.99);
  }
}

.brand-emblem {
  background:
    radial-gradient(circle, rgba(62, 168, 201, 0.14), transparent 46%),
    radial-gradient(
      circle at 60% 42%,
      rgba(102, 62, 208, 0.11),
      transparent 65%
    );
}

.hero:has(.lensing-logo)::before,
.page-hero:has(.lensing-logo)::before {
  position: absolute;
  z-index: -1;
  right: -8%;
  width: min(54vw, 42rem);
  height: min(54vw, 42rem);
  background:
    linear-gradient(rgba(62, 168, 201, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(102, 62, 208, 0.03) 1px, transparent 1px),
    radial-gradient(circle, rgba(62, 168, 201, 0.09), transparent 64%);
  background-size:
    32px 32px,
    32px 32px,
    auto;
  content: "";
  mask: radial-gradient(circle, #000, transparent 68%);
  opacity: 0.65;
  pointer-events: none;
}

.hero > .hero-signal-field,
.page-hero > .hero-signal-field {
  position: absolute;
  z-index: 0;
  inset: 7% 0;
  overflow: hidden;
  pointer-events: none;
}

.hero-signal-field span {
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #bdeff9;
  box-shadow:
    0 0 8px rgba(189, 239, 249, 0.82),
    0 0 20px rgba(62, 168, 201, 0.4);
  opacity: 0.2;
  animation: hero-signal-drift 7s ease-in-out infinite alternate;
}

.hero-signal-field span:nth-child(1) {
  top: 15%;
  left: 4%;
  animation-delay: -2s;
}
.hero-signal-field span:nth-child(2) {
  top: 34%;
  left: 38%;
  animation-delay: -5s;
}
.hero-signal-field span:nth-child(3) {
  top: 72%;
  left: 22%;
  animation-delay: -1s;
}
.hero-signal-field span:nth-child(4) {
  top: 18%;
  left: 62%;
  animation-delay: -6s;
}
.hero-signal-field span:nth-child(5) {
  top: 57%;
  left: 53%;
  animation-delay: -3s;
}
.hero-signal-field span:nth-child(6) {
  top: 80%;
  left: 69%;
  animation-delay: -7s;
}
.hero-signal-field span:nth-child(7) {
  top: 28%;
  right: 5%;
  animation-delay: -4s;
}
.hero-signal-field span:nth-child(8) {
  top: 68%;
  right: 3%;
  animation-delay: -8s;
}
.hero-signal-field span:nth-child(9) {
  top: 9%;
  left: 48%;
  animation-delay: -3.5s;
}
.hero-signal-field span:nth-child(10) {
  top: 88%;
  left: 43%;
  animation-delay: -6.5s;
}

.hero-signal-field span:nth-child(3n) {
  width: 3px;
  height: 3px;
  background: #9b86ed;
  box-shadow: 0 0 15px rgba(132, 82, 224, 0.48);
  animation-duration: 9.5s;
}

.hero-signal-field span:nth-child(4n) {
  width: 5px;
  height: 5px;
  animation-duration: 11s;
}

@keyframes hero-signal-drift {
  0%,
  18% {
    opacity: 0.08;
    transform: translate3d(-3px, 2px, 0) scale(0.75);
  }
  52% {
    opacity: 0.48;
    transform: translate3d(5px, -5px, 0) scale(1.15);
  }
  100% {
    opacity: 0.16;
    transform: translate3d(10px, 1px, 0) scale(0.9);
  }
}

@keyframes mark-resolve {
  from {
    opacity: 0;
    transform: scale(0.94);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes field-breathe {
  from {
    opacity: 0.42;
    transform: scale(0.96);
  }
  to {
    opacity: 0.64;
    transform: scale(1.08);
  }
}

@keyframes orbit-energy-reverse {
  0% {
    transform: rotate(18deg) scaleX(1.02);
  }
  44% {
    transform: rotate(-139deg) scaleX(0.98);
  }
  100% {
    transform: rotate(-342deg) scaleX(1.02);
  }
}

@keyframes orbit-illumination {
  from {
    opacity: 0.42;
    filter: drop-shadow(0 0 5px rgba(62, 168, 201, 0.14));
  }
  to {
    opacity: 0.78;
    filter: drop-shadow(0 0 11px rgba(102, 62, 208, 0.24));
  }
}

@keyframes signal-trace {
  0%,
  16% {
    offset-distance: 8%;
    opacity: 0;
  }
  24% {
    opacity: 0.9;
  }
  58% {
    offset-distance: 60%;
    opacity: 0.72;
  }
  68%,
  100% {
    offset-distance: 68%;
    opacity: 0;
  }
}

@keyframes facet-light {
  from {
    transform: translate3d(-4%, 3%, 0);
    opacity: 0.28;
  }
  to {
    transform: translate3d(5%, -3%, 0);
    opacity: 0.5;
  }
}

.section {
  position: relative;
  padding-block: 6rem;
  border-top: 1px solid var(--line);
}

.section::after {
  position: absolute;
  z-index: -1;
  inset: 4% -10%;
  background: linear-gradient(
    100deg,
    transparent 6%,
    rgba(62, 168, 201, 0.035) 24%,
    rgba(68, 107, 193, 0.025) 48%,
    transparent 74%
  );
  content: "";
  pointer-events: none;
}

.section:nth-of-type(even)::after {
  background: linear-gradient(
    260deg,
    transparent 8%,
    rgba(102, 62, 208, 0.04) 28%,
    rgba(68, 107, 193, 0.024) 52%,
    transparent 76%
  );
}

.section::before {
  position: absolute;
  top: -1px;
  left: 50%;
  width: min(16rem, 42vw);
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(
    90deg,
    transparent,
    rgba(62, 168, 201, 0.7),
    transparent
  );
  content: "";
  opacity: 0.65;
}

.section-intro {
  display: grid;
  align-items: center;
  gap: 2rem;
  margin-bottom: 3rem;
  grid-template-columns: 1fr 1fr;
}

.section-intro p {
  max-width: 58ch;
  margin: 0;
  color: var(--muted);
}

.card-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, 1fr);
}

.card {
  --pointer-x: 50%;
  --pointer-y: 50%;
  position: relative;
  overflow: hidden;
  min-height: 15rem;
  padding: 1.6rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(145deg, var(--panel-strong), var(--panel));
  box-shadow: var(--shadow);
  transition:
    transform 240ms ease,
    border-color 240ms ease,
    box-shadow 240ms ease;
}

.card:nth-child(1) {
  border-color: rgba(62, 168, 201, 0.2);
  background: linear-gradient(145deg, rgba(62, 168, 201, 0.09), var(--panel));
}

.card:nth-child(2) {
  border-color: rgba(68, 107, 193, 0.21);
  background: linear-gradient(145deg, rgba(68, 107, 193, 0.09), var(--panel));
}

.card:nth-child(3) {
  border-color: rgba(102, 62, 208, 0.22);
  background: linear-gradient(145deg, rgba(102, 62, 208, 0.09), var(--panel));
}

[data-pointer-glow]::after {
  position: absolute;
  z-index: 0;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(
    20rem circle at var(--pointer-x) var(--pointer-y),
    rgba(62, 168, 201, 0.14),
    rgba(68, 107, 193, 0.07) 34%,
    rgba(102, 62, 208, 0.035) 53%,
    transparent 70%
  );
  content: "";
  opacity: 0;
  pointer-events: none;
  transition: opacity 260ms ease;
}

.cursor-light {
  --cursor-x: 50vw;
  --cursor-y: 50vh;
  --cursor-core: rgba(189, 239, 249, 0.2);
  --cursor-mid: rgba(62, 168, 201, 0.12);
  --cursor-edge: rgba(102, 62, 208, 0.045);
  position: fixed;
  z-index: 0;
  top: 0;
  left: 0;
  width: 30rem;
  height: 30rem;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    var(--cursor-core) 0%,
    var(--cursor-mid) 24%,
    var(--cursor-edge) 48%,
    transparent 72%
  );
  filter: blur(14px);
  opacity: 0;
  pointer-events: none;
  transform: translate3d(
    calc(var(--cursor-x) - 50%),
    calc(var(--cursor-y) - 50%),
    0
  );
  transition: opacity 240ms ease;
  will-change: transform, opacity;
}

body[data-cursor-active="true"] .cursor-light {
  opacity: 0.62;
}

.cursor-light[data-tone="cyan"] {
  --cursor-core: rgba(197, 168, 255, 0.24);
  --cursor-mid: rgba(132, 82, 224, 0.15);
  --cursor-edge: rgba(75, 47, 159, 0.055);
}

.cursor-light[data-tone="blue"] {
  --cursor-core: rgba(208, 179, 255, 0.22);
  --cursor-mid: rgba(132, 82, 224, 0.14);
  --cursor-edge: rgba(46, 215, 226, 0.05);
}

.cursor-light[data-tone="violet"] {
  --cursor-core: rgba(189, 248, 249, 0.23);
  --cursor-mid: rgba(46, 215, 226, 0.14);
  --cursor-edge: rgba(62, 168, 201, 0.055);
}

.cursor-light[data-tone="light"] {
  --cursor-core: rgba(42, 34, 118, 0.2);
  --cursor-mid: rgba(70, 52, 154, 0.12);
  --cursor-edge: rgba(68, 107, 193, 0.035);
  mix-blend-mode: multiply;
}

.card:nth-child(1)[data-pointer-glow]::after,
.contact-detail[data-pointer-glow]::after {
  background: radial-gradient(
    20rem circle at var(--pointer-x) var(--pointer-y),
    rgba(143, 101, 224, 0.15),
    rgba(102, 62, 208, 0.06) 38%,
    transparent 70%
  );
}

.card:nth-child(3)[data-pointer-glow]::after,
.frostie-panel[data-pointer-glow]::after {
  background: radial-gradient(
    20rem circle at var(--pointer-x) var(--pointer-y),
    rgba(86, 213, 232, 0.15),
    rgba(62, 168, 201, 0.06) 38%,
    transparent 70%
  );
}

.contact-panel[data-pointer-glow]::after {
  background: radial-gradient(
    20rem circle at var(--pointer-x) var(--pointer-y),
    rgba(51, 38, 135, 0.15),
    rgba(68, 107, 193, 0.07) 42%,
    transparent 72%
  );
  mix-blend-mode: multiply;
}

[data-pointer-glow][data-pointer-active="true"]::after {
  opacity: 1;
}

[data-pointer-glow] > * {
  position: relative;
  z-index: 1;
}

.card:hover {
  transform: translateY(-3px);
  border-color: rgba(62, 168, 201, 0.32);
  box-shadow: 0 30px 85px rgba(4, 7, 30, 0.46);
}

.card-link {
  color: inherit;
  text-decoration: none;
}

.card-link:hover {
  text-decoration: none;
}

.card-action {
  display: inline-block;
  margin-top: 1.25rem;
  color: #bdeff9;
  font-size: 0.88rem;
  font-weight: 800;
}

.card-index {
  display: block;
  margin-bottom: 3.5rem;
  color: #9fe8f5;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.16em;
}

.card p,
.muted {
  color: var(--muted);
}

.frostie-panel {
  --pointer-x: 50%;
  --pointer-y: 50%;
  position: relative;
  display: grid;
  overflow: hidden;
  align-items: center;
  gap: 3rem;
  padding: clamp(2rem, 5vw, 4.5rem);
  border: 1px solid rgba(62, 168, 201, 0.25);
  border-radius: calc(var(--radius) * 1.4);
  background:
    radial-gradient(
      circle at 4% 14%,
      rgba(62, 168, 201, 0.24),
      transparent 36%
    ),
    radial-gradient(
      circle at 94% 86%,
      rgba(102, 62, 208, 0.24),
      transparent 38%
    ),
    linear-gradient(
      125deg,
      rgba(34, 84, 137, 0.22),
      rgba(19, 21, 52, 0.9) 48%,
      rgba(73, 39, 135, 0.24)
    ),
    rgba(9, 13, 43, 0.82);
  box-shadow:
    0 32px 100px rgba(4, 7, 30, 0.38),
    inset 0 1px rgba(189, 239, 249, 0.06);
  grid-template-columns: 1.15fr 0.85fr;
}

.frostie-panel::before {
  position: absolute;
  inset: -20%;
  background:
    url("/assets/frostie-os-logo.png") 92% 50% / min(24rem, 40%) auto no-repeat,
    radial-gradient(circle at 8% 8%, rgba(46, 215, 226, 0.22), transparent 34%),
    radial-gradient(
      circle at 92% 88%,
      rgba(132, 82, 224, 0.24),
      transparent 38%
    );
  content: "";
  filter: saturate(1.12);
  opacity: 0.13;
  pointer-events: none;
}

.status-pill {
  display: inline-flex;
  width: fit-content;
  padding: 0.35rem 0.65rem;
  border: 1px solid rgba(189, 239, 249, 0.25);
  border-radius: 999px;
  background: rgba(62, 168, 201, 0.08);
  color: #bdeff9;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.signal-list {
  display: grid;
  gap: 0.8rem;
  padding: 0;
  margin: 0;
  list-style: none;
}

.signal-list li {
  padding: 1rem 1.1rem;
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: rgba(245, 247, 247, 0.045);
  color: #d6dced;
}

.contact-panel {
  position: relative;
  display: grid;
  align-items: center;
  overflow: hidden;
  gap: 2rem;
  padding: clamp(2rem, 5vw, 4rem);
  border-radius: calc(var(--radius) * 1.3);
  background: var(--ice);
  color: var(--ink);
  grid-template-columns: 1.2fr auto;
}

.focal-panel::before {
  position: absolute;
  inset: -70% 35% -70% -15%;
  background: radial-gradient(
    circle,
    rgba(62, 168, 201, 0.16),
    transparent 60%
  );
  content: "";
  opacity: 0.66;
  pointer-events: none;
}

.focal-panel > * {
  position: relative;
  z-index: 1;
}

.contact-panel p {
  max-width: 55ch;
  margin-bottom: 0;
  color: #454a67;
}

.frostie-contact-panel {
  border: 1px solid rgba(189, 239, 249, 0.12);
  background:
    radial-gradient(
      circle at 92% 20%,
      rgba(62, 168, 201, 0.08),
      transparent 34%
    ),
    linear-gradient(125deg, rgba(12, 18, 49, 0.96), rgba(18, 20, 52, 0.96));
  color: var(--ice);
  box-shadow: 0 24px 70px rgba(4, 7, 30, 0.24);
  grid-template-columns: minmax(0, 1.2fr) minmax(16rem, 0.8fr);
}

.frostie-contact-panel p {
  color: var(--muted);
}

.final-cta__action {
  display: grid;
  justify-items: start;
  gap: 1rem;
  max-width: 19rem;
}

.final-cta__action p {
  margin: 0;
  font-size: 0.92rem;
}

.final-cta__action strong {
  display: block;
  color: var(--ice);
}

.frostie-contact-panel .final-cta__action {
  width: 100%;
  justify-items: center;
  justify-self: center;
  text-align: center;
}

.page-hero {
  display: grid;
  min-height: 34rem;
  align-items: center;
  gap: 4rem;
  padding-block: 5.5rem;
  grid-template-columns: minmax(0, 1.15fr) minmax(14rem, 0.55fr);
}

.page-hero > * {
  min-width: 0;
}

.contact-page .page-hero {
  position: relative;
  display: grid;
  min-height: clamp(28rem, 44vw, 38rem);
  overflow: hidden;
  grid-template-columns: minmax(0, 1fr);
}

.contact-page .page-hero > :first-child {
  position: relative;
  z-index: 1;
  width: min(100%, 64rem);
  margin-inline: auto;
}

.contact-page .page-hero h1 {
  max-width: 19ch;
}

.contact-convergence {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  min-height: 0;
  overflow: hidden;
  pointer-events: none;
}

.contact-convergence span {
  position: absolute;
  width: var(--signal-size, 0.32rem);
  height: var(--signal-size, 0.32rem);
  border-radius: 50%;
  background: var(--signal-colour, #78e8f2);
  box-shadow: 0 0 1rem currentcolor;
  color: var(--signal-colour, #78e8f2);
  opacity: var(--signal-opacity, 0.42);
  transform: translate3d(0, 0, 0);
  transition:
    transform 900ms cubic-bezier(0.2, 0.75, 0.25, 1),
    opacity 600ms ease;
}

.page-hero h1 {
  font-size: clamp(2.8rem, 6.5vw, 5.8rem);
}

.soft-signal {
  position: relative;
  width: min(100%, 20rem);
  aspect-ratio: 1;
  justify-self: end;
  border-block: 1px solid rgba(245, 247, 247, 0.08);
  background: linear-gradient(
    135deg,
    rgba(62, 168, 201, 0.035),
    transparent 45%,
    rgba(102, 62, 208, 0.04)
  );
  opacity: 0.72;
}

.soft-signal::before {
  position: absolute;
  inset: 14% 49%;
  background: linear-gradient(
    180deg,
    transparent,
    rgba(62, 168, 201, 0.5),
    rgba(102, 62, 208, 0.18),
    transparent
  );
  content: "";
  filter: blur(7px);
  transform: rotate(8deg);
}

.soft-signal span {
  position: absolute;
  inset: 47% 12%;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(62, 168, 201, 0.32),
    rgba(102, 62, 208, 0.25),
    transparent
  );
  filter: blur(1px);
}

.about-hero {
  grid-template-columns: minmax(0, 1.25fr) minmax(20rem, 0.75fr);
}

.about-manifesto {
  position: relative;
  max-width: 27rem;
  padding: clamp(1.8rem, 4vw, 3rem);
  border-left: 2px solid var(--azure);
  background: linear-gradient(
    110deg,
    rgba(62, 168, 201, 0.1),
    rgba(102, 62, 208, 0.035)
  );
  box-shadow: 0 24px 70px rgba(4, 7, 30, 0.22);
  justify-self: end;
}

.about-manifesto::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -2px;
  width: 2px;
  background: linear-gradient(transparent, #bdeff9, var(--purple), transparent);
  content: "";
  filter: blur(2px);
}

.about-manifesto span {
  color: #bdeff9;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.about-manifesto p {
  margin: 1.25rem 0 0;
  color: var(--ice);
  font-size: clamp(1.2rem, 2.3vw, 1.65rem);
  font-weight: 700;
  line-height: 1.45;
}

.content-grid {
  display: grid;
  align-items: center;
  gap: 4rem;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
}

.prose {
  max-width: 46rem;
  color: #d6dced;
  font-size: 1.08rem;
}

.prose > :first-child {
  margin-top: 0;
}

.feature-quote {
  color: var(--ice);
  font-size: clamp(1.45rem, 3vw, 2.25rem);
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -0.025em;
}

.text-link {
  display: inline-block;
  margin-top: 1rem;
  color: #bdeff9;
  font-weight: 800;
}

.system-flow {
  display: grid;
  padding: 0;
  margin: 2rem 0 0;
  list-style: none;
  grid-template-columns: repeat(7, 1fr);
}

.system-flow li {
  position: relative;
  padding: 1.2rem 0.7rem;
  border-block: 1px solid var(--line);
  color: #d6dced;
  font-size: 0.85rem;
  font-weight: 800;
  text-align: center;
}

.frostie-page .system-map__node {
  animation: system-node-flow 14s ease-in-out infinite;
}

.frostie-page .system-map__node:nth-child(2) {
  animation-delay: -12s;
}
.frostie-page .system-map__node:nth-child(3) {
  animation-delay: -10s;
}
.frostie-page .system-map__node:nth-child(4) {
  animation-delay: -8s;
}
.frostie-page .system-map__node:nth-child(5) {
  animation-delay: -6s;
}
.frostie-page .system-map__node:nth-child(6) {
  animation-delay: -4s;
}
.frostie-page .system-map__node:nth-child(7) {
  animation-delay: -2s;
}

@keyframes system-node-flow {
  0%,
  72%,
  100% {
    border-color: var(--line);
    box-shadow: none;
  }
  82% {
    border-color: rgba(120, 232, 242, 0.38);
    box-shadow: inset 0 -12px 28px rgba(62, 168, 201, 0.07);
  }
  90% {
    border-color: rgba(132, 82, 224, 0.3);
    box-shadow: inset 0 -12px 30px rgba(102, 62, 208, 0.06);
  }
}

.system-flow li + li::before {
  position: absolute;
  top: 50%;
  left: 0;
  color: var(--azure);
  content: "→";
  transform: translate(-50%, -50%);
}

.faq-layout {
  display: grid;
  width: min(100%, 68rem);
  gap: clamp(1.5rem, 3vw, 2.4rem);
  margin-inline: auto;
}

.faq-toolbar {
  display: grid;
  align-items: end;
  gap: 1.5rem;
  grid-template-columns: minmax(15rem, 0.72fr) minmax(0, 1.28fr);
}

.faq-toolbar h2 {
  max-width: 13ch;
  margin-bottom: 0;
  font-size: clamp(1.85rem, 3vw, 2.8rem);
}

.faq-categories {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.55rem;
}

.faq-categories a {
  display: inline-flex;
  min-height: 2.45rem;
  align-items: center;
  padding: 0.55rem 0.85rem;
  border: 1px solid rgba(189, 239, 249, 0.14);
  border-radius: 999px;
  background: rgba(12, 16, 48, 0.42);
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 750;
  text-decoration: none;
  transition:
    color 180ms ease,
    border-color 180ms ease,
    background 180ms ease;
}

.faq-categories a:hover,
.faq-categories a:focus-visible {
  border-color: rgba(120, 232, 242, 0.42);
  background: rgba(62, 168, 201, 0.1);
  color: var(--ice);
}

.faq-categories a:focus-visible {
  outline: 3px solid var(--azure);
  outline-offset: 3px;
}

.faq-list {
  position: relative;
  transition: box-shadow 420ms ease;
}

.faq-group {
  scroll-margin-top: 7rem;
}

.faq-group + .faq-group {
  margin-top: 2.35rem;
}

.faq-group h3 {
  margin: 0 0 0.45rem;
  color: #bdeff9;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.faq-group details:first-of-type {
  border-top: 1px solid var(--line);
}

.faq-list:has(.faq-group--frostie details[open]),
.faq-list:has(.faq-group--governance details[open]) {
  box-shadow: 28px 0 70px -64px rgba(132, 82, 224, 0.7);
}

.faq-list details {
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
}

.faq-list details::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    #78e8f2,
    #8452e0,
    transparent
  );
  content: "";
  opacity: 0;
  pointer-events: none;
  transform: translateX(-70%) scaleX(0.3);
}

.faq-list details[open]::after {
  animation: faq-answer-light 620ms ease-out both;
}

.faq-list details[open] p {
  animation: faq-answer-reveal 260ms ease-out both;
}

@keyframes faq-answer-light {
  0% {
    opacity: 0;
    transform: translateX(-70%) scaleX(0.3);
  }
  55% {
    opacity: 0.62;
  }
  100% {
    opacity: 0.14;
    transform: translateX(0) scaleX(1);
  }
}

@keyframes faq-answer-reveal {
  from {
    opacity: 0;
    transform: translateY(-0.35rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.faq-list summary {
  display: grid;
  min-height: 4.5rem;
  align-items: center;
  gap: 1.5rem;
  padding-block: 1rem;
  color: var(--ice);
  font-size: clamp(1rem, 1.7vw, 1.2rem);
  font-weight: 750;
  cursor: pointer;
  list-style: none;
  grid-template-columns: minmax(0, 1fr) auto;
}

.faq-list summary::-webkit-details-marker {
  display: none;
}

.faq-list summary::after {
  display: grid;
  width: 2rem;
  height: 2rem;
  border: 1px solid rgba(62, 168, 201, 0.25);
  border-radius: 50%;
  background: rgba(62, 168, 201, 0.06);
  color: #bdeff9;
  content: "+";
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 1;
  place-items: center;
  transition:
    transform 180ms ease,
    border-color 180ms ease;
}

.faq-list details[open] summary::after {
  transform: rotate(45deg);
  border-color: rgba(102, 62, 208, 0.42);
}

.faq-list summary:hover {
  color: #bdeff9;
}

.faq-list summary:focus-visible {
  border-radius: 0.35rem;
  outline: 3px solid var(--azure);
  outline-offset: 3px;
}

.faq-list details p {
  max-width: 63ch;
  padding: 0 3.5rem 1.5rem 0;
  margin: 0;
  color: var(--muted);
}

.faq-direct {
  margin: -0.35rem 0 0;
  color: var(--muted);
  font-size: 0.9rem;
  text-align: right;
}

.contact-detail {
  position: relative;
  display: grid;
  overflow: hidden;
  gap: 3rem;
  padding: clamp(2rem, 5vw, 4rem);
  border: 1px solid rgba(62, 168, 201, 0.25);
  border-radius: calc(var(--radius) * 1.4);
  background: linear-gradient(
    135deg,
    rgba(62, 168, 201, 0.1),
    rgba(102, 62, 208, 0.1)
  );
  grid-template-columns: minmax(0, 1.1fr) minmax(18rem, 0.9fr);
}

.contact-detail > * {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.contact-aside {
  padding: 1.5rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(9, 13, 43, 0.46);
}

.contact-microcopy {
  margin: 0.8rem 0 0;
  color: var(--muted);
  font-size: 0.9rem;
}

.contact-preparation {
  display: grid;
  gap: 0;
  padding: 0;
  margin: 1.25rem 0 0;
  list-style: none;
}

.contact-preparation li {
  display: grid;
  gap: 1rem;
  padding: 1rem 0;
  border-top: 1px solid rgba(189, 239, 249, 0.1);
  grid-template-columns: 2rem minmax(0, 1fr);
}

.contact-preparation span {
  color: #78e8f2;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.14em;
}

.contact-preparation strong {
  color: var(--ice);
}

.contact-preparation p {
  margin: 0.3rem 0 0;
  color: var(--muted);
  font-size: 0.9rem;
}

.contact-aside .muted {
  margin: 1.25rem 0 0;
  font-size: 0.9rem;
}

.next-step-section {
  overflow: hidden;
}

.next-step-intro {
  display: grid;
  max-width: 48rem;
  gap: 0.75rem;
  margin-bottom: clamp(3rem, 6vw, 5rem);
}

.next-step-intro h2,
.next-step-intro p {
  margin: 0;
}

.next-step-intro p:last-child {
  max-width: 43rem;
  color: var(--muted);
  font-size: 1.08rem;
  line-height: 1.75;
}

.contact-steps {
  display: grid;
  padding: 0;
  margin: 0;
  list-style: none;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.contact-steps li {
  position: relative;
  min-width: 0;
  padding: 0 2.25rem 0 0;
}

.contact-steps li + li {
  padding-left: 2.25rem;
}

.contact-steps li + li::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 1px;
  background: linear-gradient(
    to bottom,
    transparent,
    rgba(92, 181, 226, 0.3) 20%,
    rgba(101, 69, 224, 0.26) 80%,
    transparent
  );
  content: "";
}

.contact-step-number {
  display: inline-block;
  margin-bottom: 2.25rem;
  color: var(--cyan);
  font-size: 0.83rem;
  font-weight: 900;
  letter-spacing: 0.18em;
  text-shadow: 0 0 1.25rem rgba(41, 222, 232, 0.35);
}

.contact-steps li:nth-child(2) .contact-step-number {
  color: var(--azure);
  text-shadow: 0 0 1.25rem rgba(62, 168, 201, 0.36);
}

.contact-steps li:nth-child(3) .contact-step-number {
  color: #aa8bff;
  text-shadow: 0 0 1.25rem rgba(102, 62, 208, 0.42);
}

.contact-steps h3 {
  margin: 0 0 0.9rem;
  font-size: clamp(1.25rem, 2.2vw, 1.65rem);
}

.contact-steps p {
  margin: 0;
  color: var(--muted);
  line-height: 1.75;
}

.legal-hero {
  padding-block: 5rem 3rem;
}

.legal-hero h1 {
  max-width: 14ch;
  font-size: clamp(2.7rem, 6vw, 5rem);
}

.legal-layout {
  display: grid;
  align-items: start;
  gap: 4rem;
  padding-bottom: 7rem;
  grid-template-columns: minmax(12rem, 0.3fr) minmax(0, 0.7fr);
}

.legal-nav {
  position: sticky;
  top: 2rem;
  display: grid;
  gap: 0.55rem;
  padding: 1.2rem;
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: var(--panel);
}

.legal-nav a {
  color: var(--muted);
  font-size: 0.9rem;
}

.legal-content {
  max-width: 48rem;
}

.legal-content section {
  padding-top: 1rem;
  margin-bottom: 3.5rem;
}

.legal-content h2 {
  font-size: clamp(1.7rem, 3vw, 2.35rem);
}

.legal-content h3 {
  margin-top: 2rem;
}

.legal-content p,
.legal-content li {
  color: #d6dced;
}

.legal-content li + li {
  margin-top: 0.55rem;
}

.notice {
  padding: 1rem 1.1rem;
  border-left: 3px solid var(--azure);
  background: rgba(62, 168, 201, 0.09);
  color: #dff8fc;
}

:root {
  --motion-ambient: 28s;
  --motion-system: 9s;
  --motion-interaction: 260ms;
}

.page-atmosphere {
  position: fixed;
  z-index: 0;
  inset: 5.25rem 0 0;
  overflow: hidden;
  pointer-events: none;
}

.page-atmosphere span {
  position: absolute;
  display: block;
  pointer-events: none;
  will-change: opacity, transform;
}

/* Home: sparse signals briefly resolve into connections. */
.page-atmosphere--home span {
  width: clamp(8rem, 18vw, 22rem);
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(120, 232, 242, 0.2),
    rgba(132, 82, 224, 0.12),
    transparent
  );
  opacity: 0;
  transform-origin: left center;
  animation: connection-resolve var(--motion-ambient) ease-in-out infinite;
}

.page-atmosphere--home span::before,
.page-atmosphere--home span::after,
.page-atmosphere--about span::before,
.page-atmosphere--about span::after,
.page-atmosphere--contact span::before,
.page-atmosphere--contact span::after {
  position: absolute;
  top: 50%;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #9fe8f5;
  box-shadow: 0 0 13px rgba(62, 168, 201, 0.42);
  content: "";
  transform: translateY(-50%);
}

.page-atmosphere--home span::before,
.page-atmosphere--about span::before,
.page-atmosphere--contact span::before {
  left: 0;
}

.page-atmosphere--home span::after,
.page-atmosphere--about span::after,
.page-atmosphere--contact span::after {
  right: 0;
  background: #9b86ed;
  box-shadow: 0 0 13px rgba(132, 82, 224, 0.38);
}

.page-atmosphere--home span:nth-child(1) {
  top: 17%;
  left: 4%;
  rotate: 11deg;
  animation-delay: -4s;
}
.page-atmosphere--home span:nth-child(2) {
  top: 29%;
  left: 43%;
  rotate: -8deg;
  animation-delay: -17s;
}
.page-atmosphere--home span:nth-child(3) {
  top: 46%;
  right: 3%;
  rotate: 17deg;
  animation-delay: -9s;
}
.page-atmosphere--home span:nth-child(4) {
  top: 63%;
  left: 12%;
  rotate: -14deg;
  animation-delay: -23s;
}
.page-atmosphere--home span:nth-child(5) {
  top: 77%;
  right: 16%;
  rotate: 7deg;
  animation-delay: -13s;
}
.page-atmosphere--home span:nth-child(6) {
  top: 90%;
  left: 38%;
  rotate: -4deg;
  animation-delay: -26s;
}

@keyframes connection-resolve {
  0%,
  62%,
  100% {
    opacity: 0;
    scale: 0.25 1;
  }
  70% {
    opacity: 0.12;
    scale: 0.7 1;
  }
  77% {
    opacity: 0.26;
    scale: 1 1;
  }
  86% {
    opacity: 0.06;
    scale: 1 1;
  }
}

/* About: connections assemble gently and remain more human than technical. */
.page-atmosphere--about span {
  width: clamp(7rem, 14vw, 15rem);
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(120, 232, 242, 0.16),
    rgba(132, 82, 224, 0.12),
    transparent
  );
  opacity: 0;
  animation: constellation-form 24s ease-in-out infinite;
}

.page-atmosphere--about span:nth-child(1) {
  top: 15%;
  left: 8%;
  rotate: 18deg;
  animation-delay: -3s;
}
.page-atmosphere--about span:nth-child(2) {
  top: 31%;
  right: 9%;
  rotate: -22deg;
  animation-delay: -11s;
}
.page-atmosphere--about span:nth-child(3) {
  top: 47%;
  left: 32%;
  rotate: 6deg;
  animation-delay: -18s;
}
.page-atmosphere--about span:nth-child(4) {
  top: 62%;
  right: 27%;
  rotate: 15deg;
  animation-delay: -7s;
}
.page-atmosphere--about span:nth-child(5) {
  top: 78%;
  left: 10%;
  rotate: -12deg;
  animation-delay: -15s;
}
.page-atmosphere--about span:nth-child(6) {
  top: 91%;
  right: 7%;
  rotate: 8deg;
  animation-delay: -21s;
}

@keyframes constellation-form {
  0%,
  50%,
  100% {
    opacity: 0.03;
    transform: scaleX(0.35);
  }
  63%,
  78% {
    opacity: 0.2;
    transform: scaleX(1);
  }
  88% {
    opacity: 0.08;
    transform: scaleX(0.82);
  }
}

/* Approach: quiet pathway traces support the primary cycle. */
.page-atmosphere--approach span {
  width: clamp(16rem, 34vw, 38rem);
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(120, 232, 242, 0.13),
    rgba(132, 82, 224, 0.12),
    transparent
  );
  opacity: 0.08;
  animation: pathway-flow 12s ease-in-out infinite;
}

.page-atmosphere--approach span:nth-child(1) {
  top: 28%;
  left: -4%;
  rotate: 4deg;
}
.page-atmosphere--approach span:nth-child(2) {
  top: 56%;
  right: -6%;
  rotate: -6deg;
  animation-delay: -5s;
}
.page-atmosphere--approach span:nth-child(3) {
  top: 82%;
  left: 23%;
  rotate: 2deg;
  animation-delay: -9s;
}

@keyframes pathway-flow {
  0%,
  100% {
    opacity: 0.03;
    transform: translateX(-2%) scaleX(0.72);
  }
  48% {
    opacity: 0.17;
    transform: translateX(3%) scaleX(1);
  }
}

/* Frostie OS: broad, translucent auroral curtains with independent deformation. */
.page-atmosphere--frostie {
  position: absolute;
  inset: 5.25rem 0 0;
  min-height: 100%;
  overflow: hidden;
  isolation: isolate;
}

.page-atmosphere--frostie span {
  width: 118vw;
  height: 40rem;
  border-radius: 48% 52% 44% 56% / 58% 42% 61% 39%;
  background:
    linear-gradient(
      101deg,
      transparent 5%,
      rgba(46, 215, 226, 0.2) 18%,
      transparent 32%,
      rgba(52, 142, 220, 0.18) 45%,
      transparent 59%,
      rgba(132, 82, 224, 0.18) 75%,
      transparent 91%
    ),
    radial-gradient(
      ellipse at 23% 48%,
      rgba(46, 215, 226, 0.34),
      rgba(46, 215, 226, 0.12) 31%,
      transparent 62%
    ),
    radial-gradient(
      ellipse at 53% 43%,
      rgba(52, 142, 220, 0.3),
      rgba(68, 107, 193, 0.12) 34%,
      transparent 65%
    ),
    radial-gradient(
      ellipse at 78% 55%,
      rgba(132, 82, 224, 0.3),
      rgba(98, 70, 206, 0.1) 33%,
      transparent 64%
    );
  filter: blur(34px);
  mix-blend-mode: screen;
  opacity: 0.88;
  mask-image:
    linear-gradient(90deg, transparent, #000 11%, #000 89%, transparent),
    linear-gradient(180deg, transparent, #000 18%, #000 72%, transparent);
  mask-composite: intersect;
  animation: aurora-fold 27s cubic-bezier(0.45, 0, 0.3, 1) infinite alternate;
}

.page-atmosphere--frostie span:nth-child(1) {
  top: -7rem;
  right: -24vw;
  rotate: -7deg;
  transform-origin: 70% 38%;
}

.page-atmosphere--frostie span:nth-child(2) {
  top: 24rem;
  left: -31vw;
  rotate: 11deg;
  opacity: 0.58;
  transform-origin: 26% 52%;
  animation-duration: 34s;
  animation-delay: -18s;
}

.page-atmosphere--frostie span:nth-child(3) {
  top: 70rem;
  right: -30vw;
  rotate: -7deg;
  opacity: 0.5;
  transform-origin: 64% 46%;
  animation-duration: 39s;
  animation-delay: -9s;
}

@keyframes aurora-fold {
  0% {
    opacity: 0.46;
    transform: translate3d(-4%, -3%, 0) skewX(-8deg) scale(0.94, 0.82);
  }
  31% {
    opacity: 0.82;
    transform: translate3d(2%, 4%, 0) skewX(6deg) scale(1.08, 1.1);
  }
  67% {
    opacity: 0.58;
    transform: translate3d(-1%, 8%, 0) skewX(-3deg) scale(1.02, 1.24);
  }
  100% {
    opacity: 0.86;
    transform: translate3d(6%, 1%, 0) skewX(9deg) scale(1.15, 0.94);
  }
}

.frostie-page .lensing-logo::before,
.frostie-page .lensing-logo::after {
  display: none;
}

.frostie-page .energy-badge__disc {
  overflow: visible;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  animation: frostie-reflection 13s ease-in-out infinite alternate;
}

.frostie-page .page-hero {
  grid-template-columns: minmax(0, 1.05fr) minmax(24rem, 0.65fr);
}

.frostie-page .brand-emblem {
  width: min(100%, 27.5rem);
}

.frostie-page .page-hero .energy-badge__disc::before {
  display: none;
}

.frostie-page .page-hero .energy-badge__disc img {
  border-radius: 0;
  object-fit: contain;
  mix-blend-mode: normal;
  mask-image: none;
  -webkit-mask-image: none;
  filter: drop-shadow(-0.35rem 0 1rem rgba(46, 215, 226, 0.16))
    drop-shadow(0.35rem 0 1rem rgba(132, 82, 224, 0.14));
}

@keyframes frostie-reflection {
  0%,
  100% {
    filter: drop-shadow(0 0 16px rgba(46, 215, 226, 0.16));
  }
  46% {
    filter: drop-shadow(0 0 24px rgba(46, 215, 226, 0.28));
  }
  72% {
    filter: drop-shadow(0 0 24px rgba(132, 82, 224, 0.24));
  }
}

.frostie-page .section:first-of-type::after,
.frostie-page .section:last-of-type::after {
  opacity: 0.86;
}

/* Contact: trajectories converge towards the conversation area. */
.page-atmosphere--contact span {
  right: clamp(5%, 18vw, 28%);
  width: clamp(10rem, 26vw, 30rem);
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(62, 168, 201, 0.16),
    rgba(132, 82, 224, 0.24)
  );
  opacity: 0.12;
  transform-origin: right center;
  animation: contact-converge 18s ease-in-out infinite;
}

.page-atmosphere--contact span:nth-child(1) {
  top: 14%;
  rotate: 19deg;
  animation-delay: -2s;
}
.page-atmosphere--contact span:nth-child(2) {
  top: 28%;
  rotate: 10deg;
  animation-delay: -9s;
}
.page-atmosphere--contact span:nth-child(3) {
  top: 44%;
  rotate: 3deg;
  animation-delay: -14s;
}
.page-atmosphere--contact span:nth-child(4) {
  top: 61%;
  rotate: -7deg;
  animation-delay: -5s;
}
.page-atmosphere--contact span:nth-child(5) {
  top: 76%;
  rotate: -14deg;
  animation-delay: -12s;
}
.page-atmosphere--contact span:nth-child(6) {
  top: 89%;
  rotate: -20deg;
  animation-delay: -17s;
}

@keyframes contact-converge {
  0%,
  100% {
    opacity: 0.03;
    transform: scaleX(0.45);
  }
  48%,
  68% {
    opacity: 0.18;
    transform: scaleX(1);
  }
  82% {
    opacity: 0.08;
    transform: scaleX(0.78);
  }
}

.legal-page .site-signal-field {
  opacity: 0.14;
}

.faq-page .site-signal-field {
  opacity: 0.22;
}

.site-signal-field {
  position: fixed;
  z-index: 0;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.site-header,
main,
.site-footer {
  position: relative;
  z-index: 1;
}

.site-signal-field span {
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #9fe8f5;
  box-shadow: 0 0 14px rgba(62, 168, 201, 0.42);
  opacity: 0;
  animation: signal-resolve 14s ease-in-out infinite;
}

.site-signal-field span:nth-child(1) {
  top: 18%;
  left: 8%;
  animation-delay: -2s;
}
.site-signal-field span:nth-child(2) {
  top: 31%;
  right: 13%;
  animation-delay: -8s;
}
.site-signal-field span:nth-child(3) {
  top: 52%;
  left: 18%;
  animation-delay: -11s;
}
.site-signal-field span:nth-child(4) {
  top: 66%;
  right: 9%;
  animation-delay: -5s;
}
.site-signal-field span:nth-child(5) {
  top: 78%;
  left: 43%;
  animation-delay: -13s;
}
.site-signal-field span:nth-child(6) {
  top: 88%;
  right: 29%;
  animation-delay: -1s;
}
.site-signal-field span:nth-child(7) {
  top: 12%;
  left: 34%;
  animation-delay: -10s;
}
.site-signal-field span:nth-child(8) {
  top: 24%;
  right: 32%;
  animation-delay: -4s;
}
.site-signal-field span:nth-child(9) {
  top: 43%;
  left: 4%;
  animation-delay: -7s;
}
.site-signal-field span:nth-child(10) {
  top: 59%;
  right: 38%;
  animation-delay: -12s;
}
.site-signal-field span:nth-child(11) {
  top: 72%;
  left: 7%;
  animation-delay: -5.5s;
}
.site-signal-field span:nth-child(12) {
  top: 82%;
  right: 4%;
  animation-delay: -9s;
}
.site-signal-field span:nth-child(13) {
  top: 94%;
  left: 22%;
  animation-delay: -3s;
}
.site-signal-field span:nth-child(14) {
  top: 38%;
  right: 3%;
  animation-delay: -14s;
}

.site-signal-field span:nth-child(3n) {
  width: 3px;
  height: 3px;
  background: #9a82ed;
  box-shadow: 0 0 12px rgba(132, 82, 224, 0.32);
  animation-duration: 18s;
}

.site-signal-field span:nth-child(4n) {
  opacity: 0.1;
  animation-duration: 22s;
}

@keyframes signal-resolve {
  0%,
  70%,
  100% {
    opacity: 0;
    transform: scale(0.6);
  }
  76% {
    opacity: 0.28;
    transform: scale(1);
  }
  83% {
    opacity: 0.12;
    transform: scale(1.4);
  }
}

html[data-motion-enhanced="true"] .section,
html[data-motion-enhanced="true"] .statement-section,
html[data-motion-enhanced="true"] .page-hero,
html[data-motion-enhanced="true"] .legal-hero {
  opacity: 1;
  transform: translate3d(0, 8px, 0);
  transition:
    opacity 620ms ease,
    transform 620ms ease;
}

html[data-motion-enhanced="true"] [data-in-view="true"] {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.section[data-in-view="true"]::before {
  animation: divider-signal 760ms ease-out both;
}

@keyframes divider-signal {
  from {
    opacity: 0;
    transform: translateX(-58%) scaleX(0.12);
  }
  to {
    opacity: 0.65;
    transform: translateX(-50%) scaleX(1);
  }
}

.hero-support {
  max-width: 58ch;
  color: var(--muted);
}

.approach-loop {
  --approach-cycle-duration: 3.75s;
  position: relative;
  display: grid;
  overflow: visible;
  width: min(100%, 37rem);
  padding: clamp(1rem, 2vw, 1.5rem);
  background:
    radial-gradient(circle, rgba(62, 168, 201, 0.08), transparent 56%),
    radial-gradient(
      circle at 62% 58%,
      rgba(102, 62, 208, 0.08),
      transparent 68%
    );
  margin: 0;
  justify-self: end;
  place-items: center;
}

.approach-loop::before {
  position: absolute;
  inset: 12%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(13, 17, 49, 0.68), transparent 72%);
  box-shadow: 0 0 70px rgba(62, 168, 201, 0.06);
  content: "";
  pointer-events: none;
}

.approach-loop__field {
  position: relative;
  width: 100%;
  aspect-ratio: 1;
}

.approach-loop svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.approach-loop__track,
.approach-loop__signal {
  fill: none;
}

.approach-loop__track {
  stroke: rgba(189, 239, 249, 0.2);
  stroke-width: 1.15;
}

.approach-loop__signal {
  stroke: #78e8f2;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-dasharray: 58 898;
  filter: drop-shadow(0 0 10px rgba(62, 168, 201, 0.72));
  animation: approach-signal var(--approach-cycle-duration) linear infinite;
  animation-play-state: paused;
}

.approach-loop[data-cycle-running="true"] .approach-loop__signal,
.approach-loop[data-cycle-running="true"] .approach-loop__node,
.approach-loop[data-cycle-running="true"] .approach-loop__centre::before {
  animation-play-state: running;
}

@keyframes approach-signal {
  0% {
    stroke-dashoffset: 0;
    stroke: #78e8f2;
    opacity: 0.9;
  }
  33.333% {
    stroke-dashoffset: -318.667;
    stroke: #4f9fe1;
    opacity: 0.88;
  }
  66.666% {
    stroke-dashoffset: -637.333;
    stroke: #9b72ea;
    opacity: 0.86;
  }
  100% {
    stroke-dashoffset: -956;
    stroke: #78e8f2;
    opacity: 0.9;
  }
}

.approach-loop__node {
  position: absolute;
  display: grid;
  width: 8.4rem;
  min-height: 4.8rem;
  place-content: center;
  gap: 0.12rem;
  padding: 0.7rem 0.8rem;
  border: 1px solid rgba(189, 239, 249, 0.18);
  border-radius: 999px;
  background: linear-gradient(
    135deg,
    rgba(26, 45, 88, 0.94),
    rgba(16, 20, 55, 0.96)
  );
  box-shadow:
    0 12px 34px rgba(4, 7, 30, 0.34),
    inset 0 1px rgba(189, 239, 249, 0.07);
  text-align: center;
  transform: translate(-50%, -50%);
  transition:
    border-color 180ms ease-out,
    background 180ms ease-out,
    box-shadow 180ms ease-out,
    filter 180ms ease-out;
}

.approach-loop__node small {
  color: #9fe8f5;
  font-size: 0.65rem;
  letter-spacing: 0.14em;
}

.approach-loop__node strong {
  color: var(--ice);
  font-size: 1.05rem;
}

.approach-loop__node--understand {
  top: 12%;
  left: 50%;
}
.approach-loop__node--create {
  top: 70%;
  right: auto;
  left: 84%;
}
.approach-loop__node--learn {
  top: 70%;
  bottom: auto;
  left: 16%;
}

.approach-loop__node--understand.is-current {
  border-color: rgba(226, 252, 255, 0.88);
  background: linear-gradient(
    135deg,
    rgba(93, 145, 167, 0.92),
    rgba(22, 35, 70, 0.98)
  );
  box-shadow:
    0 12px 38px rgba(4, 7, 30, 0.34),
    0 0 28px rgba(189, 239, 249, 0.3),
    inset 0 1px rgba(255, 255, 255, 0.22);
  filter: brightness(1.14);
}

.approach-loop__node--understand.is-current small {
  color: #f2fdff;
}

.approach-loop__node--create.is-current {
  border-color: rgba(61, 160, 245, 0.88);
  background: linear-gradient(
    135deg,
    rgba(29, 91, 158, 0.96),
    rgba(22, 30, 82, 0.98)
  );
  box-shadow:
    0 12px 38px rgba(4, 7, 30, 0.34),
    0 0 28px rgba(61, 160, 245, 0.3),
    inset 0 1px rgba(189, 239, 249, 0.14);
  filter: brightness(1.12);
}

.approach-loop__node--create.is-current small {
  color: #8fceff;
}

.approach-loop__node--learn.is-current {
  border-color: rgba(166, 107, 255, 0.9);
  background: linear-gradient(
    135deg,
    rgba(64, 45, 128, 0.96),
    rgba(57, 25, 102, 0.98)
  );
  box-shadow:
    0 12px 38px rgba(4, 7, 30, 0.34),
    0 0 28px rgba(166, 107, 255, 0.32),
    inset 0 1px rgba(189, 239, 249, 0.14);
  filter: brightness(1.12);
}

.approach-loop__node--learn.is-current small {
  color: #c8adff;
}

.approach-loop__centre {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  width: 17.5rem;
  gap: 0.6rem;
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.55;
  text-align: center;
  transform: translate(-50%, -50%);
}

.approach-loop__centre::before {
  position: absolute;
  inset: -2.2rem;
  z-index: -1;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(120, 232, 242, 0.11),
    transparent 66%
  );
  content: "";
  opacity: 0.28;
}

.approach-loop__centre small {
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 650;
  letter-spacing: 0.03em;
}

.approach-loop__centre strong {
  color: #dff8fc;
  font-size: 1rem;
  letter-spacing: 0.13em;
  line-height: 1.65;
}

.approach-page .page-hero {
  width: min(1400px, calc(100% - 2rem));
  gap: clamp(2.5rem, 4vw, 5rem);
  grid-template-columns: minmax(0, 1.05fr) minmax(31rem, 0.95fr);
}

.approach-page .page-hero h1 {
  max-width: 16ch;
  font-size: clamp(3.6rem, 5.9vw, 5.8rem);
}

.approach-page .card-grid[data-in-view="true"] .card:nth-child(2) {
  transition-delay: 120ms;
}
.approach-page .card-grid[data-in-view="true"] .card:nth-child(3) {
  transition-delay: 240ms;
}

.statement-section {
  position: relative;
  padding-block: clamp(4.75rem, 8vw, 7.5rem);
  border-top: 1px solid var(--line);
}

.statement-line {
  max-width: 18ch;
  margin: 0 auto;
  font-size: clamp(2.8rem, 7vw, 6.6rem);
  font-weight: 850;
  letter-spacing: -0.055em;
  line-height: 0.98;
  text-align: center;
}

.statement-copy {
  display: grid;
  justify-items: center;
  gap: 1.5rem;
  text-align: center;
}

.statement-copy > p:last-child {
  max-width: 62ch;
  margin: 0;
  color: var(--muted);
  font-size: clamp(1rem, 1.5vw, 1.2rem);
  line-height: 1.75;
}

.statement-line::after {
  display: block;
  width: min(14rem, 55%);
  height: 1px;
  margin: 1.8rem auto 0;
  background: linear-gradient(
    90deg,
    transparent,
    var(--azure),
    var(--purple),
    transparent
  );
  content: "";
}

.system-map {
  position: relative;
  min-height: 38rem;
  overflow: hidden;
  margin-top: 3rem;
  border-block: 1px solid rgba(189, 239, 249, 0.1);
  background:
    radial-gradient(
      circle at 50% 48%,
      rgba(62, 168, 201, 0.13),
      transparent 25%
    ),
    radial-gradient(circle at 62% 54%, rgba(102, 62, 208, 0.1), transparent 36%);
}

.system-map__connections {
  position: absolute;
  inset: 2.5rem 2%;
  width: 96%;
  height: calc(100% - 5rem);
  overflow: visible;
  pointer-events: none;
}

.system-map__connections path {
  fill: none;
  stroke: rgba(86, 213, 232, 0.24);
  stroke-dasharray: 5 11;
  stroke-width: 1.4;
  vector-effect: non-scaling-stroke;
  animation: system-connection-flow 11s linear infinite;
}

.system-map__connections path:nth-child(even) {
  stroke: rgba(132, 82, 224, 0.22);
  animation-duration: 14s;
  animation-direction: reverse;
}

.system-map__connections .system-map__return {
  stroke: rgba(159, 232, 245, 0.34);
  stroke-dasharray: 12 16;
}

@keyframes system-connection-flow {
  to {
    stroke-dashoffset: -96;
  }
}

.system-map__core {
  position: absolute;
  z-index: 2;
  top: 48%;
  left: 50%;
  display: grid;
  width: 12rem;
  aspect-ratio: 1;
  border: 1px solid rgba(120, 232, 242, 0.3);
  border-radius: 50%;
  background:
    radial-gradient(
      circle at 32% 25%,
      rgba(62, 168, 201, 0.18),
      transparent 44%
    ),
    radial-gradient(
      circle at 68% 74%,
      rgba(132, 82, 224, 0.2),
      transparent 48%
    ),
    rgba(8, 13, 43, 0.94);
  box-shadow: 0 0 55px rgba(62, 168, 201, 0.12);
  text-align: center;
  transform: translate(-50%, -50%);
  place-content: center;
}

.system-map__core strong {
  color: var(--ice);
  font-size: 1.35rem;
}

.system-map__core span {
  color: #9fe8f5;
  font-size: 0.68rem;
  letter-spacing: 0.08em;
}

.system-map__nodes {
  position: absolute;
  inset: 0;
  padding: 0;
  margin: 0;
  list-style: none;
}

.system-map__node {
  position: absolute;
  z-index: 2;
  display: grid;
  width: min(17%, 11rem);
  min-height: 5.8rem;
  align-content: center;
  gap: 0.14rem;
  padding: 0.9rem 1rem;
  border: 1px solid rgba(189, 239, 249, 0.16);
  border-radius: 1rem;
  background: rgba(10, 15, 47, 0.88);
  box-shadow: 0 16px 40px rgba(4, 7, 30, 0.24);
}

.system-map__node > span {
  color: #9fe8f5;
  font-size: 0.65rem;
  letter-spacing: 0.14em;
}

.system-map__node > small {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 500;
}

.system-map__node--knowledge {
  top: 7%;
  left: 2%;
}
.system-map__node--objectives {
  top: 3%;
  left: 25%;
}
.system-map__node--campaigns {
  top: 5%;
  left: 58%;
}
.system-map__node--creation {
  top: 11%;
  right: 2%;
}
.system-map__node--approval {
  bottom: 15%;
  left: 4%;
}
.system-map__node--execution {
  bottom: 18%;
  left: 41%;
}
.system-map__node--learning {
  right: 4%;
  bottom: 17%;
}

.system-map__node--approval {
  border-color: rgba(189, 239, 249, 0.38);
  box-shadow: inset 0 0 0 1px rgba(189, 239, 249, 0.06);
}

.system-map__explanation {
  position: absolute;
  bottom: 1.4rem;
  left: 50%;
  width: min(58ch, 56%);
  margin: 0;
  color: var(--muted);
  font-size: 0.82rem;
  text-align: center;
  transform: translateX(-50%);
}

.frostie-help {
  display: grid;
  align-items: center;
  gap: clamp(3rem, 7vw, 7rem);
  grid-template-columns: minmax(0, 0.72fr) minmax(34rem, 1.28fr);
}

.frostie-help__intro p:last-child {
  color: var(--muted);
}

.capability-constellation {
  position: relative;
  min-height: 38rem;
}

.capability-constellation::before,
.capability-constellation::after {
  position: absolute;
  inset: 10% 14%;
  border: 1px solid rgba(62, 168, 201, 0.14);
  border-radius: 50%;
  content: "";
  pointer-events: none;
  transform: rotate(-8deg);
}

.capability-constellation::after {
  inset: 17% 7%;
  border-color: rgba(132, 82, 224, 0.12);
  transform: rotate(13deg);
}

.capability-constellation__core {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  display: grid;
  width: 10rem;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(32, 54, 106, 0.78),
    rgba(8, 13, 43, 0.96) 66%
  );
  box-shadow: 0 0 55px rgba(62, 168, 201, 0.16);
  transform: translate(-50%, -50%);
  place-items: center;
}

.capability-constellation__core img {
  width: 82%;
  height: auto;
}

.capability-constellation ul {
  position: absolute;
  inset: 0;
  padding: 0;
  margin: 0;
  list-style: none;
}

.capability-constellation li {
  position: absolute;
  z-index: 2;
  width: 14rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid rgba(189, 239, 249, 0.16);
  color: #d9e1f2;
  font-size: 0.9rem;
  line-height: 1.45;
}

.capability-constellation li span {
  display: block;
  margin-bottom: 0.25rem;
  color: #78e8f2;
  font-size: 0.62rem;
  font-weight: 900;
  letter-spacing: 0.14em;
}

.capability-constellation li:nth-child(1) {
  top: 4%;
  left: 2%;
}
.capability-constellation li:nth-child(2) {
  top: 5%;
  right: 1%;
}
.capability-constellation li:nth-child(3) {
  top: 29%;
  left: -3%;
}
.capability-constellation li:nth-child(4) {
  top: 30%;
  right: -4%;
}
.capability-constellation li:nth-child(5) {
  bottom: 27%;
  left: -2%;
}
.capability-constellation li:nth-child(6) {
  right: -3%;
  bottom: 27%;
}
.capability-constellation li:nth-child(7) {
  bottom: 4%;
  left: 5%;
}
.capability-constellation li:nth-child(8) {
  right: 4%;
  bottom: 3%;
}

@property --system-stage-energy {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

/* Frostie connected journey: one clear signal moves through accountable stages. */
.system-journey {
  --system-cycle-duration: 9.4s;
  position: relative;
  overflow: hidden;
  margin-top: 3rem;
  padding: 2.8rem 1rem 2rem;
  border-block: 1px solid rgba(189, 239, 249, 0.11);
  background:
    linear-gradient(
      90deg,
      rgba(62, 168, 201, 0.07),
      transparent 34%,
      rgba(102, 62, 208, 0.06)
    ),
    rgba(9, 14, 44, 0.18);
}

.system-journey__track {
  position: absolute;
  z-index: 0;
  top: 4.2rem;
  right: calc(7.143% + 0.857rem);
  left: calc(7.143% + 0.857rem);
  height: 1px;
  background: linear-gradient(
    90deg,
    #55dbe9,
    #4e8cdc 48%,
    #8452e0 86%,
    #55dbe9
  );
  opacity: 0.42;
}

.system-journey__track::after {
  position: absolute;
  inset: -0.35rem 0;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(120, 232, 242, 0.15),
    transparent
  );
  content: "";
  filter: blur(0.45rem);
}

.system-journey__track span {
  position: absolute;
  top: 50%;
  left: 0;
  width: clamp(3.5rem, 6vw, 6rem);
  height: 0.2rem;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, #c5f7fc 58%, #78e8f2);
  box-shadow: 0 0 1.1rem rgba(120, 232, 242, 0.68);
  transform: translate(-100%, -50%);
  animation: system-signal-travel var(--system-cycle-duration) linear infinite;
  animation-play-state: paused;
}

.system-journey[data-journey-running="true"] .system-journey__track span {
  animation-play-state: running;
}

.system-journey__stages {
  position: relative;
  z-index: 1;
  display: grid;
  gap: clamp(0.45rem, 1.2vw, 1rem);
  padding: 0;
  margin: 0;
  list-style: none;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.system-journey__stages li {
  --system-stage-energy: 0;
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 8rem;
  align-content: start;
  gap: 0.32rem;
  padding: 2.8rem 0.55rem 1rem;
  border-top: 1px solid rgba(189, 239, 249, 0.15);
  background: linear-gradient(
    180deg,
    rgba(62, 168, 201, calc(0.025 + 0.075 * var(--system-stage-energy))),
    transparent 75%
  );
  box-shadow: inset 0 4rem 4rem -4rem
    rgba(62, 168, 201, calc(0.2 * var(--system-stage-energy)));
  transition: --system-stage-energy 180ms ease-out;
}

.system-journey__stages li::before {
  position: absolute;
  top: 1rem;
  left: 50%;
  width: 0.62rem;
  aspect-ratio: 1;
  border: 1px solid rgba(120, 232, 242, 0.6);
  border-radius: 50%;
  background: #111735;
  box-shadow:
    inset 0 0 0 0.31rem rgba(216, 251, 255, var(--system-stage-energy)),
    0 0 calc(1.1rem * var(--system-stage-energy))
      rgba(120, 232, 242, calc(0.85 * var(--system-stage-energy)));
  content: "";
  transform: translateX(-50%);
}

.system-journey__stages li.is-current {
  --system-stage-energy: 1;
}

.system-journey__stages li > span {
  color: #9fe8f5;
  font-size: 0.61rem;
  font-weight: 850;
  letter-spacing: 0.13em;
}

.system-journey__stages li > strong {
  color: var(--ice);
  font-size: clamp(0.82rem, 1.1vw, 1rem);
}

.system-journey__stages li > small {
  color: var(--muted);
  font-size: 0.69rem;
  line-height: 1.45;
}

.system-journey__stage--approval {
  border-color: rgba(189, 239, 249, 0.35) !important;
}

.system-journey__return {
  position: relative;
  width: calc(100% - 2rem);
  max-width: none;
  padding: 2.8rem 1rem 0.35rem;
  margin: 0 auto;
  text-align: center;
}

.system-journey__return::before {
  position: absolute;
  top: 0;
  right: calc(7.143% - 0.143rem);
  left: calc(7.143% - 0.143rem);
  height: 1.55rem;
  border: 1px solid rgba(120, 232, 242, 0.2);
  border-top: 0;
  border-radius: 0 0 1.1rem 1.1rem;
  content: "";
  pointer-events: none;
}

.system-journey__return::after {
  position: absolute;
  top: 1.5rem;
  left: 50%;
  width: 4.5rem;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(120, 232, 242, 0.52),
    transparent
  );
  content: "";
  transform: translateX(-50%);
  pointer-events: none;
}

.system-journey__return p {
  max-width: 48rem;
  margin: 0 auto;
  color: var(--muted);
  font-size: 0.82rem;
}

.system-journey__return strong {
  display: block;
  margin-bottom: 0.2rem;
  color: var(--ice);
}

@keyframes system-signal-travel {
  0% {
    opacity: 0;
  }
  0%,
  2% {
    left: 0;
  }
  2%,
  94% {
    opacity: 1;
  }
  94%,
  100% {
    left: 100%;
  }
  99%,
  100% {
    opacity: 0;
  }
}

/* An illustrative product surface replaces generic orbit/constellation imagery. */
.frostie-surface {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(120, 232, 242, 0.2);
  border-radius: 1.35rem;
  background:
    radial-gradient(
      circle at 85% 10%,
      rgba(102, 62, 208, 0.13),
      transparent 30%
    ),
    linear-gradient(145deg, rgba(18, 36, 76, 0.94), rgba(8, 13, 43, 0.96));
  box-shadow: 0 2rem 5rem rgba(4, 7, 30, 0.28);
}

.frostie-surface__bar {
  display: flex;
  min-height: 4.25rem;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.65rem 1rem;
  border-bottom: 1px solid rgba(189, 239, 249, 0.11);
  background: rgba(7, 12, 39, 0.56);
}

.frostie-surface__brand {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}

.frostie-surface__brand img {
  width: 2.8rem;
  height: 2.8rem;
  object-fit: contain;
  filter: drop-shadow(0 0 0.65rem rgba(62, 168, 201, 0.26));
}

.frostie-surface__brand span,
.frostie-surface__brand small {
  display: block;
}

.frostie-surface__brand strong {
  color: var(--ice);
  font-size: 0.84rem;
}

.frostie-surface__brand small {
  color: var(--muted);
  font-size: 0.62rem;
}

.frostie-surface__status,
.frostie-surface__authority {
  padding: 0.38rem 0.62rem;
  border: 1px solid rgba(120, 232, 242, 0.22);
  border-radius: 999px;
  color: #bdeff9;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.frostie-surface__body {
  display: grid;
  min-height: 30rem;
  grid-template-columns: 9.5rem minmax(0, 1fr);
}

.frostie-surface__rail {
  padding: 1rem 0;
  margin: 0;
  border-right: 1px solid rgba(189, 239, 249, 0.1);
  background: rgba(7, 12, 39, 0.32);
  list-style: none;
}

.frostie-surface__rail li {
  display: grid;
  grid-template-columns: 1.7rem minmax(0, 1fr);
  align-items: center;
  gap: 0.2rem;
  padding: 0.8rem 0.85rem;
  border-left: 2px solid transparent;
  color: var(--muted);
  font-size: 0.69rem;
}

.frostie-surface__rail li span {
  color: #78e8f2;
  font-size: 0.55rem;
}

.frostie-surface__rail li.is-active {
  border-left-color: #78e8f2;
  background: linear-gradient(90deg, rgba(62, 168, 201, 0.12), transparent);
  color: var(--ice);
}

.frostie-surface__workspace {
  position: relative;
  padding: clamp(1.2rem, 2.5vw, 2rem);
}

.frostie-surface__heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.frostie-surface__kicker,
.frostie-surface__panel > span {
  color: #8cebf5;
  font-size: 0.57rem;
  font-weight: 850;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.frostie-surface__heading h3 {
  max-width: 20ch;
  margin: 0.35rem 0 0;
  color: var(--ice);
  font-size: clamp(1.2rem, 2vw, 1.75rem);
}

.frostie-surface__panels {
  display: grid;
  gap: 0.8rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.frostie-surface__panel {
  position: relative;
  min-height: 9.6rem;
  padding: 1rem;
  border: 1px solid rgba(189, 239, 249, 0.12);
  border-radius: 0.8rem;
  background: rgba(10, 15, 47, 0.68);
  animation: frostie-surface-awaken 12s ease-in-out infinite;
}

.frostie-surface__panel:nth-child(2) {
  animation-delay: -9s;
}
.frostie-surface__panel:nth-child(3) {
  animation-delay: -6s;
}
.frostie-surface__panel:nth-child(4) {
  animation-delay: -3s;
}

.frostie-surface__panel strong {
  display: block;
  margin: 0.55rem 0 0.35rem;
  color: var(--ice);
  font-size: 0.84rem;
}

.frostie-surface__panel p {
  margin: 0;
  color: var(--muted);
  font-size: 0.69rem;
  line-height: 1.55;
}

.frostie-surface__flow {
  display: flex;
  justify-content: space-between;
  padding: 1.15rem 0 0;
}

.frostie-surface__flow span {
  position: relative;
  width: 0.42rem;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #78e8f2;
  box-shadow: 0 0 0.8rem rgba(120, 232, 242, 0.6);
}

.frostie-surface__flow span + span::before {
  position: absolute;
  top: 50%;
  right: 100%;
  width: calc((100vw - 39rem) / 7);
  min-width: 2.4rem;
  height: 1px;
  background: linear-gradient(
    90deg,
    rgba(120, 232, 242, 0.26),
    rgba(132, 82, 224, 0.24)
  );
  content: "";
}

.frostie-surface__note {
  padding: 0.8rem 1rem;
  margin: 0;
  border-top: 1px solid rgba(189, 239, 249, 0.1);
  color: var(--muted);
  font-size: 0.65rem;
}

@keyframes frostie-surface-awaken {
  0%,
  15%,
  100% {
    border-color: rgba(189, 239, 249, 0.12);
    box-shadow: none;
  }
  25%,
  38% {
    border-color: rgba(120, 232, 242, 0.3);
    box-shadow: inset 0 0 2rem rgba(62, 168, 201, 0.055);
  }
  50% {
    border-color: rgba(132, 82, 224, 0.2);
    box-shadow: none;
  }
}

.capability-layout {
  display: grid;
  align-items: start;
  gap: clamp(3rem, 8vw, 7rem);
  grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.28fr);
}

.capability-intro {
  position: static;
  align-self: start;
}

.capability-intro p:last-child {
  color: var(--muted);
}

.capability-route {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  padding: 0;
  margin: 2rem 0 0;
  list-style: none;
}

.capability-route li {
  color: #9fe8f5;
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.capability-route li + li::before {
  margin-right: 0.65rem;
  color: rgba(132, 82, 224, 0.72);
  content: "→";
}

.customer-zero-principles {
  display: grid;
  gap: 0;
  padding: 0;
  margin: 1.8rem 0 0;
  list-style: none;
}

.customer-zero-principles li {
  display: grid;
  gap: 0.28rem;
  padding: 1rem 0;
  border-top: 1px solid rgba(189, 239, 249, 0.14);
}

.customer-zero-principles strong {
  color: var(--ice);
}

.customer-zero-principles span {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.55;
}

.frostie-page .lensing-logo--frostie .energy-badge__atmosphere {
  inset: -62%;
  background:
    radial-gradient(
      circle at 38% 44%,
      rgba(46, 215, 226, 0.34),
      transparent 42%
    ),
    radial-gradient(
      circle at 66% 58%,
      rgba(132, 82, 224, 0.31),
      transparent 45%
    );
  filter: blur(14px);
  opacity: 0.92;
}

.capability-list {
  border-top: 1px solid var(--line);
}
.capability-list details {
  border-bottom: 1px solid var(--line);
}
.capability-list summary {
  display: grid;
  min-height: 5rem;
  align-items: center;
  gap: 1rem;
  padding-block: 1rem;
  cursor: pointer;
  list-style: none;
  grid-template-columns: auto minmax(0, 1fr);
}
.capability-list summary::-webkit-details-marker {
  display: none;
}
.capability-list summary span {
  display: grid;
  width: 2.3rem;
  height: 2.3rem;
  border: 1px solid rgba(62, 168, 201, 0.3);
  border-radius: 50%;
  color: #9fe8f5;
  font-size: 0.72rem;
  place-items: center;
}
.capability-list summary:focus-visible {
  border-radius: 0.4rem;
  outline: 3px solid var(--azure);
  outline-offset: 3px;
}
.capability-list details p {
  max-width: 62ch;
  padding: 0 0 1.6rem 3.3rem;
  margin: 0;
  color: var(--muted);
}

.final-cta {
  border: 1px solid rgba(62, 168, 201, 0.24);
  background:
    radial-gradient(
      circle at 12% 28%,
      rgba(62, 168, 201, 0.16),
      transparent 36%
    ),
    radial-gradient(
      circle at 88% 70%,
      rgba(102, 62, 208, 0.16),
      transparent 38%
    ),
    rgba(12, 16, 48, 0.9);
  color: var(--ice);
}

.final-cta p {
  color: var(--muted);
}
.final-cta .button {
  box-shadow: 0 14px 40px rgba(62, 168, 201, 0.14);
}

.closing-section {
  padding-block: clamp(2.5rem, 5vw, 4.5rem);
}

.closing-invitation {
  display: grid;
  align-items: end;
  gap: clamp(1.5rem, 4vw, 4rem);
  padding-block: clamp(2rem, 3.5vw, 3rem);
  border-block: 1px solid rgba(189, 239, 249, 0.13);
  grid-template-columns: minmax(0, 1fr) auto;
}

.closing-invitation h2 {
  max-width: 20ch;
  margin-bottom: 0.75rem;
}

.closing-invitation p:not(.eyebrow) {
  max-width: 58ch;
  margin: 0;
  color: var(--muted);
}

.closing-invitation .text-link {
  margin-bottom: 0.25rem;
  white-space: nowrap;
}

.frostie-contact-panel {
  padding: clamp(2rem, 3.5vw, 3rem);
}

.faq-hero {
  display: grid;
  width: min(calc(100% - 2rem), 68rem);
  min-height: 0;
  align-items: center;
  gap: clamp(2rem, 4vw, 4rem);
  padding-block: clamp(3.2rem, 6vw, 4.8rem);
  grid-template-columns: minmax(0, 1.15fr) minmax(18rem, 0.85fr);
}

.faq-hero h1 {
  max-width: 13ch;
  margin-bottom: 0;
}

.faq-hero .lead {
  max-width: 34rem;
  margin-bottom: 0.4rem;
}
.faq-layout--page {
  padding-bottom: 0;
}

.faq-page .faq-section {
  padding-block: clamp(3rem, 5vw, 4.5rem);
}

.faq-contact {
  padding-block: clamp(2.25rem, 4vw, 3.5rem) clamp(3.5rem, 6vw, 5rem);
}

.faq-final-cta {
  min-height: 0;
  padding: clamp(1.7rem, 3.5vw, 2.7rem);
}
.faq-page .site-signal-field {
  opacity: 0.35;
}

.cookie-consent [hidden] {
  display: none !important;
}

.cookie-banner {
  position: fixed;
  z-index: 1200;
  right: clamp(1rem, 3vw, 2rem);
  bottom: clamp(1rem, 3vw, 2rem);
  left: clamp(1rem, 3vw, 2rem);
  display: grid;
  width: min(calc(100% - clamp(2rem, 6vw, 4rem)), 76rem);
  align-items: center;
  gap: clamp(1.25rem, 3vw, 2.5rem);
  padding: clamp(1.35rem, 3vw, 2rem);
  margin-inline: auto;
  border: 1px solid rgba(189, 239, 249, 0.25);
  border-radius: 1.4rem;
  background:
    radial-gradient(
      circle at 4% 20%,
      rgba(62, 168, 201, 0.18),
      transparent 34%
    ),
    radial-gradient(
      circle at 96% 80%,
      rgba(102, 62, 208, 0.16),
      transparent 38%
    ),
    rgba(11, 15, 45, 0.98);
  box-shadow: 0 24px 80px rgba(3, 6, 25, 0.72);
  color: var(--ice);
  grid-template-columns: minmax(0, 1fr) auto;
}

.cookie-banner__copy h2,
.cookie-modal__panel h2 {
  margin-bottom: 0.55rem;
  font-size: clamp(1.35rem, 2.4vw, 1.85rem);
}

.cookie-banner__copy > p:last-child,
.cookie-modal__intro,
.cookie-modal__note {
  max-width: 66ch;
  margin: 0;
  color: var(--muted);
  font-size: 0.95rem;
}

.cookie-banner a,
.cookie-modal a {
  color: #bdeff9;
}

.cookie-banner__eyebrow {
  margin: 0 0 0.45rem;
  color: #8de6f2;
  font-size: 0.7rem;
  font-weight: 850;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.cookie-banner__actions,
.cookie-modal__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.7rem;
  flex-wrap: wrap;
}

.cookie-button,
.cookie-text-button,
.cookie-settings-button,
.cookie-modal__close {
  font: inherit;
}

.cookie-button {
  min-width: 10.5rem;
  border: 1px solid rgba(189, 239, 249, 0.22);
  cursor: pointer;
}

.cookie-text-button,
.cookie-settings-button,
.cookie-modal__close {
  border: 0;
  background: transparent;
  color: #bdeff9;
  cursor: pointer;
}

.cookie-text-button {
  padding: 0.65rem 0.35rem;
  font-weight: 750;
  text-decoration: underline;
  text-underline-offset: 0.25rem;
}

.cookie-settings-button {
  position: fixed;
  z-index: 900;
  right: 1rem;
  bottom: 1rem;
  padding: 0.62rem 0.85rem;
  border: 1px solid rgba(189, 239, 249, 0.2);
  border-radius: 999px;
  background: rgba(11, 15, 45, 0.94);
  box-shadow: 0 10px 35px rgba(3, 6, 25, 0.36);
  font-size: 0.76rem;
  font-weight: 800;
}

.cookie-modal {
  position: fixed;
  z-index: 1300;
  inset: 0;
  display: grid;
  overflow-y: auto;
  place-items: center;
  padding: 1rem;
}

.cookie-modal__backdrop {
  position: fixed;
  inset: 0;
  background: rgba(3, 6, 25, 0.76);
  backdrop-filter: blur(7px);
}

.cookie-modal__panel {
  position: relative;
  z-index: 1;
  width: min(100%, 44rem);
  max-height: calc(100vh - 2rem);
  overflow-y: auto;
  padding: clamp(1.4rem, 4vw, 2.25rem);
  border: 1px solid rgba(189, 239, 249, 0.24);
  border-radius: 1.4rem;
  outline: 0;
  background:
    radial-gradient(
      circle at 8% 10%,
      rgba(62, 168, 201, 0.15),
      transparent 34%
    ),
    #101432;
  box-shadow: 0 30px 100px rgba(3, 6, 25, 0.78);
  color: var(--ice);
}

.cookie-modal__close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 2.5rem;
  height: 2.5rem;
  border: 1px solid rgba(189, 239, 249, 0.18);
  border-radius: 50%;
  font-size: 1.5rem;
  line-height: 1;
}

.cookie-modal__intro {
  margin-bottom: 1.4rem;
}

.cookie-choice {
  display: grid;
  align-items: center;
  gap: 1.25rem;
  padding: 1.1rem 0;
  border-top: 1px solid rgba(189, 239, 249, 0.14);
  color: var(--ice);
  cursor: pointer;
  grid-template-columns: minmax(0, 1fr) auto;
}

.cookie-choice strong,
.cookie-choice span span {
  display: block;
}

.cookie-choice span span,
.cookie-choice p {
  margin: 0.3rem 0 0;
  color: var(--muted);
  font-size: 0.88rem;
}

.cookie-choice__status {
  color: #9fe8f5;
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.cookie-choice input {
  width: 2.8rem;
  height: 1.45rem;
  accent-color: var(--azure);
  cursor: pointer;
}

.cookie-modal__note {
  padding-top: 1rem;
  border-top: 1px solid rgba(189, 239, 249, 0.14);
  font-size: 0.82rem;
}

.cookie-modal__actions {
  justify-content: flex-start;
  margin-top: 1.4rem;
}

.legal-table-wrap {
  overflow-x: auto;
  margin-block: 1.5rem;
  border: 1px solid rgba(189, 239, 249, 0.15);
  border-radius: 1rem;
}

.legal-table-wrap table {
  width: 100%;
  min-width: 42rem;
  border-collapse: collapse;
}

.legal-table-wrap th,
.legal-table-wrap td {
  padding: 0.9rem 1rem;
  border-bottom: 1px solid rgba(189, 239, 249, 0.12);
  text-align: left;
  vertical-align: top;
}

.legal-table-wrap th {
  color: #bdeff9;
  font-size: 0.72rem;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.legal-table-wrap tbody tr:last-child td {
  border-bottom: 0;
}

.legal-cookie-settings {
  padding: 0;
  border: 0;
  background: transparent;
  color: #bdeff9;
  font: inherit;
  font-weight: 750;
  text-decoration: underline;
  text-underline-offset: 0.2rem;
  cursor: pointer;
}

.legal-cookie-settings:focus-visible {
  outline: 3px solid #bdeff9;
  outline-offset: 3px;
}

body.cookie-modal-open {
  overflow: hidden;
}

.cookie-button:focus-visible,
.cookie-text-button:focus-visible,
.cookie-settings-button:focus-visible,
.cookie-modal__close:focus-visible,
.cookie-choice input:focus-visible {
  outline: 3px solid #bdeff9;
  outline-offset: 3px;
}

.hero,
.page-hero,
.legal-hero {
  position: relative;
}

.site-footer {
  position: relative;
  padding-block: clamp(3rem, 6vw, 4.5rem);
  border-top: 1px solid var(--line);
  background: linear-gradient(
    105deg,
    rgba(62, 168, 201, 0.035),
    transparent 38%,
    rgba(102, 62, 208, 0.035)
  );
  color: var(--muted);
}

.site-footer::before {
  position: absolute;
  z-index: -1;
  right: 0;
  bottom: 0;
  left: 0;
  height: 12rem;
  background: radial-gradient(
    ellipse at 50% 100%,
    rgba(68, 107, 193, 0.1),
    transparent 65%
  );
  content: "";
  pointer-events: none;
}

.site-footer::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    radial-gradient(
      circle at 2.5% 36%,
      rgba(120, 232, 242, 0.4) 0 2px,
      transparent 3px
    ),
    radial-gradient(
      circle at 6% 67%,
      rgba(132, 82, 224, 0.34) 0 1.5px,
      transparent 3px
    ),
    radial-gradient(
      circle at 95% 30%,
      rgba(120, 232, 242, 0.32) 0 2px,
      transparent 3px
    ),
    radial-gradient(
      circle at 98% 71%,
      rgba(132, 82, 224, 0.28) 0 1.5px,
      transparent 3px
    ),
    linear-gradient(
      90deg,
      transparent 0 2%,
      rgba(62, 168, 201, 0.1) 6%,
      transparent 15%
    ),
    linear-gradient(
      270deg,
      transparent 0 2%,
      rgba(102, 62, 208, 0.1) 7%,
      transparent 16%
    );
  content: "";
  opacity: 0.7;
  pointer-events: none;
}

.site-footer > .shell {
  width: min(90%, 1480px);
}

.footer-grid {
  display: grid;
  align-items: start;
  gap: 2.5rem clamp(1.75rem, 4vw, 4rem);
  grid-template-columns: minmax(30rem, 1.75fr) 0.52fr 0.52fr minmax(
      15rem,
      0.85fr
    );
}

.footer-identity {
  display: flex;
  align-items: center;
  gap: 1.75rem;
}

.footer-logo {
  flex: 0 0 auto;
  width: 8.5rem;
  text-decoration: none;
}

.footer-logo img {
  width: 100%;
  height: auto;
  filter: drop-shadow(-0.3rem 0 1rem rgba(46, 215, 226, 0.13))
    drop-shadow(0.3rem 0 1rem rgba(132, 82, 224, 0.12));
}

.footer-links {
  display: grid;
  gap: 0.55rem;
}

.footer-links a {
  color: var(--muted);
}

.footer-heading {
  margin: 0 0 1rem;
  color: var(--ice);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.footer-cta {
  padding-left: 1.5rem;
  border-left: 1px solid var(--line);
}

.footer-cta p {
  margin: 0 0 1rem;
  color: var(--ice);
  font-size: 1.05rem;
  font-weight: 750;
  line-height: 1.45;
}

.footer-cta a {
  color: #bdeff9;
  font-weight: 800;
  text-decoration: none;
}

.footer-cta a:hover {
  text-decoration: underline;
}

.company-line {
  max-width: 48rem;
  margin: 0.6rem 0 0;
  font-size: 0.82rem;
}

@media (max-width: 1100px) and (min-width: 801px) {
  .approach-page .page-hero {
    gap: 2rem;
    grid-template-columns: minmax(0, 1fr) minmax(26rem, 0.9fr);
  }

  .approach-loop {
    width: min(100%, 31rem);
  }

  .approach-page .page-hero h1 {
    font-size: clamp(3.25rem, 6vw, 4.4rem);
  }
}

@media (max-width: 800px) {
  .cookie-banner {
    max-height: calc(100vh - 2rem);
    align-items: stretch;
    overflow-y: auto;
    grid-template-columns: minmax(0, 1fr);
  }

  .cookie-banner__actions {
    display: grid;
    justify-content: stretch;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .cookie-banner__actions .cookie-text-button {
    grid-column: 1 / -1;
  }

  .cookie-button {
    min-width: 0;
  }

  .nav {
    display: grid;
    min-height: auto;
    align-items: center;
    padding-block: 0.8rem;
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .nav-links {
    display: grid;
    width: 100%;
    gap: 0.35rem;
    padding-top: 0.75rem;
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .nav-links a {
    display: flex;
    min-height: 2.75rem;
    align-items: center;
    padding: 0.55rem 0.7rem;
    border-radius: 0.7rem;
  }

  .nav-links a:hover,
  .nav-links a[aria-current="page"] {
    background: rgba(245, 247, 247, 0.055);
  }

  .nav[data-nav-enhanced="true"] .nav-toggle {
    display: inline-flex;
  }

  .nav[data-nav-enhanced="true"][data-nav-open="false"] .nav-links {
    display: none;
  }

  .hero,
  .page-hero,
  .section-intro,
  .content-grid,
  .frostie-panel,
  .frostie-help,
  .contact-panel,
  .contact-detail,
  .contact-steps,
  .legal-layout,
  .faq-layout,
  .capability-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .frostie-contact-panel .final-cta__action {
    justify-items: start;
    justify-self: stretch;
    text-align: left;
  }

  .contact-steps {
    gap: 2.5rem;
  }

  .contact-steps li,
  .contact-steps li + li {
    padding: 0 0 2.5rem 4.5rem;
  }

  .contact-steps li + li::before {
    top: -2.5rem;
    right: 0;
    bottom: auto;
    width: auto;
    height: 1px;
    background: linear-gradient(
      to right,
      transparent,
      rgba(92, 181, 226, 0.3),
      rgba(101, 69, 224, 0.22),
      transparent
    );
  }

  .contact-step-number {
    position: absolute;
    top: 0.2rem;
    left: 0;
    margin: 0;
  }

  .hero {
    min-height: auto;
    gap: 2.5rem;
    padding-block: 4rem;
  }

  .page-hero {
    min-height: auto;
    gap: 2.5rem;
    padding-block: 4rem;
  }

  .contact-page .page-hero {
    grid-template-columns: 1fr;
  }

  .contact-convergence {
    width: 100%;
    min-height: 0;
    justify-self: stretch;
  }

  .contact-convergence span:nth-of-type(n + 9) {
    display: none;
  }

  .section-intro {
    margin-bottom: 2.25rem;
  }

  .faq-layout {
    width: min(100%, 46rem);
    gap: 2rem;
  }

  .faq-hero,
  .faq-toolbar {
    grid-template-columns: minmax(0, 1fr);
  }

  .faq-hero {
    align-items: start;
    gap: 1.2rem;
    padding-block: 3.5rem;
  }

  .faq-hero .lead {
    max-width: 42rem;
  }

  .faq-toolbar {
    align-items: start;
    gap: 1.25rem;
  }

  .faq-categories {
    justify-content: flex-start;
  }

  .energy-badge,
  .brand-emblem {
    width: min(72vw, 22rem);
    justify-self: center;
  }

  .soft-signal {
    width: min(70vw, 19rem);
    justify-self: center;
  }

  .approach-loop {
    width: min(82vw, 27rem);
    padding: 0.75rem;
    justify-self: center;
  }

  .approach-page .page-hero {
    grid-template-columns: 1fr;
  }

  .approach-loop__field {
    min-height: 0;
    aspect-ratio: 1;
  }

  .hero-signal-field span:nth-child(n + 7) {
    display: none;
  }

  .page-atmosphere--frostie span {
    width: 125vw;
    height: 29rem;
    filter: blur(22px);
    opacity: 0.58;
  }

  .page-atmosphere--frostie span:nth-child(3) {
    display: none;
  }

  .page-atmosphere--home span:nth-child(n + 5),
  .page-atmosphere--about span:nth-child(n + 5),
  .page-atmosphere--contact span:nth-child(n + 5) {
    display: none;
  }

  .capability-intro {
    position: static;
  }

  .about-manifesto {
    width: 100%;
    max-width: 42rem;
    justify-self: start;
  }

  .system-map {
    min-height: auto;
    padding-block: 2rem;
  }

  .system-map__connections {
    display: none;
  }

  .system-map__core {
    position: relative;
    top: auto;
    left: auto;
    width: 9rem;
    margin: 0 auto 2rem;
    transform: none;
  }

  .system-map__nodes {
    position: relative;
    display: grid;
    gap: 0;
  }

  .system-map__node {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    min-height: auto;
    padding: 1rem 1rem 1rem 3.5rem;
    border-width: 0 0 1px;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .system-map__node > span {
    position: absolute;
    top: 1.2rem;
    left: 0.7rem;
  }

  .system-map__explanation {
    position: relative;
    bottom: auto;
    left: auto;
    width: auto;
    padding: 1.5rem 0 0;
    text-align: left;
    transform: none;
  }

  .capability-constellation {
    min-height: auto;
    padding-top: 1rem;
  }

  .capability-constellation::before,
  .capability-constellation::after {
    display: none;
  }

  .capability-constellation__core {
    position: relative;
    top: auto;
    left: auto;
    width: 8.5rem;
    margin: 0 auto 1.5rem;
    transform: none;
  }

  .capability-constellation ul {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .capability-constellation li {
    position: relative;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: auto;
    min-height: 6rem;
    padding: 0.85rem;
    border: 1px solid rgba(189, 239, 249, 0.11);
  }

  .card-grid {
    grid-template-columns: 1fr;
  }

  .card {
    min-height: auto;
  }

  .card-index {
    margin-bottom: 2rem;
  }

  .legal-nav {
    position: static;
  }

  .footer-grid {
    grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(8rem, 0.6fr));
  }

  .footer-identity,
  .footer-cta {
    grid-column: 1 / -1;
  }

  .footer-cta {
    padding: 1.5rem 0 0;
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .frostie-page .page-hero {
    grid-template-columns: minmax(0, 1fr);
  }

  .frostie-page .brand-emblem {
    width: min(76vw, 23rem);
    justify-self: center;
  }

  .system-journey {
    padding: 1.5rem 0 1.25rem;
  }

  .system-journey__track {
    top: 2rem;
    right: auto;
    bottom: 8.5rem;
    left: 1.35rem;
    width: 1px;
    height: auto;
    background: linear-gradient(
      180deg,
      #55dbe9,
      #4e8cdc 48%,
      #8452e0 86%,
      #55dbe9
    );
  }

  .system-journey__track span {
    top: 0;
    left: 50%;
    width: 0.2rem;
    height: 5rem;
    background: linear-gradient(180deg, transparent, #c5f7fc 58%, #78e8f2);
    transform: translate(-50%, -100%);
    animation-name: system-signal-travel-mobile;
  }

  .system-journey__stages {
    gap: 0;
    grid-template-columns: minmax(0, 1fr);
  }

  .system-journey__stages li {
    min-height: 6.3rem;
    padding: 1.25rem 1rem 1.15rem 3.5rem;
    border-top: 0;
    border-bottom: 1px solid rgba(189, 239, 249, 0.12);
  }

  .system-journey__stages li::before {
    top: 1.55rem;
    left: 1.05rem;
    transform: none;
  }

  .system-journey__return {
    width: auto;
    padding: 1.35rem 1rem 0 2.75rem;
    margin-inline: 1rem;
    text-align: left;
  }

  .system-journey__return::before {
    top: 0;
    right: auto;
    left: 0.35rem;
    width: 1.25rem;
    height: 1.15rem;
    border: 0;
    border-bottom: 1px solid rgba(120, 232, 242, 0.3);
    border-left: 1px solid rgba(120, 232, 242, 0.3);
    border-radius: 0 0 0 0.8rem;
  }

  .system-journey__return::after {
    display: none;
  }

  .frostie-surface__body {
    min-height: 0;
    grid-template-columns: minmax(0, 1fr);
  }

  .frostie-surface__rail {
    display: flex;
    padding: 0;
    border-right: 0;
    border-bottom: 1px solid rgba(189, 239, 249, 0.1);
    overflow-x: auto;
  }

  .frostie-surface__rail li {
    min-width: 7rem;
    border-bottom: 2px solid transparent;
    border-left: 0;
  }

  .frostie-surface__rail li.is-active {
    border-bottom-color: #78e8f2;
    border-left-color: transparent;
    background: linear-gradient(0deg, rgba(62, 168, 201, 0.12), transparent);
  }

  .frostie-surface__flow {
    display: none;
  }
}

@keyframes system-signal-travel-mobile {
  0% {
    opacity: 0;
  }
  0%,
  2% {
    top: 0;
  }
  2%,
  94% {
    opacity: 1;
  }
  94%,
  100% {
    top: 100%;
  }
  99%,
  100% {
    opacity: 0;
  }
}

@media (max-width: 560px) {
  .cookie-banner {
    right: 0.65rem;
    bottom: 0.65rem;
    left: 0.65rem;
    width: auto;
    max-height: calc(100vh - 1.3rem);
    padding: 1.15rem;
    border-radius: 1.1rem;
  }

  .cookie-banner__actions {
    grid-template-columns: minmax(0, 1fr);
  }

  .cookie-banner__actions .cookie-text-button {
    grid-column: auto;
  }

  .cookie-modal {
    padding: 0.65rem;
  }

  .cookie-modal__panel {
    max-height: calc(100vh - 1.3rem);
    border-radius: 1.1rem;
  }

  .cookie-modal__actions {
    display: grid;
    justify-content: stretch;
  }

  .shell {
    width: min(100% - 1.25rem, 1160px);
  }

  .brand {
    gap: 0.6rem;
    font-size: 0.9rem;
  }

  .brand img {
    width: 2.75rem;
    height: 2.75rem;
  }

  .nav-links {
    font-size: 0.85rem;
  }

  .nav-links .button {
    grid-column: 1 / -1;
    width: 100%;
  }

  h1 {
    max-width: 100%;
    font-size: clamp(2.3rem, 11.5vw, 3.6rem);
  }

  .page-hero h1 {
    font-size: clamp(2.3rem, 11.5vw, 3.6rem);
  }

  h2 {
    font-size: clamp(1.85rem, 9vw, 2.8rem);
  }

  .lead,
  .prose,
  .contact-detail,
  .contact-panel {
    overflow-wrap: anywhere;
  }

  .section {
    padding-block: 3rem;
  }

  .energy-badge,
  .brand-emblem,
  .soft-signal,
  .approach-loop {
    width: min(78vw, 17.5rem);
  }

  .approach-loop__node {
    width: 5.7rem;
    min-width: 0;
    min-height: 3.5rem;
    padding: 0.45rem 0.5rem;
  }

  .approach-loop__node strong {
    font-size: 0.78rem;
  }

  .approach-loop__node small {
    font-size: 0.54rem;
  }

  .approach-loop__centre strong {
    font-size: 0.72rem;
  }

  .approach-loop__centre small {
    font-size: 0.58rem;
    line-height: 1.5;
  }

  .approach-loop__centre {
    width: 11.5rem;
    gap: 0.35rem;
  }

  .hero,
  .page-hero {
    gap: 1.5rem;
    padding-block: 2.5rem;
  }

  .hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-top: 1.4rem;
  }

  .hero-actions .button {
    width: auto;
    min-height: 2.85rem;
    padding: 0.72rem 1rem;
    font-size: 0.84rem;
  }

  .hero-actions .button.secondary {
    border-color: rgba(189, 239, 249, 0.18);
    background: rgba(10, 15, 47, 0.36);
  }

  .home-page .hero {
    gap: 0.9rem;
    padding-block: 2.25rem 1.4rem;
  }

  .home-page .hero-copy {
    order: 2;
  }

  .home-page .energy-badge {
    order: 1;
  }

  .home-page .hero h1 {
    margin-bottom: 1rem;
  }

  .home-page .hero .lead {
    font-size: 1rem;
    line-height: 1.65;
  }

  .home-page .energy-badge {
    width: min(100%, 17rem);
    height: clamp(11.5rem, 53vw, 14rem);
    aspect-ratio: auto;
    margin: 0 auto 0.3rem;
  }

  .home-page .energy-badge::before,
  .home-page .energy-badge::after {
    top: calc(50% - 8rem);
    left: calc(50% - 8rem);
    width: 16rem;
    height: 16rem;
    inset-block-end: auto;
    inset-inline-end: auto;
  }

  .home-page .energy-badge__disc {
    top: calc(50% - 7.4rem);
    left: calc(50% - 7.4rem);
    width: 14.8rem;
    height: 14.8rem;
    inset-block-end: auto;
    inset-inline-end: auto;
  }

  .home-page .energy-badge__atmosphere {
    top: calc(50% - 10rem);
    left: calc(50% - 10rem);
    width: 20rem;
    height: 20rem;
    inset-block-end: auto;
    inset-inline-end: auto;
    filter: blur(22px);
  }

  .home-page .hero + .section {
    padding-top: 2.6rem;
  }

  .section-intro {
    gap: 0.9rem;
    margin-bottom: 1.75rem;
  }

  .section-intro h2 {
    margin-bottom: 0;
  }

  .page-hero .hero-support {
    margin-top: 1rem;
  }

  .frostie-page .page-hero {
    gap: 0.75rem;
    padding-bottom: 1.6rem;
  }

  .frostie-page .brand-emblem {
    width: min(100%, 24rem);
    height: clamp(18rem, 80vw, 21rem);
    aspect-ratio: auto;
  }

  .frostie-page .brand-emblem .energy-badge__disc {
    top: calc(50% - 9.5rem);
    left: calc(50% - 9.5rem);
    width: 19rem;
    height: 19rem;
    inset-block-end: auto;
    inset-inline-end: auto;
    background: transparent;
  }

  .frostie-page .brand-emblem .energy-badge__atmosphere {
    top: calc(50% - 11rem);
    left: calc(50% - 11rem);
    width: 22rem;
    height: 22rem;
    inset-block-end: auto;
    inset-inline-end: auto;
    filter: blur(19px);
    opacity: 0.88;
  }

  .frostie-page .page-hero + .section {
    padding-top: 2.5rem;
  }

  .about-page .about-manifesto,
  .approach-page .approach-loop {
    margin-top: 0.25rem;
  }

  .contact-convergence {
    min-height: 0;
  }

  .closing-invitation {
    align-items: start;
    gap: 1.25rem;
    grid-template-columns: minmax(0, 1fr);
  }

  .closing-invitation .text-link {
    margin: 0;
    white-space: normal;
  }

  .approach-loop {
    width: min(88vw, 20rem);
  }

  .approach-page .page-hero h1 {
    font-size: clamp(2.2rem, 9.5vw, 2.65rem);
  }

  .card,
  .contact-detail,
  .contact-panel,
  .frostie-panel {
    padding: 1.35rem;
  }

  .capability-constellation ul {
    grid-template-columns: 1fr;
  }

  .capability-constellation li {
    min-height: auto;
    padding: 0.9rem 0;
    border-width: 0 0 1px;
  }

  .system-journey__return {
    align-items: start;
  }

  .frostie-surface__bar {
    align-items: flex-start;
  }

  .frostie-surface__status {
    max-width: 7rem;
    text-align: center;
  }

  .frostie-surface__workspace {
    padding: 1rem;
  }

  .frostie-surface__heading {
    display: grid;
  }

  .frostie-surface__authority {
    width: fit-content;
  }

  .frostie-surface__panels {
    grid-template-columns: minmax(0, 1fr);
  }

  .frostie-surface__panel {
    min-height: 0;
  }

  .faq-list summary {
    min-height: 4rem;
    gap: 1rem;
  }

  .faq-list details p {
    padding-right: 0;
  }

  .faq-page .faq-section {
    padding-block: 2.5rem;
  }

  .faq-hero {
    gap: 0.9rem;
    padding-block: 2.5rem 2rem;
  }

  .faq-hero h1 {
    font-size: clamp(2.2rem, 10.6vw, 3.1rem);
  }

  .faq-hero .lead {
    font-size: 1rem;
    line-height: 1.65;
  }

  .faq-toolbar {
    gap: 1rem;
  }

  .faq-toolbar h2 {
    font-size: clamp(1.7rem, 8vw, 2.25rem);
  }

  .faq-categories {
    width: calc(100vw - 1.25rem);
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 0.45rem;
    padding: 0.15rem 0.1rem 0.55rem;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }

  .faq-categories a {
    flex: 0 0 auto;
  }

  .faq-group + .faq-group {
    margin-top: 1.8rem;
  }

  .faq-direct {
    margin-top: 0;
    font-size: 0.82rem;
    text-align: left;
  }

  .faq-contact {
    padding-block: 1.75rem 3rem;
  }

  .faq-final-cta {
    gap: 1.25rem;
    padding: 1.35rem;
  }

  .footer-grid {
    display: grid;
    gap: 0;
    grid-template-columns: 4.75rem minmax(0, 1fr);
  }

  .footer-identity {
    display: contents;
  }

  .footer-identity > div {
    display: contents;
  }

  .footer-identity > .footer-logo {
    align-self: start;
    margin-top: 0.1rem;
    grid-column: 1;
    grid-row: 1 / span 2;
  }

  .footer-identity strong {
    align-self: end;
    padding-left: 0.85rem;
    grid-column: 2;
    grid-row: 1;
  }

  .footer-identity .company-line:first-of-type {
    align-self: start;
    padding-left: 0.85rem;
    margin-top: 0.28rem;
    grid-column: 2;
    grid-row: 2;
  }

  .footer-identity .company-line:last-of-type {
    max-width: none;
    padding-top: 1rem;
    margin-top: 1.25rem;
    border-top: 1px solid var(--line);
    color: rgba(190, 200, 220, 0.74);
    font-size: 0.72rem;
    line-height: 1.55;
    grid-column: 1 / -1;
    grid-row: 6;
  }

  .footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem 1rem;
  }

  .footer-column {
    padding-top: 1.15rem;
    margin-top: 1.15rem;
    border-top: 1px solid var(--line);
    grid-column: 1 / -1;
  }

  .footer-grid > .footer-column:nth-child(2) {
    grid-row: 3;
  }

  .footer-grid > .footer-column:nth-child(3) {
    grid-row: 4;
  }

  .footer-heading {
    margin-bottom: 0.65rem;
  }

  .footer-cta {
    padding-top: 1.15rem;
    margin-top: 1.15rem;
    grid-column: 1 / -1;
    grid-row: 5;
  }

  .footer-cta p {
    margin-bottom: 0.55rem;
    font-size: 0.96rem;
  }

  .footer-logo {
    width: 4.75rem;
  }

  .site-footer {
    padding-block: 2.35rem;
  }

  .site-footer > .shell {
    width: min(100% - 1.25rem, 1160px);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }

  .energy-badge__atmosphere,
  .lensing-logo,
  .lensing-logo::before,
  .lensing-logo::after,
  .energy-badge__disc::before,
  .site-signal-field span,
  .hero-signal-field span,
  .page-atmosphere span,
  .approach-loop__signal,
  .approach-loop__node,
  .system-journey__track span,
  .system-journey__stages li,
  .system-journey__stages li::before,
  .frostie-surface__panel,
  .frostie-page .system-map__node,
  .system-map__connections path,
  .faq-list details::after {
    animation: none !important;
  }

  .page-atmosphere--frostie span {
    opacity: 0.24;
    transform: none;
  }

  .contact-convergence span {
    transition: none !important;
  }

  .approach-loop__signal {
    display: none;
  }

  .approach-loop__centre::before {
    opacity: 0.3;
    animation: none !important;
  }

  .page-atmosphere--home span,
  .page-atmosphere--about span,
  .page-atmosphere--approach span,
  .page-atmosphere--contact span {
    opacity: 0.07;
    transform: none;
  }

  html[data-motion-enhanced="true"] .section,
  html[data-motion-enhanced="true"] .statement-section,
  html[data-motion-enhanced="true"] .page-hero,
  html[data-motion-enhanced="true"] .legal-hero {
    opacity: 1;
    transform: none;
  }

  [data-pointer-glow]::after {
    opacity: 0 !important;
  }

  .cursor-light {
    display: none !important;
  }
}