/* INSEGNE BRESCIA - LANDING v66 - livello «insegna che si accende»
   Caricato DOPO v65.css. Non modifica i file precedenti: per tornare alla v65 basta togliere
   questo file, v66.js, gsap e i blocchi marcati «v66» nell'HTML.
   Regole di stile rispettate: Montserrat, maiuscole bold senza spaziatura, palette blu/viola/arancio,
   niente foto sotto i blocchi di testo (solo nelle fasce con i claim). */

:root{
  --v66-navy:#05070f;
  --v66-ink:#0b1030;
  --v66-white:#fff;
  --v66-orange:#ff8a00;
  --v66-orange-2:#ffb14a;
  --v66-blue:#2f6bff;
  --v66-violet:#7d2cff;
  --v66-ease:cubic-bezier(.16,1,.3,1);
}

/* =========================================================
   1. NIENTE PIÙ FOTO SOTTO I TESTI (richiesta del titolare)
   Le sezioni scure tornano al loro fondo; le foto vanno nelle fasce.
   ========================================================= */
.ib-parallax{ display:none!important; }

/* Lo scorrimento morbido via CSS falsa le misure delle animazioni legate allo scorrimento
   (sui telefoni le posizioni risultavano sbagliate): lo spengo e i link interni scorrono morbidi via v66.js. */
html.v66-motion, html.v66-motion body{ scroll-behavior:auto!important; }

/* =========================================================
   2. FASCE FOTOGRAFICHE CON CLAIM CUBITALI
   Foto a tutta larghezza in parallasse, claim che «si accende» lettera per lettera
   come un'insegna luminosa.
   ========================================================= */
.ib-sep{
  position:relative; overflow:hidden; isolation:isolate;
  min-height:clamp(440px, 82vh, 860px);
  display:flex; align-items:center;
  background:var(--v66-navy); color:#fff;
  margin:0; padding:clamp(70px, 10vh, 120px) 0;
}
.ib-sep-media{
  position:absolute; left:0; right:0; top:-14%; height:128%; z-index:-2; margin:0;
  will-change:transform;
}
.ib-sep-media img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.04); filter:saturate(1.06) contrast(1.04);
}
/* velo: scuro dove sta il claim, più leggero dall'altra parte; bordi che sfumano nel nero */
.ib-sep::before{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    linear-gradient(90deg, rgba(5,7,15,.86) 0%, rgba(5,7,15,.62) 46%, rgba(5,7,15,.28) 100%),
    linear-gradient(180deg, rgba(5,7,15,.75) 0%, rgba(5,7,15,0) 22%, rgba(5,7,15,0) 74%, rgba(5,7,15,.82) 100%);
}
.ib-sep--right::before{
  background:
    linear-gradient(270deg, rgba(5,7,15,.86) 0%, rgba(5,7,15,.62) 46%, rgba(5,7,15,.28) 100%),
    linear-gradient(180deg, rgba(5,7,15,.75) 0%, rgba(5,7,15,0) 22%, rgba(5,7,15,0) 74%, rgba(5,7,15,.82) 100%);
}
.ib-sep-in{ width:100%; max-width:1160px; margin:0 auto; padding:0 24px; box-sizing:border-box; position:relative; }
.ib-sep--right .ib-sep-in{ text-align:right; }

.ib-sep-claim{
  margin:0; font-family:Montserrat, system-ui, sans-serif;
  font-size:clamp(50px, 8.4vw, 150px); line-height:.94; letter-spacing:0;
  color:#fff; font-weight:300; text-wrap:balance;
  will-change:transform;
}
.ib-sep-claim b{ font-weight:800; white-space:nowrap; } /* le lettere separate non devono andare a capo a metà parola */
.ib-sep-claim .ib-sep-t{ font-weight:300; color:rgba(255,255,255,.9); }
.ib-sep-claim .ib-acc{ color:var(--v66-orange); }

