/* Aitoro, hero scrub: il toro si costruisce con le candele mentre scorri */
.hero{position:relative;height:560vh;background:var(--canvas-deep);color:#fff}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--canvas-deep)}
.stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 50%;opacity:0;transition:opacity .9s var(--ease-out);will-change:transform;transform:translateZ(0)}
.stage.video-ready video{opacity:1}
.stage.video-failed video{display:none}
.poster{position:absolute;inset:0;background-size:cover;background-position:62% 50%}
.scrim{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(10,8,18,.66) 0%,rgba(10,8,18,.42) 36%,rgba(10,8,18,0) 56%),radial-gradient(ellipse 120% 90% at 50% 45%,rgba(10,8,18,0) 35%,rgba(10,8,18,.62) 100%)}
.band{position:absolute;z-index:2;left:clamp(24px,6vw,96px);top:50%;transform:translateY(-50%);width:min(46vw,620px);opacity:0;text-shadow:var(--tshadow);pointer-events:none}
.cue,.ring{z-index:3}
.band.active{pointer-events:auto}
.band::before{content:"";position:absolute;inset:-22% -16%;pointer-events:none;z-index:-1;opacity:calc(.25 + .75 * var(--k,1));background:radial-gradient(ellipse 62% 72% at 42% 50%,rgba(8,6,16,.72) 0%,rgba(8,6,16,.48) 46%,rgba(8,6,16,0) 76%)}
.band .kicker{color:var(--accent-3);--kk:clamp(0,var(--k,0) * 3,1);opacity:var(--kk)}
.band .kicker::before{background:var(--accent-3)}
.band h1,.band .h{font-family:var(--display);font-weight:700;letter-spacing:-.02em;line-height:1.05;color:#fff;font-size:clamp(2rem,4.3vw,4rem);max-width:14ch;margin:0}
.band .h.small{font-size:clamp(1.6rem,3.2vw,2.8rem);max-width:18ch}
.band .sub{margin-top:18px;font-size:clamp(1rem,1.3vw,1.2rem);line-height:1.55;color:rgba(255,255,255,.88);max-width:44ch;--ks:clamp(0,(var(--k,0) - .55) * 3.5,1);opacity:var(--ks);transform:translateY(calc((1 - var(--ks)) * 12px))}
.band .ctas{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap;--kb:clamp(0,(var(--k,0) - .74) * 5,1);opacity:var(--kb);transform:translateY(calc((1 - var(--kb)) * 12px))}
.band .btn{text-shadow:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.w{display:inline-block;white-space:nowrap}
.c{display:inline-block}
[data-split=scatter] .c{--kc:clamp(0,(var(--k,0) - var(--th,0)) * 2.6,1);opacity:var(--kc);transform:translate(calc((1 - var(--kc)) * var(--jx,0px)),calc((1 - var(--kc)) * var(--jy,0px))) rotate(calc((1 - var(--kc)) * var(--jr,0deg)))}
[data-split=grid] .c{--kc:clamp(0,(var(--k,0) - var(--th,0)) * 2.6,1);opacity:var(--kc);transform:translateX(calc((1 - var(--kc)) * var(--jx,0px)))}
[data-split=punch] .w{--kc:clamp(0,(var(--k,0) - var(--th,0)) * 3,1);--ks:clamp(0,(var(--k,0) - var(--th,0) - var(--sd,.1)) * var(--ss,3.2),1);opacity:var(--kc);transform:scale(calc(.6 + (.4 + var(--ov,.12)) * var(--kc) - var(--ov,.12) * var(--ks)))}
[data-split=punch] .w.em{--ov:.24;--sd:.16;--ss:2.6}
[data-split=rise] .w{--kc:clamp(0,(var(--k,0) - var(--th,0)) * 2.8,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc)) * 22px))}
.ring{position:absolute;right:28px;bottom:30px;width:36px;height:36px;color:var(--accent-3);transform:rotate(-90deg);transition:opacity .6s var(--ease-out)}
.stage.video-ready .ring,.stage.video-failed .ring{opacity:0}
.cue{position:absolute;left:clamp(24px,6vw,96px);bottom:34px;display:inline-flex;align-items:center;gap:12px;padding:10px 16px;border-radius:10px;background:rgba(8,8,15,.55);border:1px solid rgba(96,96,126,.3);backdrop-filter:blur(10px);font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.85);text-shadow:0 1px 3px rgba(5,5,10,.85);transition:opacity .5s var(--ease-out)}
.cue.hide{opacity:0}
.cue svg{animation:cue-bob 2.2s var(--ease-in-out) -1s infinite alternate}
@keyframes cue-bob{from{transform:translateY(-2px)}to{transform:translateY(3px)}}
@media (max-height:560px){.cue{display:none}}
.hero-static{display:none}
.hero-static .pic{height:min(58svh,520px);mask-image:linear-gradient(180deg,#000 55%,transparent 100%);-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent 100%)}
.hero-static .pic img{width:100%;height:100%;object-fit:cover;object-position:68% 50%}
.hero-static .copy{padding:0 24px 56px;margin-top:-56px;position:relative}
.hero-static .kicker{color:var(--accent-3)}
.hero-static .kicker::before{background:var(--accent-3)}
.hero-static h1{color:#fff;font-size:clamp(2.1rem,8vw,3rem);max-width:14ch}
.hero-static p{margin-top:16px;color:rgba(255,255,255,.86);max-width:40ch;font-size:1.02rem}
.hero-static .ctas{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap}
@media (min-width:721px){.hero-static .copy{padding:0 48px 64px}}
/* i cinque gate: stesse stringhe in hero.js */
@media (max-width: 720px),(orientation: portrait) and (max-width: 1024px),(orientation: portrait) and (pointer: coarse),(orientation: landscape) and (pointer: coarse) and (max-height: 560px),(prefers-reduced-motion: reduce){
  .hero{height:auto;padding-top:var(--nav-h)}
  .stage{display:none}
  .hero-static{display:block}
}
