/* INSEGNE BRESCIA - v67 - copy rivisto (2026-10-23): voci dei clienti accanto alle promesse,
   «Sei nel posto giusto» più asciutta, «Chi c'è dietro» richiudibile su telefono.
   Si carica dopo v66.css. Le regole della v63 sono molto specifiche e usano !important: qui si risponde allo stesso modo. */

/* ==========================================================================
   1. SEI NEL POSTO GIUSTO: il riquadro scuro ora contiene solo il titolo «Materiali, PREZZO e TEMPI contano…»
   ========================================================================== */
#problema .v57-method-summary .ib-mini-title{ margin-bottom:0 !important; }

/* ==========================================================================
   2. VOCI DEI CLIENTI — estratti delle testimonianze. Indicazioni del titolare (2026-10-23): fondo bianco in tutte le
      sezioni, testo piccolo, foto grande come in «Dicono di noi», nessun collegamento.
      Disposizione della sua bozza (2026-10-23): riquadro largo quanto la colonna del testo; a sinistra l'estratto, poi un
      filo verticale e la firma (nome, ruolo, azienda in azzurro, località, allineati a destra) con la foto rotonda in fondo.
      Dove la colonna è stretta («Chi c'è dietro», sopra il modulo) la firma va sotto il testo: lo decide la larghezza del
      riquadro stesso (container query), non quella dello schermo.
   ========================================================================== */