.v66-sr{ position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* lettere «spente»: solo il profilo, come le lettere scatolate prima dell'accensione */
.ib-ch{ display:inline-block; }
html.v66-motion .ib-sep-claim b .ib-ch{
  color:transparent;
  -webkit-text-stroke:1.5px rgba(255,255,255,.42);
  text-shadow:none;
}
html.v66-motion .ib-sep-claim b.ib-acc .ib-ch{ -webkit-text-stroke-color:rgba(255,160,60,.5); }
html.v66-motion .ib-sep-claim .ib-sep-t{ opacity:0; transform:translate3d(0,.18em,0); transition:opacity 1s var(--v66-ease) .5s, transform 1.2s var(--v66-ease) .5s; }
html.v66-motion .ib-sep.is-on .ib-sep-claim .ib-sep-t{ opacity:1; transform:none; }

/* accensione: sfarfallio breve e poi luce piena, con un ritardo diverso per ogni lettera */
html.v66-motion .ib-sep.is-on .ib-sep-claim b .ib-ch{
  animation:v66-accendi 1.1s steps(1, end) var(--d, 0s) both;
}
html.v66-motion .ib-sep.is-on .ib-sep-claim b.ib-acc .ib-ch{
  animation-name:v66-accendi-acc;
}
@keyframes v66-accendi{
  0%  { color:transparent; -webkit-text-stroke-color:rgba(255,255,255,.42); text-shadow:none; }
  12% { color:#fff; -webkit-text-stroke-color:transparent; text-shadow:0 0 18px rgba(255,255,255,.7); }
  18% { color:transparent; -webkit-text-stroke-color:rgba(255,255,255,.42); text-shadow:none; }
  30% { color:#fff; -webkit-text-stroke-color:transparent; text-shadow:0 0 18px rgba(255,255,255,.7); }
  36% { color:rgba(255,255,255,.35); -webkit-text-stroke-color:rgba(255,255,255,.42); text-shadow:none; }
  48%, 100% { color:#fff; -webkit-text-stroke-color:transparent;
              text-shadow:0 0 14px rgba(255,255,255,.55), 0 0 42px rgba(120,160,255,.35), 0 4px 30px rgba(0,0,0,.45); }
}
@keyframes v66-accendi-acc{
  0%  { color:transparent; -webkit-text-stroke-color:rgba(255,160,60,.5); text-shadow:none; }
  12% { color:var(--v66-orange); -webkit-text-stroke-color:transparent; text-shadow:0 0 20px rgba(255,138,0,.8); }
  18% { color:transparent; -webkit-text-stroke-color:rgba(255,160,60,.5); text-shadow:none; }
  30% { color:var(--v66-orange); -webkit-text-stroke-color:transparent; text-shadow:0 0 20px rgba(255,138,0,.8); }
  36% { color:rgba(255,138,0,.35); -webkit-text-stroke-color:rgba(255,160,60,.5); text-shadow:none; }
  48%, 100% { color:var(--v66-orange); -webkit-text-stroke-color:transparent;
              text-shadow:0 0 16px rgba(255,138,0,.65), 0 0 54px rgba(255,90,0,.38), 0 4px 30px rgba(0,0,0,.45); }
}
/* dopo l'accensione resta lo stato finale (fill-mode both) */

@media (max-width:760px){
  .ib-sep{ min-height:clamp(360px, 60vh, 540px); padding:64px 0; }
  .ib-sep-in{ padding:0 18px; }
  .ib-sep-claim{ font-size:clamp(36px, 11.2vw, 72px); }
  .ib-sep::before, .ib-sep--right::before{
    background:linear-gradient(180deg, rgba(5,7,15,.8) 0%, rgba(5,7,15,.5) 30%, rgba(5,7,15,.5) 70%, rgba(5,7,15,.86) 100%);
  }
  html.v66-motion .ib-sep-claim b .ib-ch{ -webkit-text-stroke-width:1px; }
}

/* =========================================================
   3. STRISCIA DEI LAVORI (due file di foto che scorrono in versi opposti)
   ========================================================= */
.ib-strip{
  position:relative; overflow:hidden; background:var(--v66-navy);
  padding:clamp(56px, 8vh, 96px) 0; display:block; text-decoration:none;
}
.ib-strip::before, .ib-strip::after{ /* sfumatura ai lati */
  content:""; position:absolute; top:0; bottom:0; width:min(14vw, 180px); z-index:2; pointer-events:none;
}
.ib-strip::before{ left:0; background:linear-gradient(90deg, var(--v66-navy), rgba(5,7,15,0)); }
.ib-strip::after{ right:0; background:linear-gradient(270deg, var(--v66-navy), rgba(5,7,15,0)); }
.ib-strip-rows{ max-width:none!important; transform:rotate(-3deg) scale(1.06); display:flex; flex-direction:column; gap:clamp(12px, 1.4vw, 20px); }
.ib-strip-row{ display:flex; gap:clamp(12px, 1.4vw, 20px); width:max-content; max-width:none!important; /* una regola ereditata mette max-width:100% a tutto su telefono */ will-change:transform; }
.ib-strip-row img{
  width:clamp(220px, 24vw, 380px); aspect-ratio:4/3; height:auto; object-fit:cover; display:block;
  border-radius:16px; box-shadow:0 18px 40px rgba(0,0,0,.45);
  filter:saturate(1.05);
}
@media (max-width:760px){
  .ib-strip-row img{ width:200px; border-radius:12px; }
}

/* =========================================================
   4. HERO — profondità allo scorrimento e comparsa d'apertura
   ========================================================= */
.hero > .ib-hero-media{ will-change:transform; transform-origin:50% 40%; }
html.v66-motion .hero .v66-accesa .ib-ch{ animation:v66-accendi-hero 1.3s steps(1, end) var(--d, 0s) both; }
@keyframes v66-accendi-hero{
  0%  { color:rgba(255,255,255,.14); text-shadow:none; }
  10% { color:#fff; text-shadow:0 0 18px rgba(255,255,255,.75); }
  16% { color:rgba(255,255,255,.14); text-shadow:none; }
  28% { color:#fff; text-shadow:0 0 18px rgba(255,255,255,.75); }
  34% { color:rgba(255,255,255,.3); text-shadow:none; }
  46%, 100% { color:#fff; text-shadow:0 0 22px rgba(255,255,255,.3), 0 1px 2px rgba(0,0,0,.6), 0 4px 22px rgba(0,0,0,.62); }
}
html.v66-motion .hero > .container{ will-change:transform, opacity; }

/* =========================================================
   5. RIQUADRI SCURI — luce che segue il puntatore (solo mouse)
   ========================================================= */
.v66-spot{ position:relative; }
.v66-glow{
  position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:0;
  opacity:0; transition:opacity .35s ease;
  background:radial-gradient(520px circle at var(--mx, 50%) var(--my, 50%), rgba(110,140,255,.14), rgba(125,44,255,.06) 35%, transparent 60%);
}
.v66-glow::after{ /* filo luminoso sul bordo */
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px;
  background:radial-gradient(360px circle at var(--mx, 50%) var(--my, 50%), rgba(255,170,80,.75), rgba(47,107,255,.45) 40%, transparent 70%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}
.v66-spot:hover > .v66-glow{ opacity:1; }
.v66-spot > *:not(.v66-glow){ position:relative; z-index:1; }

/* =========================================================
   6. IL PROCESSO «CHIAVI in MANO» — le fasi si accendono mentre scorri
   ========================================================= */
.proc-u-rows{ position:relative; }
/* Correzione di un difetto ereditato (v63-v65): sui telefoni larghi 380-760 px una regola !important
   rendeva le fasi degli ovali, con il testo bianco che usciva sul fondo chiaro. */
@media (max-width:760px){
  html body #procUnified .proc-u-rows .proc-u-row,
  html body #procUnified .proc-u-rows .proc-u-row.is-extra{ border-radius:20px!important; }
}
/* Collegamento tra le fasi: un segmento per ogni vuoto tra due icone (mai sopra le icone).
   Traccia tratteggiata appena visibile; il riempimento passa dal colore di un'icona a quello della successiva
   e una piccola luce corre in testa mentre si scorre. Solo da 921 px in su (su telefono le fasi sono schede). */
.v66-proc-seg{ position:absolute; width:2px; z-index:4; pointer-events:none; }
.v66-proc-seg::before{ /* traccia */
  content:""; position:absolute; inset:0; border-radius:2px;
  background:repeating-linear-gradient(180deg, rgba(255,255,255,.2) 0 3px, transparent 3px 8px);
}
.v66-proc-seg i{ /* riempimento */
  position:absolute; left:0; top:0; width:100%; height:100%; border-radius:2px;
  background:linear-gradient(180deg, var(--da), var(--a));
  transform-origin:top; transform:scaleY(0);
  box-shadow:0 0 10px color-mix(in srgb, var(--a) 70%, transparent);
}
.v66-proc-seg b{ /* luce in testa */
  position:absolute; left:50%; top:0; width:8px; height:8px; margin:-4px 0 0 -4px; border-radius:50%;
  background:#fff; opacity:0;
  box-shadow:0 0 0 3px color-mix(in srgb, var(--a) 45%, transparent), 0 0 16px 4px var(--a);
}
@media (max-width:920px){ .v66-proc-seg{ display:none; } }
.proc-u-row .proc-icon{ transition:box-shadow .6s var(--v66-ease), transform .6s var(--v66-ease), filter .6s; }
html.v66-motion .proc-u-row:not(.v66-lit) .proc-icon{ filter:saturate(.3) brightness(.75); }
.proc-u-row.v66-lit .proc-icon{ transform:scale(1.06); box-shadow:0 0 0 1px rgba(255,255,255,.22), 0 0 28px var(--v66-glow, rgba(255,138,0,.35)); }

/* =========================================================
   6b. «Le 3 COSE»: niente iconcine; i numeri 01 02 03 diventano grandi e si accendono
   come le lettere delle fasce (richiesta del titolare: le icone non funzionano)
   ========================================================= */
#criteri-scelta#criteri-scelta .ib-criterion-icon{ display:none!important; }
#criteri-scelta#criteri-scelta .ib-criterion-top{ margin-bottom:10px!important; }
#criteri-scelta#criteri-scelta .ib-criterion-num{
  font-family:Montserrat, system-ui, sans-serif!important; font-weight:800!important; letter-spacing:0!important;
  font-size:clamp(64px, 6.4vw, 92px)!important; line-height:.9!important;
  color:var(--v66-orange)!important; -webkit-text-stroke:0; opacity:1!important;
  text-shadow:0 0 16px rgba(255,138,0,.55), 0 0 46px rgba(255,90,0,.3)!important;
}
html.v66-motion #criteri-scelta#criteri-scelta .ib-criterion-num .ib-ch{
  color:transparent; -webkit-text-stroke:1.5px rgba(255,160,60,.5); text-shadow:none;
}
html.v66-motion #criteri-scelta#criteri-scelta .ib-criterion.is-on .ib-criterion-num .ib-ch{
  animation:v66-accendi-acc 1.1s steps(1, end) var(--d, 0s) both;
}

/* =========================================================
   6c. TRIPLA GARANZIA — sigillo grande e simboli descrittivi (SVG nell'HTML)
   ========================================================= */
.v66-sigillo{
  width:clamp(150px, 15vw, 210px); margin:6px auto clamp(10px, 1.6vw, 22px); position:relative;
  transform:rotate(-8deg); filter:drop-shadow(0 18px 30px rgba(11,16,48,.35)) drop-shadow(0 0 22px rgba(255,138,0,.25));
}
.v66-sigillo svg{ display:block; width:100%; height:auto; overflow:visible; }
.v66-sigillo::after{ /* onda del timbro */
  content:""; position:absolute; left:50%; top:40%; width:100%; aspect-ratio:1; border-radius:50%;
  border:3px solid rgba(255,138,0,.7); transform:translate(-50%,-50%) scale(.6); opacity:0; pointer-events:none;
}
html.v66-motion .v66-sigillo{ opacity:0; }
html.v66-motion .v66-sigillo.is-on{ animation:v66-timbro .75s cubic-bezier(.2,1.6,.4,1) both; }
html.v66-motion .v66-sigillo.is-on::after{ animation:v66-onda .9s .28s ease-out both; }
@keyframes v66-timbro{ 0%{ opacity:0; transform:scale(2.1) rotate(-26deg); } 55%{ opacity:1; transform:scale(.94) rotate(-6deg); } 100%{ opacity:1; transform:scale(1) rotate(-8deg); } }
@keyframes v66-onda{ 0%{ opacity:.9; transform:translate(-50%,-50%) scale(.7); } 100%{ opacity:0; transform:translate(-50%,-50%) scale(1.5); } }

#garanzia .card-inner{ position:relative; }
/* simboli minimali a linea (2026-10-22, su richiesta del titolare): tratto bianco sottile, un solo accento arancio.
   Intestazione della scheda: simbolo grande a sinistra; a destra, dopo un filo verticale, «GARANZIA» e sotto il numero
   grande che si accende come i numeri delle «3 COSE». Niente bordi laterali: una regola ereditata li toglie a tutto in #garanzia. */
#garanzia .v66-gar-head{
  display:grid; grid-template-columns:auto auto; align-items:center; justify-content:center;
  column-gap:clamp(18px, 1.8vw, 26px); margin:4px 0 22px; position:relative;
}
#garanzia .v66-gar-head .card-top{
  position:relative; display:flex!important; flex-direction:column; align-items:flex-start; justify-content:center; gap:6px;
  margin:0!important; padding:4px 0 4px clamp(18px, 1.8vw, 26px)!important; text-align:left!important;
  font-size:clamp(12px, .95vw, 14px)!important; font-weight:800!important; letter-spacing:.04em!important; line-height:1!important;
  color:rgba(255,255,255,.58)!important; text-transform:uppercase;
}
#garanzia .v66-gar-head .card-top::before{ /* filo verticale */
  content:""; position:absolute; left:0; top:2px; bottom:2px; width:1px;
  background:linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.28) 30%, rgba(255,138,0,.5) 75%, rgba(255,255,255,0));
}
#garanzia#garanzia .v66-gar-head .card-top .badge{
  display:block; width:auto; height:auto; margin:0; padding:0; border-radius:0; background:none; box-shadow:none;
  font-size:clamp(56px, 4.8vw, 72px); font-weight:800; line-height:.84; letter-spacing:0;
  color:var(--v66-orange); -webkit-text-fill-color:var(--v66-orange);
  text-shadow:0 0 16px rgba(255,138,0,.55), 0 0 46px rgba(255,90,0,.3);
}
html.v66-motion #garanzia#garanzia .v66-gar-head .card-top .badge{ -webkit-text-fill-color:transparent; -webkit-text-stroke:1.5px rgba(255,160,60,.5); text-shadow:none; }
html.v66-motion #garanzia#garanzia .v66-gar-head .card-top.is-on .badge{ animation:v66-accendi-num 1.1s steps(1, end) var(--d, 0s) both; }
@keyframes v66-accendi-num{
  0%  { -webkit-text-fill-color:transparent; -webkit-text-stroke-color:rgba(255,160,60,.5); text-shadow:none; }
  12% { -webkit-text-fill-color:#ff8a00; -webkit-text-stroke-color:transparent; text-shadow:0 0 20px rgba(255,138,0,.8); }
  18% { -webkit-text-fill-color:transparent; -webkit-text-stroke-color:rgba(255,160,60,.5); text-shadow:none; }
  30% { -webkit-text-fill-color:#ff8a00; -webkit-text-stroke-color:transparent; text-shadow:0 0 20px rgba(255,138,0,.8); }
  36% { -webkit-text-fill-color:rgba(255,138,0,.35); -webkit-text-stroke-color:rgba(255,160,60,.5); text-shadow:none; }
  48%, 100% { -webkit-text-fill-color:#ff8a00; -webkit-text-stroke-color:transparent; text-shadow:0 0 16px rgba(255,138,0,.55), 0 0 46px rgba(255,90,0,.3); }
}
.v66-gar-ico{
  display:flex; align-items:center; justify-content:center; margin:0; flex:none;
  width:clamp(100px, 8.6vw, 124px); aspect-ratio:1; border-radius:50%; color:#fff;
  background:radial-gradient(circle at 50% 28%, rgba(255,255,255,.1), rgba(255,255,255,0) 68%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18), inset 0 0 0 7px rgba(255,255,255,.025), 0 0 0 0 rgba(255,138,0,0);
  transition:box-shadow .5s var(--v66-ease), transform .5s var(--v66-ease);
}
.v66-gar-ico svg{ width:54%; height:auto; display:block; overflow:visible; }
.v66-gar-ico svg [stroke="currentColor"]{ stroke-width:2.2; }
#garanzia .card:hover .v66-gar-ico{ box-shadow:inset 0 0 0 1px rgba(255,138,0,.6), inset 0 0 0 7px rgba(255,255,255,.025), 0 0 30px rgba(255,138,0,.24); transform:translateY(-3px); }
html.v66-motion .v66-gar-ico{ opacity:0; transform:translateY(10px); }
html.v66-motion .v66-gar-ico.is-on{ opacity:1; transform:none; transition:opacity .6s ease var(--d,0s), transform .7s var(--v66-ease) var(--d,0s), box-shadow .5s; }
html.v66-motion #garanzia .card:hover .v66-gar-ico.is-on{ transform:translateY(-3px); transition-delay:0s; }
/* il tratto si disegna all'arrivo */
html.v66-motion .v66-gar-ico .t{ stroke-dasharray:var(--l, 120); stroke-dashoffset:var(--l, 120); }
html.v66-motion .v66-gar-ico.is-on .t{ stroke-dashoffset:0; transition:stroke-dashoffset 1.1s var(--v66-ease) calc(var(--d,0s) + .15s); }
html.v66-motion .v66-gar-ico.is-on .t.a{ transition-delay:calc(var(--d,0s) + .75s); }
.v66-gar-mini{ display:inline-block; width:30px; height:30px; vertical-align:middle; margin:-6px 12px 0 0; color:#fff; }
.v66-gar-mini svg{ width:100%; height:100%; display:block; overflow:visible; }
@media (max-width:760px){ .v66-gar-mini{ width:24px; height:24px; margin-right:8px; } }

/* =========================================================
   7. TITOLI — comparsa «a tendina» (gestita da v66.js)
   ========================================================= */
html.v66-motion .v66-wipe{ clip-path:inset(0 0 100% 0); }

/* =========================================================
   8. VETRINA — foto con profondità dentro il riquadro
   ========================================================= */
html.v66-motion .ib-tile img{
  transform:translate3d(0, var(--py, 0%), 0) scale(var(--ps, 1.1));
}
html.v66-motion .ib-tile:hover img, html.v66-motion .ib-tile:focus-visible img{ --ps:1.16; }
/* niente nome né tipologia: solo la foto; al passaggio un velo leggero e il segno «apri» */
.ib-vetrina--v66 .ib-tile::after{
  background:rgba(5,7,15,.0); opacity:1;
  transition:background-color .35s var(--v66-ease);
}
.ib-vetrina--v66 .ib-tile:hover::after, .ib-vetrina--v66 .ib-tile:focus-visible::after{ background:rgba(5,7,15,.28); }
.ib-vetrina--v66 .ib-tile::before{
  content:""; position:absolute; z-index:2; right:14px; bottom:14px; width:44px; height:44px; border-radius:50%;
  background:rgba(255,138,0,.95) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/20px no-repeat;
  box-shadow:0 8px 24px rgba(255,138,0,.45);
  opacity:0; transform:scale(.6) rotate(-90deg);
  transition:opacity .3s var(--v66-ease), transform .45s var(--v66-ease);
}
.ib-vetrina--v66 .ib-tile:hover::before, .ib-vetrina--v66 .ib-tile:focus-visible::before{ opacity:1; transform:none; }
@media (hover:none){ .ib-vetrina--v66 .ib-tile::before{ opacity:.92; transform:none; width:34px; height:34px; right:10px; bottom:10px; background-size:16px; } }

/* =========================================================
   9. PULSANTI — attrazione magnetica leggera (solo mouse)
   ========================================================= */
.v66-mag{ will-change:transform; }

/* =========================================================
   9b. STACCO tra «Sei nel posto giusto» e «La checklist»: una sola fila di foto, più bassa
   ========================================================= */
/* dal 2026-10-23 due file, come la striscia prima della vetrina (la fila singola non convinceva il titolare); foto un po' più piccole */
.ib-strip--stacco{ padding:clamp(44px, 6vh, 72px) 0; }
.ib-strip--stacco .ib-strip-row img{ width:clamp(200px, 20vw, 320px); }
@media (max-width:760px){ .ib-strip--stacco .ib-strip-row img{ width:170px; } }

/* =========================================================
   9c. «I NOSTRI TORMENTONI» — fascia separatrice: foto in parallasse e le tre parole che entrano una alla volta e si
   accendono. Dal 2026-10-23 sta prima delle Domande frequenti (scambiata con «SOLO INSEGNE. SOLO BRESCIA.», richiesta
   del titolare) e contiene il blocco originale del processo: scritta e parole per i lettori di schermo, nota visibile.
   ========================================================= */
.v66-torm-originale{
  position:absolute!important; width:1px!important; height:1px!important; overflow:hidden!important;
  clip:rect(0 0 0 0)!important; white-space:nowrap!important; margin:0!important; padding:0!important; border:0!important;
}
.ib-sep.v66-torm-sep{ min-height:clamp(480px, 86vh, 880px); }
.v66-torm-sep .ib-sep-in{ text-align:center; display:flex; flex-direction:column; align-items:center; }
.v66-torm-sep.v66-torm-sep .sol-trio-note{
  position:relative; z-index:1; max-width:920px; margin:clamp(24px, 2.6vw, 38px) auto 0!important; padding:0!important;
  color:rgba(255,255,255,.8)!important; font-size:clamp(15px, 1.15vw, 17px)!important; font-weight:400!important;
  line-height:1.6!important; letter-spacing:0!important; text-align:center!important; text-shadow:0 2px 14px rgba(0,0,0,.7);
}
.v66-torm-sep.v66-torm-sep .sol-trio-note strong{ color:#fff!important; font-weight:700!important; }
/* la fascia «SOLO INSEGNE. SOLO BRESCIA.» dentro il processo (dove prima stavano i tormentoni): esce dal contenitore a tutta larghezza */
.band:has(.v66-sep-inline){ overflow-x:clip; }
.sol-trio-wrap.v66-has-sep{ overflow:visible!important; } /* su telefono il contenitore tagliava la fascia ai bordi */
.ib-sep.v66-sep-inline{ width:100vw; max-width:none!important; align-self:center; flex:none; margin:clamp(18px, 2.4vw, 30px) 0 clamp(14px, 2vw, 24px); }
/* una riga per tormentone, più aria tra le righe; la seconda sottile e azzurra per staccarla dalle altre (titolare, 2026-10-23) */
.v66-torm-sep .ib-sep-claim{ font-size:clamp(40px, 6vw, 104px); line-height:1.26; }
.v66-torm-sep .v66-riga{ display:inline-block; white-space:nowrap; }
.v66-torm-sep .v66-riga--2 b{ font-weight:300; color:#9fd0ff; text-shadow:0 0 16px rgba(110,175,255,.6), 0 0 48px rgba(47,107,255,.4); }
html.v66-motion .v66-torm-sep .v66-riga--2 b .ib-ch{ -webkit-text-stroke:1px rgba(150,200,255,.5); }
@keyframes v66-accendi-blu{
  0%  { color:transparent; -webkit-text-stroke-color:rgba(150,200,255,.5); text-shadow:none; }
  12% { color:#9fd0ff; -webkit-text-stroke-color:transparent; text-shadow:0 0 18px rgba(130,190,255,.85); }
  18% { color:transparent; -webkit-text-stroke-color:rgba(150,200,255,.5); text-shadow:none; }
  30% { color:#9fd0ff; -webkit-text-stroke-color:transparent; text-shadow:0 0 18px rgba(130,190,255,.85); }
  36% { color:rgba(159,208,255,.35); -webkit-text-stroke-color:rgba(150,200,255,.5); text-shadow:none; }
  48%, 100% { color:#9fd0ff; -webkit-text-stroke-color:transparent;
              text-shadow:0 0 16px rgba(110,175,255,.6), 0 0 48px rgba(47,107,255,.4), 0 4px 30px rgba(0,0,0,.45); }
}
.v66-torm-sep .v66-riga-in{ display:inline-block; will-change:transform; }
/* la scritta «I nostri tormentoni» entra per prima (era il riquadro arancio sopra la fascia; l'originale è in .v66-torm-originale) */
.v66-torm-label{ display:block; margin:0 0 clamp(16px, 1.8vw, 26px); }
.v66-torm-label .v66-riga-in{
  padding:10px 22px; border-radius:999px; background:var(--v66-orange); color:#fff;
  font:800 clamp(13px, 1.05vw, 16px)/1 Montserrat, system-ui, sans-serif; letter-spacing:.04em; text-transform:uppercase;
  box-shadow:0 10px 30px rgba(255,138,0,.45), 0 0 0 6px rgba(255,138,0,.12);
}
/* le parole si accendono per riga, appena la riga è entrata (non tutte insieme) */
html.v66-motion .ib-sep.v66-torm-sep.is-on .ib-sep-claim b .ib-ch{ animation:none; }
html.v66-motion .v66-torm-sep .v66-riga.is-on b .ib-ch{ animation:v66-accendi 1.1s steps(1, end) calc(var(--d, 0s) * .45) both!important; }
html.v66-motion .v66-torm-sep .v66-riga.is-on b.ib-acc .ib-ch{ animation-name:v66-accendi-acc!important; }
html.v66-motion .v66-torm-sep .v66-riga--2.is-on b .ib-ch{ animation-name:v66-accendi-blu!important; }
@media (max-width:760px){ .v66-torm-sep .ib-sep-claim{ font-size:clamp(34px, 10.4vw, 64px); } }

/* =========================================================
   9d. RUOLI — elenco a sinistra, scheda scura a destra (al posto del pannello viola)
   Selettori con #ruoli#ruoli: le regole ereditate usano #ruoli .persona-buttons .pbtn con !important.
   ========================================================= */
@media (min-width:921px){
  #ruoli#ruoli .persona-wrap{ display:grid!important; grid-template-columns:minmax(320px, 412px) minmax(0, 1fr)!important; column-gap:34px!important; row-gap:0!important; align-items:stretch; }
  #ruoli#ruoli .ruoli-cta-head{ grid-column:1 / -1; }
  #ruoli#ruoli .persona-arrows, #ruoli#ruoli #personaArrows{ display:none!important; }
  /* la colonna dei pulsanti è alta quanto la scheda (v66.js): i pulsanti si distribuiscono sull'altezza (titolare, 2026-10-23) */
  #ruoli#ruoli .persona-buttons{ grid-column:1; overflow:visible!important; display:flex!important; flex-direction:column; justify-content:space-between!important; gap:10px!important; height:var(--v66-h, auto)!important; counter-reset:ruolo; margin:0!important; }
  #ruoli#ruoli .persona-panel{ grid-column:2; }
}
#ruoli#ruoli .pbtn{
  position:relative; counter-increment:ruolo;
  display:grid!important; grid-template-columns:40px minmax(0,1fr)!important; grid-template-rows:auto auto!important; column-gap:10px!important; row-gap:3px!important;
  align-items:center!important; align-content:center!important; justify-items:start!important; justify-content:stretch!important; text-align:left!important;
  width:100%!important; min-height:0!important; height:auto!important; max-height:none!important; margin:0!important; overflow:visible!important;
  padding:14px 18px 14px 12px!important; border-radius:16px!important;
  background:#fff!important; background-image:none!important; color:#0b1020!important;
  border:1px solid rgba(11,16,32,.08)!important; box-shadow:0 6px 18px rgba(11,16,32,.06)!important;
  transition:transform .35s var(--v66-ease), box-shadow .35s var(--v66-ease), background-color .35s, border-color .35s!important;
}
#ruoli#ruoli .pbtn::before, #ruoli#ruoli .pbtn::after{ all:unset; }
#ruoli#ruoli .pbtn::before{
  content:counter(ruolo, decimal-leading-zero); grid-row:1 / 3; grid-column:1; justify-self:center;
  font:800 19px/1 Montserrat, system-ui, sans-serif; color:rgba(11,16,32,.22); transition:color .35s;
}
#ruoli#ruoli .pbtn .role-stack{ grid-column:2; justify-self:start!important; padding:0!important; width:auto!important; position:static!important; display:block!important; font-size:13.5px!important; line-height:1.3!important; font-weight:700!important; color:inherit!important; text-align:left!important; }
#ruoli#ruoli .pbtn .role-part{ display:inline!important; border:0!important; padding:0!important; margin:0!important; }
#ruoli#ruoli .pbtn .role-divider{ display:inline-block!important; width:4px!important; height:4px!important; border-radius:50%; background:var(--v66-orange)!important; margin:0 6px 2px 0!important; vertical-align:middle; border:0!important; }
#ruoli#ruoli .pbtn .pbtn-desc{ grid-column:2; justify-self:start!important; padding:0!important; width:auto!important; max-width:none!important; position:static!important; display:block!important; font-size:12.5px!important; font-weight:500!important; line-height:1.35!important; color:#5b6478!important; text-align:left!important; margin:0!important; }
#ruoli#ruoli .pbtn .pbtn-desc br{ display:none; }
#ruoli#ruoli .pbtn:hover:not(.active){ transform:translateX(5px); border-color:rgba(31,70,255,.28)!important; box-shadow:0 10px 26px rgba(11,16,32,.1)!important; }
#ruoli#ruoli .pbtn.active{
  background:linear-gradient(135deg, #131c3a 0%, #0b1024 100%)!important; color:#fff!important; border-color:transparent!important;
  box-shadow:inset 3px 0 0 var(--v66-orange), 0 18px 40px rgba(11,16,32,.28)!important;
}
#ruoli#ruoli .pbtn.active::before{ color:var(--v66-orange); }
#ruoli#ruoli .pbtn.active .pbtn-desc{ color:rgba(255,255,255,.7)!important; }
@media (min-width:921px){ /* freccetta verso la scheda, come nella galleria */
  #ruoli#ruoli .pbtn.active::after{
    content:""!important; position:absolute!important; right:-24px!important; left:auto!important; top:50%!important; bottom:auto!important;
    margin:-9px 0 0!important; width:0!important; height:0!important; background:none!important; opacity:1!important; transform:none!important; animation:none!important;
    border-style:solid!important; border-width:9px 0 9px 12px!important; border-color:transparent transparent transparent var(--v66-orange)!important;
    filter:drop-shadow(0 2px 6px rgba(255,138,0,.45))!important; box-shadow:none!important; -webkit-mask:none!important; mask:none!important;
  }
}
/* Scheda di destra: alta sempre quanto la colonna dei pulsanti (--v66-h, calcolata da v66.js); se un profilo ha più
   testo, i caratteri scalano con --fit. Gerarchia: ruolo = etichetta arancio; prima frase = bianca, peso medio;
   elenco e frase finale ancorati alla base della scheda (richieste del titolare, 2026-10-23). */
#ruoli#ruoli .persona-panel{
  position:relative; overflow:hidden; isolation:isolate;
  display:flex!important; flex-direction:column!important; justify-content:flex-start!important;
  height:var(--v66-h, auto)!important; min-height:0!important; max-height:none!important; width:auto!important; max-width:none!important; margin:0!important;
  padding:calc(34px * var(--fit, 1)) clamp(30px, 3vw, 44px) calc(30px * var(--fit, 1))!important; border-radius:24px!important;
  background:radial-gradient(circle at 12% 0%, rgba(31,70,255,.24), transparent 42%), radial-gradient(circle at 100% 100%, rgba(255,138,0,.14), transparent 42%), linear-gradient(180deg, #10172f 0%, #0b1024 100%)!important;
  border:1px solid rgba(255,255,255,.1)!important; box-shadow:0 30px 80px rgba(11,16,32,.3)!important; color:#fff!important;
}
#ruoli#ruoli .persona-panel::before, #ruoli#ruoli .persona-panel::after{ display:none!important; }
#ruoli#ruoli .v66-ruolo-n{
  position:absolute; right:22px; top:4px; z-index:-1; pointer-events:none;
  font:800 clamp(110px, 12vw, 170px)/1 Montserrat, system-ui, sans-serif; color:transparent;
  -webkit-text-stroke:1.5px rgba(255,255,255,.09);
}
#ruoli#ruoli #personaTitle{
  flex:none; color:var(--v66-orange)!important; font-size:calc(15px * var(--fit, 1))!important; font-weight:800!important;
  line-height:1.35!important; letter-spacing:.03em!important; margin:0 0 calc(14px * var(--fit, 1))!important; padding-right:120px;
}
#ruoli#ruoli #personaTitle .role-part{ color:var(--v66-orange)!important; -webkit-text-fill-color:var(--v66-orange)!important; background:none!important; }
#ruoli#ruoli #personaTitle .role-divider{ display:inline-block!important; width:5px!important; height:5px!important; border-radius:50%; background:rgba(255,255,255,.55)!important; margin:0 8px 2px 0!important; vertical-align:middle; border:0!important; }
#ruoli#ruoli #personaLead{
  flex:none; color:#fff!important; font-size:calc(21px * var(--fit, 1))!important; font-weight:600!important;
  line-height:1.36!important; margin:0 0 calc(14px * var(--fit, 1))!important; padding-right:90px;
}
#ruoli#ruoli #personaBody{ flex:none; color:rgba(255,255,255,.74)!important; font-size:calc(15px * var(--fit, 1))!important; line-height:1.55!important; font-weight:400!important; margin:0!important; }
#ruoli#ruoli .persona-footer{
  flex:none; margin-top:auto!important; padding-top:calc(18px * var(--fit, 1))!important;
  border:0!important; border-top:1px solid rgba(255,255,255,.12)!important;
}
#ruoli#ruoli .persona-footer > *{ border:0!important; }
#ruoli#ruoli #personaChips{ display:flex!important; flex-direction:row!important; flex-wrap:wrap!important; align-items:center!important; gap:8px!important; margin:0 0 calc(14px * var(--fit, 1))!important; padding:0!important; }
#ruoli#ruoli #personaChips .chip{
  display:inline-flex!important; align-items:center; gap:7px; color:#fff!important; background:rgba(255,255,255,.06)!important;
  border:1px solid rgba(255,255,255,.12)!important; border-radius:999px!important; padding:7px 13px 7px 10px!important;
  font-size:12.5px!important; font-weight:700!important; box-shadow:none!important;
}
#ruoli#ruoli #personaChips .chip svg{ width:15px; height:15px; color:var(--v66-orange)!important; stroke:var(--v66-orange)!important; }
#ruoli#ruoli #personaMicro{ color:#fff!important; font-size:calc(15.5px * var(--fit, 1))!important; font-weight:700!important; line-height:1.45!important; margin:0!important; padding:0!important; }
#ruoli#ruoli .persona-dots{ display:none!important; }
html.v66-motion #ruoli#ruoli .persona-panel.v66-swap > :not(.v66-ruolo-n):not(.v66-glow){ animation:v66-scheda .5s var(--v66-ease) both; }
html.v66-motion #ruoli#ruoli .persona-panel.v66-swap > :nth-child(3){ animation-delay:.05s; }
html.v66-motion #ruoli#ruoli .persona-panel.v66-swap > :nth-child(4){ animation-delay:.1s; }
html.v66-motion #ruoli#ruoli .persona-panel.v66-swap > :nth-child(5){ animation-delay:.15s; }
html.v66-motion #ruoli#ruoli .persona-panel.v66-swap .v66-ruolo-n{ animation:v66-numero .7s var(--v66-ease) both; }
@keyframes v66-scheda{ from{ opacity:0; transform:translate3d(0,10px,0); } to{ opacity:1; transform:none; } }
@keyframes v66-numero{ from{ opacity:0; transform:translate3d(20px,0,0); } to{ opacity:1; transform:none; } }

