/* ARANCERI SCACCHI · sito 2027
   Colori del marchio: arancio Pantone Orange 021 C, nero, bianco. Niente altro. */

@font-face{font-family:"Inter Tight";src:url("../fonts/InterTight-var.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Tango Sans";src:url("../fonts/TangoSans.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Tango Sans";src:url("../fonts/TangoSansBold.woff2") format("woff2");font-weight:700;font-display:swap}

:root{
  --o:#FE5000; --k:#000; --w:#fff;
  /* colonna: il contenuto si ferma a 1600px, le fasce di colore restano a tutta larghezza */
  --wrap:2240px;
  --pad0:clamp(20px,4vw,88px);
  --pad:max(var(--pad0),calc(50vw - var(--wrap)/2));
  --vwc:min(1vw,calc((var(--wrap) + 128px)/100)); /* un vw che smette di crescere con la colonna */
  --bar:72px;
  --ease:cubic-bezier(.2,.8,.2,1);
  --snap:cubic-bezier(.7,0,.2,1);
  /* scala dei testi più contenuta (misure da club di corsa: Tracksmith) */
  --t-body:clamp(15px,1.02vw,18px);
  --t-lead:clamp(18px,1.45vw,23px);
  --t-display:clamp(32px,3.6vw,68px);
  --t-label:clamp(11px,.62vw,14px);
  --t-small:clamp(14px,.85vw,16px);
  --t-h3:clamp(17px,1.3vw,21px);
  --t-big:clamp(30px,3vw,56px);
  --t-poster:clamp(48px,8.4vw,150px);
  --sq:16px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--bar) + 8px)}
body{margin:0;background:var(--w);color:var(--k);font:400 var(--t-body)/1.5 "Inter Tight",system-ui,sans-serif;font-feature-settings:"ss01","cv11";overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
::selection{background:var(--o);color:var(--k)}
.skip{position:absolute;left:-999px;top:8px;background:var(--o);color:var(--k);padding:10px 14px;z-index:100;font-weight:700}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--o);outline-offset:3px}

/* ---------- elementi comuni ---------- */
.eyebrow{font:700 var(--t-label)/1 "Tango Sans",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--k);margin-bottom:clamp(18px,2vw,28px)}
.eyebrow--ink{color:var(--k)}
.eyebrow--orange{color:var(--o)}
.display{font-weight:650;font-size:var(--t-display);line-height:.98;letter-spacing:-.035em;text-wrap:balance}
.display--white{color:var(--w)}
.lead{font-size:var(--t-lead);line-height:1.22;letter-spacing:-.015em;font-weight:500;margin-bottom:.9em}
.sub{font:700 var(--t-label)/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.04em;margin:clamp(64px,8vw,120px) 0 28px;padding-top:20px;border-top:3px solid currentColor}
.sub--white{color:var(--w)}
.link{font-weight:600;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 2px no-repeat;padding-bottom:2px;transition:background-size .35s var(--ease)}
.link:hover{background-size:0 2px;background-position:100% 100%}
.link--white{color:var(--w)}
p + p{margin-top:.9em}

.btn{--bg:var(--k);--fg:var(--w);position:relative;display:inline-flex;align-items:center;gap:.6em;font:700 15px/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.04em;text-decoration:none;color:var(--fg);background:var(--bg);padding:16px 22px 15px;border:3px solid var(--k);transition:background .2s,color .2s}
.btn::after{content:"";width:.9em;height:.9em;background:currentColor;clip-path:polygon(0 40%,60% 40%,60% 10%,100% 50%,60% 90%,60% 60%,0 60%)}
.btn:hover{--bg:var(--w);--fg:var(--k)}
.btn:active{transform:translateY(2px)}
.btn--orange{--bg:var(--o);--fg:var(--k)}
.btn--big{font-size:clamp(17px,1.4vw,20px);padding:24px 34px 22px;--bg:var(--o);--fg:var(--k);box-shadow:8px 8px 0 var(--k)}
.btn--big{transition:transform .18s var(--ease),box-shadow .18s var(--ease)}
.btn--big:hover{--bg:var(--o);--fg:var(--k);transform:translate(-3px,-3px);box-shadow:11px 11px 0 var(--k)}

/* fascia a scacchi, come la casacca */
.checks{height:calc(var(--sq)*2);background:conic-gradient(var(--k) 25%,var(--w) 0 50%,var(--k) 0 75%,var(--w) 0) 0 0/calc(var(--sq)*2) calc(var(--sq)*2);background-position-x:var(--shift,0px)}
.checks--orange{background-image:conic-gradient(var(--o) 25%,var(--k) 0 50%,var(--o) 0 75%,var(--k) 0)}
.checks--dark{background-image:conic-gradient(var(--w) 25%,var(--k) 0 50%,var(--w) 0 75%,var(--k) 0)}

/* comparsa allo scroll */
.js [data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0s)}
.js [data-reveal].in{opacity:1;transform:none}

.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sr-only:focus{position:absolute;width:auto;height:auto;clip:auto;z-index:6;left:var(--pad);top:20px;background:var(--o);border:3px solid var(--k);padding:10px 14px;font:700 13px/1 "Tango Sans",sans-serif;text-transform:uppercase}