body .v67-voce.v67-voce{
  position:relative; box-sizing:border-box; container:v67voce / inline-size;
  display:flex; flex-wrap:wrap; align-items:center;
  width:100%; max-width:none; margin:56px auto 0 !important; padding:30px 32px 30px 36px !important;
  background:#fff; border:1px solid rgba(11,16,32,.08); border-radius:20px;
  box-shadow:0 20px 54px rgba(11,16,32,.16); text-align:left !important;
}
/* filo colorato in cima, dalle virgolette all'angolo destro */
body .v67-voce.v67-voce::before{
  content:''; position:absolute; top:-1px; left:74px; right:28px; height:3px; border-radius:3px;
  background:linear-gradient(90deg,#2b6cff,#7a4dff,#ff8a00);
}
body .v67-voce .v67-voce-virgolette{
  position:absolute; top:-30px; left:24px; pointer-events:none;
  font:800 80px/1 Montserrat, sans-serif !important;
  background:linear-gradient(135deg,#4f7dff,#8a4dff 55%,#ff8a00); -webkit-background-clip:text; background-clip:text;
  color:transparent !important; -webkit-text-fill-color:transparent;
}
body .v67-voce blockquote{
  flex:1 1 0; min-width:0; margin:0 !important; padding:0 30px 0 0 !important; border:0 !important; background:none !important;
}
/* le sezioni della v63 fissano corpo e colore dei paragrafi anche con regole per id: qui le stesse proprietà con un id davanti */
body .v67-voce.v67-voce blockquote p,
:is(#regia, #vedi-prima, #garanzia, #chi-sono, #simulazione) .v67-voce.v67-voce blockquote p{
  margin:0 !important; padding:0 !important; max-width:none !important;
  font:400 15px/1.68 Montserrat, sans-serif !important; letter-spacing:.005em !important;
  color:rgba(11,16,32,.74) !important; text-align:left !important; font-style:normal !important; text-transform:none !important;
}
body .v67-voce.v67-voce blockquote strong,
:is(#regia, #vedi-prima, #garanzia, #chi-sono, #simulazione) .v67-voce.v67-voce blockquote strong{
  font-weight:700 !important; color:#0b1020 !important; -webkit-text-fill-color:#0b1020 !important; background:none !important;
}
body .v67-voce figcaption{
  flex:none; align-self:stretch; display:flex; align-items:center; justify-content:flex-end; gap:18px;
  margin:0 !important; padding:4px 0 4px 30px !important;
}
/* il filo che separa estratto e firma: nelle garanzie una regola della v63 toglie i bordi, qui si risponde con un id davanti */
body .v67-voce.v67-voce figcaption,
:is(#regia, #vedi-prima, #garanzia, #chi-sono, #simulazione) .v67-voce.v67-voce figcaption{
  border:0 !important; border-left:1px solid rgba(11,16,32,.12) !important;
}
/* foto rotonda con un anello chiaro */
body .v67-voce .v67-voce-foto{
  box-sizing:border-box; width:104px !important; height:104px !important; flex:none; border-radius:50%;
  object-fit:cover; object-position:center; border:4px solid #fff;
  box-shadow:0 0 0 1px rgba(11,16,32,.1), 0 10px 26px rgba(11,16,32,.18);
}
body .v67-voce .v67-voce-dati{
  display:flex; flex-direction:column; align-items:flex-end; gap:3px; min-width:0; flex:0 1 auto;
  font:500 12px/1.4 Montserrat, sans-serif !important; text-align:right !important;
}
body .v67-voce .v67-voce-nome{ font-weight:700 !important; font-size:16px !important; color:#0b1020 !important; margin-bottom:2px; }
body .v67-voce .v67-voce-ruolo{ color:rgba(11,16,32,.6) !important; }
body .v67-voce .v67-voce-az{ color:#2b6cff !important; font-weight:600 !important; }
body .v67-voce .v67-voce-luogo{ color:rgba(11,16,32,.48) !important; margin-top:2px; }
body .v67-voce .v67-voce-luogo span{ margin-left:2px; opacity:.85; }
/* riquadro stretto: la firma va sotto l'estratto, separata da un filo orizzontale, sempre allineata a destra */
@container v67voce (max-width:660px){
  body .v67-voce blockquote{ flex-basis:100%; padding:0 !important; }
  body .v67-voce figcaption{
    flex:1 1 100%; gap:16px; margin:20px 0 0 !important; padding:18px 0 0 !important;
  }
  body .v67-voce.v67-voce figcaption,
  :is(#regia, #vedi-prima, #garanzia, #chi-sono, #simulazione) .v67-voce.v67-voce figcaption{
    border-left:0 !important; border-top:1px solid rgba(11,16,32,.1) !important;
  }
}
@container v67voce (max-width:420px){
  body .v67-voce .v67-voce-foto{ width:84px !important; height:84px !important; border-width:3px; }
}

/* entrata: sale piano quando arriva nello schermo (lo stato iniziale lo mette v67.js, così senza script resta visibile) */
body .v67-voce.v67-attesa{ opacity:0; transform:translateY(28px); transition:opacity .9s cubic-bezier(.22,.9,.36,1), transform .9s cubic-bezier(.22,.9,.36,1); }
body .v67-voce.v67-attesa.is-in{ opacity:1; transform:none; }

/* posizioni: nel processo la voce sta tra le schede SOLO INSEGNE / SOLO BRESCIA e il riquadro della responsabilità;
   nelle garanzie chiude la riga della garanzia a cui fa da prova */
body .sol .v67-voce{ margin:48px auto 8px !important; }
body #regia .v67-voce{ margin:56px 0 0 !important; } /* in REGIA il testo è allineato a sinistra: la voce segue la stessa colonna */
body #garanzia .drow .v67-voce{ margin:40px auto 6px !important; }
body #simulazione .v67-voce{ margin:38px auto 30px !important; }
body #chi-sono .v67-voce{ margin:44px 0 6px !important; }

@media (max-width:780px){
  body .v67-voce.v67-voce{ padding:28px 20px 20px !important; margin-top:46px !important; border-radius:16px; }
  body .v67-voce.v67-voce::before{ left:60px; right:20px; }
  body .v67-voce .v67-voce-virgolette{ font-size:68px !important; top:-24px; left:14px; }
  body .v67-voce.v67-voce blockquote p,
  :is(#regia, #vedi-prima, #garanzia, #chi-sono, #simulazione) .v67-voce.v67-voce blockquote p{ font-size:14.5px !important; line-height:1.65 !important; }
}

/* ==========================================================================
   3. VEDI PRIMA: la frase sulla regia unica apre il blocco dopo il riquadro della simulazione
   ========================================================================== */
#vedi-prima .copy-process .v67-sim-regia{ margin-bottom:26px !important; }

/* ==========================================================================
   4. CHI C'È DIETRO su telefono: i sei capitoli si aprono con «Continua a leggere la storia»
   ========================================================================== */
.v67-chi-capitoli.is-chiusa{ display:none !important; }
#chi-sono .v67-chi-apri{
  display:flex; align-items:center; justify-content:center; gap:12px;
  margin:30px auto 8px; padding:15px 28px; border-radius:999px; cursor:pointer;
  border:1px solid rgba(255,255,255,.24); background:rgba(255,255,255,.07); color:#fff;
  font:700 14px/1.2 Montserrat, sans-serif; letter-spacing:.06em; text-transform:uppercase;
  transition:background .25s, border-color .25s;
}
#chi-sono .v67-chi-apri::after{
  content:''; width:9px; height:9px; margin-top:-5px;
  border-right:2px solid #ff8a00; border-bottom:2px solid #ff8a00; transform:rotate(45deg);
}
#chi-sono .v67-chi-apri:hover{ background:rgba(255,255,255,.12); border-color:rgba(255,138,0,.6); }
#chi-sono .v67-chi-apri[hidden]{ display:none; }
@media (max-width:420px){ #chi-sono .v67-chi-apri{ padding:14px 20px; font-size:13px; letter-spacing:.02em; white-space:nowrap; } }

/* ==========================================================================
   5. TRIPLA GARANZIA: numeri 1-2-3 centrati sotto «GARANZIA» (titolare, 2026-10-23).
      Il cronometro alzato perché il suo tondo stia al centro del cerchio è nell'HTML (build_v67.py, 7c).
   ========================================================================== */
#garanzia#garanzia .v66-gar-head .card-top{ align-items:center !important; text-align:center !important; }

/* ==========================================================================
   6. TELEFONO — revisione del 2026-10-23 (schermate a 390 px, una ogni 800 px, e controllo automatico)
   ========================================================================== */
/* menu in alto: su telefono restano il logo e CONTATTACI, come prevedeva la v63. Una regola successiva della v63
   rimostrava le voci del menu: «DICONO DI NOI» usciva dallo schermo, CONTATTACI restava fuori e il logo spariva */
@media (max-width:780px){
  header.topbar .topbar-nav{ display:none !important; }
  header.topbar .topbar-inner{ justify-content:space-between !important; }
}
/* Ruoli: su telefono e tablet si usa l'elenco a fisarmonica; la scheda del computer, resa visibile dalla v66, lasciava un vuoto
   (1.000 px a 390, 500 a 768) */
@media (max-width:920px){
  #ruoli#ruoli#ruoli .persona-panel, #ruoli#ruoli#ruoli .persona-buttons{ display:none !important; } /* l'elenco a fisarmonica sta in .persona-wrap: resta */
}
@media (max-width:760px){
  /* Tripla Garanzia, tempi: la tabella era un cerchio bianco che tagliava le righe */
  #garanzia#garanzia .tc-infog{ border-radius:20px !important; aspect-ratio:auto !important; }
  /* Chi c'è dietro: le quattro etichette in colonna, senza parole spezzate a metà */
  #chi-sono#chi-sono .v66-chi-testo .chi-micro-badges{ grid-template-columns:1fr !important; gap:8px !important; }
  #chi-sono#chi-sono .v66-chi-testo .chi-badge{ border-radius:14px !important; justify-content:flex-start !important; text-align:left !important; font-size:14px !important; padding:11px 16px !important; }
  /* «Ecco come nasce»: il simbolo sta sopra il titolo e il testo usa tutta la larghezza della scheda */
  #chi-sono#chi-sono .chi-value{ padding:24px 22px 22px !important; }
  #chi-sono#chi-sono .chi-value .chi-value-icon{ position:static !important; transform:none !important; margin:0 auto 14px !important; }
  #chi-sono#chi-sono .chi-value .chi-value-text{ font-size:16px !important; line-height:1.55 !important; }
  /* GALLERIA cubitale e tormentoni: le parole non escono più dai bordi */
  #galleria#galleria#galleria .gallery-cta-title .line2{ font-size:clamp(38px, 12vw, 84px) !important; }
  .v66-torm-sep .ib-sep-claim{ font-size:clamp(26px, 8.2vw, 64px) !important; }
  /* etichette troppo piccole da leggere */
  .proc-extra-tag{ font-size:11px !important; }
  .sim-bridge-eyebrow{ font-size:12px !important; }
  /* link del piè di pagina più comodi da toccare */
  .site-footer a{ display:inline-block; padding:8px 4px; }
}

/* ==========================================================================
   7. VELOCITÀ DI APERTURA (2026-10-23): immagine fissa dell'hero ricodificata; sugli schermi verticali la versione 9:16,
      come il video (v65.js). Le stesse due immagini sono annunciate nella testa della pagina con le stesse condizioni.
   ========================================================================== */
/* 2026-10-24: sul telefono la hero è alta almeno quanto lo schermo fin dal primo disegno. Prima la sua altezza dipendeva
   dal testo: se il browser disegnava prima di aver letto il testo, la hero era alta 128 px (i soli margini) e l'immagine
   fissa veniva registrata così piccola che poi l'«elemento più grande» per PageSpeed diventava il titolo, a fine entrata,
   o il video quando partiva: LCP molto più tardi e diverso a ogni misura. A 412×823 la hero era già alta 816 px. */
@media (max-width:780px){
  section.hero.band{ min-height:100vh; min-height:100svh; box-sizing:border-box; }
}
.hero > .ib-hero-media{ background-image:url("../video/hero-insegne-poster-v67.jpg"); }
@media (max-aspect-ratio: 406/720){
  .hero > .ib-hero-media{ background-image:url("../video/hero-insegne-poster-m.jpg"); }
}

/* ==========================================================================
   8. TELEFONO — richieste del titolare (2026-10-24)
   ========================================================================== */
/* 8a. Menu a panino: GALLERIA e RICHIEDI LA SIMULAZIONE (sostituisce il pulsante fisso in basso, tolto dalla build).
   Sta nella barra in alto, a destra di CONTATTACI: compare con logo e CONTATTACI al primo scorrimento (titolare, 2026-10-24). */
#v67Menu{ display:none; }
@media (max-width:780px){
  #v67Menu{ display:block; position:relative; flex:none; margin-left:10px; }
  header.topbar .topbar-cta{ margin-left:auto !important; }
  #v67Menu .v67-menu-btn{
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
    width:40px; height:40px; padding:0; margin:0; border-radius:12px; cursor:pointer;
    border:1px solid rgba(255,255,255,.22); background:rgba(11,21,48,.8);
    -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:0 6px 18px rgba(0,0,0,.35);
  }
  #v67Menu .v67-menu-btn span{ display:block; width:20px; height:2px; border-radius:2px; background:#fff; transition:transform .25s, opacity .2s; }
  #v67Menu.is-aperto .v67-menu-btn span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
  #v67Menu.is-aperto .v67-menu-btn span:nth-child(2){ opacity:0; }
  #v67Menu.is-aperto .v67-menu-btn span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
  /* left, width e max-width forzati: una regola della v63 per i nav li legava alla larghezza del pulsante (44 px) */
  #v67Menu .v67-menu-voci{
    position:absolute; top:calc(100% + 12px); left:auto !important; right:0 !important; box-sizing:border-box;
    width:min(290px, calc(100vw - 24px)) !important; max-width:none !important;
    display:flex; flex-direction:column; gap:10px; padding:14px; border-radius:16px;
    background:rgba(11,21,48,.97); border:1px solid rgba(255,255,255,.12); box-shadow:0 18px 44px rgba(0,0,0,.45);
  }
  #v67Menu .v67-menu-voci[hidden]{ display:none; }
  #v67Menu .v67-menu-voce{
    display:block; width:100%; max-width:none !important; white-space:nowrap; box-sizing:border-box; margin:0; padding:15px 16px; border-radius:12px; cursor:pointer;
    font:800 14px/1.2 Montserrat, sans-serif !important; letter-spacing:.08em; text-align:center; text-decoration:none;
    color:#fff !important; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16);
  }
  #v67Menu .v67-menu-voce.v67-menu-sim{ background:linear-gradient(135deg,#ff8a00,#ff6600); border-color:transparent; box-shadow:0 8px 24px rgba(255,100,0,.35); }
  /* la linea di avanzamento in alto con i pallini resta solo su computer (titolare, 2026-10-24) */
  html body .enh-nav-wrap.enh-nav-wrap{ display:none !important; }
}

/* 8b. CONTATTACI: «una volta cliccato incasina tutto». La finestra era alta 1.650 px su uno schermo di 844: schede
   altissime, parole spezzate («WhatsAp p»), la × fuori dallo schermo e la pagina sotto bloccata. Ora schede compatte e,
   se la finestra non ci sta, scorre lei. */
@media (max-width:780px){
  #contattiPopup#contattiPopup{
    align-items:flex-start !important; justify-content:center !important; padding:16px 12px !important;
    overflow-y:auto !important; -webkit-overflow-scrolling:touch; overscroll-behavior:contain;
  }
  #contattiPopup#contattiPopup .contatti-box{
    margin:auto !important; width:100% !important; max-width:420px !important; height:auto !important; max-height:none !important;
    padding:18px 16px 16px !important; box-sizing:border-box;
  }
  #contattiPopup#contattiPopup .contatti-head{ margin:0 0 12px !important; align-items:center !important; }
  #contattiPopup#contattiPopup .contatti-title{ font-size:26px !important; letter-spacing:.06em !important; white-space:nowrap !important; }
  #contattiPopup#contattiPopup .close-popup{ width:40px !important; height:40px !important; font-size:24px !important; flex:none; }
  #contattiPopup#contattiPopup .contatto-card{
    display:flex !important; flex-direction:column !important; align-items:flex-start !important; justify-content:flex-start !important;
    gap:6px !important; height:auto !important; min-height:0 !important; padding:14px 16px !important; margin:0 0 10px !important;
  }
  #contattiPopup#contattiPopup .contatto-left{
    display:flex !important; flex-direction:row !important; flex-wrap:wrap; align-items:center !important; gap:4px 10px !important;
    width:auto !important; height:auto !important; min-height:0 !important; flex:none !important;
  }
  #contattiPopup#contattiPopup .contatto-label{ width:auto !important; padding:4px 10px !important; font-size:14px !important; line-height:1.2 !important; white-space:nowrap !important; }
  #contattiPopup#contattiPopup .contatto-sub{ font-size:13px !important; line-height:1.3 !important; margin:0 !important; }
  #contattiPopup#contattiPopup .contatto-right{ font-size:24px !important; line-height:1.15 !important; margin:0 !important; text-align:left !important; white-space:nowrap !important; }
  #contattiPopup#contattiPopup a[href^="mailto"] .contatto-right{ font-size:19px !important; white-space:normal !important; overflow-wrap:anywhere; }
}

