/* ============================================================
   visuAle — Studio Tecnico
   Sistema grafico condiviso da tutte le pagine del sito.
   Tipografia geometrica (Space Grotesk + Manrope + IBM Plex Mono),
   nessun corsivo, sezioni tinte in grigio chiaro (mai nero pieno).
============================================================ */
:root{
  --bianco:#ffffff;
  --nero:#171717;
  --grigio:#6f6f6d;
  --grigio-chiaro:#f5f5f3;
  --grigio-sezione:#f7f7f7;
  --linea:#e2e1dc;
  --fucsia:#e6007e;

  --display:"Space Grotesk",sans-serif;
  --sans:"Manrope",sans-serif;
  --mono:"Space Grotesk",sans-serif;

  --easing:cubic-bezier(.19,.85,.28,1);
}

*{ box-sizing:border-box; -webkit-font-smoothing:antialiased; }
html{
  scroll-behavior:smooth;
  overflow-x:hidden;
  overscroll-behavior-x:none;
  width:100%;
}
body{
  font-family:var(--sans);
  color:var(--nero);
  background:var(--bianco);
  line-height:1.7;
  overflow-x:clip;
  width:100%;
  position:relative;
}
::selection{ background:var(--fucsia); color:#fff; }
img{ max-width:100%; }
a{ color:inherit; }

/* ---------- tipografia ---------- */
.titolo-hero{
  font-family:var(--display);
  font-weight:600;
  font-size:clamp(2.6rem, 7vw, 6.2rem);
  line-height:1.04;
  letter-spacing:-.02em;
}
.titolo-sezione{
  font-family:var(--display);
  font-weight:600;
  font-size:clamp(2rem, 4.4vw, 3.6rem);
  line-height:1.08;
  letter-spacing:-.015em;
}
.accento{ color:var(--fucsia); }
.etichetta{
  font-family:var(--mono); font-size:.7rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--grigio);
}
.etichetta.accento{ color:var(--fucsia); }
.testo-grigio{ color:var(--grigio); }
.testo-lungo{ font-size:1.05rem; max-width:32rem; }

/* ---------- reveal a maschera (righe che salgono) ---------- */
.maschera{ display:block; overflow:hidden; }
.maschera > span{
  display:block; transform:translateY(112%);
  transition:transform 1.1s var(--easing);
  transition-delay:var(--d,0s);
}
.is-visible .maschera > span,
.maschera.is-visible > span{ transform:translateY(0); }

/* ---------- reveal semplice ---------- */
[data-reveal]{
  opacity:0; transform:translateY(26px);
  transition:opacity 1s var(--easing), transform 1s var(--easing);
  transition-delay:var(--d,0s);
}
[data-reveal].is-visible{ opacity:1; transform:none; }

/* ---------- immagini: scala in ingresso ---------- */
.foto{ overflow:hidden; background:var(--grigio-chiaro); position:relative; }
.foto img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.14);
  transition:transform 1.6s var(--easing);
}
.is-visible .foto img, .foto.is-visible img{ transform:scale(1); }

/* ---------- navbar ---------- */
.navbar-studio{
  background:rgb(255, 255, 255);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  transition:border-color .4s ease;
  padding-block:1.1rem;
  z-index:1800;
}
.navbar-studio.scrolled{ border-color:var(--linea); }
.brand{
  display:flex; align-items:center; gap:.6rem;
  font-family:var(--display); font-weight:700; font-size:1.3rem; color:var(--nero);
  text-decoration:none; letter-spacing:-.01em;
}
.brand img{ height:40px; width:auto; display:block; }
.voce-nav{
  font-family:var(--mono); font-size:.7rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--nero); text-decoration:none;
}
@media (hover:hover) and (pointer:fine){
  .voce-nav:hover{ color:var(--fucsia); }
}

/* ---- menu mobile (Bootstrap 5 offcanvas, ristilizzato) ---- */
.btn-menu-mobile{
  display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px;
  width:34px; height:34px; background:none; border:none; padding:0; cursor:pointer;
}
.btn-menu-mobile span{ width:20px; height:1.5px; background:var(--nero); display:block; }

/* sopra la navbar fissa (z-index 1800) e il pulsante flottante */
/* il velo scuro è un background-image e non un background-color: Safari iOS
   colora la barra del browser col background-color degli elementi fixed
   a tutto schermo, e con il nero la barra diventerebbe nera */
.offcanvas-backdrop{ z-index:1900; background:transparent linear-gradient(var(--nero),var(--nero)); }
.offcanvas-backdrop.show{ opacity:.45; }
.menu-offcanvas{
  --bs-offcanvas-zindex:1950;
  --bs-offcanvas-width:75vw;
  --bs-offcanvas-bg:var(--bianco);
  --bs-offcanvas-color:var(--nero);
  --bs-offcanvas-border-width:3px;
  --bs-offcanvas-border-color:var(--fucsia);
  --bs-offcanvas-transition:transform .5s var(--easing);
}
.menu-offcanvas .offcanvas-header{
  padding:1.1rem clamp(1rem,4vw,2rem); border-bottom:1px solid var(--linea);
  display:flex; justify-content:space-between; align-items:center;
}
.btn-chiudi-menu{
  position:relative; width:34px; height:34px; background:none; border:none; padding:0; cursor:pointer;
}
.btn-chiudi-menu span{
  position:absolute; left:7px; top:16px; width:20px; height:1.5px; background:var(--nero);
}
.btn-chiudi-menu span:first-child{ transform:rotate(45deg); }
.btn-chiudi-menu span:last-child{ transform:rotate(-45deg); }
.btn-chiudi-menu:focus-visible{ outline:2px solid var(--fucsia); outline-offset:3px; }

.menu-offcanvas .offcanvas-body{
  display:flex; flex-direction:column; gap:2.5rem;
  padding:.5rem clamp(1rem,4vw,2rem) calc(2rem + env(safe-area-inset-bottom, 0px));
}
.menu-offcanvas-voci, .menu-offcanvas-contatti{ list-style:none; margin:0; padding:0; }
.menu-offcanvas-voci > li{ border-bottom:1px solid var(--linea); }
.menu-offcanvas-voci > li > a{
  display:flex; align-items:baseline; gap:1rem;
  padding-block:1rem;
  font-family:var(--display); font-weight:600; font-size:1.55rem; line-height:1.15; letter-spacing:-.01em;
  color:var(--nero); text-decoration:none;
}
/* pagina corrente (aria-current impostato da main.js) */
.menu-offcanvas a[aria-current="page"]{ color:var(--fucsia); }
.menu-offcanvas-voci a:focus-visible, .menu-offcanvas-contatti a:focus-visible{ outline:2px solid var(--fucsia); outline-offset:2px; }