/* ---------- 01 · HEADER ---------- */
.bar{position:sticky;top:0;z-index:50;height:var(--bar);background:var(--k);color:var(--w);display:flex;align-items:center;gap:24px;padding:0 var(--pad)}
.bar__home{display:flex;align-items:center;gap:14px;text-decoration:none}
.bar__home img{width:auto;height:44px;transition:transform .5s var(--ease)}
.bar__home:hover img{transform:rotate(-8deg) scale(1.06)}
.bar__home span{font:700 var(--t-small)/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.04em;opacity:0;transform:translateX(-8px);transition:.4s var(--ease)}
.bar.is-scrolled .bar__home span{opacity:1;transform:none}
.bar__nav{margin-left:auto;display:flex;gap:clamp(14px,2vw,30px)}
.bar__nav a{position:relative;font-size:var(--t-small);font-weight:500;text-decoration:none;padding:13px 0}
.bar__nav a::after{content:"";position:absolute;left:0;right:0;bottom:7px;height:3px;background:var(--o);transform:scaleX(0);transform-origin:right;transition:transform .35s var(--ease)}
.bar__nav a:hover::after,.bar__nav a[aria-current]::after{transform:scaleX(1);transform-origin:left}
.bar__cta{min-height:44px;padding:11px 16px 10px;font-size:13px;box-shadow:none;border-color:var(--o)}
.bar__cta:hover{box-shadow:none;transform:none;background:var(--w);border-color:var(--w)}
.bar__cta::after{display:none}
.burger{display:none;margin-left:auto;width:48px;height:48px;background:none;border:0;padding:12px;cursor:pointer}
.burger span{display:block;height:3px;background:var(--w);transition:transform .35s var(--ease)}
.burger span+span{margin-top:8px}
.burger[aria-expanded="true"] span:first-child{transform:translateY(5.5px) rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{transform:translateY(-5.5px) rotate(-45deg)}

/* ---------- 02 · HERO ---------- */
.hero{position:relative;padding:clamp(28px,3.4vw,48px) var(--pad) 0}
.hero__name{display:block;font-weight:500;line-height:.8;letter-spacing:-.045em;margin:0 0 0 -.04em}
.fit{display:block;white-space:nowrap;font-size:calc(18.6 * var(--vwc))}
.fit--light{font-weight:520}
.fit--bold{font-weight:760;letter-spacing:-.05em;margin-top:.02em}
.fit .ch{display:inline-block;transition:transform 1s var(--snap);transition-delay:var(--d)}
.fit .ch-wrap{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.02em;margin-bottom:-.02em}
.js body:not(.is-ready) .fit .ch{transform:translateY(105%)}
.hero__since{display:flex;justify-content:space-between;align-items:baseline;margin-top:clamp(10px,1.4vw,20px);border-top:3px solid var(--k);padding-top:12px}
.hero__since span{font:700 var(--t-label)/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.08em}
.hero__since b{font-weight:600;font-size:var(--t-h3);letter-spacing:-.02em;line-height:1}
.hero__marks{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:clamp(28px,4vw,56px) 0 0;position:relative;z-index:5;pointer-events:none}
.hero__marks .badges{pointer-events:auto}
.badges{display:flex;gap:clamp(6px,.7vw,10px)}
.badges li{width:clamp(44px,3.6vw,64px);transition:transform .9s cubic-bezier(.3,1.6,.4,1);transition-delay:calc(.9s + var(--i)*.09s)}
.badges li:nth-child(1){--i:0}.badges li:nth-child(2){--i:1}.badges li:nth-child(3){--i:2}.badges li:nth-child(4){--i:3}
.js .badges li{transform:scale(0) rotate(-120deg)}
.js.is-ready .badges li,.is-ready .badges li{transform:none}
.badges li:hover{transform:rotate(14deg) scale(1.08);transition-delay:0s;transition-duration:.4s}
.hero__values{width:clamp(170px,15vw,260px);transition:1s var(--ease) 1.2s}
.js body:not(.is-ready) .hero__values{opacity:0;transform:translateY(10px)}
.is-ready .hero__values{opacity:1;transform:none}

.hero__piazza{position:relative;--bleed:max(0px,calc(var(--pad0)*2 - var(--pad)));margin:calc(-11 * var(--vwc)) calc(var(--bleed) * -1) 0;width:calc(100% + var(--bleed)*2);height:clamp(520px,calc(82 * var(--vwc)),max(560px,calc(100vh + 160px)));overflow:hidden}
.piazza__ink{position:absolute;inset:0;background:var(--k);-webkit-mask:url("../img/foto-piazza.png") 38% 0/112% auto no-repeat;mask:url("../img/foto-piazza.png") 38% 0/112% auto no-repeat;transform:scale(1.06);transition:transform 2.4s var(--ease)}
.is-ready .piazza__ink{transform:none}
.piazza__tiles{position:absolute;inset:0;display:grid;grid-template-columns:repeat(var(--cols,12),1fr);pointer-events:none}
.piazza__tiles i{background:var(--w);transition:transform .7s var(--snap);transition-delay:var(--d)}
.piazza__tiles i.k{background:var(--k)}
.is-ready .piazza__tiles i{transform:scale(0)}
.piazza__hint{position:absolute;top:calc(11 * var(--vwc) + 20px);right:var(--bleed);display:flex;align-items:center;gap:10px;font:700 12px/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.08em;opacity:0;transition:opacity .6s 2.2s}
.is-ready .piazza__hint{opacity:1}
.piazza__hint .dot{width:14px;height:14px;border-radius:50%;background:var(--o);border:2px solid var(--k);animation:bob 1.4s ease-in-out infinite}
.has-thrown .piazza__hint{opacity:0;transition-delay:0s}
.piazza__score{position:absolute;top:calc(11 * var(--vwc) + 20px);right:var(--bleed);font:700 12px/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.08em;background:var(--o);border:2px solid var(--k);padding:9px 12px 8px}
.piazza__score b{font-size:var(--t-small);margin-left:6px}
@keyframes bob{50%{transform:translateY(-4px)}}

.arancia{position:absolute;left:0;top:0;width:var(--s,46px);height:var(--s,46px);margin:calc(var(--s,46px)/-2) 0 0 calc(var(--s,46px)/-2);pointer-events:none;z-index:4}
.arancia::before{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 34% 30%,var(--o) 0 99%);border:3px solid var(--k)}
.arancia::after{content:"";position:absolute;width:30%;height:16%;top:-4%;left:46%;background:var(--k);border-radius:0 100% 0 100%;transform:rotate(-20deg)}
.splat{position:absolute;left:0;top:0;width:var(--s,150px);height:var(--s,150px);margin:calc(var(--s,150px)/-2) 0 0 calc(var(--s,150px)/-2);pointer-events:none;z-index:3;overflow:visible}
.splat path{fill:var(--o)}
.splat path.blob{stroke:var(--k);stroke-width:3;vector-effect:non-scaling-stroke}

.count{position:relative;z-index:5;margin:0 calc(var(--pad) * -1);background:var(--o);padding:clamp(22px,2.6vw,40px) var(--pad);display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:14px clamp(24px,4vw,64px);cursor:default}
.is-ready .count{opacity:1;transform:none}
.count__label{grid-column:1/-1;font:700 var(--t-label)/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.08em}
.count__nums{display:flex;gap:clamp(14px,2vw,28px)}
.count__nums span{display:flex;flex-direction:column}
.count__nums b{font:700 var(--t-big)/.85 "Tango Sans",sans-serif;letter-spacing:0;white-space:nowrap}
.count__nums .dg{display:inline-block;width:.74em;text-align:center}
.count__nums i{font-style:normal;font-size:var(--t-label);font-weight:600;text-transform:uppercase;letter-spacing:.06em;margin-top:6px}
.count__live{display:none;font:700 var(--t-big)/1 "Tango Sans",sans-serif;text-transform:uppercase}
.count[data-state="live"] .count__nums{display:none}
.count[data-state="live"] .count__live{display:block}
.count[data-state="ended"] .count__nums,.count[data-state="ended"] .count__label{display:none}
.count__date{font-weight:600;font-size:var(--t-lead);letter-spacing:-.015em;line-height:1.1;align-self:end;padding-bottom:6px}
.count .btn{--bg:var(--k);--fg:var(--w)}
.count .btn:hover{--bg:var(--w);--fg:var(--k)}



