html.one-screen-root {
  scroll-padding-top: 0;
  scroll-snap-type: y proximity;
}

body.one-screen-site {
  overflow-x: clip;
}

.one-screen-site main > section {
  position: relative;
  scroll-snap-align: start;
  scroll-snap-stop: normal;
}

.one-screen-site main > .panel,
.one-screen-site main > .page-hero,
.one-screen-site main > .content-section,
.one-screen-site main > .contact-band {
  min-height: 100svh;
}

.one-screen-site main > .content-section,
.one-screen-site main > .contact-band {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.one-screen-site main > .content-section {
  padding-top: clamp(106px, 12vh, 144px);
  padding-bottom: clamp(76px, 9vh, 112px);
}

.one-screen-site main > .page-hero {
  min-height: 100svh !important;
}

.one-screen-site main > .home-stats {
  min-height: auto;
  scroll-snap-align: none;
  scroll-snap-stop: normal;
}

.one-screen-site main > .contact-band {
  padding-top: 110px;
  padding-bottom: 110px;
}

.one-screen-site .media-split__visual img {
  position: absolute;
  inset: 0;
}

.one-screen-site .media-split__visual:not(.media-split__visual--screen):not(.media-split__visual--contain) {
  height: 520px;
  min-height: 0;
}

.one-screen-site .media-split__visual--screen,
.one-screen-site .media-split__visual--contain {
  min-height: 0;
  align-self: center;
}

.one-screen-site .media-split__visual--screen {
  aspect-ratio: 16 / 9;
  background: #151b20;
}

.one-screen-site .media-split__visual--screen-wide {
  aspect-ratio: 963 / 523;
}

.one-screen-site .media-split__visual--contain {
  aspect-ratio: 1200 / 732;
}

.one-screen-site .media-split__visual--screen img,
.one-screen-site .media-split__visual--contain img {
  position: relative;
  inset: auto;
  display: block;
  height: auto;
  object-fit: contain;
}

.one-screen-site main > .content-section > .container,
.one-screen-site main > .contact-band > .container {
  width: var(--container);
  flex: 0 0 auto;
}

.one-screen-site .global-footer {
  min-height: min(520px, 72svh);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.screen-nav {
  position: fixed;
  z-index: 25;
  top: 50%;
  right: clamp(18px, 2vw, 34px);
  display: grid;
  gap: 13px;
  transform: translateY(-50%);
}

.screen-nav::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -18px;
  right: -10px;
  bottom: -18px;
  left: -10px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(15,18,20,.58);
  box-shadow: 0 12px 34px rgba(0,0,0,.12);
  backdrop-filter: blur(12px);
}

.screen-nav__item {
  position: relative;
  width: 30px;
  height: 18px;
  padding: 0;
  border: 0;
  color: #fff;
  background: transparent;
  cursor: pointer;
}

.screen-nav__item::before {
  content: "";
  position: absolute;
  top: 8px;
  right: 0;
  width: 10px;
  height: 2px;
  background: rgba(255,255,255,.45);
  transition: width 320ms cubic-bezier(.22,1,.36,1), background-color 240ms ease;
}

.screen-nav__item span {
  position: absolute;
  top: 50%;
  right: 42px;
  width: max-content;
  max-width: 190px;
  padding: 7px 10px;
  color: #fff;
  background: rgba(15,18,20,.86);
  font-size: 10px;
  letter-spacing: .08em;
  opacity: 0;
  pointer-events: none;
  transform: translate(8px,-50%);
  transition: opacity 220ms ease, transform 320ms cubic-bezier(.22,1,.36,1);
}

.screen-nav__item:hover::before,
.screen-nav__item:focus-visible::before,
.screen-nav__item.is-active::before {
  width: 26px;
  background: var(--orange);
}

.screen-nav__item:hover span,
.screen-nav__item:focus-visible span {
  opacity: 1;
  transform: translate(0,-50%);
}

.screen-nav__item:focus-visible {
  outline: 2px solid var(--orange);
  outline-offset: 4px;
}

.screen-progress {
  position: fixed;
  z-index: 24;
  right: clamp(18px, 2vw, 34px);
  bottom: 28px;
  display: flex;
  align-items: baseline;
  gap: 5px;
  color: rgba(255,255,255,.5);
  padding: 7px 10px;
  background: rgba(15,18,20,.72);
  backdrop-filter: blur(10px);
  font-size: 10px;
  letter-spacing: .12em;
  text-shadow: 0 1px 12px rgba(0,0,0,.5);
}

.screen-progress strong {
  color: var(--orange);
  font-size: 18px;
}

@media (max-height: 820px) and (min-width: 1101px) {
  .one-screen-site main > .content-section {
    padding-top: 96px;
    padding-bottom: 72px;
  }

  .one-screen-site .section-head { margin-bottom: 46px; }
}

@media (min-width: 1101px) {
  .one-screen-site .section-head {
    margin-bottom: clamp(34px, 5vh, 58px);
  }

  .one-screen-site .media-split__visual:not(.media-split__visual--screen):not(.media-split__visual--contain) {
    height: clamp(360px, 48vh, 500px);
  }

  .one-screen-site .product-card {
    min-height: clamp(430px, 53vh, 500px);
  }

  .one-screen-site .product-card__image {
    height: clamp(180px, 24vh, 230px);
  }

  .one-screen-site .case-card {
    min-height: clamp(390px, 52vh, 500px);
  }

  .one-screen-site .pain-card {
    min-height: clamp(190px, 24vh, 230px);
  }

  .one-screen-site .capability-card,
  .one-screen-site .capability-card__media {
    min-height: clamp(190px, 24vh, 230px);
  }
}

@media (max-width: 1100px) {
  html.one-screen-root {
    scroll-snap-type: none;
  }

  .one-screen-site main > section {
    min-height: auto;
    scroll-snap-align: none;
    scroll-snap-stop: normal;
  }

  .one-screen-site main > .panel,
  .one-screen-site main > .page-hero {
    min-height: max(720px, 100svh) !important;
  }

  .one-screen-site main > .content-section {
    display: block;
    padding-top: 92px;
    padding-bottom: 92px;
  }

  .one-screen-site .media-split__visual:not(.media-split__visual--screen):not(.media-split__visual--contain) {
    height: 420px;
  }

  .one-screen-site main > .contact-band { min-height: auto; }
  .screen-nav,
  .screen-progress { display: none; }
}

@media (max-width: 600px) {
  .one-screen-site .media-split__visual:not(.media-split__visual--screen):not(.media-split__visual--contain) {
    height: 300px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.one-screen-root { scroll-behavior: auto; }
  .screen-nav__item::before,
  .screen-nav__item span { transition: none; }
}