/*
Theme Name: ELYAZ
Theme URI: https://elyazmusic.com
Description: Tema su misura "Cinema Nero" per elyazmusic.com — design first-party, zero page builder, peso piuma.
Author: ELYAZ
Version: 0.1.0
Requires PHP: 8.0
*/

:root{color-scheme:dark;--nero:#000;--avorio:#fff;--argento:#b3b9c2;--linea:rgba(255,255,255,.1)}
html{background:var(--nero);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{background:transparent;color:var(--avorio);font-family:"Trebuchet MS",Helvetica,Arial,sans-serif;font-weight:300;margin:0;line-height:1.6}
body:before{content:"";position:fixed;inset:0;background:url('/wp-content/uploads/elyaz-site-bg-blur.jpg') center/cover no-repeat;filter:brightness(.42);transform:scale(1.15);z-index:-1}
html body{background:transparent!important}
a{color:inherit}
.solo-lettori{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.errore404 .sec-in{max-width:820px;margin:0 auto;padding:120px 24px 140px;text-align:center}
.errore404 .e404links{display:flex;gap:30px;justify-content:center;flex-wrap:wrap;margin-top:34px}
.errore404 .e404links .morelink{margin:0}
.navbar{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(0,0,0,.78);backdrop-filter:blur(8px);border-bottom:1px solid var(--linea)}
.navbar .in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:14px 26px;gap:18px}
.navbar .logo{justify-self:start}
.navbar .menu{justify-self:center}
.navbar .thm{justify-self:end}
@media (max-width:900px){
.navbar .in{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;gap:10px}
.navbar .menu{display:none}
.burger{display:block}
.navbar .thm{width:28px;height:28px;font-size:12px;margin-left:auto}
}
.logo{position:relative;display:block;height:27px;width:118px}
.logo img{position:absolute;top:50%;transform:translateY(-50%)}
.logo .lg-y{left:0;height:27px;transition:transform .5s cubic-bezier(.3,.7,.25,1) .18s}
.logo .lg-e,.logo .lg-l,.logo .lg-a,.logo .lg-z{height:27px;opacity:0;transition:opacity .3s ease,transform .38s cubic-bezier(.3,.7,.25,1)}
.logo .lg-e{left:0;transform:translateY(-50%) translateX(26px)}
.logo .lg-l{left:25.1px;transform:translateY(-50%) translateX(14px);transition-delay:.08s}
.logo .lg-a{left:67.5px;transform:translateY(-50%) translateX(-14px);transition-delay:.08s}
.logo .lg-z{left:96.7px;transform:translateY(-50%) translateX(-26px)}
.navbar.scrolled .lg-e,.navbar.scrolled .lg-l,.navbar.scrolled .lg-a,.navbar.scrolled .lg-z{opacity:1;transform:translateY(-50%) translateX(0)}
.navbar.scrolled .lg-l,.navbar.scrolled .lg-a{transition:opacity .34s ease .16s,transform .44s cubic-bezier(.3,.7,.25,1) .16s}
.navbar.scrolled .lg-e,.navbar.scrolled .lg-z{transition:opacity .34s ease .26s,transform .44s cubic-bezier(.3,.7,.25,1) .26s}
.navbar.scrolled .lg-y{transform:translateY(-50%) translateX(41.8px);transition:transform .55s cubic-bezier(.3,.7,.25,1)}
@media (prefers-reduced-motion:reduce){.logo img{transition:opacity .3s!important}}
.menu{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.menu a{color:#d6d9de;text-decoration:none;font-size:11px;letter-spacing:.28em;text-transform:uppercase;transition:color .2s}
.menu a:hover,.menu a:focus-visible{color:#fff}

.hero{position:relative;z-index:2;height:88vh;min-height:520px;overflow:hidden;clip-path:inset(0);background:#000}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.3s ease;z-index:1}
.slide.on{opacity:1;z-index:2}
.slide .bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.02);overflow:hidden}
.slide .bg img{width:100%;height:100%;object-fit:cover;display:block}
.slide .bg{animation:kb 16s ease-in-out infinite alternate}
.slide:nth-child(2) .bg{animation-delay:-4s}
.slide:nth-child(3) .bg{animation-delay:-8s}
.slide:nth-child(4) .bg{animation-delay:-12s}
@keyframes kb{to{transform:scale(1.12)}}
.slide .ct{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 24px;gap:clamp(22px,3.2vw,62px);background:radial-gradient(ellipse 70% 56% at 50% 55%,rgba(0,0,0,.42),rgba(0,0,0,0) 72%)}
.hero .brand{font-weight:200;font-size:clamp(25px,2.58vw,44px);letter-spacing:.6em;text-indent:.6em;text-transform:uppercase;margin:0;text-shadow:0 1px 6px rgba(0,0,0,.5)}
.hero .title{font-weight:200;text-transform:uppercase;line-height:1.14;max-width:96vw;margin:0;text-shadow:0 2px 12px rgba(0,0,0,.55)}
.hero .play{width:clamp(70px,6vw,104px);height:clamp(70px,6vw,104px);border:0;background:transparent;cursor:pointer;position:relative;transition:transform .35s cubic-bezier(.2,.7,.3,1)}
.hero .play:before{content:"";position:absolute;top:50%;left:50%;width:66%;height:66%;transform:translate(-50%,-50%) scale(0);border:2px solid rgba(255,255,255,.55);border-radius:50%;opacity:0;pointer-events:none;animation:ehPulse 2.6s ease-out infinite 1.5s}
@keyframes ehPulse{0%{transform:translate(-50%,-50%) scale(0);opacity:.75}70%{opacity:.12}100%{transform:translate(-50%,-50%) scale(2.6);opacity:0}}
@media (prefers-reduced-motion:reduce){.hero .play:before{animation:none}}
.hero .play:hover{transform:scale(1.16)}
.hero .play:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-40%,-50%);width:0;height:0;border-style:solid;border-width:.2em 0 .2em .35em;font-size:clamp(70px,6vw,104px);border-color:transparent transparent transparent #fff;filter:drop-shadow(0 2px 8px rgba(0,0,0,.6))}
.hero .cta{font-weight:200;font-size:clamp(25px,3.23vw,52px);letter-spacing:.28em;text-indent:.28em;text-transform:uppercase;color:#fff;text-decoration:none;margin:0;text-shadow:0 1px 6px rgba(0,0,0,.5);transition:opacity .3s}
.hero .cta:hover{opacity:.68}
.dots{position:absolute;bottom:22px;left:0;right:0;display:flex;justify-content:center;gap:12px;z-index:5}
.dots i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.4);cursor:pointer;transition:background .3s}
.dots i.on{background:#fff}
.arr{position:absolute;top:50%;transform:translateY(-50%);z-index:5;background:none;border:0;color:rgba(255,255,255,.7);font-size:34px;cursor:pointer;padding:16px;font-family:Arial}
.arr:hover{color:#fff}.arr.p{left:6px}.arr.n{right:6px}
@media(prefers-reduced-motion:reduce){.slide .bg{animation:none}}

section{padding:84px 24px}
.sec-in{max-width:1150px;margin:0 auto}
h1.sec,h2.sec{font-weight:200;text-transform:uppercase;letter-spacing:.34em;text-indent:.34em;font-size:clamp(21px,3vw,32px);text-align:center;margin:0 0 12px}
.sep{width:56px;height:1px;background:rgba(255,255,255,.35);margin:0 auto 44px}

.covers{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.covers figure{margin:0;position:relative;overflow:hidden}
.covers img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;display:block;transition:transform .6s ease}
.covers figure:hover img{transform:scale(1.06)}
.covers figcaption{position:absolute;inset:auto 0 0;padding:24px 6px 10px;background:linear-gradient(transparent,rgba(0,0,0,.85));font-size:10px;letter-spacing:.22em;text-transform:uppercase;text-align:center}
@media(max-width:700px){.covers{grid-template-columns:repeat(3,1fr)}.covers figure:nth-child(n+4){display:none}}
.morelink{display:block;text-align:center;margin-top:32px;color:#d6d9de;text-decoration:none;font-size:11.5px;letter-spacing:.3em;text-transform:uppercase}
.morelink:hover{color:#fff}

.numbers{border-top:1px solid var(--linea);border-bottom:1px solid var(--linea);background:rgba(0,0,0,.5);padding:58px 24px}
.numbers .in{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:26px;text-align:center}
.numbers .v{font-weight:200;font-size:clamp(30px,4.6vw,54px);letter-spacing:.14em;margin:0;font-variant-numeric:tabular-nums}
.numbers .l{font-size:10.5px;letter-spacing:.32em;text-transform:uppercase;color:var(--argento);margin:8px 0 0}
@media(max-width:600px){.numbers .in{grid-template-columns:1fr;gap:34px}}

.vgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.vgrid figure{margin:0;position:relative;overflow:hidden;cursor:pointer}
.vgrid img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;display:block;transition:transform .6s ease,filter .4s}
.vgrid figure:hover img{transform:scale(1.05);filter:brightness(1.1)}
.vgrid .vp{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%) scale(.7);width:0;height:0;border-style:solid;border-width:13px 0 13px 22px;border-color:transparent transparent transparent #fff;filter:drop-shadow(0 2px 8px rgba(0,0,0,.7));pointer-events:none;opacity:0;transition:opacity .3s,transform .3s}
.vgrid figure:hover .vp{opacity:1;transform:translate(-50%,-50%) scale(1)}

@media(hover:none){.vgrid .vp{opacity:.85;transform:translate(-50%,-50%) scale(.85)}}
.vgrid figcaption{position:absolute;inset:auto 0 0;padding:22px 8px 9px;background:linear-gradient(transparent,rgba(0,0,0,.85));font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;text-align:center}
@media(max-width:760px){.vgrid{grid-template-columns:repeat(2,1fr)}}

.plband{padding:74px 24px;background:rgba(0,0,0,.45);border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.plband .in{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:1fr auto;gap:44px;align-items:center}
.plband .t{font-weight:200;text-transform:uppercase;letter-spacing:.32em;font-size:clamp(19px,2.6vw,28px);margin:0 0 10px}
.plband p{color:var(--argento);font-size:14px;margin:0 0 18px;max-width:44ch}
.plband .go{color:#c9cdd4;text-decoration:none;font-size:11.5px;letter-spacing:.3em;text-transform:uppercase;transition:color .3s}
.plband .go:hover{color:#fff}
.plcv{display:grid;grid-template-columns:repeat(2,110px);grid-auto-rows:110px;gap:10px}
.plcv img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:700px){.plband .in{grid-template-columns:1fr;text-align:center}.plband p{margin-left:auto;margin-right:auto}.plcv{margin:0 auto}}

.phrow{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:1000px;margin:0 auto}
.phrow figure{margin:0;overflow:hidden}
.phrow img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;display:block;transition:transform .6s ease}
.phrow figure:hover img{transform:scale(1.05)}
@media(max-width:640px){.phrow{grid-template-columns:repeat(2,1fr)}.phrow figure:nth-child(n+5){display:none}}

.manif{padding:110px 24px;text-align:center}
.manif .q{font-weight:200;text-transform:uppercase;letter-spacing:.3em;text-indent:.3em;font-size:clamp(19px,3.4vw,38px);line-height:1.6;margin:0 0 28px;text-wrap:balance}
.follow{display:flex;justify-content:center;gap:28px;flex-wrap:wrap;margin-top:36px}
.follow a{display:block;color:#c7cbd2;transition:color .25s,transform .25s}
.follow a:hover,.follow a:focus-visible{transform:translateY(-3px)}
.follow svg{width:22px;height:22px;display:block;fill:currentColor}
.follow a[aria-label="Spotify"]:hover{color:#1DB954}
.follow a[aria-label="YouTube"]:hover{color:#FF0000}
.follow a[aria-label="Apple Music"]:hover svg path{fill:url(#amg)}
.follow a[aria-label="Amazon Music"]:hover{color:#25D1DA}
.follow a[aria-label="Deezer"]:hover{color:#A238FF}
.follow a[aria-label="Tidal"]:hover{color:#7de3ff}
.follow a[aria-label="Beatport"]:hover{color:#01FF95}
.follow a[aria-label="Pandora"]:hover{color:#3668FF}
.follow a[aria-label="SoundCloud"]:hover{color:#FF5500}
.follow a[aria-label="Facebook"]:hover{color:#1877F2}
.follow a[aria-label="X"]:hover{color:#fff}
.follow a[aria-label="Instagram"]:hover svg path,.follow a[aria-label="Instagram"]:hover svg circle{fill:url(#igg)}



.join{padding:88px 24px;border-top:1px solid var(--linea);background:rgba(0,0,0,.32);text-align:center}
.join h2{font-weight:200;text-transform:uppercase;letter-spacing:.34em;text-indent:.34em;font-size:clamp(19px,2.8vw,28px);margin:0 0 12px}
.join p{color:var(--argento);font-size:13.5px;margin:0 0 34px}
.jform{display:flex;max-width:430px;margin:0 auto;gap:0;border-bottom:1px solid rgba(255,255,255,.35)}
.jform input{flex:1;background:none;border:0;color:#fff;font-family:inherit;font-weight:300;font-size:13px;letter-spacing:.14em;padding:12px 4px;outline:none}
.jform input::placeholder{color:#8b919b;text-transform:uppercase;letter-spacing:.22em;font-size:11px}
.jform button{background:none;border:0;color:#fff;font-family:inherit;font-size:11px;letter-spacing:.3em;text-transform:uppercase;cursor:pointer;padding:12px 6px;transition:opacity .2s}
.jform button:hover{opacity:.7}
/* campo esca invisibile alle persone, irresistibile per i robot */
.jform .eh-web{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
/* .join p (13.5px) vincerebbe per specificita: servono selettori a due classi */
.join .jmsg{max-width:430px;margin:0 auto 18px;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--avorio)}
/* esito dell'iscrizione: verde smorzato per non rompere il monocromo del sito */
.join .jmsg.si,.join .jmsg.no{padding:14px 20px;border:1px solid;border-radius:3px;line-height:1.5}
.join .jmsg.si{color:#8fe0ab;border-color:rgba(143,224,171,.42);background:rgba(80,200,130,.13)}
.join .jmsg.no{color:#e8b1a4;border-color:rgba(232,177,164,.42);background:rgba(200,90,70,.13)}
html.light body .join .jmsg.si{color:#1c6b3f;border-color:rgba(28,107,63,.32);background:rgba(80,180,120,.14)}
html.light body .join .jmsg.no{color:#8c3524;border-color:rgba(140,53,36,.3);background:rgba(190,80,60,.12)}
.join .jpriv{font-size:10.5px;color:#7c828c;margin:16px 0 0;letter-spacing:.08em}
.join .jpriv a{color:inherit;text-decoration:underline}
html.light body .jpriv{color:#6b717c}
.join .micro{font-size:10.5px;color:#7c828c;margin:18px 0 0;letter-spacing:.08em}

footer{border-top:1px solid var(--linea);background:rgba(0,0,0,.78);padding:46px 24px 40px;text-align:center}
.copy{color:#9aa0ab;font-size:12px;margin:0 0 8px}
.legal{color:#7c828c;font-size:11px}
.legal a{color:#9aa0ab;text-decoration:none;margin:0 7px}
/* il richiamo preferenze cookie e un button (l'ancora href="#" riportava in cima): stesso vestito dei link */
.legal button{background:none;border:0;padding:0;margin:0 7px;font:inherit;color:#9aa0ab;cursor:pointer;letter-spacing:inherit}
.covers figure{cursor:pointer}
.after{position:relative;z-index:3}
/* lo stato di partenza deve essere immediato: se la transizione fosse dichiarata qui,
   la card comincerebbe ad ANIMARSI verso l'invisibile invece di esserlo subito, e con
   l'immagine gia' pronta (tipico su computer) il via libera arriverebbe prima che sia
   scesa: nessuna dissolvenza visibile. La transizione va sullo stato di arrivo. */
.rv{opacity:0;transform:translateY(26px)}
.rv.on{opacity:1;transform:translateY(0);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.6,.2,1)}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}
.hero .seam{position:absolute;left:0;right:0;bottom:0;height:220px;background:linear-gradient(180deg,rgba(11,13,16,0) 0%,rgba(11,13,16,.35) 45%,rgba(11,13,16,.75) 75%,#0b0d10 93%,#0b0d10 100%);pointer-events:none;z-index:3}
#music{position:relative;--jc0:#0b0d10;--jc75:rgba(11,13,16,.75);--jc30:rgba(11,13,16,.3);--jcT:rgba(11,13,16,0);--ms0:0%;--ms1:30%;--ms2:62%}
#music:before{content:"";position:absolute;top:-3px;left:0;right:0;height:243px;background:linear-gradient(180deg,var(--jc0) 0%,var(--jc0) var(--ms0),var(--jc75) var(--ms1),var(--jc30) var(--ms2),var(--jcT) 100%);pointer-events:none;z-index:-1}
.hero .arr,.hero .dots{z-index:5}
html.light{color-scheme:light;--nero:#f8f9fb;--avorio:#16191e;--argento:#59606b;--linea:rgba(0,0,0,.08);background:#f8f9fb!important}
html.light body:before{background-image:url('/wp-content/uploads/elyaz-site-bg-blur-light-v2.webp');filter:none;opacity:1}
html.light body .hero{background:#f1f2f5}
html.light body .navbar{background:rgba(251,252,254,.88)}
html.light body .logo img{filter:invert(1)}
html.light body .menu a{color:#2a2e35}
html.light body .menu a:hover{color:#000}
html.light body .sep{background:rgba(0,0,0,.3)}
html.light body .morelink{color:#3a3f47}
html.light body .morelink:hover{color:#000}
html.light body .numbers{background:rgba(255,255,255,.78)}
html.light body .plband{background:rgba(255,255,255,.72)}
html.light body .plband .go{color:#3a3f47}
html.light body .plband .go:hover{color:#000}
html.light body .join{background:rgba(255,255,255,.62)}
html.light body .jform input,html.light body .jform button{color:#16191e}
html.light body .jform{border-color:rgba(0,0,0,.3)}
html.light body footer{background:#fff}
html.light body .copy,html.light body .legal a,html.light body .legal button{color:#565c66}
html.light body .legal{color:#6b717c}
html.light body .micro{color:#6b717c}
html.light body .follow a{color:#363b43}
html.light body .hero .seam{background:linear-gradient(180deg,rgba(241,242,245,0) 0%,rgba(241,242,245,0.016) 11.6%,rgba(241,242,245,0.104) 23.2%,rgba(241,242,245,0.275) 34.9%,rgba(241,242,245,0.5) 46.5%,rgba(241,242,245,0.725) 58.1%,rgba(241,242,245,0.896) 69.8%,rgba(241,242,245,0.984) 81.4%,#f1f2f5 93%,#f1f2f5 100%)}
html.light body #music{--jc0:#f1f2f5;--jc75:rgba(241,242,245,.75);--jc30:rgba(241,242,245,.3);--jcT:rgba(241,242,245,0)}
html.theme-anim,body.theme-anim,body.theme-anim:before,body.theme-anim .navbar,body.theme-anim .numbers,body.theme-anim .plband,body.theme-anim .join,body.theme-anim footer{transition:background .5s ease,color .5s ease,filter .5s ease}
.thm{background:none;border:1px solid var(--linea);color:var(--avorio);width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:13px;line-height:1;padding:0;transition:border-color .3s,color .3s}
.thm:hover{border-color:var(--argento)}
.hero .ct{color:#fff}
html.light body .dots i{background:rgba(0,0,0,.28)}
html.light body .dots i.on{background:#1a1d22}
@keyframes ehUp{0%{opacity:0;transform:translateY(20px)}100%{opacity:1;transform:none}}
@keyframes ehFade{0%{opacity:0}100%{opacity:1}}
.slide .brand,.slide .title,.slide .cta{opacity:0;transform:translateY(-10px);transition:opacity .5s ease,transform .5s ease}
.slide .play{opacity:0;transition:opacity .5s ease,transform .35s cubic-bezier(.2,.7,.3,1)}
.slide.on .brand{animation:ehUp 1s ease .3s both}
.slide.on .title{animation:ehUp 1.2s ease .55s both}
.slide.on .play{animation:ehFade 1s ease 1s both}
.slide.on .cta{animation:ehUp 1s ease 1.25s both}
@media (prefers-reduced-motion:reduce){.slide .brand,.slide .title,.slide .cta,.slide .play{opacity:1;transform:none;transition:none;animation:none!important}}
@keyframes ehOut{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-10px)}}
.slide.out .brand,.slide.out .title,.slide.out .cta,.slide.out .play{animation:ehOut .5s ease both}
@media (max-width:767px){
.ct{gap:22px;padding:0 20px;background:radial-gradient(ellipse 130% 48% at 50% 55%,rgba(0,0,0,.46),rgba(0,0,0,0) 74%)}
.hero .brand{letter-spacing:.4em;text-indent:.4em}
.hero .title{letter-spacing:.16em!important;text-indent:.16em!important;line-height:1.28}
.hero .cta{letter-spacing:.16em;text-indent:.16em}
.hero .title.t-tp{letter-spacing:.12em!important;text-indent:.12em!important}
}
.burger{display:none;background:none;border:0;width:34px;height:34px;position:relative;cursor:pointer;padding:0;flex:none}
.burger span{position:absolute;left:7px;right:7px;height:1.5px;background:var(--avorio);transition:transform .35s,opacity .3s,top .35s}
.burger span:nth-child(1){top:11px}
.burger span:nth-child(2){top:17px}
.burger span:nth-child(3){top:23px}
body.nav-open .burger span:nth-child(1){top:17px;transform:rotate(45deg)}
body.nav-open .burger span:nth-child(2){opacity:0}
body.nav-open .burger span:nth-child(3){top:17px;transform:rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:49;background:rgba(0,0,0,.93);backdrop-filter:blur(16px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;opacity:0;pointer-events:none;transition:opacity .4s ease;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:78px 20px 40px;box-sizing:border-box}
@media (max-height:560px){.mnav{justify-content:flex-start;gap:15px;padding-top:64px}.mnav a{font-size:14px}}
body.nav-open .mnav{opacity:1;pointer-events:auto}
.mnav a{color:var(--avorio);text-decoration:none;font-size:16px;letter-spacing:.34em;text-indent:.34em;text-transform:uppercase;opacity:0;transform:translateY(16px);transition:opacity .45s ease,transform .45s ease}
body.nav-open .mnav a{opacity:1;transform:none}
body.nav-open .mnav a:nth-child(1){transition-delay:.06s}
body.nav-open .mnav a:nth-child(2){transition-delay:.11s}
body.nav-open .mnav a:nth-child(3){transition-delay:.16s}
body.nav-open .mnav a:nth-child(4){transition-delay:.21s}
body.nav-open .mnav a:nth-child(5){transition-delay:.26s}
body.nav-open .mnav a:nth-child(6){transition-delay:.31s}
body.nav-open .mnav a:nth-child(7){transition-delay:.36s}
html.light body .mnav{background:rgba(248,249,251,.95)}
body.nav-open{overflow:hidden}
@media (prefers-reduced-motion:reduce){.mnav a{transition:opacity .3s ease;transform:none}}
@media (max-width:900px){.burger{display:block}}
@media (max-width:640px){.follow{display:grid;grid-template-columns:repeat(6,max-content);justify-content:center;gap:20px 24px}}
@media (max-width:380px){.follow{grid-template-columns:repeat(4,max-content)}}
@media (max-width:700px){.plband .t{margin:0 auto 10px}}
.follow a{opacity:0}
.follow.lit a{animation:star .9s ease both}
@keyframes star{0%{opacity:0}55%{opacity:1}70%{opacity:.55}100%{opacity:1}}
.follow.lit a:nth-child(1){animation-delay:700ms}
.follow.lit a:nth-child(2){animation-delay:200ms}
.follow.lit a:nth-child(3){animation-delay:1000ms}
.follow.lit a:nth-child(4){animation-delay:400ms}
.follow.lit a:nth-child(5){animation-delay:0ms}
.follow.lit a:nth-child(6){animation-delay:900ms}
.follow.lit a:nth-child(7){animation-delay:500ms}
.follow.lit a:nth-child(8){animation-delay:1100ms}
.follow.lit a:nth-child(9){animation-delay:100ms}
.follow.lit a:nth-child(10){animation-delay:800ms}
.follow.lit a:nth-child(11){animation-delay:300ms}
.follow.lit a:nth-child(12){animation-delay:600ms}
@media (prefers-reduced-motion:reduce){.follow a{opacity:1!important;animation:none!important}}

/* --- adattamenti WordPress --- */
.hero .play{display:block}
.covlink{display:block;color:inherit;text-decoration:none}
.pagewrap{padding-top:96px;min-height:60vh}
.pagewrap article{max-width:1150px;margin:0 auto;padding:24px}

/* --- menu WordPress dentro la navbar --- */
.menu li,.mnav li{list-style:none;display:contents}
.menu ul,.mnav ul{margin:0;padding:0;display:contents}

/* --- pagina Music --- */
.musicpage .sec-in{max-width:1000px;margin:0 auto;padding:24px}
/* contact e about: stesso attacco verticale del titolo delle altre pagine (il padding 84px di section) */
.contactpage .sec-in,.aboutpage .sec-in{padding:24px}
.mgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:8px 0 48px}
.mcard{display:block;color:inherit;text-decoration:none}
.mcard figure{margin:0;position:relative;overflow:hidden}
.mcard img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;display:block;transition:transform .6s ease}
.mcard:hover img{transform:scale(1.05)}
.mcard figcaption{position:absolute;inset:auto 0 0;padding:26px 12px 12px;background:linear-gradient(transparent,rgba(0,0,0,.85));display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.mcard .mt{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#fff}
.mcard .my{font-size:10px;color:var(--argento);letter-spacing:.12em}
@media (max-width:700px){.mgrid{grid-template-columns:repeat(2,1fr);gap:12px}}

/* --- footer sempre in fondo --- */
body{min-height:100vh;display:flex;flex-direction:column}
main.after{flex:1 0 auto;display:flex;flex-direction:column}
main.after > footer{margin-top:auto}




/* --- landing --- */
.landingpage{padding-top:92px}
.landingpage article{font-size:13px}
.landingpage .service{line-height:18px}
.landingpage .elyaz-smart-logo{display:none!important}
.landingnav .in{display:flex;justify-content:center;padding:14px 26px}
.landingnav .logo .lg-y{transform:translateY(-50%) translateX(41.8px);transition:none}

/* --- pagina Playlists --- */
.plsub{text-align:center;color:var(--argento);font-size:13px;margin:-26px 0 34px}
.plgrid{grid-template-columns:repeat(5,1fr);gap:14px}
@media (max-width:1000px){.plgrid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:640px){.plgrid{grid-template-columns:repeat(2,1fr);gap:10px}}

/* --- pagina Videos --- */
.vlgrid{grid-template-columns:repeat(2,1fr);gap:18px}
.vlgrid .mcard img{aspect-ratio:16/9}
@media (max-width:640px){.vlgrid{grid-template-columns:1fr}}
.videopage article{max-width:900px;margin:0 auto}
.videopage .morelink{margin:34px auto 10px}

.videopage .plsub{margin:-8px 0 26px}
.vlinks{display:flex;justify-content:center;gap:40px;flex-wrap:wrap;margin-top:30px}
.vlinks .morelink{margin:0}

/* --- pagina About --- */
.aboutpage .biotext{max-width:740px;margin:0 auto;font-size:14.5px;line-height:1.9;color:#cfd3da}
.aboutpage .biotext a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.35)}
.aboutpage .biotext a:hover{border-color:#fff}
.bio-div{border:0;height:1px;background:var(--linea);margin:38px auto;max-width:120px}
.presstrio{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:1000px;margin:48px auto 0}
.presstrio img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;display:block}
@media (max-width:640px){.presstrio{grid-template-columns:1fr;max-width:420px}}
.imdbrow{text-align:center;margin:52px 0 8px}
.imdbrow a{color:var(--argento);text-decoration:none;font-size:11.5px;letter-spacing:.14em;display:inline-block;transition:color .25s}
.imdbrow a:hover{color:#fff}
html.light body .imdbrow a:hover{color:#000}
.imdbrow img{display:block;margin:0 auto 12px;max-width:220px;height:auto}
.aboutpage .follow{margin:44px 0 10px}
html.light body .aboutpage .biotext{color:#3a3f47}
html.light body .aboutpage .biotext a{color:#000;border-color:rgba(0,0,0,.3)}

/* --- pagina Contact --- */
.contactpage .plsub{max-width:560px;margin-left:auto;margin-right:auto}
.contactcols{display:grid;grid-template-columns:3fr 2fr;gap:56px;max-width:900px;margin:40px auto 20px;align-items:start}
@media (max-width:760px){.contactcols{grid-template-columns:1fr;gap:44px}}
.cform p{margin:0 0 22px;font-size:10.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--argento)}
.cform input[type=text],.cform input[type=email],.cform textarea{display:block;width:100%;margin-top:8px;background:none;border:0;border-bottom:1px solid rgba(255,255,255,.28);color:var(--avorio);font-family:inherit;font-weight:300;font-size:14px;letter-spacing:.04em;padding:9px 2px;outline:none;transition:border-color .3s;border-radius:0;box-sizing:border-box}
.cform textarea{min-height:110px;resize:vertical}
.cform input:focus,.cform textarea:focus{border-color:#fff}
.cform input[type=submit]{background:none;border:1px solid rgba(255,255,255,.45);color:var(--avorio);font-family:inherit;font-size:11px;letter-spacing:.3em;text-transform:uppercase;padding:12px 38px;cursor:pointer;transition:border-color .3s,color .3s;border-radius:0}
.cform input[type=submit]:hover{border-color:#fff;color:#fff}
.cform .wpcf7-not-valid-tip{font-size:10px;letter-spacing:.06em;color:#e28a8a;text-transform:none;margin-top:5px;display:block}
.cform .wpcf7-response-output{border:1px solid var(--linea);font-size:12px;letter-spacing:.04em;text-transform:none;padding:12px 16px;margin:18px 0 0}
.cinfo .cl{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--argento);margin:0 0 6px}
.cinfo .cm{margin:0 0 30px}
.cinfo .cm a{color:var(--avorio);text-decoration:none;font-size:14.5px;letter-spacing:.03em;border-bottom:1px solid rgba(255,255,255,.25);transition:border-color .25s}
.cinfo .cm a:hover{border-color:#fff}
.cinfo .badges{display:flex;align-items:center;gap:14px;margin-top:8px}
.cinfo .adm,.cinfo .hires{display:block;height:auto}
html.light body .cform input[type=text],html.light body .cform input[type=email],html.light body .cform textarea{border-bottom-color:rgba(0,0,0,.3)}
html.light body .cform input[type=submit]{border-color:rgba(0,0,0,.4)}
html.light body .cform input[type=submit]:hover{border-color:#000;color:#000}
html.light body .cinfo .cm a{border-color:rgba(0,0,0,.3)}

/* --- titoli nei contenuti legacy (senza le taglie di Croma) --- */
.landingpage article h6,.pagewrap article h6{font-size:12px;letter-spacing:.08em}
.landingpage article h5,.pagewrap article h5{font-size:15px}
.landingpage article h4,.pagewrap article h4{font-size:18px}

/* --- pagine video: sempre in tema scuro (sfondo del singolo) --- */
html.light body.single-video{--nero:#000;--avorio:#fff;--argento:#a7adb6;--linea:rgba(255,255,255,.1);background:#000!important}
html.light body.single-video:before{filter:brightness(.42);opacity:1}
html.light body.single-video .sep{background:rgba(255,255,255,.35)}
html.light body.single-video .morelink{color:#d6d9de}
html.light body.single-video .morelink:hover{color:#fff}
body.single-video .thm{display:none}

/* --- landing (singoli e playlist): la pagina resta scura, ma la barra segue il tema --- */
html.light body.landing{--nero:#000;--avorio:#fff;--argento:#a7adb6;--linea:rgba(255,255,255,.1);background:#000!important}
html.light body.landing .navbar{background:rgba(251,252,254,.88);border-bottom:1px solid rgba(0,0,0,.08)}
html.light body.landing .logo img{filter:invert(1)}

/* --- pagine video: barra e pie' di pagina seguono il tema, il resto resta scuro --- */
html.light body.single-video .navbar,html.light body.single-video footer{--avorio:#16191e;--argento:#69707c;--linea:rgba(0,0,0,.08)}
html.light body.single-video footer{color:var(--avorio)}
html.light body.single-video .navbar{color:var(--avorio)}

/* --- card smart-link: la striscia nera resta bianca in ogni tema --- */
.elyaz-blackbox,.elyaz-blackbox *{color:#fff!important}
/* --- pagine documento (licensing/privacy/cookies/terms): tipografia Cinema Nero, niente scatole vc --- */
.wpb_animate_when_almost_visible{opacity:1!important}
body.eh-doc .pagewrap article{max-width:800px;padding:80px 24px 70px}
/* titolo di pagina sopra al documento (licensing): stesso attacco delle altre pagine */
.eh-dochead{padding:24px 24px 0}
body.eh-doc .pagewrap .eh-dochead + article{padding-top:14px}
body.eh-doc article *{background-color:transparent!important;background-image:none!important;box-shadow:none!important;text-shadow:none!important}
body.eh-doc article,body.eh-doc article p,body.eh-doc article li,body.eh-doc article td,body.eh-doc article span{color:var(--argento)!important;font-size:14px;line-height:1.85}
body.eh-doc article h1,body.eh-doc article h2,body.eh-doc article h3,body.eh-doc article h4,body.eh-doc article strong,body.eh-doc article b{color:var(--avorio)!important}
body.eh-doc article h1{font-size:24px;line-height:1.3;letter-spacing:.02em;margin:26px 0 14px}
body.eh-doc article h2{font-size:18px;margin:40px 0 12px}
body.eh-doc article h3,body.eh-doc article h4{font-size:15px;margin:30px 0 10px}
body.eh-doc article a{color:var(--avorio)!important;text-decoration:underline;text-underline-offset:3px}
body.eh-doc article ul,body.eh-doc article ol{padding-left:22px;margin:14px 0}
body.eh-doc article li{margin:8px 0}
body.eh-doc article table{border-collapse:collapse;width:100%;margin:18px 0;display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
body.eh-doc article table > tbody,body.eh-doc article table > thead{display:table;width:100%;min-width:460px}
body.eh-doc article th,body.eh-doc article td{border:1px solid var(--linea);padding:8px 10px;text-align:left;font-size:13px}
body.eh-doc .vc_empty_space,body.eh-doc .vc_empty_space_inner{height:26px!important}
body.eh-doc a.vc_general.vc_btn3{background:transparent!important;border:1px solid var(--avorio)!important;color:var(--avorio)!important;border-radius:0!important;font-size:12px!important;letter-spacing:.18em;text-transform:uppercase;padding:13px 28px!important}
body.eh-doc a.vc_general.vc_btn3:hover{background:var(--avorio)!important;color:var(--nero)!important}
body.eh-doc a.vc_general.vc_btn3 *{color:inherit!important}
body.eh-doc a.vc_general.vc_btn3 .vc_btn3-icon{display:none}
body.eh-doc .eh-btnwrap{text-align:center;margin:34px 0}
body.eh-doc a.eh-btn{display:inline-block;background:transparent;border:1px solid var(--avorio);color:var(--avorio)!important;font-size:12px;letter-spacing:.18em;text-transform:uppercase;padding:13px 28px;text-decoration:none;transition:background .3s,color .3s}
body.eh-doc a.eh-btn:hover,body.eh-doc a.eh-btn:focus-visible,body.eh-doc a.eh-btn:active{background-color:var(--avorio)!important;color:var(--nero)!important;outline:none}
body.eh-doc .eh-terms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 36px;margin:22px 0 46px}
body.eh-doc .eh-terms > div{border-top:1px solid var(--linea);padding-top:16px}
body.eh-doc .eh-terms p.t{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--avorio)!important;margin:0 0 9px}
body.eh-doc .eh-terms p{margin:0;font-size:13.5px;line-height:1.75}
body.eh-doc .eh-note{text-align:center;font-size:13px;margin:42px 0 0}
@media(max-width:700px){body.eh-doc .eh-terms{grid-template-columns:1fr;gap:24px}}
body.eh-doc article hr{border:none;border-top:1px solid var(--linea);margin:30px 0}
body.eh-doc article .vc_row{margin-top:0!important}
body.eh-doc article h5,body.eh-doc article h6{color:var(--argento)!important;font-size:14px;line-height:1.85;font-weight:400;margin:14px 0}
body.eh-doc .eh-lead,body.eh-doc article p.eh-lead{font-size:17px!important;color:var(--avorio)!important;margin:6px 0 0;letter-spacing:.03em}
.landingpage #prefpage .imagecontainer img,.landingpage #prefpage .imagecontainer:hover img{transition:none!important;transform:none!important}

/* --- scheda link (singoli e playlist): stile consolidato nel tema,
       prima viveva nel CSS per-pagina di WPBakery --- */
.landingpage #dynamic-bg{position:fixed;top:-10%;left:-10%;width:120vw;height:120vh;background-size:cover;background-position:center;filter:blur(50px) saturate(200%) brightness(.6);transform:scale(1.1);z-index:1;pointer-events:none}
.landingpage #prefpage{position:relative;z-index:10;max-width:320px;margin:40px auto;background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.3);border-radius:4px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif}
.landingpage #prefpage .imagecontainer img{width:100%;height:auto;display:block;margin:0;border-radius:4px 4px 0 0;pointer-events:none;user-select:none;-webkit-user-drag:none}
.landingpage .elyaz-blackbox{position:relative;background:#181818;width:100%;text-align:center;padding:20px 8px;box-sizing:border-box;display:block}
.landingpage .elyaz-blackbox h1{font-size:20px;font-weight:700;margin:0 0 12px;padding:0;line-height:1.3;text-transform:none;color:#fff}
.landingpage .elyaz-blackbox h6{font-size:14px;font-weight:400;color:#e8e8e8;margin:0;padding:0;text-transform:none;letter-spacing:normal}
.landingpage .elyaz-blackbox-arrow{width:0;height:0;border-left:12px solid transparent;border-right:12px solid transparent;border-top:12px solid #181818;position:absolute;bottom:-12px;left:50%;transform:translateX(-50%);z-index:10}
.landingpage #prefpage .service-container{padding-top:0;background:#fff;border-radius:0 0 4px 4px}
.landingpage #prefpage .service{border-bottom:1px solid #f5f5f5;transition:background-color .3s ease}
.landingpage #prefpage .service:last-child{border-bottom:none}
.landingpage #prefpage .service a{display:flex;align-items:center;justify-content:space-between;padding:12px 15px;text-decoration:none;-webkit-tap-highlight-color:transparent}
.landingpage #prefpage .service img{width:100%;max-width:125px;max-height:40px;object-fit:contain;object-position:left center;display:block;margin:0;pointer-events:none;user-select:none;-webkit-user-drag:none}
.landingpage #prefpage .service .play{font-size:15px;font-weight:500;color:#555;border:1px solid #999;padding:8px 14px;border-radius:5px;background:transparent;transition:all .3s ease;min-width:30px;text-align:center}
@media (hover:hover){.landingpage #prefpage .service:hover{background:#f5f5f5}.landingpage #prefpage .service a:hover .play{background:#222;border-color:#222;color:#fff}}
.landingpage #prefpage .service:active{background:#ececec}
.landingpage #prefpage .service a:active .play{background:#222;border-color:#222;color:#fff}
.landingpage .elyaz-smart-logo{margin-bottom:23px}
.landingpage .elyaz-smart-logo img{width:170px;height:auto;display:inline-block;animation:elyazAnim 6s ease-in-out infinite;pointer-events:none;user-select:none;-webkit-user-drag:none}
@keyframes elyazAnim{0%{opacity:.3;transform:scale(.98)}50%{opacity:.8;transform:scale(1.02)}100%{opacity:.3;transform:scale(.98)}}
.landingpage .elyaz-legal-links{text-align:center;margin:30px auto 40px;position:relative;z-index:10;font-size:12px;color:rgba(255,255,255,.4)}
.landingpage .elyaz-legal-links a{color:rgba(255,255,255,.6);text-decoration:none;padding:0 6px;transition:color .5s ease;cursor:pointer}
.landingpage .elyaz-legal-links a:hover{color:#fff}
.landingpage .elyaz-music-link{display:block;margin:2px auto 16px;color:rgba(255,255,255,.9);font-size:13px;letter-spacing:1px}
.landingpage img.wp-featured-image{display:none}

/* --- pagine video: stile consolidato nel tema (prima nel CSS per-pagina) --- */
.videopage #dynamic-bg-video{position:fixed;top:-10%;left:-10%;width:120vw;height:120vh;background-size:cover;background-position:center;filter:blur(50px) saturate(200%) brightness(.5);transform:scale(1.1);z-index:-1;pointer-events:none}
.videopage .elyaz-video-player{position:relative;width:100%;aspect-ratio:16/9;background:#000;cursor:pointer;border-radius:12px;overflow:hidden}
.videopage .elyaz-video-player img{width:100%;height:100%;object-fit:cover;display:block}
.videopage .elyaz-video-player .vpplay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:84px;height:84px;border:2px solid rgba(255,255,255,.65);border-radius:50%;background:rgba(0,0,0,.28);display:flex;align-items:center;justify-content:center;padding-left:7px;box-sizing:border-box;font-size:30px;color:#fff;line-height:1;pointer-events:none;transition:transform .35s cubic-bezier(.2,.7,.3,1),background .3s}
.videopage .elyaz-video-player:hover .vpplay{transform:translate(-50%,-50%) scale(1.12);background:rgba(0,0,0,.45)}
.videopage .elyaz-video-player:focus-visible{outline:2px solid #fff;outline-offset:3px}
.videopage .elyaz-video-info{position:relative;z-index:10;max-width:800px;margin:40px auto;padding:0 20px;box-sizing:border-box;color:#fff;line-height:1.6}
.videopage .elyaz-video-info h4{margin:50px 0 25px;font-size:18px}
.videopage .elyaz-synopsis{font-size:17px;font-style:italic;font-weight:400;color:#fff;text-shadow:0 2px 15px rgba(0,0,0,.8);border-left:3px solid #fff;padding-left:20px;margin-bottom:50px;text-align:justify;line-height:1.8}
.videopage .elyaz-lyrics p{margin-bottom:24px;font-size:16px;font-weight:400;color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.8);letter-spacing:1px;line-height:1.8}
.videopage .elyaz-copyright{text-align:center;font-size:14px;font-weight:500;color:#fff;text-shadow:0 1px 5px rgba(0,0,0,.5);margin:60px 0 50px;letter-spacing:3px}

/* --- galleria /photos: righe giustificate + visore a schermo intero --- */
.eh-photos{max-width:1240px;margin:0 auto;padding:0 20px 30px}
.eh-photos .eh-row{display:flex;gap:14px;margin-bottom:14px}
.eh-photos .eh-ph{margin:0;cursor:pointer;min-width:0;flex:calc(var(--ar)*1000) 1 0%}
.eh-photos img{width:100%;height:auto;display:block;border-radius:4px;transition:opacity .2s}
.eh-photos .eh-ph:hover img{opacity:.85}
@media(max-width:520px){.eh-photos .eh-row{gap:10px;margin-bottom:10px}}
.eh-lb{position:fixed;inset:0;background:rgba(0,0,0,.93);z-index:999999;display:none;align-items:center;justify-content:center}
.eh-lb.open{display:flex}
.eh-lb img{max-width:94vw;max-height:90vh;object-fit:contain;border-radius:4px}
.eh-lb button{position:absolute;background:none;border:none;color:#fff;cursor:pointer;font-family:Arial,sans-serif;opacity:.75;transition:opacity .2s;padding:14px;line-height:1}
.eh-lb button:hover{opacity:1}
.eh-lb .eh-lb-x{top:8px;right:10px;font-size:34px}
.eh-lb .eh-lb-p{left:4px;top:50%;transform:translateY(-50%);font-size:44px}
.eh-lb .eh-lb-n{right:4px;top:50%;transform:translateY(-50%);font-size:44px}
@media(max-width:520px){.eh-lb .eh-lb-p,.eh-lb .eh-lb-n{font-size:34px}}
article .elyaz-blackbox h1{margin:0 0 12px!important}
article .elyaz-blackbox h6{margin:0;font-size:14px;line-height:1;letter-spacing:0;font-weight:400}