/* ---------- 03 · CHI SIAMO ---------- */
.chi{padding:clamp(80px,10vw,150px) var(--pad) clamp(70px,8vw,120px)}
.chi__grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(30px,6vw,96px);align-items:start}
.chi__text{padding-top:10px}
.chi__text .link{display:inline-block;margin-top:24px}
.values{margin-top:clamp(60px,8vw,120px)}
.values img{width:100%}

.numbers{background:var(--k);color:var(--w);padding:clamp(56px,6vw,90px) var(--pad)}
.numbers ul{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,48px)}
.numbers li{border-top:3px solid var(--o);padding-top:18px}
.numbers li:nth-child(2){--d:.08s}.numbers li:nth-child(3){--d:.16s}.numbers li:nth-child(4){--d:.24s}
.numbers b{display:block;font:700 var(--t-big)/.9 "Tango Sans",sans-serif;color:var(--o);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.numbers span{display:block;margin-top:12px;font-size:var(--t-small);line-height:1.35;max-width:22ch}

/* ---------- 04 · STORIA ---------- */
.storia{background:var(--o);color:var(--k);position:relative}
.storia__photo{height:clamp(240px,40vw,560px);background:var(--k);-webkit-mask:url("../img/foto-piazza.png") 50% 92%/cover no-repeat;mask:url("../img/foto-piazza.png") 50% 92%/cover no-repeat}
.storia__in{padding:clamp(56px,7vw,110px) var(--pad) clamp(80px,9vw,140px)}
.storia__top{display:grid;grid-template-columns:7fr 5fr;gap:clamp(30px,6vw,96px);align-items:start}
.storia .display{max-width:13ch}
.storia__body{columns:2;column-gap:clamp(30px,4vw,64px);margin-top:clamp(36px,4vw,56px);max-width:1180px}
.storia__body p{break-inside:avoid}
.timeline{display:grid;grid-template-columns:repeat(3,1fr);margin-top:clamp(64px,8vw,120px);border-top:3px solid var(--k)}
.timeline li{padding:22px clamp(12px,1.4vw,22px) 0 0;position:relative}
.timeline li::before{content:"";position:absolute;top:-10px;left:0;width:17px;height:17px;background:var(--k);border:3px solid var(--o);box-shadow:0 0 0 3px var(--k)}
.timeline li:nth-child(2){--d:.08s}.timeline li:nth-child(3){--d:.16s}.timeline li:nth-child(4){--d:.24s}.timeline li:nth-child(5){--d:.32s}
.timeline b{display:block;font:700 var(--t-big)/1 "Tango Sans",sans-serif;color:var(--w);letter-spacing:-.02em;margin:10px 0 12px}
.timeline h3{font-size:var(--t-h3);font-weight:700;margin-bottom:6px}
.timeline p{font-size:var(--t-body);line-height:1.45;max-width:34ch}

/* ---------- I SEDICI PEZZI ---------- */
.pezzi{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(30px,6vw,96px);align-items:center;padding:clamp(80px,10vw,150px) var(--pad)}
.pezzi__text .display{margin-bottom:28px}
.board{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));border:3px solid var(--k);max-width:760px;width:100%;justify-self:end}
.board span{aspect-ratio:1;display:flex;align-items:flex-end;padding:6px;min-width:0;overflow:hidden;font:700 var(--t-label)/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.02em;transition:background .25s,color .25s;user-select:none;-webkit-user-select:none}
.board span:nth-child(-n+8):nth-child(odd),.board span:nth-child(n+9):nth-child(even){background:var(--k);color:var(--w)}
.board span:nth-child(-n+8):nth-child(even),.board span:nth-child(n+9):nth-child(odd){background:var(--w);color:var(--k)}
.board span.on{background:var(--o)!important;color:var(--k)!important;animation:pop .45s cubic-bezier(.3,1.6,.4,1)}
@keyframes pop{0%{transform:scale(.7)}100%{transform:none}}

/* ---------- 05 · BACHECA ---------- */
.bacheca{background:var(--k);color:var(--w);padding:clamp(80px,10vw,150px) var(--pad)}
.bacheca .display{max-width:14ch}
.palmares{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);margin-top:clamp(48px,6vw,90px)}
.palmares h3{font:700 var(--t-label)/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--o);margin-bottom:18px}
.years{display:flex;flex-wrap:wrap;gap:0}
.years li{font:700 var(--t-big)/1.05 "Tango Sans",sans-serif;letter-spacing:-.02em;padding-right:.45em;transition:color .2s}
.years li:hover{color:var(--o)}
.awards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(24px,3vw,56px)}
.awards li{display:flex;flex-direction:column}
.awards li:nth-child(2){--d:.08s}.awards li:nth-child(3){--d:.16s}
.awards img{width:clamp(96px,9vw,140px);height:auto;margin-bottom:22px;transition:transform .6s var(--ease)}
.awards li:hover img{transform:rotate(-10deg) scale(1.05)}
.awards h4{font-size:var(--t-h3);font-weight:700;letter-spacing:-.02em;margin-bottom:10px}
.awards p{font-size:var(--t-small);line-height:1.45}
.bacheca__note{max-width:52ch;margin:-8px 0 30px}

