/* ============================================================
   BRAND.CSS · Mirco Pregnolato · Tema unico premium
   Palette: NERO · BIANCO · ORO VIVO (#E7B93A) · nota ARANCIO (#FF6A00)
   Riflessi diamante/platino · card in rilievo · pattern a stelle sottile
   Caricare per ultimo nel <head>, dopo lo <style> di pagina.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&family=Inter:wght@400;500;600;700&display=swap');
@import url('cyber-rainbow-neon.css?v=3.6.0');
body{font-family:'Inter',system-ui,Segoe UI,Arial,sans-serif}
/* TESTI GIUSTIFICATI su tutto il sito (titoli e pulsanti esclusi).
   hyphens+overflow-wrap: su schermi stretti il giustificato senza sillabazione
   crea "fiumi" di spazio bianco tra le parole; con l'sillabazione il testo
   si spezza in modo pulito. Nessun cambio visivo su desktop, solo leggibilita'
   in piu' su mobile. overflow-wrap evita che una parola/URL lunga sfori. */
p,.sec-desc,.fa,.faq p,.g p,.pil p,.lead,.sub,li{
  text-align:justify;text-justify:inter-word;
  hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto;
  overflow-wrap:anywhere;
}
.btn,.cta,button,.badge,.tag,.price,.pricebox,.kpi,summary,nav,header,footer,.mp-line{text-align:initial}
h1,h2,h3,h4,.sec-title{text-align:inherit}
h1,h2,h3,h4,h5,.sec-title,.hero h1,.mp-now,.brand,.bookcover .tt,.price-now,.now{font-family:'Sora','Inter',system-ui,sans-serif!important}
:root{
  /* SFONDO NERO OBSIDIAN & ALTA LEGGIBILITÀ */
  --bg:#030712; --bg2:rgba(11,15,25,0.92); --bg3:rgba(17,24,39,0.95);
  --pan:rgba(11,15,25,0.88); --pan2:rgba(17,24,39,0.95);
  --ink:#ffffff; --tx:#e2e8f0; --mut:#94a3b8;
  --gold:#ffd700; --gold2:#f59e0b; --ac:#00f0ff;
  --orange:#ff6600; --green:#00ff88; --red:#ff0055;
  --line:rgba(255,255,255,0.12);
}
html{background:#030712!important;}
body{position:relative;background:#030712!important;color:#e2e8f0!important;}
/* FIX DEFINITIVO: contenuto sempre visibile (l'animazione reveal non deve mai nasconderlo) */
.rv{opacity:1!important;transform:none!important;}
/* FIX CRITICO 2026-08-02: la regola generica "header{min-height:100vh;...}" scritta per il grande
   header#top (hero) colpiva per errore ANCHE l'header sottile .mp-hd creato da chrome.js (e' un tag
   <header> anche lui), perche' un selettore di tag senza classe prende qualsiasi <header> della pagina.
   Risultato: la barra fissa in alto si allargava a tutta l'altezza dello schermo (100vh) con sfondo
   scuro semitrasparente sfocato, coprendo tutto il contenuto sotto (sito che sembra "non aprirsi").
   Blindatura permanente: qui .mp-hd resta sempre alta 58px, qualunque altra regola esista altrove. */
.mp-hd{height:58px!important;min-height:58px!important;max-height:58px!important;padding:0 16px!important;align-items:center!important;}

/* PATTERN MP (il tuo monogramma, versione ORO): piccolo e quasi invisibile.
   L'occhio lo nota, non disturba. Luxury cool. */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:url('mp-pattern-gold.svg');
  background-size:110px 110px;
  background-repeat:repeat;
  opacity:.032; /* si vede appena, non disturba */
}
body::after{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(120% 85% at 50% 0%, transparent 70%, rgba(0,153,230,.03) 100%);
}
/* canvas monogrammi giganti: SPENTO (il pattern ora è il tuo SVG, piccolo) */
canvas#sky{display:none!important;}

/* MENU: fallback senza JS — il dropdown si apre anche in hover/focus */
.menu-wrap{position:relative}
.menu-wrap:hover .nav-links,.menu-wrap:focus-within .nav-links,.nav-links:hover{
  opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important;display:flex!important;
}

/* HEADER legacy sticky (l'header unico .mp-hd resta fixed, gestito da chrome.js) */
header.top{position:sticky!important;top:0;z-index:1000;background:rgba(10,10,11,.94);backdrop-filter:blur(10px);}
nav{ }

/* ---- CARD: rilievo + diamante, niente ritaglio (ribbon liberi) ---- */
.price-card,.tier,.pcard,.card,.g,.pil,.inc .i,.book,.pack,.kpi,
.voucher,.step,.flow .s,.pain .p,.us-row,.order,.unibox,.pricebox,.guar{
  position:relative;
  background:rgba(11,15,25,0.88);
  border:1px solid rgba(255,255,255,0.12);
  border-radius:16px;
  color:#e2e8f0;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.12),
    0 12px 35px rgba(0,0,0,0.75);
  transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s, border-color .35s;
}
.price-card:hover,.tier:hover,.pcard:hover,.card:hover,.g:hover,.pil:hover,.inc .i:hover,
.book:hover,.pack:hover,.step:hover,.flow .s:hover,.pain .p:hover,.pricebox:hover,.unibox:hover{
  transform:translateY(-5px);
  border-color:rgba(231,185,58,.65);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 0 0 1px rgba(231,185,58,.30),
    0 30px 64px -30px rgba(231,185,58,.30),
    0 24px 50px -32px rgba(0,0,0,.95);
}
/* riflesso diamante statico in alto (dentro i bordi, non ritaglia nulla) */
.tier::before,.pricebox::before,.unibox::before{
  content:"";position:absolute;top:0;left:12%;right:12%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),rgba(231,185,58,.5),transparent);
  opacity:.7;pointer-events:none;
}

