/* Pagine di funnel dei corsi: waiting list, lezioni gratuite (PLC) e dashboard.
   Direzione grafica ripresa da ZETA Evolution (titoli con sdoppiamento cromatico, tagli netti,
   fascia a strisce, scanline), con colori guidati dal tema scelto. Non modifica style.css. */

@font-face{font-family:Rajdhani;src:url('assets/fonts/Rajdhani-400-normal.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Rajdhani;src:url('assets/fonts/Rajdhani-600-normal.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:"Chakra Petch";src:url('assets/fonts/ChakraPetch-500-normal.woff2') format('woff2');font-weight:500;font-display:swap}

/* Variabili per tema: a1 accento principale, a2 secondario, g1/g2 sdoppiamento del titolo. */
:root{--fill:#2a63d4;--a1:#467ff7;--a2:#9bbcff;--g1:#1d4fc4;--g2:#9bbcff;--on-a1:#ffffff;--band-bg:#06429e;--band-text:#ffffff;--stripe-a:#467ff7;--stripe-b:#101214;--cx-display:Montserrat,system-ui,sans-serif;--cx-upper:none}
[data-tema="gotico"]{--fill:#c4a270;--a1:#c4a270;--a2:#ddbb85;--g1:#6e1717;--g2:#0000;--on-a1:#080808;--band-bg:#131211;--band-text:#e7e5e0;--stripe-a:#6e1717;--stripe-b:#080808;--cx-display:Georgia,"Times New Roman",serif}
[data-tema="punk"]{--fill:#fcee0a;--a1:#fcee0a;--a2:#00f0ff;--g1:#ff003c;--g2:#00f0ff;--on-a1:#0b0b10;--band-bg:#fcee0a;--band-text:#0b0b10;--stripe-a:#fcee0a;--stripe-b:#0b0b10;--cx-display:"Chakra Petch",Montserrat,sans-serif;--cx-upper:uppercase}

/* ---------- Intestazione ---------- */
.cx-header{position:absolute;inset:0 0 auto 0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px var(--gutter)}
.cx-header .brand img{width:150px;height:auto}
.cx-nav{display:flex;align-items:center;gap:26px;font-size:var(--fs-small);letter-spacing:.06em}
.cx-nav a{padding:8px 0;border-bottom:1px solid transparent}.cx-nav a:hover{color:var(--a2);border-color:var(--a2)}
.cx-nav .members{padding:9px 16px;border:1px solid var(--a2);color:var(--a2);border-radius:0}
@media(max-width:760px){.cx-nav a:not(.members){display:none}.cx-header .brand img{width:130px}}

/* ---------- Hero ---------- */
.cx-hero{position:relative;isolation:isolate;overflow:hidden;min-height:min(860px,100svh);display:flex;align-items:flex-end;padding-block:140px 110px}
.cx-hero-art{position:absolute;inset:0;z-index:-3;width:100%;height:100%;object-fit:cover;object-position:var(--art-pos,70% 20%)}
.cx-hero-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,var(--bg) 0%,color-mix(in srgb,var(--bg) 86%,transparent) 30%,color-mix(in srgb,var(--bg) 25%,transparent) 62%,transparent 90%),linear-gradient(0deg,var(--bg) 0%,transparent 40%)}
.cx-hero::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(0deg,#0000 0 2px,#0000002e 2px 3px);mix-blend-mode:multiply}
.cx-stripe{position:absolute;left:0;right:0;bottom:0;height:12px;background:repeating-linear-gradient(-45deg,var(--stripe-a) 0 14px,var(--stripe-b) 14px 28px)}
.cx-hero-content{width:100%}
.cx-eyebrow{color:var(--a2);font-size:var(--fs-small);letter-spacing:.42em;text-transform:uppercase;margin-bottom:22px}
.cx-title{font-family:var(--cx-display);font-weight:700;text-transform:var(--cx-upper);line-height:.95;letter-spacing:-.03em;margin:0;font-size:clamp(3.2rem,10.4vw,9rem)}
.cx-title span{display:block}
.cx-title .t1{color:var(--a1);text-shadow:4px 0 0 var(--g1),-4px 0 0 var(--g2)}
.cx-title .t2{color:var(--text);text-shadow:3px 0 0 var(--g1),-3px 0 0 var(--g2);font-size:.86em}
[data-tema="gotico"] .cx-title{font-weight:400;letter-spacing:-.02em}
[data-tema="gotico"] .cx-title .t1,[data-tema="gotico"] .cx-title .t2{text-shadow:0 3px 0 #000a,0 0 28px #6e171755}
.cx-tagline{font-size:var(--fs-lead);color:var(--text);margin:28px 0 0;max-width:620px}
.cx-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.cx-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border:1px solid color-mix(in srgb,var(--a1) 55%,transparent);background:color-mix(in srgb,var(--bg) 70%,transparent);color:var(--a1);font-size:var(--fs-small);letter-spacing:.14em;text-transform:uppercase;font-weight:600;backdrop-filter:blur(4px)}
.cx-actions{display:flex;flex-wrap:wrap;gap:22px 30px;align-items:center;margin-top:34px}
.cx-btn{display:inline-flex;align-items:center;justify-content:center;gap:18px;padding:19px 34px;border:0;background:var(--fill);color:var(--on-a1);font:700 var(--fs-body)/1.2 var(--cx-display);text-transform:var(--cx-upper);letter-spacing:.02em;cursor:pointer;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));transition:background .2s,transform .2s}
.cx-btn:hover{background:var(--a2);transform:translateY(-2px)}.cx-btn:focus-visible{clip-path:none;outline:3px solid var(--a2);outline-offset:4px}
.cx-btn:disabled{background:#2b2f38;color:#9aa3b2;cursor:not-allowed;transform:none}
.cx-link{color:var(--text);border-bottom:1px solid var(--a2);padding:8px 0;font-size:var(--fs-body)}.cx-link:hover{color:var(--a2)}

/* ---------- Percorso nel funnel ---------- */
.cx-steps{margin-top:-62px;position:relative;z-index:5}
.cx-steps ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:2px;background:color-mix(in srgb,var(--a1) 30%,transparent);border:1px solid color-mix(in srgb,var(--a1) 45%,transparent)}
.cx-steps.four ol{grid-template-columns:repeat(4,1fr)}
.cx-step{display:flex;flex-direction:column;gap:6px;height:100%;padding:20px 22px;background:color-mix(in srgb,var(--bg) 92%,var(--a1));font-size:var(--fs-small);min-width:0}
a.cx-step:hover{background:color-mix(in srgb,var(--bg) 82%,var(--a1))}
.cx-step-n{color:var(--a2);letter-spacing:.16em;text-transform:uppercase;font-weight:600;font-size:var(--fs-small)}
.cx-step-t{font:600 var(--fs-lead)/1.2 var(--cx-display);text-transform:var(--cx-upper);letter-spacing:-.01em}
.cx-step-s{color:var(--muted);margin-top:auto;display:flex;align-items:center;gap:7px}
.cx-step.is-current{background:color-mix(in srgb,var(--bg) 70%,var(--a1));box-shadow:inset 0 3px 0 var(--a1)}
.cx-step.is-locked,.cx-step.is-locked .cx-step-n,.cx-step.is-locked .cx-step-t{color:var(--muted)}
.cx-step.is-sales{background:color-mix(in srgb,var(--bg) 78%,var(--g1))}.cx-step.is-sales .cx-step-n{color:var(--a2)}
.cx-step svg{flex-shrink:0}
@media(max-width:900px){.cx-steps ol,.cx-steps.four ol{grid-template-columns:1fr 1fr}.cx-steps{margin-top:-40px}}
@media(max-width:480px){.cx-steps ol,.cx-steps.four ol{grid-template-columns:1fr}}

/* ---------- Testi e video ---------- */
.cx-section{padding-block:90px}
.cx-lead{font-size:var(--fs-lead);line-height:1.5;color:var(--text);max-width:820px}
.cx-copy{max-width:780px;color:var(--muted)}.cx-copy strong{color:var(--text)}
.cx-h2{font:700 var(--fs-h2)/1.05 var(--cx-display);text-transform:var(--cx-upper);letter-spacing:-.03em;margin-bottom:34px}
[data-tema="gotico"] .cx-h2{font-weight:400}
.cx-split{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}
.cx-split img{width:100%;height:100%;max-height:520px;object-fit:cover;border:1px solid color-mix(in srgb,var(--a1) 45%,transparent);box-shadow:10px 10px 0 color-mix(in srgb,var(--g1) 55%,transparent)}
.cx-pending{display:flex;align-items:center;gap:14px;margin-top:26px;padding:16px 20px;border-left:3px solid var(--a1);background:color-mix(in srgb,var(--bg) 85%,var(--a1));font-size:var(--fs-small);color:var(--muted)}
@media(max-width:900px){.cx-split{grid-template-columns:1fr;gap:34px}.cx-section{padding-block:60px}}

.cx-video{position:relative;aspect-ratio:16/9;margin:6px 0 34px;border:1px solid color-mix(in srgb,var(--a1) 50%,transparent);box-shadow:0 0 60px color-mix(in srgb,var(--a1) 18%,transparent);background:#000;overflow:hidden}
.cx-video iframe,.cx-video .cx-video-ph{position:absolute;inset:0;width:100%;height:100%;border:0}
.cx-video-ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:24px;background:radial-gradient(ellipse at center,color-mix(in srgb,var(--a1) 14%,#000),#000 75%);color:var(--muted)}
.cx-video-ph strong{font:700 var(--fs-h3)/1.1 var(--cx-display);text-transform:var(--cx-upper);color:var(--a1)}
.cx-lesson-tag{display:inline-block;padding:7px 16px;background:var(--fill);color:var(--on-a1);font:700 var(--fs-small)/1 var(--cx-display);letter-spacing:.14em;text-transform:uppercase;margin:0 0 26px;clip-path:polygon(0 0,100% 0,calc(100% - 10px) 100%,0 100%)}
.cx-bridge{margin-top:44px;padding:22px 26px;border-left:3px solid var(--a1);background:color-mix(in srgb,var(--bg) 88%,var(--a1));max-width:780px}
.cx-bridge a{color:var(--a1);border-bottom:1px solid var(--a1)}

/* ---------- PLC: sfondo video ---------- */
.plc-bg{position:absolute;top:0;left:0;right:0;height:min(980px,120svh);z-index:-5;background:var(--bg);overflow:hidden}
.plc-bg video{width:100%;height:100%;object-fit:cover;object-position:70% 20%;opacity:.95}
.plc-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,var(--bg) 0%,color-mix(in srgb,var(--bg) 80%,transparent) 30%,color-mix(in srgb,var(--bg) 18%,transparent) 62%,transparent 85%),linear-gradient(0deg,var(--bg) 2%,transparent 42%)}
body.plc-page{position:relative;background:transparent}
.plc-hero{padding-block:150px 90px}
.plc-hero .cx-title{font-size:clamp(3rem,8.6vw,7.4rem)}
.plc-badge{display:inline-block;margin:24px 0 26px;padding:9px 18px;background:var(--fill);color:var(--on-a1);font:700 var(--fs-small)/1 var(--cx-display);letter-spacing:.14em;text-transform:uppercase}
.plc-hero p.cx-lead{margin-bottom:18px}

/* ---------- Fascia di iscrizione ---------- */
.cx-band{position:relative;background:var(--band-bg);color:var(--band-text);padding-block:100px;border-top:12px solid transparent;border-image:repeating-linear-gradient(-45deg,var(--stripe-a) 0 14px,var(--stripe-b) 14px 28px) 12}
.cx-band .wrap{display:grid;grid-template-columns:1fr minmax(320px,520px);gap:70px;align-items:center}
.cx-band h2{margin-bottom:22px;font:700 var(--fs-h2)/1.02 var(--cx-display);text-transform:var(--cx-upper);letter-spacing:-.03em;color:inherit}
[data-tema="gotico"] .cx-band h2{font-weight:400}
.cx-band p{color:inherit;opacity:.88}
.cx-band .eyebrow{color:inherit;opacity:.8}
.cx-band .waiting-panel{background:#0b0b10;color:#f3f5f8;border:0;padding:34px;clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px))}
.cx-band .waiting-panel h2{font-size:var(--fs-h3);color:#f3f5f8}
.cx-band .waiting-panel .eyebrow{color:var(--a1);opacity:1}
.cx-band .waiting-panel p{opacity:1;color:#bcc6d2}
[data-tema="classico"] .cx-band .waiting-panel .eyebrow,:root:not([data-tema]) .cx-band .waiting-panel .eyebrow{color:#9bbcff}
.cx-band .waiting-form .button{background:var(--a1);color:var(--on-a1);clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));font-family:var(--cx-display);text-transform:var(--cx-upper)}
.cx-band .waiting-form .button:disabled{background:#2b2f38;color:#9aa3b2}
@media(max-width:900px){.cx-band .wrap{grid-template-columns:1fr;gap:34px}.cx-band{padding-block:64px}}

.cx-footer{padding-block:48px 110px;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;font-size:var(--fs-small);color:var(--muted)}
.cx-footer a:hover{color:var(--a2)}.cx-footer nav{display:flex;gap:26px;flex-wrap:wrap}

@media(prefers-reduced-motion:reduce){.plc-bg video{display:none}.cx-btn{transition:none}}
[hidden]{display:none!important}
.next-step{display:inline-flex;margin-top:22px;color:var(--a1);border-bottom:1px solid var(--a1);padding-bottom:6px;font-weight:600}

/* ---------- Movimento: entrata del titolo ---------- */
@keyframes cx-su{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:no-preference){
  .cx-hero-content>*,.plc-hero>*,.hero-content>*{animation:cx-su .8s cubic-bezier(.2,.7,.2,1) both}
  .cx-hero-content>:nth-child(2),.plc-hero>:nth-child(2),.hero-content>:nth-child(2){animation-delay:.12s}
  .cx-hero-content>:nth-child(3),.plc-hero>:nth-child(3),.hero-content>:nth-child(3){animation-delay:.24s}
  .cx-hero-content>:nth-child(4),.plc-hero>:nth-child(4),.hero-content>:nth-child(4){animation-delay:.36s}
  .cx-hero-content>:nth-child(n+5),.plc-hero>:nth-child(n+5),.hero-content>:nth-child(n+5){animation-delay:.48s}
}