/* ---------- I GRUPPI ---------- */
.gruppi{padding:clamp(80px,10vw,150px) var(--pad)}
.gruppi__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px clamp(24px,5vw,80px);align-items:end}
.gruppi__head .eyebrow{grid-column:1/-1;margin-bottom:0}
.gruppi__intro{font-size:var(--t-lead);line-height:1.25;font-weight:500;max-width:30ch}
.loghi{--n:6;--gx:clamp(20px,3vw,48px);display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(36px,4vw,64px) var(--gx);margin-top:clamp(56px,6vw,90px)}
.loghi li{flex:0 0 calc((100% - (var(--n) - 1) * var(--gx)) / var(--n))}
.loghi li{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px}
.loghi img{width:100%;max-width:190px;aspect-ratio:1;object-fit:contain;transition:transform .5s var(--ease)}
.loghi li:hover img{transform:rotate(-6deg) scale(1.06)}
.loghi span{font:700 var(--t-label)/1.2 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.04em}
.carnevale__marks{display:flex;flex-wrap:wrap;gap:30px clamp(30px,5vw,80px);margin-top:clamp(56px,6vw,90px)}
.carnevale__marks figure{display:flex;align-items:center;gap:22px;max-width:420px}
.carnevale__marks img{width:clamp(90px,8vw,120px);flex:none}
.carnevale__marks figcaption{font-weight:600;line-height:1.3}
@media (max-width:900px){.gruppi__head{grid-template-columns:1fr}}

/* ---------- CARTELLONE ---------- */
.poster{background:var(--o);padding:clamp(70px,9vw,140px) var(--pad);position:relative;overflow:hidden}
.poster__torre{width:clamp(110px,24vw,360px);margin-left:auto}
.poster__lines{font-weight:800;font-size:var(--t-poster);line-height:.88;letter-spacing:-.035em;text-transform:uppercase;margin-top:clamp(30px,3vw,50px);position:relative}
.poster__lines>span{display:block;overflow:hidden;padding-bottom:.04em}
.poster__lines>span>span{display:block;transition:transform 1.1s var(--snap)}
.js .poster__lines:not(.in)>span>span{transform:translateY(102%)}
.poster__lines>span:nth-child(2)>span{transition-delay:.12s}
.poster__lines>span:nth-child(3)>span{transition-delay:.24s}
.poster__lines.in>span>span{transform:none}

/* ---------- 06 · CARNEVALE ---------- */
.carnevale{background:var(--k);color:var(--w);padding:clamp(80px,10vw,150px) var(--pad)}
.carnevale__grid{display:grid;grid-template-columns:6fr 5fr;gap:clamp(30px,6vw,96px)}
.carnevale .display{max-width:12ch}
.carnevale__text{}
.carnevale__text .lead{color:var(--w)}
.squadre{display:flex;flex-wrap:wrap;gap:6px 0;font:700 var(--t-display)/1.05 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:-.01em}
.squadre li{display:inline-flex;align-items:center;color:var(--w)}
.squadre li:not(:last-child)::after{content:"";width:.28em;height:.28em;background:var(--o);margin:0 .45em;transform:rotate(45deg)}
.squadre li:hover{color:var(--o)}
.squadre li.is-us{color:var(--o)}
.squadre li.is-us::before{content:"";width:.7em;aspect-ratio:67/83.5;background:var(--o);-webkit-mask:url("../svg/torre.svg") center/contain no-repeat;mask:url("../svg/torre.svg") center/contain no-repeat;margin-right:.25em}
.carnevale__end{margin-top:clamp(64px,8vw,110px);font-weight:700;font-size:var(--t-display);letter-spacing:-.025em;line-height:1.05;color:var(--o)}
.carnevale__end span{display:block;font-weight:400;font-size:var(--t-body);letter-spacing:0;margin-top:12px;color:var(--w)}

/* ---------- 07 · CALENDARIO ---------- */
.calendario{padding:clamp(80px,10vw,150px) var(--pad)}
.cal__head{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:end}
.cal__head .display{max-width:14ch}
.cal__next{min-width:min(320px,100%);border-left:8px solid var(--o);padding-left:20px}
.cal__next-label{font:700 12px/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.08em}
.cal__next-day{font:700 var(--t-h3)/1.05 "Tango Sans",sans-serif;margin:10px 0 6px}
.cal__next-what{font-size:var(--t-small)}
.cal__legend{display:flex;flex-wrap:wrap;gap:10px 26px;margin:clamp(36px,4vw,56px) 0 22px;font-size:var(--t-small);font-weight:500}
.cal__legend li{display:flex;align-items:center;gap:10px}
.k{width:22px;height:22px;display:inline-block;position:relative;border:2px solid var(--k)}
.k--x{background:linear-gradient(45deg,transparent 45%,var(--k) 45% 55%,transparent 55%),linear-gradient(-45deg,transparent 45%,var(--k) 45% 55%,transparent 55%)}
.k--o{border-radius:50%;background:var(--o)}
.k--b{border-radius:50%;background:var(--k)}
.k--c{background:var(--o)}
.cal__tabs{display:none}
.month__list{display:none}
.ml{display:grid;grid-template-columns:4.6em 1fr;gap:12px;align-items:baseline;padding:10px 0;border-top:1px solid rgba(0,0,0,.14);font-size:var(--t-small);line-height:1.35}
.ml b{font:700 var(--t-label)/1.3 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.06em;display:flex;align-items:center;gap:8px;white-space:nowrap}
.ml b::before{content:"";flex:none;width:12px;height:12px;border:2px solid var(--k)}
.ml--o b::before{border-radius:50%;background:var(--o)}
.ml--b b::before{border-radius:50%;background:var(--k)}
.ml--c b::before{background:var(--o)}
.ml--x b::before{background:linear-gradient(45deg,transparent 42%,var(--k) 42% 58%,transparent 58%),linear-gradient(-45deg,transparent 42%,var(--k) 42% 58%,transparent 58%)}
.ml.is-past{opacity:.4}
.cal__months{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,44px)}
.month{position:relative}
.month h3{font-weight:700;font-size:var(--t-h3);letter-spacing:-.025em;text-align:right;margin-bottom:12px}
.month h3 small{font:700 12px/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.08em;float:left;margin-top:14px}
.grid7{border-top:3px solid var(--k)}
.dow{display:grid;grid-template-columns:repeat(7,1fr)}
.dow span{font:700 var(--t-label)/1 "Tango Sans",sans-serif;text-align:center;padding:10px 0 9px}
.dow span.hot{color:var(--o)}
.days{display:grid;grid-template-columns:repeat(7,1fr);gap:0}
.days > *{aspect-ratio:1/.92;border-top:1px solid rgba(0,0,0,.14);position:relative;padding:5px 6px;font:700 13px/1 "Tango Sans",sans-serif}
.day.is-past{opacity:.35}
.day svg{position:absolute;left:34%;top:40%;width:52%;height:52%;overflow:visible}
.day svg line{stroke:var(--k);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:60;stroke-dashoffset:60;transition:stroke-dashoffset .5s var(--ease);transition-delay:var(--d,0s)}
.day svg line+line{transition-delay:calc(var(--d,0s) + .18s)}
.month.in .day svg line{stroke-dashoffset:0}
.day.ev{cursor:help}
.day.ev .pin{position:absolute;right:12%;bottom:12%;width:38%;aspect-ratio:1;border-radius:50%;border:2px solid var(--k);transform:scale(0);transition:transform .5s cubic-bezier(.3,1.6,.4,1) .5s}
.month.in .day .pin{transform:none}
.pin--o{background:var(--o)}
.pin--b{background:var(--k)}
.day.carn{background:var(--o)}
.day.carn span.tag{position:absolute;left:5px;right:3px;bottom:5px;font-size:clamp(9px,.7vw,10px);overflow:hidden;line-height:1.05;text-transform:uppercase;letter-spacing:.02em}
.day.is-next{outline:4px solid var(--o);outline-offset:-4px;z-index:1}
.day.is-today{background:var(--k);color:var(--w)}
.day.is-today::after{content:"oggi";position:absolute;left:6px;bottom:5px;font-size:10px;text-transform:uppercase;color:var(--o)}
.tip{position:absolute;z-index:6;background:var(--k);color:var(--w);font:600 13px/1.3 "Inter Tight",sans-serif;padding:8px 10px;max-width:220px;pointer-events:none;transform:translate(-50%,calc(-100% - 10px));white-space:normal}
.cal__note{font-size:var(--t-small);align-self:end;display:flex;gap:20px;align-items:flex-end}
.cal__note img{width:clamp(90px,8vw,130px);flex:none;transform:rotate(-8deg)}
.cal__note p{max-width:30ch}