/* Ruoli su tablet e telefono: lo stesso linguaggio nella fisarmonica */
#ruoli#ruoli .mobile-role-accordion details{
  background:#fff!important; border:1px solid rgba(11,16,32,.08)!important; border-radius:16px!important;
  box-shadow:0 6px 18px rgba(11,16,32,.06)!important; margin:0 0 10px!important; overflow:hidden;
}
#ruoli#ruoli .mobile-role-accordion summary{
  list-style:none; cursor:pointer; position:relative; padding:16px 48px 16px 18px!important;
  font-weight:800!important; font-size:15px!important; color:#0b1020!important; background:transparent!important;
}
#ruoli#ruoli .mobile-role-accordion summary::-webkit-details-marker{ display:none; }
#ruoli#ruoli .mobile-role-accordion summary::after{
  content:""; position:absolute; right:16px; top:50%; width:22px; height:22px; margin-top:-11px; border-radius:50%;
  background:var(--v66-orange) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center/14px no-repeat;
  transition:transform .3s var(--v66-ease); border:0!important;
}
#ruoli#ruoli .mobile-role-accordion details[open] summary{ background:linear-gradient(135deg, #131c3a, #0b1024)!important; color:#fff!important; }
#ruoli#ruoli .mobile-role-accordion details[open] summary::after{ transform:rotate(180deg); }
#ruoli#ruoli .mobile-role-accordion .mobile-role-body{ padding:16px 18px 18px!important; background:#0b1024!important; color:rgba(255,255,255,.8)!important; }
#ruoli#ruoli .mobile-role-accordion .role-lead{ color:#fff!important; font-weight:700!important; }
#ruoli#ruoli .mobile-role-accordion .mobile-role-chips span{ background:rgba(255,255,255,.07)!important; color:#fff!important; border:1px solid rgba(255,255,255,.14)!important; }

