/* ============================================================
   OPLITAGAMING — demo completa (struttura del Website Master Brief)
   Linguaggio: ossidiana e marmo, rosso Oplita, segno Λ.
   Aggressività 1/10: superfici piatte, bordi sottili, poche animazioni.
   ============================================================ */
:root{
  --ossidiana:#111317;--ossidiana-2:#181b21;--linea:#2a2e36;--linea-2:#3a3f4a;
  --marmo:#ebe7df;--marmo-2:#e2ddd3;--vena:#c9c3b8;--vena-scura:#a39c90;
  --pietra:#c1c1c1;--cremisi:#b20830;--cremisi-chiaro:#d9143f;--oro:#e6b31e;
  --inchiostro:#1f1b18;--inchiostro-2:#5a5249;--latte:#f4f1ea;
  --testo:#d8d4cc;--testo-2:#9a958c;
  --display:"Cinzel",Georgia,serif;--corpo:"Manrope",system-ui,sans-serif;
  --gutter:clamp(20px,5vw,72px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html{background:var(--ossidiana) !important;min-width:100vw;min-height:100%}
body{font-family:var(--corpo);font-size:16px;line-height:1.6;color:var(--testo);background:var(--ossidiana);overflow-x:hidden;min-width:100vw;min-height:100svh}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--cremisi-chiaro);outline-offset:3px}
h1,h2,h3,h4{font-family:var(--display);font-weight:700;line-height:1.08;letter-spacing:.01em}
.wrap{width:min(1180px,100% - 2*var(--gutter));margin-inline:auto}
.stretta{max-width:720px}
[hidden]{display:none!important}

