/* Startseite v2 – nur auf index.html geladen */

.h-sec{padding:clamp(64px,9vw,128px) 0}
.h-paper{background:var(--paper); color:var(--ink)}
.h-paper .lead,.h-paper p,.h-paper li{color:var(--ink)}
.h-paper .btn{background:var(--paper2) !important; color:var(--ink) !important}
.h-paper .btn:hover{background:#dcd6c9 !important}
.h-paper .btn.primary{background:var(--red) !important; color:#fff !important}
.h-paper .btn.dark{background:var(--ink) !important; color:var(--paper) !important}
.h-red{background:var(--red); color:#fff}
.h-red p,.h-red .lead{color:#fff}
.h-head{display:flex; flex-direction:column; align-items:center; text-align:center; gap:18px; max-width:860px; margin:0 auto clamp(40px,5vw,72px)}
.h-head .lead{margin-left:auto !important; margin-right:auto !important}
.h-head .h-priceSwitch{justify-content:center}
.h-head h2{margin:0}
.h-head .lead{margin:0}


/* ---------- Hero (zentriert, ruhig) ---------- */
.h-hero{padding:clamp(48px,7vw,104px) 0 0}
.h-heroGrid{display:block}
.h-heroText{text-align:center; max-width:980px; margin:0 auto}
.h-hero h1{margin:0 auto; font-size:clamp(32px,10.4vw,88px); line-height:1; max-width:15ch; hyphens:manual}
.h-hero h1 em{font-style:normal; color:var(--red)}
.h-hero .lead{margin:24px auto 0; font-size:clamp(19px,1.7vw,24px); max-width:38ch}
.h-heroCtas{display:flex; flex-wrap:wrap; gap:10px; margin-top:32px; justify-content:center}
.h-heroFacts{display:flex; flex-wrap:wrap; justify-content:center; gap:8px 26px; margin:28px 0 0; padding:0; list-style:none; font-weight:600; font-size:16px; color:var(--soft)}
.h-heroFacts li::before{content:""; display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--red); margin-right:9px; vertical-align:2px}
/* Bühne: dieselbe Wand, das Setup wächst mit der Gästezahl */
.h-stage{background:var(--tile); border-radius:28px; overflow:hidden; display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1fr); max-width:1120px; margin:0 auto}
@media (max-width:900px){.h-stage{grid-template-columns:1fr}}
.h-stagePics{position:relative; aspect-ratio:4/5; background:#d9d6d0; overflow:hidden}
.h-stagePics img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.04); transition:opacity .55s var(--ease), transform 1.2s var(--ease)}
.h-stagePics img.on{opacity:1; transform:scale(1)}
.h-stageTag{position:absolute; left:16px; top:16px; background:var(--ink); color:var(--paper); border-radius:999px; padding:9px 16px; font-family:var(--f-display); font-size:18px; line-height:1}
.h-stagePrice{position:absolute; right:16px; bottom:16px; background:var(--red); color:#fff; border-radius:18px; padding:14px 18px 12px; text-align:right; line-height:1}
.h-stagePrice b{display:block; font-family:var(--f-display); font-weight:400; font-size:clamp(40px,4.4vw,64px); letter-spacing:-.02em}
.h-stagePrice span{display:block; font-weight:600; font-size:15px; margin-top:6px}
.h-stageCtl{padding:clamp(22px,3vw,40px); display:flex; flex-direction:column; justify-content:center; gap:22px}
.h-ctlRow{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap}
.h-ctlRow label,.h-ctlLabel{font-weight:700; font-size:17px}
.h-guests{font-family:var(--f-display); font-size:28px; line-height:1}
.h-range{width:100%; appearance:none; -webkit-appearance:none; height:44px; background:transparent; cursor:pointer; margin:0}
.h-range::-webkit-slider-runnable-track{height:10px; border-radius:99px; background:linear-gradient(var(--red),var(--red)) 0/var(--fill,30%) 100% no-repeat, #333}
.h-range::-moz-range-track{height:10px; border-radius:99px; background:#333}
.h-range::-moz-range-progress{height:10px; border-radius:99px; background:var(--red)}
.h-range::-webkit-slider-thumb{-webkit-appearance:none; width:30px; height:30px; margin-top:-10px; border-radius:50%; background:var(--paper); border:6px solid var(--red)}
.h-range::-moz-range-thumb{width:20px; height:20px; border-radius:50%; background:var(--paper); border:6px solid var(--red)}
.h-segs{position:relative; height:30px; margin-top:-4px}
.h-segs span{position:absolute; top:0; left:calc(var(--a) / 16 * 100%); width:calc((var(--b) - var(--a)) / 16 * 100% - 4px); border-top:4px solid #333; padding-top:6px; text-align:center; font-weight:700; font-size:14px; color:var(--soft); transition:color .2s, border-color .2s}
.h-segs span.on{color:var(--paper); border-color:var(--red)}
.h-seg{display:inline-flex; background:var(--ink); border-radius:999px; padding:4px}
.h-seg button{border:0; background:transparent; color:var(--paper); font:600 15px/1 var(--f-body); padding:11px 16px; border-radius:999px; cursor:pointer; min-height:40px}
.h-seg button[aria-pressed="true"]{background:var(--paper); color:var(--ink)}
.h-stageInc{margin:0; padding:0; list-style:none; display:flex; flex-wrap:wrap; gap:6px}
.h-stageInc li{background:var(--ink); border-radius:999px; padding:7px 12px; font-size:15px; font-weight:500}
.h-stageBtns{display:flex; gap:8px; flex-wrap:wrap}
.h-stageBtns .btn{flex:1 1 180px}
.h-stageNote{font-size:15px; color:var(--soft); margin:0}



/* ---------- Laufband ---------- */
.h-marquee{background:transparent; color:var(--soft); overflow:hidden; margin-top:clamp(40px,5vw,64px); padding:22px 0; white-space:nowrap}
.h-marqueeTrack{display:inline-flex; gap:0; animation:h-mq 60s linear infinite; will-change:transform}
.h-marqueeTrack span{font-family:var(--f-body); font-weight:700; font-size:clamp(18px,1.6vw,22px); line-height:1; padding-right:.9em}
.h-marqueeTrack span::after{content:"●"; font-size:.5em; vertical-align:.3em; padding-left:1.4em; color:var(--red)}
.h-marqueeTrack span{padding-right:1.4em}
@keyframes h-mq{to{transform:translateX(-50%)}}
.h-marquee:hover .h-marqueeTrack{animation-play-state:paused}

/* ---------- Pakete als Tickets ---------- */
.h-priceSwitch{display:flex; align-items:center; gap:14px; flex-wrap:wrap}
.h-paper .h-seg{background:var(--paper2)}
.h-paper .h-seg button{color:var(--ink)}
.h-paper .h-seg button[aria-pressed="true"]{background:var(--ink); color:var(--paper)}
.h-tickets{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:clamp(12px,1.6vw,20px)}
.h-tickets > *{grid-column:span 2}
.h-ticket{position:relative; display:grid; grid-template-rows:auto 1fr; background:#fff; color:var(--ink); border-radius:20px; overflow:hidden; transition:transform .25s var(--ease)}
.h-ticket:hover{transform:translateY(-6px) rotate(-.4deg)}
.h-ticket figure{margin:0; aspect-ratio:4/5; overflow:hidden; background:#d9d6d0}
.h-ticket img{display:block; width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease)}
.h-ticket:hover img{transform:scale(1.03)}
.h-ticketBody{position:relative; padding:26px 22px 22px; display:flex; flex-direction:column; gap:12px}
/* Abrisskante */
.h-ticketBody::before{content:""; position:absolute; left:18px; right:18px; top:0; border-top:3px dotted #cfc9bd}
.h-ticketBody::after{content:""; position:absolute; left:-14px; right:-14px; top:-14px; height:28px; background:radial-gradient(circle at 0 50%, var(--paper) 13px, transparent 14px) left/50% 100% no-repeat, radial-gradient(circle at 100% 50%, var(--paper) 13px, transparent 14px) right/50% 100% no-repeat; pointer-events:none}
.h-ticketTop{display:flex; justify-content:space-between; align-items:baseline; gap:10px}
.h-ticket h3{margin:0; font-size:clamp(24px,2.2vw,32px)}
.h-ticketFor{font-weight:700; font-size:15px; color:var(--soft-paper); white-space:nowrap}
.h-ticketPrice{display:flex; align-items:baseline; gap:8px}
.h-ticketPrice b{white-space:nowrap; font-family:var(--f-display); font-weight:400; font-size:clamp(46px,4.6vw,68px); line-height:.9; letter-spacing:-.02em; color:var(--red)}
.h-ticketPrice span{font-weight:700; font-size:16px}
.h-ticket ul{margin:0; padding-left:18px; font-size:16px; line-height:1.45}
.h-ticket .h-ticketUse{font-size:15px; color:var(--soft-paper); margin:0}
.h-ticket .btn{margin-top:auto; align-self:flex-start}
.h-ticket.is-dark{background:var(--ink); color:var(--paper)}
.h-ticket.is-dark .h-ticketBody::before{border-color:#3a3a3a}
.h-ticket.is-dark .h-ticketFor,.h-ticket.is-dark .h-ticketUse{color:var(--soft) !important}
.h-ticket.is-dark li,.h-ticket.is-dark p,.h-ticket.is-dark h3{color:var(--paper) !important}
.h-ticket.is-dark .btn{background:var(--tile) !important; color:var(--paper) !important}
.h-ticketLink{position:absolute; inset:0; z-index:1}
.h-ticket .btn{position:relative; z-index:2}
.h-pkgNote{margin:28px 0 0; font-size:16px; max-width:80ch}
@media (max-width:620px){
  .h-tickets{grid-template-columns:1fr}
  .h-ticket{grid-template-columns:40% 1fr; grid-template-rows:none}
  .h-ticketBody{padding:18px 16px}
  .h-ticketBody::before,.h-ticketBody::after{display:none}
  .h-ticket ul{display:none}
  .h-ticketTop{flex-direction:column; gap:4px}
  .h-ticketPrice b{font-size:38px; white-space:nowrap}
  .h-ticketPrice{flex-wrap:wrap; gap:4px 8px}
}

/* ---------- Ablauf: ein Verb pro Zeile ---------- */
.h-steps{display:grid; gap:0; counter-reset:st}
.h-step{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px 56px; align-items:center; padding:clamp(22px,3vw,40px) 0; border-top:2px solid #222}
.h-step h3{margin:0; font-size:clamp(44px,6.4vw,96px); line-height:.95; letter-spacing:-.02em}
.h-step h3::before{counter-increment:st; content:counter(st); font-family:var(--f-body); font-weight:700; font-size:.18em; color:var(--red); vertical-align:top; margin-right:.5em; position:relative; top:.5em}
.h-step p{margin:0; font-size:clamp(18px,1.4vw,21px); max-width:46ch}
@media (max-width:760px){.h-step{grid-template-columns:1fr}}

/* Lieferzonen */
.h-zones{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:clamp(40px,5vw,64px)}
.h-zone{background:var(--tile); border-radius:18px; padding:22px}
.h-zone.free{background:var(--red)}
.h-zone h3{margin:0 0 6px; font-size:22px}
.h-zone .z-price{font-family:var(--f-display); font-size:clamp(34px,3.2vw,46px); line-height:1; margin:10px 0 4px}
.h-zone .z-sub{font-weight:600; font-size:15px}
.h-zone p{margin:10px 0 0; font-size:16px}
.h-zone a{text-decoration:underline; text-decoration-color:currentColor}
.h-cities{display:flex; flex-wrap:wrap; gap:8px; margin-top:20px}
.h-cities a{background:var(--tile); border-radius:999px; padding:10px 16px; font-weight:600; font-size:15px}
.h-cities a:hover{background:var(--red)}
@media (max-width:900px){.h-zones{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.h-zones{grid-template-columns:1fr}}

/* ---------- Anlässe: Liste in einer Schriftgröße ---------- */
.h-lineup{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; column-gap:clamp(24px,4vw,64px)}
@media (max-width:760px){.h-lineup{grid-template-columns:1fr}}
.h-lineup li{border-top:2px solid #d6d0c4}
.h-lineup a{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:16px; align-items:center; padding:20px 0; border-radius:12px; transition:padding .3s var(--ease), background .2s, color .2s}
.h-lineup .l-name{font-family:var(--f-display); font-size:clamp(24px,2.6vw,38px); line-height:1.02; letter-spacing:-.02em}
.h-lineup .l-pkg{font-weight:700; font-size:clamp(15px,1.2vw,18px); text-align:right; white-space:nowrap}
.h-lineup .l-pkg::after{content:" →"}
.h-lineup a:hover,.h-lineup a:focus-visible{background:var(--red); color:#fff; padding-left:20px; padding-right:20px}
@media (max-width:620px){.h-lineup a{grid-template-columns:1fr; gap:2px}.h-lineup .l-pkg{text-align:left}}

/* ---------- Service mit Foto ---------- */
.h-split{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(28px,4vw,64px); align-items:center}
.h-split figure{margin:0; border-radius:22px; overflow:hidden; aspect-ratio:1/1; background:var(--tile)}
.h-split figure img{width:100%; height:100%; object-fit:cover}
.h-split figcaption{font-size:15px; color:var(--soft); margin-top:10px}
.h-split h2{margin-bottom:.35em}
.h-bigPrice{font-family:var(--f-display); font-size:clamp(54px,6vw,92px); line-height:.9; color:var(--red); margin:18px 0 6px; letter-spacing:-.02em}
.h-checks{list-style:none; padding:0; margin:22px 0 28px; display:grid; gap:10px}
.h-checks li{font-size:18px; padding-left:32px; position:relative}
.h-checks li::before{content:""; position:absolute; left:0; top:.38em; width:18px; height:10px; border-left:4px solid var(--red); border-bottom:4px solid var(--red); transform:rotate(-45deg)}
@media (max-width:860px){.h-split{grid-template-columns:1fr}}

/* ---------- Einzelgeräte: Leiste ---------- */
.h-gear{display:grid; grid-auto-flow:column; grid-auto-columns:minmax(220px,1fr); gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:12px; scrollbar-width:thin}
.h-gearItem{scroll-snap-align:start; background:#fff; border-radius:18px; padding:16px; display:flex; flex-direction:column; gap:6px; color:var(--ink); transition:transform .25s var(--ease)}
.h-gearItem:hover{transform:translateY(-4px)}
.h-gearItem img{width:100%; aspect-ratio:1/1; object-fit:contain; background:#f6f4ef; border-radius:12px; padding:10px}
.h-gearItem strong{font-size:17px; line-height:1.25; margin-top:8px}
.h-gearItem span{font-size:15px; color:var(--soft-paper)}
.h-gearItem b{font-family:var(--f-display); font-weight:400; font-size:30px; color:var(--red); margin-top:auto}
.h-gearItem b small{font-family:var(--f-body); font-weight:700; font-size:15px; color:var(--ink)}

/* ---------- Über uns ---------- */
.h-about{display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr); gap:clamp(28px,5vw,80px)}
.h-aboutText p{font-size:clamp(22px,2.2vw,32px); line-height:1.3; margin:0 0 .8em; font-weight:500}
.h-aboutText mark{background:var(--red); color:#fff; padding:0 .18em; border-radius:6px}
.h-figs{display:grid; gap:12px; align-content:start}
.h-fig{background:var(--tile); border-radius:18px; padding:22px}
.h-fig b{display:block; font-family:var(--f-display); font-weight:400; font-size:clamp(48px,5vw,72px); line-height:.95; color:var(--paper)}
.h-fig span{font-weight:600; font-size:17px}
@media (max-width:860px){.h-about{grid-template-columns:1fr}.h-figs{grid-template-columns:repeat(3,1fr)}}
@media (max-width:520px){.h-figs{grid-template-columns:1fr}}

/* ---------- FAQ als gefüllte Kacheln ---------- */
.h-faq{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; align-items:start}
.h-faq details{background:var(--paper2); color:var(--ink); border-radius:18px; padding:0; overflow:hidden; transition:background .25s var(--ease), color .25s var(--ease)}
.h-faq summary{color:inherit; list-style:none; padding:22px 60px 22px 22px; font-weight:700; font-size:clamp(18px,1.4vw,21px); line-height:1.3; position:relative}
.h-faq summary::-webkit-details-marker{display:none}
.h-faq summary::after{content:"+"; position:absolute; right:20px; top:50%; transform:translateY(-50%); width:32px; height:32px; border-radius:50%; background:var(--ink); color:var(--paper); display:grid; place-items:center; font-size:22px; line-height:1; transition:transform .25s var(--ease), background .2s}
.h-faq details[open]{background:var(--ink); color:var(--paper)}
.h-faq details[open] summary::after{content:"–"; background:var(--red); color:#fff}
.h-faq details p{margin:0; padding:0 22px 22px; font-size:17px; color:inherit !important}
@media (max-width:860px){.h-faq{grid-template-columns:1fr}}

/* ---------- Kontakt ---------- */
.h-contact{text-align:center}
.h-contact h2{font-size:clamp(40px,5.6vw,84px); max-width:18ch; margin-left:auto; margin-right:auto}
.h-contact .lead{margin:0 auto}
.h-contactMeta{justify-content:center}
.h-cTile{text-align:left}
.h-contactGrid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:clamp(32px,4vw,56px)}
.h-cTile{background:#fff; color:var(--ink); border-radius:18px; padding:22px; display:flex; flex-direction:column; gap:6px; transition:transform .25s var(--ease), background .2s}
.h-cTile:hover{transform:translateY(-4px)}
.h-cTile.dark{background:var(--ink); color:var(--paper)}
.h-cTile b{font-family:var(--f-display); font-weight:400; font-size:24px; line-height:1.05}
.h-cTile span{font-size:16px; font-weight:500}
.h-contactMeta{display:flex; flex-wrap:wrap; gap:8px 32px; margin-top:28px; font-weight:600; font-size:17px}
@media (max-width:900px){.h-contactGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.h-contactGrid{grid-template-columns:1fr}}

/* ---------- Auftritt beim Scrollen ---------- */
.js .h-in{opacity:0; transform:translateY(28px); transition:opacity .7s var(--ease), transform .7s var(--ease)}
.js .h-in.is-in{opacity:1; transform:none}
.js .h-in[data-d="1"]{transition-delay:.08s}
.js .h-in[data-d="2"]{transition-delay:.16s}
.js .h-in[data-d="3"]{transition-delay:.24s}
.js .h-in[data-d="4"]{transition-delay:.32s}
.js .h-in[data-d="5"]{transition-delay:.40s}
@media (prefers-reduced-motion: reduce){.js .h-in{opacity:1; transform:none}}


/* Bilder wachsen beim Hereinscrollen leicht (wie bei Produktseiten) */
.js .h-zoom{overflow:hidden}
.js .h-zoom img{transform:scale(1.12); transition:transform 1.4s var(--ease)}
.js .h-zoom.is-in img{transform:scale(1)}

.h-stageBtns .btn:not(.primary){background:var(--ink) !important}
@media (max-width:900px){
}

/* ---------- Hero: Paketreihe ---------- */
.h-lineupWrap{overflow:visible; margin-top:clamp(40px,5vw,72px); padding:0 var(--gutter)}
.h-hero{overflow:hidden}
.h-heroLineup{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:clamp(10px,1.4vw,20px); max-width:1360px; margin:0 auto; will-change:transform}
.h-lu{display:block; position:relative; color:var(--paper)}
.h-lu img{display:block; width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; border-radius:18px; background:#d9d6d0}
.h-lu span{display:block; margin-top:10px; font-size:16px; color:var(--soft)}
.h-lu span b{color:var(--paper); font-weight:700; margin-right:4px}
.h-lu:hover span b{color:var(--red)}
.sc-on .h-lu{transform:translateY(calc((1 - var(--p,1)) * var(--o,0px))) scale(calc(.94 + var(--p,1) * .06)); transition:transform .1s linear}
.h-lu[style*="--i:0"],.h-lu[style*="--i:4"]{--o:120px}
.h-lu[style*="--i:1"],.h-lu[style*="--i:3"]{--o:60px}
@media (max-width:760px){
  .h-lineupWrap{padding:0 16px; overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; scrollbar-width:none; -webkit-overflow-scrolling:touch}
  .h-lineupWrap::-webkit-scrollbar{display:none}
  .h-heroLineup{display:flex; gap:12px; width:max-content; max-width:none}
  .h-lu{width:58vw}
  .sc-on .h-lu{transform:none}
}

/* ---------- Bühnen-Abschnitt ---------- */
.h-stageSec{background:var(--ink)}
@media (max-width:900px){.h-stage{grid-template-columns:1fr; max-width:520px}}

/* ---------- Bewegung beim Scrollen ---------- */
.sc-on [data-sc=fade]{opacity:calc(1 - var(--p,0) * .85); transform:translateY(calc(var(--p,0) * -48px)) scale(calc(1 - var(--p,0) * .04))}
.sc-on [data-sc=slide] h3{transform:translateX(calc((1 - var(--p,1)) * -14vw)); opacity:calc(.2 + var(--p,1) * .8)}
.sc-on [data-sc=zoom] img{transform:scale(calc(1.18 - var(--p,1) * .18))}
.sc-on [data-sc=drift]{transform:translateX(calc((1 - var(--p,1)) * 180px))}
.sc-on [data-sc=stack] .h-fig:nth-child(2){transform:translateY(calc((1 - var(--p,1)) * 50px))}
.sc-on [data-sc=stack] .h-fig:nth-child(3){transform:translateY(calc((1 - var(--p,1)) * 100px))}
.sc-on [data-sc=slideX]{transform:translateX(calc((1 - var(--p,1)) * 25%)) translateY(.12em)}
#geraete{overflow:hidden}
.h-foot{overflow:hidden}

/* Tickets: 3 + 2 zentriert, Bilder immer vollständig (4:5 wie die Fotos) */
.h-tickets > :nth-child(4){grid-column:2 / span 2}
@media (max-width:980px){
  .h-tickets{grid-template-columns:repeat(2,minmax(0,1fr))}
  .h-tickets > *,.h-tickets > :nth-child(4){grid-column:auto}
}
@media (max-width:620px){
  .h-tickets{grid-template-columns:1fr}
  .h-ticket{align-items:start}
  .h-ticket figure{align-self:start; aspect-ratio:4/5; height:auto}
  .h-ticket img{height:100%}
}

/* Pfeile für das Paket-Karussell (nur am Handy sichtbar) */
.h-luNav{display:none}
@media (max-width:760px){
  .h-luNav{display:flex; justify-content:center; align-items:center; gap:12px; margin-top:14px}
  .h-luNav button{width:46px; height:46px; border-radius:50%; border:0; background:var(--tile); color:var(--paper); font-size:20px; line-height:1; cursor:pointer}
  .h-luNav button:active{background:var(--red)}
  .h-luNav span{font-size:14px; color:var(--soft); font-weight:600}
}

/* ---------- Bewertungen ---------- */
.h-revs{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(12px,1.6vw,20px); align-items:stretch}
.h-rev figcaption{margin-top:auto}
.h-rev{margin:0; background:#fff; color:var(--ink); border-radius:20px; padding:clamp(20px,2vw,28px); display:flex; flex-direction:column; gap:14px; transition:transform .25s var(--ease)}
.h-rev:hover{transform:translateY(-4px)}
.h-revStars{color:var(--red); font-size:20px; letter-spacing:3px; line-height:1}
.h-rev blockquote{margin:0; font-size:17px; line-height:1.55; color:var(--ink)}
.h-rev figcaption{font-weight:700; font-size:16px}
.h-rev figcaption span{font-weight:500; color:var(--soft-paper)}
.h-revFoot{display:flex; flex-direction:column; align-items:center; gap:12px; margin-top:clamp(28px,3vw,44px); text-align:center}
.h-revFoot p{margin:0; font-size:14px; color:var(--soft-paper); max-width:60ch}
@media (max-width:980px){.h-revs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){
  .h-revs{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:12px; padding-bottom:6px; scrollbar-width:none}
  .h-revs::-webkit-scrollbar{display:none}
  .h-rev{flex:0 0 84%; scroll-snap-align:start}
}