/* =========================================================
   9e. RIFINITURE GENERALI (revisione del 2026-10-23)
   ========================================================= */
/* barra in alto: blu notte trasparente invece del grigio che «sporcava» le sezioni chiare */
html body .topbar{
  background:rgba(7,10,25,.84)!important; -webkit-backdrop-filter:saturate(1.5) blur(14px)!important; backdrop-filter:saturate(1.5) blur(14px)!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important; box-shadow:0 10px 30px rgba(5,7,15,.16)!important;
}
/* «Ecco come nasce INSEGNE BRESCIA»: iconcine nello stile minimale ad anello (le iconcine in riquadri colorati sono state bocciate),
   sul lato sinistro della scheda; titolo e testo centrati, con margini uguali ai due lati (titolare, 2026-10-23) */
#chi-sono#chi-sono .chi-value{ position:relative!important; padding:24px clamp(78px, 7vw, 96px) 22px!important; }
#chi-sono#chi-sono .chi-value .chi-value-content,
#chi-sono#chi-sono .chi-value .chi-value-title{ position:static!important; }
#chi-sono#chi-sono .chi-value .chi-value-title{ display:block!important; text-align:center!important; }
#chi-sono#chi-sono .chi-value .chi-value-text{ text-align:center!important; }
#chi-sono#chi-sono .chi-value .chi-value-icon{
  position:absolute!important; left:clamp(18px, 1.7vw, 26px)!important; top:50%!important; right:auto!important; bottom:auto!important;
  transform:translateY(-50%)!important; margin:0!important; flex:none!important;
  display:flex!important; align-items:center!important; justify-content:center!important;
  width:54px!important; height:54px!important; min-width:54px!important;
  background:none!important; background-image:none!important; border-radius:50%!important; color:#fff!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.24), inset 0 0 0 6px rgba(255,255,255,.02)!important; transition:box-shadow .4s var(--v66-ease)!important;
}
#chi-sono#chi-sono .chi-value-icon svg{ stroke:#fff!important; fill:none!important; width:24px!important; height:24px!important; position:static!important; }
#chi-sono#chi-sono .chi-value:hover .chi-value-icon{ box-shadow:inset 0 0 0 1px rgba(255,138,0,.7), 0 0 18px rgba(255,138,0,.25)!important; }
#chi-sono#chi-sono .chi-value:hover .chi-value-icon svg{ stroke:var(--v66-orange)!important; }
/* «RESPONSABILITÀ UNICA»: pallini arancio al posto dei quadratini viola (regola di stile: bullet = pallini arancio) */
html body .sol-proof ul li{ position:relative; }
html body .sol-proof ul li::before{
  content:""!important; position:absolute!important; left:8px!important; top:.62em!important; margin:0!important;
  width:8px!important; height:8px!important; border-radius:50%!important; background:var(--v66-orange)!important; background-image:none!important;
  box-shadow:0 0 10px rgba(255,138,0,.6)!important; transform:none!important;
}

