/* Photo-led Hero: content follows the shared page gutters, not nav columns.
   Keep one permanent full-bleed photo and the opening's masthead clearance. */
body.home-floating-nav .hero{--hero-gutter:var(--page-left);--hero-notice-gutter:var(--section-right);min-height:100svh}
body.home-floating-nav .hero::before{background:linear-gradient(0deg,rgba(0,0,0,.4),transparent 64%),linear-gradient(90deg,rgba(0,0,0,.22),transparent 72%)}
body.home-floating-nav .hero .hero-copy{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,360px);
  align-items:end;column-gap:clamp(40px,6vw,112px);row-gap:36px;
  min-height:max(480px,calc(100svh - var(--home-hero-clearance)));
  padding:clamp(48px,10svh,120px) var(--hero-notice-gutter) clamp(80px,20svh,200px) var(--hero-gutter);
}
body.home-floating-nav .hero>.hero-opening-progress{left:var(--hero-gutter);right:var(--hero-notice-gutter)}
/* Keep its opening-animation completion signal, but no visible desktop rule. */
@media(min-width:1025px){
  body.home-floating-nav .hero>.hero-opening-progress{opacity:0}
}
.hero-intro{min-width:0;max-width:620px}
body.home-floating-nav .hero .hero-heading{margin:0}
body.home-floating-nav .hero .hero-line{font-size:clamp(36px,4.1vw,72px);line-height:1.08;letter-spacing:-.025em}
body.home-floating-nav .hero .hero-line+.hero-line{margin-top:0}
body.home-floating-nav .hero .hero-bottom{display:block;margin:28px 0 0;padding:0;border:0}
body.home-floating-nav .hero .hero-action{max-width:none}
body.home-floating-nav .hero .hero-membership-link{min-height:44px;margin:0;padding:12px 18px;gap:22px;border:1px solid rgba(255,255,255,.15);border-radius:6px;background:rgba(0,0,0,.52);color:#fff;font-size:14px;text-transform:none}
body.home-floating-nav .hero .hero-membership-link:hover{background:rgba(0,0,0,.72);border-color:rgba(255,255,255,.45)}
.hero-notice{display:grid;grid-template-columns:minmax(0,1fr) 88px;align-items:center;gap:16px;width:100%;padding:10px;border:1px solid rgba(255,255,255,.1);border-radius:14px;background:rgba(0,0,0,.58);color:#fff;box-shadow:0 6px 24px rgba(0,0,0,.12);text-decoration:none;transition:opacity .4s linear,transform .4s ease,background-color .2s ease}
.hero-notice-copy{display:grid;gap:10px;min-width:0;padding:4px 0 4px 6px}
/* Two levels only: a small event label, then one compact event summary.
   Scope above the later shared typography layer without overriding Settings. */
.hero .hero-notice .hero-notice-label{display:flex;align-items:center;gap:8px;font-size:var(--spa-type-label,.875rem);line-height:1.2;font-weight:400;letter-spacing:.04em;text-transform:uppercase;color:rgba(255,255,255,.9)}
.hero-notice-label::before{content:"";flex:0 0 5px;width:5px;height:5px;border-radius:50%;background:currentColor}
.hero .hero-notice .hero-notice-title{font-size:max(1rem,var(--spa-type-small,1rem));font-weight:400;line-height:1.35;letter-spacing:0;color:#fff;overflow-wrap:break-word}
.hero-notice-image{display:block;height:96px;overflow:hidden;border-radius:9px;background:rgba(255,255,255,.08)}
.hero-notice-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 38%}
.hero-notice:hover{background:rgba(0,0,0,.7)}
.hero-notice:hover .hero-notice-title{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.hero-notice:focus-visible{outline:2px solid #fff;outline-offset:5px}
.hero.is-text-animating:not(.hero-copy-visible) .hero-notice{opacity:0;transform:translateY(12px)}
/* Discover starts at 200ms and finishes at 600ms. Show the notice after it;
   keep background hover immediate and skip the queue outside the opening. */
@media(prefers-reduced-motion:no-preference){
  .hero.is-text-animating.hero-copy-visible .hero-notice{transition-delay:.7s,.7s,0s}
}
.hero.is-text-animating .hero-notice:focus-within{opacity:1;transform:none;transition:none}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .hero-notice{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:rgba(0,0,0,.48)}
  .hero-notice:hover{background:rgba(0,0,0,.62)}
}
@media(max-width:1100px){
  body.home-floating-nav .hero .hero-copy{grid-template-columns:minmax(0,1fr) minmax(260px,320px);column-gap:32px}
  .hero-notice{grid-template-columns:minmax(0,1fr) 72px;gap:12px}
}
/* Match the shared content/Settings gutter breakpoint, including tablets. */
@media(max-width:900px){
  body.home-floating-nav .hero{--hero-gutter:24px;--hero-notice-gutter:24px}
}
@media(max-width:760px){
  body.home-floating-nav .hero .hero-copy{grid-template-columns:minmax(0,1fr);align-content:end;min-height:calc(100svh - var(--home-hero-clearance));padding:64px var(--hero-gutter) 72px;row-gap:36px}
  body.home-floating-nav .hero .hero-line{font-size:clamp(36px,7vw,48px)}
  body.home-floating-nav .hero .hero-bottom{margin-top:24px}
  .hero-notice{max-width:360px;grid-template-columns:minmax(0,1fr) 80px}
}
@media(min-width:761px) and (max-height:700px){
  body.home-floating-nav .hero .hero-copy{min-height:calc(100svh - var(--home-hero-clearance));padding-top:20px;padding-bottom:clamp(44px,14svh,88px)}
  body.home-floating-nav .hero .hero-line{font-size:clamp(28px,6svh,42px)}
  body.home-floating-nav .hero .hero-bottom{margin-top:20px}
}
@media(prefers-reduced-motion:reduce){
  .hero.is-text-animating .hero-notice{opacity:1;transform:none;transition:none}
}
@media(prefers-reduced-transparency:reduce){
  .hero-notice{background:#1a1d20;-webkit-backdrop-filter:none;backdrop-filter:none}
}