/* grana di pietra */
.grana{position:relative;isolation:isolate}
.grana::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.14;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.marmo{background:radial-gradient(120% 60% at 20% 0%,rgba(255,255,255,.55),transparent 60%),radial-gradient(80% 50% at 90% 100%,rgba(163,156,144,.35),transparent 60%),var(--marmo);color:var(--inchiostro)}
.marmo.grana::before{opacity:.2}
.fregio{height:26px;background-color:var(--marmo-2);background-repeat:repeat-x;background-size:36px 26px;border-top:1px solid var(--vena);border-bottom:1px solid var(--vena);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='26' viewBox='0 0 36 26'%3E%3Cpath d='M0 22H36M31 22V4H7V16H23V10H13' fill='none' stroke='%23a39c90' stroke-width='2.2'/%3E%3C/svg%3E")}
.fregio.scuro{background-color:var(--ossidiana-2);border-color:var(--linea);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='26' viewBox='0 0 36 26'%3E%3Cpath d='M0 22H36M31 22V4H7V16H23V10H13' fill='none' stroke='%23383d47' stroke-width='2.2'/%3E%3C/svg%3E")}

/* marchio */
.marchio-uso{--f-cerchio:var(--pietra);--f-lambda:var(--cremisi)}
.marchio-uso.su-marmo{--f-cerchio:var(--vena-scura)}
.lambda-piccola{--f-lambda:var(--cremisi)}

/* ---------- navigazione ---------- */
nav{position:fixed;inset:0 0 auto 0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px var(--gutter);
  background:rgba(17,19,23,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.04)}
nav.su-marmo{background:rgba(235,231,223,.94);color:var(--inchiostro);border-bottom-color:var(--vena)}
.nav-marchio{display:flex;align-items:center;gap:12px;font-weight:700;letter-spacing:.02em;white-space:nowrap}
.nav-marchio svg{width:32px;height:34px}
.nav-link{display:flex;gap:22px;font-size:14px;font-weight:600;align-items:center}
.nav-link a{opacity:.78}
.nav-link a:hover,.nav-link a.attivo{opacity:1}
.nav-tcg{color:var(--oro)}
.nav-cta{display:flex;gap:10px;align-items:center}
.nav-cta .btn{padding:10px 16px;font-size:13.5px}
.nav-burger{display:none;width:42px;height:42px;place-items:center;border:1px solid var(--linea-2);border-radius:2px}
.nav-burger span{display:block;width:18px;height:2px;background:currentColor;box-shadow:0 -6px 0 currentColor,0 6px 0 currentColor}
.menu-mobile{position:fixed;inset:66px 0 0 0;z-index:49;background:var(--ossidiana);padding:24px var(--gutter);display:none;flex-direction:column;gap:6px;overflow:auto}
.menu-mobile.on{display:flex}
.menu-mobile a{padding:14px 0;border-bottom:1px solid var(--linea);font-size:17px;font-weight:600;color:var(--latte)}
.menu-mobile .btn{margin-top:18px;justify-content:center}
@media(max-width:1060px){.nav-link{display:none}.nav-burger{display:grid}.nav-cta .btn-secondario{display:none}}
@media(max-width:480px){.nav-marchio span{display:none}}

/* ---------- bottoni ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 24px;font-weight:700;font-size:15px;border:1px solid currentColor;border-radius:2px;transition:transform .2s cubic-bezier(.2,.8,.2,1),background .2s,color .2s,border-color .2s;white-space:nowrap}
.btn:hover{transform:translateY(-1px)}
.btn-cremisi{background:var(--cremisi);border-color:var(--cremisi);color:#fff}
.btn-cremisi:hover{background:var(--cremisi-chiaro);border-color:var(--cremisi-chiaro)}
.btn-marmo{color:var(--latte)}
.btn-marmo:hover{background:rgba(255,255,255,.06)}
.btn-inchiostro{color:var(--inchiostro)}
.btn-inchiostro:hover{background:rgba(31,27,24,.06)}
.btn-oro{background:var(--oro);border-color:var(--oro);color:#1a1300}
.btn-piccolo{padding:9px 14px;font-size:13.5px}
.ctas{display:flex;gap:12px;flex-wrap:wrap}

/* ---------- tipografia sezioni ---------- */
section,.blocco{padding:clamp(56px,8vw,104px) 0}
.blocco.compatto{padding:clamp(36px,5vw,64px) 0}
.testata{display:grid;gap:12px;margin-bottom:clamp(28px,4vw,48px);max-width:64ch}
.testata h2{font-size:clamp(28px,4vw,46px)}
.testata p{font-size:17px}
.testata .riga{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}
.testata:has(.riga){max-width:none}
.testata:has(.riga) p{max-width:64ch}
.marmo h2,.marmo h1{color:#cfc9be;text-shadow:1px 1px 0 rgba(255,255,255,.9),-1px -1px 0 rgba(90,82,72,.55)}
.marmo .testata p,.marmo p{color:var(--inchiostro-2)}
.marmo .testata p{color:var(--inchiostro)}
.scuro h2,.scuro h1{color:var(--latte)}
.scuro .testata h2::after,.scuro .testata h1::after{content:"";display:block;width:56px;height:3px;background:var(--cremisi);margin-top:16px}
.link-oro{color:var(--oro);font-weight:700}
.link{font-weight:700;border-bottom:1px solid transparent}
.link:hover{border-bottom-color:currentColor}
.scuro .link{color:var(--latte)}
.marmo .link{color:var(--inchiostro)}
.nota{font-size:13px;color:var(--testo-2)}
.marmo .nota{color:var(--inchiostro-2)}

/* ---------- pannelli (superfici piatte, bordo sottile) ---------- */
.pannelli{display:grid;gap:1px;background:var(--linea);border:1px solid var(--linea)}
.pannelli>*{background:var(--ossidiana);padding:24px}
.marmo .pannelli{background:var(--vena);border-color:var(--vena)}
.marmo .pannelli>*{background:rgba(255,255,255,.35)}
.col-2{grid-template-columns:repeat(2,1fr)}.col-3{grid-template-columns:repeat(3,1fr)}.col-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.col-3,.col-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.col-2,.col-3,.col-4{grid-template-columns:1fr}}
.pannelli h3{font-size:18px;margin-bottom:8px}
.scuro .pannelli h3{color:var(--latte)}
.marmo .pannelli h3{color:var(--inchiostro)}
.pannelli p{font-size:14.5px}
.scuro .pannelli p{color:var(--testo-2)}
.etichetta{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.06em;padding:4px 9px;border:1px solid currentColor;border-radius:2px;margin-bottom:12px}
.etichetta.cremisi{color:var(--cremisi-chiaro);border-color:var(--cremisi)}
.etichetta.oro{color:var(--oro)}
.etichetta.verde{color:#5cc48f;border-color:#2e7d55}
.etichetta.grigia{color:var(--testo-2)}

/* ---------- hero ---------- */
#hero{position:relative;min-height:100svh;display:grid;place-items:center;text-align:center;padding:130px var(--gutter) 80px;--mx:50%;--my:42%;overflow:hidden}
#hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(520px 520px at var(--mx) var(--my),rgba(178,8,48,.18),rgba(178,8,48,.05) 40%,transparent 70%)}
.hero-in{position:relative;z-index:1;display:grid;justify-items:center;gap:26px;max-width:900px}
.scudo{position:relative;width:clamp(150px,26vw,260px);aspect-ratio:592/630;overflow:hidden}
.scudo svg{width:100%;height:100%}
.scudo .luce{position:absolute;inset:-10%;pointer-events:none;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);mix-blend-mode:screen;transform:translateX(-120%);animation:sweep 1.6s cubic-bezier(.4,0,.2,1) .45s 1 forwards}
@keyframes sweep{70%{opacity:1}to{transform:translateX(120%);opacity:0}}
.hero-in>*{opacity:0;transform:translateY(12px);animation:alza .9s cubic-bezier(.2,.8,.2,1) forwards}
.hero-in>.scudo{animation-delay:.1s}.hero-in>h1{animation-delay:.5s}.hero-in>p{animation-delay:.7s}.hero-in>.ctas{animation-delay:.85s}
@keyframes alza{to{opacity:1;transform:none}}
#hero h1{font-size:clamp(30px,5.6vw,66px);font-weight:900;color:var(--latte);text-wrap:balance}
#hero p{font-size:clamp(16px,1.6vw,19px);max-width:58ch}
.hero-in .ctas{justify-content:center}

/* credibility bar */
.numeri{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--vena);border-top:1px solid var(--vena);border-bottom:1px solid var(--vena)}
.numeri div{background:var(--marmo-2);padding:22px 18px;text-align:center}
.numeri b{display:block;font-family:var(--display);font-size:clamp(24px,3vw,36px);font-weight:700;color:var(--inchiostro);line-height:1;margin-bottom:6px}
.numeri span{font-size:13px;color:var(--inchiostro-2)}
@media(max-width:800px){.numeri{grid-template-columns:repeat(3,1fr)}.numeri div:nth-child(n+4){border-top:1px solid var(--vena)}}
@media(max-width:480px){.numeri{grid-template-columns:repeat(2,1fr)}}

/* Oplita in 20 secondi */
.venti{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,56px)}
.venti h3{font-size:20px;color:var(--inchiostro);margin-bottom:10px}
.venti p{font-size:15.5px;color:var(--inchiostro-2)}
@media(max-width:800px){.venti{grid-template-columns:1fr}}

