/* Hero ALBA Ripara: video reale che gira + «Che cosa si è rotto?» in vetro liquido sopra il video */
body.v28-final .premium-hero.hg{position:relative;overflow:hidden;padding:56px 0 64px!important}
.hg-grid{position:relative;z-index:2;display:grid!important;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:56px;align-items:center;
  width:min(1200px,calc(100% - 48px))!important;margin:0 auto!important}
.hg-copy{text-align:left}
.hg .premium-eyebrow{margin:0 0 18px!important;text-transform:uppercase}
.hg h1{font-size:clamp(44px,5.2vw,72px)!important;line-height:.96!important;letter-spacing:-.05em!important;margin:0 0 20px!important;color:#fff;text-align:left!important}
.hg .premium-text{max-width:470px!important;margin:0!important;text-align:left!important;font-size:18px!important;line-height:1.55!important}

/* tre numeri in vetro */
.hg-facts{list-style:none;margin:30px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-width:520px}
.hg-facts li{padding:14px 14px 12px;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.25);-webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px)}
.hg-facts strong{display:block;font-size:22px;line-height:1;color:#b7ff5a;letter-spacing:-.02em}
.hg-facts span{display:block;margin-top:6px;font-size:13px;line-height:1.35;color:rgba(243,248,241,.72)}

/* bandierina, discreta */
.it-flag{display:inline-block;width:16px;height:11px;margin-right:8px;vertical-align:-1px;border-radius:2px;
  background:linear-gradient(90deg,#009246 0 33.3%,#fff 33.3% 66.6%,#ce2b37 66.6%);box-shadow:0 0 0 1px rgba(255,255,255,.18)}

/* video */
.hg-media{margin:0;position:relative}
.hg-frame{position:relative;overflow:hidden;border-radius:34px;aspect-ratio:4/5;max-height:min(80vh,720px);margin-left:auto;
  box-shadow:0 40px 90px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,255,255,.1);background:#0b1711}
.hg-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
/* sfumatura in basso: i pulsanti di vetro restano leggibili su qualsiasi fotogramma */
.hg-frame::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(7,16,11,0) 42%,rgba(7,16,11,.35) 62%,rgba(7,16,11,.82) 100%)}

/* pannello: niente scatola, solo pulsanti di vetro che galleggiano sul video */
.hg-panel{position:absolute;left:14px;right:14px;bottom:14px;z-index:3}
.hg-pick{padding:0}
.hg-on .hg-pick{display:none}
.hg-ask{margin:0 0 10px!important;font-size:13px!important;font-weight:800!important;letter-spacing:.12em!important;text-transform:uppercase;
  color:#fff!important;text-align:center;text-shadow:0 1px 10px rgba(0,0,0,.45)}
.hg-chips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.hg-chip{position:relative;appearance:none;overflow:hidden;font:inherit;font-size:14.5px;font-weight:700;line-height:1.15;color:#fff;
  padding:12px 8px;border-radius:999px;cursor:pointer;text-align:center;white-space:normal;
  background:linear-gradient(180deg,rgba(255,255,255,.24),rgba(255,255,255,.08));
  border:1px solid rgba(255,255,255,.32);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -1px 0 rgba(255,255,255,.1),0 8px 22px rgba(0,0,0,.25);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  transition:transform .28s cubic-bezier(.2,.9,.25,1.15),background .2s,box-shadow .2s;-webkit-tap-highlight-color:transparent}
/* riflesso del vetro */
.hg-chip::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(120% 70% at 30% -10%,rgba(255,255,255,.45),transparent 55%)}
.hg-chip:hover{background:linear-gradient(180deg,rgba(255,255,255,.32),rgba(255,255,255,.12))}
.hg-chip:active{transform:scale(.94)}
.hg-chip[aria-pressed="true"]{background:linear-gradient(180deg,#d4ff8f,#b7ff5a);color:#07100b;border-color:rgba(255,255,255,.7)}
.hg-chip:focus-visible,.hg-close:focus-visible,.hg-go:focus-visible{outline:3px solid #b7ff5a;outline-offset:2px}

/* scheda del danno: lastra di vetro scuro */
.hg-sheet{position:relative;padding:20px 18px 16px;border-radius:28px;text-align:left;
  background:linear-gradient(180deg,rgba(20,32,25,.62),rgba(7,16,11,.78));
  border:1px solid rgba(255,255,255,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 24px 60px rgba(0,0,0,.45);
  -webkit-backdrop-filter:saturate(180%) blur(26px);backdrop-filter:saturate(180%) blur(26px);
  animation:hgUp .45s cubic-bezier(.2,.9,.25,1.1)}
.hg-sheet[hidden]{display:none}
.hg-card h2{margin:0 46px 6px 0!important;font-size:24px!important;line-height:1.1!important;letter-spacing:-.02em!important;color:#fff!important}
.hg-card p{margin:0!important;font-size:15px!important;line-height:1.45!important;color:rgba(243,248,241,.9)!important}
.hg-card .hg-time{margin-top:8px!important;font-size:14px!important;font-weight:700!important;color:#b7ff5a!important}
.hg-card .hg-time::before{content:"⏱ "}
.hg-price{margin:8px 0 12px!important;font-size:14px!important;line-height:1.4!important;color:rgba(243,248,241,.75)!important}
.hg-price strong{font-size:20px;color:#fff}
.hg-go{display:block;width:100%;text-align:center;font:inherit;cursor:pointer}
.hg-close{position:absolute;top:12px;right:12px;width:40px;height:40px;border-radius:50%;padding:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;color:#fff;font-size:24px;line-height:1;
  background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.3);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:transform .25s cubic-bezier(.2,.9,.25,1.15)}
.hg-close:active{transform:scale(.9)}
@keyframes hgUp{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}

.hg-strip{display:none}

/* ---------- telefono: titolo, video con i danni sopra, una riga sotto ---------- */
@media (max-width:860px){
  body.v28-final .premium-hero.hg{padding:14px 0 12px!important}
  .hg-grid{grid-template-columns:1fr;gap:12px;width:calc(100% - 20px)!important}
  .hg-copy{text-align:center}
  .hg .premium-eyebrow{display:none!important}
  .hg h1{font-size:31px!important;line-height:1.02!important;text-align:center!important;margin:0!important}
  .hg h1 br{display:none}
  .hg .premium-text,.hg-facts{display:none!important}
  .hg-frame{aspect-ratio:auto;width:100%;max-width:560px;height:calc(100svh - 200px);min-height:500px;max-height:780px;border-radius:30px;margin:0 auto}
  .hg-panel{left:10px;right:10px;bottom:10px}
  .hg-chips{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  .hg-chip{font-size:14px;padding:11px 6px;min-height:44px}
  /* ultima riga (2 danni) centrata */
  .hg-chip:nth-child(7){grid-column:1/2;margin-left:calc(50% + 3.5px);width:100%}
  .hg-chip:nth-child(8){grid-column:2/3;margin-left:calc(50% + 3.5px);width:100%}
  .hg-sheet{padding:18px 15px 14px;border-radius:26px}
  .hg-card h2{font-size:22px!important}
  .hg-strip{display:block;margin:10px 0 0!important;text-align:center;font-size:13px!important;font-weight:700;color:rgba(243,248,241,.78)!important}
}
@media (prefers-reduced-motion:reduce){.hg-sheet{animation:none}.hg-chip,.hg-close{transition:none}}
@media (prefers-reduced-transparency:reduce){.hg-chip,.hg-sheet,.hg-facts li{-webkit-backdrop-filter:none;backdrop-filter:none;background:#1a2620}}
.hg .premium-eyebrow::before{display:none!important}
@media (max-width:860px){.hg-chip{white-space:nowrap;font-size:13.5px;letter-spacing:-.01em;padding:11px 4px}}
@media (max-width:380px){.hg-chip{font-size:12.5px;letter-spacing:-.02em}}

/* ---------- «Tocca cosa si è rotto»: istruzione chiara + pulsanti che sembrano pulsanti ---------- */
.hg-ask{display:flex!important;flex-direction:column;align-items:center;gap:2px;margin:0 0 12px!important;letter-spacing:0!important;text-transform:none!important}
.hg-ask-main{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:999px;font-size:16px;font-weight:900;color:#07100b;
  background:linear-gradient(180deg,#d4ff8f,#b7ff5a);box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 8px 22px rgba(183,255,90,.35);text-shadow:none}
.hg-ask-hand{display:inline-block;animation:hgTap 1.6s ease-in-out infinite}
.hg-ask-sub{font-size:13px;font-weight:700;color:rgba(255,255,255,.9);text-shadow:0 1px 8px rgba(0,0,0,.6)}
@keyframes hgTap{0%,100%{transform:translateY(0)}50%{transform:translateY(3px)}}

/* vetro più scuro: più contrasto sul video chiaro, si capisce che sono pulsanti */
.hg-chip{background:linear-gradient(180deg,rgba(28,40,33,.62),rgba(7,16,11,.5))!important;border:1px solid rgba(255,255,255,.38)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 8px 20px rgba(0,0,0,.35)!important;font-weight:800}
.hg-chip::before{background:radial-gradient(120% 70% at 30% -10%,rgba(255,255,255,.3),transparent 55%)}
.hg-chip:hover{background:linear-gradient(180deg,rgba(40,58,47,.7),rgba(15,30,21,.6))!important;border-color:#b7ff5a!important}
.hg-chip[aria-pressed="true"]{background:linear-gradient(180deg,#d4ff8f,#b7ff5a)!important;color:#07100b}
/* riflesso che passa una volta sui pulsanti: «toccami» */
.hg-chip::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:50%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-18deg);
  animation:hgShine 1.1s ease-out 1.2s 2 both}
.hg-chip:nth-child(2)::after{animation-delay:1.3s}.hg-chip:nth-child(3)::after{animation-delay:1.4s}.hg-chip:nth-child(4)::after{animation-delay:1.5s}
.hg-chip:nth-child(5)::after{animation-delay:1.6s}.hg-chip:nth-child(6)::after{animation-delay:1.7s}.hg-chip:nth-child(7)::after{animation-delay:1.8s}.hg-chip:nth-child(8)::after{animation-delay:1.9s}
@keyframes hgShine{from{left:-60%}to{left:130%}}
@media (max-width:860px){.hg-ask-main{font-size:15px;padding:7px 14px}}
@media (prefers-reduced-motion:reduce){.hg-ask-hand,.hg-chip::after{animation:none}.hg-chip::after{display:none}}
/* la scritta verde sfumata tagliava le lettere con la gambetta (g, p): spazio sotto per le discendenti */
.hg h1 .hero-location{padding-bottom:.14em;margin-bottom:-.14em;line-height:1.05}