/* 8d. Titolo: «con Tripla Garanzia», ora la prima frase che si vede, con il cursore usciva dallo schermo di qualche pixel
   (titolo al 10,2% della larghezza): sotto i 480 px tutto il titolo un po' più piccolo, le tre righe restano uguali */
@media (max-width:480px){
  html body section.hero h1{ font-size:9.3vw !important; }
}

/* 8e. Riflesso che attraversa i pulsanti a pillola (titolare, 2026-10-24: sul telefono «ha una maschera rettangolare e
   sfora dal pillolone»). Il filtro blur(2px) faceva disegnare il riflesso su un livello a parte, e Safari su iPhone
   non applica a quel livello gli angoli tondi del pulsante. Senza filtro, con una sfumatura più morbida al suo posto,
   il riflesso resta dentro la pillola. Lo spostamento resta quello del CSS (rifiniture.js non lo ricalcola più). */
.enh-shimmer-overlay{
  filter:none !important; -webkit-filter:none !important;
  background:linear-gradient(110deg, transparent 0%, rgba(255,255,255,.16) 32%, rgba(255,255,255,.5) 50%, rgba(255,255,255,.16) 68%, transparent 100%) !important;
}
.landing-cta-btn, a.cta-chip, .cta-btn{ isolation:isolate; }

