main {
  overflow: clip;
}

.hero {
  perspective: 1600px;
}

.hero-copy {
  position: relative;
  transform: translateZ(70px);
}

.hero-copy::after {
  content: "RESULTS";
  position: absolute;
  left: 4.5vw;
  bottom: 4.7rem;
  font: 800 clamp(5rem, 12vw, 12rem)/.75 var(--display);
  letter-spacing: -.08em;
  color: transparent;
  -webkit-text-stroke: 1px rgba(48,55,64,.08);
  transform: rotate(-5deg) translateZ(-30px);
  pointer-events: none;
  z-index: -1;
}

.hero-visual {
  transform: rotateY(-3deg) translateZ(20px) scale(1.02);
  transform-origin: left center;
  box-shadow: -35px 30px 80px rgba(48,55,64,.18);
}

.orbit-a { transform: translate(-50%,-50%) rotateX(62deg) rotateZ(15deg); }
.orbit-b { transform: translate(-50%,-50%) rotateX(68deg) rotateZ(-10deg); }

.signal-card {
  border: 1px solid rgba(48,55,64,.14);
  transition: margin .18s ease-out, transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease;
}

.signal-card:hover {
  box-shadow: 0 38px 85px rgba(5,8,12,.48);
}

.card-a { transform: rotate(-9deg) translateZ(95px) rotateY(8deg); }
.card-b { transform: rotate(8deg) translateZ(70px) rotateY(-10deg); }
.card-c { transform: rotate(5deg) translateZ(125px) rotateX(-4deg); }

.symptoms {
  position: relative;
  z-index: 5;
  width: calc(100% - 6vw);
  margin: -46px 3vw 0;
  background: rgba(247,247,243,.96);
  box-shadow: 0 28px 80px rgba(48,55,64,.12);
  border: 1px solid rgba(48,55,64,.1);
}

.symptom-grid {
  perspective: 1200px;
}

.symptom:nth-child(1), .symptom:nth-child(3) { transform: translateY(18px) rotateX(2deg); }
.symptom:nth-child(2), .symptom:nth-child(4) { transform: translateY(-12px) rotateX(-2deg); }
.symptom:hover { transform: translateY(-20px) rotateX(0) scale(1.025); box-shadow: 0 26px 48px rgba(48,55,64,.12); z-index: 3; }

.diagnostic {
  perspective: 1500px;
  padding-top: clamp(7rem,11vw,12rem);
  padding-bottom: clamp(8rem,12vw,13rem);
}

.diagnostic::after {
  content: "DIAGNOSE";
  position: absolute;
  left: -1.5vw;
  bottom: -0.08em;
  font: 800 clamp(6rem,16vw,16rem)/.7 var(--display);
  letter-spacing: -.08em;
  color: rgba(48,55,64,.075);
  pointer-events: none;
  z-index: -1;
}

.diagnostic-copy {
  position: relative;
  z-index: 3;
  transform: translateZ(55px);
}

.quiz {
  --rx: 3deg;
  --ry: -6deg;
  transform: translateY(56px) translateZ(85px) rotateX(var(--rx)) rotateY(var(--ry));
  transform-origin: left center;
  box-shadow: -24px 34px 0 rgba(48,55,64,.16), 0 50px 100px rgba(48,55,64,.22);
  border: 1px solid rgba(48,55,64,.13);
  transition: transform .16s ease-out, box-shadow .3s ease;
}

.quiz:hover {
  box-shadow: -12px 22px 0 rgba(48,55,64,.18), 0 70px 120px rgba(48,55,64,.27);
}

.method {
  position: relative;
  padding-top: clamp(10rem,15vw,16rem);
}

.method::before {
  content: "03";
  position: absolute;
  right: 3vw;
  top: 1.5rem;
  font: 800 clamp(8rem,20vw,20rem)/1 var(--display);
  letter-spacing: -.1em;
  color: transparent;
  -webkit-text-stroke: 1px rgba(48,55,64,.11);
  transform: rotate(6deg);
}

