/* Premium typography and whitespace system. Loaded last by design. */

h1,
h2 {
  text-wrap: balance;
}

.hero.wrap {
  width: min(1280px, calc(100% - 64px));
  padding-top: clamp(86px, 8vw, 126px);
  padding-bottom: clamp(110px, 9vw, 154px);
}

.hero .eyebrow {
  margin-bottom: 0;
}

.hero h1 {
  width: min(100%, 1080px);
  margin: clamp(34px, 4vw, 54px) auto 0;
  font-size: clamp(64px, 5.7vw, 96px);
  line-height: 0.98;
  letter-spacing: -0.045em;
}

.hero > p {
  width: min(100%, 790px);
  margin: clamp(30px, 3.5vw, 44px) auto 0;
  color: #c6bbd4;
  font-size: clamp(18px, 1.25vw, 21px);
  font-weight: 500;
  line-height: 1.55;
  text-wrap: balance;
}

.hero .hero-actions {
  margin-top: clamp(34px, 4vw, 48px);
}

.hero .video-shell {
  margin-top: clamp(68px, 7vw, 94px);
}

.quality,
.problem,
.reality,
.clone.wrap,
.process {
  padding-top: clamp(92px, 8vw, 132px);
  padding-bottom: clamp(92px, 8vw, 132px);
}

.faq .wrap {
  padding-top: clamp(92px, 8vw, 132px);
  padding-bottom: clamp(92px, 8vw, 132px);
}

.quality > h2,
.problem > h2,
.reality > h2,
.clone.wrap > h2,
.process > h2,
.faq .wrap > h2,
.merged-outcomes > h2 {
  width: min(100%, 900px);
  margin: 0 auto;
  font-size: clamp(46px, 4.35vw, 68px);
  line-height: 1.03;
  letter-spacing: -0.038em;
}

.proof-strip h2 {
  width: min(100%, 780px);
  margin-right: auto;
  margin-left: auto;
  font-size: clamp(40px, 3.8vw, 56px);
  line-height: 1.04;
}

.quality > .eyebrow,
.problem > .eyebrow,
.reality > .eyebrow,
.clone.wrap > .eyebrow,
.process > .eyebrow,
.faq .wrap > .eyebrow {
  margin-bottom: clamp(22px, 2.4vw, 30px);
}

.quality > p,
.clone.wrap > .module-intro,
.process > .closing {
  width: min(100%, 720px);
  margin-right: auto;
  margin-left: auto;
  font-size: clamp(15px, 1.15vw, 18px);
  line-height: 1.6;
  text-wrap: balance;
}

.quality > p,
.clone.wrap > .module-intro {
  margin-top: clamp(22px, 2.5vw, 30px);
}

.quality .comparison,
.problem .problem-grid,
.reality .reality-list,
.process .process-grid {
  margin-top: clamp(44px, 5vw, 64px);
}

.clone .clone-grid {
  margin-top: clamp(42px, 5vw, 62px);
}

.faq .wrap > h2 {
  margin-bottom: clamp(42px, 5vw, 62px);
}

@media (max-width: 800px) {
  .hero.wrap {
    width: min(100% - 36px, 680px);
    padding-top: 72px;
    padding-bottom: 96px;
  }

  .hero h1 {
    width: min(100%, 620px);
    margin-top: 30px;
    font-size: clamp(48px, 12vw, 62px);
    line-height: 1;
    letter-spacing: -0.04em;
  }

  .hero > p {
    width: min(100%, 38ch);
    margin-top: 28px;
    font-size: 16px;
    line-height: 1.55;
  }

  .quality,
  .problem,
  .reality,
  .clone.wrap,
  .process,
  .faq .wrap {
    padding-top: 78px;
    padding-bottom: 78px;
  }

  .quality > h2,
  .problem > h2,
  .reality > h2,
.clone.wrap > h2,
.process > h2,
.faq .wrap > h2,
.merged-outcomes > h2 {
    width: min(100%, 620px);
    font-size: clamp(40px, 10.5vw, 52px);
    line-height: 1.04;
  }

  .proof-strip h2 {
    font-size: clamp(35px, 9vw, 46px);
  }
}

@media (max-width: 480px) {
  .hero.wrap {
    padding-top: 58px;
    padding-bottom: 82px;
  }

  .hero h1 {
    font-size: clamp(43px, 12.5vw, 54px);
  }

  .quality,
  .problem,
  .reality,
  .clone.wrap,
  .process,
  .faq .wrap {
    padding-top: 68px;
    padding-bottom: 68px;
  }
}