/* DECEN REMAKE 0.4.21 — CANONICAL HOME HERO
   Single source of truth. No priority override. No fixed overlay. No legacy geometry. */

.home-page {
  position: relative;
  min-height: 0;
  margin-top: calc(-84px - var(--safe-top));
  padding: 0;
  overflow: visible;
}

.home-page > .motion-hero {
  --decen-hero-full-height: clamp(620px, 82svh, 940px);
  --decen-hero-current-height: var(--decen-hero-full-height);
  --decen-hero-media-shift: 0px;
  --decen-hero-copy-shift: 0px;
  position: relative;
  width: calc(100vw - var(--frame-left) - var(--frame-right));
  max-width: none;
  height: var(--decen-hero-current-height);
  min-height: 0;
  margin: 0 0 0 50%;
  padding: 0;
  transform: translateX(-50%);
  border-radius: 0 0 30px 30px;
  overflow: hidden;
  background: #d9d5cf;
  transition: none;
  will-change: height;
  overflow-anchor: none;
}

.home-page > .motion-hero .motion-hero-stage {
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: var(--decen-hero-full-height);
  min-height: 0;
  margin: 0;
  overflow: hidden;
  border-radius: inherit;
  isolation: isolate;
}

.home-page > .motion-hero .motion-hero-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
}

.home-page > .motion-hero .motion-hero-frame {
  display: block;
  object-fit: cover;
  object-position: center center;
  border-radius: inherit;
  background: #d9d5cf;
  transform: translate3d(0,var(--decen-hero-media-shift),0) scale(1.012);
  transform-origin: center center;
  will-change: transform;
}

.home-page > .motion-hero .motion-story {
  transform: translate3d(0,var(--decen-hero-copy-shift),0);
  will-change: transform;
}

.home-page > .motion-hero .motion-hero-veil {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(10,12,10,.10), rgba(10,12,10,.01) 31%, rgba(10,12,10,.02) 57%, rgba(10,12,10,.58));
}

.home-page > .motion-hero.local-scrub-ready {
  touch-action: pan-y;
  overscroll-behavior-y: auto;
}

.home-page > .motion-hero.local-scrub-ready.is-complete {
  touch-action: pan-y;
  overscroll-behavior-y: auto;
}

.home-page > .motion-hero.is-page-collapsed {
  height: 0;
  pointer-events: none;
  border-radius: 0;
}

.home-page > [data-home-sections] {
  position: relative;
  width: 100%;
  max-width: none;
  margin: 0;
  padding-top: 1px;
  background: var(--bg);
  overflow-anchor: none;
}

.home-page > [data-home-sections] > .section:first-child {
  margin-top: 24px;
}

/* 0.4.33 — entrance trial: stage slides in from the top while the first story
   line resolves from soft blur. Scrub geometry and story timing stay untouched. */
.home-page > .motion-hero .motion-hero-stage{
  opacity:1;
  transform:translate3d(0,0,0);
  transition:opacity .54s ease,transform .72s cubic-bezier(.2,.72,.2,1);
}
.home-page > .motion-hero.is-entering .motion-hero-stage{
  opacity:.28;
  transform:translate3d(0,-34px,0);
}
.home-page > .motion-hero.is-entered .motion-hero-stage{
  opacity:1;
  transform:translate3d(0,0,0);
}
.home-page > .motion-hero .motion-beat:first-child .eyebrow,
.home-page > .motion-hero .motion-beat:first-child h1,
.home-page > .motion-hero .motion-beat:first-child h2,
.home-page > .motion-hero .motion-beat:first-child p,
.home-page > .motion-hero .motion-beat:first-child .button-row{
  opacity:1;
  filter:blur(0);
  transform:translate3d(0,0,0);
  transition:opacity .62s ease .12s,filter .72s ease .12s,transform .72s cubic-bezier(.2,.72,.2,1) .12s;
}
.home-page > .motion-hero.is-entering .motion-beat:first-child .eyebrow,
.home-page > .motion-hero.is-entering .motion-beat:first-child h1,
.home-page > .motion-hero.is-entering .motion-beat:first-child h2,
.home-page > .motion-hero.is-entering .motion-beat:first-child p,
.home-page > .motion-hero.is-entering .motion-beat:first-child .button-row{
  opacity:0;
  filter:blur(10px);
  transform:translate3d(0,-12px,0);
}
.home-page > .motion-hero.is-entering .motion-progress,
.home-page > .motion-hero.is-entering .motion-hint{opacity:0;}
.home-page > .motion-hero .motion-progress,
.home-page > .motion-hero .motion-hint{transition:opacity .42s ease .22s;}