/* =========================================================
   9f. QUARTA TORNATA (2026-10-23): hero, GALLERIA cubitale, «Non lavoriamo per tutti», riquadro della simulazione
   ========================================================= */
/* Hero: ombra più marcata su tutti i testi, per staccarli dalle insegne del video; BRESCIA azzurro chiaro.
   BRESCIA è testo a gradiente: l'ombra di testo finiva sopra il gradiente e lo scuriva, quindi niente text-shadow ma drop-shadow. */
html body .hero h1, html body .hero .hero-pre, html body .hero p, html body .hero li{
  text-shadow:0 1px 2px rgba(0,0,0,.6), 0 4px 22px rgba(0,0,0,.62)!important;
}
/* BRESCIA: lo stesso gradiente blu→viola della v63, un tono più chiaro, con un alone blu e un'ombra scura esterna
   (drop-shadow, non text-shadow) per staccarlo dal video. L'azzurro chiaro della prima prova era eccessivo (titolare, 2026-10-23). */
html body .hero .accent{
  background-image:linear-gradient(135deg, #3d7bff 0%, #5a63ff 50%, #8a4dff 100%)!important;
  background-size:100% 100%!important; background-position:0 0!important; animation:none!important;
  -webkit-background-clip:text!important; background-clip:text!important; -webkit-text-fill-color:transparent!important; color:transparent!important;
  text-shadow:none!important;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.6)) drop-shadow(0 0 12px rgba(80,110,255,.6)) drop-shadow(0 4px 18px rgba(0,0,0,.5));
}

