/* I caratteri, sostituiti il 2026-09-10.

   Qui c'erano sei @font-face che pesavano 172,5 KB su ogni pagina e non
   disegnavano una sola lettera italiana: erano i sottoinsiemi devanagari di
   Poppins e cirillico di Inter. Verificato leggendo le tabelle unicode dei
   file: nei quattro Poppins, 94 glifi devanagari su 105 e zero lettere latine.

   La conseguenza era piu' sottile di uno spreco. Dichiarare @font-face con
   nome "Poppins" fa sì che quel nome punti al NOSTRO file, non a un eventuale
   Poppins installato sul computer di chi guarda. Quindi: su una macchina senza
   Poppins il browser ripiegava su Avenir Next; su una macchina con Poppins
   installato ripiegava lo stesso, perche' il nome era gia' occupato dal file
   rotto. Il sito non e' mai stato in Poppins per nessuno.

   Adesso ci sono i sottoinsiemi latini veri presi da Google Fonts e ospitati
   qui: 79,7 KB al posto di 176,6, e le lettere accentate italiane ci sono
   (provato rendendo "perche', pero', citta'" in un browser).

   Inter e' un font variabile: un solo file copre tutti i pesi, per questo la
   sua regola dichiara un intervallo invece di un peso singolo. */
@font-face{font-family:Poppins;src:url(../font/poppins-600.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Poppins;src:url(../font/poppins-700.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Poppins;src:url(../font/poppins-800.woff2) format("woff2");font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:Poppins;src:url(../font/poppins-900.woff2) format("woff2");font-weight:900;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url(../font/inter-var.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}

/* ==========================================================================
   Dreammm Studio - design system
   Direzione attiva: "dreammm-studio". Token, caratteri e componenti.
   ========================================================================== */
/* ---------- caratteri del brand, serviti in locale ---------- */
/* ---------- token ---------- */
:root{
  --navy:#0E1A1F; --navy2:#13242A; --viola:#6967FB; --lime:#C8F904;
  --grigio:#F2F2F2; --bianco:#fff; --muto:#8A9AA5;
  --linea:rgba(255,255,255,.11); --linea-scura:rgba(14,26,31,.13);
  --rosso:#FF4757;

  /* Il prefisso non e' un vezzo: Elementor definisce --display per il suo
     display:flex sui contenitori, e senza prefisso i nostri titoli dentro
     Elementor prendevano il carattere "flex" e cadevano sul serif. */
  --dm-display:Poppins,"Avenir Next",system-ui,sans-serif;
  --corpo:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

  --sp-xs:8px; --sp-sm:16px; --sp-md:26px; --sp-lg:48px;
  --sp-xl:clamp(76px,10vw,140px);
  --gutter:clamp(18px,4.5vw,74px);
  --max:1340px;

  --grana:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)'/%3E%3C/svg%3E");

  --img-roccia:url(../img/roccia.webp);
  --img-cielo:url(../img/cielo.webp);
  --logo-chiaro:url(../img/logo-chiaro.svg);
}
/* ---------- base, solo sulle nostre pagine ---------- */
.dreammm{background:var(--navy);color:#fff;font-family:var(--corpo);font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
.dreammm *, .dreammm *::before, .dreammm *::after{box-sizing:border-box}
.dreammm :where(h1, .dreammm h2, .dreammm h3, .dreammm h4, .dreammm p, .dreammm ul, .dreammm ol, .dreammm figure, .dreammm blockquote){margin:0;padding:0}
.dreammm :where(ul, .dreammm ol){list-style:none}
.dreammm a{color:inherit}
.dreammm img{max-width:100%;height:auto;display:block}
/* grana filmica su tutto */
.dreammm::after{content:"";position:fixed;inset:0;z-index:200;pointer-events:none;opacity:.055;
  mix-blend-mode:overlay;background-image:var(--grana)}
.dreammm .dm-wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter);position:relative;z-index:3}
.dreammm section{position:relative;padding-block:var(--sp-xl)}
/* ---------- tipografia ---------- */
.dreammm .dm-mega{font-family:var(--dm-display);font-weight:900;letter-spacing:-.055em;line-height:.88;
  font-size:clamp(40px,min(9.4vw,12.4vh),148px);text-transform:uppercase;text-wrap:balance}
.dreammm .dm-grande{font-family:var(--dm-display);font-weight:900;letter-spacing:-.038em;line-height:.97;
  font-size:clamp(32px,5.6vw,74px);margin-bottom:var(--sp-md);text-wrap:balance}
.dreammm h3{font-family:var(--dm-display);font-weight:700;font-size:21px;line-height:1.25;margin-bottom:var(--sp-xs)}
.dreammm p{max-width:62ch;margin-bottom:20px}
.dreammm p:last-child{margin-bottom:0}
.dreammm .dm-piombo{font-size:clamp(18px,1.95vw,23px);line-height:1.48;color:rgba(255,255,255,.82);max-width:50ch}
.dreammm .dm-eyebrow{display:flex;align-items:center;gap:14px;font-family:var(--dm-display);font-weight:800;font-size:11.5px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--viola);margin-bottom:30px}
.dreammm .dm-eyebrow::after{content:"";flex:1;height:1px;background:var(--linea)}
/* evidenziatore lime */
.dreammm .dm-marca{position:relative;display:inline;padding:0 .1em;color:var(--navy);font-weight:600;z-index:0}
.dreammm .dm-marca::before{content:"";position:absolute;left:0;right:0;top:.1em;bottom:.04em;background:var(--lime);
  z-index:-1;transform:skewY(-.8deg) scaleX(1);transform-origin:left}
.js-attivo .dreammm .dm-marca::before{transform:skewY(-.8deg) scaleX(0);
  transition:transform .6s cubic-bezier(.2,.7,.3,1) .1s}
.js-attivo .dreammm .dm-marca.on::before{transform:skewY(-.8deg) scaleX(1)}
/* ---------- pulsanti ---------- */
.dreammm .dm-btn{display:inline-flex;align-items:center;gap:11px;font-family:var(--dm-display);font-weight:700;font-size:15px;
  padding:19px 32px;border:0;border-radius:0;cursor:pointer;text-decoration:none;position:relative;
  overflow:hidden;background:var(--lime);color:var(--navy);transition:color .35s}
.dreammm .dm-btn > span{position:relative;z-index:1}
.dreammm .dm-btn::before{content:"";position:absolute;inset:0;background:var(--viola);transform:translateY(101%);
  transition:transform .42s cubic-bezier(.2,.7,.3,1)}
.dreammm .dm-btn:hover{color:#fff}
.dreammm .dm-btn:hover::before{transform:none}
.dreammm .dm-btn:focus-visible{outline:3px solid var(--lime);outline-offset:3px}
.dreammm .dm-btn--vuoto{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.25)}
.dreammm .dm-btn--vuoto:hover{color:var(--navy)}
.dreammm .dm-btn--vuoto::before{background:var(--lime)}
/* ---------- fondali ---------- */
.dreammm .dm-scura{background:var(--navy)}
.dreammm .dm-superficie{background:var(--navy2)}
.dreammm .dm-chiara{background:var(--grigio);color:var(--navy)}
.dreammm .dm-chiara p{color:#3D4A52}
.dreammm .dm-chiara .dm-eyebrow::after{background:var(--linea-scura)}
.dreammm .dm-bianca{background:#fff;color:var(--navy)}
.dreammm .dm-bianca p{color:#3D4A52}
.dreammm .dm-fondale{overflow:hidden}
.dreammm .dm-aura{position:absolute;border-radius:50%;pointer-events:none;z-index:0;filter:blur(58px)}
.dreammm .dm-aura--v{background:radial-gradient(circle,rgba(105,103,251,.42),transparent 68%)}
.dreammm .dm-aura--l{background:radial-gradient(circle,rgba(200,249,4,.16),transparent 68%)}
.dreammm .dm-reticolo{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(var(--linea) 1px,transparent 1px),linear-gradient(90deg,var(--linea) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000,transparent);
  mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000,transparent)}
.dreammm .dm-reticolo--scuro{background-image:linear-gradient(rgba(14,26,31,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(14,26,31,.07) 1px,transparent 1px)}
/* divisore a picchi, dal logo */
.dreammm .dm-picchi{display:block;width:100%;height:clamp(34px,4.6vw,70px);line-height:0;
  margin-top:-1px;margin-bottom:-1px;position:relative;z-index:2}
.dreammm .dm-picchi path{fill:currentColor}
/* ---------- rivelazione ---------- */
.dreammm .dm-riv{opacity:1;transform:none}
/* Da 0,01 e non da 0: un elemento a opacita' zero per Google non e' dipinto, e
   il tempo di LCP aspettava la rivelazione (su /chi-siamo/ 3,8 secondi invece
   di 1,9, su un telefono in rete mobile). A occhio non cambia niente. */
.js-attivo .dreammm .dm-riv{opacity:.01;transform:translateY(34px) scale(.985);
  transition:opacity .85s cubic-bezier(.2,.7,.3,1),transform .85s cubic-bezier(.2,.7,.3,1)}
.js-attivo .dreammm .dm-riv.dentro{opacity:1;transform:none}
.dreammm .dm-d1{transition-delay:.1s}
.dreammm .dm-d2{transition-delay:.2s}
.dreammm .dm-d3{transition-delay:.3s}
@media (prefers-reduced-motion:reduce){
  .dreammm *, .dreammm *::before, .dreammm *::after{animation:none!important;transition:none!important}
  .js-attivo .dreammm .dm-riv{opacity:1;transform:none}
  .js-attivo .dreammm .dm-marca::before{transform:skewY(-.8deg) scaleX(1)}
}
/* ==========================================================================
   HOME
   ========================================================================== */
/* ---------- hero ---------- */
.dreammm .dm-hero{background:linear-gradient(180deg,#0a1216,var(--navy) 62%);overflow:hidden;
  padding-top:clamp(96px,12vh,150px);padding-bottom:clamp(34px,5vh,68px);perspective:1400px}
.dreammm .dm-hero__cresta{position:absolute;inset:0;width:100%;height:100%;z-index:2;opacity:.7}
.dreammm .dm-piano{position:absolute;inset:0;pointer-events:none;background-position:center;background-size:cover;
  will-change:transform;z-index:0}
.dreammm .dm-piano--lontano{background-image:var(--img-cielo);opacity:.2;filter:blur(3px) saturate(.7)}
.dreammm .dm-piano--medio{background-image:var(--img-roccia);opacity:.13;filter:blur(1px) grayscale(.4)}
.dreammm .dm-hero::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,18,22,.55),rgba(14,26,31,.2) 40%,var(--navy) 96%)}
.dreammm .dm-faro{position:absolute;width:620px;height:620px;border-radius:50%;pointer-events:none;z-index:1;
  background:radial-gradient(circle,rgba(105,103,251,.2),transparent 66%);
  transform:translate(-50%,-50%);opacity:0;transition:opacity .5s}
.dreammm .dm-hero:hover .dm-faro{opacity:1}
.dreammm .dm-hero__occhiello{font-family:var(--dm-display);font-weight:800;font-size:11.5px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--muto);margin-bottom:clamp(14px,2.2vh,26px);display:flex;align-items:center;gap:14px}
.dreammm .dm-hero__occhiello::before{content:"";width:38px;height:1px;background:var(--viola)}
.dreammm .dm-riga{overflow:hidden}
.js-attivo .dreammm .dm-riga > span{display:block;transform:translateY(108%);animation:dm-sali 1.1s cubic-bezier(.16,1,.3,1) forwards}
.js-attivo .dreammm .dm-riga:nth-child(1) > span{animation-delay:.15s}
.js-attivo .dreammm .dm-riga:nth-child(2) > span{animation-delay:.26s}
@keyframes dm-sali{to{transform:none}}
.dreammm .dm-hero .dm-riga:nth-child(1) > span{background:var(--img-roccia) center 42%/cover;-webkit-background-clip:text;
  background-clip:text;color:transparent;filter:contrast(1.45) brightness(1.25) saturate(.55)}
