/* Rifinitura grafica (si disattiva da Nexta Studio → Generale → «Effetti grafici»).
   Aggiunge profondità e movimento leggero senza cambiare struttura e colori del sito originale. */

/* Hero della home: alone giallo e griglia di punti sullo sfondo, card del grafico in rilievo */
.hero{position:relative;overflow:hidden;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(620px 380px at 82% 35%,rgba(245,184,0,.22),transparent 70%),
             radial-gradient(420px 300px at 8% 0%,rgba(245,184,0,.08),transparent 70%)}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.55;
  background-image:radial-gradient(rgba(13,13,13,.09) 1px,transparent 1px);background-size:22px 22px;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,transparent 85%);mask-image:linear-gradient(180deg,#000 0%,transparent 85%)}
.hero-visual{background:#fff!important;box-shadow:0 1px 2px rgba(13,13,13,.04),0 12px 32px -8px rgba(13,13,13,.12),0 32px 64px -24px rgba(245,184,0,.25);border-color:rgba(13,13,13,.06)!important}
.hero .h1 em,.hero h1 em{background:linear-gradient(90deg,#F5B800,#E09B00);-webkit-background-clip:text;background-clip:text;color:transparent}

/* Barra di navigazione: ombra leggera dopo lo scroll */
.nav{transition:box-shadow .25s ease,background .25s ease}
.nav.nx-scrolled{box-shadow:0 6px 24px -12px rgba(13,13,13,.18)}

/* Pulsanti */
.btn-p{box-shadow:0 1px 0 rgba(13,13,13,.06),0 6px 16px -6px rgba(245,184,0,.55);transition:background .15s,transform .15s,box-shadow .2s}
.btn-p:hover{box-shadow:0 1px 0 rgba(13,13,13,.06),0 10px 24px -8px rgba(245,184,0,.7)}
.btn-s{transition:border-color .15s,transform .15s,box-shadow .2s}
.btn-s:hover{transform:translateY(-1px);border-color:var(--gray-300,#ccc);box-shadow:0 6px 16px -10px rgba(13,13,13,.25)}

/* Card: rilievo al passaggio del mouse */
.proj-card,.rev-card,.article-card,.proc-step,.faq-item,.cs-card,.svc-link-card{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.proj-card:hover,.rev-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px -18px rgba(13,13,13,.22);border-color:rgba(245,184,0,.45)}
.article-card:hover{box-shadow:0 14px 32px -20px rgba(13,13,13,.25)}
.faq-item:hover{border-color:rgba(245,184,0,.45)}

/* Servizi: barra gialla in alto e icona che si accende */
.svc-card{position:relative}
.svc-card::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--brand);transform:scaleX(0);transform-origin:left;transition:transform .35s ease}
.svc-card:hover::before{transform:scaleX(1)}
.svc-ico{transition:background .25s,color .25s,transform .25s}
.svc-card:hover .svc-ico{background:var(--brand);color:var(--black);transform:rotate(-6deg) scale(1.06)}
.svc-link .ic,.port-all .ic,.proj-link .ic{transition:transform .2s}
.svc-link:hover .ic,.port-all:hover .ic,.proj-link:hover .ic{transform:translateX(3px)}

/* Fasi del processo: numero e icona */
.proc-ico{transition:background .25s,transform .25s}
.proc-step:hover .proc-ico{background:var(--brand);transform:translateY(-2px)}

/* Banner finale: pannello con sfondo caldo e alone */
.cta-sec .cta-banner{position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(135deg,#FFF6D6 0%,#FFFDF5 55%,#fff 100%);border:1px solid rgba(245,184,0,.32);border-radius:20px;padding:52px 56px;box-shadow:0 24px 60px -36px rgba(245,184,0,.6)}
.cta-sec .cta-banner::after{content:"";position:absolute;z-index:-1;width:560px;height:560px;right:-180px;top:-260px;border-radius:50%;background:radial-gradient(circle,rgba(245,184,0,.28),transparent 65%);pointer-events:none}
@media(max-width:700px){.cta-sec .cta-banner{padding:32px 22px;border-radius:16px}}

/* Foto dello studio */
.nx-studio-photos img{transition:transform .5s ease}
.nx-studio-photos figure{overflow:hidden;border-radius:var(--rl,12px)}
.nx-studio-photos figure:hover img{transform:scale(1.04)}

/* Comparsa allo scroll (solo con JavaScript attivo e senza «riduci movimento») */
html.nx-fx .nx-reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1);transition-delay:var(--nx-d,0s)}
html.nx-fx .nx-reveal.nx-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html.nx-fx .nx-reveal{opacity:1;transform:none;transition:none}
  .proj-card:hover,.rev-card:hover,.btn-s:hover{transform:none}
}
