/* Derua Creative — effetti custom sopra ai blocchi nativi WordPress */

::selection{ background:var(--wp--preset--color--magenta); color:var(--wp--preset--color--bg); }

body::before{
  content:"";
  position:fixed; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
  pointer-events:none; z-index:999; mix-blend-mode:overlay;
}

/* Parola in corsivo dentro i titoli = accento gradiente (usa il pulsante Corsivo dell'editor) */
h1 em, h2 em, .wp-block-heading em{
  font-family: var(--wp--preset--font-family--accent);
  font-style: italic;
  text-transform: none;
  letter-spacing: 0;
  background: var(--wp--preset--gradient--magenta-violet);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Applica la classe "glitch-title" a un blocco Titolo dal pannello Avanzate → Classe CSS aggiuntiva */
.glitch-title{ position:relative; }
.glitch-title:hover{
  animation: derua-glitch 0.4s steps(2,end) infinite;
}
@keyframes derua-glitch{
  0%{ text-shadow: -2px 0 var(--wp--preset--color--magenta), 2px 0 #39e0ff; }
  50%{ text-shadow: 2px 0 var(--wp--preset--color--magenta), -2px 0 #39e0ff; }
  100%{ text-shadow: -2px 0 var(--wp--preset--color--magenta), 2px 0 #39e0ff; }
}

/* Eyebrow: piccola label con lineetta, classe "eyebrow" su un blocco Paragrafo */
.eyebrow{
  font-family: var(--wp--preset--font-family--mono);
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--wp--preset--color--magenta);
  display: flex;
  align-items: center;
  gap: 10px;
}
.eyebrow::before{ content:""; width:26px; height:1px; background:var(--wp--preset--color--magenta); }

/* Tag label piccola, classe "svc-tag" su un blocco Paragrafo dentro una card servizio */
.svc-tag{
  font-family: var(--wp--preset--font-family--mono);
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--wp--preset--color--magenta);
}

/* Card servizio: classe "svc-card" su un blocco Gruppo/Colonna */
.svc-card{
  background: var(--wp--preset--color--bg-raised);
  padding: 36px 28px;
  min-height: 190px;
  border: 1px solid rgba(245,243,247,0.09);
  border-radius: 8px;
  transition: background .25s;
}
.svc-card:hover{ background:#1b1820; }

/* Griglia lavori: classe "work-grid" sul blocco Query Loop, "work-item" sul blocco Post Template */
.work-grid .wp-block-post-featured-image{
  border-radius:6px; overflow:hidden; margin:0;
}
.work-item{
  position:relative;
  border-radius:6px;
  overflow:hidden;
  border:1px solid rgba(245,243,247,0.09);
}
.work-item .wp-block-post-featured-image img{
  aspect-ratio:4/5; object-fit:cover; width:100%;
}
.work-item::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 40%, rgba(0,0,0,0.65));
  pointer-events:none;
}
.work-item .wp-block-post-title{
  position:absolute; left:20px; bottom:18px; right:20px; z-index:2;
  font-family: var(--wp--preset--font-family--body);
  font-weight:600; font-size:15px; margin:0;
}

/* Riquadro decorativo hero, classe "hero-frame" su un blocco Gruppo vuoto */
.hero-frame{
  border:1px solid rgba(245,243,247,0.09);
  border-radius:6px;
  min-height:380px;
  background:
    linear-gradient(160deg, rgba(255,46,136,0.18), rgba(123,47,247,0.10) 60%, transparent),
    repeating-linear-gradient(0deg, rgba(245,243,247,0.03) 0 1px, transparent 1px 3px);
}

/* Riquadro decorativo sezione About */
.about-frame{
  border:1px solid rgba(245,243,247,0.09);
  border-radius:6px;
  min-height:420px;
  background:
    linear-gradient(200deg, rgba(123,47,247,0.16), rgba(255,46,136,0.10) 55%, transparent),
    repeating-linear-gradient(90deg, rgba(245,243,247,0.03) 0 1px, transparent 1px 3px);
}

/* Card testimonianza */
.testi-card{
  background: var(--wp--preset--color--bg-raised);
  padding: 32px 26px;
  border-radius: 8px;
  border: 1px solid rgba(245,243,247,0.09);
}
.testi-card p:first-child{ font-style:italic; line-height:1.6; }

/* Riga brand/nomi seguiti */
.brand-row p{
  opacity:0.35;
  text-transform:uppercase;
  letter-spacing:1px;
  transition:opacity .2s;
}
.brand-row p:hover{ opacity:1; color:var(--wp--preset--color--magenta); }

/* Bottone contorno, classe "btn-ghost" su un blocco Pulsante impostato come "solo contorno" */
.btn-ghost.wp-block-button__link{
  font-family: var(--wp--preset--font-family--mono);
  font-size:13px; letter-spacing:1px; text-transform:uppercase;
  border:none; border-bottom:1px solid rgba(245,243,247,0.09);
  border-radius:0; padding:0 0 2px; background:none; color:var(--wp--preset--color--muted);
}

/* Bottone con glow al passaggio mouse, classe "btn-glow" */
.btn-glow.wp-block-button__link{
  transition: box-shadow .3s, transform .2s;
}
.btn-glow.wp-block-button__link:hover{
  box-shadow: 0 0 34px 4px rgba(255,46,136,0.45);
  transform: translateY(-1px);
}

/* Navigazione header in stile label mono */
.wp-block-navigation{
  font-family: var(--wp--preset--font-family--mono);
  font-size:12px; letter-spacing:1.5px; text-transform:uppercase;
}
.wp-block-navigation a{ color: var(--wp--preset--color--muted); }
.wp-block-navigation a:hover{ color: var(--wp--preset--color--text); }