.dreammm .dm-hero .dm-riga:nth-child(2) em{color:var(--lime);font-style:normal}
@media(max-width:760px){
  /* Sul telefono il titolo va a capo piu' volte e la roccia, ridimensionata
     su una riga corta, ci mette dentro le macchie scure: la stessa frase
     esce in due tonalita' e la parte texturizzata si legge peggio. Su
     schermo largo la riga e' lunga e prende la parte chiara, quindi li'
     resta com'e'. */
  .dreammm .dm-hero .dm-riga:nth-child(1) > span{background:none;color:#fff;filter:none}
}
.dreammm .dm-hero__sotto{display:grid;grid-template-columns:1.25fr auto;align-items:end;gap:clamp(24px,4vw,56px);
  margin-top:clamp(24px,3.4vh,46px)}
.dreammm .dm-azioni{display:flex;gap:13px;flex-wrap:wrap}
@keyframes dm-appari{from{opacity:.01;transform:translateY(22px)}to{opacity:1;transform:none}}
.js-attivo .dreammm .dm-appari{animation:dm-appari .9s both}
/* firma recensioni */
.dreammm .dm-recensioni{margin-top:clamp(22px,3vh,38px);border-top:1px solid var(--linea);
  padding-top:clamp(16px,2vh,22px);display:flex;align-items:center;gap:16px;flex-wrap:wrap;position:relative;z-index:3}
.dreammm .dm-stelle{display:flex;gap:3px;flex:none}
.dreammm .dm-stelle svg{width:21px;height:21px;fill:var(--lime)}
.js-attivo .dreammm .dm-stelle svg{opacity:0;transform:scale(.4) rotate(-30deg);animation:dm-stella .5s cubic-bezier(.2,1.4,.4,1) forwards}
.js-attivo .dreammm .dm-stelle svg:nth-child(1){animation-delay:.80s}
.js-attivo .dreammm .dm-stelle svg:nth-child(2){animation-delay:.88s}
.js-attivo .dreammm .dm-stelle svg:nth-child(3){animation-delay:.96s}
.js-attivo .dreammm .dm-stelle svg:nth-child(4){animation-delay:1.04s}
.js-attivo .dreammm .dm-stelle svg:nth-child(5){animation-delay:1.12s}
@keyframes dm-stella{to{opacity:1;transform:none}}
.dreammm .dm-recensioni p{margin:0;font-size:15.5px;color:rgba(255,255,255,.74);max-width:none}
.dreammm .dm-recensioni b{font-family:var(--dm-display);font-weight:900;font-size:19px;color:#fff;letter-spacing:-.02em}
.dreammm .dm-link-rec{color:rgba(255,255,255,.74);text-decoration:none;border-bottom:1px solid rgba(200,249,4,.5);
  padding-bottom:1px;transition:color .3s,border-color .3s}
.dreammm .dm-link-rec:hover{color:var(--lime);border-color:var(--lime)}
/* ---------- problema ---------- */
.dreammm .dm-problema__griglia{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,70px);align-items:center}
.dreammm .dm-righe{margin-top:40px;border-top:1px solid var(--linea-scura)}
.dreammm .dm-riga-q{display:grid;grid-template-columns:70px 1fr;gap:22px;padding:28px 0;
  border-bottom:1px solid var(--linea-scura);transition:padding-left .35s;position:relative}
.dreammm .dm-riga-q::before{content:"";position:absolute;left:-24px;right:-24px;top:0;bottom:0;background:#fff;opacity:0;
  transition:opacity .35s;z-index:-1;box-shadow:0 14px 40px rgba(14,26,31,.09)}
.dreammm .dm-riga-q:hover{padding-left:14px}
.dreammm .dm-riga-q:hover::before{opacity:1}
.dreammm .dm-riga-q .dm-num{font-family:var(--dm-display);font-weight:900;font-size:15px;color:var(--viola)}
.dreammm .dm-riga-q p{margin:6px 0 0;font-size:16px}
/* grafico costo / asset */
.dreammm .dm-selettore{display:inline-flex;border:1px solid rgba(14,26,31,.16);background:#fff;margin-bottom:26px;
  position:relative;overflow:hidden}
.dreammm .dm-selettore button{background:none;border:0;cursor:pointer;font-family:var(--dm-display);font-weight:700;
  font-size:14px;padding:13px 26px;color:#7C8B95;position:relative;z-index:1;transition:color .35s}
.dreammm .dm-selettore button.att{color:#fff}
.dreammm .dm-selettore__slitta{position:absolute;top:0;bottom:0;left:0;width:50%;background:var(--navy);
  transition:transform .45s cubic-bezier(.2,.7,.3,1);z-index:0}
.dreammm .dm-selettore.b .dm-selettore__slitta{transform:translateX(100%)}
.dreammm .dm-grafico{position:relative;background:linear-gradient(165deg,#fff,#F4F7F8);border:1px solid rgba(14,26,31,.09);
  box-shadow:0 30px 70px rgba(14,26,31,.1);padding:clamp(20px,2.4vw,32px);overflow:hidden}
.dreammm .dm-grafico svg{display:block;width:100%;height:auto}
.dreammm .dm-grafico text{font-family:var(--corpo);font-size:11px;fill:#9AA7AF}
.dreammm .dm-griglia{stroke:rgba(14,26,31,.07);stroke-width:1}
.dreammm .dm-linea{fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:900;stroke-dashoffset:0;transition:stroke-dashoffset 1.5s cubic-bezier(.3,.85,.3,1),stroke .5s}
.js-attivo .dreammm .dm-linea{stroke-dashoffset:900}
.js-attivo .dreammm .dm-linea.tracciata{stroke-dashoffset:0}
.dreammm .dm-area{opacity:1;transition:opacity .9s .5s}
.js-attivo .dreammm .dm-area{opacity:0}
.js-attivo .dreammm .dm-area.viva{opacity:1}
.dreammm .dm-bolla{position:absolute;background:var(--navy);color:#fff;padding:11px 15px;font-size:13px;line-height:1.35;
  max-width:200px;pointer-events:none;opacity:1;z-index:3}
.js-attivo .dreammm .dm-bolla{opacity:0;transform:translateY(8px);transition:opacity .5s,transform .5s}
.js-attivo .dreammm .dm-bolla.viva{opacity:1;transform:none}
.dreammm .dm-bolla b{display:block;font-family:var(--dm-display);font-weight:800;font-size:19px;margin-bottom:3px}
.dreammm .dm-bolla.neg b{color:var(--rosso)}
.dreammm .dm-bolla.pos b{color:var(--lime)}
.dreammm .dm-bolla::after{content:"";position:absolute;left:20px;bottom:-6px;width:12px;height:12px;background:var(--navy);transform:rotate(45deg)}
.dreammm .dm-legenda{display:flex;gap:22px;flex-wrap:wrap;margin-top:20px;font-size:13.5px;color:#7C8B95}
.dreammm .dm-legenda span{display:flex;align-items:center;gap:8px}
.dreammm .dm-legenda i{width:22px;height:3px;border-radius:2px;display:block}
/* ---------- servizi, bento ---------- */
.dreammm .dm-bento{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(10px,1.2vw,16px);margin-top:var(--sp-lg)}
.dreammm .dm-srv{position:relative;background:linear-gradient(158deg,rgba(255,255,255,.055),rgba(255,255,255,.015));
  border:1px solid var(--linea);padding:clamp(22px,2.4vw,32px);text-decoration:none;display:flex;
  flex-direction:column;justify-content:flex-end;min-height:200px;overflow:hidden;isolation:isolate;
  transition:transform .5s cubic-bezier(.2,.7,.3,1),border-color .4s,box-shadow .5s}
.dreammm .dm-srv::before{content:"";position:absolute;inset:-1px;z-index:-1;opacity:0;transition:opacity .5s;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(105,103,251,.34),transparent 46%)}
.dreammm .dm-srv:hover{transform:translateY(-6px);border-color:rgba(105,103,251,.55);
  box-shadow:0 26px 64px rgba(0,0,0,.42),0 0 42px rgba(105,103,251,.28)}
.dreammm .dm-srv:hover::before{opacity:1}
.dreammm .dm-srv svg{width:30px;height:30px;stroke:var(--viola);fill:none;stroke-width:1.6;stroke-linecap:round;
  stroke-linejoin:round;margin-bottom:auto;transition:stroke .4s,transform .5s}
.dreammm .dm-srv:hover svg{stroke:var(--lime);transform:translateY(-4px) scale(1.08)}
.dreammm .dm-srv h3{font-size:18px;margin:20px 0 6px}
.dreammm .dm-srv p{font-size:14px;color:var(--muto);margin:0;max-width:34ch}
.dreammm .dm-srv__vai{position:absolute;top:clamp(22px,2.4vw,32px);right:clamp(22px,2.4vw,32px);color:var(--lime);
  font-size:17px;opacity:0;transform:translate(-5px,5px);transition:opacity .4s,transform .4s}
.dreammm .dm-srv:hover .dm-srv__vai{opacity:1;transform:none}
.dreammm .dm-srv--x3{grid-column:span 3}
.dreammm .dm-srv--x2{grid-column:span 2}
.dreammm .dm-srv--primo{min-height:264px}
.dreammm .dm-srv--primo h3{font-size:clamp(22px,2.4vw,30px)}
.dreammm .dm-srv--primo p{font-size:15.5px;max-width:40ch}
.dreammm .dm-srv--primo svg{width:40px;height:40px}
/* ---------- metodo ---------- */
.dreammm .dm-picchi3{position:relative;background:var(--navy);overflow:hidden}
.dreammm .dm-picchi3::before{content:"";position:absolute;inset:0;background:var(--img-cielo) center 45%/cover;opacity:.34;
  will-change:transform;transform:translateY(var(--par,0px)) scale(1.14)}
.dreammm .dm-picchi3::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,var(--navy),rgba(14,26,31,.35) 42%,var(--navy))}
.dreammm .dm-tre{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,30px);margin-top:52px;
  align-items:end;perspective:1200px}
.dreammm .dm-picco{background:rgba(14,26,31,.62);backdrop-filter:blur(9px);border:1px solid var(--linea);
  padding:clamp(24px,2.6vw,34px);position:relative;isolation:isolate;
  box-shadow:0 18px 46px rgba(0,0,0,.3);
  transition:transform .45s cubic-bezier(.2,.7,.3,1),border-color .35s,box-shadow .5s}
.dreammm .dm-picco::after{content:"";position:absolute;inset:-1px;z-index:-1;opacity:0;transition:opacity .5s;
  background:radial-gradient(320px circle at 50% 0%,rgba(105,103,251,.4),transparent 60%)}
.dreammm .dm-picco:hover{border-color:var(--viola);box-shadow:0 34px 82px rgba(0,0,0,.52),0 0 46px rgba(105,103,251,.3)}
.dreammm .dm-picco:hover::after{opacity:1}
.dreammm .dm-picco:nth-child(2){margin-bottom:clamp(22px,3.4vw,58px)}
.dreammm .dm-picco:nth-child(3){margin-bottom:clamp(10px,1.8vw,28px)}
.dreammm .dm-picco p{font-size:15.5px;margin:0;color:rgba(255,255,255,.76)}
.dreammm .dm-iniziale{font-family:var(--dm-display);font-weight:900;font-size:clamp(30px,3.4vw,46px);letter-spacing:-.05em;
  line-height:1;margin:0 0 4px;color:#fff}
.dreammm .dm-iniziale b{color:var(--viola);transition:color .35s}
.dreammm .dm-picco:hover .dm-iniziale b{color:var(--lime)}
.dreammm .dm-fase-et{display:block;font-family:var(--dm-display);font-weight:800;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muto);margin-bottom:8px}
.dreammm .dm-diagramma{width:100%;height:78px;margin-bottom:20px;overflow:visible}
.dreammm .dm-diagramma path, .dreammm .dm-diagramma rect, .dreammm .dm-diagramma circle{stroke:var(--viola);fill:none;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round;transition:stroke .4s}
.dreammm .dm-picco:hover .dm-diagramma path, .dreammm .dm-picco:hover .dm-diagramma rect, .dreammm .dm-picco:hover .dm-diagramma circle{stroke:var(--lime)}
.dreammm .dm-traccia{stroke-dasharray:var(--l,300)}
.js-attivo .dreammm .dm-traccia{animation:dm-disegna 5.5s ease-in-out infinite}
.js-attivo .dreammm .dm-traccia--2{animation-delay:.5s}
.js-attivo .dreammm .dm-traccia--3{animation-delay:1s}
@keyframes dm-disegna{0%{stroke-dashoffset:var(--l,300)}38%{stroke-dashoffset:0}76%{stroke-dashoffset:0;opacity:1}
  92%{stroke-dashoffset:0;opacity:0}93%{stroke-dashoffset:var(--l,300);opacity:0}100%{stroke-dashoffset:var(--l,300);opacity:1}}
.dreammm .dm-punto{fill:var(--lime);stroke:none}
.js-attivo .dreammm .dm-punto{animation:dm-pulsa 5.5s ease-in-out infinite}
@keyframes dm-pulsa{0%,30%{opacity:0}42%,70%{opacity:1}90%,100%{opacity:0}}
/* ---------- chi siamo ---------- */
.dreammm .dm-chisiamo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,74px);align-items:center}
.dreammm .dm-cifre{border-top:1px solid var(--linea)}
.dreammm .dm-cifra{display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:clamp(18px,2.4vw,34px);
  padding:clamp(20px,2.4vw,30px) 0;border-bottom:1px solid var(--linea);position:relative;
  transition:padding-left .45s cubic-bezier(.2,.7,.3,1)}
.dreammm .dm-cifra::before{content:"";position:absolute;left:-16px;top:50%;width:0;height:1px;background:var(--lime);
  transform:translateY(-50%);transition:width .45s cubic-bezier(.2,.7,.3,1)}
.dreammm .dm-cifra:hover{padding-left:16px}
.dreammm .dm-cifra:hover::before{width:12px}
.dreammm .dm-cifra b{font-family:var(--dm-display);font-weight:900;font-size:clamp(40px,5.2vw,72px);color:#fff;
  letter-spacing:-.055em;line-height:.9;font-variant-numeric:tabular-nums;transition:color .4s}