.method-steps article {
  position: relative;
  background: var(--paper);
}

.method-steps article:nth-child(2) {
  width: 94%;
  margin-left: 6%;
  transform: translateY(-10px) translateZ(30px);
  box-shadow: -22px 22px 45px rgba(48,55,64,.08);
  padding-left: 2rem;
  padding-right: 2rem;
}

.services {
  position: relative;
  isolation: isolate;
}

.services::before {
  content: "EXECUTE";
  position: absolute;
  right: -2vw;
  top: 4rem;
  font: 800 clamp(6rem,15vw,15rem)/1 var(--display);
  letter-spacing: -.09em;
  color: rgba(255,255,255,.035);
  transform: rotate(4deg);
  z-index: -1;
}

.service-list {
  perspective: 1400px;
}

.service {
  position: relative;
  background: var(--brand-blue);
}

.service:nth-child(1) { width: 96%; transform: translateX(4%) translateZ(70px); box-shadow: -28px 28px 60px rgba(0,0,0,.2); padding-left: 2rem; padding-right: 2rem; }
.service:nth-child(2) { width: 93%; transform: translateX(0) translateY(-5px) translateZ(35px); }
.service:nth-child(3) { width: 96%; transform: translateX(4%) translateY(-10px) translateZ(65px); box-shadow: -24px 24px 55px rgba(0,0,0,.18); padding-left: 2rem; padding-right: 2rem; }
.service:nth-child(4) { width: 93%; transform: translateY(-14px) translateZ(30px); }
.service:hover { transform: translateX(2%) translateZ(110px) scale(1.015); background: #363e48; }

.direct-options {
  transform: translateY(48px) translateZ(90px);
  box-shadow: 0 35px 80px rgba(0,0,0,.28);
}

.about {
  perspective: 1600px;
  padding-top: clamp(10rem,14vw,15rem);
}

.about-art {
  --rx: 1deg;
  --ry: 7deg;
  transform: rotateX(var(--rx)) rotateY(var(--ry)) rotateZ(-2deg) translateZ(70px);
  box-shadow: 30px 38px 0 rgba(48,55,64,.1), 0 55px 100px rgba(48,55,64,.18);
  transition: transform .16s ease-out, box-shadow .3s ease;
}

.about-copy {
  position: relative;
  z-index: 3;
  margin-left: -3vw;
  padding: 2.5rem;
  background: rgba(247,247,243,.88);
  backdrop-filter: blur(14px);
  box-shadow: 0 26px 70px rgba(48,55,64,.1);
  transform: translateZ(110px);
}

.final-cta {
  width: calc(100% - 6vw);
  margin: -42px 3vw 3vw;
  transform: translateZ(80px);
  box-shadow: 0 35px 100px rgba(48,55,64,.25);
}

@media (max-width: 900px) {
  .hero-copy, .hero-visual, .diagnostic-copy, .quiz, .about-art, .about-copy { transform: none; }
  .hero-visual { box-shadow: none; }
  .symptoms { width: 100%; margin: 0; border-left: 0; border-right: 0; }
  .symptom:nth-child(n) { transform: none; }
  .quiz { margin-bottom: 0; box-shadow: 12px 14px 0 rgba(48,55,64,.14); }
  .method-steps article:nth-child(2), .service:nth-child(n) { width: 100%; margin-left: 0; transform: none; padding-left: 0; padding-right: 0; box-shadow: none; }
  .direct-options { transform: none; }
  .about-copy { margin-left: 0; padding: 0; background: transparent; box-shadow: none; backdrop-filter: none; }
  .final-cta { width: 100%; margin: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-copy, .hero-visual, .signal-card, .symptom, .quiz, .method-steps article, .service, .direct-options, .about-art, .about-copy, .final-cta { transform: none !important; }
}