/* «Sfoglia la GALLERIA completa»: GALLERIA a caratteri cubitali; all'arrivo una luce la attraversa come un'insegna */
@property --v66-luce{ syntax:'<percentage>'; inherits:false; initial-value:160%; }
#galleria#galleria .gallery-cta-title .line2{
  display:block!important; font-size:clamp(84px, 10.6vw, 164px)!important; line-height:.92!important; letter-spacing:-.01em!important;
  margin:4px 0 6px!important; font-weight:800!important;
  background-image:linear-gradient(110deg, rgba(255,255,255,0) 42%, rgba(255,255,255,.9) 50%, rgba(255,255,255,0) 58%), linear-gradient(90deg, #1f46ff, #7d2cff)!important;
  background-size:260% 100%, 100% 100%!important; background-repeat:no-repeat!important;
  background-position:var(--v66-luce) 0, 0 0!important;
  -webkit-background-clip:text!important; background-clip:text!important; -webkit-text-fill-color:transparent!important; color:transparent!important;
  filter:drop-shadow(0 0 30px rgba(80,70,255,.35)); animation:none!important;
}
html.v66-motion #galleria#galleria .gallery-cta-title.is-on .line2{ animation:v66-luce-galleria 2.4s .3s cubic-bezier(.45,0,.2,1) both!important; }
@keyframes v66-luce-galleria{ from{ --v66-luce:160%; } to{ --v66-luce:-60%; } }