/* ---- ACCENTI ORO ---- */
a{color:var(--gold);}
.badge,.pill,.eyebrow,.kick,.price .usdt,.pricebox .usdt,.tier .pr .usdt,.sec-eyebrow{color:var(--gold)!important;}
.ac,.hero h1 .g{color:var(--gold)!important;}
header .brand,header .logo span span,.logo span span{color:var(--gold)!important;}

/* PULSANTI oro con riflesso diamante che scorre */
.cta,.buy,.btn-p,.btn-primary,.mp-cart{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,#F6D77A 0%,#E7B93A 45%,#C9971F 100%)!important;
  color:#141007!important;border:0!important;font-weight:800!important;
  box-shadow:0 12px 28px -12px rgba(231,185,58,.55),inset 0 1px 0 rgba(255,255,255,.5);
}
.cta::after,.buy::after,.btn-primary::after,.btn-p::after{
  content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.75),transparent);
  transform:skewX(-20deg);animation:mpShine 3.4s infinite;
}
@keyframes mpShine{0%{left:-120%}55%{left:150%}100%{left:150%}}
.cta.ghost,.btn-g,.btn-ghost{background:transparent!important;border:1px solid var(--gold)!important;color:var(--gold)!important;box-shadow:none!important}
.cta:hover,.buy:hover,.btn-primary:hover{filter:brightness(1.05)}

/* nota ARANCIO dove serve: scarsità / urgenza */
.mp-stock{display:inline-flex;align-items:center;gap:7px;margin-top:8px;font:600 12px/1 system-ui;
  color:#ffb37a;background:rgba(255,106,0,.12);border:1px solid rgba(255,106,0,.45);padding:6px 12px;border-radius:30px;}
.mp-stock .dot{width:8px;height:8px;border-radius:50%;background:var(--orange);box-shadow:0 0 8px var(--orange);animation:mpPulse 1.4s infinite;}
@keyframes mpPulse{0%,100%{opacity:1}50%{opacity:.35}}
.mp-bar{height:6px;border-radius:4px;background:rgba(255,255,255,.08);overflow:hidden;margin-top:8px;max-width:260px}
.mp-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--orange),#ff9a3c);}

/* toast conferma */
#mp-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(40px);background:#141310;border:1px solid var(--gold);color:#fff;padding:12px 20px;border-radius:12px;opacity:0;transition:.3s;z-index:100001;font:600 14px system-ui}
#mp-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* icona vettoriale oro (diamante) al posto delle emoji */
.mp-i{display:inline-block;color:var(--gold);font-style:normal;margin-right:8px;
  text-shadow:0 0 6px rgba(231,185,58,.5), 0 1px 0 rgba(255,255,255,.25);transform:translateY(1px)}

/* copertine libri (grafiche, nero/oro) + descrizione */
.bookcover{position:relative;aspect-ratio:3/4;border-radius:10px;overflow:hidden;margin-bottom:10px;
  background:linear-gradient(155deg,#1a160c,#0b0b0c 62%);border:1px solid rgba(231,185,58,.4);
  display:flex;flex-direction:column;justify-content:space-between;padding:14px}
.bookcover .col{color:var(--gold);font:700 10px/1 system-ui;letter-spacing:.2em;text-transform:uppercase}
.bookcover .tt{color:#fff;font:700 18px/1.2 'Sora',Georgia,serif}
.bookcover .mk{color:rgba(231,185,58,.5);font:800 13px/1 'Sora',system-ui;letter-spacing:.1em}
.bookcover::after{content:"";position:absolute;right:-25%;top:-12%;width:60%;height:130%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.10),rgba(231,185,58,.10),transparent);transform:skewX(-16deg)}
.book .desc,.desc-libro{color:var(--mut);font:400 13px/1.55 system-ui;margin:0 0 8px}