.dreammm .dm-cifra:hover b{color:var(--lime)}
.dreammm .dm-cifra span{font-size:15px;color:var(--muto);max-width:26ch;text-align:right;justify-self:end}
/* ---------- loghi ---------- */
.dreammm .dm-loghi{background:#fff;color:var(--navy);padding-block:clamp(62px,8vw,104px)}
.dreammm .dm-loghi h2{color:var(--navy)}
.dreammm .dm-muro{overflow:hidden;padding-block:8px;position:relative}
.dreammm .dm-muro::before, .dreammm .dm-muro::after{content:"";position:absolute;top:0;bottom:0;width:14%;z-index:3;pointer-events:none}
.dreammm .dm-muro::before{left:0;background:linear-gradient(90deg,#fff,transparent)}
.dreammm .dm-muro::after{right:0;background:linear-gradient(-90deg,#fff,transparent)}
.dreammm .dm-fila{display:flex;width:max-content;animation:dm-sfila 62s linear infinite}
.dreammm .dm-fila--indietro{animation-direction:reverse;animation-duration:74s}
@keyframes dm-sfila{to{transform:translateX(-50%)}}
.dreammm .dm-marchio{width:clamp(168px,15vw,232px);height:clamp(76px,7.6vw,108px);flex:none;
  margin-inline:clamp(16px,2.2vw,36px);background-size:contain;background-position:center;
  background-repeat:no-repeat;mix-blend-mode:multiply;filter:grayscale(1) contrast(.9) opacity(.42);
  transition:filter .45s cubic-bezier(.2,.7,.3,1),transform .45s cubic-bezier(.2,.7,.3,1)}
.dreammm .dm-marchio:hover{filter:none;transform:scale(1.1)}
/* ---------- progetti ---------- */
.dreammm .dm-vetrina{overflow:hidden;background:var(--navy2);box-shadow:inset 0 0 160px rgba(0,0,0,.5)}
.dreammm .dm-binario{display:flex;gap:clamp(16px,2.2vw,34px);padding-inline:var(--gutter);overflow-x:auto;
  scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:8px;cursor:grab}
.dreammm .dm-binario::-webkit-scrollbar{display:none}
.dreammm .dm-prog{flex:none;width:min(84vw,700px);scroll-snap-align:center}
.dreammm .dm-prog__tela{position:relative;overflow:hidden;aspect-ratio:16/10;
  background:linear-gradient(158deg,#1d323b,#0b1418);border:1px solid var(--linea)}
.dreammm .dm-prog__sfondo{position:absolute;inset:-6%;background-size:cover;background-position:center;opacity:.3;
  filter:saturate(.55) contrast(1.1);transition:transform .8s cubic-bezier(.2,.7,.3,1),opacity .6s}
.dreammm .dm-prog:hover .dm-prog__sfondo{transform:scale(1.07);opacity:.44}
.dreammm .dm-prog__tela::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,20,24,.35),rgba(11,20,24,.85))}
.dreammm .dm-prog__mk{position:absolute;left:50%;top:52%;width:82%;transform:translate(-50%,-50%);z-index:2;
  filter:drop-shadow(0 30px 56px rgba(0,0,0,.66));transition:transform .8s cubic-bezier(.2,.7,.3,1)}
.dreammm .dm-prog:hover .dm-prog__mk{transform:translate(-50%,-54%) scale(1.04)}
.dreammm .dm-prog__eti{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:24px 26px;display:flex;
  justify-content:space-between;align-items:flex-end;gap:16px}
.dreammm .dm-prog__eti b{font-family:var(--dm-display);font-weight:800;font-size:19px;display:block}
.dreammm .dm-prog__eti span{font-size:13px;color:var(--muto);display:block;margin-top:3px}
.dreammm .dm-prog__tag{font-family:var(--dm-display);font-weight:800;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--navy);background:var(--lime);padding:6px 11px;white-space:nowrap}
.dreammm .dm-trascina{font-size:13px;color:var(--muto);padding-inline:var(--gutter);margin-top:20px;
  display:flex;align-items:center;gap:10px}
.dreammm .dm-trascina::before{content:"";width:34px;height:1px;background:var(--viola)}
/* ---------- garanzie ---------- */
.dreammm .dm-garanzie{display:grid;gap:1px;margin-top:var(--sp-lg);background:var(--linea);border:1px solid var(--linea)}
.dreammm .dm-gar{background:var(--navy);display:grid;grid-template-columns:96px 1fr auto;gap:clamp(18px,2.4vw,34px);
  padding:clamp(26px,3vw,40px) clamp(22px,2.6vw,38px);align-items:center;position:relative;overflow:hidden;
  transition:background .45s}
.dreammm .dm-gar::before{content:"";position:absolute;left:0;top:0;bottom:0;width:0;
  background:linear-gradient(90deg,rgba(105,103,251,.22),transparent);transition:width .6s cubic-bezier(.2,.7,.3,1)}
.dreammm .dm-gar:hover{background:var(--navy2)}
.dreammm .dm-gar:hover::before{width:100%}
.dreammm .dm-gar__n{font-family:var(--dm-display);font-weight:900;font-size:clamp(34px,3.6vw,52px);line-height:1;
  letter-spacing:-.05em;color:var(--linea);transition:color .4s;position:relative;z-index:1}
.dreammm .dm-gar:hover .dm-gar__n{color:var(--lime)}
.dreammm .dm-gar h3, .dreammm .dm-gar p{position:relative;z-index:1}
.dreammm .dm-gar h3{font-size:clamp(18px,2vw,23px);margin-bottom:5px}
.dreammm .dm-gar p{font-size:15px;color:var(--muto);max-width:52ch;margin:0}
.dreammm .dm-gar__segno{width:34px;height:34px;border:1.5px solid var(--linea);border-radius:50%;display:grid;
  place-items:center;color:var(--muto);position:relative;z-index:1;flex:none;
  transition:border-color .4s,color .4s,transform .5s}
.dreammm .dm-gar:hover .dm-gar__segno{border-color:var(--lime);color:var(--lime);transform:rotate(-45deg)}
/* ---------- chiusura ---------- */
.dreammm .dm-finale{background:linear-gradient(180deg,var(--navy),#1d1b4d 55%,var(--viola));text-align:center;overflow:hidden}
.dreammm .dm-finale h2{color:#fff}
.dreammm .dm-finale p{margin-inline:auto;color:rgba(255,255,255,.9)}
.dreammm .dm-finale .dm-btn{background:#fff;color:var(--navy);margin-top:30px}
.dreammm .dm-finale .dm-btn::before{background:var(--lime)}
/* ==========================================================================
   RIDUZIONI PER SCHERMI STRETTI
   ========================================================================== */
@media (max-width:1000px){
  .dreammm .dm-bento{grid-template-columns:repeat(2,1fr)}
  .dreammm .dm-srv--x3, .dreammm .dm-srv--x2{grid-column:span 1}
}
@media (max-width:940px){
  .dreammm .dm-hero__sotto{grid-template-columns:1fr}
  .dreammm .dm-problema__griglia{grid-template-columns:1fr}
  .dreammm .dm-chisiamo{grid-template-columns:1fr}
  .dreammm .dm-tre{grid-template-columns:1fr}
  .dreammm .dm-picco{margin-bottom:0!important}
}
@media (max-width:760px){
  .dreammm .dm-gar{grid-template-columns:60px 1fr}
  .dreammm .dm-gar__segno{display:none}
}
@media (max-width:620px){
  .dreammm .dm-bento{grid-template-columns:1fr}
  .dreammm .dm-cifra{grid-template-columns:1fr;gap:6px}
  .dreammm .dm-cifra span{text-align:left;justify-self:start}
}
/* ==========================================================================
   TESTATA E PIEDE
   ========================================================================== */
.dreammm .dm-salta{position:absolute;left:-9999px;top:0;z-index:300;background:var(--lime);color:var(--navy);
  padding:14px 22px;font-family:var(--dm-display);font-weight:700;text-decoration:none}
.dreammm .dm-salta:focus{left:12px;top:12px}
.dreammm .dm-testata{position:fixed;inset:0 0 auto;z-index:100;backdrop-filter:blur(16px);
  background:rgba(14,26,31,.7);border-bottom:1px solid var(--linea);transition:background .35s,border-color .35s}
.dreammm .dm-testata--staccata{background:rgba(14,26,31,.94);border-bottom-color:rgba(255,255,255,.16)}
.dreammm .dm-testata__barra{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter);
  display:flex;align-items:center;gap:clamp(16px,2.4vw,40px);height:76px}
.dreammm .dm-logo{flex:none;display:block;line-height:0}
.dreammm .dm-logo img{width:196px;height:34px;object-fit:contain}
.dreammm .dm-nav{margin-inline-start:auto}
.dreammm .dm-menu{display:flex;align-items:center;gap:clamp(14px,1.8vw,30px);margin:0;padding:0;list-style:none}
.dreammm .dm-menu > li{position:relative}
.dreammm .dm-menu a{font-family:var(--dm-display);font-weight:600;font-size:14.5px;text-decoration:none;
  color:rgba(255,255,255,.72);padding-block:26px;display:inline-block;transition:color .25s;white-space:nowrap}
.dreammm .dm-menu a:hover,.dreammm .dm-menu .current-menu-item > a,
.dreammm .dm-menu .current-menu-ancestor > a{color:#fff}
.dreammm .dm-menu > li > a::after{content:"";position:absolute;left:0;right:0;bottom:18px;height:2px;
  background:var(--lime);transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.2,.7,.3,1)}
.dreammm .dm-menu > li:hover > a::after,.dreammm .dm-menu > .current-menu-item > a::after,
.dreammm .dm-menu > .current-menu-ancestor > a::after{transform:none}
/* tendina servizi */
.dreammm .dm-menu .sub-menu{position:absolute;top:100%;left:-18px;min-width:264px;margin:0;padding:10px 0;
  list-style:none;background:var(--navy2);border:1px solid var(--linea);
  box-shadow:0 26px 60px rgba(0,0,0,.5);opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .28s,transform .28s,visibility .28s}
.dreammm .dm-menu > li:hover .sub-menu,.dreammm .dm-menu > li:focus-within .sub-menu{opacity:1;visibility:visible;transform:none}
.dreammm .dm-menu .sub-menu a{display:block;padding:11px 22px;font-weight:500;font-size:14.5px;
  border-left:2px solid transparent;transition:color .25s,border-color .25s,background .25s}
.dreammm .dm-menu .sub-menu a:hover{color:var(--lime);border-left-color:var(--lime);background:rgba(255,255,255,.04)}
.dreammm .dm-testata__cta{padding:12px 22px;font-size:14px;flex:none}
/* menu ridotto */
.dreammm .dm-hamburger{display:none;flex:none;width:44px;height:44px;background:none;border:0;cursor:pointer;
  padding:11px 9px;flex-direction:column;justify-content:space-between}
.dreammm .dm-hamburger span{display:block;height:2px;background:#fff;border-radius:2px;
  transition:transform .35s cubic-bezier(.2,.7,.3,1),opacity .25s}
.dreammm .dm-hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(9px) rotate(45deg)}
.dreammm .dm-hamburger[aria-expanded="true"] span:nth-child(2){opacity:0}
.dreammm .dm-hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-9px) rotate(-45deg)}
.dreammm .dm-pannello{position:fixed;inset:76px 0 0;z-index:99;background:var(--navy);
  padding:clamp(24px,5vw,48px) var(--gutter);overflow-y:auto}
.dreammm .dm-pannello__menu{margin:0 0 28px;padding:0;list-style:none}
.dreammm .dm-pannello__menu a{display:block;font-family:var(--dm-display);font-weight:700;font-size:22px;
  text-decoration:none;color:#fff;padding:14px 0;border-bottom:1px solid var(--linea)}
.dreammm .dm-pannello__menu .sub-menu{margin:0 0 0 16px;padding:0;list-style:none}
.dreammm .dm-pannello__menu .sub-menu a{font-size:16px;font-weight:500;color:var(--muto);padding:11px 0}
@media(max-width:1120px){
  .dreammm .dm-nav,.dreammm .dm-testata__cta{display:none}
  .dreammm .dm-hamburger{display:flex;margin-inline-start:auto}
}
/* ---------- piede ---------- */
.dreammm .dm-piede{background:var(--viola);color:#fff;padding-block:clamp(56px,7vw,86px) 32px;position:relative;z-index:4}
.dreammm .dm-piede__griglia{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter);
  display:grid;grid-template-columns:1.6fr 1fr 1fr 1.1fr;gap:clamp(28px,3.4vw,52px)}
.dreammm .dm-piede__logo{width:210px;height:36px;object-fit:contain;margin-bottom:18px}
.dreammm .dm-piede p{color:rgba(255,255,255,.86);font-size:15px;max-width:34ch;margin-bottom:14px}
.dreammm .dm-piede__stelle{display:flex;align-items:center;gap:9px;font-size:14px;color:rgba(255,255,255,.94)}
.dreammm .dm-piede__stelle span{color:var(--lime);letter-spacing:2px}
.dreammm .dm-piede__titolo{font-family:var(--dm-display);font-weight:800;font-size:11.5px;letter-spacing:.18em;
  text-transform:uppercase;color:rgba(255,255,255,.66);margin-bottom:14px}
.dreammm .dm-piede ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.dreammm .dm-piede li{font-size:15px;color:rgba(255,255,255,.92);line-height:1.5}
.dreammm .dm-piede a{text-decoration:none;color:rgba(255,255,255,.92);transition:color .25s}
.dreammm .dm-piede a:hover{color:var(--lime)}
.dreammm .dm-piede__legale{max-width:var(--max);margin:clamp(36px,4vw,54px) auto 0;padding-inline:var(--gutter);
  padding-top:20px;border-top:1px solid rgba(255,255,255,.24);display:flex;justify-content:space-between;
  flex-wrap:wrap;gap:14px;font-size:13.5px;color:rgba(255,255,255,.78)}
.dreammm .dm-piede__legale a{margin-left:18px}
@media(max-width:900px){
  .dreammm .dm-piede__griglia{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
  .dreammm .dm-piede__griglia{grid-template-columns:1fr;gap:26px}
}
/* la testata e' fissa: le pagine non partono sotto di essa */
.dreammm .dm-hero{padding-top:clamp(112px,14vh,168px)}
/* ==========================================================================
   PAGINA SERVIZIO
   ========================================================================== */
.dreammm .dm-hero--interna{min-height:auto;padding-bottom:clamp(46px,7vh,90px)}
.dreammm .dm-hero--interna .dm-mega{font-size:clamp(38px,min(8.6vw,11.4vh),126px)}
.dreammm .dm-argomento{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:start}
.dreammm .dm-testo p{margin-bottom:18px}
.dreammm .dm-testo p:last-child{margin-bottom:0}
.dreammm .dm-nota{font-size:15px;color:#5A6570;border-left:2px solid var(--viola);padding-left:18px;
  max-width:38ch;margin-top:22px}
/* domande frequenti */
.dreammm .dm-faq{margin-top:44px;border-top:1px solid var(--linea-scura)}
.dreammm .dm-voce{border-bottom:1px solid var(--linea-scura)}
.dreammm .dm-voce button{width:100%;text-align:left;background:none;border:0;cursor:pointer;
  font-family:var(--dm-display);font-weight:700;font-size:clamp(17px,2vw,22px);color:inherit;
  padding:28px 56px 28px 0;position:relative;line-height:1.3}
.dreammm .dm-voce button::after{content:"";position:absolute;right:8px;top:50%;width:15px;height:2px;
  background:currentColor;transition:transform .35s}
.dreammm .dm-voce button::before{content:"";position:absolute;right:15px;top:50%;width:2px;height:15px;
  margin-top:-7px;background:currentColor;transition:transform .35s}
.dreammm .dm-voce[aria-expanded="true"] button::before{transform:scaleY(0)}
.dreammm .dm-voce button:focus-visible{outline:3px solid var(--viola);outline-offset:2px}
.dreammm .dm-risposta{overflow:hidden;height:auto}
.js-attivo .dreammm .dm-risposta{height:0;transition:height .4s cubic-bezier(.2,.7,.3,1)}
.dreammm .dm-risposta > div{padding-bottom:30px}
.dreammm .dm-risposta p{font-size:16px;color:#5A6570;max-width:68ch}
.dreammm .dm-risposta strong{color:var(--navy)}
/* altri servizi */
@media(max-width:900px){
  .dreammm .dm-argomento{grid-template-columns:1fr}
}
/* ---------- cosa ottieni ---------- */
.dreammm .dm-benefici{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:1px;margin-top:var(--sp-lg);background:var(--linea);border:1px solid var(--linea)}
.dreammm .dm-benef{background:var(--navy);padding:clamp(26px,2.8vw,38px);position:relative;overflow:hidden;
  transition:background .4s}
.dreammm .dm-benef::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--viola);
  transform:scaleY(0);transform-origin:top;transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.dreammm .dm-benef:hover{background:var(--navy2)}
.dreammm .dm-benef:hover::before{transform:none;background:var(--lime)}
.dreammm .dm-benef h3{font-size:19px;margin-bottom:9px}
.dreammm .dm-benef p{font-size:15px;color:var(--muto);margin:0;max-width:36ch}
/* ---------- come lavoriamo ---------- */
.dreammm .dm-passi{margin-top:var(--sp-lg)}
.dreammm .dm-passo{display:grid;grid-template-columns:52px 132px 1fr;gap:clamp(14px,2vw,26px);
  padding:26px 0;border-top:1px solid var(--linea);align-items:start;transition:background .35s,padding-left .35s}
.dreammm .dm-passo:last-child{border-bottom:1px solid var(--linea)}
.dreammm .dm-passo:hover{background:rgba(105,103,251,.06);padding-left:12px}
.dreammm .dm-passo__n{font-family:var(--dm-display);font-weight:900;font-size:20px;color:var(--viola);line-height:1.4}
.dreammm .dm-passo__chi{font-family:var(--dm-display);font-weight:800;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;padding:6px 10px;align-self:start;text-align:center;white-space:nowrap}
.dreammm .dm-passo__chi--insieme{background:var(--viola);color:#fff}
.dreammm .dm-passo__chi--noi{background:rgba(255,255,255,.1);color:rgba(255,255,255,.8)}
.dreammm .dm-passo__chi--tu{background:var(--navy);color:#fff;box-shadow:inset 0 0 0 1px var(--linea)}
.dreammm .dm-passo__chi--approvi{background:var(--lime);color:var(--navy)}
.dreammm .dm-passo h3{font-size:18px;margin-bottom:5px}
.dreammm .dm-passo p{font-size:15.5px;color:var(--muto);margin:0}
.dreammm .dm-tempi{margin-top:var(--sp-lg);padding:26px 30px;border-left:3px solid var(--lime);
  background:var(--navy);font-size:16.5px;max-width:none}
@media(max-width:760px){
  .dreammm .dm-passo{grid-template-columns:40px 1fr;gap:14px}
  .dreammm .dm-passo__chi{grid-column:2;justify-self:start;margin-bottom:8px}
}
/* ==========================================================================
   CORREZIONI: bento benefici, vetrina 3D, altri servizi
   ========================================================================== */
/* ---------- cosa ottieni: bento senza buchi ---------- */
.dreammm .dm-benefici{grid-template-columns:repeat(6,1fr)}
.dreammm .dm-benef{grid-column:span 2}
.dreammm .dm-benef--largo{grid-column:span 3}
.dreammm .dm-benef--pieno{grid-column:span 6}
.dreammm .dm-benef--largo h3{font-size:clamp(20px,2.2vw,26px)}
.dreammm .dm-benef--largo p{font-size:16px;max-width:44ch}
.dreammm .dm-benef--pieno{display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,3vw,44px);align-items:center}
.dreammm .dm-benef--pieno h3{font-size:clamp(20px,2.4vw,28px);margin:0;white-space:normal}
.dreammm .dm-benef--pieno p{max-width:52ch}
@media(max-width:1000px){
  .dreammm .dm-benefici{grid-template-columns:repeat(2,1fr)}
  .dreammm .dm-benef,.dreammm .dm-benef--largo,.dreammm .dm-benef--pieno{grid-column:span 1}
  .dreammm .dm-benef--pieno{display:block}
}
@media(max-width:620px){
  .dreammm .dm-benefici{grid-template-columns:1fr}
}
/* ---------- approfondimento con vetrina 3D ---------- */
.dreammm .dm-argomento--vetrina{grid-template-columns:1fr 1.05fr;align-items:center;gap:clamp(30px,5vw,76px)}
@media(max-width:1000px){.dreammm .dm-argomento--vetrina{grid-template-columns:1fr}}
.dreammm .dm-pila{position:relative;perspective:1600px;padding:clamp(20px,4vw,50px) 0;min-height:clamp(300px,34vw,440px)}
.dreammm .dm-pila__scena{position:relative;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.dreammm .dm-pila__carta{position:absolute;left:0;right:0;border:1px solid rgba(14,26,31,.1);
  background:linear-gradient(158deg,#1d323b,#0b1418);padding:clamp(12px,1.6vw,22px) clamp(10px,1.4vw,18px) 0;
  box-shadow:0 34px 74px rgba(14,26,31,.3);transform-style:preserve-3d;
  transition:transform .7s cubic-bezier(.2,.7,.3,1),box-shadow .7s}
.dreammm .dm-pila__carta img{display:block;width:100%;height:auto;
  filter:drop-shadow(0 16px 30px rgba(0,0,0,.5))}
.dreammm .dm-pila__carta:nth-child(1){top:0;   z-index:3;transform:translateZ(60px)  translateX(0)    rotate(-1.5deg)}
.dreammm .dm-pila__carta:nth-child(2){top:14%; z-index:2;transform:translateZ(20px)  translateX(7%)   rotate(1.8deg);opacity:.92}
.dreammm .dm-pila__carta:nth-child(3){top:28%; z-index:1;transform:translateZ(-20px) translateX(-5%)  rotate(-3deg); opacity:.8}
.dreammm .dm-pila:hover .dm-pila__carta:nth-child(1){transform:translateZ(90px) translateX(-3%) rotate(-2.5deg)}
.dreammm .dm-pila:hover .dm-pila__carta:nth-child(2){transform:translateZ(40px) translateX(12%) rotate(3deg)}
.dreammm .dm-pila:hover .dm-pila__carta:nth-child(3){transform:translateZ(-10px) translateX(-11%) rotate(-4.5deg)}
.dreammm .dm-pila__eti{position:absolute;left:0;bottom:-6px;z-index:5;font-family:var(--dm-display);font-weight:700;
  font-size:13px;color:#5A6570;display:flex;align-items:center;gap:10px}
.dreammm .dm-pila__eti::before{content:"";width:26px;height:1px;background:var(--viola)}
/* ---------- altri servizi: griglia piena ---------- */
/* ==========================================================================
   SCHEDE CON BAGLIORE E PROFONDITA
   sostituisce la griglia a filetti, che lasciava scoperto il fondo
   quando l'ultima riga non era piena
   ========================================================================== */
/* la barretta laterale non serve piu': il bagliore fa il lavoro */
.dreammm .dm-benef:hover::before,

.dreammm .dm-benef::after{content:"";position:absolute;left:0;top:0;width:0;height:2px;background:var(--lime);
  transition:width .5s cubic-bezier(.2,.7,.3,1)}
.dreammm .dm-benef:hover::after{width:100%}
/* bento su 6 colonne, righe sempre piene */
.dreammm .dm-benef{grid-column:span 2}
.dreammm .dm-benef--largo{grid-column:span 3}
.dreammm .dm-benef--pieno{grid-column:span 6;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:clamp(18px,3vw,44px);align-items:center}
.dreammm .dm-benef--pieno h3{margin:0}
/* altri servizi: schede, non righe attaccate */
/* ---------- vetrina 3D: la scena deve avere un'altezza ---------- */
.dreammm .dm-pila{min-height:0;padding:clamp(16px,3vw,34px) 0 clamp(34px,5vw,60px)}
.dreammm .dm-pila__scena{position:relative;transform-style:preserve-3d;will-change:transform}
.dreammm .dm-pila__carta:nth-child(1){position:relative;top:auto;left:auto;right:auto}
.dreammm .dm-pila__carta:nth-child(2),
.dreammm .dm-pila__carta:nth-child(3){position:absolute;left:0;right:0;top:0}
.dreammm .dm-pila__carta:nth-child(2){transform:translate3d(7%,11%,-40px) rotate(1.8deg);opacity:.9}
.dreammm .dm-pila__carta:nth-child(3){transform:translate3d(-6%,21%,-80px) rotate(-3deg);opacity:.74}
.dreammm .dm-pila:hover .dm-pila__carta:nth-child(1){transform:translate3d(-3%,-4%,40px) rotate(-2.4deg)}
.dreammm .dm-pila:hover .dm-pila__carta:nth-child(2){transform:translate3d(13%,9%,-20px) rotate(3.2deg);opacity:1}
.dreammm .dm-pila:hover .dm-pila__carta:nth-child(3){transform:translate3d(-13%,20%,-60px) rotate(-4.6deg);opacity:.9}
/* ==========================================================================
   RILIEVO 3D
   ========================================================================== */
@media(max-width:1000px){
}
/* profili sovrapposti: fondo scuro proprio, cosi' le creste staccano */
/* ==========================================================================
   ANALISI GRATUITA DEL SITO
   ========================================================================== */
.dreammm .dm-audit__intro{max-width:62ch;margin-top:18px}
.dreammm .dm-audit{margin-top:clamp(30px,4vw,46px);max-width:1000px}
.dreammm .dm-audit__via{display:flex;gap:10px;flex-wrap:wrap}
.dreammm .dm-audit__campo{flex:1 1 320px;display:flex;align-items:center;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.16);
  transition:border-color .3s,background .3s}
.dreammm .dm-audit__campo:focus-within{border-color:var(--lime);background:rgba(255,255,255,.08)}
.dreammm .dm-audit__pre{padding-left:18px;font-family:var(--corpo);font-size:15.5px;color:rgba(255,255,255,.34)}
.dreammm .dm-audit__campo input{flex:1;background:none;border:0;outline:0;color:#fff;
  font-family:var(--corpo);font-size:16.5px;padding:19px 18px 19px 3px;min-width:0}
.dreammm .dm-audit__campo input::placeholder{color:rgba(255,255,255,.3)}
.dreammm .dm-audit__via .dm-btn{flex:0 0 auto}
.dreammm .dm-audit__errore{margin-top:12px;color:#FF7A85;font-size:14.5px}
.dreammm .dm-audit__lavoro{margin-top:26px}
.dreammm .dm-audit__scia{height:2px;background:rgba(255,255,255,.1);overflow:hidden}
.dreammm .dm-audit__scia span{display:block;height:100%;width:36%;background:var(--lime);
  animation:dm-scia 1.15s cubic-bezier(.5,0,.5,1) infinite}
@keyframes dm-scia{0%{transform:translateX(-100%)}100%{transform:translateX(380%)}}
.dreammm .dm-audit__lavoro p{margin-top:14px;font-size:15px;color:var(--muto);font-family:var(--corpo)}
.dreammm .dm-audit__esito{margin-top:30px}
.dreammm .dm-audit__voto{display:flex;align-items:center;gap:clamp(20px,3vw,38px);flex-wrap:wrap;
  padding-bottom:clamp(24px,3vw,34px);border-bottom:1px solid rgba(255,255,255,.12)}
.dreammm .dm-audit__quadrante{position:relative;flex:0 0 auto;width:126px;height:126px}
.dreammm .dm-audit__quadrante svg{width:100%;height:100%;transform:rotate(-90deg)}
.dreammm .dm-audit__pista{fill:none;stroke:rgba(255,255,255,.1);stroke-width:7}
.dreammm .dm-audit__arco{fill:none;stroke:var(--lime);stroke-width:7;stroke-linecap:round;
  stroke-dasharray:327;stroke-dashoffset:327;transition:stroke-dashoffset 1.15s cubic-bezier(.2,.8,.25,1),stroke .5s}
.dreammm .dm-audit__quadrante b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:var(--dm-display);font-weight:900;font-size:36px;letter-spacing:-.05em;color:#fff}
.dreammm .dm-audit__voto h3{font-family:var(--dm-display);font-weight:800;font-size:clamp(23px,2.8vw,31px);
  letter-spacing:-.025em;line-height:1.15;color:#fff}
.dreammm .dm-audit__voto p{margin-top:9px;font-size:16px;color:var(--muto);max-width:52ch;line-height:1.55}
.dreammm .dm-audit__dove{font-size:13px!important;color:rgba(255,255,255,.35)!important;margin-top:12px!important}
.dreammm .dm-audit__lista{margin-top:clamp(24px,3vw,34px);display:grid;gap:22px}
.dreammm .dm-audit__area > h4{font-family:var(--dm-display);font-weight:800;font-size:11.5px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--lime);margin-bottom:10px}
.dreammm .dm-audit__riga{display:grid;grid-template-columns:22px 1fr;gap:14px;align-items:start;
  padding:13px 0;border-top:1px solid rgba(255,255,255,.08);
  opacity:0;transform:translateY(10px);transition:opacity .5s,transform .5s}
.dreammm .dm-audit__riga.viva{opacity:1;transform:none}
.dreammm .dm-audit__bollo{width:20px;height:20px;border-radius:50%;margin-top:2px;display:flex;
  align-items:center;justify-content:center;font-size:12px;font-weight:700;line-height:1}
.dreammm .dm-audit__riga--ok .dm-audit__bollo{background:rgba(200,249,4,.16);color:var(--lime)}
.dreammm .dm-audit__riga--forse .dm-audit__bollo{background:rgba(255,193,7,.16);color:#FFC107}
.dreammm .dm-audit__riga--no .dm-audit__bollo{background:rgba(255,71,87,.16);color:#FF6B78}
.dreammm .dm-audit__riga b{display:block;font-family:var(--dm-display);font-weight:700;font-size:15.5px;color:#fff}
.dreammm .dm-audit__riga span{display:block;font-size:14.5px;color:var(--muto);line-height:1.5;margin-top:3px}
.dreammm .dm-audit__seguito{margin-top:clamp(30px,4vw,44px);display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(22px,3vw,44px);align-items:start;padding:clamp(24px,3vw,34px);
  background:rgba(105,103,251,.1);border:1px solid rgba(105,103,251,.3)}
.dreammm .dm-audit__seguito h4{font-family:var(--dm-display);font-weight:800;font-size:clamp(19px,2.2vw,24px);
  line-height:1.2;letter-spacing:-.02em;color:#fff}
.dreammm .dm-audit__seguito p{margin-top:11px;font-size:15.5px;color:var(--muto);line-height:1.6}
.dreammm .dm-audit__mail{display:grid;gap:9px}
.dreammm .dm-audit__mail input{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);
  color:#fff;font-family:var(--corpo);font-size:15.5px;padding:15px 16px;outline:0;transition:border-color .3s}
.dreammm .dm-audit__mail input:focus{border-color:var(--lime)}
.dreammm .dm-audit__mail input::placeholder{color:rgba(255,255,255,.3)}
.dreammm .dm-audit__mail #dm-audit-esca{position:absolute;left:-9999px;width:1px;height:1px}
.dreammm .dm-audit__mail .dm-btn{justify-content:center;margin-top:3px}
.dreammm .dm-audit__esitomail{font-size:14px;color:var(--lime);min-height:1.3em}
.dreammm .dm-audit__esitomail.male{color:#FF7A85}
.dreammm .dm-audit__ancora{margin-top:22px;background:none;border:0;cursor:pointer;padding:0;
  font-family:var(--corpo);font-size:14.5px;color:var(--muto);text-decoration:underline;
  text-underline-offset:4px;transition:color .3s}
.dreammm .dm-audit__ancora:hover{color:var(--lime)}
@media(max-width:820px){
  .dreammm .dm-audit__seguito{grid-template-columns:1fr}
  .dreammm .dm-audit__via .dm-btn{width:100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){
  .dreammm .dm-audit__scia span{animation:none;width:100%}
  .dreammm .dm-audit__riga{opacity:1;transform:none}
}
/* ==========================================================================
   SCENA — l'oggetto a strati
   Ritagliato, quindi galleggia: niente cornice, niente riquadro. La
   profondita' la danno l'ombra portata e il leggero scarto di scorrimento.
   ========================================================================== */
.dreammm .dm-scena{position:relative;margin:0;padding:clamp(10px,1.6vw,26px) 0;isolation:isolate}
.dreammm .dm-scena__alone{position:absolute;z-index:0;left:14%;top:18%;width:72%;aspect-ratio:1;
  background:radial-gradient(circle,rgba(105,103,251,.24),transparent 68%);
  filter:blur(64px);pointer-events:none}
.dreammm .dm-scena__oggetto{position:relative;z-index:1;display:block;width:100%;height:auto;
  filter:drop-shadow(0 34px 42px rgba(14,26,31,.2));will-change:transform}
.dreammm .dm-scena figcaption{position:relative;z-index:2;margin-top:clamp(16px,2vw,26px);
  font-size:15px;line-height:1.55;color:#5A6570;max-width:42ch}
.dreammm .dm-scena__eti{display:block;font-family:var(--dm-display);font-weight:800;font-size:11px;
  letter-spacing:.17em;text-transform:uppercase;color:var(--viola);margin-bottom:6px}
.dreammm .dm-scura .dm-scena figcaption,.dreammm .dm-superficie .dm-scena figcaption{color:var(--muto)}
.dreammm .dm-scura .dm-scena__oggetto,.dreammm .dm-superficie .dm-scena__oggetto{
  filter:drop-shadow(0 34px 46px rgba(0,0,0,.42))}
@media (prefers-reduced-motion:reduce){
  .dreammm .dm-scena__oggetto{transform:none!important}
}
/* ==========================================================================
   I PASSI SU FONDO CHIARO
   Il componente era nato per le sezioni scure: qui ne serve la versione
   diurna, altrimenti linee e testi secondari spariscono sul grigio.
   ========================================================================== */
.dreammm .dm-chiara .dm-passo{border-top-color:var(--linea-scura)}
.dreammm .dm-chiara .dm-passo:last-child{border-bottom-color:var(--linea-scura)}
.dreammm .dm-chiara .dm-passo:hover{background:rgba(105,103,251,.07)}
.dreammm .dm-chiara .dm-passo p{color:#5A6570}
.dreammm .dm-chiara .dm-passo h3{color:var(--navy)}
.dreammm .dm-chiara .dm-passo__chi--noi{background:rgba(14,26,31,.08);color:#3D4A52}
.dreammm .dm-chiara .dm-passo__chi--tu{background:var(--navy);color:#fff;box-shadow:none}
.dreammm .dm-chiara .dm-tempi{background:rgba(14,26,31,.04);color:#3D4A52}
/* ==========================================================================
   ALTRI SERVIZI — indice editoriale
   Righe intere invece di riquadri: il nome grande, cosa fa accanto, e una
   lama di colore che entra da sinistra al passaggio del mouse.
   ========================================================================== */
.dreammm .dm-altri__elenco{margin-top:clamp(34px,4.4vw,56px);
  border-top:1px solid var(--linea)}
.dreammm .dm-altro{position:relative;display:grid;grid-template-columns:minmax(180px,.34fr) 1fr auto;
  align-items:center;gap:clamp(16px,2.6vw,44px);
  padding:clamp(20px,2.5vw,30px) clamp(14px,1.8vw,26px);
  border-bottom:1px solid var(--linea);text-decoration:none;color:#fff;
  isolation:isolate;overflow:hidden;
  transition:padding-left .5s cubic-bezier(.2,.7,.3,1),color .4s}
/* la lama di colore, dietro al testo */
.dreammm .dm-altro::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(96deg,var(--viola),rgba(105,103,251,0) 74%);
  transform:translateX(-101%);
  transition:transform .58s cubic-bezier(.2,.75,.25,1)}
.dreammm .dm-altro:hover::before,.dreammm .dm-altro:focus-visible::before{transform:none}
.dreammm .dm-altro__nome{font-family:var(--dm-display);font-weight:800;
  font-size:clamp(20px,2.3vw,29px);letter-spacing:-.028em;line-height:1.1;
  transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.dreammm .dm-altro__riga{font-size:15.5px;line-height:1.5;color:var(--muto);
  max-width:46ch;transition:color .4s}
.dreammm .dm-altro__fr{display:flex;color:rgba(255,255,255,.35);
  transition:transform .5s cubic-bezier(.2,.7,.3,1),color .4s}
.dreammm .dm-altro:hover{padding-left:clamp(24px,3vw,44px)}
.dreammm .dm-altro:hover .dm-altro__riga{color:rgba(255,255,255,.86)}
.dreammm .dm-altro:hover .dm-altro__fr{transform:translateX(9px);color:var(--lime)}
.dreammm .dm-altro:focus-visible{outline:2px solid var(--lime);outline-offset:-3px}
@media(max-width:820px){
  .dreammm .dm-altro{grid-template-columns:1fr auto;gap:6px 18px;align-items:start}
  /* Ogni pezzo dichiara dove sta nella griglia. Senza, la freccia -- che ha
     una riga esplicita ma nessuna colonna -- viene collocata prima degli
     elementi liberi e si prende la colonna 1: il nome finiva a destra e la
     descrizione sotto la freccia. Stesso difetto dei passi. */
  .dreammm .dm-altro__nome{grid-column:1;grid-row:1}
  .dreammm .dm-altro__riga{grid-column:1;grid-row:2;font-size:14.5px}
  .dreammm .dm-altro__fr{grid-column:2;grid-row:1/3;align-self:center}
}
@media (prefers-reduced-motion:reduce){
  .dreammm .dm-altro,.dreammm .dm-altro::before,
  .dreammm .dm-altro__fr{transition:none}
}
/* ==========================================================================
   TESTATE RIDOTTE E TITOLI DI SERVIZIO
   ========================================================================== */
.dreammm .dm-hero--corta{min-height:auto;padding-top:calc(76px + clamp(30px,5vh,64px));
  padding-bottom:clamp(38px,6vh,76px)}
.dreammm .dm-hero--corta .dm-hero__sotto{margin-top:clamp(20px,3vh,34px)}
.dreammm .dm-titolone{font-family:var(--dm-display);font-weight:900;letter-spacing:-.04em;line-height:1.02;
  font-size:clamp(31px,5.4vw,68px);max-width:20ch;text-wrap:balance;margin-top:6px}
.dreammm .dm-hero__occhiello a{color:inherit;text-decoration:none;border-bottom:1px solid currentColor}
.dreammm .dm-wrap--stretto{max-width:760px}
/* ==========================================================================
   LAVORI
   ========================================================================== */
.dreammm .dm-lavori{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,26px);
  margin-top:clamp(30px,4vw,48px)}
.dreammm .dm-lavori--tutti{margin-top:0}
.dreammm .dm-lav{display:block;text-decoration:none;color:inherit;position:relative}
.dreammm .dm-lav__foto{display:block;overflow:hidden;background:var(--navy2);aspect-ratio:16/10;position:relative}
.dreammm .dm-lav__foto img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .7s cubic-bezier(.2,.7,.3,1),filter .5s}
.dreammm .dm-lav:hover .dm-lav__foto img{transform:scale(1.045)}
.dreammm .dm-lav__foto::after{content:"";position:absolute;inset:0;background:var(--viola);
  opacity:0;mix-blend-mode:color;transition:opacity .5s}
.dreammm .dm-lav:hover .dm-lav__foto::after{opacity:.22}
.dreammm .dm-lav__sotto{display:block;padding-top:14px}
.dreammm .dm-lav__nome{display:block;font-family:var(--dm-display);font-weight:800;font-size:17.5px;
  letter-spacing:-.02em;transition:color .35s}
.dreammm .dm-lav:hover .dm-lav__nome{color:var(--lime)}
.dreammm .dm-bianca .dm-lav:hover .dm-lav__nome{color:var(--viola)}
.dreammm .dm-lav__riga{display:block;font-size:14.5px;line-height:1.5;color:var(--muto);margin-top:4px;max-width:38ch}
.dreammm .dm-bianca .dm-lav__riga{color:#5A6570}
.dreammm .dm-lav__copertina{margin:0;display:block;background:var(--navy2)}
.dreammm .dm-lav__copertina img{display:block;width:100%;height:auto;max-height:62vh;object-fit:cover}
@media(max-width:900px){.dreammm .dm-lavori{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.dreammm .dm-lavori{grid-template-columns:1fr}}
.dreammm .dm-tag{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:clamp(20px,2.4vw,30px);padding:0}
.dreammm .dm-tag li{font-family:var(--dm-display);font-weight:700;font-size:12.5px;letter-spacing:.02em;
  padding:8px 14px;background:rgba(105,103,251,.12);color:var(--viola);border:1px solid rgba(105,103,251,.28)}
.dreammm .dm-galleria{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(12px,1.6vw,22px)}
.dreammm .dm-galleria figure{margin:0}
.dreammm .dm-galleria img{display:block;width:100%;height:auto}
@media(max-width:700px){.dreammm .dm-galleria{grid-template-columns:1fr}}
/* ==========================================================================
   CITAZIONE
   ========================================================================== */
.dreammm .dm-citazione{margin:0;max-width:24ch;position:relative;padding-left:clamp(20px,3vw,42px);
  border-left:3px solid var(--lime)}
.dreammm .dm-citazione p{font-family:var(--dm-display);font-weight:700;letter-spacing:-.028em;line-height:1.18;
  font-size:clamp(23px,3.4vw,44px);max-width:20ch;color:var(--navy)}
.dreammm .dm-citazione cite{display:block;margin-top:18px;font-style:normal;font-size:14.5px;
  color:#5A6570;letter-spacing:.02em}
.dreammm .dm-citazione--scura p{color:#fff}
.dreammm .dm-citazione--scura cite{color:var(--muto)}
/* ==========================================================================
   BLOCCHI NUMERATI SU FONDO CHIARO
   ========================================================================== */
.dreammm .dm-righe--chiare .dm-riga-q{border-top-color:var(--linea-scura)}
.dreammm .dm-righe--chiare .dm-riga-q:last-child{border-bottom-color:var(--linea-scura)}
.dreammm .dm-righe--chiare .dm-riga-q p{color:#5A6570}
.dreammm .dm-righe--chiare .dm-riga-q h3{color:var(--navy)}
/* ==========================================================================
   ARTICOLI
   ========================================================================== */
.dreammm .dm-filtri{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:clamp(26px,3.4vw,42px)}
.dreammm .dm-filtro{font-family:var(--dm-display);font-weight:700;font-size:13.5px;text-decoration:none;
  padding:10px 18px;color:#3D4A52;border:1px solid var(--linea-scura);transition:background .3s,color .3s,border-color .3s}
.dreammm .dm-filtro:hover{border-color:var(--viola);color:var(--viola)}
.dreammm .dm-filtro.att{background:var(--navy);border-color:var(--navy);color:#fff}
.dreammm .dm-articoli{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.6vw,38px)}
.dreammm .dm-art a{display:block;text-decoration:none;color:inherit}
.dreammm .dm-art__foto{display:block;overflow:hidden;background:var(--grigio);aspect-ratio:16/10}
.dreammm .dm-art__foto img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .7s cubic-bezier(.2,.7,.3,1)}
.dreammm .dm-art:hover .dm-art__foto img{transform:scale(1.045)}
.dreammm .dm-art__testo{display:block;padding-top:15px}
.dreammm .dm-art__meta{display:flex;align-items:center;gap:10px;font-size:12px;color:#8A9AA5;
  letter-spacing:.04em;text-transform:uppercase;font-family:var(--dm-display);font-weight:700}
.dreammm .dm-art__cat{color:var(--viola)}
.dreammm .dm-art__titolo{display:block;font-family:var(--dm-display);font-weight:800;font-size:19px;
  line-height:1.24;letter-spacing:-.024em;margin-top:9px;color:var(--navy);text-wrap:balance;
  transition:color .35s}
.dreammm .dm-art:hover .dm-art__titolo{color:var(--viola)}
.dreammm .dm-art__estratto{display:block;font-size:14.5px;line-height:1.55;color:#5A6570;margin-top:8px}
@media(max-width:900px){.dreammm .dm-articoli{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.dreammm .dm-articoli{grid-template-columns:1fr}}
.dreammm .navigation.pagination{margin-top:clamp(34px,4.4vw,56px)}
.dreammm .nav-links{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.dreammm .page-numbers{font-family:var(--dm-display);font-weight:700;font-size:14.5px;text-decoration:none;
  min-width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0 14px;
  color:#3D4A52;border:1px solid var(--linea-scura);transition:background .3s,color .3s,border-color .3s}
.dreammm .page-numbers:hover{border-color:var(--viola);color:var(--viola)}
.dreammm .page-numbers.current{background:var(--navy);border-color:var(--navy);color:#fff}
.dreammm .page-numbers.dots{border-color:transparent}
/* ---------- il testo lungo di un articolo ---------- */
.dreammm .dm-articolo{font-size:17.5px;line-height:1.72;color:#2E3A42}
.dreammm .dm-articolo > * + *{margin-top:1.15em}
.dreammm .dm-articolo h2{font-family:var(--dm-display);font-weight:800;font-size:clamp(24px,2.8vw,33px);
  letter-spacing:-.028em;line-height:1.2;color:var(--navy);margin-top:1.9em;text-wrap:balance}
.dreammm .dm-articolo h3{font-family:var(--dm-display);font-weight:800;font-size:clamp(19px,2.1vw,23px);
  letter-spacing:-.02em;color:var(--navy);margin-top:1.6em}
.dreammm .dm-articolo a{color:var(--viola);text-decoration:underline;text-underline-offset:3px;
  text-decoration-thickness:1px}
.dreammm .dm-articolo a:hover{text-decoration-thickness:2px}
.dreammm .dm-articolo ul,.dreammm .dm-articolo ol{padding-left:1.3em}
.dreammm .dm-articolo li + li{margin-top:.5em}
.dreammm .dm-articolo li::marker{color:var(--viola)}
.dreammm .dm-articolo img{max-width:100%;height:auto;display:block}
.dreammm .dm-articolo blockquote{border-left:3px solid var(--lime);padding-left:22px;
  font-family:var(--dm-display);font-weight:700;font-size:20px;line-height:1.4;color:var(--navy)}
.dreammm .dm-articolo table{width:100%;border-collapse:collapse;font-size:15.5px;display:block;overflow-x:auto}
.dreammm .dm-articolo th,.dreammm .dm-articolo td{border:1px solid var(--linea-scura);padding:11px 14px;text-align:left}
.dreammm .dm-articolo th{background:var(--grigio);font-family:var(--dm-display);font-weight:700}
.dreammm .dm-articolo pre{background:var(--navy);color:#fff;padding:18px;overflow-x:auto;font-size:14px}
.dreammm .dm-articolo code{font-size:.92em;background:rgba(105,103,251,.1);padding:2px 6px}
.dreammm .dm-articolo pre code{background:none;padding:0}
.dreammm .dm-vicini{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:clamp(40px,5vw,64px);
  border-top:1px solid var(--linea-scura);padding-top:clamp(24px,3vw,34px)}
.dreammm .dm-vicino{display:block;text-decoration:none;padding:18px 20px;border:1px solid var(--linea-scura);
  transition:border-color .35s,transform .35s}
.dreammm .dm-vicino:hover{border-color:var(--viola);transform:translateY(-3px)}
.dreammm .dm-vicino span{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  color:#8A9AA5;font-family:var(--dm-display);font-weight:700}
.dreammm .dm-vicino b{display:block;font-family:var(--dm-display);font-weight:700;font-size:16px;
  line-height:1.3;color:var(--navy);margin-top:6px}
.dreammm .dm-vicino--dx{text-align:right}
@media(max-width:640px){.dreammm .dm-vicini{grid-template-columns:1fr}.dreammm .dm-vicino--dx{text-align:left}}
.dreammm .dm-ponte{display:grid;grid-template-columns:1fr auto;gap:clamp(20px,3vw,44px);align-items:center;
  padding:clamp(26px,3.4vw,40px);background:rgba(105,103,251,.11);border:1px solid rgba(105,103,251,.3)}
.dreammm .dm-ponte h2{font-size:clamp(21px,2.6vw,30px);margin-top:4px}
.dreammm .dm-ponte p{margin-top:10px;color:var(--muto);font-size:16px;max-width:56ch}
@media(max-width:760px){.dreammm .dm-ponte{grid-template-columns:1fr}}
/* ==========================================================================
   CONTATTI
   ========================================================================== */
.dreammm .dm-contatti{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(28px,4.4vw,74px);
  align-items:start}
@media(max-width:900px){.dreammm .dm-contatti{grid-template-columns:1fr}}
.dreammm .dm-modulo{display:grid;gap:16px}
.dreammm .dm-modulo label{display:block;font-family:var(--dm-display);font-weight:700;font-size:13.5px;
  color:var(--navy);letter-spacing:.01em}
.dreammm .dm-modulo label span{color:var(--viola)}
.dreammm .dm-modulo input,.dreammm .dm-modulo textarea{display:block;width:100%;margin-top:8px;
  font-family:var(--corpo);font-size:16.5px;color:var(--navy);background:#fff;
  border:1px solid rgba(14,26,31,.18);padding:15px 16px;outline:0;
  transition:border-color .3s,box-shadow .3s}
.dreammm .dm-modulo input:focus,.dreammm .dm-modulo textarea:focus{border-color:var(--viola);
  box-shadow:0 0 0 3px rgba(105,103,251,.14)}
.dreammm .dm-modulo textarea{resize:vertical;line-height:1.6}
.dreammm .dm-modulo__due{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:520px){.dreammm .dm-modulo__due{grid-template-columns:1fr}}
.dreammm .dm-modulo #dm-modulo-esca{position:absolute;left:-9999px;width:1px;height:1px}
.dreammm .dm-modulo .dm-btn{justify-self:start}
.dreammm .dm-modulo__esito{font-size:14.5px;color:var(--viola);min-height:1.2em;margin:0}
.dreammm .dm-modulo__esito.male{color:var(--rosso)}
.dreammm .dm-modulo__nota{font-size:13px;line-height:1.55;color:#7C8B95;margin:0}
.dreammm .dm-modulo__nota a{color:#5A6570}
.dreammm .dm-contatti__lato{display:grid;gap:clamp(22px,2.6vw,32px)}
.dreammm .dm-recapito p{font-size:15.5px;line-height:1.6;color:#3D4A52}
.dreammm .dm-recapito__grande{display:block;font-family:var(--dm-display);font-weight:800;
  font-size:clamp(24px,2.8vw,32px);letter-spacing:-.03em;color:var(--navy);text-decoration:none;
  transition:color .3s}
.dreammm .dm-recapito__grande:hover{color:var(--viola)}
.dreammm .dm-recapito__mail{display:inline-block;margin-top:6px;font-size:16px;color:var(--viola);
  text-decoration:underline;text-underline-offset:3px}
/* Telefono e mail sono le due vie di contatto per chi non vuole il modulo, e
   sul telefono si toccano: erano alte 38 e 26px, sotto il minimo di 44. Lo
   spazio entra dentro il link, non fra un link e l'altro. */
.dreammm .dm-recapito__grande{padding-block:5px}
.dreammm .dm-recapito__mail{padding-block:9px;margin-top:0}
.dreammm .dm-recapito__nota{font-size:13.5px!important;color:#7C8B95!important;margin-top:10px}
.dreammm .dm-attesa{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:14px 0;
  border-top:1px solid var(--linea-scura)}
.dreammm .dm-attesa > span{font-family:var(--dm-display);font-weight:900;font-size:14px;color:var(--viola)}
.dreammm .dm-attesa b{display:block;font-family:var(--dm-display);font-weight:700;font-size:15.5px;color:var(--navy)}
.dreammm .dm-attesa p{font-size:14.5px;line-height:1.5;color:#5A6570;margin-top:3px}
/* ==========================================================================
   VOCI DI MENU CON SOTTOMENU
   Senza un segno, "Cosa facciamo" sembra un link semplice e i nove servizi
   restano nascosti a chi non ci passa sopra per caso.
   ========================================================================== */
.dreammm .dm-menu > .menu-item-has-children > a{padding-right:16px;position:relative}
.dreammm .dm-menu > .menu-item-has-children > a::before{
  content:"";position:absolute;right:0;top:50%;width:7px;height:7px;
  border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;
  transform:translateY(-70%) rotate(45deg);opacity:.55;
  transition:transform .35s cubic-bezier(.2,.7,.3,1),opacity .3s}
.dreammm .dm-menu > .menu-item-has-children:hover > a::before,
.dreammm .dm-menu > .menu-item-has-children:focus-within > a::before{
  transform:translateY(-25%) rotate(-135deg);opacity:1;color:var(--lime)}
/* la sottolineatura non deve passare sotto la freccia */
.dreammm .dm-menu > .menu-item-has-children > a::after{right:16px}
/* nel pannello del telefono il sottomenu e' gia' aperto: basta segnalarlo */
.dreammm .dm-pannello__menu > .menu-item-has-children > a::after{
  content:"";display:inline-block;width:6px;height:6px;margin-left:10px;
  vertical-align:middle;border-right:1.6px solid var(--lime);
  border-bottom:1.6px solid var(--lime);transform:translateY(-2px) rotate(45deg)}
.dreammm .dm-pannello__menu .sub-menu{position:relative;padding-left:14px}
.dreammm .dm-pannello__menu .sub-menu::before{content:"";position:absolute;left:0;top:6px;bottom:6px;
  width:1px;background:rgba(255,255,255,.16)}
/* ==========================================================================
   RIFINITURE DEL 29 LUGLIO
   ========================================================================== */
/* --- l'occhiello della testata sta su una riga anche sul telefono --- */
.dreammm .dm-hero__occhiello{white-space:nowrap;min-width:0}
@media(max-width:760px){
  .dreammm .dm-hero__occhiello{font-size:10px;letter-spacing:.14em;gap:9px}
  .dreammm .dm-hero__occhiello::before{width:20px}
}
@media(max-width:430px){
  .dreammm .dm-hero__occhiello{font-size:8.8px;letter-spacing:.09em;gap:7px}
  .dreammm .dm-hero__occhiello::before{width:14px}
}
/* --- "La prova": titolo a sinistra, testo a destra, la banda si riempie --- */
.dreammm .dm-testa-due{display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(20px,4vw,68px);align-items:end}
.dreammm .dm-testa-due h2{margin-bottom:0}
.dreammm .dm-testa-due .dm-piombo{max-width:44ch;padding-bottom:.5em}
@media(max-width:860px){
  .dreammm .dm-testa-due{grid-template-columns:1fr;align-items:start;gap:18px}
  .dreammm .dm-testa-due .dm-piombo{max-width:56ch}
}
/* --- l'etichetta sulle schede progetto era grigia per una collisione --- */
/* .dm-prog__eti span (0,2,1) vinceva su .dm-prog__tag (0,2,0): ora pareggiamo */
.dreammm .dm-prog__eti span.dm-prog__tag{color:var(--navy);margin-top:0}

/* ==========================================================================
   COMPONENTI CHE DEVONO VINCERE SUL CONTENITORE
   Una regola come ".dm-picco p" (specificita' 0,2,1) batteva ".dm-iniziale"
   (0,2,0): il titolo "Mappa" finiva a 15,5px invece che a 46, e l'etichetta
   sulle schede progetto diventava grigia. Ripetendo la classe si arriva a
   0,3,0 e il componente torna a decidere di se stesso.
   Nota: ".dm-piombo" resta fuori di proposito. Li' l'override del contenitore
   serve davvero, e' quello che lo rende scuro sulle sezioni chiare.
   ========================================================================== */
.dreammm .dm-eyebrow.dm-eyebrow{color:var(--viola);font-size:11.5px}
.dreammm .dm-iniziale.dm-iniziale{color:#fff;font-size:clamp(30px,3.4vw,46px)}
.dreammm .dm-prog__tag.dm-prog__tag{color:var(--navy);font-size:11px}
.dreammm .dm-piede__stelle.dm-piede__stelle{color:rgba(255,255,255,.94);font-size:14px}
.dreammm .dm-nota.dm-nota{color:#5A6570}
.dreammm .dm-modulo__esito.dm-modulo__esito{color:var(--viola)}
.dreammm .dm-modulo__nota.dm-modulo__nota{color:#7C8B95}
.dreammm .dm-recapito__nota.dm-recapito__nota{color:#7C8B95;font-size:13.5px}
.dreammm .dm-audit__dove.dm-audit__dove{color:rgba(255,255,255,.35);font-size:13px}
.dreammm .dm-audit__esitomail.dm-audit__esitomail{color:var(--lime);font-size:14px}

/* le varianti di stato restano piu' forti del rinforzo qui sopra */
.dreammm .dm-modulo__esito.dm-modulo__esito.male{color:var(--rosso)}
.dreammm .dm-audit__esitomail.dm-audit__esitomail.male{color:#FF7A85}

/* ==========================================================================
   TESTATE DI SEZIONE A RIGA PIENA
   Nelle bande a tutta larghezza il testo incolonnato a sinistra lasciava
   mezza pagina vuota: qui titolo e introduzione occupano tutta la colonna.
   ========================================================================== */
.dreammm .dm-largo{max-width:none}
.dreammm p.dm-largo{max-width:none}
.dreammm .dm-grande.dm-largo{text-wrap:pretty}

/* ==========================================================================
   RIFINITURE DEL 30 LUGLIO
   ========================================================================== */

/* Il titolo delle fasi era incollato al sottotitolo: ".dm-picco p" imponeva
   margin:0 e vinceva sui 4px di .dm-iniziale. Stessa collisione di prima,
   stavolta sul margine invece che sul colore. */
.dreammm .dm-iniziale.dm-iniziale{margin:0 0 12px}
.dreammm .dm-fase-et.dm-fase-et{margin-bottom:14px}

/* Loghi dei clienti: piu' grandi e scorrimento piu' calmo. */
.dreammm .dm-marchio.dm-marchio{
  width:clamp(196px,17.5vw,272px);
  height:clamp(88px,8.8vw,126px);
  margin-inline:clamp(20px,2.6vw,42px)}
.dreammm .dm-fila{animation-duration:92s}
.dreammm .dm-fila--indietro{animation-duration:112s}

/* ==========================================================================
   SCHERMI STRETTI — LE COSE RIMASTE SCOPERTE
   Il resto dell'impaginazione ha gia' le sue regole: testata a menu ridotto
   sotto i 1120px, griglia servizi a una colonna sotto i 620px, tre schede del
   metodo incolonnate sotto i 940px. Qui ci sono i pezzi che ne erano privi.
   ========================================================================== */

/* Le parole lunghe non devono sfondare il contenitore: "dreammmstudio.it",
   "realizzazione", gli indirizzi email. Senza questo, su schermi molto
   stretti allargano la pagina e compare lo scorrimento orizzontale. */
.dreammm h1, .dreammm h2, .dreammm h3, .dreammm p, .dreammm a{overflow-wrap:break-word}

@media(max-width:620px){
  /* Il selettore costo/asset: due bottoni affiancati con 26px di respiro per
     lato non ci stanno. Diventa a tutta larghezza, meta' e meta'. */
  .dreammm .dm-selettore{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .dreammm .dm-selettore button{padding:13px 10px;font-size:13px}

  /* Le bolle del grafico erano tarate su una larghezza che qui non c'e'. */
  .dreammm .dm-bolla{max-width:min(64vw,220px);font-size:12.5px;padding:9px 12px}
  .dreammm .dm-grafico{padding:16px 14px}

  /* La colonna del numero rubava spazio al testo. */
  .dreammm .dm-riga-q{grid-template-columns:44px 1fr;gap:14px;padding:22px 0}
  .dreammm .dm-num{font-size:14px}
}

@media(max-width:430px){
  /* I loghi scorrevoli: piu' piccoli, altrimenti se ne vede uno per volta. */
  .dreammm .dm-marchio.dm-marchio{width:150px;height:70px;margin-inline:14px}

  /* Le etichette sulle schede progetto si accavallavano al nome. */
  .dreammm .dm-prog__eti{flex-direction:column;align-items:flex-start;gap:10px;padding:18px 18px 20px}

  /* Il numero grande e la sua didascalia, uno sotto l'altro. */
  .dreammm .dm-cifra b{font-size:38px}
}


/* =============================================================================
   TELEFONO — CORREZIONI DEL 30 LUGLIO
   ============================================================================ */

@media(max-width:760px){

  /* --- I loghi: griglia ferma, non nastro che scorre ---
     Su uno schermo stretto il nastro mostra un logo e mezzo per volta e passa
     prima che si riesca a leggerlo. Fermiamo lo scorrimento, teniamo il primo
     blocco e disponiamo dodici marchi su due colonne. */
  .dreammm .dm-muro{overflow:visible;padding-block:0}
  .dreammm .dm-muro::before,.dreammm .dm-muro::after{display:none}
  .dreammm .dm-muro + .dm-muro{display:none}
  .dreammm .dm-fila{display:grid;grid-template-columns:1fr 1fr;width:auto;
    animation:none;gap:clamp(10px,3vw,20px);align-items:center}
  .dreammm .dm-fila--indietro{animation:none}
  .dreammm .dm-fila .dm-marchio:nth-child(n+13){display:none}
  .dreammm .dm-marchio.dm-marchio{width:100%;height:clamp(64px,17vw,88px);margin:0}
  .dreammm .dm-trascina{display:none}

  /* --- Il piede era lunghissimo: tre colonne una sotto l'altra ---
     Le liste tornano affiancate, il blocco del marchio resta a tutta riga. */
  .dreammm .dm-piede{padding-block:clamp(38px,8vw,56px) 24px}
  .dreammm .dm-piede__griglia{grid-template-columns:1fr 1fr;gap:26px 22px}
  .dreammm .dm-piede__brand{grid-column:1 / -1}
  .dreammm .dm-piede__brand p{max-width:44ch}
  .dreammm .dm-piede__titolo{margin-bottom:10px}
  .dreammm .dm-piede li{margin-bottom:7px}
  .dreammm .dm-piede__legale{margin-top:26px;padding-top:16px}
}

@media(max-width:430px){
  .dreammm .dm-piede__griglia{gap:22px 18px}
  .dreammm .dm-fila{gap:10px}
}

/* Chrome su iPhone prosegue lo scorrimento oltre il fondo pagina con un
   effetto elastico che sembra spazio vuoto. Questo lo trattiene.
   Solo sugli schermi a tocco. Su Safari del computer, overscroll-behavior
   none sulla radice insieme a un ascolto della rotellina non passivo
   (scatto.js, vetrina.js) ferma del tutto lo scorrimento con la rotellina:
   sulla home, arrivati all'ultima sezione, il piede non si raggiungeva piu'.
   Provato in WebKit l'11 settembre 2026: con none e con contain resta
   bloccato, con auto si arriva in fondo. Sul telefono la rotellina non c'e'. */
@media (hover:none){
  html,body{overscroll-behavior-y:none}
}

/* ==========================================================================
   PAGINA "LO STUDIO" — CORREZIONI DEL 30 LUGLIO
   ========================================================================== */

/* --- La riga viola corta anche sugli occhielli di sezione ---
   La testata aveva un trattino viola prima del testo, le sezioni una riga
   grigia lunga dopo. Ora sono uguali. */
.dreammm .dm-eyebrow::after{display:none}
.dreammm .dm-eyebrow::before{content:"";width:38px;height:1px;background:var(--viola);flex:none}

/* --- Senza immagine la sezione non deve restare a due colonne --- */
.dreammm .dm-argomento--sola{grid-template-columns:1fr}
.dreammm .dm-argomento--sola .dm-testo,
.dreammm .dm-argomento--sola .dm-nota{max-width:none}

/* --- Titoli di sezione a riga piena, come in home --- */
.dreammm .dm-argomento--sola h2,
.dreammm #blocchi .dm-grande,
.dreammm #blocchi .dm-piombo,
.dreammm #passaggi .dm-grande,
.dreammm #passaggi .dm-piombo{max-width:none}

/* --- I numeri: da elenco a banda ---
   Erano righe con un bordo sotto, tutte uguali. Ora sono quattro colonne con
   il numero grande in lime, e una riga che cresce sotto al passaggio del
   mouse: la sezione respira invece di sembrare una tabella. */
/* Le colonne sono quante sono le cifre, non quattro fisse: in home ce ne
   sono tre e restava una cella vuota. auto-fit fa cadere le tracce che
   nessuno occupa. */
.dreammm .dm-cifre{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:1px;background:var(--linea);border:1px solid var(--linea);border-radius:0;
  margin-top:clamp(30px,4vw,48px)}
.dreammm .dm-cifra{display:block;background:var(--navy);
  padding:clamp(26px,3vw,42px) clamp(20px,2.2vw,30px);border:0;
  position:relative;overflow:hidden;transition:background .4s;
  container-type:inline-size}
.dreammm .dm-cifra::before{display:none}
.dreammm .dm-cifra::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:0;
  background:var(--lime);transition:width .55s cubic-bezier(.2,.7,.3,1)}
.dreammm .dm-cifra:hover{background:var(--navy2);padding-left:clamp(20px,2.2vw,30px)}
.dreammm .dm-cifra:hover::after{width:100%}
/* Il corpo della cifra segue la larghezza della CELLA, non quella dello
   schermo: in home la banda sta in mezza pagina e "2017" a 64px veniva
   tagliato. Misurare in vw un elemento che vive in una colonna stretta e'
   l'errore da cui nasceva il difetto. */
.dreammm .dm-cifra b{display:block;font-family:var(--dm-display);font-weight:900;
  font-size:max(30px,min(64px,36cqw));line-height:.92;letter-spacing:-.05em;
  color:var(--lime);margin-bottom:12px}
.dreammm .dm-cifra span{display:block;font-size:14.5px;line-height:1.45;
  color:var(--muto);max-width:22ch;text-align:left;justify-self:start;margin:0}
@media(max-width:900px){.dreammm .dm-cifre{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.dreammm .dm-cifre{grid-template-columns:1fr}}

/* --- La citazione riempie la riga invece di restare in un angolo --- */
.dreammm .dm-citazione__scena{display:grid;grid-template-columns:1.4fr .6fr;
  gap:clamp(24px,4vw,64px);align-items:end}
.dreammm .dm-citazione__scena .dm-citazione{max-width:none;border-left:0;padding-left:0;
  border-top:3px solid var(--lime);padding-top:clamp(22px,2.6vw,34px)}
.dreammm .dm-citazione__scena .dm-citazione p{max-width:26ch;
  font-size:clamp(26px,3.9vw,52px)}
.dreammm .dm-citazione__scena .dm-citazione cite{margin-top:22px}
@media(max-width:860px){
  .dreammm .dm-citazione__scena{grid-template-columns:1fr}
  .dreammm .dm-citazione__scena .dm-citazione p{max-width:none}
}

/* ==========================================================================
   EVIDENZIATORE E IMMAGINI SU FONDO BIANCO
   ========================================================================== */

/* L'evidenziatore era un pseudo-elemento a z-index:-1: in alcuni contesti di
   impilamento finisce dietro allo sfondo e sparisce, lasciando solo il testo
   scuro. Rifatto come sfondo del testo stesso: non ha strati da sbagliare. */
.dreammm .dm-marca{position:static;display:inline;z-index:auto;
  color:var(--navy);font-weight:600;padding:0 .14em;
  background-image:linear-gradient(var(--lime),var(--lime));
  background-repeat:no-repeat;
  background-size:100% 86%;
  background-position:0 62%;
  box-decoration-break:clone;-webkit-box-decoration-break:clone}
.dreammm .dm-marca::before{content:none}
.js-attivo .dreammm .dm-marca::before{content:none}

/* Quando l'immagine ha lo sfondo bianco pieno, ombra e alone ne disegnerebbero
   il rettangolo su una sezione chiara. Qui si tolgono e l'immagine si fonde. */
.dreammm .dm-scena--fusa .dm-scena__oggetto{filter:none}
.dreammm .dm-scena--fusa .dm-scena__alone{display:none}

/* ==========================================================================
   CITAZIONE — RIFATTA
   Il tentativo precedente era una griglia a due colonne con la seconda vuota:
   lo spazio vuoto si era spostato, non tolto. E il testo, stretto in 26
   caratteri per riga a corpo grande, veniva fuori in sei righe: un muro.
   Ora occupa tutta la riga, viene in due o tre righe, e la firma chiude a
   destra sotto il testo invece di galleggiare a sinistra.
   ========================================================================== */
.dreammm .dm-citazione__scena{display:block}

.dreammm .dm-citazione__scena .dm-citazione{
  max-width:none;border-left:0;padding-left:0;
  border-top:3px solid var(--lime);padding-top:clamp(26px,3vw,40px);
  display:grid;gap:clamp(20px,2.6vw,34px)}

.dreammm .dm-citazione__scena .dm-citazione p{
  max-width:38ch;
  font-size:clamp(23px,3.1vw,42px);
  line-height:1.16;
  letter-spacing:-.022em}

/* La firma sta a destra, allineata al filo del testo. */
.dreammm .dm-citazione__scena .dm-citazione cite{
  margin:0;justify-self:end;text-align:right;
  display:flex;align-items:center;gap:12px;
  font-size:14.5px;letter-spacing:.01em;color:#5A6570}
.dreammm .dm-citazione__scena .dm-citazione cite::before{
  content:"";width:34px;height:1px;background:var(--viola);flex:none}

@media(max-width:760px){
  .dreammm .dm-citazione__scena .dm-citazione p{max-width:none}
  .dreammm .dm-citazione__scena .dm-citazione cite{justify-self:start;text-align:left}
}

/* ==========================================================================
   LA CITAZIONE, DENTRO LA SEZIONE DEI VALORI
   Prima era una sezione bianca a sé, incastrata fra due scure e senza
   occhiello: nessuna identità, e il cervello la leggeva come un buco fra due
   blocchi. Ora chiude "In cosa crediamo", che è il posto dove quella frase
   significa qualcosa: prima i criteri, poi chi se ne prende la responsabilità.
   ========================================================================== */
.dreammm .dm-coda{margin:clamp(40px,5vw,68px) 0 0;padding-top:clamp(28px,3.2vw,42px);
  border-top:1px solid var(--linea);display:grid;
  grid-template-columns:auto 1fr;gap:clamp(20px,3vw,44px);align-items:start}

/* Le virgolette fanno da segnale: si capisce che è una voce, non un titolo. */
.dreammm .dm-coda::before{content:"\201C";font-family:var(--dm-display);font-weight:900;
  font-size:clamp(64px,7vw,104px);line-height:.72;color:var(--lime);
  display:block;margin-top:-.06em}

.dreammm .dm-coda p{margin:0;max-width:34ch;
  font-family:var(--dm-display);font-weight:700;
  font-size:clamp(20px,2.4vw,32px);line-height:1.24;letter-spacing:-.022em;
  color:#fff}

.dreammm .dm-coda cite{display:flex;align-items:center;gap:12px;margin-top:18px;
  font-style:normal;font-size:14px;color:var(--muto);letter-spacing:.01em}
.dreammm .dm-coda cite::before{content:"";width:28px;height:1px;background:var(--viola);flex:none}

@media(max-width:620px){
  .dreammm .dm-coda{grid-template-columns:1fr;gap:8px}
  .dreammm .dm-coda::before{font-size:56px}
  .dreammm .dm-coda p{max-width:none}
}

/* ==========================================================================
   CITAZIONE — ASSESTAMENTO
   Due cose non tornavano. Il filo sopra la citazione si sommava a quello che
   chiude l'ultimo passo: due righe vicine con niente in mezzo. E la firma
   finiva nella prima colonna, sotto le virgolette: essendo lunga, era lei a
   dettare la larghezza di quella colonna, e spingeva il testo lontanissimo
   a destra. Ora ogni pezzo sta dove deve.
   ========================================================================== */
.dreammm .dm-coda{
  margin:clamp(34px,4vw,54px) 0 0;
  padding-top:0;
  border-top:0;
  grid-template-columns:auto minmax(0,1fr);
  column-gap:clamp(16px,2vw,30px);
  row-gap:14px}

.dreammm .dm-coda::before{
  grid-row:1;grid-column:1;
  font-size:clamp(46px,5vw,74px);
  margin-top:-.02em}

.dreammm .dm-coda p{grid-row:1;grid-column:2}

/* La firma sotto il testo, non sotto le virgolette. */
.dreammm .dm-coda cite{grid-row:2;grid-column:2;margin-top:2px}

@media(max-width:620px){
  .dreammm .dm-coda{grid-template-columns:1fr}
  .dreammm .dm-coda::before,
  .dreammm .dm-coda p,
  .dreammm .dm-coda cite{grid-column:1}
  .dreammm .dm-coda::before{grid-row:1}
  .dreammm .dm-coda p{grid-row:2}
  .dreammm .dm-coda cite{grid-row:3}
}

/* ==========================================================================
   CITAZIONE — CENTRATA NELLA PAGINA
   Il blocco (virgolette, testo, firma) si stringe attorno al suo contenuto e
   si centra. Il testo resta allineato a sinistra: è l'unica cosa centrata del
   sito, e centrarne anche l'allineamento interno lo farebbe stonare col resto.
   La misura del blocco è scelta perché il testo cada in tre righe piene.
   ========================================================================== */
.dreammm .dm-coda{
  max-width:min(100%,780px);
  margin-inline:auto;
  margin-block:clamp(44px,5.5vw,76px) 0}
.dreammm .dm-coda p{max-width:none}

@media(max-width:620px){
  .dreammm .dm-coda{max-width:none;margin-inline:0}
}

/* ==========================================================================
   AREE TOCCABILI SUL TELEFONO
   I link del piede erano alti ~22px con poco spazio fra loro: sotto il minimo
   di 44px, e con il dito si sbaglia bersaglio. Ora l'area sensibile cresce
   senza che il piede diventi piu' lungo: lo spazio che prima stava fra le
   voci ora sta dentro la voce.
   ========================================================================== */
/* Area sensibile del piede: fino al tablet, non solo sul telefono. A 768px
   le voci tornavano alte 19px, sotto il minimo per il dito, perche' la soglia
   era 760. */
@media(max-width:1024px){
  .dreammm .dm-piede ul{gap:0}
  .dreammm .dm-piede li{margin-bottom:0}
  .dreammm .dm-piede li a{display:block;padding-block:10px}
  .dreammm .dm-piede__legale a{display:inline-block;padding-block:11px}
  /* Il marchio in testata e' anche il link alla home: 34px di alto sono
     pochi per il dito. Lo spazio ci sta, la barra e' alta 77px. */
  .dreammm .dm-logo{padding-block:5px}
}

/* ==========================================================================
   PASSI — COLLOCAZIONE ESPLICITA NELLA GRIGLIA
   Il blocco con titolo e testo non aveva una posizione assegnata: la griglia
   lo metteva nella prima cella libera, che su schermo stretto e' la colonna
   del numero, larga 40px. Da qui il testo schiacciato a sinistra.
   Ora ogni pezzo dichiara dove sta, su tutte le larghezze.
   ========================================================================== */
.dreammm .dm-passo__n{grid-column:1;grid-row:1}
.dreammm .dm-passo__chi{grid-column:2;grid-row:1}
.dreammm .dm-passo__testo{grid-column:3;grid-row:1}

/* Quando nessuna riga ha l'etichetta, la sua colonna non serve. */
.dreammm .dm-passi--nudi .dm-passo{grid-template-columns:52px 1fr}
.dreammm .dm-passi--nudi .dm-passo__testo{grid-column:2}

@media(max-width:760px){
  .dreammm .dm-passo__chi{grid-column:2;grid-row:1;justify-self:start;margin-bottom:0}
  .dreammm .dm-passo__testo{grid-column:2;grid-row:2}
  .dreammm .dm-passi--nudi .dm-passo{grid-template-columns:40px 1fr}
  .dreammm .dm-passi--nudi .dm-passo__testo{grid-column:2;grid-row:1}
}

/* ==========================================================================
   BLOCCHI NUMERATI — LA VARIANTE SCURA MANCAVA
   Erano stati scritti dando per scontato un fondo chiaro: bordi in grigio
   scuro, pannello bianco al passaggio del mouse, titolo navy. Da quando gli
   sfondi si alternano da soli quella sezione puo' finire su fondo scuro, e li'
   il titolo navy su navy spariva: si leggeva solo in hover, perche' il
   pannello bianco lo faceva riemergere.
   Ora la base e' la variante scura e `--chiare` resta l'eccezione.
   ========================================================================== */
.dreammm .dm-righe{border-top-color:var(--linea)}
.dreammm .dm-riga-q{border-bottom-color:var(--linea)}
.dreammm .dm-riga-q h3{color:#fff}
.dreammm .dm-riga-q p{color:var(--muto)}
.dreammm .dm-riga-q::before{background:rgba(255,255,255,.05);box-shadow:none}

/* Il numero: viola su navy ha poco stacco. Lime, come i numeri delle altre
   sezioni scure, e un filo piu' grande. */
.dreammm .dm-riga-q .dm-num{color:var(--lime);font-size:17px;letter-spacing:-.02em}

/* Su fondo chiaro torna tutto come prima. */
.dreammm .dm-righe--chiare{border-top-color:var(--linea-scura)}
.dreammm .dm-righe--chiare .dm-riga-q{border-bottom-color:var(--linea-scura)}
.dreammm .dm-righe--chiare .dm-riga-q h3{color:var(--navy)}
.dreammm .dm-righe--chiare .dm-riga-q p{color:#5A6570}
.dreammm .dm-righe--chiare .dm-riga-q::before{background:#fff;box-shadow:0 14px 40px rgba(14,26,31,.09)}
.dreammm .dm-righe--chiare .dm-riga-q .dm-num{color:var(--viola)}

/* ==========================================================================
   REVISIONE DI RESA - 2 settembre 2026
   Difetti visti guardando le pagine a 1440px, non dedotti dal foglio.
   ========================================================================== */

/* --- Testata: i bottoni stavano a 900px dal testo che li introduce -------
   La colonna di destra era vuota e i due bottoni ci galleggiavano dentro,
   allineati in basso. Ora stanno sotto il loro testo, e la colonna di destra
   la occupa la prova sociale: 5,0 su Google e' il dato piu' forte che
   abbiamo, e prima stava sotto la piega. */
.dreammm .dm-hero__sotto{grid-template-columns:minmax(0,1fr) auto;align-items:end;
  gap:clamp(26px,4vw,72px)}
.dreammm .dm-hero__sotto > div:first-child{max-width:62ch}
.dreammm .dm-hero .dm-azioni{margin-top:clamp(24px,3.2vh,38px)}
.dreammm .dm-hero .dm-recensioni{margin-top:0;padding-top:0;border-top:0;
  border-left:1px solid var(--linea);padding-left:clamp(20px,2.2vw,32px);
  flex-direction:column;align-items:flex-start;gap:13px;flex:none}
.dreammm .dm-hero .dm-recensioni p{max-width:19ch;line-height:1.5}
@media(max-width:940px){
  /* La regola qui sopra sta in fondo al foglio e batteva, per ordine, quella
     a una colonna scritta prima dentro il suo media query: sul telefono la
     colonna del testo restava larga zero e la testata diventava alta 5800px.
     Chi aggiunge in coda deve riscrivere anche le eccezioni. */
  .dreammm .dm-hero__sotto{grid-template-columns:1fr}
  .dreammm .dm-hero__sotto > div:first-child{max-width:none}
  .dreammm .dm-hero .dm-recensioni{border-left:0;padding-left:0;
    border-top:1px solid var(--linea);padding-top:18px;margin-top:8px;
    flex-direction:row;align-items:center;gap:16px}
  .dreammm .dm-hero .dm-recensioni p{max-width:none}
}

/* --- Servizi: l'ultima scheda restava sola su mezza riga ----------------
   Nove schede su una griglia da sei colonne: 3+3, 2+2+2, 2+2+2 e poi una da
   tre, che lasciava mezza riga vuota. Ora l'ultima le sei colonne le occupa
   tutte e la griglia chiude piena. */
.dreammm .dm-srv--x6{grid-column:span 6;min-height:0}
.dreammm .dm-srv--x6 p{max-width:70ch}
@media(max-width:1000px){.dreammm .dm-srv--x6{grid-column:span 2}}
@media(max-width:620px){.dreammm .dm-srv--x6{grid-column:span 1}}

/* Le schede erano allineate in basso: bastava una descrizione di tre righe
   invece di due perche' il suo titolo salisse e la fila sembrasse storta.
   Ora il contenuto parte dall'alto e i titoli di una fila sono in pari. La
   scheda grande resta allineata in basso: li' e' voluto. */
.dreammm .dm-srv{justify-content:flex-start}
.dreammm .dm-srv svg{margin-bottom:0}
.dreammm .dm-srv--primo{justify-content:flex-end}
.dreammm .dm-srv--primo svg{margin-bottom:auto}

/* --- Metodo 3M: le tre schede erano sfalsate senza un criterio ----------
   Erano 0 / 58 / 28: la seconda in alto, la terza a meta'. Sembrava un
   errore. Ora salgono da sinistra a destra, che e' anche quello che
   racconta la sezione. */
.dreammm .dm-picco:nth-child(2){margin-bottom:clamp(14px,1.9vw,32px)}
.dreammm .dm-picco:nth-child(3){margin-bottom:clamp(28px,3.8vw,64px)}
.dreammm .dm-picchi3::before{opacity:.2}
.dreammm .dm-picco{background:rgba(14,26,31,.74)}

/* --- Garanzie: quattro righe piene con il testo dentro un terzo ---------
   E la freccia in fondo prometteva un link che non esisteva: tolta dal
   template. Due per riga riempiono lo spazio e dimezzano l'altezza. */
.dreammm .dm-garanzie{grid-template-columns:1fr 1fr}
.dreammm .dm-gar{grid-template-columns:auto 1fr}
.dreammm .dm-gar p{max-width:44ch}
@media(max-width:900px){.dreammm .dm-garanzie{grid-template-columns:1fr}}

/* --- Vetrina progetti: i siti dentro i mockup non si leggevano ----------
   Il mockup era all'82% dentro una scheda molto scura, con sopra una
   velatura che scendeva all'85% di nero. Ora e' piu' grande e il buio resta
   solo dove serve, dietro le scritte in basso. */
.dreammm .dm-prog__mk{width:92%;top:48%}
.dreammm .dm-prog__tela::after{
  background:linear-gradient(180deg,rgba(11,20,24,.12),rgba(11,20,24,.18) 42%,rgba(11,20,24,.9))}
.dreammm .dm-prog__sfondo{opacity:.2}
.dreammm .dm-prog:hover .dm-prog__sfondo{opacity:.28}

/* --- Righe di testo troppo lunghe --------------------------------------
   145 e 161 caratteri per riga: tornando a capo si perde il segno. Il
   comodo sta fra 60 e 75. La sezione dei loghi resta a tutta larghezza,
   che e' una scelta esplicita di Gian Luca. */
.dreammm .dm-tempi{max-width:76ch}
.dreammm .dm-argomento--sola .dm-nota{max-width:70ch}
.dreammm #blocchi .dm-piombo,
.dreammm #passaggi .dm-piombo{max-width:66ch}

/* --- Contrasto delle scritte piccole ------------------------------------
   Il viola del marchio su navy da' 4,16 e su bianco 4,26, contro il 4,5 di
   riferimento per il testo piccolo. Il colore del marchio non cambia:
   bottoni, numeri e linee restano #6967FB. Cambia solo la quantita' di luce
   delle etichette minute, piu' chiare sul fondo scuro e piu' profonde sul
   chiaro. Stessa tinta, stessa famiglia. */
:root{
  --viola-chiaro:#8583FF;
  --viola-cupo:#5754E0;
  --muto-scuro:#5F6E78;
}
.dreammm .dm-eyebrow.dm-eyebrow{color:var(--viola-chiaro)}
.dreammm .dm-bianca .dm-eyebrow.dm-eyebrow,
.dreammm .dm-chiara .dm-eyebrow.dm-eyebrow{color:var(--viola-cupo)}
.dreammm .dm-eyebrow::before{background:currentColor;opacity:.75}
.dreammm .dm-art__cat{color:var(--viola-cupo)}
.dreammm .dm-modulo__nota.dm-modulo__nota,
.dreammm .dm-recapito__nota.dm-recapito__nota,
.dreammm .dm-legenda{color:var(--muto-scuro)}
.dreammm .dm-scena figcaption{color:var(--muto-scuro)}
.dreammm .dm-scura .dm-scena figcaption,
.dreammm .dm-superficie .dm-scena figcaption{color:var(--muto)}

/* Il piede e' viola pieno: li' nemmeno il bianco puro arrivava a 4,5, perche'
   il limite era il fondo. Scurito del sette per cento - a occhio lo stesso
   viola - ogni scritta passa. */
.dreammm .dm-piede{background:#5653EC}
.dreammm .dm-piede__titolo{color:rgba(255,255,255,.92)}
.dreammm .dm-piede p{color:rgba(255,255,255,.94)}
/* --- Il titolo non e' piu' riempito di fotografia --------------------------
   La prima riga dell'H1 era riempita con roccia.webp via background-clip.
   Due problemi. Il primo: quella foto e' una catena himalayana, non le
   Dolomiti - dentro il titolo di uno studio di Belluno stonava. Il secondo:
   a quella dimensione si vedeva una sola macchia grigia su tre lettere,
   quindi non si leggeva come materia ma come sporco.
   La montagna il sito la racconta gia' in tre punti: il marchio, le creste
   animate dietro la testata e i divisori a profilo di picco. Nel titolo non
   serviva una quarta volta, e detta male. */
.dreammm .dm-hero .dm-riga:nth-child(1) > span{background:none;color:#fff;filter:none}

/* La firma delle recensioni andava a capo lasciando "scheda" da sola. */
.dreammm .dm-hero .dm-recensioni p{max-width:24ch}
/* Le due schede della prima fila sono la coppia d'apertura: restano allineate
   in basso tutte e due, altrimenti una parte dall'alto e l'altra dal basso
   nella stessa fila. */
.dreammm .dm-srv--x3{justify-content:flex-end}
.dreammm .dm-srv--x3 svg{margin-bottom:auto}

/* La scheda a tutta larghezza chiude il discorso: il titolo cresce e il testo
   prende piu' misura, cosi' non sembra una scheda piccola stirata. */
.dreammm .dm-srv--x6{min-height:150px}
.dreammm .dm-srv--x6 h3{font-size:clamp(20px,2vw,26px)}
.dreammm .dm-srv--x6 p{font-size:15px;max-width:82ch}
/* --- La scheda a tutta larghezza dei benefici ---------------------------
   Era l'unica con il testo di fianco al titolo invece che sotto: nella
   stessa griglia sembrava un altro componente. Ora si comporta come la
   scheda a tutta larghezza della homepage: una riga sola, titolo piu'
   grande, testo con piu' misura. Larga significa "chiude il discorso",
   non "cambia impaginazione". */
.dreammm .dm-benef--pieno{display:block}
.dreammm .dm-benef--pieno h3{font-size:clamp(20px,2.2vw,26px)}
.dreammm .dm-benef--pieno p{font-size:16px;max-width:78ch}

/* --- Due sezioni scure di fila si leggevano come un unico blocco --------
   Fra chiaro e scuro c'e' il divisore a picchi. Fra scuro e scuro non c'era
   niente, e su Cosa Facciamo se ne susseguono tre: una fascia unica lunga
   quasi tremila pixel. Un filo sottile basta a dire dove finisce una cosa
   e comincia l'altra. */
.dreammm .dm-scura + .dm-vetrina,
.dreammm .dm-superficie + .dm-vetrina,
.dreammm .dm-chiara + .dm-vetrina,
.dreammm .dm-vetrina + .dm-altri,
.dreammm .dm-scura + .dm-altri,
.dreammm .dm-superficie + .dm-altri,
.dreammm .dm-vetrina + .dm-finale,
.dreammm .dm-altri + .dm-finale,
.dreammm .dm-scura + .dm-finale,
.dreammm .dm-superficie + .dm-finale{border-top:1px solid rgba(255,255,255,.09)}

/* --- I numeri in filigrana delle garanzie erano quasi invisibili -------- */
.dreammm .dm-gar__n{color:rgba(255,255,255,.16)}
.dreammm .dm-gar:hover .dm-gar__n{color:var(--lime)}
/* --- I loghi dei clienti erano al 42% di opacita' -----------------------
   Cosi' scoloriti alcuni sparivano del tutto e la fila sembrava avere dei
   buchi. E' la sezione della prova: un logo che non si legge non prova
   niente. Restano in grigio e in sordina, ma si vedono. */
.dreammm .dm-marchio.dm-marchio{filter:grayscale(1) contrast(.95) opacity(.6)}
.dreammm .dm-marchio.dm-marchio:hover{filter:none}
/* --- Rifiniture del contrasto, secondo giro -----------------------------
   Il primo giro aveva dato per scontato che "fondo chiaro" volesse dire
   .dm-bianca o .dm-chiara. La sezione dei loghi non ha nessuna delle due:
   il suo occhiello si era preso il viola chiaro, fatto per il navy, e su
   bianco scendeva a 3,14. Peggio di prima. */
.dreammm .dm-loghi .dm-eyebrow.dm-eyebrow,
.dreammm .dm-bianca .dm-eyebrow.dm-eyebrow,
.dreammm .dm-chiara .dm-eyebrow.dm-eyebrow{color:var(--viola-cupo)}

/* Il grigio delle note aveva un !important nella regola originale. */
.dreammm .dm-recapito__nota.dm-recapito__nota{color:var(--muto-scuro)!important}
.dreammm .dm-grafico__scelta button{color:var(--muto-scuro)}
.dreammm .dm-legenda,
.dreammm .dm-legenda span{color:var(--muto-scuro)}

/* Mail dei contatti ed etichetta dell'oggetto: viola su bianco. */
.dreammm .dm-recapito__mail{color:var(--viola-cupo)}
.dreammm .dm-scena__eti{color:var(--viola-cupo)}
.dreammm .dm-scura .dm-scena__eti,
.dreammm .dm-superficie .dm-scena__eti{color:var(--viola-chiaro)}

/* L'etichetta "Insieme" e' bianca su viola pieno: stesso limite del piede,
   il fondo. Scurita quanto basta. */
.dreammm .dm-passo__chi--insieme{background:#5653EC}
/* Il selettore del grafico: la voce non attiva era grigio 3,51 su bianco. */
.dreammm .dm-selettore button{color:var(--muto-scuro)}
.dreammm .dm-selettore button.att{color:#fff}
/* --- Perche' overflow-x passa da hidden a clip ---------------------------
   `overflow-x:hidden` su .dreammm (che sta sia sul body sia sul main) crea un
   contenitore di scorrimento, e dentro un contenitore di scorrimento
   `position:sticky` non tiene: la scena si staccava e per meta' della corsa
   restava schermo nero.
   `clip` taglia allo stesso modo ma non crea il contenitore, quindi sticky
   funziona. La riga con `hidden` resta prima come riserva per i browser che
   non conoscono `clip`. */
.dreammm{overflow-x:hidden;overflow-x:clip}

/* ==========================================================================
   RIFINITURE SUL TELEFONO DELL'11 SETTEMBRE 2026
   ========================================================================== */

/* --- Le domande frequenti vanno a capo ------------------------------------
   Il reset di Hello Elementor da' a tutti i bottoni white-space:nowrap, e la
   domanda e' un bottone: le domande lunghe finivano sotto il segno + o fuori
   dal riquadro. Misurato: 23 domande su 64 a 390px, 33 a 360px. */
.dreammm .dm-voce > button{white-space:normal;overflow-wrap:break-word}

/* --- Il sottomenu del pannello si apre con la freccia ---------------------
   La freccia disegnata dentro il collegamento non serve piu': ora c'e' un
   bottone vero, che apre e chiude (dreammm.js). Il reset di Hello colora di
   rosa i bottoni al passaggio e al fuoco: per questo tre stati nella stessa
   regola. */
.dreammm .dm-pannello__menu > .menu-item-has-children{position:relative}
.dreammm .dm-pannello__menu > .menu-item-has-children > a{padding-right:56px}
.dreammm .dm-pannello__menu > .menu-item-has-children > a::after{content:none}
.dreammm .dm-pannello__apri,
.dreammm .dm-pannello__apri:hover,
.dreammm .dm-pannello__apri:focus{position:absolute;right:-10px;top:5px;width:48px;height:48px;
  display:grid;place-items:center;padding:0;border:0;border-radius:10px;
  background:none;color:var(--lime);cursor:pointer}
.dreammm .dm-pannello__apri::before{content:"";width:9px;height:9px;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:translateY(-3px) rotate(45deg);transition:transform .3s cubic-bezier(.2,.7,.3,1)}
.dreammm .dm-pannello__apri[aria-expanded="true"]::before{transform:translateY(2px) rotate(-135deg)}
.dreammm .dm-pannello__apri:focus-visible{outline:2px solid var(--lime);outline-offset:-4px}
.dreammm .dm-pannello__menu > .menu-item-has-children.e-chiusa > .sub-menu{display:none}

/* --- Il piede sul telefono ------------------------------------------------
   Era alto 941px, piu' di una schermata: nove servizi in colonna, uno sotto
   l'altro. Ora i servizi stanno su due colonne a tutta riga, Studio e
   Contatti affiancati, e la frase del marchio resta solo sugli schermi
   larghi. Le voci restano alte 34px, sopra il minimo di 24 delle linee guida
   di accessibilita'. */
@media(max-width:560px){
  .dreammm .dm-piede{padding-block:34px 18px}
  .dreammm .dm-piede__griglia{grid-template-columns:1fr 1fr;gap:24px 16px}
  .dreammm .dm-piede__brand{grid-column:1 / -1;display:flex;flex-wrap:wrap;
    align-items:center;justify-content:space-between;gap:10px 16px}
  .dreammm .dm-piede__logo{width:168px;height:29px;margin-bottom:0}
  .dreammm .dm-piede__brand p:not(.dm-piede__stelle){display:none}
  .dreammm .dm-piede__brand .dm-piede__stelle{margin:0;font-size:13px}
  .dreammm .dm-piede__griglia > div:nth-child(2){grid-column:1 / -1}
  .dreammm .dm-piede__griglia > div:nth-child(2) ul{grid-template-columns:1fr 1fr;column-gap:16px}
  .dreammm .dm-piede__titolo{margin-bottom:4px}
  .dreammm .dm-piede li{font-size:14.5px;line-height:1.4}
  .dreammm .dm-piede li a{padding-block:7px}
  .dreammm .dm-piede__legale{margin-top:22px;padding-top:12px;font-size:12.5px;gap:2px 14px}
  .dreammm .dm-piede__legale a{margin:0 16px 0 0;padding-block:8px}
}