/* ---------- 08 · ISCRIZIONI ---------- */
.iscrizioni{padding:clamp(80px,10vw,150px) var(--pad);position:relative}
.isc__head{max-width:900px}
.isc__intro{font-size:var(--t-lead);line-height:1.25;letter-spacing:-.015em;margin-top:28px;font-weight:500}
.isc__grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(30px,5vw,80px);align-items:center;margin-top:clamp(56px,6vw,90px)}
.quote{display:flex;flex-direction:column;width:100%;max-width:860px;gap:clamp(14px,1.6vw,22px)}
.q{position:relative;display:flex;align-items:center;min-height:clamp(64px,6.4vw,92px);padding-left:clamp(56px,5.2vw,74px)}
.q::before{content:"";position:absolute;left:clamp(26px,2.6vw,38px);right:0;top:8%;bottom:8%;background:var(--k);clip-path:polygon(0 0,100% 12%,88% 50%,100% 88%,0 100%);transform-origin:left;transform:scaleX(0);transition:transform .8s var(--snap) .1s}
.q--r::before{clip-path:polygon(0 12%,100% 0,100% 100%,0 88%,12% 50%);left:0;right:clamp(26px,2.6vw,38px);transform-origin:right}
.q.in::before{transform:none}
.q__price{position:absolute;left:0;top:50%;transform:translateY(-50%) scale(0);z-index:2;width:clamp(64px,6.4vw,92px);aspect-ratio:1;border-radius:50%;background:var(--o);border:3px solid var(--k);display:flex;align-items:center;justify-content:center;gap:.06em;font:700 clamp(22px,2.2vw,32px)/1 "Tango Sans",sans-serif;transition:transform .6s cubic-bezier(.3,1.6,.4,1) .45s}
.q__price small{font-size:.55em}
.q.in .q__price{transform:translateY(-50%)}
.q__name{position:relative;z-index:1;color:var(--w);font:700 var(--t-h3)/1 "Tango Sans",sans-serif;padding:0 70px 0 clamp(20px,2vw,30px)}
.q--r{padding-left:0;padding-right:clamp(56px,5.2vw,74px);justify-content:flex-end}
.q--r .q__price{left:auto;right:0}
.q--r .q__name{padding:0 clamp(20px,2vw,30px) 0 70px}
.q--white::before{background:var(--o)}
.q--white .q__name{color:var(--k)}
.q--white .q__price{background:var(--w)}
.q--heart .q__price{border:0;border-radius:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 92'%3E%3Cpath d='M50 88C22 66 4 50 4 29 4 14 16 4 30 4c9 0 16 5 20 12 4-7 11-12 20-12 14 0 26 10 26 25 0 21-18 37-46 59z' fill='%23FE5000' stroke='%23000' stroke-width='5'/%3E%3C/svg%3E") center/contain no-repeat;padding:0 0 .45em 0;font-size:clamp(16px,1.5vw,22px);height:clamp(64px,6.4vw,92px)}
.toppe{position:relative;height:clamp(380px,40vw,560px)}
.toppa{position:absolute}
.toppa figcaption{margin-top:14px;white-space:nowrap;font:700 var(--t-label)/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.08em}
.toppa img{transition:transform .5s var(--ease)}
.toppa:hover img{transform:rotate(0deg) scale(1.05)!important}
.toppa--1{left:4%;top:0;width:36%}.toppa--1 img{transform:rotate(-8deg)}
.toppa--2{left:44%;top:9%;width:36%}.toppa--2 img{transform:rotate(7deg)}
.toppa--3{left:18%;bottom:2%;width:58%}.toppa--3 img{transform:rotate(-3deg)}
.isc__cta{margin-top:clamp(64px,7vw,110px);display:flex;align-items:center;gap:clamp(20px,3vw,40px);flex-wrap:wrap}

/* ---------- 09 · FAQ ---------- */
.faq{padding:0 var(--pad) clamp(90px,10vw,160px)}
.faq__list{margin-top:clamp(40px,5vw,70px);border-top:3px solid var(--k);max-width:1100px}
.faq details{border-bottom:3px solid var(--k)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 0;font-weight:600;font-size:var(--t-h3);letter-spacing:-.02em;line-height:1.15}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:30px;height:30px;background:linear-gradient(var(--k),var(--k)) center/100% 4px no-repeat,linear-gradient(var(--k),var(--k)) center/4px 100% no-repeat;transition:transform .35s var(--ease)}
.faq details[open] summary::after{transform:rotate(135deg)}
.faq summary:hover{color:var(--o)}
.faq details p{padding:0 0 28px;max-width:62ch}

