/* Home hero: one still of the Bridge Street counter. Placeholder for the filmed scroll walk
   (parked in ../Parked/Scroll entrance/, to be revived once Sublime says yes). */

.entry{position:relative;isolation:isolate;margin-top:-72px;height:min(100svh,960px);min-height:560px;overflow:clip;background:var(--navy-deep);color:var(--cream)}
.entry-photo{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:42% 45%}
/* keeps the nav readable; covers the header strip only, never the shop */
.entry::before{content:"";position:absolute;z-index:-1;left:0;right:0;top:0;height:140px;background:linear-gradient(rgba(7,29,49,.7),rgba(7,29,49,0));pointer-events:none}

/* type sits on the dark iron gate, left of the counter */
.entry-copy{position:absolute;left:var(--gutter);top:50%;transform:translateY(-58%);max-width:min(24rem,26vw);text-shadow:0 2px 18px rgba(7,29,49,.85),0 1px 2px rgba(7,29,49,.9)}
.entry-copy .display{font-size:clamp(2.4rem,4.3vw,4.4rem);line-height:1.02;color:var(--cream);text-wrap:balance}
.entry-copy p{margin-top:16px;font-size:clamp(1.05rem,1.3vw,1.2rem);line-height:1.5;font-weight:600}
.entry-actions{position:absolute;left:var(--gutter);bottom:clamp(28px,7vh,72px);display:flex;flex-wrap:wrap;gap:10px}
.entry-actions .btn--ghost-cream{background:rgba(7,29,49,.6)}
.entry-actions .btn--ghost-cream:hover{background:var(--cream)}

@media (prefers-reduced-motion:no-preference){
  .entry-photo{animation:entry-settle 1.8s var(--ease) both}
  .entry-copy,.entry-actions{animation:entry-rise .9s var(--ease) .15s both}
  .entry-actions{animation-delay:.3s}
}
@keyframes entry-settle{from{scale:1.06}to{scale:1}}
@keyframes entry-rise{from{opacity:0;translate:0 20px}to{opacity:1;translate:0 0}}

/* header rides transparent over the photo */
body.home .site-head.over-entry{background:transparent;color:var(--cream)}
body.home .site-head.over-entry .logo .navy{opacity:0}
body.home .site-head.over-entry .logo .cream{opacity:1}
body.home .site-head.over-entry .cart:hover{background:var(--cream);border-color:var(--cream);color:var(--navy)}
body.home .site-head.over-entry.menu-open{background:var(--navy);transition:none}
.site-head.over-entry :focus-visible{outline-color:var(--cream)}

@media (max-width:767px){
  /* portrait crop keeps the timber ceiling on top: the name sits there, clear of the counter */
  .entry{height:100svh}
  .entry-copy{top:88px;right:var(--gutter);max-width:none;transform:none}
  .entry-copy .display{font-size:clamp(2.1rem,9.4vw,2.9rem)}
  .entry-actions{right:var(--gutter);bottom:max(20px,env(safe-area-inset-bottom))}
  .entry-actions .btn{flex:1}
}

/* the order builder keeps its hero scale now that the photo owns the h1 */
.hero-copy .display{font-size:clamp(2.5rem,4.7vw,4.25rem)}
#hero{scroll-margin-top:-12px} /* html scroll-padding is 84px, the header is 72px: land flush */

/* phones: the sticky buy bar waits until the photo hero has been scrolled, so it never covers the hero buttons */
.site-head.over-entry ~ main .buybar{display:none!important}