/* il titolone GALLERIA è anche un collegamento alla galleria */
#galleria#galleria .gallery-cta-title a.v66-gal-link{ cursor:pointer; text-decoration:none!important; transition:filter .35s ease; }
#galleria#galleria .gallery-cta-title a.v66-gal-link:hover, #galleria#galleria .gallery-cta-title a.v66-gal-link:focus-visible{ filter:drop-shadow(0 0 40px rgba(110,90,255,.75)) brightness(1.18); outline:none; }

/* «Non lavoriamo per tutti»: «Non fa per te» attenuata, «Fa per te» in evidenza; × e ✓ a linea (niente verde né rosso),
   disegnate mentre le voci compaiono una alla volta */
#non-per-tutti#non-per-tutti .npt-grid{ gap:clamp(18px, 2vw, 30px)!important; align-items:stretch!important; }
#non-per-tutti#non-per-tutti .npt-col{ border-radius:22px!important; border:0!important; }
#non-per-tutti#non-per-tutti .npt-col-no{
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015))!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08), 0 18px 50px rgba(0,0,0,.35)!important;
}
#non-per-tutti#non-per-tutti .npt-col-no::before{ background:linear-gradient(90deg, rgba(255,255,255,.22), rgba(255,255,255,.04))!important; }
#non-per-tutti#non-per-tutti .npt-col-no .npt-col-bar{ background:linear-gradient(90deg, rgba(255,255,255,.3), rgba(255,255,255,.06))!important; box-shadow:none!important; }
#non-per-tutti#non-per-tutti .npt-col-si{
  background:radial-gradient(circle at 15% 0%, rgba(31,70,255,.3), transparent 52%), radial-gradient(circle at 100% 100%, rgba(255,138,0,.16), transparent 52%), linear-gradient(160deg, #19244d, #121a3a 55%, #1d1640)!important;
  box-shadow:inset 0 0 0 1px rgba(125,140,255,.35), 0 26px 70px rgba(18,26,70,.55)!important;
  transition:box-shadow .9s var(--v66-ease), transform .45s var(--v66-ease)!important;
}
#non-per-tutti#non-per-tutti .npt-col-si::before{ background:linear-gradient(90deg, var(--v66-blue), var(--v66-violet) 55%, var(--v66-orange))!important; }
#non-per-tutti#non-per-tutti .npt-col-si.v66-vince{
  box-shadow:inset 0 0 0 1px rgba(170,160,255,.6), 0 30px 80px rgba(18,26,70,.6), 0 0 70px rgba(125,44,255,.24), 0 0 26px rgba(255,138,0,.12)!important;
}
#non-per-tutti#non-per-tutti .npt-col-header{
  display:flex!important; align-items:center!important; justify-content:center!important; gap:12px!important;
  font-size:clamp(17px, 1.4vw, 20px)!important; letter-spacing:.04em!important; font-weight:800!important;
}
#non-per-tutti#non-per-tutti .npt-col-no .npt-col-header{ color:rgba(255,255,255,.58)!important; }
#non-per-tutti#non-per-tutti .npt-col-si .npt-col-header{ color:#fff!important; }
#non-per-tutti#non-per-tutti .npt-col-badge{
  display:inline-flex!important; width:34px!important; height:34px!important; min-width:34px!important; padding:0!important; margin:0!important;
  background:none!important; box-shadow:none!important; border:0!important; font-size:0!important; line-height:0!important;
}
#non-per-tutti#non-per-tutti .npt-col-no .npt-col-badge{ color:rgba(255,255,255,.5)!important; }
#non-per-tutti#non-per-tutti .npt-col-si .npt-col-badge{ color:var(--v66-orange)!important; filter:drop-shadow(0 0 8px rgba(255,138,0,.5)); }
#non-per-tutti#non-per-tutti .npt-list li{ align-items:flex-start!important; }
#non-per-tutti#non-per-tutti .npt-list-icon{
  display:inline-flex!important; width:24px!important; height:24px!important; min-width:24px!important; padding:0!important; margin-top:1px!important;
  background:none!important; box-shadow:none!important; border:0!important; border-radius:0!important; font-size:0!important; line-height:0!important;
}
#non-per-tutti#non-per-tutti .npt-col-no .npt-list-icon{ color:rgba(255,255,255,.42)!important; }
#non-per-tutti#non-per-tutti .npt-col-si .npt-list-icon{ color:var(--v66-orange)!important; }
#non-per-tutti#non-per-tutti .npt-list-icon svg, #non-per-tutti#non-per-tutti .npt-col-badge svg{ width:100%!important; height:100%!important; display:block!important; overflow:visible; }
#non-per-tutti#non-per-tutti .npt-col-no .npt-list li{ color:rgba(255,255,255,.6)!important; }
#non-per-tutti#non-per-tutti .npt-col-no .npt-list li strong{ color:rgba(255,255,255,.82)!important; }
#non-per-tutti#non-per-tutti .npt-col-si .npt-list li{ color:rgba(255,255,255,.9)!important; }
html.v66-motion #non-per-tutti#non-per-tutti .npt-list li{ opacity:0; transform:translate3d(-14px,0,0); }
html.v66-motion #non-per-tutti#non-per-tutti .npt-col-si .npt-list li{ transform:translate3d(14px,0,0); }
html.v66-motion #non-per-tutti#non-per-tutti .npt-list li.is-on{ opacity:1; transform:none; transition:opacity .55s var(--v66-ease), transform .7s var(--v66-ease); }
html.v66-motion #non-per-tutti .v66-segno .t{ stroke-dasharray:var(--l, 60); stroke-dashoffset:var(--l, 60); }
html.v66-motion #non-per-tutti .is-on .v66-segno .t, html.v66-motion #non-per-tutti .npt-col.is-on > .npt-col-header .v66-segno .t{ stroke-dashoffset:0; transition:stroke-dashoffset .8s var(--v66-ease) .1s; }
html.v66-motion #non-per-tutti .is-on .v66-segno .t.a, html.v66-motion #non-per-tutti .npt-col.is-on > .npt-col-header .v66-segno .t.a{ transition-delay:.45s; }

/* Riquadro SIMULAZIONE FOTOREALISTICA: un «mirino» (quattro angoli che si stringono all'arrivo), una linea che scansiona
   il riquadro come un render, griglia tenue di fondo; il titolo più grande si accende come le fasce */