/* ---------- 10 · FOOTER ---------- */
.foot{background:var(--k);color:var(--w)}
.foot__in{padding:clamp(70px,9vw,140px) var(--pad) 30px}
.foot__motto{font-weight:800;font-size:var(--t-poster);line-height:.88;letter-spacing:-.05em;text-transform:uppercase;color:var(--o);max-width:11ch}
.foot__grid{display:grid;grid-template-columns:1fr 1fr auto;gap:clamp(30px,5vw,80px)}
.foot__col h2{font:700 12px/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.08em;color:var(--o);margin:0 0 14px}
.foot__col h2:not(:first-child){margin-top:34px}
.foot__col p{max-width:40ch}
.foot__col .link{display:inline-block;margin-top:8px;padding:10px 0 2px;background-origin:content-box}
.foot__col p .link{margin-top:0}
.social{display:flex;flex-direction:column;gap:6px}
.social{gap:0}.social a{font-weight:700;font-size:var(--t-h3);letter-spacing:-.02em;text-decoration:none;display:inline-block;padding:8px 0;transition:transform .25s var(--ease),color .25s}
.social a:hover{color:var(--o);transform:translateX(8px)}
.foot__col--mark img{width:clamp(110px,10vw,150px)}
.foot__legal{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:0 12px;margin-top:clamp(56px,6vw,90px);padding-top:20px;border-top:3px solid var(--o);font-size:var(--t-small)}
.foot__legal a{text-decoration:none;margin-left:20px;display:inline-block;padding:12px 0}
.foot__legal a:hover{color:var(--w)}

/* ---------- pagine semplici (privacy, cookie, 404) ---------- */
.page{padding:clamp(60px,8vw,120px) var(--pad);max-width:980px}
.page h1{font-weight:700;font-size:var(--t-display);letter-spacing:-.035em;line-height:1;margin-bottom:40px}
.page h2{font-size:24px;letter-spacing:-.02em;margin:40px 0 12px}
.page ul{list-style:disc;padding-left:1.2em}
.page li+li{margin-top:.5em}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1280px){.cal__months{grid-template-columns:repeat(2,1fr)}}
@media (max-width:1180px) and (min-width:901px){.loghi{--n:4}}
@media (max-width:1180px){
  .pezzi{grid-template-columns:1fr;align-items:start}
  .pezzi__text{max-width:760px}
  .board{justify-self:start}
  .isc__grid{grid-template-columns:1fr}
  .count{grid-template-columns:1fr auto}
  .count__nums{grid-row:2;grid-column:1}
  .count .btn{grid-row:2;grid-column:2;align-self:end}
  .count__date{grid-row:3;grid-column:1/-1;padding-bottom:0}
  .toppe{height:auto;display:flex;justify-content:center;gap:clamp(14px,3vw,48px);align-items:flex-end;flex-wrap:wrap;max-width:860px}
  .toppa{position:relative;inset:auto!important;width:min(28%,220px)!important}
  .toppa--3{width:min(38%,300px)!important}
}
@media (max-width:1100px){
  .bar__nav{gap:16px}
  .bar__nav a{font-size:14px}
  .timeline{grid-template-columns:repeat(3,1fr);row-gap:40px}

}
@media (max-width:900px){
  :root{--bar:64px}
  .burger{display:block}
  .bar__cta{margin-left:auto}
  .burger{margin-left:6px}
  .bar__nav{position:fixed;inset:var(--bar) 0 0 0;background:var(--o);color:var(--k);flex-direction:column;gap:0;padding:24px var(--pad);transform:translateY(-102%);visibility:hidden;transition:transform .55s var(--snap),visibility 0s .55s;z-index:-1;margin:0}
  .bar__nav{overflow-y:auto;overscroll-behavior:contain}
  .bar__nav a{font-size:var(--t-display);font-weight:700;letter-spacing:-.03em;padding:8px 0;border-bottom:3px solid var(--k)}
  .bar__nav a::after{display:none}
  .menu-open .bar__nav{transform:none;visibility:visible;transition:transform .55s var(--snap)}
  .menu-open{overflow:hidden}
  .bar__home span{display:none}
  .storia__top,.chi__grid,.carnevale__grid,.pezzi,.isc__grid,.cal__head{grid-template-columns:1fr}
  .numbers ul{grid-template-columns:1fr 1fr;row-gap:40px}
  .storia__body{columns:1}
  .palmares{grid-template-columns:1fr}
  .awards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .foot__grid{grid-template-columns:1fr 1fr}
  .foot__col--mark{grid-column:1/-1}
  .cal__tabs{display:flex;margin:0 0 26px;border-bottom:3px solid var(--k)}
  .cal__tabs button{flex:1 1 0;min-width:0;min-height:48px;font:700 13px/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.04em;padding:0 2px;border:0;background:none;color:var(--k);opacity:.4;cursor:pointer;position:relative;white-space:nowrap;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
  .cal__tabs button::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:6px;background:var(--o);transform:scaleY(0);transform-origin:bottom;transition:transform .25s var(--ease)}
  .cal__tabs button.is-pair{opacity:1}
  .cal__tabs button[aria-selected="true"]{opacity:1}
  .cal__tabs button[aria-selected="true"]::after{transform:none}
  .cal__months{grid-template-columns:1fr;gap:28px}
  .cal__months .month{display:none}
  .cal__months .month.is-shown{display:block}
  .month__list{display:block;margin-top:18px}
  .cal__note{margin-top:30px;grid-column:1/-1}
  .count{grid-template-columns:1fr auto}
  .count__nums{grid-row:2;grid-column:1}
  .count .btn{grid-row:2;grid-column:2;align-self:end}
  .count__date{grid-row:3;grid-column:1/-1;padding-bottom:0}
  .quote{max-width:none}
  .loghi{--n:4}
  .toppe{height:auto;display:flex;justify-content:center;gap:14px;align-items:flex-end;flex-wrap:wrap}
  .toppa{position:relative;inset:auto!important;width:28%!important}
  .toppa--3{width:38%!important}
}
@media (min-width:600px) and (max-width:900px){
  .cal__months{grid-template-columns:1fr 1fr}
  .loghi{--n:4}
}
@media (max-width:599px){.loghi{--n:3}}
@media (max-width:560px){
  :root{--sq:12px}
  .loghi{--n:2}
  .day.carn span.tag{display:none}
  .count .btn{grid-row:auto;grid-column:1}
  .count__date{grid-row:auto}
  .hero__marks{margin-bottom:10px;gap:10px}
  .badges li{width:34px}
  .hero__values{width:min(44vw,170px)}
  .hero__piazza{height:auto;display:flex;flex-direction:column}
  .piazza__ink,.piazza__tiles{position:relative;inset:auto;height:112vw}
  .piazza__tiles{position:absolute;top:0;left:0;right:0}
  .count{grid-template-columns:1fr;margin:0 calc(var(--pad) * -1)}
  .count__nums{gap:12px}
  .count__nums b{font-size:clamp(40px,11vw,52px)}
  .hero__piazza{margin-top:0}
  .piazza__hint,.piazza__score{top:14px;right:var(--pad)}
  .numbers ul{grid-template-columns:1fr 1fr}

  .timeline{grid-template-columns:1fr;row-gap:30px}
  .board{grid-template-columns:repeat(4,minmax(0,1fr))}
  .board span{font-size:11px;padding:6px}
  .board span:nth-child(n){background:var(--w);color:var(--k)}
  .board span:nth-child(8n+1),.board span:nth-child(8n+3),.board span:nth-child(8n+6),.board span:nth-child(8n+8){background:var(--k);color:var(--w)}

  .q__name{padding-right:34px;font-size:17px}
  .q--r .q__name{padding-left:44px}
  .squadre{font-size:clamp(26px,7.4vw,32px)}
  .toppa figcaption{white-space:normal;text-align:center;line-height:1.2}
  .poster__lines{font-size:clamp(48px,14vw,64px)}
  .toppa{width:30%!important}
  .toppa--3{width:60%!important}
  .foot__grid{grid-template-columns:1fr}
  .foot__legal a{margin:0 18px 0 0}
  .btn--big{width:100%;justify-content:center}
  .faq summary{padding:20px 0}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  [data-reveal]{opacity:1;transform:none}
  .fit .ch,.poster__lines>span>span{transform:none}
  .piazza__tiles{display:none}
  .badges li,.hero__values,.count,.piazza__hint{transform:none;opacity:1}
  .q::before{transform:none}.q__price{transform:translateY(-50%)}
  .day svg line{stroke-dashoffset:0}.day .pin{transform:none}
}


