.home-test-page,
.home-philosophy-page {
  --home-test-blur: 0px;
  --home-test-overlay: 0;
  --home-test-hero-ui: 1;
}

.home-test-stage {
  position: relative;
  box-sizing: border-box;
  min-height: 400vh;
  min-height: 400dvh;
  padding-top: 100vh;
  padding-top: 100dvh;
  background: #151718;
}

.home-test-hero {
  position: fixed;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  min-height: 100vh;
  min-height: 100dvh;
  cursor: grab;
  touch-action: pan-y;
}

.home-test-hero.is-dragging { cursor: grabbing; user-select: none; }
.home-test-stage.is-exiting .home-test-hero {
  position: absolute;
  top: auto;
  bottom: 0;
}

.home-test-hero-slides,
.home-test-slide,
.home-test-blur,
.home-test-overlay {
  position: absolute;
  inset: 0;
}

.home-test-hero-slides {
  z-index: -3;
  overflow: hidden;
}

.home-test-slide {
  z-index: 1;
  opacity: 0;
  clip-path: inset(0 0 0 100%);
  transition: clip-path 1000ms cubic-bezier(1, 0, 0, 1), opacity 180ms ease;
}

.home-test-slide.active {
  z-index: 2;
  opacity: 1;
  clip-path: inset(0);
}

.home-test-slide.is-entering-right,
.home-test-slide.is-entering-left,
.home-test-slide.is-sweeping {
  z-index: 3;
  opacity: 1;
}

.home-test-slide.is-entering-right { clip-path: inset(0 0 0 100%); }
.home-test-slide.is-entering-left { clip-path: inset(0 100% 0 0); }
.home-test-slide.is-leaving { z-index: 2; opacity: 1; clip-path: inset(0); }
.home-test-slide picture { display: contents; }
.home-test-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 64% center;
}
.home-test-slide:nth-child(2) img { object-position: 55% 52%; }

.home-test-blur {
  z-index: -2;
  pointer-events: none;
  -webkit-backdrop-filter: blur(var(--home-test-blur));
  backdrop-filter: blur(var(--home-test-blur));
}

.home-test-overlay {
  z-index: -1;
  pointer-events: none;
  background: rgba(9, 13, 15, var(--home-test-overlay));
}

.home-test-page.no-backdrop-filter .home-test-slide img,
.home-philosophy-page.no-backdrop-filter .home-test-slide img {
  transform: scale(1.07);
  filter: blur(var(--home-test-blur));
}

.home-test-hero .hero-copy,
.home-test-hero .hero-pagination,
.home-test-hero .hero-side-message,
.home-test-hero .scrolldown2 {
  opacity: var(--home-test-hero-ui);
  transition: opacity 160ms linear;
}

.home-test-hero .hero-copy { pointer-events: none; }
.home-test-hero .hero-pagination { pointer-events: auto; }
.home-test-stage.is-philosophy-active .hero-pagination { pointer-events: none; }
.home-test-stage.is-philosophy-active .hero-pagination button.active::after { animation-play-state: paused; }

.top-about__wrapper {
  position: relative;
  z-index: 2;
  color: #fff;
}

.top-about__panel {
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: clamp(96px, 12vh, 140px) 24px clamp(68px, 9vh, 108px);
}

.top-about__content {
  width: min(100%, 920px);
  text-align: center;
  text-wrap: pretty;
}

.top-about__eyebrow {
  margin: 0 0 22px;
  font-size: clamp(.72rem, .85vw, .86rem);
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.top-about__title {
  margin: 0 0 clamp(30px, 4vh, 48px);
  font-size: clamp(1.65rem, 3vw, 3rem);
  font-weight: 500;
  line-height: 1.45;
  letter-spacing: 0;
}

.top-about__body {
  display: grid;
  gap: clamp(18px, 2.4vh, 30px);
  font-size: clamp(.9rem, 1.1vw, 1.05rem);
  line-height: 2.15;
}

.top-about__body p { margin: 0; }
.top-about__closing {
  margin-top: clamp(30px, 5vh, 58px) !important;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(1.25rem, 2.2vw, 2rem);
  font-style: italic;
  line-height: 1.5;
}

@media (max-width: 900px) {
  .home-test-page .home-header.is-philosophy-reading,
  .home-philosophy-page .home-header.is-philosophy-reading {
    border-bottom-color: rgba(255, 255, 255, .08);
    background: rgba(18, 21, 22, .72);
    color: #fff;
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
  }
  .home-test-slide img { object-position: 56% center; }
  .top-about__panel { padding-inline: 20px; }
  .top-about__content { width: min(100%, 720px); }
}

@media (max-width: 620px) {
  .top-about__panel {
    min-height: 100dvh;
    padding: 88px 18px 56px;
  }
  .top-about__eyebrow { margin-bottom: 14px; font-size: .66rem; }
  .top-about__title { margin-bottom: 24px; font-size: clamp(1.32rem, 6vw, 1.7rem); }
  .top-about__body { gap: 14px; font-size: clamp(.78rem, 3.45vw, .9rem); line-height: 1.9; }
  .top-about__closing { margin-top: 24px !important; font-size: 1.08rem; }
}

@media (max-width: 380px), (max-height: 720px) {
  .top-about__panel { padding-top: 78px; padding-bottom: 42px; }
  .top-about__title { margin-bottom: 18px; }
  .top-about__body { gap: 10px; font-size: .75rem; line-height: 1.72; }
  .top-about__closing { margin-top: 18px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .home-test-slide { transition: none; }
  .home-test-hero .hero-copy,
  .home-test-hero .hero-pagination,
  .home-test-hero .hero-side-message,
  .home-test-hero .scrolldown2 { transition: none; }
}