#vedi-prima#vedi-prima .copy-solution{
  position:relative!important; overflow:hidden!important; border:0!important; border-radius:20px!important;
  padding:clamp(34px, 3.2vw, 48px) clamp(34px, 3.6vw, 56px) clamp(36px, 3.2vw, 48px)!important;
  background:
    radial-gradient(circle at 0% 0%, rgba(255,138,0,.17), transparent 38%),
    radial-gradient(circle at 100% 100%, rgba(31,70,255,.2), transparent 46%),
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px) 0 0 / 30px 30px,
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px) 0 0 / 30px 30px,
    linear-gradient(180deg, #131b37, #0b1024)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08), 0 30px 80px rgba(0,0,0,.4)!important;
}
#vedi-prima#vedi-prima .copy-solution > p{ position:relative; z-index:3; }
#vedi-prima#vedi-prima .copy-solution > .v66-mirino{ /* selettore forte: una regola ereditata rende «relative» i figli del riquadro */
  position:absolute!important; display:block!important; inset:14px; z-index:2!important; pointer-events:none; margin:0!important; padding:0!important; --c:var(--v66-orange); --L:36px; --w:2px;
  background:
    linear-gradient(var(--c), var(--c)) top left / var(--L) var(--w) no-repeat,
    linear-gradient(var(--c), var(--c)) top left / var(--w) var(--L) no-repeat,
    linear-gradient(var(--c), var(--c)) top right / var(--L) var(--w) no-repeat,
    linear-gradient(var(--c), var(--c)) top right / var(--w) var(--L) no-repeat,
    linear-gradient(var(--c), var(--c)) bottom left / var(--L) var(--w) no-repeat,
    linear-gradient(var(--c), var(--c)) bottom left / var(--w) var(--L) no-repeat,
    linear-gradient(var(--c), var(--c)) bottom right / var(--L) var(--w) no-repeat,
    linear-gradient(var(--c), var(--c)) bottom right / var(--w) var(--L) no-repeat;
  filter:drop-shadow(0 0 6px rgba(255,138,0,.65));
}
html.v66-motion #vedi-prima#vedi-prima .copy-solution > .v66-mirino{ inset:-26px; opacity:0; }
html.v66-motion #vedi-prima#vedi-prima .v66-sim.is-on > .v66-mirino{ inset:14px; opacity:1; transition:inset 1s cubic-bezier(.2,1.25,.4,1), opacity .45s ease; }
#vedi-prima#vedi-prima .copy-solution > .v66-scan{
  position:absolute!important; display:block!important; left:0; right:0; top:0; height:2px; z-index:2!important; pointer-events:none; opacity:0; margin:0!important; padding:0!important;
  background:linear-gradient(90deg, rgba(255,170,80,0), rgba(255,170,80,.9) 50%, rgba(255,170,80,0)); box-shadow:0 0 18px rgba(255,138,0,.6);
}
html.v66-motion #vedi-prima#vedi-prima .v66-sim.is-on > .v66-scan{ animation:v66-scansione 1.7s .55s ease-in-out both; }
@keyframes v66-scansione{ 0%{ top:0; opacity:0; } 12%{ opacity:1; } 88%{ opacity:1; } 100%{ top:100%; opacity:0; } }
#vedi-prima#vedi-prima .copy-solution .highlight{
  display:block!important; width:auto!important; white-space:normal!important; margin:8px 0 16px!important;
  font-size:clamp(42px, 4.6vw, 68px)!important; line-height:1!important; font-weight:800!important; letter-spacing:0!important;
  color:var(--v66-orange)!important; -webkit-text-fill-color:currentColor!important; background:none!important;
  text-shadow:0 0 16px rgba(255,138,0,.5), 0 0 46px rgba(255,90,0,.28)!important;
}
#vedi-prima .copy-solution .highlight .v66-parola{ display:inline-block; white-space:nowrap; }
html.v66-motion #vedi-prima .copy-solution .highlight .ib-ch{ color:transparent; -webkit-text-stroke:1.5px rgba(255,160,60,.5); text-shadow:none; }
html.v66-motion #vedi-prima .v66-sim.is-on .highlight .ib-ch{ animation:v66-accendi-acc 1.1s steps(1, end) var(--d, 0s) both; }

/* =========================================================
   9g. CHI C'È DIETRO INSEGNE BRESCIA — ritratti del titolare (generati con AI dal suo LoRA su Astria, 2026-10-23):
   racconto a sinistra con righe più corte, ritratto fisso a destra che cambia seguendo i capitoli
   ========================================================= */
#chi-sono#chi-sono{ overflow:clip!important; } /* con «hidden» il ritratto non poteva restare fisso durante lo scorrimento */
.v66-chi-grid{
  display:grid; grid-template-columns:minmax(0, 1fr) clamp(320px, 30vw, 430px);
  column-gap:clamp(36px, 4vw, 64px); align-items:start;
}
.v66-chi-testo{ min-width:0; }
/* i quattro distintivi nella colonna più stretta: due righe da due, a pillola */
#chi-sono#chi-sono .v66-chi-testo .chi-micro-badges{
  display:grid!important; grid-template-columns:repeat(2, minmax(0, 1fr))!important; gap:12px!important; width:auto!important; max-width:none!important;
}
#chi-sono#chi-sono .v66-chi-testo .chi-badge{
  width:auto!important; min-width:0!important; max-width:none!important; height:auto!important; min-height:56px!important; margin:0!important;
  padding:12px 18px!important; border-radius:999px!important; justify-content:flex-start!important; text-align:left!important;
}
.v66-chi-foto-col{ align-self:stretch; position:relative; padding-top:6px; }
.v66-chi-foto{
  position:sticky; top:104px; margin:0; aspect-ratio:4 / 5; border-radius:24px; isolation:isolate; overflow:hidden;
  background:#0b1024;
  box-shadow:0 30px 80px rgba(0,0,0,.5), 0 0 70px rgba(31,70,255,.18), 0 0 46px rgba(255,138,0,.12);
}
.v66-chi-foto::after{ /* filo luminoso arancio → viola → blu */
  content:""; position:absolute; inset:0; z-index:3; pointer-events:none; border-radius:inherit; padding:1.5px;
  background:linear-gradient(140deg, rgba(255,138,0,.95), rgba(125,44,255,.55) 46%, rgba(47,107,255,.95));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude;
}
.v66-chi-foto::before{ /* leggera sfumatura in basso, sotto i pallini */
  content:""; position:absolute; left:0; right:0; bottom:0; height:30%; z-index:2; pointer-events:none;
  background:linear-gradient(180deg, rgba(5,7,15,0), rgba(5,7,15,.55));
}
#chi-sono#chi-sono .v66-chi-foto .v66-ritratto{
  position:absolute!important; inset:0; width:100%!important; height:100%!important; max-width:none!important; margin:0!important;
  object-fit:cover; border-radius:0!important; box-shadow:none!important; border:0!important;
  opacity:0; transform:scale(1.06); transition:opacity .9s var(--v66-ease), transform 1.6s var(--v66-ease);
}
#chi-sono#chi-sono .v66-chi-foto .v66-ritratto.is-on{ opacity:1; transform:none; }
.v66-chi-punti{ position:absolute; left:50%; bottom:16px; transform:translateX(-50%); z-index:4; display:flex; gap:8px; }
.v66-chi-punti i{ display:block; width:8px; height:8px; border-radius:4px; background:rgba(255,255,255,.42); transition:width .5s var(--v66-ease), background-color .4s, box-shadow .4s; }
.v66-chi-punti i.is-on{ width:24px; background:var(--v66-orange); box-shadow:0 0 10px rgba(255,138,0,.7); }
@media (max-width:920px){ /* telefono: da rivedere con il titolare; per ora il ritratto va sopra il racconto */
  .v66-chi-grid{ display:flex; flex-direction:column; }
  .v66-chi-foto-col{ order:-1; width:100%; max-width:420px; margin:0 auto 28px; }
  .v66-chi-foto{ position:relative; top:auto; }
}

/* =========================================================
   9h. MODULI DELLA SIMULAZIONE — due richieste in più da spuntare prima dell'invio (titolare, 2026-10-23)
   ========================================================= */
html body .simulazione-form .v66-extra{
  border:0; margin:0 0 16px; padding:0; min-width:0; display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:center;
}
html body .simulazione-form .v66-extra legend{
  width:100%; padding:0; margin:0 0 8px; text-align:center; font-size:14px; font-weight:700; color:inherit; opacity:.75;
}
html body .simulazione-form .v66-extra-op.v66-extra-op{ /* le etichette dei moduli hanno regole ereditate forti: qui tutto !important */
  display:inline-flex!important; align-items:center!important; gap:10px!important; margin:0!important; cursor:pointer;
  padding:10px 18px!important; border-radius:999px!important; border:1.5px solid rgba(31,70,255,.3)!important; background:#fff!important;
  font-size:15px!important; font-weight:500!important; line-height:1.2!important; text-align:left!important; width:auto!important;
  box-shadow:0 4px 12px rgba(11,16,32,.06)!important; transition:border-color .25s, background-color .25s, box-shadow .25s!important;
}
html body .simulazione-form .v66-extra-op input{ width:18px!important; height:18px!important; margin:0!important; accent-color:var(--v66-orange); flex:none; }
html body .simulazione-form .v66-extra-op.v66-extra-op:hover{ border-color:rgba(255,138,0,.6)!important; }
html body .simulazione-form .v66-extra-op.v66-extra-op:has(input:checked){ border-color:var(--v66-orange)!important; background:#fff4e8!important; box-shadow:0 0 0 3px rgba(255,138,0,.18)!important; }

/* =========================================================
   10. MENO MOVIMENTO: tutto acceso e fermo
   ========================================================= */
@media (prefers-reduced-motion: reduce){
  .ib-sep-media{ top:0; height:100%; transform:none!important; }
  .ib-strip-rows{ transform:none; }
  .ib-strip-row{ transform:none!important; flex-wrap:wrap; width:auto; justify-content:center; }
}