/* 8f. RUOLI su telefono (titolare, 2026-10-24: «mancano le freccette che guardano verso il basso, ci sono ma sono dei
   simboletti storpiati»). La v66 disegna già la freccia (cerchio arancione con una V bianca in SVG, che si gira quando la
   voce è aperta), ma una regola della v63 con !important ci scriveva sopra «+» e «–» a 26 px: si toglie il testo. */
#ruoli#ruoli .mobile-role-accordion summary::after,
#ruoli#ruoli .mobile-role-accordion details[open] summary::after{ content:"" !important; font-size:0 !important; }

/* 8g. SIMULAZIONE FOTOREALISTICA su telefono (titolare, 2026-10-24: «stretchata, usare un carattere più nativamente
   verticale»). Una regola della v63 schiacciava le due parole in larghezza (scaleX .78 e .60) con lettere sovrapposte.
   Ora Barlow Condensed 800, carattere stretto vero (licenza SIL OFL 1.1, file in assets/fonts con la licenza), senza
   schiacciamenti: v67.js dà a ogni parola la misura che riempie la larghezza del riquadro. */
@font-face{
  font-family:'Barlow Condensed v67'; font-style:normal; font-weight:800; font-display:swap;
  src:url("../fonts/barlow-condensed-800-latin.woff2") format("woff2");
}
@media (max-width:760px){
  html body #vedi-prima#vedi-prima .copy-solution .highlight,
  html body #vedi-prima#vedi-prima .copy-solution .highlight .mobile-sim-word{
    font-family:'Barlow Condensed v67', 'Arial Narrow', sans-serif !important; font-weight:800 !important;
    letter-spacing:.01em !important; line-height:.98 !important; transform:none !important;
  }
}