@media (max-width: 900px) {
  .home-page {
    margin-top: calc(-76px - var(--safe-top));
  }

  .home-page > .motion-hero {
    --decen-hero-full-height: clamp(430px, 66svh, 650px);
    width: calc(100vw - var(--frame-left) - var(--frame-right));
    border-radius: 0 0 24px 24px;
  }

  .home-page > [data-home-sections] > .section:first-child {
    margin-top: 20px;
  }

  /* Mobile scroll stays geometrically flat: no internal parallax competes with
     Safari's native pan while the physical Hero height expands/collapses. */
  .home-page > .motion-hero .motion-hero-frame,
  .home-page > .motion-hero .motion-story {
    transform: none;
    will-change: auto;
  }
}


@media (prefers-reduced-motion: reduce) {
  .home-page > .motion-hero .motion-hero-stage{transition:none;opacity:1;clip-path:none;}
  .home-page > .motion-hero .motion-hero-frame,
  .home-page > .motion-hero .motion-story {
    transform: none;
  }
}

/* 0.4.36 — cinematic first beat: depth settles before the story starts. */
.home-page > .motion-hero .motion-hero-frame{
  transform:translate3d(0,var(--decen-hero-media-shift,0),0) scale(1);
  filter:saturate(1) contrast(1);
  transition:transform .95s cubic-bezier(.16,.78,.18,1),filter .9s ease;
}
.home-page > .motion-hero.is-entering .motion-hero-frame{
  transform:translate3d(0,calc(var(--decen-hero-media-shift,0) - 22px),0) scale(1.045);
  filter:saturate(.84) contrast(.94) blur(3px);
}
.home-page > .motion-hero.is-entering .motion-beat:first-child h1,
.home-page > .motion-hero.is-entering .motion-beat:first-child h2{
  transform:translate3d(0,-22px,0) scale(.985);
  filter:blur(14px);
}
.home-page > .motion-hero .motion-beat:first-child h1,
.home-page > .motion-hero .motion-beat:first-child h2{
  transition:opacity .68s ease .14s,filter .9s ease .14s,transform .9s cubic-bezier(.16,.78,.18,1) .14s;
}


/* 0.4.39 — editorial depth pass. Scroll/scrub remains the proven native engine;
   only visual depth is enriched, so Safari gesture ownership is unchanged. */
.home-page>.motion-hero{--decen-hero-story-scale:1.028;--decen-hero-story-blur:1.6px;--decen-hero-story-veil:.58}
.home-page>.motion-hero .motion-hero-frame{transform:translate3d(0,var(--decen-hero-media-shift,0),0) scale(var(--decen-hero-story-scale));filter:blur(var(--decen-hero-story-blur)) saturate(1.02) contrast(1.015);transition:transform .18s linear,filter .18s linear}
.home-page>.motion-hero .motion-hero-veil{background:linear-gradient(180deg,rgba(10,12,10,.08),rgba(10,12,10,.01) 30%,rgba(10,12,10,.03) 58%,rgba(10,12,10,var(--decen-hero-story-veil)))}
.home-page>.motion-hero .motion-beat h1,.home-page>.motion-hero .motion-beat h2{letter-spacing:-.055em;text-wrap:balance}
.home-page>.motion-hero .motion-beat p{max-width:680px;text-wrap:pretty}
@media(max-width:900px){.home-page>.motion-hero .motion-hero-frame{transform:scale(var(--decen-hero-story-scale));filter:blur(var(--decen-hero-story-blur)) saturate(1.01)}}
@media(prefers-reduced-motion:reduce){.home-page>.motion-hero .motion-hero-frame{transform:none;filter:none}}