/* Desktop full-page section height calibration.
   The wheel script jumps to .snap-section; this layer makes each destination read as one screen. */
@media (min-width: 901px) {
  :root {
    --pz-screen: calc(100vh - var(--nav-h, 74px));
  }

  html {
    scroll-padding-top: var(--nav-h, 74px) !important;
  }

  .snap-section {
    scroll-margin-top: var(--nav-h, 74px) !important;
  }

  .section,
  .services-section,
  .workshop-section,
  .industries-section,
  .certs-section,
  .contact-section {
    min-height: var(--pz-screen) !important;
    box-sizing: border-box;
  }

  .services-section,
  .workshop-section,
  .industries-section,
  .certs-section,
  .contact-section {
    padding-top: clamp(64px, 7vh, 92px) !important;
    padding-bottom: clamp(54px, 6vh, 82px) !important;
  }

  .section {
    padding-top: clamp(64px, 7vh, 92px) !important;
    padding-bottom: clamp(54px, 6vh, 82px) !important;
  }

  .services-section {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
  }

  .services-header {
    margin-bottom: clamp(22px, 3.2vh, 36px) !important;
  }

  .service-stage {
    height: clamp(360px, 42vh, 468px) !important;
    min-height: 360px !important;
    max-height: 468px !important;
  }

  .service-detail,
  .service-visual {
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
  }

  .service-tab {
    height: calc(clamp(360px, 42vh, 468px) / 7) !important;
  }

  .workshop-section {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
  }

  .workshop-header {
    margin-bottom: clamp(22px, 3.4vh, 38px) !important;
  }

  .workshop-grid {
    max-width: 1160px;
  }

  .workshop-card {
    min-height: clamp(172px, 20vh, 230px) !important;
  }

  .workshop-card.wide .workshop-img-half {
    min-height: clamp(172px, 20vh, 230px) !important;
  }

  .workshop-cta {
    min-height: clamp(92px, 12vh, 128px) !important;
    margin-top: clamp(24px, 3.5vh, 34px) !important;
  }

  .industries-section,
  .certs-section {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
  }

  .industry-strip {
    height: clamp(76px, 10vh, 96px) !important;
  }

  .industry-card {
    min-height: clamp(142px, 18vh, 178px) !important;
  }

  .key-project {
    margin-top: clamp(20px, 3vh, 30px) !important;
  }

  .certs-header {
    margin-bottom: clamp(26px, 4vh, 44px) !important;
  }

  .cert-card {
    min-height: clamp(138px, 17vh, 176px) !important;
  }

  .advantage-item {
    padding-top: clamp(20px, 3vh, 28px) !important;
    padding-bottom: clamp(20px, 3vh, 28px) !important;
  }

  .promise-band {
    min-height: clamp(88px, 12vh, 118px) !important;
    margin-top: clamp(28px, 4vh, 42px) !important;
  }

  .contact-section {
    padding-bottom: 0 !important;
    display: flex !important;
    flex-direction: column !important;
  }

  .contact-header {
    margin-bottom: clamp(26px, 4vh, 44px) !important;
  }

  .contact-layout {
    flex: 1 0 auto;
    align-items: stretch !important;
  }

  .contact-people,
  .contact-box {
    min-height: 0;
  }

  .final-slogan {
    margin-top: clamp(32px, 5vh, 48px) !important;
    padding-top: clamp(34px, 5vh, 50px) !important;
    padding-bottom: clamp(34px, 5vh, 50px) !important;
  }

  .site-footer {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
}

@media (min-width: 901px) and (max-height: 760px) {
  .services-section,
  .workshop-section,
  .industries-section,
  .certs-section,
  .contact-section,
  .section {
    padding-top: 48px !important;
    padding-bottom: 46px !important;
  }

  .service-stage {
    height: 342px !important;
    min-height: 342px !important;
  }

  .service-tab {
    height: calc(342px / 7) !important;
  }

  .workshop-card {
    min-height: 156px !important;
  }

  .industry-card,
  .cert-card {
    min-height: 132px !important;
  }
}
