/* Whole-page spatial stage. Typography and controls remain on readable planes. */
:root {
  --world-line: rgba(244, 243, 239, 0.08);
  --depth-edge: rgba(244, 243, 239, 0.35);
  --depth-panel: #181818;
  --depth-shadow: 0 35px 65px rgba(0, 0, 0, 0.7);
}
body {
  isolation: isolate;
  overflow-x: clip;
}
.world {
  position: fixed;
  inset: 0;
  z-index: -2;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 85% 45%, #202020, transparent 55%), #080808;
}
.world-grid {
  position: absolute;
  inset: -80% -50%;
  background-image:
    linear-gradient(var(--world-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--world-line) 1px, transparent 1px);
  background-size: 100px 100px;
  transform: perspective(700px) rotateX(66deg) rotateZ(-18deg)
    translateY(var(--world-shift, 0px));
  mask-image: radial-gradient(ellipse, #000, transparent 65%);
  opacity: 0.48;
  transition: transform 0.12s linear;
}
.world-horizon {
  position: absolute;
  top: 42%;
  left: -20%;
  width: 140%;
  height: 1px;
  background: linear-gradient(90deg, transparent, #777, transparent);
  transform: rotate(-18deg);
  opacity: 0.2;
}
.world-orb {
  position: absolute;
  width: 45vw;
  height: 45vw;
  border: 1px solid var(--world-line);
  border-radius: 50%;
  box-shadow:
    inset -20px -30px 90px #000,
    inset 2px 2px 8px rgba(255, 255, 255, 0.08);
  background: radial-gradient(
    circle at 35% 25%,
    rgba(255, 255, 255, 0.03),
    transparent 60%
  );
}
.orb-a {
  right: -32vw;
  top: 8%;
}
.orb-b {
  left: -35vw;
  bottom: -10%;
}
.nav-shell {
  margin: 16px auto 0;
  width: calc(100% - 32px);
  max-width: 1440px;
  border: 1px solid var(--border-strong);
  border-radius: 18px;
  box-shadow:
    0 7px 0 #080808,
    0 8px 0 #292929,
    0 20px 50px #000;
  top: 12px;
}
.nav-inner {
  min-height: 66px;
}
.hero:before {
  background: none;
}
.hero {
  padding-top: 54px;
}
.section {
  position: relative;
  padding-top: 130px;
}
.section-top {
  border-top-color: var(--depth-edge);
}
.section-heading h2 {
  font-size: clamp(3.5rem, 6.8vw, 6.2rem);
  line-height: 0.98;
  letter-spacing: -0.065em;
  text-shadow:
    1px 2px #666,
    3px 5px #191919,
    10px 15px 35px #000;
}
.section-heading {
  margin-block: 50px;
}
.section-top .signal {
  display: inline-block;
  transform: perspective(200px) rotateY(-15deg);
  text-shadow: 2px 2px #4c2112;
}
.workspace-preview {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background:
    linear-gradient(120deg, rgba(244, 243, 239, 0.07), transparent 65%), #101010;
  min-height: 580px;
  overflow: visible;
  transform: none;
  border-radius: 28px;
}
.preview-head,
.preview-foot {
  grid-column: 1/-1;
}
.preview-body {
  grid-column: 2;
  grid-row: 2;
  display: block;
  padding: 50px 40px 50px 0;
}
.preview-title h2 {
  font-size: 2.5rem;
}
.desk-list {
  margin-top: 24px;
}
.workspace-sculpture {
  height: 450px;
  position: relative;
  perspective: 1000px;
  align-self: center;
}
.stack-sheet {
  position: absolute;
  width: 300px;
  height: 220px;
  left: 50%;
  top: 50%;
  margin: -110px -150px;
  border: 1px solid var(--depth-edge);
  border-radius: 18px;
  background: linear-gradient(140deg, #3c3c3c, #111 75%);
  box-shadow:
    6px 8px 0 #090909,
    7px 9px 0 #333,
    20px 40px 40px #000;
  transform: rotateX(50deg) rotateZ(-30deg);
  padding: 26px;
  color: var(--paper);
  font: 10px var(--font-mono);
  letter-spacing: 0.12em;
  animation: stack-float 7s ease-in-out infinite;
}
.sheet-back {
  translate: 0 90px;
  opacity: 0.55;
}
.sheet-mid {
  translate: 0 15px;
  animation-delay: -2s;
}
.sheet-front {
  translate: 0 -65px;
  animation-delay: -4s;
}
.sheet-front strong {
  font: 700 34px/0.98 var(--font-body);
  letter-spacing: -0.05em;
  display: block;
  margin-top: 28px;
}
.sheet-mid i {
  display: block;
  height: 1px;
  background: var(--border-strong);
  margin: 25px 0;
}
.sheet-nodes {
  display: flex;
  gap: 8px;
  margin-top: 24px;
}
.sheet-nodes i {
  width: 40px;
  height: 10px;
  border: 1px solid var(--depth-edge);
  border-radius: 3px;
}
.preview-foot {
  border-radius: 0 0 28px 28px;
}
.system-grid {
  display: flex;
  flex-direction: column;
  gap: 60px;
}
.feature {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto auto 1fr;
  column-gap: 64px;
  padding: 56px;
  min-height: 480px;
  border: 1px solid var(--border-strong);
  border-radius: 28px;
  overflow: visible;
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.07), transparent 50%),
    rgba(12, 12, 12, 0.94);
  box-shadow:
    0 10px 0 #080808,
    0 11px 0 #333,
    0 30px 60px #000;
  transform: none !important;
}
.feature > .eyebrow {
  grid-column: 2;
  padding-top: 24px;
}
.feature h3 {
  grid-column: 2;
  font-size: clamp(2rem, 3.4vw, 3.2rem);
  margin-top: 24px;
  letter-spacing: -0.05em;
}
.feature > p,
.feature > a {
  grid-column: 2;
  max-width: 360px;
}
.feature > a {
  align-self: start;
  margin-top: 28px;
  justify-content: start;
  gap: 24px;
}
.feature:nth-child(2) {
  background:
    linear-gradient(240deg, rgba(255, 255, 255, 0.07), transparent 55%), #101010;
}
.feature:nth-child(2) > .eyebrow,
.feature:nth-child(2) > h3,
.feature:nth-child(2) > p,
.feature:nth-child(2) > a {
  grid-column: 1;
}
.feature:nth-child(2) > .sculpture {
  grid-column: 2;
}
.feature > .mini-script,
.feature > .mini-people,
.feature > .mini-ledger {
  display: none;
}
.sculpture {
  grid-column: 1;
  grid-row: 1/5;
  min-height: 360px;
  position: relative;
  perspective: 1000px;
  transform-style: preserve-3d;
  transform: rotateX(var(--card-x, 0deg)) rotateY(var(--card-y, 0deg));
  transition: transform 0.35s;
}
.sculpture-floor {
  position: absolute;
  width: 350px;
  height: 350px;
  left: 50%;
  top: 50%;
  margin: -175px;
  border: 1px solid var(--world-line);
  background: repeating-linear-gradient(
    0deg,
    transparent 0 34px,
    var(--world-line) 35px 36px
  );
  transform: rotateX(70deg) rotateZ(-25deg) translateZ(-80px);
  border-radius: 50%;
}
.script-pages {
  position: absolute;
  inset: 0;
  transform-style: preserve-3d;
  animation: object-hover 8s ease-in-out infinite;
}
.page {
  width: 220px;
  height: 300px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -150px -110px;
  background: linear-gradient(135deg, #f4f3ef, #aaa8a2);
  border: 1px solid #fff;
  border-radius: 8px;
  box-shadow: var(--depth-shadow);
  transform: rotateY(-25deg) rotateX(18deg) rotateZ(-8deg);
  padding: 28px;
  color: #171717;
}
.page-two {
  translate: 28px 20px;
  rotate: 8deg;
  opacity: 0.7;
}
.page-three {
  translate: 52px 38px;
  rotate: 16deg;
  opacity: 0.35;
}
.page-one {
  transform: rotateY(-25deg) rotateX(18deg) rotateZ(-8deg) translateZ(45px);
}
.page span {
  font: 7px var(--font-mono);
  letter-spacing: 0.05em;
}
.page b {
  font: 800 31px/0.97 var(--font-body);
  display: block;
  letter-spacing: -0.055em;
  margin: 40px 0 30px;
}
.page i {
  height: 1px;
  background: #777;
  display: block;
  margin: 12px 0;
}
.page i:nth-of-type(2) {
  width: 70%;
}
.page span:last-child {
  display: block;
  margin-top: 28px;
  font-size: 6px;
}
.node-system {
  position: absolute;
  inset: 0;
  transform-style: preserve-3d;
  transform: rotateX(38deg) rotateZ(-20deg);
  animation: node-drift 10s ease-in-out infinite;
}
.node-ring {
  position: absolute;
  width: 280px;
  height: 280px;
  top: 50%;
  left: 50%;
  margin: -140px;
  border: 1px solid #666;
  border-radius: 50%;
  box-shadow:
    0 0 0 30px rgba(255, 255, 255, 0.02),
    0 0 0 60px rgba(255, 255, 255, 0.015);
}
.node-center {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -70px;
  width: 140px;
  height: 140px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 20%, #777, #111 70%);
  box-shadow:
    10px 12px 0 #080808,
    11px 13px 0 #333,
    20px 30px 35px #000;
  display: grid;
  place-items: center;
  font: 12px var(--font-mono);
  border: 1px solid #777;
}
.node {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 110px;
  height: 65px;
  margin: -32px -55px;
  background: linear-gradient(135deg, #555, #111);
  border: 1px solid #777;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font: 9px var(--font-mono);
  box-shadow:
    6px 8px 0 #080808,
    7px 9px 0 #333,
    20px 20px 30px #000;
  transform: translateZ(30px);
}
.n1 {
  translate: -125px -90px;
}
.n2 {
  translate: 100px -100px;
}
.n3 {
  translate: -110px 110px;
}
.n4 {
  translate: 120px 100px;
}
.vault {
  position: absolute;
  width: 250px;
  height: 270px;
  left: 50%;
  top: 50%;
  margin: -135px -125px;
  transform-style: preserve-3d;
  transform: rotateY(-25deg) rotateX(15deg) rotateZ(5deg);
  animation: vault-drift 9s ease-in-out infinite;
}
.vault-face,
.vault-back {
  position: absolute;
  inset: 0;
  border: 1px solid #666;
  border-radius: 22px;
  background: linear-gradient(135deg, #555, #101010 55%);
  box-shadow:
    inset 0 0 0 10px #151515,
    inset 0 0 0 11px #555,
    15px 15px 0 #0a0a0a,
    16px 16px 0 #444,
    30px 40px 50px #000;
}
.vault-dial {
  position: absolute;
  inset: 42px 40px 58px;
  border: 14px solid #444;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 20%, #888, #191919 65%);
  box-shadow:
    0 0 0 1px #888,
    8px 10px 15px #000;
  display: grid;
  place-items: center;
  transform: translateZ(30px);
}
.vault-dial span {
  font: 9px/1.6 var(--font-mono);
  text-align: center;
}
.vault-label {
  position: absolute;
  bottom: 27px;
  width: 100%;
  text-align: center;
  font: 8px var(--font-mono);
  letter-spacing: 0.12em;
}
.department-layout {
  align-items: center;
  gap: 70px;
}
.department-intro {
  background: none;
  border: 0;
  box-shadow: none;
  padding: 0;
  overflow: visible;
}
.department-sculpture {
  height: 390px;
  position: relative;
  perspective: 1000px;
  margin-bottom: 40px;
  isolation: isolate;
}
.desk-platform {
  position: absolute;
  width: 290px;
  height: 200px;
  top: 50%;
  left: 50%;
  margin: -100px -145px;
  border: 1px solid #777;
  border-radius: 16px;
  background: linear-gradient(140deg, #444, #101010 70%);
  transform: rotateX(50deg) rotateZ(-32deg);
  box-shadow:
    8px 10px 0 #0b0b0b,
    9px 11px 0 #333,
    20px 30px 35px #000;
  padding: 28px;
  animation: stack-float 8s ease-in-out infinite;
}
.platform-3 {
  translate: 0 105px;
  opacity: 0.5;
}
.platform-2 {
  translate: 0 15px;
  animation-delay: -2s;
}
.platform-1 {
  translate: 0 -80px;
  animation-delay: -4s;
}
.desk-platform span {
  font: 9px var(--font-mono);
  letter-spacing: 0.14em;
}
.desk-platform strong {
  display: block;
  font: 700 45px var(--font-body);
  letter-spacing: -0.06em;
  margin-top: 35px;
}
.platform-beam {
  position: absolute;
  inset: 20% 40%;
  background: linear-gradient(
    0deg,
    transparent,
    rgba(255, 255, 255, 0.08),
    transparent
  );
  filter: blur(15px);
  z-index: -1;
}
.departments details {
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.065), transparent), #111;
  border: 1px solid var(--border-strong);
  border-radius: 16px;
  margin-bottom: 18px;
  box-shadow:
    5px 7px 0 #080808,
    6px 8px 0 #333,
    12px 18px 30px #000;
  transition:
    transform 0.35s,
    background 0.35s;
}
.departments summary {
  padding: 26px;
}
.departments details > div {
  padding: 0 26px 26px;
}
.departments details[open] {
  transform: perspective(1200px) translateZ(20px) translateX(-12px);
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.1), transparent), #161616;
  border-color: #666;
}
.formats {
  gap: 40px;
  perspective: 1400px;
}
.format {
  min-height: 620px;
  padding: 38px;
  overflow: visible;
  box-shadow:
    10px 12px 0 #070707,
    11px 13px 0 #333,
    25px 35px 60px #000;
  background:
    linear-gradient(140deg, rgba(255, 255, 255, 0.1), transparent 60%), #101010;
  transform: rotateY(6deg) rotateX(2deg);
}
.format:nth-child(2) {
  transform: rotateY(-6deg) rotateX(2deg);
}
.format:hover {
  transform: translateY(-12px) rotateY(0);
  box-shadow:
    10px 20px 0 #070707,
    11px 21px 0 #555,
    25px 45px 60px #000;
}
.format:before {
  display: none;
}
.format h3 {
  font-size: 2.3rem;
}
.format-sculpture {
  position: relative;
  height: 300px;
  perspective: 900px;
  transform-style: preserve-3d;
  margin-top: 25px;
}
.cinema-frame {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 270px;
  height: 175px;
  margin: -88px -135px;
  border: 1px solid #777;
  border-radius: 12px;
  background: linear-gradient(125deg, #555, #101010 60%);
  transform: rotateY(-28deg) rotateX(12deg);
  box-shadow:
    8px 10px 0 #050505,
    9px 11px 0 #555,
    25px 30px 40px #000;
  padding: 20px;
  animation: cinema-float 8s ease-in-out infinite;
}
.frame-back {
  translate: 48px -35px;
  opacity: 0.3;
}
.frame-mid {
  translate: 24px -17px;
  opacity: 0.65;
  animation-delay: -2s;
}
.frame-front {
  animation-delay: -4s;
}
.cinema-frame > span {
  font: 8px var(--font-mono);
  letter-spacing: 0.14em;
}
.cinema-frame strong {
  display: block;
  font: 800 85px/0.95 var(--font-body);
  letter-spacing: -0.06em;
  margin-top: 12px;
  color: #ddd;
}
.cinema-frame i {
  position: absolute;
  inset: 12px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 7px;
}
.cube {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 180px;
  height: 180px;
  margin: -90px;
  transform-style: preserve-3d;
  transform: rotateX(-22deg) rotateY(-35deg);
  animation: cube-turn 12s ease-in-out infinite;
}
.cube-face {
  position: absolute;
  inset: 0;
  border: 1px solid #777;
  background: linear-gradient(130deg, #555, #111);
  box-shadow: inset 0 0 40px rgba(0, 0, 0, 0.5);
}
.cube-front {
  transform: translateZ(90px);
  padding: 24px;
}
.cube-front span {
  font: 9px var(--font-mono);
  letter-spacing: 0.12em;
}
.cube-front strong {
  display: block;
  font: 800 86px/1 var(--font-body);
  letter-spacing: -0.06em;
  margin-top: 18px;
}
.cube-right {
  transform: rotateY(90deg) translateZ(90px);
  background: repeating-linear-gradient(90deg, #202020 0 19px, #444 20px 21px);
}
.cube-top {
  transform: rotateX(90deg) translateZ(90px);
  background: linear-gradient(135deg, #888, #222);
}
.faq {
  align-items: center;
  gap: 80px;
}
.faq h2 {
  font-size: 3.8rem;
}
.faq-sculpture {
  position: relative;
  height: 300px;
  perspective: 800px;
  transform-style: preserve-3d;
  display: grid;
  place-items: center;
  margin-top: 40px;
}
.faq-ring {
  position: absolute;
  width: 220px;
  height: 220px;
  border: 12px solid #333;
  border-radius: 50%;
  box-shadow:
    1px 2px 0 #aaa,
    inset 1px 2px #aaa,
    15px 20px 25px #000;
  transform: rotateY(45deg) rotateX(20deg);
}
.ring-b {
  transform: rotateY(65deg) rotateX(-25deg);
  width: 260px;
  height: 260px;
  border-width: 3px;
  animation: ring-turn 18s linear infinite;
}
.ring-c {
  transform: rotateY(-55deg) rotateX(40deg);
  width: 290px;
  height: 290px;
  border-width: 1px;
}
.faq-sculpture > span {
  font: 700 130px var(--font-body);
  text-shadow:
    2px 3px #777,
    5px 7px #333,
    12px 15px #111,
    25px 30px 30px #000;
  transform: translateZ(45px);
}
.finale {
  position: relative;
  text-align: center;
  margin-top: 140px;
  padding-block: 80px;
  perspective: 1200px;
  border-top: 1px solid var(--border-strong);
}
.finale-word {
  font: 800 clamp(4rem, 17vw, 15rem)/1 var(--font-body);
  letter-spacing: -0.08em;
  margin: 50px 0;
  transform: rotateX(18deg) rotateY(-8deg);
  background: linear-gradient(165deg, #fff, #999 50%, #333);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  filter: drop-shadow(2px 4px #333) drop-shadow(4px 8px #111);
  animation: finale-drift 10s ease-in-out infinite;
}
.footer {
  margin-top: 20px;
}
.motion-controls button {
  position: fixed;
  right: 24px;
  bottom: 20px;
  z-index: 30;
  background: #151515;
  box-shadow:
    0 4px 0 #080808,
    0 5px 0 #444,
    0 10px 25px #000;
}
.motion-controls {
  min-height: 45px;
}
.section,
.overview,
.finale {
  contain: style;
}
.spatial-inactive *,
.spatial-inactive *:before,
.spatial-inactive *:after {
  animation-play-state: paused !important;
}
@keyframes stack-float {
  0%,
  100% {
    transform: rotateX(50deg) rotateZ(-30deg) translateZ(0);
  }
  50% {
    transform: rotateX(50deg) rotateZ(-26deg) translateZ(18px);
  }
}
@keyframes object-hover {
  0%,
  100% {
    translate: 0 0;
  }
  50% {
    translate: 0 -18px;
  }
}
@keyframes node-drift {
  0%,
  100% {
    transform: rotateX(38deg) rotateZ(-20deg);
  }
  50% {
    transform: rotateX(48deg) rotateZ(-10deg);
  }
}
@keyframes vault-drift {
  0%,
  100% {
    transform: rotateY(-25deg) rotateX(15deg) rotateZ(5deg);
  }
  50% {
    transform: rotateY(-12deg) rotateX(8deg) rotateZ(0);
  }
}
@keyframes cinema-float {
  0%,
  100% {
    transform: rotateY(-28deg) rotateX(12deg);
  }
  50% {
    transform: rotateY(-16deg) rotateX(5deg) translateY(-12px);
  }
}
@keyframes cube-turn {
  0%,
  100% {
    transform: rotateX(-22deg) rotateY(-35deg);
  }
  50% {
    transform: rotateX(-12deg) rotateY(-55deg);
  }
}
@keyframes ring-turn {
  from {
    transform: rotateY(65deg) rotateX(-25deg) rotateZ(0);
  }
  to {
    transform: rotateY(65deg) rotateX(-25deg) rotateZ(360deg);
  }
}
@keyframes finale-drift {
  0%,
  100% {
    transform: rotateX(18deg) rotateY(-8deg);
  }
  50% {
    transform: rotateX(10deg) rotateY(3deg);
  }
}
@media (max-width: 1000px) {
  .feature {
    padding: 36px;
    gap: 30px;
  }
  .sculpture {
    scale: 0.85;
  }
  .feature h3 {
    font-size: 2.3rem;
  }
  .workspace-sculpture {
    scale: 0.85;
  }
  .preview-title h2 {
    font-size: 2rem;
  }
  .department-layout {
    gap: 35px;
  }
  .department-sculpture {
    scale: 0.85;
  }
  .format {
    padding: 28px;
  }
  .format-sculpture {
    scale: 0.85;
  }
  .format h3 {
    font-size: 1.8rem;
  }
  .faq {
    gap: 40px;
  }
}
@media (max-width: 700px) {
  .nav-shell {
    margin: 8px auto 0;
    width: calc(100% - 16px);
    top: 5px;
    border-radius: 14px;
  }
  .nav-inner {
    padding-inline: 14px;
  }
  .world-grid {
    background-size: 70px 70px;
    opacity: 0.3;
  }
  .world-orb {
    display: none;
  }
  .section {
    padding-top: 90px;
  }
  .section-heading h2 {
    font-size: 3.2rem;
  }
  .section-heading {
    margin-block: 35px;
  }
  .workspace-preview {
    grid-template-columns: 1fr;
  }
  .workspace-sculpture {
    grid-column: 1;
    grid-row: 2;
    height: 340px;
    scale: 0.78;
  }
  .preview-body {
    grid-column: 1;
    grid-row: 3;
    padding: 0 24px 32px;
  }
  .preview-foot {
    grid-row: 4;
  }
  .preview-title h2 {
    font-size: 2rem;
  }
  .system-grid {
    gap: 36px;
  }
  .feature {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 26px;
    min-height: 0;
  }
  .feature > .eyebrow {
    padding: 0;
    order: 0;
  }
  .sculpture {
    order: 1;
    min-height: 330px;
    width: 100%;
    scale: 0.85;
    margin: 0;
  }
  .feature h3 {
    order: 2;
    margin-top: 0;
    font-size: 2.1rem;
  }
  .feature > p {
    order: 3;
  }
  .feature > a {
    order: 4;
    margin-top: 18px;
  }
  .department-layout {
    gap: 35px;
  }
  .department-sculpture {
    height: 340px;
    margin-bottom: 15px;
    scale: 0.82;
  }
  .department-intro > h3 {
    font-size: 1.8rem;
  }
  .departments details[open] {
    transform: translateX(-3px);
  }
  .departments summary {
    padding: 22px;
    font-size: 1rem;
  }
  .departments details > div {
    padding: 0 22px 22px;
  }
  .formats {
    gap: 36px;
  }
  .format {
    min-height: 540px;
    padding: 26px;
  }
  .format-sculpture {
    height: 260px;
    scale: 0.85;
  }
  .format h3 {
    font-size: 2rem;
  }
  .faq h2 {
    font-size: 2.7rem;
  }
  .faq-sculpture {
    height: 260px;
    scale: 0.8;
    margin-top: 10px;
  }
  .finale {
    margin-top: 80px;
    padding-block: 55px;
  }
  .finale .eyebrow {
    font-size: 9px;
  }
  .finale-word {
    font-size: 19vw;
    margin-block: 35px;
  }
  .motion-controls button {
    right: 15px;
    bottom: 16px;
    font-size: 9px;
    min-height: 40px;
  }
  .footer {
    padding-bottom: 80px;
  }
  .stack-sheet,
  .desk-platform,
  .script-pages,
  .node-system,
  .vault,
  .cinema-frame,
  .cube,
  .faq-ring,
  .finale-word {
    animation-duration: 14s;
  }
  .feature:hover,
  .format:hover {
    transform: none;
  }
}
@media (max-width: 370px) {
  .sculpture {
    scale: 0.73;
    min-height: 300px;
  }
  .workspace-sculpture,
  .department-sculpture {
    scale: 0.7;
  }
  .format-sculpture {
    scale: 0.72;
  }
  .section-heading h2 {
    font-size: 2.8rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *:before,
  *:after {
    animation: none !important;
    transition: none !important;
  }
  .world-grid {
    transform: perspective(700px) rotateX(66deg) rotateZ(-18deg);
  }
  .departments details[open] {
    transform: none;
  }
}
@media (prefers-contrast: more) {
  .world {
    display: none;
  }
  .finale-word {
    color: var(--text);
    background: none;
  }
  .feature,
  .format,
  .departments details {
    background: var(--bg);
    border-color: var(--text);
  }
  .section-heading h2 {
    text-shadow: none;
  }
}
/* Keep decorative perspective geometry inside the page's horizontal stage. */
main {
  overflow: clip;
  padding-bottom: 50px;
}
@media (max-width: 700px) {
  .sculpture-floor {
    width: 290px;
    height: 290px;
    margin: -145px;
  }
  .scene-tilt {
    scale: 0.53;
  }
  .spatial {
    height: 450px;
  }
}
@media (max-width: 370px) {
  .scene-tilt {
    scale: 0.47;
  }
}
.finale {
  overflow: clip;
}