/* VRT Motorsport by Oreste Valenti – anteprima HANSLINK */
@font-face { font-family: 'Barlow C'; src: url('fonts/barlow-900-italic.woff2') format('woff2'); font-weight: 900; font-style: italic; font-display: swap; }
@font-face { font-family: 'Barlow C'; src: url('fonts/barlow-800-italic.woff2') format('woff2'); font-weight: 800; font-style: italic; font-display: swap; }
@font-face { font-family: 'Barlow C'; src: url('fonts/barlow-800-normal.woff2') format('woff2'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'Barlow C'; src: url('fonts/barlow-600-normal.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('fonts/inter-latin-wght-normal.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }

:root {
  --nero: #0b0b0d;
  --carbonio: #141418;
  --grafite: #1d1d23;
  --bordo: #2c2c35;
  --testo: #f4f2ec;
  --tenue: #a9a7b2;
  --giallo: #ffd400;
  --oro: #f2a900;
  --rosso: #e1251b;
  --blu: #1f6fe0;
  --verde-it: #12924a;
  --sabbia: #efe6d2;
  --r: 14px;
  --display: 'Barlow C', 'Arial Narrow', Impact, sans-serif;
  --sans: 'Inter', system-ui, -apple-system, sans-serif;
  --larghezza: 82rem;
  --molla: cubic-bezier(.2, .8, .2, 1);
}
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 76px; }
main { overflow-x: clip; }
body { margin: 0; background: var(--nero); color: var(--testo); font: 400 1.0625rem/1.6 var(--sans); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
p { margin: 0; }
h1, h2, h3 { margin: 0; font-family: var(--display); font-weight: 900; font-style: italic; text-transform: uppercase; line-height: .9; letter-spacing: -.01em; }
.contenitore { width: min(100% - 2.5rem, var(--larghezza)); margin-inline: auto; }
.salta { position: absolute; left: 1rem; top: -4rem; z-index: 100; background: var(--giallo); color: var(--nero); padding: .7rem 1rem; border-radius: 8px; font-weight: 700; }
.salta:focus { top: 1rem; }
:focus-visible { outline: 3px solid var(--giallo); outline-offset: 3px; border-radius: 6px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .01ms !important; animation-delay: 0s !important; transition-duration: .01ms !important; } }

.avviso { background: var(--giallo); color: var(--nero); text-align: center; font-size: .8rem; font-weight: 600; padding: .45rem 1rem; }

/* bottoni */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; min-height: 52px; padding: 0 1.5rem; border-radius: 8px; border: 2px solid transparent; font: 800 1.05rem/1 var(--display); letter-spacing: .06em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: transform .2s var(--molla), background .2s, color .2s; }
.btn:hover { transform: translateY(-2px); }
.btn-giallo { background: var(--giallo); color: var(--nero); box-shadow: 0 10px 30px -12px rgba(255, 212, 0, .7); }
.btn-linea { border-color: rgba(255, 255, 255, .35); color: #fff; background: rgba(255, 255, 255, .04); }
.btn-linea:hover { border-color: var(--giallo); color: var(--giallo); }
.btn-wa { background: #1fa855; color: #fff; }
.btn svg { width: 20px; height: 20px; flex: none; }

/* barra */
.barra { position: sticky; top: 0; z-index: 50; background: rgba(11, 11, 13, .82); backdrop-filter: blur(12px) saturate(1.2); -webkit-backdrop-filter: blur(12px) saturate(1.2); border-bottom: 1px solid rgba(255, 255, 255, .06); }
.barra-in { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 68px; }
.marchio img { width: 128px; }
.menu { display: flex; gap: 1.6rem; list-style: none; margin: 0; padding: 0; }
.menu a { font: 800 .98rem var(--display); letter-spacing: .08em; text-transform: uppercase; text-decoration: none; color: var(--tenue); transition: color .2s; }
.menu a:hover { color: var(--giallo); }
.destra { display: flex; align-items: center; gap: .7rem; }
.lingue { display: flex; border: 1px solid var(--bordo); border-radius: 8px; overflow: hidden; }
.lingue a { font: 800 .85rem var(--display); letter-spacing: .08em; padding: .45rem .6rem; text-decoration: none; color: var(--tenue); }
.lingue a[aria-current="true"] { background: var(--giallo); color: var(--nero); }
.barra .btn { min-height: 44px; padding: 0 1rem; font-size: .95rem; }
@media (max-width: 1240px) { .menu { display: none; } }
.menu { gap: 1.2rem; }
@media (max-width: 520px) { .barra .btn span { display: none; } .barra .btn { padding: 0 .8rem; } .marchio img { width: 104px; } }

/* ---------- APERTURA: il cancelletto di partenza ---------- */
.apertura { position: relative; min-height: calc(100svh - 68px); display: grid; align-items: center; overflow: hidden; isolation: isolate; padding: 3rem 0 4rem; background: radial-gradient(80% 70% at 75% 40%, #23180a 0%, var(--nero) 60%); }
.strisce { position: absolute; inset: -20% -10%; z-index: -1; background: repeating-linear-gradient(115deg, transparent 0 46px, rgba(255, 212, 0, .045) 46px 50px); transform: translateX(calc(var(--s, 0) * -60px)); }
.lampo { position: absolute; z-index: -1; right: -6%; top: 8%; width: 58%; height: 84%; background: linear-gradient(115deg, var(--rosso), #9e1610); clip-path: polygon(22% 0, 100% 0, 78% 100%, 0 100%); opacity: .92; transform: translateX(40%); animation: entra-lampo .9s 1.75s var(--molla) forwards; opacity: 0; }
@keyframes entra-lampo { to { transform: none; opacity: .92; } }
.apertura-in { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 2rem; align-items: center; }
.apertura-testo { position: relative; z-index: 2; }
.occhiello { display: inline-flex; align-items: center; gap: .6rem; font: 800 .95rem var(--display); letter-spacing: .2em; text-transform: uppercase; color: var(--giallo); }
.occhiello::before { content: ''; width: 34px; height: 4px; background: linear-gradient(90deg, var(--verde-it) 33%, #fff 33% 66%, var(--rosso) 66%); border-radius: 2px; }
.apertura h1 { font-size: clamp(3.4rem, 9.2vw, 9rem); margin: 1.1rem 0 1.4rem; }
.apertura h1 .riga { display: block; overflow: hidden; padding-right: .1em; }
.apertura h1 .riga > span { display: block; transform: translateY(105%); animation: su .8s var(--molla) forwards; }
.apertura h1 .riga:nth-child(1) > span { animation-delay: 1.55s; }
.apertura h1 .riga:nth-child(2) > span { animation-delay: 1.7s; }
.apertura h1 .riga:nth-child(3) > span { animation-delay: 1.85s; }
.apertura h1 .oro { background: linear-gradient(180deg, #fff59a 0%, var(--giallo) 45%, var(--oro) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.apertura h1 .contorno { color: transparent; -webkit-text-stroke: 2px #fff; }
@keyframes su { to { transform: none; } }
.apertura .sotto { font-size: clamp(1.05rem, 1.4vw, 1.22rem); color: #d8d6de; max-width: 36rem; opacity: 0; animation: compare .8s 2.1s forwards; }
.apertura .azioni { margin-top: 1.8rem; opacity: 0; animation: compare .8s 2.25s forwards; }
@keyframes compare { to { opacity: 1; } }
.azioni { display: flex; flex-wrap: wrap; gap: .7rem; }
.foto-eroe { position: relative; z-index: 1; justify-self: end; width: min(100%, 470px); opacity: 0; transform: translateX(60px) rotate(2deg); animation: entra-foto 1s 1.65s var(--molla) forwards; }
@keyframes entra-foto { to { opacity: 1; transform: rotate(2deg); } }
.foto-eroe .cornice { clip-path: polygon(10% 0, 100% 0, 90% 100%, 0 100%); background: #000; }
.foto-eroe img { width: 100%; aspect-ratio: 900 / 1008; object-fit: cover; transform: scale(calc(1.04 + var(--s, 0) * .06)); }
.targa-num { position: absolute; left: -6%; bottom: 8%; background: var(--giallo); color: var(--nero); font: 900 italic clamp(2.6rem, 5vw, 4.2rem)/1 var(--display); padding: .25rem 1.1rem .15rem; transform: skewX(-12deg); box-shadow: 0 18px 40px -14px rgba(0, 0, 0, .8); }
.targa-num small { display: block; font: 800 .8rem var(--display); letter-spacing: .14em; text-transform: uppercase; }
.cifre { display: flex; flex-wrap: wrap; gap: 1.2rem 2.6rem; margin-top: 2.6rem; padding-top: 1.4rem; border-top: 1px solid var(--bordo); list-style: none; padding-left: 0; opacity: 0; animation: compare .8s 2.4s forwards; }
.cifre b { display: block; font: 900 italic 2.3rem/1 var(--display); color: #fff; }
.cifre span { font-size: .86rem; color: var(--tenue); }

/* cancelletto */
.cancello { position: absolute; inset: 0; z-index: 5; pointer-events: none; display: grid; align-content: end; perspective: 900px; }
.cartello { position: absolute; left: 50%; top: 16%; width: 120px; height: 120px; margin-left: -60px; display: grid; place-items: center; background: var(--giallo); color: var(--nero); font: 900 italic 4rem/1 var(--display); border: 6px solid var(--nero); outline: 3px solid var(--giallo); border-radius: 6px; animation: gira-cartello .5s .45s ease-in forwards, via .3s 1.25s forwards; box-shadow: 0 20px 50px rgba(0, 0, 0, .6); }
.cartello small { position: absolute; bottom: 8px; font: 800 .7rem var(--display); letter-spacing: .14em; }
@keyframes gira-cartello { to { transform: rotateY(90deg); } }
.sbarre { display: grid; grid-template-columns: repeat(8, 1fr); gap: 6px; padding: 0 6px; height: 42vh; transform-style: preserve-3d; }
.sbarre span { position: relative; background: linear-gradient(180deg, #4b4b52, #2a2a30 60%, #1c1c21); border: 2px solid #5d5d66; border-bottom: 0; border-radius: 6px 6px 0 0; transform-origin: 50% 100%; animation: cade .55s cubic-bezier(.55, 0, .85, .3) forwards; animation-delay: calc(.95s + var(--i) * .015s); }
.sbarre span::before { content: ''; position: absolute; inset: 14% 18% auto; height: 26%; background: repeating-linear-gradient(90deg, var(--giallo) 0 12px, var(--nero) 12px 24px); opacity: .9; border-radius: 3px; }
.sbarre span::after { content: attr(data-n); position: absolute; left: 0; right: 0; bottom: 20%; text-align: center; font: 900 italic clamp(1.6rem, 3vw, 2.6rem) var(--display); color: rgba(255, 255, 255, .85); }
@keyframes cade { to { transform: rotateX(-92deg); opacity: 0; } }
.cancello.subito, .cancello.subito * { animation-duration: .01ms !important; animation-delay: 0s !important; }
@keyframes via { to { opacity: 0; visibility: hidden; } }
.cancello { animation: via .3s 1.6s forwards; }
@media (prefers-reduced-motion: reduce) { .cancello { display: none; } .apertura h1 .riga > span, .apertura .sotto, .apertura .azioni, .foto-eroe, .cifre, .lampo { animation: none !important; opacity: 1; transform: none; } }

@media (max-width: 860px) {
  .apertura { padding: 2rem 0 3rem; }
  .apertura-in { grid-template-columns: 1fr; }
  .foto-eroe { order: -1; justify-self: center; width: min(78%, 360px); }
  .lampo { width: 100%; height: 46%; top: 2%; right: -30%; }
  .apertura h1 { font-size: clamp(3rem, 15vw, 4.6rem); margin: .8rem 0 1rem; }
  .sbarre { grid-template-columns: repeat(4, 1fr); }
  .sbarre span:nth-child(n+5) { display: none; }
  .cifre { gap: 1rem 1.6rem; margin-top: 1.8rem; }
  .cifre b { font-size: 1.9rem; }
}

/* nastro */
.nastro { background: var(--giallo); color: var(--nero); overflow: hidden; transform: rotate(-1.4deg); margin: -.6rem -2rem 0; padding: .7rem 0; position: relative; z-index: 3; box-shadow: 0 14px 30px -18px rgba(0, 0, 0, .9); }
.nastro-in { display: flex; gap: 2.2rem; width: max-content; animation: scorre 32s linear infinite; font: 900 italic 1.5rem/1 var(--display); text-transform: uppercase; letter-spacing: .02em; }
.nastro-in i { width: 12px; height: 12px; background: var(--rosso); transform: skewX(-15deg); align-self: center; }
@keyframes scorre { to { transform: translateX(-50%); } }

/* sezioni */
.sezione { padding: clamp(4.5rem, 10vw, 8rem) 0; position: relative; }
.titolo { font-size: clamp(2.6rem, 6vw, 5.2rem); margin: .9rem 0 1.2rem; }
.titolo em { font-style: italic; color: var(--giallo); }
.sotto { color: var(--tenue); font-size: clamp(1.02rem, 1.3vw, 1.15rem); max-width: 40rem; }
.testa { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 28rem); gap: 1rem 3rem; align-items: end; margin-bottom: 2.6rem; }
@media (max-width: 860px) { .testa { grid-template-columns: 1fr; } }
.appare { opacity: 0; transform: translateY(30px); transition: opacity .8s var(--molla), transform .8s var(--molla); }
.appare.visto { opacity: 1; transform: none; }
.no-js .appare { opacity: 1; transform: none; }

/* programmi */
.programmi { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.1rem; }
.programma { --c: var(--giallo); position: relative; background: var(--carbonio); border: 1px solid var(--bordo); border-radius: var(--r); padding: 1.8rem 1.6rem 1.6rem; overflow: hidden; display: grid; gap: .9rem; align-content: start; transition: transform .35s var(--molla), border-color .35s; }
.programma:hover { transform: translateY(-6px); border-color: var(--c); }
.programma::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 6px; background: var(--c); }
.programma .num { position: absolute; right: -.5rem; top: -1.6rem; font: 900 italic 9rem/1 var(--display); color: var(--c); opacity: .1; }
.programma .etichetta { display: inline-flex; align-items: center; gap: .5rem; font: 800 .85rem var(--display); letter-spacing: .16em; text-transform: uppercase; color: var(--c); }
.programma .etichetta::before { content: ''; width: 12px; height: 12px; border-radius: 50%; background: var(--c); box-shadow: 0 0 14px var(--c); }
.programma h3 { font-size: 2.4rem; }
.programma p { color: #cfcdd6; }
.programma ul { margin: .2rem 0 0; padding: 0; list-style: none; display: grid; gap: .45rem; font-size: .95rem; color: var(--tenue); }
.programma li::before { content: '›'; color: var(--c); font-weight: 800; margin-right: .5rem; }
.programma .btn { margin-top: .6rem; justify-self: start; background: var(--c); color: var(--nero); min-height: 46px; font-size: .95rem; }
.programma.amateur { --c: #3d8bff; }
.programma.pro { --c: var(--rosso); }
.programma.pro .btn { color: #fff; }
@media (max-width: 980px) { .programmi { grid-template-columns: 1fr; } }

/* USA */
.usa { background: linear-gradient(180deg, var(--nero), #0d1424 30%, #0d1424 70%, var(--nero)); overflow: hidden; }
.usa::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(180deg, rgba(225, 37, 27, .06) 0 26px, transparent 26px 52px); mask-image: radial-gradient(60% 60% at 85% 30%, #000, transparent); -webkit-mask-image: radial-gradient(60% 60% at 85% 30%, #000, transparent); pointer-events: none; }
.usa-in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 3rem; align-items: center; position: relative; }
.usa .occhiello { color: #7fb0ff; }
.usa .titolo em { color: #7fb0ff; }
.pacchetto { margin-top: 1.6rem; display: grid; gap: .6rem; padding: 0; list-style: none; }
.pacchetto li { display: flex; gap: .8rem; align-items: center; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .08); border-radius: 10px; padding: .8rem 1rem; }
.pacchetto b { font: 900 italic 1.6rem/1 var(--display); color: var(--giallo); min-width: 3.2rem; }
.usa-foto { display: grid; grid-template-columns: 1.2fr 1fr; grid-template-rows: auto auto; gap: .8rem; }
.usa-foto figure { margin: 0; border-radius: var(--r); overflow: hidden; position: relative; }
.usa-foto figure:first-child { grid-column: 1 / -1; }
.usa-foto img { width: 100%; height: 100%; object-fit: cover; }
.usa-foto figcaption, .galleria figcaption { position: absolute; left: .7rem; bottom: .7rem; right: .7rem; font: 800 .82rem var(--display); letter-spacing: .1em; text-transform: uppercase; color: #fff; text-shadow: 0 2px 10px #000; }
.logo-it { width: 220px; margin-top: 1.8rem; }
@media (max-width: 860px) { .usa-in { grid-template-columns: 1fr; } }

/* storia */
.storia { position: relative; display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.storia::before { content: ''; position: absolute; left: 7.6rem; top: .6rem; bottom: .6rem; width: 2px; background: linear-gradient(var(--giallo), var(--rosso)); }
.storia li { display: grid; grid-template-columns: 6.4rem minmax(0, 1fr) minmax(0, 15rem); gap: 1rem 2.6rem; padding: 1.4rem 0; align-items: center; position: relative; }
.storia li::before { content: ''; position: absolute; left: calc(7.6rem - 7px); top: 2.2rem; width: 16px; height: 16px; background: var(--nero); border: 3px solid var(--giallo); transform: rotate(45deg); }
.storia .anno { font: 900 italic 2.6rem/1 var(--display); color: var(--giallo); text-align: right; }
.storia h3 { font-size: 1.7rem; margin-bottom: .4rem; }
.storia p { color: var(--tenue); }
.storia img { border-radius: 10px; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
@media (max-width: 760px) {
  .storia::before { left: .45rem; }
  .storia li { grid-template-columns: 1fr; padding-left: 2rem; gap: .6rem; }
  .storia li::before { left: 0; top: 1.9rem; }
  .storia .anno { text-align: left; font-size: 2.1rem; }
  .storia img { max-width: 22rem; }
}

/* poster */
.poster { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-top: 3rem; }
.poster figure { margin: 0; border-radius: 10px; overflow: hidden; transform: rotate(var(--r, 0deg)); transition: transform .4s var(--molla); box-shadow: 0 30px 50px -30px #000; }
.poster figure:hover { transform: rotate(0) scale(1.03); }
.poster img { width: 100%; aspect-ratio: 600 / 880; object-fit: cover; }
@media (max-width: 640px) { .poster { grid-template-columns: repeat(3, 70vw); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .6rem; } .poster figure { scroll-snap-align: center; } }

/* oggi */
.oggi { background: var(--carbonio); }
.oggi-in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 3rem; align-items: center; }
.oggi-foto { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.oggi-foto img { border-radius: var(--r); width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
.oggi-foto img:nth-child(2) { margin-top: 2.4rem; }
.atleta { margin-top: 1.6rem; display: flex; gap: 1rem; align-items: center; background: var(--grafite); border-radius: var(--r); padding: 1rem 1.1rem; border-left: 4px solid var(--giallo); }
.atleta img { width: 84px; height: 84px; border-radius: 10px; object-fit: cover; flex: none; }
.atleta b { font: 900 italic 1.3rem var(--display); text-transform: uppercase; display: block; }
.atleta span { color: var(--tenue); font-size: .94rem; }
@media (max-width: 860px) { .oggi-in { grid-template-columns: 1fr; } }

/* video */
.video { position: relative; border-radius: var(--r); overflow: hidden; aspect-ratio: 16 / 9; background: #000; box-shadow: 0 40px 80px -40px #000; }
.video button { all: unset; cursor: pointer; position: absolute; inset: 0; display: grid; place-items: center; }
.video img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--molla); }
.video button:hover img { transform: scale(1.03); }
.video .play { position: relative; width: 92px; height: 92px; border-radius: 50%; background: var(--rosso); display: grid; place-items: center; box-shadow: 0 0 0 10px rgba(225, 37, 27, .25); transition: transform .3s var(--molla); }
.video button:hover .play { transform: scale(1.08); }
.video button:focus-visible .play { outline: 3px solid var(--giallo); outline-offset: 6px; }
.video .play::after { content: ''; margin-left: 6px; border-left: 26px solid #fff; border-top: 16px solid transparent; border-bottom: 16px solid transparent; }
.video .nota-video { position: absolute; left: 1rem; bottom: 1rem; font-size: .8rem; color: #fff; background: rgba(0, 0, 0, .55); padding: .3rem .6rem; border-radius: 6px; }
.video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* pista */
.pista { background: linear-gradient(180deg, var(--nero) 0%, #1a140b 100%); overflow: hidden; }
.pista-in { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 3rem; align-items: center; }
.pista .logo-pista { width: min(100%, 420px); margin-bottom: 1.4rem; }
.foto-salti { position: relative; overflow: hidden; border-radius: var(--r); }
.foto-salti-didascalie { position: absolute; inset: auto 0 0; display: flex; justify-content: space-between; align-items: center; gap: .6rem; padding: 2.2rem clamp(.7rem, 2vw, 1.2rem) .8rem; color: #fff; font-size: clamp(.72rem, 1.6vw, .95rem); line-height: 1.2; background: linear-gradient(transparent, rgba(0,0,0,.78)); pointer-events: none; }
.foto-salti-didascalie span:last-child { text-align: right; }
.foto-salti-didascalie b { color: var(--giallo); text-transform: uppercase; letter-spacing: .06em; }
.motto-pista { font: 900 italic clamp(1.4rem, 2.4vw, 2rem)/1.05 var(--display); text-transform: uppercase; color: var(--giallo); margin: 1.2rem 0; }
.recapito { display: grid; gap: .25rem; margin-top: 1rem; }
.recapito span { font: 800 .8rem var(--display); letter-spacing: .14em; text-transform: uppercase; color: var(--tenue); }
.recapito a, .recapito p { font-weight: 600; text-decoration: none; }
.servizi { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.6rem 0 0; padding: 0; list-style: none; }
.servizi li { border: 1px solid var(--bordo); border-radius: 999px; padding: .45rem .9rem; font: 800 .9rem var(--display); letter-spacing: .06em; text-transform: uppercase; }
@media (max-width: 860px) { .pista-in { grid-template-columns: 1fr; } }
@media (max-width: 860px) { .pista-in > .foto-salti { width: 100%; overflow: visible; } .pista-in > .foto-salti img { display: block; width: 100%; max-width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: contain; object-position: center; transform: none; } }

/* galleria */
.galleria { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 210px; gap: .7rem; }
.galleria figure { margin: 0; border-radius: 12px; overflow: hidden; position: relative; }
.galleria figure.largo { grid-column: span 2; }
.galleria figure.alto { grid-row: span 2; }
.galleria img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--molla); }
.galleria figure:hover img { transform: scale(1.05); }
@media (max-width: 760px) { .galleria { grid-template-columns: 1fr 1fr; grid-auto-rows: 160px; } }

/* modulo */
.iscriviti { background: var(--giallo); color: var(--nero); }
.iscriviti .occhiello { color: var(--nero); }
.iscriviti .titolo em { color: var(--rosso); }
.iscriviti .sotto { color: #3b3520; }
.iscriviti-in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 32rem); gap: 3rem; align-items: start; }
.modulo { background: var(--nero); color: var(--testo); border-radius: 18px; padding: clamp(1.3rem, 3vw, 2rem); display: grid; gap: 1rem; box-shadow: 0 40px 70px -40px rgba(0, 0, 0, .8); }
.campo { display: grid; gap: .4rem; }
.campo > span, .gruppo > legend { font: 800 .82rem var(--display); letter-spacing: .14em; text-transform: uppercase; color: var(--tenue); }
.campo input, .campo select, .campo textarea { min-height: 50px; border: 1px solid var(--bordo); border-radius: 10px; background: var(--carbonio); color: var(--testo); padding: .7rem .9rem; font: 400 1rem var(--sans); width: 100%; }
.campo textarea { min-height: 96px; resize: vertical; }
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: 2px solid var(--giallo); border-color: transparent; }
.campo [aria-invalid="true"] { border-color: var(--rosso); }
.gruppo { border: 0; margin: 0; padding: 0; display: grid; gap: .5rem; }
.pillole { display: flex; flex-wrap: wrap; gap: .45rem; }
.pillole label { position: relative; }
.pillole input { position: absolute; opacity: 0; }
.pillole span { display: inline-flex; min-height: 44px; align-items: center; padding: 0 1rem; border: 1px solid var(--bordo); border-radius: 999px; font: 800 .95rem var(--display); letter-spacing: .05em; text-transform: uppercase; cursor: pointer; }
.pillole input:checked + span { background: var(--giallo); color: var(--nero); border-color: var(--giallo); }
.pillole input:focus-visible + span { outline: 3px solid var(--giallo); outline-offset: 2px; }
.due { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.errore { color: #ff8a80; min-height: 1.2em; font-size: .92rem; }
.nota { font-size: .85rem; color: var(--tenue); }
@media (max-width: 860px) { .iscriviti-in { grid-template-columns: 1fr; } }
@media (max-width: 420px) { .due { grid-template-columns: 1fr; } }

/* contatti */
.contatti { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.contatto { background: var(--carbonio); border: 1px solid var(--bordo); border-radius: var(--r); padding: 1.4rem; display: grid; gap: .45rem; align-content: start; }
.contatto h3 { font-size: 1.6rem; margin-bottom: .3rem; }
.contatto .ruolo { font: 800 .8rem var(--display); letter-spacing: .14em; text-transform: uppercase; color: var(--giallo); }
.contatto a { font-weight: 600; text-decoration: none; word-break: break-word; }
.contatto a:hover { color: var(--giallo); }
.contatto p { color: var(--tenue); font-size: .95rem; }
.social { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.6rem; }
@media (max-width: 900px) { .contatti { grid-template-columns: 1fr; } }

/* piede */
.piede { border-top: 1px solid var(--bordo); padding: 2.6rem 0 6rem; color: var(--tenue); font-size: .9rem; }
.piede-in { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1.4rem; align-items: center; }
.piede img { width: 150px; }
.piede a { color: var(--testo); }

.wa-fisso { position: fixed; right: 18px; bottom: 18px; z-index: 60; width: 60px; height: 60px; border-radius: 50%; background: #1fa855; display: grid; place-items: center; box-shadow: 0 12px 30px -8px rgba(0, 0, 0, .7); }
.wa-fisso svg { width: 30px; height: 30px; color: #fff; }
/* rivisita: niente attesa del cancelletto */
html.partito .apertura h1 .riga > span, html.partito .apertura .sotto, html.partito .apertura .azioni, html.partito .foto-eroe, html.partito .cifre, html.partito .lampo { animation-delay: .05s !important; }
.video-due { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 1rem; }
.video-due .play { width: 70px; height: 70px; }
.video-due .play::after { border-left-width: 20px; border-top-width: 12px; border-bottom-width: 12px; }
@media (max-width: 700px) { .video-due { grid-template-columns: 1fr; } }
.citazione { margin: 1.6rem 0 0; padding: 1.2rem 1.4rem; border-left: 4px solid var(--rosso); background: rgba(225, 37, 27, .08); border-radius: 0 var(--r) var(--r) 0; }
.citazione p { font: 900 italic clamp(1.5rem, 2.6vw, 2.2rem)/1.05 var(--display); text-transform: uppercase; color: #fff; }
.citazione footer { margin-top: .5rem; font-size: .88rem; color: var(--tenue); }
.storia .anno { white-space: nowrap; }
.storia .anno.piccolo { font-size: 1.35rem; }
/* nel mondo */
.mondi { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.mondo-carta { background: var(--carbonio); border: 1px solid var(--bordo); border-radius: var(--r); padding: 1.4rem; display: grid; gap: .7rem; align-content: start; }
.mondo-carta h3 { font-size: 2rem; }
.mondo-carta p { color: var(--tenue); font-size: .96rem; }
.mondo-carta img { border-radius: 10px; aspect-ratio: 4 / 3; object-fit: cover; width: 100%; margin-top: .3rem; }
.bandiera { width: 46px; height: 30px; border-radius: 4px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .15); }
.bandiera.it { background: linear-gradient(90deg, #12924a 33.3%, #fff 33.3% 66.6%, #e1251b 66.6%); }
.bandiera.us { background: linear-gradient(90deg, #22408f 40%, transparent 40%) 0 0 / 100% 54% no-repeat, repeating-linear-gradient(180deg, #c8102e 0 2.3px, #fff 2.3px 4.6px); }
.bandiera.ae { background: linear-gradient(90deg, #c8102e 25%, transparent 25%), linear-gradient(180deg, #00843d 33.3%, #fff 33.3% 66.6%, #000 66.6%); }
.bandiera.et { background: linear-gradient(180deg, #078930 33.3%, #fcdd09 33.3% 66.6%, #da121a 66.6%); }
.organizza { margin-top: 2rem; display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 2.4rem; align-items: center; background: linear-gradient(120deg, #1a1405, var(--carbonio)); border: 1px solid var(--bordo); border-radius: 18px; padding: clamp(1.2rem, 3vw, 2rem); }
.organizza img { border-radius: 12px; }
.organizza h3 { font-size: 2.2rem; color: var(--giallo); }
@media (max-width: 1000px) { .mondi { grid-template-columns: 1fr 1fr; } }
@media (max-width: 760px) { .organizza { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .mondi { grid-template-columns: 1fr; } }
/* rassegna stampa */
.pagine { display: flex; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; padding: .4rem .2rem 1.2rem; scrollbar-color: var(--giallo) var(--carbonio); }
.pagine figure { flex: 0 0 clamp(200px, 22vw, 280px); margin: 0; scroll-snap-align: start; position: relative; border-radius: 10px; overflow: hidden; box-shadow: 0 24px 40px -24px #000; transform: rotate(var(--g, 0deg)); }
.pagine figure:nth-child(odd) { --g: -1.2deg; }
.pagine figure:nth-child(even) { --g: 1.2deg; }
.pagine img { width: 100%; aspect-ratio: 520 / 800; object-fit: cover; object-position: top; }
.pagine figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.6rem .8rem .7rem; background: linear-gradient(transparent, rgba(0, 0, 0, .85)); font: 800 .85rem var(--display); letter-spacing: .1em; text-transform: uppercase; }
.prog-foto { border-radius: 10px; aspect-ratio: 16 / 10; object-fit: cover; width: 100%; margin-top: .4rem; }
.atleta img { width: 96px; height: 120px; }
/* generazioni */
.generazioni { background: linear-gradient(180deg, var(--nero), #1b1608 50%, var(--nero)); }
.gen { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.1rem; }
.gen-carta { margin: 0; position: relative; border-radius: 16px; overflow: hidden; aspect-ratio: 7 / 9; background: var(--carbonio); border: 1px solid var(--bordo); }
.gen-carta img { width: 100%; height: 100%; object-fit: cover; }
.gen-carta figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 3rem 1.2rem 1.2rem; background: linear-gradient(transparent, rgba(0, 0, 0, .9)); display: grid; gap: .2rem; }
.gen-carta b { font: 900 italic 2rem/1 var(--display); text-transform: uppercase; }
.gen-carta span { color: #d6d4dc; font-size: .92rem; }
.gen-carta .classe { justify-self: start; background: var(--giallo); color: var(--nero); font: 800 .8rem var(--display); letter-spacing: .12em; text-transform: uppercase; padding: .25rem .6rem; border-radius: 4px; }
.gen-carta.futuro { display: grid; place-items: center; background: repeating-linear-gradient(115deg, #15151a 0 30px, #1b1b21 30px 60px); }
.targa-futuro { background: var(--giallo); color: var(--nero); font: 900 italic clamp(4rem, 9vw, 7rem)/1 var(--display); padding: .4rem 1.6rem .2rem; transform: skewX(-12deg) translateY(-2.4rem); text-align: center; box-shadow: 0 30px 60px -20px #000; }
.targa-futuro small { display: block; font: 800 .9rem var(--display); letter-spacing: .2em; text-transform: uppercase; }
@media (max-width: 860px) { .gen { grid-template-columns: 1fr; } .gen-carta { aspect-ratio: 4 / 5; } }
.sos { margin: 1.6rem 0 0; display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 1rem; align-items: center; background: var(--grafite); border-radius: var(--r); padding: .9rem; }
.sos img { border-radius: 10px; width: 100%; aspect-ratio: 1; object-fit: cover; object-position: left; }
.sos figcaption { color: var(--tenue); font-size: .95rem; }
.sos b { display: block; font: 900 italic 1.3rem/1.05 var(--display); text-transform: uppercase; color: #fff; margin-bottom: .3rem; }
@media (max-width: 420px) { .sos { grid-template-columns: 1fr; } }
/* settori */
.settore { --c: var(--giallo); display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 1.4rem 2.6rem; padding: clamp(1.3rem, 3vw, 2rem); border-radius: 18px; background: linear-gradient(120deg, color-mix(in srgb, var(--c) 14%, var(--carbonio)), var(--carbonio) 60%); border: 1px solid color-mix(in srgb, var(--c) 40%, var(--bordo)); margin-bottom: 1rem; }
.settore.blu { --c: #3d8bff; }
.settore.rosso { --c: var(--rosso); }
.settore h3 { font-size: clamp(1.9rem, 3.4vw, 2.8rem); color: var(--c); margin: .6rem 0 .7rem; }
.settore-testa p { color: #cfcdd6; }
.pallino { display: block; width: 18px; height: 18px; border-radius: 50%; background: var(--c); box-shadow: 0 0 18px var(--c); }
.piloti { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.piloti li { display: grid; grid-template-columns: 6.2rem minmax(0, 1fr); gap: .8rem; align-items: baseline; padding: .7rem .9rem; background: rgba(0, 0, 0, .28); border-radius: 10px; border-left: 3px solid var(--c); }
.piloti b { font: 900 italic 1.25rem/1 var(--display); color: var(--c); white-space: nowrap; }
.piloti strong { color: #fff; }
.piloti span { color: #cfcdd6; font-size: .97rem; }
@media (max-width: 860px) { .settore { grid-template-columns: 1fr; } }
@media (max-width: 420px) { .piloti li { grid-template-columns: 1fr; gap: .2rem; } }
/* due bandiere */
.sedi2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.sede { background: var(--carbonio); border: 1px solid var(--bordo); border-radius: 18px; padding: 1.6rem; display: grid; gap: .5rem; align-content: start; }
.sede h3 { font-size: 2.2rem; }
.sede .dove { font: 800 1rem/1.4 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--giallo); }
.sede p:not(.dove) { color: var(--tenue); }
.bandiera.grande { width: 84px; height: 54px; border-radius: 6px; }
.bandiera.br { background: radial-gradient(circle at 50% 50%, #002776 22%, transparent 23%), linear-gradient(135deg, transparent 30%, #ffdf00 30% 70%, transparent 70%), #009c3b; }
@media (max-width: 700px) { .sedi2 { grid-template-columns: 1fr; } }
/* aree */
.aree-griglia { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .8rem; }
.aree-griglia li { --c: var(--giallo); }
.aree-griglia a { display: grid; gap: .35rem; align-content: start; height: 100%; padding: 1.2rem 1.2rem 1.3rem; background: var(--carbonio); border: 1px solid var(--bordo); border-radius: var(--r); text-decoration: none; position: relative; overflow: hidden; transition: transform .3s var(--molla), border-color .3s; }
.aree-griglia a::after { content: '→'; position: absolute; right: 1rem; top: 1rem; color: var(--c); font-weight: 800; transition: transform .3s var(--molla); }
.aree-griglia a:hover { transform: translateY(-4px); border-color: var(--c); }
.aree-griglia a:hover::after { transform: translateX(4px); }
.aree-griglia .n { font: 900 italic 1.1rem var(--display); color: var(--c); }
.aree-griglia b { font: 900 italic 1.55rem/1 var(--display); text-transform: uppercase; }
.aree-griglia span:last-child { color: var(--tenue); font-size: .92rem; }
@media (max-width: 1000px) { .aree-griglia { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .aree-griglia { grid-template-columns: 1fr; } }
/* percorso del pilota */
.percorso { list-style: none; margin: 0 0 1.4rem; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; }
.percorso li { position: relative; display: grid; gap: .1rem; padding: .9rem 1rem .9rem 3.6rem; background: var(--grafite); border-radius: 10px; clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 50%, calc(100% - 14px) 100%, 0 100%); }
.percorso b { position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); width: 2rem; height: 2rem; border-radius: 50%; display: grid; place-items: center; background: var(--c); color: var(--nero); font: 900 italic 1.1rem var(--display); }
.percorso span { font: 900 italic 1.3rem/1 var(--display); text-transform: uppercase; }
.percorso small { color: var(--tenue); font-size: .85rem; }
@media (max-width: 860px) { .percorso { grid-template-columns: 1fr 1fr; } }
/* gare */
.livelli { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; align-items: end; }
.livello { background: var(--carbonio); border: 1px solid var(--bordo); border-radius: var(--r); padding: 1.4rem; display: grid; gap: .6rem; }
.livello:nth-child(2) { padding-top: 2.6rem; border-color: #6b5a12; }
.livello:nth-child(3) { padding-top: 3.8rem; border-color: var(--giallo); background: linear-gradient(180deg, #221c06, var(--carbonio)); }
.gradino { justify-self: start; font: 800 .82rem var(--display); letter-spacing: .14em; text-transform: uppercase; background: var(--giallo); color: var(--nero); padding: .25rem .6rem; border-radius: 4px; }
.livello h3 { font-size: 2.2rem; }
.livello ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .4rem; color: #cfcdd6; font-size: .96rem; }
.livello li::before { content: '›'; color: var(--giallo); font-weight: 800; margin-right: .5rem; }
@media (max-width: 860px) { .livelli { grid-template-columns: 1fr; } .livello:nth-child(n) { padding-top: 1.4rem; } }
/* coaching */
.coaching { background: var(--carbonio); }
.coaching-in { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 3rem; align-items: center; }
.ruoli { list-style: none; margin: 1.4rem 0 0; padding: 0; display: grid; gap: .6rem; }
.ruoli li { display: grid; grid-template-columns: 9rem minmax(0, 1fr); gap: 1rem; align-items: baseline; padding: .9rem 1rem; border-radius: 10px; background: var(--grafite); }
.ruoli b { font: 900 italic 1.35rem var(--display); text-transform: uppercase; color: var(--giallo); }
.ruoli span { color: #cfcdd6; }
@media (max-width: 860px) { .coaching-in { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .ruoli li { grid-template-columns: 1fr; gap: .2rem; } }
/* eventi */
.eventi-griglia { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.eventi-griglia figure { margin: 0; border-radius: 12px; overflow: hidden; position: relative; background: #000; }
.eventi-griglia img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: top; }
.eventi-griglia figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 2.4rem 1rem 1rem; background: linear-gradient(transparent, rgba(0, 0, 0, .9)); font-size: .92rem; }
.eventi-griglia figcaption b { display: block; font: 900 italic 1.8rem/1 var(--display); color: var(--giallo); }
@media (max-width: 900px) { .eventi-griglia { grid-template-columns: 1fr 1fr; } }
/* R&D */
.rnd { background: linear-gradient(180deg, var(--nero), #101016); }
.rnd-in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 3rem; align-items: center; }
.rnd-foto { margin: 0; display: grid; grid-template-columns: 1.4fr 1fr; gap: .8rem; }
.rnd-foto img { border-radius: var(--r); width: 100%; height: 100%; object-fit: cover; aspect-ratio: 3 / 4; }
@media (max-width: 860px) { .rnd-in { grid-template-columns: 1fr; } }
.settore-foto { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; }
.settore-foto figure { margin: 0; position: relative; border-radius: 10px; overflow: hidden; }
.settore-foto img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.settore-foto figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.6rem .7rem .6rem; background: linear-gradient(transparent, rgba(0, 0, 0, .85)); font: 800 .8rem var(--display); letter-spacing: .1em; text-transform: uppercase; }
@media (max-width: 760px) { .settore-foto { grid-template-columns: 1fr 1fr; } }
.bandiera.cl { background: linear-gradient(90deg, #0039a6 33%, transparent 33%) 0 0 / 100% 50% no-repeat, linear-gradient(180deg, #fff 50%, #d52b1e 50%); }
.mondi { grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); }

/* Foto di archivio: didascalie fuori dalla foto e immagini intere. */
.settore-foto figure { background: #111115; }
.settore-foto img { display:block; object-fit:contain; }
.settore-foto figcaption { position:static; padding:.7rem; background:none; }