/* ==========================================================================
   v3 · 26/10/26 · da sito vero
   Prima schermata: il nome sta nello schermo (non lo riempie più), a fianco premi e valori,
   sotto il banner delle iscrizioni che mostra sempre tutta la foto. Testi più piccoli, piè di pagina più sobrio.
   ========================================================================== */
.hero{padding:clamp(24px,2.6vw,44px) var(--pad) 0}
.hero__top{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(24px,4vw,80px);align-items:end}
.hero__namebox{width:min(100%,86vh,1500px);min-width:0}
.hero__side{display:flex;flex-direction:column;justify-content:flex-end;gap:clamp(18px,2vw,30px);padding-bottom:.4em;min-width:0}
.hero__since{margin:0;border-top:3px solid var(--k);padding-top:12px;gap:16px}
.hero__since span{line-height:1.45}
.hero__marks{margin:0;justify-content:space-between;flex-wrap:wrap;gap:16px}

/* il banner */
.banner{--bh:min(calc(100svh - var(--bar) - 40px),calc((100vw - 2 * var(--pad)) * .5625));position:relative;margin:clamp(24px,2.6vw,40px) calc(var(--pad) * -1) 0;height:max(360px,var(--bh));overflow:hidden;background:var(--w);container-type:size;isolation:isolate}
.bn{position:absolute;inset:0;display:flex;align-items:center;padding:0 var(--pad);visibility:hidden;overflow:hidden}
.bn.on{visibility:visible}
.bn--o{background:var(--o)}
.bn--w{background:var(--w)}
.bn--k{background:var(--k);color:var(--w)}
.bn__in{position:relative;z-index:2;width:100%}
.bn__k{font:700 var(--t-label)/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.08em;margin-bottom:clamp(14px,2.2cqh,30px)}
.bn__big{font:700 clamp(54px,min(15cqw,30cqh),300px)/.84 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:-.02em;margin:0}
.bn__big span{display:block}
.bn__big--s{font-size:clamp(44px,min(11cqw,24cqh),220px)}
.bn__mid{font:600 clamp(20px,min(3cqw,6cqh),54px)/1 "Inter Tight",sans-serif;letter-spacing:-.02em;margin-top:clamp(14px,3cqh,36px)}
.bn__torre{position:absolute;right:var(--pad);bottom:12cqh;height:62cqh;width:auto;z-index:1}
.bn__quote{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:3px solid var(--k)}
.bn__quote li{padding:clamp(14px,3cqh,30px) clamp(8px,1.2cqw,24px) 0 0;border-right:1px solid rgba(0,0,0,.18);margin-right:clamp(8px,1.2cqw,24px)}
.bn__quote li:last-child{border:0}
.bn__quote b{display:block;font:700 clamp(40px,min(8cqw,22cqh),170px)/.9 "Tango Sans",sans-serif;color:var(--o);-webkit-text-stroke:2px var(--k);paint-order:stroke fill;letter-spacing:-.02em}
.bn__quote small{font-size:.42em;margin-left:.08em;vertical-align:.95em}
.bn__quote span{display:block;margin-top:clamp(10px,2cqh,22px);font-weight:600;font-size:clamp(14px,min(1.5cqw,3.6cqh),26px);line-height:1.15}
.bn__cta{display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px;margin-top:clamp(20px,5cqh,56px);font-size:var(--t-body)}
.bn__cta .btn{border-color:var(--o)}
.bn--foto{padding:0;background:var(--w)}
.bn__ink{position:absolute;inset:0;background:var(--k);-webkit-mask:url("../img/foto-piazza.png") 72% 100%/contain no-repeat;mask:url("../img/foto-piazza.png") 72% 100%/contain no-repeat}
.bn__tag{position:absolute;left:var(--pad);bottom:clamp(20px,5cqh,56px);font:700 var(--t-label)/1.5 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.08em}
.bn__tag b{display:block;font:600 clamp(28px,min(4cqw,8cqh),72px)/1 "Inter Tight",sans-serif;letter-spacing:-.03em;text-transform:none}
.banner__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none;z-index:3;background:var(--o)}
.banner.is-video .banner__video.on{display:block}
/* le scene entrano */
.js .bn.on .bn__k{animation:bnUp .6s var(--ease) both}
.js .bn.on .bn__big span{animation:bnSlam .7s cubic-bezier(.3,1.5,.5,1) both}
.js .bn.on .bn__big span+span{animation-delay:.12s}
.js .bn.on .bn__mid,.js .bn.on .bn__cta{animation:bnUp .7s var(--ease) .3s both}
.js .bn.on .bn__torre{animation:bnDrop .9s cubic-bezier(.3,1.35,.5,1) .15s both}
.js .bn.on .bn__quote li{animation:bnUp .6s var(--ease) both}
.js .bn.on .bn__quote li:nth-child(2){animation-delay:.1s}.js .bn.on .bn__quote li:nth-child(3){animation-delay:.2s}.js .bn.on .bn__quote li:nth-child(4){animation-delay:.3s}.js .bn.on .bn__quote li:nth-child(5){animation-delay:.4s}
.js .bn--foto.on .bn__ink{animation:bnZoom 6s linear both}
.js .bn--foto.on .bn__tag{animation:bnUp .8s var(--ease) .2s both}
@keyframes bnUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes bnSlam{from{opacity:0;transform:translateY(40%) scale(1.06)}to{opacity:1;transform:none}}
@keyframes bnDrop{from{opacity:0;transform:translateY(-30%) rotate(-8deg)}to{opacity:1;transform:none}}
@keyframes bnZoom{from{transform:scale(1.04)}to{transform:scale(1)}}
/* passaggio a scacchi fra una scena e l'altra */
.bn__wipe{position:absolute;inset:0;z-index:6;pointer-events:none;display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:calc(100cqw / 12)}
.bn__wipe i{background:var(--k);transform:scale(0);transition:transform .32s var(--snap);transition-delay:var(--d)}
.bn__wipe i.w{background:var(--o)}
.bn__wipe.go i{transform:scale(1.02)}
@media (prefers-reduced-motion:reduce){.bn__wipe{display:none}}

