/* Notte Rossa x Mediabrand Elementor Widget CSS */
:root{ --nr-ring:rgba(0,0,0,.08); }

.nr-wrap{ color:var(--nr-ink); }
.nr-wrap h2,.nr-wrap h3{ letter-spacing:.2px; }

/* GRID 50/50 */
.nr-grid{ display:grid; grid-template-columns: 1fr; gap:24px; align-items:stretch; }
@media (min-width:1024px){ .nr-grid{ grid-template-columns: 1fr 1fr; gap: var(--nr-gap); } }

/* LEFT */
.nr-left{ padding-right: clamp(20px, 4vw, 56px); }
.nr-steps{ position:relative; }
.nr-step{ min-height:100vh; display:flex; align-items:center; opacity:.18; transform: translateY(20px); transition: opacity .7s cubic-bezier(0.4,0,0.2,1), transform .7s cubic-bezier(0.4,0,0.2,1); padding: clamp(16px, 5vw, 48px) 8px; position:relative; }
.nr-step.is-active{ opacity:1; transform: translateY(0); }

.nr-inner{ max-width: 65ch; position: relative; }

.nr-header{ position: relative; }
.nr-number{ position: absolute; left: -42px; top: -8px; font-weight:700; font-size: clamp(20px, 2.8vw, 30px); color:var(--nr-accent); opacity:.2; line-height:1; }
@media(max-width:1023.98px){ .nr-number{ left:-2px; top:-6px; } }

.nr-kicker{ display:inline-block; font-size:.8rem; letter-spacing:.12em; text-transform:uppercase; color:var(--nr-accent); margin-bottom:8px; font-weight:600; }
.nr-title{ font-size:clamp(26px,3.2vw,38px); line-height:1.2; margin:0; text-transform:capitalize; }
.nr-title::first-letter{ text-transform:uppercase; }
.nr-sub{ margin-top:6px; letter-spacing:.12em; font-size:.85rem; color:#111; text-transform:uppercase; }
.nr-desc{ margin-top:14px; line-height:1.7; color:#2b2b2b; }

/* Pulsanti */
.nr-links{ display:grid; grid-template-columns: repeat(4, 1fr); gap:10px; margin-top:18px; }
.nr-link{
  display:flex; align-items:center; justify-content:center; gap:8px; width:100%;
  padding:12px 14px; border-radius:999px; background:#fff; border:1px solid var(--nr-ring);
  box-shadow:0 1px 2px rgba(0,0,0,.04); text-decoration:none; color:#111; transition: all .25s cubic-bezier(0.4,0,0.2,1);
  font-weight:inherit; /* tipografia controllata da Elementor */
}
.nr-link:hover{ box-shadow:0 4px 10px rgba(0,0,0,.06); }
.nr-link .nr-ico{ display:inline-flex; align-items:center; justify-content:center; line-height:0; }
.nr-link .nr-ico svg, .nr-link .nr-ico i{ width:16px; height:16px; }

/* Variante pulsanti pieni (accent) */
.nr-wrap.nr-wrap--btns .nr-link{ background: var(--nr-accent); color:#fff; border-color: transparent; }
.nr-wrap.nr-wrap--btns .nr-link:hover{ filter: brightness(0.95); }

/* RIGHT sticky frame */
.nr-right{ position:sticky; top:0; height:100vh; display:flex; align-items:center; }
.nr-frame{ position:relative; width:100%; height: var(--nr-img-h); overflow:hidden; background:#f1f1f1; border-radius:0; box-shadow:none; }
.nr-visual{ position:relative; width:100%; height:100%; }
.nr-bg{ position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transform:scale(1.03); will-change:opacity,transform; transition:opacity 1s cubic-bezier(0.4,0,0.2,1), transform 1s cubic-bezier(0.4,0,0.2,1); }
.nr-bg.is-active{ opacity:1; transform:scale(1); }

/* Mobile */
@media(max-width:1023.98px){
  .nr-grid{ grid-template-columns: 1fr; }
  .nr-right{ order:-1; margin-bottom:12px; height:auto; position:relative; top:auto; }
  .nr-frame{ height: 54vh; }
  .nr-links{ grid-template-columns: repeat(2, 1fr); }
}
@media(max-width:479.98px){
  .nr-links{ grid-template-columns: 1fr; }
}

/* Scala tipografia su mobile via data-attr */
.nr-wrap[data-nr-mobile="1"]{ font-size: 0.9rem; }