/* Hakuna Matata Dance & Fitness — foglio di stile unico
   Non serve modificarlo per cambiare testi o orari: quelli stanno in dati.js */
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700;800;900&family=Poppins:wght@300;400;500;600;700&display=swap");

:root{
  --spectrum-amber:#ffb01a;--spectrum-orange:#ff9b19;--spectrum-red:#ff3d19;--spectrum-crimson:#ff1967;
  --spectrum-pink:#ff1a85;--spectrum-magenta:#ff19b8;--spectrum-violet:#c41aff;--spectrum-purple:#981aff;
  --spectrum-indigo:#2219ff;--spectrum-blue:#197dff;--spectrum-cyan:#1ad4ff;--spectrum-green:#22ca64;
  --disc-multisport:#ffa30d;--disc-caraibico:#ff2585;--disc-pole:#2bc8ff;--disc-fitness:#8d44ff;--disc-hiphop:#22ca64;--disc-ladystyle:#197dff;
  --black:#000;--ink-900:#07080c;--ink-800:#0e1015;--ink-300:#8b8d95;--ink-200:#c3c5cb;--ink-400:#5a5b60;--white:#fff;
  --surface-card:var(--ink-900);
  --text-primary:#fff;--text-secondary:var(--ink-200);--text-muted:var(--ink-300);--text-faint:var(--ink-400);
  --border-hairline:rgba(255,255,255,.10);--border-strong:rgba(255,255,255,.34);--border-solid:#fff;
  --action-primary:var(--spectrum-pink);--action-primary-hover:#ff3f9a;
  --font-display:"Montserrat",system-ui,sans-serif;--font-body:"Poppins",system-ui,sans-serif;
  --gradient-spectrum:linear-gradient(90deg,var(--spectrum-amber) 0%,var(--spectrum-orange) 14%,var(--spectrum-red) 28%,var(--spectrum-crimson) 42%,var(--spectrum-magenta) 58%,var(--spectrum-purple) 72%,var(--spectrum-indigo) 86%,var(--spectrum-cyan) 100%);
  --gradient-headline:linear-gradient(96deg,#fff 0%,#fff 34%,#ffc2d8 46%,var(--spectrum-pink) 62%,var(--spectrum-violet) 80%,var(--spectrum-blue) 100%);
  --gradient-vignette:radial-gradient(120% 90% at 50% 40%,rgba(0,0,0,0) 35%,rgba(0,0,0,.75) 100%);
  --shadow-card:0 8px 28px rgba(0,0,0,.65);
  --glow-pink:0 0 24px rgba(255,26,133,.55);
  --c:var(--disc-caraibico);
}
[data-disc="caraibico"]{--c:var(--disc-caraibico)}
[data-disc="ladystyle"]{--c:var(--disc-ladystyle)}
[data-disc="pole"]{--c:var(--disc-pole)}
[data-disc="hiphop"]{--c:var(--disc-hiphop)}
[data-disc="multisport"]{--c:var(--disc-multisport)}
[data-disc="fitness"]{--c:var(--disc-fitness)}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--black);color:var(--text-primary);font-family:var(--font-body);font-weight:300;-webkit-font-smoothing:antialiased;padding-bottom:88px;overflow-x:hidden}
a{color:var(--spectrum-pink);text-decoration:none}
a:hover{color:var(--action-primary-hover)}
img{max-width:100%}
.wrap{max-width:1200px;margin:0 auto;padding-left:clamp(20px,5vw,64px);padding-right:clamp(20px,5vw,64px)}
section{padding-top:clamp(52px,7vw,104px);padding-bottom:clamp(52px,7vw,104px)}
.hair{border-top:1px solid var(--border-hairline)}
.hair-b{border-bottom:1px solid var(--border-hairline)}

