/* Context-aware hero adaptation shared by the SPA and campaign route. */
.dr-page-hero {
  display: grid;
  align-content: center;
  min-height: clamp(300px, 38vw, 470px);
  padding-block: clamp(58px, 8vw, 96px) clamp(40px, 6vw, 68px) !important;
  padding-left: max(var(--gx), env(safe-area-inset-left)) !important;
  padding-right: max(var(--gx), env(safe-area-inset-right)) !important;
}
.dr-page-hero > span { align-self: end; }
.dr-page-hero > h1 {
  width: min(100%, 18ch);
  font-size: clamp(38px, 5vw, 64px) !important;
  line-height: 1.08 !important;
  letter-spacing: -.025em !important;
}
.dr-page-hero > p { width: min(100%, 68ch); color: #b9b9c0 !important; }

.dr-hero {
  min-height: min(860px, calc(100svh - 68px));
  padding-left: max(var(--gx), env(safe-area-inset-left)) !important;
  padding-right: max(var(--gx), env(safe-area-inset-right)) !important;
}
.dr-hero-copy { width: min(100%, 760px); }
.dr-hero-copy h1 { font-size: clamp(46px, 5.6vw, 76px) !important; }
.dr-hero-copy > div:not(:last-child) { gap: 12px !important; }

.dr-courses-hero { min-height: min(780px, calc(100svh - 68px)); }
.dr-courses-hero-copy {
  width: min(100%, 800px);
  max-width: 62%;
  padding: clamp(60px, 8vw, 96px) max(var(--gx), env(safe-area-inset-left));
}
.dr-courses-hero-copy h1 { font-size: clamp(48px, 6vw, 82px); letter-spacing: -.03em; }

.ncn-nav {
  padding-left: max(var(--gx), env(safe-area-inset-left));
  padding-right: max(var(--gx), env(safe-area-inset-right));
}
.ncn-hero { min-height: min(900px, 100svh); }
.ncn-hero-copy {
  width: min(62%, 760px);
  padding-left: max(var(--gx), env(safe-area-inset-left));
  padding-right: max(var(--gx), env(safe-area-inset-right));
}
.ncn-hero h1 { font-size: clamp(50px, 6.6vw, 88px); }

@media (min-width: 768px) and (max-width: 1023px) {
  .dr-page-hero { min-height: 360px; padding-block: 64px 50px !important; }
  .dr-page-hero > h1 { width: min(100%, 20ch); font-size: clamp(40px, 6vw, 56px) !important; }
  .dr-hero { min-height: min(780px, calc(100svh - 68px)); }
  .dr-hero-copy { width: min(62%, 650px); }
  .dr-hero-copy h1 { font-size: clamp(44px, 6.2vw, 62px) !important; }
  .dr-hero-photo img { object-position: 66% center; }
  .dr-courses-hero-copy { max-width: 68%; }
  .dr-courses-hero-copy h1 { font-size: clamp(48px, 7vw, 66px); }
  .ncn-hero-copy { width: min(68%, 680px); }
  .ncn-hero h1 { font-size: clamp(52px, 7.2vw, 70px); }
}

@media (max-width: 767px) {
  .dr-page-hero {
    min-height: auto;
    padding-top: clamp(46px, 13vw, 64px) !important;
    padding-bottom: clamp(34px, 10vw, 48px) !important;
  }
  .dr-page-hero > span { font-size: 11px !important; letter-spacing: .16em !important; }
  .dr-page-hero > h1 {
    width: 100%;
    font-size: clamp(34px, 10.5vw, 46px) !important;
    line-height: 1.13 !important;
    margin-top: 12px !important;
  }
  .dr-page-hero > p { font-size: 16px !important; line-height: 1.72 !important; margin-top: 16px !important; }

  .dr-hero {
    min-height: max(680px, calc(100svh - 64px));
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .dr-hero-copy { width: 100%; padding: 132px 0 48px !important; }
  .dr-hero-copy h1 { font-size: clamp(36px, 11.1vw, 50px) !important; line-height: 1.08 !important; }
  .dr-hero-copy > span { max-width: 100%; font-size: 11px !important; }
  .dr-hero-copy > div:not(:last-child) { display: grid !important; grid-template-columns: 1fr; width: 100%; }
  .dr-hero-copy button { width: 100%; min-height: 52px; }
  .dr-hero-photo img { object-position: 68% center; }

  .dr-courses-hero { min-height: max(680px, calc(100svh - 64px)); }
  .dr-courses-hero img { object-position: 64% center; }
  .dr-courses-hero-copy { width: 100%; max-width: none; padding: 120px max(var(--gx), env(safe-area-inset-left)) 48px; }
  .dr-courses-hero-copy h1 { font-size: clamp(42px, 12vw, 58px); line-height: 1.06; letter-spacing: -.025em; }
  .dr-courses-hero-copy p { font-size: 16px; line-height: 1.7; }
  .dr-courses-hero-copy button { width: 100%; min-height: 52px; }

  .ncn-nav { padding-top: max(17px, env(safe-area-inset-top)); }
  .ncn-hero { min-height: max(720px, 100svh); align-items: flex-end; }
  .ncn-hero-copy {
    width: 100%;
    padding-top: 124px;
    padding-right: max(22px, env(safe-area-inset-right));
    padding-bottom: max(76px, env(safe-area-inset-bottom));
    padding-left: max(22px, env(safe-area-inset-left));
  }
  .ncn-hero h1 { font-size: clamp(42px, 13vw, 58px); line-height: 1.08; }
  .ncn-hero-actions { display: grid; grid-template-columns: 1fr; width: 100%; }
  .ncn-btn { width: 100%; min-height: 52px; justify-content: space-between; }
  .ncn-sticky { bottom: max(12px, env(safe-area-inset-bottom)); }
}

@media (max-width: 360px) {
  .dr-page-hero > h1 { font-size: 32px !important; }
  .dr-hero-copy { padding-top: 112px !important; }
  .dr-hero-copy h1 { font-size: 35px !important; }
  .dr-courses-hero-copy h1 { font-size: 40px; }
  .ncn-hero h1 { font-size: 40px; }
}

@media (max-height: 560px) and (orientation: landscape) {
  .dr-hero, .dr-courses-hero, .ncn-hero { min-height: 560px; }
  .dr-hero-copy, .dr-courses-hero-copy, .ncn-hero-copy { padding-top: 96px !important; padding-bottom: 36px !important; }
  .dr-hero-copy h1, .dr-courses-hero-copy h1, .ncn-hero h1 { font-size: clamp(36px, 7vw, 52px) !important; }
}

@media (min-width: 1600px) {
  .dr-hero-copy, .dr-courses-hero-copy, .ncn-hero-copy { max-width: 800px; }
  .dr-page-hero { min-height: 440px; }
}

@media (pointer: coarse) {
  .dr-hero button, .dr-courses-hero button, .ncn-hero a { min-height: 52px; }
}