/* striscia del gioco */
.gioco{padding:0;background:var(--k);color:var(--w)}
.gioco__strip{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:clamp(16px,2.4vw,40px);padding:clamp(22px,2.4vw,36px) var(--pad)}
.gioco__arancia{width:clamp(44px,4vw,64px);aspect-ratio:1;border-radius:50%;background:var(--o);border:3px solid var(--w);position:relative}
.gioco__arancia::after{content:"";position:absolute;width:30%;height:16%;top:-4%;left:46%;background:var(--w);border-radius:0 100% 0 100%;transform:rotate(-20deg)}
.gioco__k{font:700 var(--t-label)/1 "Tango Sans",sans-serif;text-transform:uppercase;letter-spacing:.08em;color:var(--o);margin-bottom:8px}
.gioco__t{font:700 clamp(26px,2.6vw,42px)/1 "Tango Sans",sans-serif;text-transform:uppercase}
.gioco__p{margin-top:6px;font-size:var(--t-body);opacity:.8}
.gioco__play{font-size:clamp(15px,1.2vw,18px);padding:18px 28px 16px;border-color:var(--o)}
.gioco__play::after{display:none}
.gioco__play:hover{--bg:var(--w);--fg:var(--k);border-color:var(--w)}
.gioco__play .g-play__tri{width:0;height:0;border-style:solid;border-width:8px 0 8px 13px;border-color:transparent transparent transparent currentColor}
.gioco__stage:not(.is-full){display:none!important}

/* iscrizioni senza toppe */
.isc__grid{grid-template-columns:1fr}
@media (min-width:1181px){.isc__grid{grid-template-columns:minmax(0,860px) 1fr;align-items:end}}

/* piè di pagina più sobrio */
.foot__col--mark{align-self:start}
.foot__col--mark img{width:clamp(64px,5vw,88px)}
.social a{font-size:var(--t-lead)!important}

@media (max-width:1100px){
  .hero__top{grid-template-columns:1fr}
  .hero__namebox{width:100%}
  .hero__side{padding-bottom:0}
}
@media (max-width:900px){
  .bn__quote{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:clamp(12px,3cqh,28px)}
  .bn__quote li:nth-child(3){border:0}
}
@media (max-width:640px){
  .gioco__strip{grid-template-columns:auto minmax(0,1fr)}
  .gioco__play{grid-column:1/-1;justify-content:center}
  .gioco__p{display:none}
  /* sul telefono gira il reel delle iscrizioni, a misura di telefono */
  .banner{height:auto;aspect-ratio:9/16;max-height:calc(100svh - var(--bar) - 20px);margin-left:calc(var(--pad) * -1);margin-right:calc(var(--pad) * -1)}
  .bn__ink{-webkit-mask-position:50% 100%;mask-position:50% 100%;-webkit-mask-size:cover;mask-size:cover}
  .bn__tag{top:24px;bottom:auto}
}
.bn__torre{height:min(62cqh,34cqw)}
@container (max-aspect-ratio: 6/5){
  .bn--o{align-items:flex-end;padding-bottom:9cqh}
  .bn__torre{top:7cqh;bottom:auto;height:min(30cqh,38cqw)}
  .bn__big{font-size:clamp(48px,17cqw,300px)}
}
.bn--o .bn__big{font-size:clamp(48px,min(12cqw,30cqh),300px)}
.bn__torre{height:min(62cqh,22cqw)}
@container (max-aspect-ratio: 6/5){ .bn--o .bn__big{font-size:clamp(48px,17cqw,300px)} .bn__torre{height:min(30cqh,38cqw)} }
.count{border-top:3px solid var(--k)}

/* cartellone più compatto: frase a sinistra, torre a destra */
.poster{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"l t";align-items:end;gap:clamp(24px,4vw,80px);padding:clamp(56px,6vw,110px) var(--pad)}
.poster__torre{grid-area:t;width:clamp(80px,12vw,220px);margin:0}
.poster__lines{grid-area:l;margin:0}
@media (max-width:640px){.poster{grid-template-columns:1fr;grid-template-areas:"t" "l"}.poster__torre{width:90px}}

/* revisione 26/10 */
.isc__intro{max-width:52ch}
.storia .lead{max-width:40ch}
.squadre{font-size:clamp(26px,3vw,56px);gap:.12em .55em}
.squadre li:not(:last-child)::after{display:none}
.years{display:grid;grid-template-columns:repeat(4,auto);justify-content:start;column-gap:.45em}
.years li{padding-right:0}
.loghi img{max-height:clamp(110px,10vw,190px)}
.day.ev .pin{right:auto;left:8%;bottom:8%;width:26%}
@media (min-width:1800px){.cal__months{max-width:1600px}}
.btn{font-size:clamp(13px,.8vw,16px)}
.bar__nav a{font-size:clamp(14px,.82vw,16px)}
@media (max-width:560px){.years{grid-template-columns:repeat(3,auto)}}
@container (max-aspect-ratio: 6/5){ .bn__big--s{font-size:clamp(40px,13.5cqw,220px)} }