/* 8h. «Chi c'è dietro» su telefono: i ritratti si sfogliano con il dito e con i pallini (v67.js, 6) */
@media (max-width:920px){
  #chi-sono .v66-chi-foto{ touch-action:pan-y; cursor:grab; }
  #chi-sono .v66-chi-punti i{ position:relative; cursor:pointer; }
  #chi-sono .v66-chi-punti i::after{ content:""; position:absolute; inset:-12px -6px; } /* area di tocco più grande */
}

/* la × della finestra Contattaci era bianca al 55% sul fondo chiaro della finestra (anche su computer): ora scura */
#contattiPopup#contattiPopup .close-popup{ color:#0b1530 !important; background:rgba(11,21,48,.07) !important; }

/* 8c. Fasce fotografiche: sui dispositivi a tocco (telefono, tablet) foto e claim restano fermi. Lo spostamento legato allo
   scorrimento (v66.js, disattivato al tocco dalla build) le faceva «assestare» a ogni passaggio. L'accensione del claim resta. */
@media (hover:none) and (pointer:coarse){
  .ib-sep-media{ top:0 !important; height:100% !important; transform:none !important; }
}

/* ==========================================================================
   9. COMPUTER — logo al neon che lampeggia nella hero, sopra la frase d'apertura (titolare, 2026-10-24). Stesse immagini
      e stessa accensione del logo della barra in alto (animazioni ibLogoOnRegular / ibLogoOffRegular della v63).
   ========================================================================== */
.v67-hero-logo{ display:none; }
@media (min-width:781px){
  .hero .v67-hero-logo{ display:block; position:relative; width:min(400px, 32vw); aspect-ratio:800 / 128; margin:0 0 26px; }
  .hero .v67-hero-logo img{ position:absolute; inset:0; width:100%; height:100%; display:block; }
  .hero .v67-hero-logo .v67-hero-logo-acceso{
    animation:ibLogoOnRegular 2.8s infinite steps(1, end); filter:drop-shadow(0 0 16px rgba(255,255,255,.22));
  }
  .hero .v67-hero-logo .v67-hero-logo-spento{ opacity:0; animation:ibLogoOffRegular 2.8s infinite steps(1, end); }
}

@media (prefers-reduced-motion: reduce){
  body .v67-voce.v67-attesa{ opacity:1; transform:none; transition:none; }
  .hero .v67-hero-logo .v67-hero-logo-acceso{ animation:none; opacity:1; }
  .hero .v67-hero-logo .v67-hero-logo-spento{ animation:none; opacity:0; }
}