/* =====================================================================
   NOVA STUDIO · stile "morbido"
   Si carica sopra agli stili di ogni pagina: colori piu' viola e meno neri,
   angoli arrotondati, bordi leggeri, passaggi sfumati tra le sezioni (niente righe di stacco).
   Le regole iniziano con "html" per vincere sugli stili gia' presenti nelle pagine.
   Togliendo questo file il sito torna come prima.
   ===================================================================== */

/* ---------- 1. colori ---------- */
:root{
  --bg:#201239; --bg-2:#29174D; --panel:rgba(255,255,255,.055); --panel-2:rgba(255,255,255,.085);
  --text:#F8F4FF; --muted:#BDB0DD; --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.15);
  --lav:#C4A8FF; --lav-2:#E6DAFF; --ink:#24104B; --ink-2:#5E4C8C; --acc:#7A2CF0;
  --r-xl:34px; --r-l:28px; --r-m:20px; --r-s:14px;
  --soft-shadow:0 30px 80px -30px rgba(8,2,26,.75);
}
html{background:var(--bg);}
html body{
  background:
    radial-gradient(1200px 820px at 88% -8%, rgba(157,77,255,.26), transparent 62%),
    radial-gradient(1100px 900px at -12% 38%, rgba(124,74,230,.18), transparent 60%),
    radial-gradient(900px 700px at 110% 78%, rgba(196,168,255,.10), transparent 60%),
    linear-gradient(180deg, #201239 0%, #251543 45%, #201239 100%);
  background-attachment:fixed;
}
html .mono{color:var(--muted);}

/* barra del menu dopo lo scroll e menu del telefono: viola invece di nero */
html nav.top.scrolled, html body.pkpage nav.top, html body.swpage nav.top{background:rgba(33,19,62,.72); border-bottom-color:rgba(255,255,255,.06);}
@media (max-width:900px){ html .nav-links{background:#1D1136;} }

/* ---------- 2. forme morbide ---------- */
html .btn{border-radius:999px;}
html input, html select, html textarea{border-radius:var(--r-s);}
html .card, html .rq, html .ac-box, html .pk, html .pk-modal-box, html .pk-note, html .reel-frame, html .box{border-radius:var(--r-l);}
html .card{background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.08); box-shadow:var(--soft-shadow);}
html .card.mfc{background:radial-gradient(ellipse 80% 80% at 100% 0%, rgba(157,77,255,.28), transparent 60%), rgba(255,255,255,.05);}
html .rq{border-color:rgba(255,255,255,.1); background:rgba(255,255,255,.045); box-shadow:var(--soft-shadow);}
html .ac-box{border-color:rgba(255,255,255,.1); background:radial-gradient(ellipse 70% 120% at 0% 50%, rgba(157,77,255,.22), transparent 70%), rgba(255,255,255,.045);}
html .ac-box.of-box{background:radial-gradient(ellipse 70% 120% at 100% 50%, rgba(255,120,200,.16), transparent 70%), rgba(255,255,255,.045);}
html .reel-panel{border-radius:var(--r-xl); overflow:hidden;}
html .fcard, html .fcard img{border-radius:var(--r-m);}
html .d-card{border-radius:var(--r-m);}
html .pl{border-radius:var(--r-m);}
html .chip{border-radius:999px;}

/* ---------- 3. niente righe di stacco tra le sezioni ---------- */
html .sec-head{border-bottom:0; position:relative;}
html .sec-head::after{content:""; position:absolute; left:0; right:0; bottom:0; height:1px; pointer-events:none;
  background:linear-gradient(90deg, rgba(196,168,255,0), rgba(196,168,255,.28) 18%, rgba(196,168,255,.28) 82%, rgba(196,168,255,0));}
html #servizi, html .pk-how, html .pk-listen{background:radial-gradient(ellipse 80% 55% at 50% 50%, rgba(140,80,240,.14), transparent 72%);}
html .pk-cat{border-bottom:0; padding-bottom:0;}
html .band + .band{border-block:0; background:linear-gradient(90deg, rgba(196,168,255,0), rgba(196,168,255,.08) 20%, rgba(196,168,255,.08) 80%, rgba(196,168,255,0));}
html .lb.t, html .lb.b, html .mo-cut .t, html .mo-cut .b{border-color:rgba(196,168,255,.08);}

/* ---------- 4. MORFACE in home (e "Nova Studio" nella pagina MF): video sfumato, nessun blocco ---------- */
html .mfsec{background:transparent;}
html .mfsec video{opacity:.56; filter:saturate(1.05);
  -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 16%, #000 84%, transparent 100%);
  mask-image:linear-gradient(180deg, transparent 0%, #000 16%, #000 84%, transparent 100%);}
html .mfsec::before{z-index:1; background:radial-gradient(ellipse 62% 58% at 50% 52%, rgba(29,17,54,.72), rgba(29,17,54,.32) 70%, rgba(29,17,54,.12) 100%), radial-gradient(ellipse 42% 30% at 50% 18%, rgba(157,77,255,.2), transparent 72%);}
html .mfsec h2, html .mfsec p{text-shadow:0 2px 26px rgba(20,10,40,.75);}

/* ---------- 5. SERVIZI: righe-link con riempimento viola e anteprima che segue il mouse ---------- */
html .serv{border:0; display:grid; gap:10px;}
html .srow{grid-template-columns:64px minmax(0,1.15fr) minmax(0,1fr) 52px; align-items:center; gap:24px; padding:22px 26px 22px 30px;
  border:0; border-radius:var(--r-l); background:rgba(255,255,255,.035); color:inherit; text-decoration:none; cursor:pointer;
  overflow:hidden; isolation:isolate; transition:background .4s ease, box-shadow .5s ease;}
html .srow::before{content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit; transform:scaleX(0); transform-origin:left center;
  background:linear-gradient(100deg, rgba(122,44,240,.85) 0%, rgba(157,77,255,.55) 45%, rgba(255,120,200,.28) 100%);
  transition:transform .65s cubic-bezier(.7,0,.2,1);}
html .srow:hover::before, html .srow:focus-visible::before{transform:scaleX(1);}
html .srow:hover{box-shadow:0 26px 60px -24px rgba(122,44,240,.7);}
html .srow h3{font-size:clamp(1.25rem,2.9vw,2.5rem);}
html .srow:hover h3{color:#fff; transform:translateX(10px); text-shadow:none;}
html .srow:hover h3 small{color:rgba(255,255,255,.8);}
html .srow:hover p{color:rgba(255,255,255,.92);}
html .srow:hover .num{color:#fff;}
html .srow .go{width:48px; height:48px; border-radius:50%; border:1px solid rgba(255,255,255,.22); display:flex; align-items:center; justify-content:center; font-size:1.1rem; color:#fff;
  transition:transform .55s cubic-bezier(.2,.8,.2,1), background .4s ease, color .4s ease, border-color .4s ease;}
html .srow:hover .go{background:#fff; color:#6A1FE0; border-color:#fff; transform:rotate(-45deg);}
@media (max-width:900px){
  html .srow{grid-template-columns:minmax(0,1fr) 40px; gap:4px 16px; padding:16px 16px 16px 20px;}
  html .srow h3{grid-column:1; font-size:1.2rem;}
  html .srow p{grid-column:1; font-size:.86rem;}
  html .srow .go{grid-column:2; grid-row:1 / span 2; width:40px; height:40px; font-size:.95rem;}
}

/* ---------- 6. PACCHETTI + SITI WEB in home (e Pacchetti su MF): due schede con immagine ---------- */
.duo{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.duo.one{grid-template-columns:1fr;}
.duo-c{position:relative; display:flex; flex-direction:column; justify-content:flex-end; min-height:clamp(340px,42vw,470px); padding:clamp(26px,3.4vw,42px);
  border-radius:var(--r-xl); overflow:hidden; isolation:isolate; color:#fff; text-decoration:none;
  background:linear-gradient(160deg, #3A1A78, #22123F); box-shadow:var(--soft-shadow); transition:transform .6s cubic-bezier(.2,.8,.2,1), box-shadow .6s ease;}
.duo.one .duo-c{min-height:clamp(260px,30vw,360px);}
.duo-img{position:absolute; inset:0; z-index:-2; background-size:cover; background-position:center; opacity:.72; transform:scale(1.04); transition:transform 1.2s cubic-bezier(.2,.8,.2,1), opacity .6s ease;}
.duo-c::before{content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(29,17,54,.05) 0%, rgba(29,17,54,.35) 45%, rgba(29,17,54,.92) 100%);}
.duo-c::after{content:""; position:absolute; inset:0; z-index:-1; opacity:0; transition:opacity .5s ease; background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%), rgba(196,168,255,.28), transparent 60%);}
.duo-c:hover{transform:translateY(-6px); box-shadow:0 40px 90px -30px rgba(122,44,240,.75);}
.duo-c:hover .duo-img{transform:scale(1.1); opacity:.85;}
.duo-c:hover::after{opacity:1;}
.duo-c h2{font-size:clamp(2.2rem,4.3vw,4rem); line-height:.9;}
.duo-c[href="/siti-web"] .duo-img{background-position:right top; opacity:.5;}
.duo-vid{position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover; opacity:.78; transform:scale(1.03); transition:transform 1.2s cubic-bezier(.2,.8,.2,1), opacity .6s ease;}
.duo-c:hover .duo-vid{transform:scale(1.08); opacity:.9;}
.duo-c[href="/siti-web"] .duo-vid{object-position:left top; opacity:.62;}
.duo-c h2 .n{color:var(--lav); text-shadow:0 0 30px rgba(157,77,255,.6);}
.duo-c p{margin-top:12px; font-size:1.05rem; color:rgba(255,255,255,.88); max-width:34ch;}
.duo-go{display:inline-flex; align-items:center; gap:12px; margin-top:22px; align-self:flex-start; padding:12px 14px 12px 22px; border-radius:999px;
  background:rgba(255,255,255,.14); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); font-weight:700; font-size:.92rem; transition:background .4s ease, color .4s ease;}
.duo-go i{font-style:normal; width:34px; height:34px; border-radius:50%; background:#fff; color:#6A1FE0; display:flex; align-items:center; justify-content:center; transition:transform .5s cubic-bezier(.2,.8,.2,1);}
.duo-c:hover .duo-go{background:#fff; color:#3A1A78;}
.duo-c:hover .duo-go i{transform:rotate(-45deg); background:#6A1FE0; color:#fff;}
@media (max-width:760px){ .duo{grid-template-columns:1fr;} .duo-c{min-height:300px;} }

/* ---------- 7. RITRATTI (home): sezione chiara, sfumata ai bordi ---------- */
html .rt{color:var(--ink); isolation:isolate; padding-block:clamp(130px,17vh,190px);}
html .rt::before{content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(180deg, rgba(120,60,230,0) 0%, rgba(130,70,235,.55) 4%, #B795FF 7.5%, #DCCBFF 10.5%, #F1E9FF 16%, #FAF7FF 50%, #F1E9FF 84%, #DCCBFF 89.5%, #B795FF 92.5%, rgba(130,70,235,.55) 96%, rgba(120,60,230,0) 100%);}
html .rt .sec-head h2{color:var(--ink);}
html .rt .sec-head h2 .n{color:var(--acc); text-shadow:0 0 34px rgba(157,77,255,.35);}
html .rt .sec-head .mono{color:var(--ink-2);}
html .rt .sec-head::after{background:linear-gradient(90deg, rgba(94,76,140,0), rgba(94,76,140,.25) 18%, rgba(94,76,140,.25) 82%, rgba(94,76,140,0));}

/* offerta a tempo */
.px-deal{position:relative; display:grid; grid-template-columns:1fr auto; gap:26px 40px; align-items:center; margin-bottom:22px; overflow:hidden; isolation:isolate;
  padding:clamp(26px,4vw,46px); border-radius:var(--r-xl); color:#fff;
  background:linear-gradient(118deg, #34107E 0%, #5B19D6 42%, #8E45FF 76%, #C08BFF 100%);
  box-shadow:0 40px 90px -34px rgba(91,25,214,.8);}
.px-deal::after{content:""; position:absolute; right:-10%; top:-60%; width:60%; height:220%; z-index:-1; background:radial-gradient(closest-side, rgba(255,255,255,.28), transparent); transform:rotate(18deg);}
.px-deal .k{font-family:var(--mono); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.8);}
.px-deal h3{font-family:var(--display); font-stretch:125%; font-weight:900; text-transform:uppercase; font-size:clamp(1.7rem,4.4vw,3.2rem); line-height:.95; margin-top:10px;}
.px-deal p{margin-top:12px; font-size:1.05rem; color:rgba(255,255,255,.9);}
.px-deal .side{display:flex; flex-direction:column; align-items:flex-end; gap:16px;}
.px-cd{display:flex; gap:8px;}
.px-cd div{min-width:66px; padding:12px 6px 9px; border-radius:18px; background:rgba(255,255,255,.14); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); text-align:center;}
.px-cd b{display:block; font-family:var(--display); font-stretch:125%; font-weight:900; font-size:1.7rem; line-height:1;}
.px-cd span{font-family:var(--mono); font-size:.56rem; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.75);}
.px-deal .go{display:inline-flex; align-items:center; justify-content:center; min-height:50px; padding:12px 28px; border-radius:999px; border:0; cursor:pointer;
  font:inherit; font-weight:700; background:#fff; color:#4A14B0; box-shadow:0 14px 34px -12px rgba(20,4,60,.6); transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease;}
.px-deal .go:hover{transform:translateY(-2px) scale(1.03); box-shadow:0 20px 40px -14px rgba(20,4,60,.7);}
@media (max-width:640px){ .px-deal{grid-template-columns:1fr;} .px-deal .side{align-items:stretch;} .px-cd div{flex:1; min-width:0;} }

/* schede prezzo (base scura: sessioni MF) */
.px-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(230px,1fr)); gap:16px;}
.px{position:relative; display:flex; flex-direction:column; padding:28px 26px 24px; border-radius:var(--r-l); overflow:hidden; isolation:isolate;
  background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.09);
  box-shadow:var(--soft-shadow); transition:transform .55s cubic-bezier(.2,.8,.2,1), box-shadow .55s ease, border-color .4s ease;}
.px::after{content:""; position:absolute; inset:0; z-index:-1; opacity:0; transition:opacity .45s ease; background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%), rgba(196,168,255,.2), transparent 62%);}
.px:hover{transform:translateY(-6px); border-color:rgba(196,168,255,.35); box-shadow:0 40px 80px -30px rgba(122,44,240,.6);}
.px:hover::after{opacity:1;}
.px h3{font-family:var(--display); font-stretch:112%; font-weight:800; font-size:1.4rem; line-height:1.12;}
.px .spec{font-size:.92rem; color:var(--muted); margin-top:8px; line-height:1.5; flex:1;}
.px .pr{display:flex; align-items:baseline; gap:12px; margin-top:22px;}
.px .pr b{font-family:var(--display); font-stretch:125%; font-weight:900; font-size:2.4rem; line-height:1;}
.px .pr s{color:var(--muted); font-size:1.05rem; text-decoration-thickness:1.5px;}
.px .nota{min-height:1.3em; margin-top:8px; font-size:.85rem; font-weight:600; color:var(--lav);}
.px .acts{display:flex; gap:8px; margin-top:18px;}
.px .acts .go, .px .acts .gift{flex:1; display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:10px 14px; border-radius:999px; cursor:pointer;
  font:inherit; font-weight:700; font-size:.9rem; text-decoration:none; transition:transform .35s ease, background .35s ease, color .35s ease, border-color .35s ease, box-shadow .35s ease;}
.px .acts .go{border:0; color:#fff; background:linear-gradient(135deg, #9D4DFF, #6A1FE0); box-shadow:0 12px 28px -12px rgba(122,44,240,.8);}
.px .acts .go:hover{transform:translateY(-2px); box-shadow:0 18px 34px -12px rgba(122,44,240,.9);}
.px .acts .gift{background:transparent; color:inherit; border:1px solid rgba(196,168,255,.45);}
.px .acts .gift:hover{background:rgba(196,168,255,.16);}

/* schede prezzo dentro la sezione chiara */
html .rt .px{background:#fff; border:0; color:var(--ink);
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset, 0 26px 60px -26px rgba(76,29,149,.38);}
html .rt .px::after{background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%), rgba(157,77,255,.12), transparent 62%);}
html .rt .px:hover{box-shadow:0 40px 80px -30px rgba(91,25,214,.45);}
html .rt .px .spec{color:var(--ink-2);}
html .rt .px .pr s{color:#9C8FC4;}
html .rt .px .nota{color:var(--acc);}
html .rt .px .acts .gift{color:var(--ink); border-color:rgba(122,44,240,.35);}
html .rt .px .acts .gift:hover{background:#F1E9FF;}

/* vantaggi: buoni regalo, porta un amico, primo singolo */
.perks{display:grid; grid-template-columns:repeat(auto-fit, minmax(280px,1fr)); gap:16px; margin-top:22px;}
.perk{position:relative; display:flex; flex-direction:column; padding:26px 28px; border-radius:var(--r-l); overflow:hidden; isolation:isolate;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); transition:transform .5s cubic-bezier(.2,.8,.2,1), box-shadow .5s ease;}
.perk::after{content:""; position:absolute; inset:0; z-index:-1; opacity:0; transition:opacity .45s ease; background:radial-gradient(300px circle at var(--mx,50%) var(--my,50%), rgba(196,168,255,.18), transparent 62%);}
.perk:hover{transform:translateY(-4px);} .perk:hover::after{opacity:1;}
.perk-h{display:flex; align-items:center; justify-content:space-between; gap:16px;}
.perk h3{font-family:var(--display); font-stretch:112%; font-weight:800; font-size:1.35rem; line-height:1.15;}
.perk p{margin-top:10px; color:var(--muted); font-size:.97rem; max-width:48ch;}
.perk-badge{flex:none; font-family:var(--display); font-stretch:125%; font-weight:900; font-size:1.25rem; padding:10px 16px; border-radius:999px; color:#fff; background:linear-gradient(135deg, #9D4DFF, #6A1FE0); box-shadow:0 10px 26px -10px rgba(122,44,240,.8);}
.perk-ic{flex:none; width:46px; height:46px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.2rem; color:#fff; background:linear-gradient(135deg, #C08BFF, #7A2CF0);}
.perk-go{align-self:flex-start; margin-top:16px; padding:0; border:0; background:none; cursor:pointer; font:inherit; font-weight:700; color:var(--lav); text-decoration:none; border-bottom:1px solid currentColor;}
html .rt .perk{background:#EFE6FF; border:0;}
html .rt .perk::after{background:radial-gradient(300px circle at var(--mx,50%) var(--my,50%), rgba(255,255,255,.7), transparent 62%);}
html .rt .perk h3{color:var(--ink);} html .rt .perk p{color:var(--ink-2);} html .rt .perk-go{color:var(--acc);}

/* sessioni MF: nota unica sotto le schede */
.ss-note{margin-top:20px; text-align:center; color:var(--muted); font-size:.98rem;}
.ss-note b{color:var(--text); font-weight:600;}

/* ---------- 8. finestra del buono regalo ---------- */
dialog.gd{margin:auto; width:min(560px, calc(100vw - 24px)); max-height:calc(100dvh - 24px); border:1px solid rgba(196,168,255,.35); border-radius:var(--r-xl); background:#24154A; color:#F8F4FF; padding:clamp(22px,4vw,36px); overflow:auto; box-shadow:0 50px 120px -30px rgba(0,0,0,.8);}
dialog.gd::backdrop{background:rgba(14,6,34,.7); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);}
.gd .x{position:absolute; right:14px; top:12px; width:42px; height:42px; border-radius:50%; font-size:1.4rem; color:var(--muted); background:rgba(255,255,255,.06); border:0; cursor:pointer;}
.gd h3{font-family:var(--display); font-stretch:125%; font-weight:900; text-transform:uppercase; font-size:1.9rem; line-height:.95;} .gd h3 em{font-style:normal; color:var(--lav);}
.gd .lead{color:var(--muted); margin:10px 0 18px; font-size:.95rem;}
.gd .fl{display:flex; flex-direction:column; gap:6px; margin-bottom:12px;} .gd .fl > span{font-family:var(--mono); font-size:.64rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted);}
.gd input, .gd select, .gd textarea{font:inherit; color:#F8F4FF; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); border-radius:var(--r-s); padding:12px 14px; min-height:48px; width:100%;}
.gd select option{background:#24154A;} .gd input:focus, .gd select:focus, .gd textarea:focus{outline:none; border-color:var(--lav);}
.gd .two{display:grid; grid-template-columns:1fr 1fr; gap:12px;} @media (max-width:560px){ .gd .two{grid-template-columns:1fr;} }
.gd .rad{display:flex; flex-wrap:wrap; gap:8px;} .gd .rad label{cursor:pointer;} .gd .rad input{position:absolute; opacity:0; width:1px; height:1px; min-height:0;}
.gd .rad span{display:inline-block; padding:10px 16px; border-radius:999px; border:1px solid rgba(255,255,255,.16); font-size:.88rem;} .gd .rad input:checked + span{background:rgba(157,77,255,.35); border-color:var(--lav);} .gd .rad input:focus-visible + span{outline:2px solid var(--lav);}
.gd .chk{display:flex; gap:10px; align-items:flex-start; font-size:.88rem; margin:6px 0 12px; cursor:pointer;} .gd .chk input{width:20px; height:20px; min-height:0; margin-top:2px; accent-color:#9D4DFF; flex:none;}
.gd .err{color:#FF9FB5; min-height:1.3em; font-size:.9rem; margin-bottom:6px;}
.gd .send{width:100%; min-height:52px; border-radius:999px; border:0; font:inherit; font-weight:700; color:#fff; cursor:pointer; background:linear-gradient(135deg,#9D4DFF,#6A1FE0); box-shadow:0 14px 34px -12px rgba(122,44,240,.8);} .gd .send[disabled]{opacity:.6;}
.gd .fine{font-size:.78rem; color:var(--muted); margin-top:12px;} .gd .fine a{color:var(--lav);}
.gd .ok{text-align:center; padding:20px 0;} .gd .ok b{display:block; font-size:2.4rem; color:var(--lav);}
.gd .hp{position:absolute; left:-9999px;}

/* ---------- 9. fascetta offerta, recensioni, codici ---------- */
.mk-pill{position:fixed; left:16px; bottom:calc(16px + env(safe-area-inset-bottom,0px)); z-index:70; max-width:min(440px, calc(100vw - 110px)); display:flex; align-items:center; gap:12px; padding:11px 12px 11px 18px;
  border-radius:24px; background:rgba(40,22,80,.86); border:1px solid rgba(196,168,255,.3); box-shadow:0 20px 50px -14px rgba(0,0,0,.6), 0 0 40px rgba(157,77,255,.22);
  color:#F8F4FF; font-family:var(--body, Manrope, system-ui, sans-serif); transform:translateY(160%); transition:transform .7s cubic-bezier(.2,.8,.2,1); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);}
.mk-pill.on{transform:none;}
.mk-pill a{color:inherit; text-decoration:none; display:flex; flex-direction:column; gap:2px; min-width:0;}
.mk-pill .k{font-family:var(--mono, monospace); font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--lav);}
.mk-pill .t{font-weight:700; font-size:.92rem; line-height:1.25; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.mk-pill .c{font-family:var(--mono, monospace); font-size:.72rem; color:#FFB3E0;}
.mk-pill button{flex:none; width:32px; height:32px; border-radius:50%; border:0; background:rgba(255,255,255,.08); color:var(--muted); font-size:1rem; cursor:pointer;}
.mk-cmsg{font-size:.82rem; margin-top:6px; min-height:1.2em;} .mk-cmsg.ok{color:#7BE8B0;} .mk-cmsg.no{color:#FF9FB5;}
.mk-rev{padding:clamp(70px,10vw,120px) var(--gut,20px);} .mk-rev .in{max-width:1320px; margin:0 auto;}
.mk-rev h2{font-family:var(--display); font-stretch:125%; font-weight:900; text-transform:uppercase; font-size:clamp(2.2rem,7vw,4.4rem); line-height:.9; margin:14px 0 34px;} .mk-rev h2 em{font-style:normal; color:var(--lav);}
.mk-rev .row{display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:10px;}
.mk-rev .rv{flex:0 0 min(340px,82vw); scroll-snap-align:start; border-radius:var(--r-l); padding:26px; background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.08);}
.mk-rev .st{color:var(--lav); letter-spacing:3px; font-size:1.05rem;} .mk-rev .st i{color:rgba(255,255,255,.2); font-style:normal;}
.mk-rev p{margin:12px 0 14px; font-size:.98rem; line-height:1.55;} .mk-rev .who{font-family:var(--mono); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted);} .mk-rev .more{display:inline-block; margin-top:22px; color:var(--lav); text-decoration:underline;}

/* ---------- 10. PAGINA PACCHETTI: schede, incluso, come funziona ---------- */
html .pk{border-color:rgba(255,255,255,.1); background:rgba(255,255,255,.05); overflow:hidden; isolation:isolate; box-shadow:var(--soft-shadow);
  transition:transform .6s cubic-bezier(.2,.8,.2,1), box-shadow .6s ease, border-color .4s ease;}
html .pk.hot{border-color:rgba(196,168,255,.28); background:radial-gradient(ellipse 90% 60% at 100% 0%, rgba(157,77,255,.3), transparent 65%), rgba(255,255,255,.05);}
html .pk::after{content:""; position:absolute; inset:0; z-index:-1; opacity:0; transition:opacity .45s ease; pointer-events:none; background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%), rgba(196,168,255,.2), transparent 62%);}
html .pk:hover{transform:translateY(-8px); border-color:rgba(196,168,255,.5); box-shadow:0 46px 90px -30px rgba(122,44,240,.7);}
html .pk:hover::after{opacity:1;}
html .pk ul, html .pk .price{border-top-color:rgba(255,255,255,.07);}
html .pk ul{gap:9px;}
html .pk li{font-size:.98rem;}
html .pk .btn{transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease;}
html .pk:hover .btn{transform:translateY(-2px);}
html .pk-inc-grid{grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px;}
html .pk-inc-i{align-items:center; gap:14px; padding:18px 22px; border:0; border-radius:var(--r-m); background:rgba(255,255,255,.05); transition:background .4s ease, box-shadow .4s ease;}
html .pk-inc-i:hover{background:rgba(157,77,255,.2); box-shadow:0 18px 40px -20px rgba(122,44,240,.8);}
html .pk-inc-i h3{transition:transform .45s cubic-bezier(.2,.8,.2,1);} html .pk-inc-i:hover h3{transform:translateX(4px);}
html .pk-inc-i .ic{width:40px; height:40px; flex:none; border-radius:50%; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg, #9D4DFF, #6A1FE0); color:#fff; text-shadow:none; font-size:.9rem; transition:transform .6s cubic-bezier(.2,.8,.2,1);}
html .pk-inc-i:hover .ic{transform:rotate(90deg) scale(1.08);}
html .pk-inc-i h3{margin:0; font-size:1.05rem;}
html .pk-inc-i p{display:none;}
html .pk-note{border:0; background:rgba(157,77,255,.12); flex-direction:row; align-items:center; gap:14px; flex-wrap:wrap;}
@media (max-width:900px){ html .pk-inc-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:520px){ html .pk-inc-grid{grid-template-columns:1fr;} }
html .pk-steps{position:relative; gap:16px;}
html .pk-step{position:relative; padding:28px 26px; border:0; border-radius:var(--r-l); background:rgba(255,255,255,.05); overflow:hidden; isolation:isolate; transition:background .4s ease, box-shadow .4s ease;}
html .pk-step::before{content:attr(data-n); position:absolute; right:14px; top:-18px; z-index:-1; font-family:var(--display); font-stretch:125%; font-weight:900; font-size:7rem; line-height:1; color:rgba(196,168,255,.1); transition:color .5s ease, transform .6s cubic-bezier(.2,.8,.2,1);}
html .pk-step:hover{background:rgba(157,77,255,.18); box-shadow:0 24px 50px -24px rgba(122,44,240,.8);}
html .pk-step:hover::before{color:rgba(196,168,255,.28); transform:translateY(6px);}
html .pk-step .mono{display:none;}
html .pk-step h3{font-size:1.4rem; margin:0 0 6px;}
html .pk-step p{font-size:.98rem;}

/* ---------- 11. accessibilita' ---------- */
@media (prefers-reduced-motion: reduce){
  html .srow::before, .px, .perk, .duo-c, .duo-img, html .pk, html .pk-step, html .pk-inc-i, html .pk-inc-i h3{transition:none;}
}

/* ---------- 12. pagina Pacchetti: la luce in alto sfuma invece di tagliarsi ---------- */
html .pk-hero{overflow:visible;}
html .pk-hero::before{filter:blur(40px);}

/* ---------- 13. niente linea che scorre in alto (barra di avanzamento) ---------- */
html .mo-progress{display:none;}

/* ---------- 14. FOTO: niente pellicola nera, schede morbide che sfumano ai lati ---------- */
html .film{background:transparent; padding:10px 0 20px;
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%); mask-image:linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);}
html .film::before, html .film::after{display:none;}
html .film-track{background:none; padding:20px 14px 30px; gap:18px;}
html .fcard{border-radius:var(--r-l); box-shadow:0 26px 60px -26px rgba(8,2,26,.85);}
html .fcard::after{background:linear-gradient(0deg, rgba(34,16,70,.88), rgba(34,16,70,0) 58%);}
html .fcard .lab span{color:var(--lav-2);}


/* ---------- 16. schede Pacchetti: nota "primo brano" ---------- */
.duo-tag{position:absolute; top:clamp(20px,2.6vw,30px); left:clamp(26px,3.4vw,42px); padding:9px 16px; border-radius:999px; font-weight:700; font-size:.86rem; color:#fff;
  background:linear-gradient(135deg, #9D4DFF, #6A1FE0); box-shadow:0 12px 30px -12px rgba(122,44,240,.9);}
.pk-prima{display:flex; width:fit-content; align-items:center; gap:10px; margin-top:22px; padding:10px 18px; border-radius:999px; font-weight:700; font-size:.92rem; color:#fff; text-decoration:none;
  background:linear-gradient(135deg, rgba(157,77,255,.55), rgba(106,31,224,.55)); border:1px solid rgba(196,168,255,.4); transition:background .35s ease;}
.pk-prima:hover{background:linear-gradient(135deg, #9D4DFF, #6A1FE0);}
.pk-prima b{font-family:var(--display); font-stretch:125%; font-weight:900;}

/* ---------- 17. TRANSIZIONE: velo viola con il nome della destinazione ---------- */
.nv-tr{position:fixed; inset:0; z-index:400; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; pointer-events:none; opacity:0; visibility:hidden;
  background:radial-gradient(ellipse 60% 48% at 50% 50%, rgba(157,77,255,.42), transparent 72%), radial-gradient(ellipse 90% 60% at 50% 115%, rgba(255,120,200,.16), transparent 70%), #211339;
  transition:opacity .42s cubic-bezier(.4,0,.2,1), visibility 0s linear .42s;}
.nv-tr.on{opacity:1; visibility:visible; pointer-events:auto; transition:opacity .42s cubic-bezier(.4,0,.2,1), visibility 0s;}
.nv-tr b{font-family:var(--display, 'Archivo', sans-serif); font-stretch:125%; font-weight:900; text-transform:uppercase; font-size:clamp(2.2rem,8vw,6rem); line-height:.92; color:#fff; text-align:center; padding:0 20px;
  opacity:0; transform:translateY(22px); filter:blur(10px); transition:opacity .5s ease .06s, transform .6s cubic-bezier(.2,.8,.2,1) .06s, filter .5s ease .06s;}
.nv-tr i{font-style:normal; font-size:1.5rem; color:var(--lav); text-shadow:0 0 24px rgba(157,77,255,.9); opacity:0; transform:scale(.3) rotate(-120deg); transition:opacity .5s ease, transform .7s cubic-bezier(.2,.8,.2,1);}
.nv-tr.on b{opacity:1; transform:none; filter:none;}
.nv-tr.on i{opacity:1; transform:none;}
.nv-tr.arrivo b, .nv-tr.arrivo i{opacity:0;}
html.nv-arrive::before{content:""; position:fixed; inset:0; z-index:399;
  background:radial-gradient(ellipse 60% 48% at 50% 50%, rgba(157,77,255,.42), transparent 72%), radial-gradient(ellipse 90% 60% at 50% 115%, rgba(255,120,200,.16), transparent 70%), #211339;}
@media (prefers-reduced-motion: reduce){ .nv-tr{display:none;} html.nv-arrive::before{display:none;} }

/* ---------- 18. GRAFICA: dal marchio a tutto il resto ---------- */
.gf-top{display:flex; justify-content:space-between; align-items:flex-end; gap:20px 40px; flex-wrap:wrap; margin-bottom:34px;}
.gf-lead{font-size:clamp(1.3rem,2.7vw,2.1rem); line-height:1.28; max-width:32ch; font-weight:600;}
.gf-lead em{font-style:normal; color:var(--lav);}
.gf-cta{display:inline-flex; align-items:center; gap:10px; padding:14px 24px; border-radius:999px; font-weight:700; color:#fff; text-decoration:none;
  background:linear-gradient(135deg, #9D4DFF, #6A1FE0); box-shadow:0 14px 34px -12px rgba(122,44,240,.85); transition:box-shadow .35s ease;}
.gf-cta:hover{box-shadow:0 20px 44px -12px rgba(122,44,240,1);}
.gf-path{list-style:none; position:relative; display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); margin:0 0 40px; padding:26px 10px; border-radius:var(--r-xl); background:rgba(255,255,255,.04);}
.gf-path::before{content:""; position:absolute; left:10%; right:10%; top:49px; height:2px; background:linear-gradient(90deg, rgba(196,168,255,0), rgba(196,168,255,.55) 15%, rgba(196,168,255,.55) 85%, rgba(196,168,255,0));}
.gf-path li{position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; gap:12px; padding:0 8px;}
.gf-path b{position:relative; z-index:1; width:46px; height:46px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:var(--mono); font-size:.78rem; font-weight:600; color:#fff;
  background:linear-gradient(135deg, #9D4DFF, #6A1FE0); box-shadow:0 0 0 6px rgba(33,19,62,.9), 0 10px 26px -8px rgba(122,44,240,.9); transition:transform .5s cubic-bezier(.2,.8,.2,1);}
.gf-path li:hover b{transform:scale(1.12);}
.gf-path div{display:flex; flex-direction:column; gap:3px;}
.gf-path strong{font-family:var(--display); font-stretch:112%; font-weight:800; font-size:1.05rem;}
.gf-path span{font-size:.85rem; color:var(--muted);}
.gf-grid{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:16px;}
.gf-c{border-radius:var(--r-l); overflow:hidden; background:rgba(255,255,255,.045); box-shadow:var(--soft-shadow); transition:box-shadow .5s ease;}
.gf-c:hover{box-shadow:0 36px 80px -30px rgba(122,44,240,.6);}
.gf-img{aspect-ratio:16/10; background-size:cover; background-position:center; transition:transform 1s cubic-bezier(.2,.8,.2,1);}
.gf-c:hover .gf-img{transform:scale(1.06);}
.gf-t{padding:20px 22px 22px;}
.gf-t h3{font-family:var(--display); font-stretch:112%; font-weight:800; font-size:1.3rem; line-height:1.15;}
.gf-t p{color:var(--muted); font-size:.95rem; margin-top:6px;}
.gf-t ul{list-style:none; display:flex; flex-wrap:wrap; gap:6px; margin-top:14px;}
.gf-t li{padding:6px 12px; border-radius:999px; background:rgba(157,77,255,.18); font-size:.8rem; font-weight:600;}
.gf-who{display:flex; align-items:center; gap:14px 22px; flex-wrap:wrap; margin-top:16px; padding:20px 24px; border-radius:var(--r-l); background:rgba(157,77,255,.1);}
.gf-who p{color:var(--muted);} .gf-who b{color:var(--text);}
.gf-lav{margin:44px 0 18px;}
@media (max-width:980px){ .gf-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:760px){
  .gf-grid{grid-template-columns:1fr;}
  .gf-path{grid-template-columns:1fr; gap:16px; padding:22px 20px;}
  .gf-path::before{left:42px; right:auto; top:40px; bottom:40px; width:2px; height:auto; background:linear-gradient(180deg, rgba(196,168,255,0), rgba(196,168,255,.55) 15%, rgba(196,168,255,.55) 85%, rgba(196,168,255,0));}
  .gf-path li{flex-direction:row; text-align:left; gap:16px;}
}

/* ---------- 19. Grafica: immagini cliccabili; Siti web: titoli dei pacchetti che entrano sempre ---------- */
.gf-img{cursor:zoom-in;}
.gf-img:focus-visible{outline:3px solid var(--lav); outline-offset:-3px;}
html .pk h3{font-size:clamp(1.3rem,1.75vw,1.8rem); white-space:normal; text-wrap:balance;}