.menu-offcanvas-piede{ margin-top:auto; display:flex; flex-direction:column; gap:1.4rem; }
.menu-offcanvas-contatti{ display:flex; flex-direction:column; gap:.45rem; }
.menu-offcanvas-contatti a{ font-family:var(--display); font-weight:600; font-size:1rem; color:var(--nero); text-decoration:none; overflow-wrap:anywhere; }
.menu-offcanvas-contatti .etichetta{ margin-top:.3rem; }

/* voci che entrano in sequenza all'apertura */
.menu-offcanvas-voci > li, .menu-offcanvas-piede{
  opacity:0; transform:translateX(18px);
  transition:opacity .45s ease, transform .6s var(--easing);
}
.menu-offcanvas.showing .menu-offcanvas-voci > li, .menu-offcanvas.show .menu-offcanvas-voci > li,
.menu-offcanvas.showing .menu-offcanvas-piede, .menu-offcanvas.show .menu-offcanvas-piede{ opacity:1; transform:none; }
.menu-offcanvas.hiding .menu-offcanvas-voci > li, .menu-offcanvas.hiding .menu-offcanvas-piede{ transition-delay:0s !important; }
.menu-offcanvas-voci > li:nth-child(1){ transition-delay:.08s; }
.menu-offcanvas-voci > li:nth-child(2){ transition-delay:.12s; }
.menu-offcanvas-voci > li:nth-child(3){ transition-delay:.16s; }
.menu-offcanvas-voci > li:nth-child(4){ transition-delay:.2s; }
.menu-offcanvas-voci > li:nth-child(5){ transition-delay:.24s; }
.menu-offcanvas-voci > li:nth-child(6){ transition-delay:.28s; }
.menu-offcanvas-piede{ transition-delay:.34s; }
@media (prefers-reduced-motion:reduce){
  .menu-offcanvas{ --bs-offcanvas-transition:none; }
  .menu-offcanvas-voci > li, .menu-offcanvas-piede{ opacity:1; transform:none; transition:none; }
}

/* ---------- hero split (index) ---------- */
.hero{ padding-top:8.5rem; }
.hero-foto{ aspect-ratio:3/4; }
@media (max-width:991px){ .hero-foto{ aspect-ratio:4/3; } }
@media (max-width:767px){ .hero{ padding-top:6.5rem; } }
.didascalia{
  display:flex; justify-content:space-between; gap:1rem;
  border-top:1px solid var(--nero); padding-top:.55rem; margin-top:.55rem;
}

/* ---------- hero pagina interna (foto + overlay) ---------- */
.hero-pagina{
  position:relative; min-height:58vh; display:flex; align-items:flex-end;
  overflow:hidden; color:#fff;
}
.hero-pagina .foto-sfondo{ position:absolute; inset:0; }
.hero-pagina .foto-sfondo img{ width:100%; height:100%; object-fit:cover; display:block; }
.hero-pagina::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(23,23,23,.82) 0%, rgba(23,23,23,.32) 55%, rgba(23,23,23,.08) 100%);
}
.hero-pagina-contenuto{ position:relative; z-index:2; width:100%; padding-block:9rem 3.2rem; }
.hero-pagina .etichetta{ color:rgba(255,255,255,.78); }
.hero-pagina .titolo-sezione, .hero-pagina .titolo-hero{ color:#fff; margin-bottom:0; }
@media (max-width:767px){
  /* altezza in px: con vh la barra del browser mobile fa ridimensionare l'hero durante lo scroll */
  .hero-pagina{ min-height:450px; }
  .hero-pagina-contenuto{ padding-block:6.5rem 2.2rem; }
}

/* ---------- striscia fotografica ---------- */
/* Desktop/pointer fine: animazione legata allo scroll verticale (via JS).
   Mobile/touch: scroll orizzontale nativo con snap — niente calcoli legati a
   window.innerHeight, che su mobile cambia quando la barra indirizzi si
   nasconde/mostra e causava uno sbandamento laterale della striscia. */
.striscia{ overflow:hidden; }
.striscia-track{ display:flex; gap:1.25rem; will-change:transform; width:max-content; padding-inline-start:var(--striscia-pad,clamp(1rem,4vw,2rem)); padding-inline-end:clamp(1rem,4vw,2rem); }
.striscia-track .foto{ width:min(46vw,520px); aspect-ratio:4/3; flex:none; }
.striscia-track .voce{ flex:none; }
.striscia-track .voce .etichetta{ margin-top:.5rem; display:block; }

@media (max-width:767px), (pointer:coarse){
  .striscia{
    overflow-x:auto; overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    scroll-snap-type:x proximity;
    /* senza scroll-padding lo snap "start" della prima foto annulla il
       padding-inline-start del track: il browser scorre da solo fino ad
       azzerarlo appena la pagina carica. */
    scroll-padding-left:var(--striscia-pad,clamp(1rem,4vw,2rem));
  }
  .striscia-track{ transform:none !important; width:max-content; }
  .striscia-track .foto{ width:78vw; scroll-snap-align:start; }
  .striscia::-webkit-scrollbar{ display:none; }
  .striscia{ scrollbar-width:none; }
}

/* ---------- indice progetti (elemento firma) ---------- */
.indice-progetti{ border-top:1px solid var(--nero); }

/* ---- schede progetto (portfolio.html): distinzione tra i singoli interventi ---- */
.scheda-progetto{ border-top:1px solid var(--linea); padding-top:3rem; }
.scheda-progetto + .scheda-progetto{ margin-top:3.5rem; }
.scheda-progetto:first-child{ border-top:1px solid var(--nero); }
.riga-progetto{
  display:grid;
  grid-template-columns:3.2rem 1fr auto auto;
  gap:1.5rem; align-items:baseline;
  padding-block:1.7rem;
  border-bottom:1px solid var(--linea);
  text-decoration:none; color:var(--nero);
  transition:color .3s ease;
  position:relative;
}
.riga-progetto .n{ font-family:var(--mono); font-size:.72rem; color:var(--grigio); letter-spacing:.1em; transition:color .3s ease; }
.riga-progetto .titolo{
  font-family:var(--display); font-weight:600; font-size:clamp(1.4rem,3vw,2.2rem);
  line-height:1.15; letter-spacing:-.01em;
  transition:transform .45s var(--easing);
}
.riga-progetto .luogo{ font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--grigio); }
.riga-progetto .anno{ font-family:var(--mono); font-size:.72rem; color:var(--grigio); }
@media (hover:hover) and (pointer:fine){
  .riga-progetto:hover{ color:var(--fucsia); }
  .riga-progetto:hover .n{ color:var(--fucsia); }
  .riga-progetto:hover .titolo{ transform:translateX(10px); }
}
@media (max-width:575px){
  .riga-progetto{ grid-template-columns:2.4rem 1fr auto; }
  .riga-progetto .luogo{ display:none; }
}