/* FAQ uniforme su tutte le pagine */
.faq,.faq-mp{max-width:820px;margin:0 auto}
.faq details,.faq-mp details{background:linear-gradient(180deg,#161618,#101012);border:1px solid rgba(231,185,58,.18);border-radius:12px;padding:14px 18px;margin-bottom:10px;transition:border-color .25s}
.faq details[open],.faq-mp details[open]{border-color:rgba(231,185,58,.5)}
.faq summary,.faq-mp summary{cursor:pointer;font:600 17px/1.4 Georgia,serif;color:#fff;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before,.faq-mp summary::before{content:"+";color:var(--gold);font-weight:700;margin-right:10px}
.faq details[open] summary::before,.faq-mp details[open] summary::before{content:"–"}
.faq p,.faq-mp p{color:var(--mut);margin:10px 0 0;font:400 15px/1.6 Georgia,serif}

/* countdown / prezzi */
.mp-promo{margin-top:12px}
.mp-line{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.mp-full{color:var(--mut);text-decoration:line-through;font:400 15px system-ui}
.mp-now{color:#fff;font:800 30px/1 'Sora',system-ui}
.mp-usdt{color:var(--gold);font:600 14px system-ui}
.mp-cd{color:#ff9a3c;font:600 13px/1 system-ui;letter-spacing:.02em;margin-top:8px;}

/* ============ TICKER CARDS SCORREVOLI (3 skin) ============ */
.tkr{overflow:hidden;position:relative;padding:18px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.tkr-track{display:flex;gap:18px;width:max-content;animation:tkrMove var(--dur,55s) linear infinite}
.tkr:hover .tkr-track{animation-play-state:paused}
@keyframes tkrMove{to{transform:translateX(-50%)}}
.tcard{flex:0 0 auto;width:300px;border-radius:16px;padding:20px;position:relative;overflow:hidden;
  background:linear-gradient(180deg,#161618,#101012);border:1px solid rgba(231,185,58,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 18px 40px -24px rgba(0,0,0,.9)}
/* SKIN 1 · AMAZON: shine dorato che scorre da solo + badge */
.tkr-amz .tcard{border-color:rgba(231,185,58,.45)}
.tkr-amz .tcard::after{content:"";position:absolute;top:0;left:-130%;width:60%;height:100%;
  background:linear-gradient(105deg,transparent,rgba(246,215,122,.22),transparent);
  transform:skewX(-18deg);animation:mpShine 4.2s infinite}
.tkr-amz .tcard .cat{color:var(--gold);font:700 10px system-ui;letter-spacing:.18em;text-transform:uppercase}
.tkr-amz .tcard h3{font:800 19px 'Sora',system-ui;margin:8px 0 6px;color:#fff}
.tkr-amz .tcard p{color:var(--mut);font-size:13.5px;line-height:1.55;margin:0 0 12px;text-align:left}
.tkr-amz .tcard .go{color:var(--gold);font:700 12px system-ui;letter-spacing:.08em}
/* SKIN 2 · RECENSIONI: stelle che brillano + bordo rilievo */
.tkr-rev .tcard{width:360px;border-style:solid;border-width:1px;
  box-shadow:inset 0 2px 0 rgba(255,255,255,.10),inset 0 -2px 0 rgba(0,0,0,.6),0 18px 40px -24px rgba(0,0,0,.9)}
.tkr-rev .stars{color:var(--gold);letter-spacing:3px;font-size:15px;text-shadow:0 0 8px rgba(231,185,58,.7)}
.tkr-rev .stars span{animation:twinkle 2.2s infinite}
.tkr-rev .stars span:nth-child(2){animation-delay:.3s}.tkr-rev .stars span:nth-child(3){animation-delay:.6s}
.tkr-rev .stars span:nth-child(4){animation-delay:.9s}.tkr-rev .stars span:nth-child(5){animation-delay:1.2s}
@keyframes twinkle{0%,100%{opacity:1}50%{opacity:.45}}
.tkr-rev .tcard p{color:#e7e7ea;font:italic 14px/1.6 Georgia,serif;margin:10px 0 12px;text-align:left}
.tkr-rev .tcard .who{color:var(--gold);font:700 13px 'Sora',system-ui}
.tkr-rev .tcard .co{color:var(--mut);font-size:12px}
/* SKIN 3 · COLLANE: bordo metallico animato + mini copertina */
.tkr-col .tcard{width:280px;padding:0;border:0;background:none;box-shadow:none;overflow:visible}
.tkr-col .metal{position:relative;border-radius:16px;padding:2px;
  background:linear-gradient(120deg,#7a6320,#F6D77A,#8a6f24,#E7B93A,#7a6320);background-size:300% 300%;
  animation:metalSweep 5s linear infinite}
@keyframes metalSweep{0%{background-position:0% 50%}100%{background-position:300% 50%}}
.tkr-col .in{border-radius:14px;background:linear-gradient(180deg,#17130a,#0d0d0f);padding:18px;text-align:center}
.tkr-col .mini{width:86px;height:120px;margin:0 auto 10px;border-radius:7px;border:1px solid var(--gold);
  background:linear-gradient(155deg,#241c0c,#0c0b08);display:flex;align-items:center;justify-content:center;
  color:var(--gold2);font:800 20px 'Sora',system-ui;box-shadow:0 14px 26px -12px rgba(0,0,0,.9)}
.tkr-col .in h3{font:800 16px 'Sora',system-ui;color:#fff;margin:0 0 4px}
.tkr-col .in .cl{color:var(--gold);font:italic 12px Georgia,serif}
.tkr-col .in .nb{color:var(--mut);font:11px system-ui;letter-spacing:.1em;text-transform:uppercase;margin-top:6px}
.tkr-col .refl{height:34px;margin-top:6px;border-radius:14px;transform:scaleY(-1);opacity:.18;
  background:linear-gradient(180deg,#17130a,transparent 80%)}
@media(prefers-reduced-motion:reduce){
  .price-card,.tier,.pcard,.card{transition:none}
  .cta::after,.buy::after,.btn-primary::after,.btn-p::after{display:none}
  .mp-stock .dot{animation:none}
}

/* ============================================================
   MOBILE-FIRST HARDENING · vale per TUTTE le pagine
   Zero sbordature orizzontali, testi fluidi, griglie che collassano.
   ============================================================ */
html,body{max-width:100%;overflow-x:hidden}
*,*::before,*::after{min-width:0}
img,video,canvas,svg,iframe{max-width:100%;height:auto}
table{display:block;overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
input,select,textarea,button{max-width:100%;font-size:max(16px,1em)} /* niente zoom iOS */
pre,code,.mono,.wal{word-break:break-all;white-space:pre-wrap}

/* titoli fluidi: mai più larghi dello schermo */
.hero h1,h1{font-size:clamp(30px,7.2vw,54px)!important;line-height:1.12!important;word-break:break-word}
h2.sec,h2{font-size:clamp(23px,5.4vw,36px)!important;line-height:1.2!important}
.hero .sub,.lead{font-size:clamp(15px,4vw,20px)!important}
.finalcta h2{font-size:clamp(24px,6vw,38px)!important}

@media(max-width:760px){
  .wrap,.hero{padding-left:14px!important;padding-right:14px!important}
  section{padding:36px 0}
  .grid2,.grid3,.tiers,.vs,.mesi,.pain,.steps,.flow,.cards,.kpis{grid-template-columns:1fr!important}
  .tier{margin-top:14px}
  .cta{display:block;margin:14px auto 0;width:100%;max-width:420px;padding:16px 18px;text-align:center;box-sizing:border-box}
  .pricebox{padding:22px 16px}
  .story{font-size:17px;line-height:1.8}
  .story .quote{font-size:18px}
  .trust{font-size:12.5px;line-height:1.6}
  .mp-urg{gap:6px;font-size:11.5px;padding:8px 8px;position:sticky}
  .mp-urg .pz b{font-size:13px}
  .tkr-rev .tcard{width:290px}
  .tkr-col .tcard{width:230px}
  .tcard{width:250px}
  .bookcover .tt{font-size:15px}
  #mpc{width:100%!important}
  .mp-ft .ctr{padding:22px 14px 16px}
  .mp-ft .lnk{font-size:12px;line-height:1.9}
  #ncPanel{width:calc(100vw - 20px)!important;right:10px!important;height:min(560px,70vh)!important}
  #ncBtn{right:14px;bottom:14px;width:56px;height:56px}
  .kpi .n{font-size:24px}
  .login{max-width:100%!important}
}
@media(max-width:400px){
  .hero h1,h1{font-size:clamp(26px,8vw,32px)!important}
  .mp-urg .st{display:none} /* su schermi micro resta prezzo+countdown */
}