/* NAV */
.nav{position:sticky;top:0;z-index:50;background:rgba(0,0,0,.75);backdrop-filter:blur(22px);border-bottom:1px solid var(--border-hairline)}
.nav .wrap{display:flex;align-items:center;gap:clamp(8px,2vw,28px);padding-top:10px;padding-bottom:10px}
.nav img{height:40px;width:40px;object-fit:cover;display:block}
.navlinks{display:flex;align-items:center;gap:clamp(2px,1.2vw,18px);flex:1;overflow-x:auto;min-width:0;scrollbar-width:none}
.navlinks::-webkit-scrollbar{display:none}
.navlinks a{font-family:var(--font-display);font-weight:800;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);padding:8px;white-space:nowrap}
.navlinks a:hover{color:#fff}

/* TIPOGRAFIA */
.eyebrow{margin:0 0 10px;font-family:var(--font-display);font-weight:800;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--c)}
.eyebrow-muted{color:var(--text-muted)}
h1{margin:0;font-family:var(--font-display);font-weight:900;font-size:clamp(34px,min(7vw,11cqw),88px);line-height:1.05;letter-spacing:-.02em;text-transform:uppercase;text-shadow:0 6px 28px rgba(0,0,0,.85);overflow-wrap:anywhere;hyphens:auto}
h1 .grad{display:inline-block;max-width:100%}
.hero-grid > div{min-width:0;container-type:inline-size}
.hero-center{container-type:inline-size}
h2{margin:0 0 clamp(22px,3vw,40px);font-family:var(--font-display);font-weight:900;font-size:clamp(28px,4.4vw,52px);line-height:1.15;letter-spacing:-.01em;text-transform:uppercase}
h3{margin:0 0 6px;font-weight:600;font-size:20px}
.grad{background:var(--gradient-headline);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{margin:clamp(14px,2vw,22px) 0 clamp(22px,3vw,32px);font-size:clamp(15px,1.6vw,20px);line-height:1.5;color:var(--text-secondary);text-wrap:pretty;max-width:46ch}
.body{margin:0;font-size:clamp(15px,1.5vw,18px);line-height:1.5;color:var(--text-secondary);text-wrap:pretty;max-width:52ch}
.small{margin:0;font-size:14px;line-height:1.5;color:var(--text-secondary)}
.muted{color:var(--text-muted)}
.note{margin:16px 0 0;font-size:14px;color:var(--text-faint)}

/* BOTTONI */
.btn,.btn-ghost{display:inline-block;text-align:center;padding:18px 32px;font-family:var(--font-display);font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase;border-radius:2px;transition:box-shadow .2s cubic-bezier(.22,.61,.36,1),background .2s}
.btn{background:var(--action-primary);color:#fff}
.btn:hover{background:var(--action-primary-hover);box-shadow:var(--glow-pink);color:#fff}
.btn-ghost{background:transparent;box-shadow:inset 0 0 0 1.5px var(--border-solid);color:#fff}
.btn-ghost:hover{box-shadow:inset 0 0 0 1.5px var(--border-strong);color:#fff}
.actions{display:flex;flex-wrap:wrap;gap:12px}
.actions .btn,.actions .btn-ghost{flex:1 1 190px}

/* HERO */
.hero{position:relative;overflow:hidden;min-height:min(86vh,700px);display:flex;align-items:center;padding:clamp(48px,8vw,104px) 0}
.hero::before{content:"";position:absolute;inset:0;background:var(--gradient-vignette)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--gradient-spectrum)}
.hero .wrap{position:relative;width:100%}
.hero-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:clamp(28px,4vw,64px);align-items:center}
.hero-center{text-align:center;display:flex;flex-direction:column;align-items:center;max-width:820px;margin:0 auto}
.hero-center .lead,.hero-center .actions{max-width:520px}
.hero-center .actions{width:100%;justify-content:center}
.hero-logo{width:clamp(230px,32vw,380px);height:auto;display:block;margin-bottom:clamp(16px,2.5vw,28px)}

/* SOCIAL */
.socials{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:22px}
.socials .lbl{margin:0 4px 0 0;font-family:var(--font-display);font-weight:800;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-faint)}
.soc{display:flex;align-items:center;gap:8px;padding:11px 16px;background:var(--surface-card);box-shadow:inset 0 0 0 1px var(--border-hairline);color:#fff;font-family:var(--font-display);font-weight:800;font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.soc:hover{box-shadow:inset 0 0 0 1px var(--border-strong);color:#fff}
.ic{width:19px;height:19px;flex:none;display:block;color:var(--c)}
.soc .ic,.row .ic{margin-right:-2px}
.dash{width:18px;height:6px;border-radius:999px;background:var(--c);flex:none;display:inline-block}

/* LEGENDA */
.legend{display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:center;padding:20px 0}
.legend span.item{display:flex;align-items:center;gap:8px;font-family:var(--font-display);font-weight:800;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-secondary)}

/* CARD E GRIGLIE */
.grid{display:grid;gap:12px}
.g-corsi{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.g-260{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.g-220{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.g-280{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.g-240{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.g-170{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:clamp(24px,3.5vw,56px);align-items:center}
.card{position:relative;background:var(--surface-card);box-shadow:inset 0 0 0 1px var(--border-hairline)}
.card.lift{box-shadow:inset 0 0 0 1px var(--border-hairline),var(--shadow-card)}
.card .pad{padding:22px 22px 22px 26px}
.card .bar{position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--c)}
a.card:hover{box-shadow:inset 0 0 0 1px var(--border-strong)}
.plain{padding:24px;box-shadow:inset 0 0 0 1px var(--border-hairline)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.stat{padding:24px 20px;box-shadow:inset 0 0 0 1px var(--border-hairline)}
.stat b{display:block;margin-bottom:6px;font-family:var(--font-display);font-weight:900;font-size:clamp(26px,3vw,38px);line-height:1}
.stat span{font-family:var(--font-display);font-weight:800;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted)}
.step b{display:block;margin-bottom:10px;font-family:var(--font-display);font-weight:900;font-size:36px;line-height:1;color:var(--c)}
.badge{display:inline-block;padding:2px 7px;background:var(--spectrum-amber);color:#000;font-family:var(--font-display);font-weight:800;font-size:9px;letter-spacing:.08em}

/* SEGNAPOSTO FOTO — sostituire con <img class="foto" src="assets/foto/....jpg" alt=""> */
.ph{display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;background:var(--ink-800);box-shadow:inset 0 0 0 1px var(--border-hairline);color:var(--text-faint);font-size:13px;letter-spacing:.08em;text-transform:uppercase;font-family:var(--font-display);font-weight:800}
.foto{display:block;width:100%;height:100%;object-fit:cover}
.foto.r45,.foto.r43,.foto.r1610{height:auto}
.r45{aspect-ratio:4/5}
.r43{aspect-ratio:4/3}
.r1610{aspect-ratio:16/10}

/* TABELLONE ORARI */
.board-scroll{overflow-x:auto;padding-bottom:8px}
.board{display:grid;gap:8px}
.board .head{margin:0;display:flex;align-items:center;justify-content:center;padding:14px 8px;box-shadow:inset 0 0 0 1.5px var(--border-solid);font-family:var(--font-display);font-weight:800;font-size:13px;letter-spacing:.16em;text-transform:uppercase}
.board .hour{margin:0;display:flex;align-items:center;justify-content:center;padding:16px 8px;box-shadow:inset 0 0 0 1px var(--border-hairline);font-family:var(--font-display);font-weight:800;font-size:13px;letter-spacing:.08em}
.board .empty{box-shadow:inset 0 0 0 1px var(--border-hairline)}
.board .stack{display:flex;flex-direction:column;gap:6px;justify-content:center}
.slot{position:relative;display:flex;flex-direction:column;justify-content:center;padding:14px 12px 14px 18px;background:color-mix(in srgb, var(--c) 12%, transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--c) 50%, transparent)}
.slot .bar{position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--c)}
.slot p{margin:0;font-weight:600;font-size:16px;line-height:1.2}
.slot small{margin-top:2px;font-weight:300;font-size:13px;color:var(--text-muted)}
.stack .slot{flex:1;padding:8px 12px 8px 16px}
.stack .slot p{font-size:13px}
.stack .slot small{font-size:11px}
.slot .badge{align-self:flex-start;margin-bottom:4px}

/* CTA FASCIA */
.cta{position:relative;overflow:hidden;border-top:1px solid var(--border-hairline);border-bottom:1px solid var(--border-hairline);text-align:center}
.cta::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--gradient-spectrum)}
.cta .wrap{max-width:900px}
.cta .actions{justify-content:center}
.cta .actions .btn,.cta .actions .btn-ghost{flex:0 1 auto}

/* BOX CONTATTO */
.contact-box{display:flex;flex-direction:column;gap:12px;padding:clamp(22px,3vw,34px);background:var(--surface-card);box-shadow:inset 0 0 0 1.5px var(--border-solid)}
.contact-box .ttl{margin:0;font-family:var(--font-display);font-weight:800;font-size:13px;letter-spacing:.16em;text-transform:uppercase}
.rows{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}
.row{display:flex;align-items:center;gap:14px;padding:18px;background:var(--surface-card);box-shadow:inset 0 0 0 1px var(--border-hairline);color:#fff;font-weight:600;font-size:14px}
.row:hover{box-shadow:inset 0 0 0 1px var(--border-strong);color:#fff}
.map{overflow:hidden;box-shadow:inset 0 0 0 1px var(--border-hairline)}
.map iframe{width:100%;height:clamp(220px,32vw,380px);border:0;display:block;filter:grayscale(.4) invert(.92) contrast(.92)}

/* FOOTER + BARRA FISSA */
footer{border-top:1px solid var(--border-hairline);padding:clamp(28px,4vw,56px) clamp(20px,5vw,64px);text-align:center}
footer .rule{display:block;height:3px;background:var(--gradient-spectrum);margin:0 auto 22px;max-width:160px}
footer .flinks{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-bottom:16px}
footer a,footer .brand{font-family:var(--font-display);font-weight:800;font-size:11px;letter-spacing:.16em;text-transform:uppercase}
footer .brand{display:block;margin-bottom:8px;font-size:13px;color:#fff}
footer .copy{margin:0;font-size:11px;color:var(--text-faint)}
.sticky{position:fixed;left:0;right:0;bottom:0;z-index:60;background:rgba(0,0,0,.78);backdrop-filter:blur(22px);border-top:1px solid var(--border-hairline)}
.sticky .wrap{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding-top:12px;padding-bottom:16px}
.sticky p{margin:0;font-family:var(--font-display);font-weight:800;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted);flex:1 1 160px}
.sticky .btn{flex:1 1 200px;padding:14px 24px}

/* EVENTI */
.evento{position:relative;display:grid;grid-template-columns:96px 1fr;gap:0;background:var(--surface-card);box-shadow:inset 0 0 0 1px var(--border-hairline)}
.evento .bar{position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--c)}
.evento .data{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:18px 8px;box-shadow:inset -1px 0 0 var(--border-hairline)}
.evento .data b{font-family:var(--font-display);font-weight:900;font-size:30px;line-height:1}
.evento .data span{margin-top:4px;font-family:var(--font-display);font-weight:800;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted)}
.evento .info{padding:18px 22px}
.evento h3{margin:0 0 6px}
.evento .luogo{margin:0 0 8px;font-family:var(--font-display);font-weight:800;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted)}
.evento .btn{margin-top:14px;padding:13px 22px}
.evento.passato{opacity:.62}
.evento.passato .data b,.evento.passato h3{color:var(--text-secondary)}
@media (max-width:420px){.evento{grid-template-columns:76px 1fr}.evento .info{padding:16px}}

/* CONSOLE EVENTI */
.console{max-width:960px;margin:0 auto;padding:40px clamp(20px,5vw,48px) 80px}
.campo{display:block;margin-bottom:16px}
.campo span{display:block;margin-bottom:6px;font-family:var(--font-display);font-weight:800;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted)}
.campo input,.campo textarea{width:100%;padding:14px 16px;background:var(--ink-800);color:#fff;border:0;box-shadow:inset 0 0 0 1px var(--border-hairline);border-radius:2px;font-family:var(--font-body);font-size:15px;font-weight:300}
.campo input:focus,.campo textarea:focus{outline:0;box-shadow:inset 0 0 0 1.5px var(--spectrum-cyan)}
.campo textarea{min-height:96px;resize:vertical}
.uscita{width:100%;min-height:220px;padding:16px;background:#000;color:var(--spectrum-cyan);box-shadow:inset 0 0 0 1px var(--border-hairline);border:0;border-radius:2px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;line-height:1.5;white-space:pre;overflow:auto}
.riga-evento{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--surface-card);box-shadow:inset 0 0 0 1px var(--border-hairline)}
.riga-evento .t{flex:1;min-width:0;font-weight:600;font-size:14px}
.riga-evento .d{font-size:13px;color:var(--text-muted);white-space:nowrap}
.mini{padding:9px 14px;font-family:var(--font-display);font-weight:800;font-size:11px;letter-spacing:.08em;text-transform:uppercase;border-radius:2px;border:0;cursor:pointer;background:transparent;box-shadow:inset 0 0 0 1px var(--border-hairline);color:#fff}
.mini:hover{box-shadow:inset 0 0 0 1px var(--border-strong)}
.mini.del:hover{box-shadow:inset 0 0 0 1px var(--spectrum-crimson);color:var(--spectrum-crimson)}
button.btn{border:0;cursor:pointer;font-family:var(--font-display)}

/* PAGINE LEGALI */
.legale{max-width:820px;margin:0 auto;padding:clamp(36px,6vw,72px) clamp(20px,5vw,48px) 80px}
.legale h1{font-size:clamp(30px,5vw,52px);margin-bottom:10px}
.legale h2{font-size:clamp(20px,2.6vw,28px);margin:40px 0 12px;letter-spacing:0}
.legale h3{font-size:18px;margin:26px 0 8px}
.legale p,.legale li{font-size:15px;line-height:1.65;color:var(--text-secondary);max-width:70ch}
.legale ul{padding-left:20px;margin:0 0 14px}
.legale li{margin-bottom:6px}
.legale .agg{margin-bottom:34px;font-family:var(--font-display);font-weight:800;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-faint)}
.legale table{width:100%;border-collapse:collapse;margin:14px 0 20px;font-size:14px}
.legale th,.legale td{text-align:left;padding:12px 14px;box-shadow:inset 0 0 0 1px var(--border-hairline);color:var(--text-secondary);vertical-align:top}
.legale th{font-family:var(--font-display);font-weight:800;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#fff}
.vuoto{display:inline-block;padding:1px 7px;background:rgba(255,176,26,.16);box-shadow:inset 0 0 0 1px var(--spectrum-amber);color:var(--spectrum-amber);font-family:var(--font-display);font-weight:800;font-size:11px;letter-spacing:.08em}

/* BANNER COOKIE */
.cookie{position:fixed;left:0;right:0;bottom:0;z-index:80;background:rgba(0,0,0,.92);backdrop-filter:blur(22px);border-top:1px solid var(--border-strong)}
.cookie .in{max-width:1200px;margin:0 auto;padding:20px clamp(20px,5vw,64px);display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center;justify-content:space-between}
.cookie p{margin:0;flex:1 1 320px;font-size:14px;line-height:1.55;color:var(--text-secondary)}
.cookie .azioni{display:flex;flex-wrap:wrap;gap:10px}
.cookie .btn,.cookie .btn-ghost{padding:14px 24px}
body.cookie-aperto .sticky{display:none}

/* SEGNAPOSTO MAPPA */
.mappa-off{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;height:clamp(220px,32vw,380px);padding:24px;background:var(--ink-800);box-shadow:inset 0 0 0 1px var(--border-hairline)}
.mappa-off p{margin:0;max-width:44ch;font-size:14px;line-height:1.55;color:var(--text-muted)}

/* VIDEO */
/* A — video come sfondo di sezione */
.video-bg{position:relative;overflow:hidden}
.video-bg > video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.video-bg::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.78) 45%,rgba(0,0,0,.55) 100%),var(--gradient-vignette)}
.video-bg > .wrap{position:relative;z-index:2}
.video-bg .stat{background:rgba(0,0,0,.55);backdrop-filter:blur(10px)}
.video-bg .rule-top{position:absolute;left:0;right:0;top:0;height:4px;background:var(--gradient-spectrum);z-index:3}
@media (max-width:640px){.video-bg::after{background:linear-gradient(180deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.88) 60%,rgba(0,0,0,.94) 100%)}}

/* B — video come contenuto */
.video-box{position:relative;overflow:hidden;background:#000;box-shadow:inset 0 0 0 1px var(--border-hairline),var(--shadow-card)}
.video-box video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:#000}
.video-box .rule{position:absolute;left:0;right:0;top:0;height:4px;background:var(--gradient-spectrum);z-index:3;pointer-events:none}
.video-play{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;border:0;cursor:pointer;background:rgba(0,0,0,.42);color:#fff;font-family:var(--font-display);font-weight:800;font-size:13px;letter-spacing:.16em;text-transform:uppercase;transition:background .2s cubic-bezier(.22,.61,.36,1)}
.video-play:hover{background:rgba(0,0,0,.28)}
.video-play .tri{width:74px;height:74px;border-radius:999px;background:var(--action-primary);display:flex;align-items:center;justify-content:center;box-shadow:var(--glow-pink)}
.video-play .tri::before{content:"";width:0;height:0;margin-left:6px;border-left:22px solid #fff;border-top:14px solid transparent;border-bottom:14px solid transparent}
.video-play[hidden]{display:none}
