/* MIDIA · stile comune dei moduli */
:root{
  --canvas:#0A0608;--panel:#15090D;--panel2:#1C0E13;
  --accent:#EF223A;--accent-hover:#FF4258;
  --oro:#D9AE52;--verde:#2E7D32;
  --text:#F3ECEA;--text-2:#B4A5A8;
  --line:rgba(243,236,234,.12);--line-strong:rgba(243,236,234,.28);
  --display:"Barlow Condensed","Arial Narrow",Impact,sans-serif;
  --body:"Barlow","Helvetica Neue",Arial,sans-serif;
  --mono:"IBM Plex Mono",Menlo,monospace;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box}
html,body{margin:0;overflow-x:hidden}
body{background:var(--canvas);color:var(--text);font-family:var(--body);font-size:17px;line-height:1.5;-webkit-text-size-adjust:100%}
img{max-width:100%;display:block}
h1,h2,h3{font-family:var(--display);font-weight:800;line-height:.95;margin:0;text-transform:uppercase}
p{margin:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.wrap{width:min(680px,92vw);margin:0 auto;padding:0 0 60px}
.top{display:flex;align-items:center;gap:14px;padding:18px 0 14px}
.top .mk{width:40px;height:21px;background:var(--accent);-webkit-mask:url("assets/mark.webp") center/contain no-repeat;mask:url("assets/mark.webp") center/contain no-repeat}
.top b{font-family:var(--display);font-size:24px;letter-spacing:.06em}
.top .wb{height:28px;width:auto;margin-left:auto}
.k{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:10px}
.ev{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--text-2);margin-top:6px}
h1{font-size:clamp(34px,8vw,52px)}
h2{font-size:clamp(24px,5vw,32px)}
.lede{color:var(--text-2);margin-top:12px}
.reel{margin:18px 0 8px;border-radius:10px;overflow:hidden;background:var(--panel);aspect-ratio:9/16;max-height:44vh;display:flex;justify-content:center}
.reel video{height:100%;width:auto;object-fit:cover}
.scelta{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:22px 0 10px}
.scelta button{font-family:var(--display);font-weight:800;font-size:22px;text-transform:uppercase;letter-spacing:.03em;padding:20px 10px;border-radius:8px;border:1px solid var(--line-strong);background:var(--panel);color:var(--text);cursor:pointer;transition:all .3s var(--ease)}
.scelta button:hover{border-color:var(--accent)}
.scelta button.on{background:var(--accent);border-color:var(--accent);color:#fff}
.scelta button small{display:block;font-family:var(--body);font-weight:400;font-size:12px;letter-spacing:0;text-transform:none;color:inherit;opacity:.8;margin-top:4px}
form{margin-top:18px}
.campo{margin-bottom:14px}
.campo label{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-2);display:block;margin-bottom:6px}
.campo input,.campo select,.campo textarea{width:100%;background:rgba(10,6,8,.7);border:1px solid var(--line-strong);border-radius:7px;color:var(--text);font:inherit;padding:13px 14px}
.campo textarea{min-height:70px;resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--accent);outline:none}
.due{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.prodotti{display:grid;gap:8px}
.prodotti label{display:flex;align-items:center;gap:12px;padding:13px 14px;border:1px solid var(--line-strong);border-radius:7px;cursor:pointer;transition:border-color .3s}
.prodotti label:has(input:checked){border-color:var(--accent);background:rgba(239,34,58,.1)}
.prodotti input{accent-color:var(--accent);width:18px;height:18px;flex:none}
.prodotti .nome{font-family:var(--display);font-weight:800;font-size:20px;text-transform:uppercase}
.prodotti .tag{margin-left:auto;font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--oro);text-align:right;line-height:1.3}
.check{display:flex;gap:12px;align-items:flex-start;margin:16px 0;font-size:14px;color:var(--text-2)}
.check input{accent-color:var(--accent);width:20px;height:20px;flex:none;margin-top:2px}
.btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;font-family:var(--display);font-weight:800;font-size:22px;letter-spacing:.04em;text-transform:uppercase;color:#fff;background:var(--accent);border:0;border-radius:8px;padding:18px;cursor:pointer;text-decoration:none;transition:background .3s}
.btn:hover{background:var(--accent-hover)}
.btn[disabled]{opacity:.5;cursor:wait}
.btn.ghost{background:transparent;border:1px solid var(--line-strong);color:var(--text)}
.btn svg{width:22px;height:22px;fill:currentColor}
.nota{font-family:var(--mono);font-size:11px;color:var(--text-2);line-height:1.6;margin-top:12px}
.atleta{border:1px solid var(--line);border-radius:8px;padding:14px;margin-bottom:10px;background:var(--panel)}
.atleta .riga1{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.atleta .num{font-family:var(--mono);font-size:12px;color:var(--accent);letter-spacing:.1em}
.atleta .togli{margin-left:auto;background:none;border:0;color:var(--text-2);font-family:var(--mono);font-size:11px;cursor:pointer;letter-spacing:.1em}
.atleta .togli:hover{color:var(--accent)}
.aggiungi{width:100%;padding:14px;border:1px dashed var(--line-strong);border-radius:8px;background:none;color:var(--text);font-family:var(--display);font-weight:700;font-size:18px;text-transform:uppercase;cursor:pointer}
.aggiungi:hover{border-color:var(--accent);color:var(--accent)}
.sconto{margin:16px 0;padding:16px;border-radius:8px;border:1px solid var(--line-strong);background:var(--panel)}
.sconto .riga{display:flex;justify-content:space-between;align-items:center;gap:12px;font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--text-2);padding:5px 0}
.sconto .riga b{font-family:var(--display);font-size:22px;letter-spacing:.02em;color:var(--text-2)}
.sconto .riga.attiva b,.sconto .riga.attiva{color:var(--oro)}
.grazie{display:none;text-align:center;padding:30px 0 10px}
.grazie.on{display:block}
.grazie .mk{width:80px;height:42px;background:var(--accent);margin:0 auto 20px;-webkit-mask:url("assets/mark.webp") center/contain no-repeat;mask:url("assets/mark.webp") center/contain no-repeat}
.grazie h2{font-size:clamp(28px,6vw,38px)}
.grande{margin:22px 0;padding:22px;border:2px solid var(--accent);border-radius:10px;background:rgba(239,34,58,.12)}
.grande .titolo{font-family:var(--display);font-weight:800;font-size:clamp(26px,6vw,36px);text-transform:uppercase;line-height:1}
.grande p{color:var(--text);margin-top:8px;font-size:15px}
.err{display:none;margin-top:12px;padding:12px 14px;border-radius:7px;border:1px solid var(--accent);background:rgba(239,34,58,.12);font-size:14px}
.err.on{display:block}
footer{border-top:1px solid var(--line);margin-top:30px;padding:18px 0 40px;font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:var(--text-2);text-align:center;line-height:1.8}
@media(max-width:560px){body{font-size:16px}.scelta{grid-template-columns:1fr}.due{grid-template-columns:1fr}}
