/* Corafter Phase 11 — full-viewport heroes, smoother page turns and safe long sections. */
:root {
  --cora-motion-duration: 680ms;
  --cora-motion-ease: cubic-bezier(.2, .72, .2, 1);
}

/* The navigation sits above the page; hero canvas fills the visible space beneath it. */
.page-hero,
.portfolio-hero,
.case-hero,
.article-hero,
.service-page .service-hero,
.home-scroll-stack > .rd-hero {
  min-height: 100vh;
  min-height: 100svh;
  scroll-margin-top: 0;
}

.page-hero,
.portfolio-hero,
.case-hero,
.article-hero {
  padding-top: var(--cora-header-offset, 92px);
  padding-bottom: clamp(36px, 6vh, 76px);
}

.home-scroll-stack > .rd-hero {
  height: 100vh;
  height: 100svh;
  padding-top: var(--cora-header-offset, 92px);
}

.home-scroll-stack > .rd-hero .hero-inner {
  min-height: calc(100vh - var(--cora-header-offset, 92px));
  min-height: calc(100svh - var(--cora-header-offset, 92px));
}

.service-page .service-hero {
  height: 100vh;
  height: 100svh;
  padding-top: var(--cora-header-offset, 92px);
}

.service-page .service-hero-grid {
  min-height: calc(100vh - var(--cora-header-offset, 92px));
  min-height: calc(100svh - var(--cora-header-offset, 92px));
  padding-top: clamp(20px, 3vh, 38px);
}

/* Stable stacking: stages create a scroll runway while the next opaque section covers the prior one. */
.page-turn-stage {
  position: relative;
  isolation: isolate;
  padding-bottom: 100svh;
  margin-bottom: -100svh;
}

.page-turn-stage > .page-turn-section {
  position: sticky;
  top: 0;
  z-index: var(--page-turn-z, 2);
  min-height: 0;
  scroll-margin-top: 0;
  isolation: isolate;
  backface-visibility: hidden;
}

.page-turn-stage > .page-turn-section:not(.page-hero):not(.portfolio-hero):not(.service-hero):not(.article-hero):not(.case-hero) {
  background-color: #fff;
}

/* Forms, long content, and small screens stay naturally scrollable and cannot trap the user. */
.page-turn-stage.is-natural-flow {
  padding-bottom: 0;
  margin-bottom: 0;
}

.page-turn-stage.is-natural-flow > .page-turn-section,
.page-turn-stage > .page-turn-section.page-turn-no-stack {
  position: relative;
  top: auto;
  min-height: 0;
  animation: none !important;
  transform: none !important;
  filter: none !important;
  will-change: auto;
}

/* Page-opening movement is intentionally short and restrained to avoid motion sickness. */
.page-turn-stage > .page-turn-section.page-turn-ready:not(.page-turn-no-stack) {
  animation: coraPageTurnOpen var(--cora-motion-duration) var(--cora-motion-ease) both;
}

@keyframes coraPageTurnOpen {
  0% { opacity: .86; transform: perspective(1600px) rotateX(1.4deg) translate3d(0, 20px, 0); }
  65% { opacity: 1; transform: perspective(1600px) rotateX(-.15deg) translate3d(0, -1px, 0); }
  100% { opacity: 1; transform: none; }
}

.page-turn-reveal {
  opacity: 0;
  transform: translate3d(0, 20px, 0);
  transition: opacity 620ms var(--cora-motion-ease), transform 620ms var(--cora-motion-ease);
  transition-delay: var(--page-turn-delay, 0ms);
}

.page-turn-reveal.page-turn-visible {
  opacity: 1;
  transform: none;
}

/* Keep keyboard focus and skip links visible above the visual layers. */
.skip-link:focus-visible,
.site-header a:focus-visible,
.site-header button:focus-visible,
main a:focus-visible,
main button:focus-visible,
main input:focus-visible,
main textarea:focus-visible,
main select:focus-visible {
  outline: 3px solid #66d9ff;
  outline-offset: 3px;
}

@media (max-width: 900px) {
  .home-scroll-stack > .rd-hero .hero-copy { width: min(78%, 650px); }
  .service-page .service-hero-grid > .service-hero-copy { width: min(78%, 690px); }
}

@media (max-width: 600px) {
  .page-hero,
  .portfolio-hero,
  .case-hero,
  .article-hero {
    min-height: 100vh;
    min-height: 100svh;
    padding-top: var(--cora-header-offset, 78px);
    padding-bottom: 36px;
  }

  .home-scroll-stack > .rd-hero {
    height: 100vh;
    height: 100svh;
    min-height: 100svh;
    padding-top: var(--cora-header-offset, 78px);
    padding-bottom: 34px;
  }

  .home-scroll-stack > .rd-hero .hero-inner {
    min-height: calc(100svh - var(--cora-header-offset, 78px));
  }

  .service-page .service-hero {
    height: 100vh;
    height: 100svh;
    min-height: 100svh;
  }

  .service-page .service-hero-grid {
    min-height: calc(100svh - var(--cora-header-offset, 78px));
  }

  .page-turn-stage,
  .page-turn-stage.is-natural-flow {
    padding-bottom: 0;
    margin-bottom: 0;
  }

  .page-turn-stage > .page-turn-section,
  .page-turn-stage.is-natural-flow > .page-turn-section {
    position: relative;
    top: auto;
    min-height: 0;
    animation: none !important;
    transform: none !important;
    filter: none !important;
    will-change: auto;
  }

  .page-turn-reveal,
  .page-turn-reveal.page-turn-visible {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  .page-turn-stage,
  .page-turn-stage.is-natural-flow { padding-bottom: 0; margin-bottom: 0; }
  .page-turn-stage > .page-turn-section,
  .page-turn-stage > .page-turn-section.page-turn-ready,
  .page-turn-stage > .page-turn-section.page-turn-no-stack {
    position: relative;
    top: auto;
    animation: none !important;
    transform: none !important;
    filter: none !important;
    will-change: auto;
  }
  .page-turn-reveal,
  .page-turn-reveal.page-turn-visible {
    opacity: 1;
    transform: none;
    transition: none !important;
  }
}