/* home: blocco con immagine/logo a lato */
.lato{display:grid;grid-template-columns:1fr minmax(240px,380px);gap:clamp(28px,6vw,80px);align-items:center}
.lato.inverso{grid-template-columns:minmax(240px,380px) 1fr}
.lato .stemma img{width:100%;filter:drop-shadow(0 30px 40px rgba(0,0,0,.6))}
@media(max-width:860px){.lato,.lato.inverso{grid-template-columns:1fr}.lato .stemma{max-width:280px;margin-inline:auto}.lato.inverso .stemma{order:-1}}

/* roster / player */
.roster{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.roster a{background:var(--ossidiana);border:1px solid var(--linea);padding:22px;display:grid;gap:8px;transition:background .2s,border-color .2s}
.roster a:hover{border-color:var(--linea-2)}
.roster a:hover{background:var(--ossidiana-2)}
.avatar{width:56px;height:56px;border-radius:50%;background:linear-gradient(140deg,#2a2e36,#181b21);border:1px solid var(--linea-2);display:grid;place-items:center;font-family:var(--display);font-weight:900;color:var(--latte);font-size:20px}
.roster h3{font-size:17px;color:var(--latte)}
.roster .ruolo{font-size:13px;color:var(--testo-2)}
.roster .wl{font-size:13px;color:var(--testo-2)}
.roster .wl b{color:var(--latte)}
@media(max-width:900px){.roster{grid-template-columns:repeat(2,1fr)}}

/* tavole */
.tabs{display:flex;gap:4px;margin-bottom:22px;border-bottom:1px solid var(--linea);overflow:auto}
.marmo .tabs{border-bottom-color:var(--vena)}
.tab{padding:12px 16px;font-weight:700;font-size:14.5px;color:var(--testo-2);border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.marmo .tab{color:var(--vena-scura)}
.tab[aria-selected="true"]{color:var(--latte);border-bottom-color:var(--cremisi)}
.marmo .tab[aria-selected="true"]{color:var(--inchiostro)}
.tavola{width:100%;border-collapse:collapse;font-size:15px}
.tavola th{text-align:left;font-weight:600;font-size:12px;letter-spacing:.06em;color:var(--testo-2);padding:10px 12px;border-bottom:1px solid var(--linea)}
.tavola td{padding:13px 12px;border-bottom:1px solid var(--linea);vertical-align:middle;color:var(--testo)}
.tavola tr:last-child td{border-bottom:0}
.tavola .num{text-align:right;font-variant-numeric:tabular-nums}
.tavola .pos{font-family:var(--display);font-weight:900;font-size:20px;width:60px;color:var(--testo-2)}
.tavola .pos i{font-style:normal}
.tavola tr.podio .pos i{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;border:2px solid var(--cremisi);color:var(--cremisi-chiaro);font-size:15px;line-height:1}
.marmo .tavola tr.podio .pos i{color:var(--cremisi);background:rgba(255,255,255,.5)}
.tavola .nome{font-weight:700;color:var(--latte)}
.tavola .sec{color:var(--testo-2);font-size:13px}
.tavola .punti{font-family:var(--display);font-weight:700;font-size:17px;color:var(--latte)}
.tavola .lnk{border-bottom:1px solid transparent}.tavola .lnk:hover{border-bottom-color:currentColor}
.tavola .lauro{display:inline-block;width:14px;height:11px;margin-right:8px}
.marmo .tavola th{color:var(--vena-scura);border-bottom-color:var(--vena)}
.marmo .tavola td{border-bottom-color:var(--vena);color:var(--inchiostro)}
.marmo .tavola .nome,.marmo .tavola .punti{color:var(--inchiostro)}
.marmo .tavola .pos{color:var(--vena-scura)}.marmo .tavola tr.podio .pos{color:var(--cremisi)}
.marmo .tavola .sec{color:var(--vena-scura)}
.marmo .tavola tr.podio td{background:rgba(255,255,255,.35)}
@media(max-width:640px){.tavola .sec,.tavola .kd{display:none}}

/* eventi */
.eventi{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--linea);border:1px solid var(--linea)}
.evento{background:var(--ossidiana);padding:22px;display:grid;grid-template-rows:auto 1fr auto;gap:14px}
.evento .data{font-family:var(--display);font-weight:700;font-size:14px;letter-spacing:.08em;color:var(--testo-2)}
.evento .data b{display:block;font-size:34px;color:var(--latte);line-height:1;margin-top:4px}
.evento h3{font-size:18px;color:var(--latte);margin-bottom:6px}
.evento p{font-size:14px;color:var(--testo-2)}
.evento .meta{display:flex;gap:10px;flex-wrap:wrap;font-size:12.5px;color:var(--testo-2)}
.evento .piede{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
@media(max-width:900px){.eventi{grid-template-columns:1fr}}

/* scheda evento */
.scheda{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(28px,5vw,64px);align-items:start}
.scheda-info{display:grid;gap:1px;background:var(--linea);border:1px solid var(--linea)}
.scheda-info div{background:var(--ossidiana);padding:14px 18px;display:grid;grid-template-columns:130px 1fr;gap:10px;font-size:14.5px}
.scheda-info div span:first-child{color:var(--testo-2)}
.scheda-info div span:last-child{color:var(--latte);font-weight:600}
.copertina{aspect-ratio:16/9;background:linear-gradient(140deg,#1d2027,#111317);border:1px solid var(--linea);display:grid;place-items:center;color:var(--testo-2);font-size:13px;position:relative;overflow:hidden;margin-bottom:22px}
.copertina svg{width:120px;opacity:.25}
@media(max-width:860px){.scheda{grid-template-columns:1fr}}

/* form */
.form{display:grid;gap:14px;max-width:560px}
.form label{display:grid;gap:6px;font-size:13.5px;font-weight:600;color:var(--testo-2)}
.form input,.form select,.form textarea{padding:12px 14px;border:1px solid var(--linea-2);background:var(--ossidiana-2);color:var(--latte);border-radius:2px}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--vena-scura)}
.form textarea{min-height:110px;resize:vertical}
.form .due{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form .consenso{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;font-weight:500;color:var(--testo)}
.form .consenso input{width:18px;height:18px;margin-top:3px}
.marmo .form label{color:var(--inchiostro-2)}
.marmo .form input,.marmo .form select,.marmo .form textarea{background:rgba(255,255,255,.6);color:var(--inchiostro);border-color:var(--vena)}
.marmo .form .consenso{color:var(--inchiostro)}
@media(max-width:560px){.form .due{grid-template-columns:1fr}}

/* tesseramento */
.piani{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--vena);border:1px solid var(--vena)}
.piano{background:rgba(255,255,255,.35);padding:30px 26px;display:grid;grid-template-rows:auto auto 1fr auto;gap:18px}
.piano.consigliato{background:var(--ossidiana);color:var(--testo);outline:1px solid var(--cremisi);outline-offset:-1px}
.piano h3{font-size:22px;color:var(--inchiostro)}
.piano.consigliato h3{color:var(--latte)}
.piano .prezzo{font-family:var(--display);font-size:38px;font-weight:700;color:var(--inchiostro);line-height:1}
.piano .prezzo small{font-family:var(--corpo);font-size:14px;font-weight:600;color:var(--inchiostro-2);margin-left:6px}
.piano.consigliato .prezzo{color:var(--latte)}.piano.consigliato .prezzo small{color:var(--testo-2)}
.piano ul{list-style:none;display:grid;gap:9px;font-size:14.5px;color:var(--inchiostro-2)}
.piano.consigliato ul{color:var(--testo)}
.piano li::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--cremisi);margin-right:10px;vertical-align:1px}
.piano .per{font-size:14px;color:var(--inchiostro-2)}
.piano.consigliato .per{color:var(--testo-2)}
@media(max-width:860px){.piani{grid-template-columns:1fr}}

/* tessera digitale */
.tessera{aspect-ratio:1.586;max-width:420px;border-radius:12px;padding:22px 24px;position:relative;overflow:hidden;color:var(--latte);
  background:linear-gradient(135deg,#1d2027 0%,#111317 55%,#1a0a10 100%);border:1px solid var(--linea-2);box-shadow:0 30px 60px rgba(0,0,0,.5);display:grid;grid-template-rows:auto 1fr auto}
.tessera::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.06) 50%,transparent 60%)}
.tessera .alto{display:flex;justify-content:space-between;align-items:center}
.tessera .alto svg{width:30px;height:32px}
.tessera .alto span{font-family:var(--display);font-size:12px;letter-spacing:.14em;color:var(--testo-2)}
.tessera .nome{font-family:var(--display);font-size:22px;font-weight:700;align-self:end}
.tessera .basso{display:flex;justify-content:space-between;align-items:end;font-size:12px;color:var(--testo-2);margin-top:8px}
.tessera .basso b{display:block;color:var(--latte);font-size:13px;letter-spacing:.06em}
.tessera .piano-tag{color:var(--cremisi-chiaro);font-weight:700;letter-spacing:.08em;font-size:12px}

/* my oplita */
.dash{display:grid;grid-template-columns:minmax(260px,420px) 1fr;gap:clamp(24px,5vw,64px);align-items:start}
.dash-lista{display:grid;gap:1px;background:var(--linea);border:1px solid var(--linea)}
.dash-lista div{background:var(--ossidiana);padding:16px 18px;display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:14.5px}
.dash-lista div span:first-child{color:var(--testo-2)}
.dash-lista div span:last-child{color:var(--latte);font-weight:600;text-align:right}
@media(max-width:860px){.dash{grid-template-columns:1fr}}

/* partner */
.loghi{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:var(--vena);border:1px solid var(--vena)}
.loghi div{background:rgba(255,255,255,.4);aspect-ratio:1.6;display:grid;place-items:center;font-family:var(--display);font-weight:700;color:var(--vena-scura);font-size:18px;letter-spacing:.06em}
@media(max-width:900px){.loghi{grid-template-columns:repeat(3,1fr)}}
@media(max-width:480px){.loghi{grid-template-columns:repeat(2,1fr)}}

/* media */
.media-griglia{display:grid;grid-template-columns:2fr 1fr;gap:1px;background:var(--linea);border:1px solid var(--linea)}
.video{background:var(--ossidiana);padding:18px;display:grid;gap:12px}
.video .frame{aspect-ratio:16/9;background:linear-gradient(140deg,#1d2027,#111317);display:grid;place-items:center;color:var(--testo-2);font-size:13px;border:1px solid var(--linea)}
.video h3{font-size:16px;color:var(--latte)}
.video .lista{display:grid;gap:10px}
.video .lista a{display:grid;grid-template-columns:72px 1fr;gap:12px;align-items:center;font-size:14px;color:var(--testo)}
.video .lista a i{display:block;aspect-ratio:16/9;background:#1d2027;border:1px solid var(--linea)}
.galleria{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.galleria div{aspect-ratio:1;background:linear-gradient(140deg,#1d2027,#111317);border:1px solid var(--linea);display:grid;place-items:end start;padding:10px;font-size:12px;color:var(--testo-2)}
@media(max-width:860px){.media-griglia{grid-template-columns:1fr}.galleria{grid-template-columns:repeat(2,1fr)}}

/* merch */
.prodotti{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--vena);border:1px solid var(--vena)}
.prodotto{background:rgba(255,255,255,.35);padding:18px;display:grid;gap:10px}
.prodotto .foto{aspect-ratio:1;background:linear-gradient(140deg,#f6f3ec,#dcd6cb);border:1px solid var(--vena);display:grid;place-items:center}
.prodotto .foto svg{width:44%;--f-cerchio:var(--vena-scura)}
.prodotto h3{font-size:16px;color:var(--inchiostro)}
.prodotto p{font-size:13.5px;color:var(--inchiostro-2)}
.prodotto .prezzo{font-family:var(--display);font-weight:700;color:var(--inchiostro)}
@media(max-width:900px){.prodotti{grid-template-columns:repeat(2,1fr)}}

/* news */
.news{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--linea);border:1px solid var(--linea)}
.news a{background:var(--ossidiana);padding:22px;display:grid;gap:10px;align-content:start}
.news a:hover{background:var(--ossidiana-2)}
.news time{font-size:12.5px;color:var(--testo-2)}
.news h3{font-size:18px;color:var(--latte)}
.news p{font-size:14px;color:var(--testo-2)}
.articolo{max-width:720px}
.articolo p{margin-bottom:18px;font-size:17px;line-height:1.7}
@media(max-width:900px){.news{grid-template-columns:1fr}}

/* valori / community */
.valori{display:flex;gap:10px;flex-wrap:wrap}
.valori span{font-family:var(--display);font-weight:700;font-size:15px;letter-spacing:.06em;padding:10px 16px;border:1px solid var(--vena-scura);color:var(--inchiostro)}
.regole{list-style:none;display:grid;gap:12px;counter-reset:r}
.regole li{display:grid;grid-template-columns:40px 1fr;gap:12px;font-size:15px;color:var(--inchiostro)}
.regole li::before{counter-increment:r;content:counter(r,upper-roman);font-family:var(--display);font-weight:700;color:var(--cremisi)}

/* pagina generica: testa */
.testa{padding:120px 0 48px;position:relative;overflow:hidden;--mx:50%;--my:50%;
  background:radial-gradient(560px 560px at var(--mx) var(--my),rgba(178,8,48,.16),rgba(178,8,48,.04) 45%,transparent 70%)}
.testa.entra::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(100deg,transparent 38%,rgba(255,255,255,.09) 50%,transparent 62%);
  transform:translateX(-110%);animation:sweep-testa 1.3s cubic-bezier(.4,0,.2,1) .15s 1 forwards}
@keyframes sweep-testa{80%{opacity:1}to{transform:translateX(110%);opacity:0}}
.testa.entra h1,.testa.entra p,.testa.entra .meta,.testa.entra .rango,.testa.entra .ctas,.testa.entra .stemma,.testa.entra .etichetta{animation:alza .8s cubic-bezier(.2,.8,.2,1) both}
.testa.entra p{animation-delay:.12s}.testa.entra .meta,.testa.entra .rango{animation-delay:.2s}.testa.entra .ctas{animation-delay:.28s}.testa.entra .stemma{animation-delay:.1s}
.testa h1{font-size:clamp(34px,5.6vw,64px);font-weight:900;color:var(--latte)}
.testa p{font-size:17px;max-width:64ch;margin-top:12px}
.testa .torna{display:inline-block;font-size:14px;font-weight:600;color:var(--testo-2);margin-bottom:26px}
.testa .torna::before{content:"←";margin-right:8px}
.testa .torna:hover{color:var(--latte)}
.testa .meta{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px;font-size:14.5px;color:var(--testo-2)}
.testa .meta a{color:var(--testo);border-bottom:1px solid var(--linea-2)}
.testa.con-rango{display:grid;grid-template-columns:1fr auto;align-items:end;gap:24px}
.rango b{display:block;font-family:var(--display);font-weight:900;font-size:clamp(40px,6vw,64px);line-height:1;color:var(--cremisi-chiaro)}
.rango span{font-size:13px;color:var(--testo-2)}
@media(max-width:820px){.testa.con-rango{grid-template-columns:1fr}}

/* lastra */
.lastra{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:20px 28px}
.lastra div{border-left:2px solid var(--vena);padding-left:14px}
.lastra b{display:block;font-family:var(--display);font-size:30px;font-weight:700;color:var(--inchiostro);line-height:1;margin-bottom:6px}
.lastra span{font-size:13px;color:var(--inchiostro-2)}
.due{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(28px,6vw,72px);align-items:start}
@media(max-width:820px){.due{grid-template-columns:1fr}}
.grafico{border:1px solid var(--linea);padding:22px 18px 14px}
.grafico svg{width:100%;height:auto}
.grafico .barra{fill:var(--linea)}.grafico .barra.top{fill:var(--cremisi)}
.grafico text{font-family:var(--corpo);font-size:12px;fill:var(--testo-2)}.grafico text.val{fill:var(--latte);font-weight:700}
.stagioni{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;background:var(--linea);border:1px solid var(--linea)}
.stagioni>div{background:var(--ossidiana);padding:22px 24px}
.stagioni small{display:block;font-family:var(--display);font-size:13px;letter-spacing:.1em;color:var(--testo-2);margin-bottom:8px}
.stagioni strong{display:block;font-size:20px;color:var(--latte);margin-bottom:4px}
.stagioni span{font-size:14px;color:var(--testo-2)}
.stagioni .ora strong{color:var(--cremisi-chiaro)}
.social{display:flex;gap:10px;flex-wrap:wrap}
.social a{padding:8px 14px;border:1px solid var(--linea-2);font-size:13px;font-weight:600;color:var(--testo)}
.scudo-org{width:76px;height:76px;position:relative;display:grid;place-items:center;font-family:var(--display);font-weight:900;font-size:20px;color:var(--latte)}
.scudo-org svg{position:absolute;inset:0;width:100%;height:100%}
.scudo-org span{position:relative}
.scudo-org.grande{width:104px;height:104px;font-size:28px}
.falange{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(190px,1fr);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:14px;scrollbar-width:thin}
.falange>a{scroll-snap-align:start;display:grid;justify-items:center;gap:10px;padding:24px 16px 20px;border:1px solid var(--linea);text-align:center}
.falange>a:hover{border-color:var(--vena-scura)}
.falange h3{font-size:16px;color:var(--latte)}
.falange .div{font-size:12px;letter-spacing:.08em;color:var(--testo-2)}
.nemix-riga{display:inline-flex;align-items:center;gap:10px;padding:10px 16px;border:1px solid var(--linea);border-radius:999px;font-size:13px;color:var(--testo-2)}
.nemix-riga b,.nemix-blocco b{color:var(--latte);letter-spacing:.06em}
.nemix-riga:hover{border-color:var(--cremisi);color:var(--latte)}
.nemix-blocco{display:block;margin-top:24px;padding:18px 22px;border:1px solid var(--linea);font-size:14px;color:var(--testo-2)}
.nemix-blocco:hover{border-color:var(--vena-scura);color:var(--testo)}

/* sigillo tondo (partner tecnologico) */
.sigillo{width:96px;height:96px;border-radius:50%;border:2px solid var(--vena-scura);display:grid;place-items:center;text-align:center;line-height:1.1;position:relative;color:var(--inchiostro);background:radial-gradient(circle,rgba(255,255,255,.6),transparent 70%)}
.sigillo::before{content:"";position:absolute;inset:5px;border-radius:50%;border:1px solid var(--vena-scura)}
.sigillo b{font-family:var(--display);font-size:15px;letter-spacing:.08em;display:block}
.sigillo small{font-size:8.5px;letter-spacing:.14em;color:var(--inchiostro-2);font-weight:700}
.scuro .sigillo{border-color:var(--linea-2);color:var(--latte);background:radial-gradient(circle,rgba(255,255,255,.06),transparent 70%)}
.scuro .sigillo::before{border-color:var(--linea-2)}.scuro .sigillo small{color:var(--testo-2)}
.loghi .primo{display:grid;grid-template-rows:auto auto;gap:6px;place-items:center;font-family:var(--corpo);font-size:11px;letter-spacing:.1em;color:var(--inchiostro-2);padding:10px}
.loghi .primo b{font-family:var(--display);font-size:20px;letter-spacing:.08em;color:var(--inchiostro)}
.crediti{display:flex;align-items:center;gap:16px;margin-top:22px;padding-top:18px;border-top:1px solid var(--vena);font-size:13px;color:var(--inchiostro-2)}
.crediti .sigillo{width:64px;height:64px;flex:none}.crediti .sigillo b{font-size:11px}.crediti .sigillo small{font-size:6.5px}
.crediti b.n{color:var(--inchiostro);letter-spacing:.06em}
.crediti a:hover b.n{color:var(--cremisi)}

.medaglione{width:96px;height:96px;border-radius:50%;object-fit:cover;border:2px solid var(--vena-scura);box-shadow:0 10px 26px rgba(0,0,0,.35);background:#03050f;flex:none}
.scuro .medaglione{border-color:var(--linea-2)}
.nemix-tile{width:100%;max-width:230px;border-radius:8px;border:1px solid var(--vena);box-shadow:0 14px 30px rgba(0,0,0,.35)}
.loghi .primo .medaglione{width:46px;height:46px;border-width:1.5px;box-shadow:none}
.crediti .medaglione{width:64px;height:64px}

/* CTA finale */
#finale{text-align:center;background:linear-gradient(180deg,var(--ossidiana),#1a0a10)}
#finale h2{font-size:clamp(30px,5vw,56px);color:var(--latte);margin-bottom:14px}
#finale p{max-width:56ch;margin:0 auto 26px}
#finale .ctas{justify-content:center}

/* footer */
footer{padding:56px 0 34px;border-top:1px solid var(--vena)}
.footer-griglia{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:28px}
.footer-griglia h4{font-family:var(--corpo);font-size:12px;letter-spacing:.08em;color:var(--vena-scura);margin-bottom:12px;font-weight:700}
.footer-griglia a{display:block;font-size:14px;color:var(--inchiostro-2);padding:4px 0}
.footer-griglia a:hover{color:var(--inchiostro)}
.footer-marchio{display:flex;align-items:center;gap:12px;font-family:var(--display);font-weight:700;font-size:18px;color:var(--inchiostro);margin-bottom:12px}
.footer-marchio svg{width:34px;height:36px}
.footer-note{margin-top:34px;padding-top:18px;border-top:1px solid var(--vena);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--vena-scura)}
.footer-note b{color:var(--inchiostro);letter-spacing:.06em}
.footer-note a:hover b{color:var(--cremisi)}
@media(max-width:900px){.footer-griglia{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.footer-griglia{grid-template-columns:1fr}}

.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,16px);z-index:60;background:var(--latte);color:var(--inchiostro);padding:12px 20px;font-size:14px;font-weight:600;border-radius:2px;box-shadow:0 18px 40px rgba(0,0,0,.45);opacity:0;transition:.3s;pointer-events:none;max-width:92vw;text-align:center}
.toast.on{opacity:1;transform:translate(-50%,0)}
.pagina[hidden]{display:none}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}html{scroll-behavior:auto}.hero-in>*{opacity:1;transform:none}.scudo .luce{display:none}.testa.entra::after{display:none}}