/* anteprima che segue il cursore */
.anteprima{
  position:fixed; z-index:1500; pointer-events:none;
  width:300px; aspect-ratio:4/3; overflow:hidden;
  opacity:0; transform:scale(.94);
  transition:opacity .3s ease, transform .3s ease;
  border:1px solid var(--nero);
  background:var(--grigio-chiaro);
}
.anteprima.attiva{ opacity:1; transform:scale(1); }
.anteprima img{ width:100%; height:100%; object-fit:cover; display:block; }

/* ---------- sezione tinta (grigio chiaro, mai nero pieno) ---------- */
.sezione-tinta{ background:var(--grigio-sezione); color:var(--nero); border-top:1px solid var(--linea); border-bottom:1px solid var(--linea); }
.sezione-tinta .etichetta{ color:var(--grigio); }


/* griglia servizi (home): schede bianche separate da filetti di 1px */
.griglia-servizi{
  display:grid; grid-template-columns:1fr; gap:1px;
  background:var(--linea); border:1px solid var(--linea);
  margin-top:clamp(2rem,4vw,3rem);
}
@media (min-width:768px){ .griglia-servizi{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:992px){ .griglia-servizi{ grid-template-columns:repeat(3,1fr); } }
.servizio-v2{
  position:relative;
  display:flex; flex-direction:column; height:100%;
  text-decoration:none; color:inherit;
  background:var(--bianco);
  padding:clamp(1.6rem,3vw,2.4rem);
  transition:color .3s ease;
}
/* barra fucsia che si allunga in cima alla scheda (solo hover desktop / focus) */
.servizio-v2::before{
  content:''; position:absolute; left:0; right:0; top:0; height:3px;
  background:var(--fucsia); transform:scaleX(0); transform-origin:left;
  transition:transform .5s var(--easing);
}
.servizio-v2:focus-visible::before{ transform:scaleX(1); }
.servizio-testa{
  display:flex; justify-content:space-between; align-items:flex-start;
  margin-bottom:clamp(1.6rem,3vw,2.6rem);
}
.servizio-v2 .num{ font-family:var(--mono); font-size:.72rem; font-weight:500; letter-spacing:.14em; color:var(--grigio); }
.servizio-v2 .icona-servizio-v2,
.altro-servizio .icona-servizio-v2{
  display:block; width:2.7rem; height:2.7rem;
  background-color:var(--fucsia);
  -webkit-mask-image:var(--icona); mask-image:var(--icona);
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  -webkit-mask-size:contain; mask-size:contain;
  -webkit-mask-position:left center; mask-position:left center;
}
.servizio-v2 h3{ font-family:var(--display); font-weight:600; font-size:clamp(1.3rem,2vw,1.5rem); line-height:1.2; letter-spacing:-.01em; margin:0 0 .6rem; transition:color .3s ease; }
.servizio-v2 p{ color:var(--grigio); font-size:.95rem; margin:0 0 1.8rem; }

/* bottone "Scopri di più" dentro le schede servizio (la scheda intera è il link):
   sempre in fondo, così i bottoni restano allineati anche con testi su più righe */
.btn-scopri{ margin-top:auto; align-self:flex-start; padding:.75rem 1.25rem; font-size:.68rem; }
@media (hover:hover) and (pointer:fine){
  a.servizio-v2:hover h3, a.servizio-v2:hover .num{ color:var(--fucsia); }
  a.servizio-v2:hover::before{ transform:scaleX(1); }
  a.servizio-v2:hover .btn-scopri,
  .card-servizio:hover .btn-scopri,
  .altro-servizio:hover .btn-scopri{ background:var(--fucsia); border-color:var(--fucsia); color:#fff; }
}

/* ---------- manifesto ---------- */
.manifesto{
  font-family:var(--display); font-weight:500;
  font-size:clamp(1.7rem, 4vw, 3.1rem);
  line-height:1.28; letter-spacing:-.005em;
}

.foto-studio{ aspect-ratio:4/5; }
@media (max-width:991px){ .foto-studio{ aspect-ratio:4/3; } .foto-studio img{ object-position:center 62%; } }

/* ---------- bottone ---------- */
.btn-v2{
  display:inline-flex; align-items:center; gap:.8rem;
  font-family:var(--mono); font-size:.74rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--nero); border:1px solid var(--nero); background:transparent;
  padding:1rem 1.7rem; text-decoration:none; border-radius:0;
  transition:background .35s ease,color .35s ease,border-color .35s ease;
}
/* variante piena: azione principale di sezione, distinta dai "Scopri di più" a contorno */
.btn-v2-pieno{ background:var(--fucsia); border-color:var(--fucsia); color:#fff; }
@media (hover:hover) and (pointer:fine){
  .btn-v2:hover{ background:var(--fucsia); border-color:var(--fucsia); color:#fff; }
  .btn-v2-pieno:hover{ background:var(--nero); border-color:var(--nero); color:#fff; }
}

/* ---------- footer ---------- */
.footer-v2{ border-top:1px solid var(--linea); padding-top:clamp(4rem,7vw,6rem); }
/* mobile: più respiro sotto la barra legale (e sopra la barra del browser / home indicator) */
@media (max-width:767px){ .footer-v2{ padding-bottom:calc(3rem + env(safe-area-inset-bottom, 0px)) !important; } }
.footer-v2 .footer-logo-link{ display:inline-block; }
.footer-v2 .footer-logo{ height:clamp(2.4rem,5vw,3.2rem); width:auto; display:block; }
.footer-v2 a{ color:var(--nero); text-decoration:none; }
.footer-v2 .footer-heading{ margin-bottom:1rem; display:block; }
.footer-v2 .footer-links{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:.65rem; }
.footer-v2 .footer-links a{ font-family:var(--sans); font-size:.9rem; overflow-wrap:anywhere; }
@media (hover:hover) and (pointer:fine){
  .footer-v2 a:hover{ color:var(--fucsia); }
  .footer-v2 .footer-links a:hover{ text-decoration:underline; }
}
.footer-v2 .footer-bottom-link{ font-family:var(--mono); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; }

/* barra legale in fondo: copyright · link legali · credits (in colonna su mobile) */
.footer-fondo{
  display:flex; flex-direction:column; align-items:flex-start; gap:1rem;
  padding-top:1.6rem; border-top:1px solid var(--linea);
}
.footer-fondo p{ margin:0; }
.footer-fondo-link{ display:flex; flex-wrap:wrap; gap:.5rem 1.8rem; list-style:none; margin:0; padding:0; }
.footer-v2 .footer-credits a{ color:var(--nero); text-decoration:none; border-bottom:1px solid var(--linea); }
@media (min-width:992px){
  .footer-fondo{ flex-direction:row; justify-content:space-between; align-items:center; gap:2rem; }
}
@media (hover:hover) and (pointer:fine){
  .footer-v2 .footer-credits a:hover{ color:var(--fucsia); border-color:var(--fucsia); }
}

.sezione{ padding-block:clamp(4.5rem,9vw,8.5rem); }
/* ritmo verticale unico: tra due sezioni bianche consecutive c'è un solo padding,
   non la somma di quello inferiore e superiore */
.sezione + .sezione{ padding-top:0; }
/* l'ultimo elemento non aggiunge margine: lo spazio in fondo alla sezione è solo il padding */
.sezione > .container-xl > :last-child{ margin-bottom:0 !important; }
.sezione-sm{ padding-block:clamp(3rem,6vw,5rem); }

a:focus-visible,.btn-v2:focus-visible{ outline:2px solid var(--fucsia); outline-offset:3px; }

/* ================================================
   COMPONENTI DI PAGINA (chi-siamo, contatti, servizi,
   progetti, immobili)
================================================ */

/* ---- breadcrumb (pagine singole progetto/immobile) ---- */
.breadcrumb-v2{
  display:flex; flex-wrap:wrap; align-items:center; gap:.5rem;
  font-family:var(--mono); font-size:.7rem; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase; color:var(--grigio);
  margin-bottom:2.2rem;
}
.breadcrumb-v2 a{ color:var(--grigio); text-decoration:none; transition:color .3s ease; }
@media (hover:hover) and (pointer:fine){
  .breadcrumb-v2 a:hover{ color:var(--fucsia); }
}
.breadcrumb-v2 .separatore{ color:var(--linea); }
.breadcrumb-v2 .corrente{ color:var(--nero); }

/* ---- valori (chi-siamo) ---- */
.valore-item{ border-top:1px solid var(--linea); padding-top:1.4rem; height:100%; }
.valore-item h3{ font-family:var(--display); font-weight:600; font-size:1.25rem; margin-bottom:.6rem; color:var(--fucsia); }
.valore-item p{ color:var(--grigio); font-size:.92rem; margin:0; }

/* ---- statistiche ---- */
.statistica{ border-left:1px solid var(--linea); padding-left:1.2rem; }
.statistica .num{ font-family:var(--display); font-weight:700; font-size:clamp(1.8rem,3vw,2.6rem); line-height:1; }
.statistica .num .accento{ font-weight:700; }
.statistica .label{ font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--grigio); margin-top:.4rem; }

/* ---- timeline storia (chi-siamo): verticale su mobile, orizzontale da desktop ---- */
.timeline{ list-style:none; margin:0; padding:0; }
.timeline .tappa{ position:relative; border-left:1px solid var(--linea); padding:0 0 2.4rem 1.8rem; }
.timeline .tappa:last-child{ padding-bottom:0; }
.timeline .tappa::before{ content:""; position:absolute; left:-5px; top:.9rem; width:9px; height:9px; background:var(--fucsia); }
.timeline .anno{ display:block; font-family:var(--display); font-weight:700; font-size:clamp(2rem,4vw,3.2rem); line-height:1; letter-spacing:-.02em; margin-bottom:.9rem; }
.timeline .titolo-evento{ font-family:var(--display); font-weight:600; font-size:1.15rem; line-height:1.3; margin-bottom:.4rem; }
.timeline .dettaglio-evento{ font-family:var(--mono); font-size:.7rem; letter-spacing:.06em; line-height:1.6; color:var(--grigio); text-transform:uppercase; margin:0; }
@media (min-width:992px){
  .timeline{ display:grid; grid-template-columns:repeat(5,1fr); }
  .timeline .tappa{ border-left:0; border-top:1px solid var(--linea); padding:2.2rem 2rem 0 0; }
  .timeline .tappa::before{ left:0; top:-5px; }
}
/* tappa collegata alle foto d'archivio */
.timeline .tappa-archivio .anno{ color:var(--fucsia); }
.timeline .tappa-archivio a{ color:var(--fucsia); text-decoration:none; border-bottom:1px solid currentColor; white-space:nowrap; }

/* ---- foto d'archivio (chi-siamo): 1 grande + 2 affiancate ---- */
.archivio{ display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; scroll-margin-top:7rem; }
.archivio .foto{ margin:0; aspect-ratio:4/3; }
.archivio .foto.grande{ grid-column:1 / -1; aspect-ratio:3/2; }
@media (min-width:768px){
  .archivio{ grid-template-columns:2fr 1fr; }
  .archivio .foto.grande{ grid-column:1; grid-row:span 2; aspect-ratio:auto; }
  /* studio oggi: composizione specchiata rispetto al 1988 */
  .archivio-oggi{ grid-template-columns:1fr 2fr; }
  .archivio-oggi .foto.grande{ grid-column:2; grid-row:1 / span 2; }
}
.archivio-coppia{ grid-template-columns:repeat(2,1fr); margin-top:1rem; }
.studio-oggi-intro{ margin-top:clamp(3rem,7vw,6rem); margin-bottom:2.5rem; padding-top:clamp(2.5rem,5vw,4rem); border-top:1px solid var(--linea); }
.archivio figcaption{
  position:absolute; left:.75rem; bottom:.75rem; z-index:3;
  background:var(--bianco); color:var(--nero); padding:.35rem .6rem;
  font-family:var(--mono); font-size:.64rem; letter-spacing:.12em; text-transform:uppercase;
}

/* ---- team ---- */
.team-card{ border:1px solid var(--linea); height:100%; transition:border-color .3s ease; }
@media (hover:hover) and (pointer:fine){
  .team-card:hover{ border-color:var(--fucsia); }
}
.team-card .team-foto{ aspect-ratio:1/1; margin:0; overflow:hidden; background:var(--grigio-chiaro); }
.team-card .team-foto img{ width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(1); }
.team-card .team-corpo{ padding:1.6rem 2rem 2rem; }
@media (max-width:767px){
  .team-card .team-corpo{ padding:1.2rem; }
}
.team-card .ruolo{ font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--grigio); margin-bottom:.3rem; }
.team-card .nome{ font-family:var(--display); font-weight:600; font-size:1.3rem; margin-bottom:1.2rem; }
.team-card .team-azioni{ display:flex; flex-direction:column; align-items:flex-start; gap:.6rem; }
.team-card .contatto{ font-family:var(--mono); font-size:.78rem; text-decoration:none; color:var(--nero); display:inline-flex; align-items:center; gap:.4rem; border-bottom:1px solid var(--linea); padding-bottom:.2rem; }
@media (hover:hover) and (pointer:fine){
  .team-card .contatto:hover{ color:var(--fucsia); border-color:var(--fucsia); }
}

/* ---- blocco info (contatti) ---- */
.info-blocco{ border-top:1px solid var(--linea); padding-top:1.4rem; height:100%; }
.info-blocco .valore{ font-family:var(--display); font-weight:600; font-size:1.25rem; margin:.5rem 0 .3rem; overflow-wrap:anywhere; }
.info-blocco .sub{ font-size:.88rem; color:var(--grigio); }

/* ---- telefoni (home, sezione contatti) ---- */
.telefoni-home{ border-top:1px solid var(--linea); max-width:32rem; }
.telefono-riga{
  display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:.3rem 1rem;
  padding-block:1rem; border-bottom:1px solid var(--linea);
  text-decoration:none; color:var(--nero); transition:color .3s ease;
}
.telefono-riga .numero-tel{ font-family:var(--display); font-weight:600; font-size:1.5rem; letter-spacing:-.01em; }
@media (hover:hover) and (pointer:fine){
  .telefono-riga:hover{ color:var(--fucsia); }
}

/* ---- foto della sede sotto il team (contatti) ---- */
.foto-sede{ aspect-ratio:16/9; }
.foto-sede img{ object-position:50% 60%; }
@media (max-width:767px){ .foto-sede{ aspect-ratio:4/3; } }

/* ---- mappa (contatti) ---- */
.mappa{ border:1px solid var(--linea); overflow:hidden; background:var(--grigio-chiaro); }
.mappa iframe{ display:block; width:100%; height:420px; border:0; }
@media (max-width:767px){ .mappa iframe{ height:320px; } }
/* accanto al form (desktop): la mappa si allunga fino all'altezza del form */
@media (min-width:992px){
  .colonna-mappa{ display:flex; flex-direction:column; }
  .colonna-mappa .mappa{ flex:1; min-height:420px; }
  .colonna-mappa .mappa iframe{ height:100%; }
}

/* ---- form richiesta informazioni (contatti) ---- */
.form-note{ list-style:none; padding:0; margin:2rem 0 0; border-top:1px solid var(--linea); }
.form-note li{ display:flex; flex-direction:column; gap:.2rem; padding:1rem 0; border-bottom:1px solid var(--linea); font-size:.95rem; }
.form-note a{ text-decoration:none; }
@media (hover:hover) and (pointer:fine){
  .form-note a:hover{ color:var(--fucsia); }
}

.form-contatto{
  display:flex; flex-direction:column; gap:2rem;
  background:var(--bianco); border:1px solid var(--linea);
  padding:clamp(1.5rem,4vw,3rem);
}
.form-contatto .campo-nascosto{ position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }
.campo{ display:flex; flex-direction:column; gap:.55rem; }
.campo label{ font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--grigio); }
.campo .obbligatorio{ color:var(--fucsia); }
.campo input:not([type=checkbox]), .campo textarea, .campo select{
  font-family:var(--sans); font-size:1rem; color:var(--nero);
  border:0; border-bottom:1px solid var(--linea); border-radius:0; background:transparent;
  padding:.6rem 0; width:100%;
  transition:border-color .25s ease;
}
.campo select{
  appearance:none; -webkit-appearance:none; cursor:pointer; padding-right:1.5rem;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%236f6f6d' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right center;
}
.campo input::placeholder, .campo textarea::placeholder{ color:#b5b4b0; }
.campo input:focus, .campo textarea:focus, .campo select:focus{ outline:none; border-bottom-color:var(--fucsia); }
.campo textarea{ resize:vertical; min-height:8rem; }

.campo .consenso{
  display:flex; gap:.8rem; align-items:flex-start; cursor:pointer;
  font-family:var(--sans); font-size:.88rem; letter-spacing:0; text-transform:none; color:var(--grigio); line-height:1.55;
}
.campo .consenso input{ flex:none; width:1.1rem; height:1.1rem; margin-top:.2rem; accent-color:var(--fucsia); cursor:pointer; }
.campo .consenso a{ color:var(--nero); }
@media (hover:hover) and (pointer:fine){
  .campo .consenso a:hover{ color:var(--fucsia); }
}

.campo-errore{ display:none; font-family:var(--mono); font-size:.72rem; letter-spacing:.04em; color:#b3261e; }
.campo.non-valido .campo-errore{ display:block; }
.campo.non-valido input:not([type=checkbox]), .campo.non-valido textarea{ border-bottom-color:#b3261e; }

.form-azioni{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; }
.form-contatto button.btn-v2{ appearance:none; -webkit-appearance:none; background:transparent; cursor:pointer; }
@media (hover:hover) and (pointer:fine){
  .form-contatto button.btn-v2:hover{ background:var(--fucsia); }
}
.form-contatto button.btn-v2:disabled{ opacity:.5; cursor:not-allowed; }

.form-esito{
  margin:0; padding:1rem 1.2rem; border-left:3px solid var(--grigio);
  background:var(--grigio-chiaro); font-size:.92rem;
}
.form-esito.successo{ border-left-color:var(--fucsia); }
.form-esito.errore{ border-left-color:#b3261e; color:#b3261e; }

/* ---- pagina 404 ---- */
.pagina-404{ padding-block:clamp(9rem,16vw,12rem) clamp(4.5rem,9vw,7rem); }
.btn-v2-secondario{ border-color:var(--linea); }
.link-404{ display:flex; flex-direction:column; text-decoration:none; color:var(--nero); transition:border-color .3s ease; }
.link-404 .valore{ transition:color .3s ease; }
@media (hover:hover) and (pointer:fine){
  .link-404:hover{ border-top-color:var(--fucsia); }
  .link-404:hover .valore{ color:var(--fucsia); }
}

/* ---- riquadro evidenza (Tea Energia, ecc.) ---- */
.riquadro{ border:1px solid var(--linea); padding:2.2rem; }
.riquadro .etichetta{ margin-bottom:.8rem; }
.riquadro h3{ font-family:var(--display); font-weight:600; font-size:1.4rem; margin-bottom:.8rem; }
.riquadro p{ color:var(--grigio); margin-bottom:1.2rem; }

/* ---- banner Tea Energia (solo home) ---- */
.banner-tea{ padding-block:clamp(1.8rem,3.4vw,2.6rem); }
.banner-tea-riga{
  display:flex; flex-wrap:wrap; align-items:center;
  justify-content:space-between; gap:1.4rem 2.5rem;
}
.banner-tea-testo{ max-width:52rem; }
.banner-tea-testo .etichetta{ display:block; }
.banner-tea-titolo{
  font-family:var(--display); font-weight:600;
  font-size:clamp(1.35rem,2.4vw,1.9rem); line-height:1.15;
  letter-spacing:-.01em; color:#fff; margin-bottom:.5rem;
}
.banner-tea-dettagli{ color:rgba(255,255,255,.85); font-size:.92rem; line-height:1.55; }
.banner-tea .btn-v2{ flex:none; }

/* ---- card servizi pagina servizi.html ---- */
.card-servizio{
  display:flex; flex-direction:column; height:100%;
  border:1px solid var(--linea); background:var(--bianco);
  text-decoration:none; color:var(--nero); transition:border-color .35s ease;
}
.card-servizio .foto{ aspect-ratio:4/3; }
.card-servizio .corpo{ display:flex; flex-direction:column; flex:1; padding:1.6rem 1.6rem 1.8rem; }
.card-servizio .icona-servizio{
  display:block; width:2.6rem; height:2.6rem; margin-bottom:1.2rem;
  background-color:var(--fucsia);
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  -webkit-mask-size:contain; mask-size:contain;
  -webkit-mask-position:center; mask-position:center;
}
.card-servizio h3{ font-family:var(--display); font-weight:600; font-size:1.4rem; letter-spacing:-.01em; margin-bottom:.6rem; transition:color .3s ease; }
.card-servizio p{ color:var(--grigio); font-size:.94rem; margin-bottom:1.6rem; }
@media (hover:hover) and (pointer:fine){
  .card-servizio:hover{ border-color:var(--fucsia); }
  .card-servizio:hover h3{ color:var(--fucsia); }
  .card-servizio:hover .foto img{ transform:scale(1.05); }
}

/* ---- scheda "Cosa comprende" (sidebar dettaglio servizio): voci numerate ---- */
.riquadro-feature{
  border:1px solid var(--linea); border-top:3px solid var(--fucsia);
  background:var(--bianco);
  padding:clamp(1.6rem,3vw,2.4rem);
}
.riquadro-feature .etichetta{ display:block; margin-bottom:1.1rem; }
.elenco-feature{ list-style:none; padding:0; margin:0; counter-reset:feature; }
.elenco-feature li{
  counter-increment:feature;
  display:grid; grid-template-columns:2.4rem 1fr; align-items:baseline;
  padding:.95rem 0; border-top:1px solid var(--linea);
  font-family:var(--display); font-weight:500; font-size:1.02rem; line-height:1.35;
}
.elenco-feature li:last-child{ padding-bottom:0; }
.elenco-feature li::before{
  content:counter(feature, decimal-leading-zero);
  font-family:var(--mono); font-size:.68rem; font-weight:500; letter-spacing:.12em; color:var(--fucsia);
}

/* ---- altri servizi (rimandi incrociati) ---- */
.altri-servizi{ display:grid; grid-template-columns:1fr; gap:1.5rem 2rem; }
@media (min-width:768px){ .altri-servizi{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:992px){ .altri-servizi{ grid-template-columns:repeat(3,1fr); } }
@media (min-width:1200px){ .altri-servizi{ grid-template-columns:repeat(5,1fr); } }
.altro-servizio{
  display:flex; flex-direction:column; gap:.4rem;
  padding-top:1.5rem; border-top:1px solid var(--linea);
  text-decoration:none; color:var(--nero); transition:color .3s ease;
}
@media (hover:hover) and (pointer:fine){
  .altro-servizio:hover{ color:var(--fucsia); }
}
.altro-servizio .icona-servizio-v2{ width:2.8rem; height:2.8rem; margin-bottom:.8rem; }
.altro-servizio .nome{ font-family:var(--display); font-weight:600; font-size:1.1rem; line-height:1.3; }
.altro-servizio .desc{ color:var(--grigio); font-size:.85rem; margin-bottom:1rem; }

/* ---- meta progetto / immobile (specifiche) ---- */
.meta-griglia{ display:grid; grid-template-columns:repeat(auto-fill,minmax(9rem,1fr)); gap:1.6rem 1rem; padding-block:2rem; border-top:1px solid var(--linea); border-bottom:1px solid var(--linea); margin-block:2rem; }
.meta-griglia .voce .etichetta{ margin-bottom:.35rem; display:block; }
.meta-griglia .voce .val{ font-family:var(--display); font-weight:600; font-size:1.05rem; }

/* ---- scheda meta a fianco della descrizione (pagine progetto) ---- */
.scheda-meta{ border:1px solid var(--linea); padding:2.2rem; }
.meta-griglia.laterale{
  grid-template-columns:1fr; gap:1.5rem;
  border-top:none; border-bottom:none; padding-block:0; margin-block:0;
}

/* ---- galleria immagini ---- */
.galleria-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.galleria-grid .foto{ aspect-ratio:4/3; }
.galleria-grid .foto.largo{ grid-column:1 / -1; aspect-ratio:16/9; }
@media (max-width:575px){ .galleria-grid{ grid-template-columns:1fr; } .galleria-grid .foto.largo{ aspect-ratio:4/3; } }
/* variante ampia: gallerie a piena larghezza (pagine progetto, senza sidebar) */
@media (min-width:992px){ .galleria-grid.ampia{ grid-template-columns:repeat(3,1fr); } }
/* mosaico: 6 foto (1 grande + 5) senza celle vuote a ogni larghezza */
@media (min-width:576px) and (max-width:991px){ .galleria-grid.mosaico .foto:last-child{ grid-column:1 / -1; aspect-ratio:16/9; } }
@media (min-width:992px){ .galleria-grid.mosaico .foto.largo{ grid-column:1 / span 2; grid-row:span 2; aspect-ratio:auto; } }

/* ---- immagini ingrandibili: solo con puntatore preciso (desktop) ---- */
@media (pointer:fine){
  .galleria-grid .foto, .archivio .foto{ cursor:zoom-in; }
  .galleria-grid .foto::after, .archivio .foto::after{
    content:'＋'; position:absolute; inset:0; z-index:2;
    display:flex; align-items:center; justify-content:center;
    font-family:var(--display); font-size:1.6rem; font-weight:600; color:#fff;
    background:rgba(23,23,23,0); opacity:0;
    transition:opacity .3s ease, background .3s ease;
    pointer-events:none;
  }
}
@media (hover:hover) and (pointer:fine){
  .galleria-grid .foto:hover::after, .archivio .foto:hover::after{ opacity:1; background:rgba(23,23,23,.26); }
}

/* ---- lightbox: ingrandimento immagine a schermo intero ---- */
.lightbox{
  position:fixed; inset:0; z-index:2500;
  background:rgba(23,23,23,.94);
  display:flex; align-items:center; justify-content:center;
  padding:6vh 6vw;
  opacity:0; visibility:hidden;
  transition:opacity .3s ease, visibility 0s linear .3s;
}
.lightbox.aperto{ opacity:1; visibility:visible; transition:opacity .3s ease; }
.lightbox img{
  max-width:100%; max-height:100%; width:auto; height:auto;
  object-fit:contain;
  box-shadow:0 24px 64px rgba(0,0,0,.45);
  transform:scale(.96);
  transition:transform .35s var(--easing);
}
.lightbox.aperto img{ transform:scale(1); }
.lightbox-chiudi{
  position:absolute; top:1.5rem; right:1.5rem; z-index:2;
  width:44px; height:44px; border:1px solid rgba(255,255,255,.4); background:none;
  color:#fff; font-family:var(--mono); font-size:1rem; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:border-color .3s ease, color .3s ease;
}
@media (hover:hover) and (pointer:fine){
  .lightbox-chiudi:hover{ border-color:var(--fucsia); color:var(--fucsia); }
}

/* ---- card immobile (elenco) ---- */
.property-card{ display:flex; flex-direction:column; border:1px solid var(--linea); text-decoration:none; color:var(--nero); }
.property-card .foto{ aspect-ratio:4/3; }
.property-card .corpo{ padding:2rem; }
.property-card .tag-stato{ font-family:var(--mono); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--fucsia); margin-bottom:.8rem; display:block; }
.property-card .prezzo{ font-family:var(--display); font-weight:700; font-size:2rem; margin-bottom:.3rem; }
.property-card .titolo{ font-family:var(--display); font-weight:600; font-size:1.4rem; margin-bottom:.8rem; }
.property-card .desc{ color:var(--grigio); font-size:.92rem; margin-bottom:1.4rem; }
.property-card .specs{ display:flex; flex-wrap:wrap; gap:.5rem 1.4rem; padding-top:1.2rem; border-top:1px solid var(--linea); font-family:var(--mono); font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--grigio); }
@media (min-width:768px){ .property-card{ flex-direction:row; } .property-card .foto{ width:46%; } .property-card .corpo{ width:54%; display:flex; flex-direction:column; justify-content:center; } }
/* variante impilata: foto sopra, testo sotto, anche da desktop (es. teaser in home) */
.property-card.impilata{ flex-direction:column; }
.property-card.impilata .foto{ width:100%; aspect-ratio:4/3; }
.property-card.impilata .corpo{ width:100%; display:block; }

/* ---- sidebar prezzo (dettaglio immobile) ---- */
.prezzo-card{ border:1px solid var(--linea); padding:2.2rem; }
.prezzo-card .prezzo{ font-family:var(--display); font-weight:700; font-size:2.4rem; margin:.5rem 0 1.6rem; }
@media (min-width:992px){ .sticky-lg{ position:sticky; top:6.5rem; } }

/* ---- link precedente/successivo (dettaglio progetto/immobile) ---- */
.nav-progetto{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; padding-top:2rem; border-top:1px solid var(--linea); }

/* ---------- riduzione movimento ---------- */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  [data-reveal]{ opacity:1; transform:none; transition:none; }
  .maschera > span{ transform:none; transition:none; }
  .foto img{ transform:none; transition:none; }
  .filo-lettura{ display:none; }
  .anteprima{ display:none; }
}

/* ---------- CTA con foto di sfondo (pagine principali) ---------- */
.cta-foto{ position:relative; overflow:hidden; color:#fff; padding-block:clamp(4.5rem,9vw,8.5rem); }
.cta-foto .foto-sfondo{ position:absolute; inset:0; }
.cta-foto .foto-sfondo img{ width:100%; height:100%; object-fit:cover; display:block; }
.cta-foto::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(23,23,23,.86) 0%, rgba(23,23,23,.6) 45%, rgba(23,23,23,.18) 100%);
}
.cta-foto-contenuto{ position:relative; z-index:2; }
.cta-foto .etichetta{ color:rgba(255,255,255,.78); }
.cta-foto .titolo-sezione{ color:#fff; max-width:38rem; }
.cta-foto .testo-grigio{ color:rgba(255,255,255,.82); max-width:34rem; }
.cta-foto .btn-v2{ border-color:#fff; color:#fff; }
@media (hover:hover) and (pointer:fine){
  .cta-foto .btn-v2:hover{ background:#fff; border-color:#fff; color:var(--fucsia); }
}

/* ============================================================
   SLIDER PROGETTI A SCHEDE (home — progetti selezionati)
   Immagine a tutta scheda, titolo e tipologia sovrapposti;
   al passaggio del mouse la foto di sfondo cambia in dissolvenza.
============================================================ */
.slider-progetti{ position:relative; }
.slider-progetti .swiper{
  overflow:hidden;
  /* spazio per l'ombra/sollevamento della scheda in hover */
  padding-block:.5rem;
  margin-block:-.5rem;
}
.slider-progetti .swiper-slide{ height:auto; }

.card-progetto{
  display:block; position:relative;
  text-decoration:none; color:#fff;
  border:1px solid var(--linea);
  background:var(--grigio-chiaro);
  overflow:hidden;
  transition:border-color .4s ease, transform .55s var(--easing), box-shadow .55s var(--easing);
}
.card-progetto:focus-visible{
  border-color:#00000000;
}
.card-progetto:focus-visible{ outline:2px solid var(--fucsia); outline-offset:4px; }

.card-media{ position:relative; aspect-ratio:4/5; overflow:hidden; }
.card-media img{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover; display:block;
  transition:opacity .7s var(--easing), transform 1.1s var(--easing);
}
.card-media .img-base{ opacity:1; transform:scale(1); }
.card-media .img-hover{ opacity:0; transform:scale(1.08); }
.card-progetto:focus-visible .card-media .img-base{ opacity:0; transform:scale(1.08); }
.card-progetto:focus-visible .card-media .img-hover{ opacity:1; transform:scale(1); }

/* velo scuro: tiene leggibile il testo sovrapposto su qualsiasi foto */
.card-media::after{
  content:''; position:absolute; inset:0; z-index:1;
  background:linear-gradient(to top, rgba(23,23,23,.88) 0%, rgba(23,23,23,.45) 38%, rgba(23,23,23,0) 72%);
  transition:opacity .5s ease;
}

.card-testo{
  position:absolute; z-index:2; left:0; right:0; bottom:0;
  padding:1.6rem 1.5rem 1.4rem;
  transition:transform .55s var(--easing);
}
.card-progetto:focus-visible .card-testo{ transform:translateY(-4px); }

.card-n{
  display:block;
  font-family:var(--mono); font-size:.68rem; font-weight:500;
  letter-spacing:.18em; color:rgba(255,255,255,.7);
  margin-bottom:.55rem;
}
.card-titolo{
  font-family:var(--display); font-weight:600;
  font-size:clamp(1.25rem,1.9vw,1.6rem);
  line-height:1.15; letter-spacing:-.01em;
  margin:0 0 .45rem;
}
.card-tipologia{
  display:block;
  font-family:var(--mono); font-size:.68rem; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.78);
}
/* filetto che si allunga sotto la tipologia in hover */
.card-tipologia::after{
  content:''; display:block; height:1px; margin-top:.8rem;
  background:#fff; width:0;
  transition:width .6s var(--easing);
}
.card-progetto:focus-visible .card-tipologia::after{ width:2.6rem; }

@media (hover:hover) and (pointer:fine){
  .card-progetto:hover{ border-color:#00000000; }
  .card-progetto:hover .card-media .img-base{ opacity:0; transform:scale(1.08); }
  .card-progetto:hover .card-media .img-hover{ opacity:1; transform:scale(1); }
  .card-progetto:hover .card-media::after{ opacity:.92; }
  .card-progetto:hover .card-testo{ transform:translateY(-4px); }
  .card-progetto:hover .card-tipologia::after{ width:2.6rem; }
}

/* ---- barra di controllo: avanzamento + frecce ---- */
.slider-barra{
  display:flex; align-items:center; gap:1.5rem;
  margin-top:1.8rem;
}
.slider-progetti .swiper-pagination{
  position:relative; flex:1; height:1px;
  background:var(--linea);
}
.slider-progetti .swiper-pagination-progressbar-fill{ background:var(--fucsia); }

.slider-frecce{ display:flex; gap:.6rem; flex:0 0 auto; }
.freccia-slider{
  width:3rem; height:3rem;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--nero); border-radius:0;
  background:transparent; color:var(--nero);
  font-size:1rem; line-height:1; cursor:pointer;
  transition:background .35s ease, color .35s ease, border-color .35s ease, opacity .35s ease;
}
.freccia-slider:focus-visible{ outline:2px solid var(--fucsia); outline-offset:3px; }
.freccia-slider.swiper-button-disabled{ opacity:.3; cursor:default; }
@media (hover:hover) and (pointer:fine){
  .freccia-slider:hover{ background:var(--fucsia); border-color:var(--fucsia); color:#fff; }
  .freccia-slider.swiper-button-disabled:hover{ background:transparent; color:var(--nero); border-color:var(--nero); }
}

@media (max-width:575px){
  .card-testo{ padding:1.3rem 1.2rem 1.2rem; }
  .slider-barra{ gap:1rem; }
  .freccia-slider{ width:2.7rem; height:2.7rem; }
}

@media (prefers-reduced-motion:reduce){
  .card-progetto,
  .card-media img,
  .card-testo,
  .card-tipologia::after{ transition:none; }
  .card-progetto:focus-visible{ transform:none; }
}
@media (prefers-reduced-motion:reduce) and (hover:hover) and (pointer:fine){
  .card-progetto:hover{ transform:none; }
  .card-progetto:hover .card-media .img-base{ transform:none; }
  .card-progetto:hover .card-media .img-hover{ transform:none; }
}

/* ---------- pulsante flottante "Contattaci" ---------- */
.fab-contatti{
  position:fixed; z-index:1600;
  right:1.25rem; bottom:calc(1.25rem + env(safe-area-inset-bottom, 0px));
  display:inline-flex; align-items:center; justify-content:center;
  min-width:3.5rem; height:3.5rem;
  background:var(--fucsia); color:#fff; border:1px solid var(--fucsia); border-radius:0;
  font-family:var(--mono); font-size:.74rem; letter-spacing:.16em; text-transform:uppercase;
  text-decoration:none; overflow:hidden;
  box-shadow:0 10px 28px rgba(23,23,23,.2);
  transition:background .35s ease, border-color .35s ease, opacity .35s ease, transform .35s var(--easing);
}
.fab-contatti svg{ flex:none; width:1.4rem; height:1.4rem; }
.fab-contatti .fab-testo{ max-width:0; opacity:0; white-space:nowrap; transition:max-width .4s var(--easing), opacity .3s ease, margin .4s var(--easing); }
.fab-contatti:focus-visible{ background:var(--nero); border-color:var(--nero); color:#fff; outline:2px solid var(--nero); outline-offset:3px; }
@media (hover:hover) and (pointer:fine){
  .fab-contatti:hover{ background:var(--nero); border-color:var(--nero); color:#fff; }
  .fab-contatti:hover .fab-testo,
  .fab-contatti:focus-visible .fab-testo{ max-width:9rem; opacity:1; margin:0 1.3rem 0 .8rem; }
}
/* nascosto quando CTA o footer (con i contatti) sono già in vista */
.fab-contatti.nascosto{ opacity:0; transform:translateY(1rem); pointer-events:none; visibility:hidden; transition:opacity .35s ease, transform .35s var(--easing), visibility 0s linear .35s; }
@media (max-width:575px){
  .fab-contatti{ right:1rem; bottom:calc(1rem + env(safe-area-inset-bottom, 0px)); min-width:3.2rem; height:3.2rem; }
}
@media (prefers-reduced-motion:reduce){
  .fab-contatti, .fab-contatti .fab-testo, .fab-contatti.nascosto{ transition:none; }
}