/* Elite Immobiliare Lecco — style.css
   Colori misurati sul design del kit (confronta-design.py --colori e campioni sulle fette ingrandite).
   Carattere: Inter (variabile, con l'asse opsz: nei titoli grandi prende il taglio Display), servito dal sito. */

@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/inter-latin-opsz-normal.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/inter-latin-ext-opsz-normal.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* colori del design */
  --blu: #009BFE;            /* pulsanti pieni, pillola attiva, linee */
  --blu-testo: #0A95FD;      /* link con freccia */
  --blu-icona: #0E8FFC;      /* icone del kit */
  --navy: #050B3F;           /* titoli e menu */
  --testo: #4B588A;          /* testi */
  --testo-tenue: #5F6B92;    /* testi piccoli, footer */
  --bianco: #FFFFFF;
  --azzurro: #E5F6FD;        /* riquadro «Vendi con noi» */
  --azzurro-cerchio: #E8F7FE;/* cerchi dei servizi */
  --ricerca: #ECF4FA;        /* riquadro della ricerca */
  --pillola: #EEF3F8;        /* pillole spente */
  --piede: #F1F5F9;          /* footer */
  --bordo: #E8EDF3;          /* schede e riquadri */
  --bordo-campo: #D6E2F0;    /* tendine */
  --divisore: #DDE3ED;       /* linee verticali */
  --bordo-blu: #90D1FC;      /* pulsante a contorno */

  /* misure */
  --larghezza: 1368px;
  --margine: 36px;
  --interno: 24px;
  --raggio: 6px;
  --raggio-scheda: 10px;
  --raggio-riquadro: 12px;
  --altezza-testata: 104px;
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --font: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

/* ── base ─────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
  scroll-padding-top: calc(var(--altezza-testata) + 16px);
}
html.menu-aperto { overflow: hidden; }
body {
  margin: 0;
  background: var(--bianco);
  color: var(--testo);
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.55;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
img, picture, svg { display: block; max-width: 100%; height: auto; }
[hidden] { display: none !important; }
h1, h2, h3, p, ul, ol, figure { margin: 0; }
ul[role="list"], ol[role="list"] { list-style: none; padding: 0; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
a, button, select, label { touch-action: manipulation; }
:focus-visible { outline: 3px solid var(--blu); outline-offset: 3px; border-radius: 4px; }

.salta {
  position: absolute; left: 16px; top: 12px; z-index: 100;
  background: var(--navy); color: var(--bianco); padding: 10px 16px; border-radius: var(--raggio);
  transform: translateY(-80px);
  transition: transform .2s var(--ease-out);
}
.salta:focus { transform: none; }

.solo-largo { display: none; }
@media (min-width: 1100px) { .solo-largo { display: inline; } }

/* ── contenitori ──────────────────────────────────────────────────────── */
.contenitore {
  width: 100%;
  max-width: calc(var(--larghezza) + 2 * var(--margine));
  margin-inline: auto;
  padding-inline: max(var(--margine), env(safe-area-inset-left, 0px)) max(var(--margine), env(safe-area-inset-right, 0px));
}
.contenitore--interno {
  max-width: calc(var(--larghezza) + 2 * var(--margine));
  padding-inline: calc(var(--margine) + var(--interno));
}

.riquadro { border-radius: var(--raggio-riquadro); }
.riquadro--azzurro { background: var(--azzurro); }
.riquadro--bianco { background: var(--bianco); }
.riquadro--bordo { background: var(--bianco); border: 1px solid var(--bordo); }

/* ── testi ricorrenti ─────────────────────────────────────────────────── */
.occhiello {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--testo);
  margin-bottom: 12px;
}
.occhiello--tenue { color: var(--testo-tenue); }

.titolo-sezione {
  color: var(--navy);
  font-size: clamp(28px, 2.4vw + 6px, 40px);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.03em;
}
.titolo-sezione--grande { font-size: clamp(28px, 2.6vw + 7px, 44px); }

.testo-grande { font-size: clamp(16px, .6vw + 11px, 20px); line-height: 1.55; }
.testo-medio { font-size: clamp(16px, .3vw + 13px, 18px); line-height: 1.6; }

/* link con freccia (icona del kit) */
.link-freccia {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--blu-testo);
  font-weight: 500;
  font-size: 17px;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
}
.link-freccia::after {
  content: "";
  flex: none;
  width: 18px; height: 18px;
  background: currentColor;
  -webkit-mask: url("/assets/img/icone/icona-freccia-destra.png") center / contain no-repeat;
  mask: url("/assets/img/icone/icona-freccia-destra.png") center / contain no-repeat;
  transition: transform .25s var(--ease-out);
}
.link-freccia--tenue { color: var(--testo); text-decoration: none; font-weight: 400; font-size: 15px; }
@media (hover: hover) and (pointer: fine) {
  a.link-freccia:hover::after, .scheda-immobile:hover .link-freccia::after { transform: translateX(4px); }
  a.link-freccia:hover { text-decoration-thickness: 2px; }
}

/* icone del kit, colorate come nel design */
.icona {
  display: inline-block;
  flex: none;
  width: 1em; height: 1em;
  background: currentColor;
  -webkit-mask: var(--i) center / contain no-repeat;
  mask: var(--i) center / contain no-repeat;
}
.icona--casa { --i: url("/assets/img/icone/icona-casa.png"); }
.icona--villa { --i: url("/assets/img/icone/icona-villa.png"); }
.icona--negozio { --i: url("/assets/img/icone/icona-negozio.png"); }
.icona--capannone { --i: url("/assets/img/icone/icona-capannone.png"); }
.icona--terreno { --i: url("/assets/img/icone/icona-terreno.png"); }
.icona--ufficio { --i: url("/assets/img/icone/icona-ufficio.png"); }
.icona--valutazioni { --i: url("/assets/img/icone/icona-valutazioni.png"); }
.icona--persone { --i: url("/assets/img/icone/icona-persone.png"); }
.icona--ristrutturazioni { --i: url("/assets/img/icone/icona-ristrutturazioni.png"); }
.icona--consulenza-tecnica { --i: url("/assets/img/icone/icona-consulenza-tecnica.png"); }
.icona--assistenza-legale { --i: url("/assets/img/icone/icona-assistenza-legale.png"); }
.icona--investimenti { --i: url("/assets/img/icone/icona-investimenti.png"); }
.icona--posizione { --i: url("/assets/img/icone/icona-posizione.png"); }
.icona--ricerca { --i: url("/assets/img/icone/icona-ricerca.png"); }
.icona--cuore { --i: url("/assets/img/icone/icona-cuore-bianco.png"); }
.icona--freccia-esterna { --i: url("/assets/img/icone/icona-freccia-esterna.png"); }

/* ── pulsanti ─────────────────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 50px;
  padding: 12px 28px;
  border-radius: var(--raggio);
  border: 1px solid transparent;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .16s var(--ease-out), box-shadow .2s ease;
}
.btn:active { transform: scale(0.97); }
.btn--pieno { background: var(--blu); color: var(--bianco); }
.btn--contorno { background: var(--bianco); color: var(--blu-testo); border-color: var(--bordo-blu); }
.btn--largo { width: 100%; }
@media (hover: hover) and (pointer: fine) {
  .btn--pieno:hover { background: #0A8BEB; box-shadow: 0 8px 20px -10px rgba(0, 155, 254, .7); }
  .btn--contorno:hover { border-color: var(--blu); }
}

/* ── tendine e campi ──────────────────────────────────────────────────── */
.campo { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.campo label { font-size: 15px; font-weight: 500; color: var(--navy); }
.selezione { position: relative; }
.selezione select {
  width: 100%;
  height: 52px;
  padding: 0 46px 0 16px;
  border: 1px solid var(--bordo-campo);
  border-radius: var(--raggio);
  background: var(--bianco);
  color: var(--testo);
  font-size: 16px;
  -webkit-appearance: none; appearance: none;
  cursor: pointer;
  text-overflow: ellipsis;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.selezione::after {
  content: "";
  position: absolute; right: 16px; top: 50%;
  width: 16px; height: 16px; margin-top: -8px;
  background: var(--navy);
  -webkit-mask: url("/assets/img/icone/icona-chevron-giu.png") center / contain no-repeat;
  mask: url("/assets/img/icone/icona-chevron-giu.png") center / contain no-repeat;
  pointer-events: none;
}
.selezione select:focus-visible { outline: none; border-color: var(--blu); box-shadow: 0 0 0 3px rgba(0, 155, 254, .25); }
@media (hover: hover) and (pointer: fine) { .selezione select:hover { border-color: #A9C6E4; } }

/* ── testata ──────────────────────────────────────────────────────────── */
.testata {
  position: sticky; top: 0; z-index: 50;
  background: var(--bianco);
  border-bottom: 1px solid var(--bordo);
  padding-top: env(safe-area-inset-top, 0px);
  transition: box-shadow .25s ease;
}
.testata.scorrendo { box-shadow: 0 6px 24px -14px rgba(5, 11, 63, .35); }
.testata__riga {
  display: flex;
  align-items: center;
  height: var(--altezza-testata);
  padding-inline: calc(var(--margine) + 2px) calc(var(--margine) + 14px);
}
.logo { display: block; flex: none; }
.logo img { height: 76px; width: auto; }

.menu { display: flex; align-items: center; margin-left: auto; }
.menu__voci { display: flex; gap: 36px; list-style: none; margin: 0; padding: 0; }
.menu__voci a {
  position: relative;
  display: inline-block;
  padding: 8px 0;
  color: var(--navy);
  font-size: 16px;
  font-weight: 500;
  white-space: nowrap;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
}
.menu__voci a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 2px; height: 2px;
  background: var(--blu); transform: scaleX(0); transform-origin: left;
  transition: transform .25s var(--ease-out);
}
.menu__voci a:active { color: var(--blu-testo); }
@media (hover: hover) and (pointer: fine) { .menu__voci a:hover::after { transform: scaleX(1); } }
.menu__cta { margin-left: 88px; min-width: 133px; min-height: 51px; }

.hamburger {
  display: none;
  margin-left: auto;
  width: 48px; height: 48px;
  border: 0; border-radius: var(--raggio);
  background: transparent;
  position: relative;
  -webkit-user-select: none; user-select: none;
}
.hamburger:active { background: var(--pillola); }
.hamburger__righe, .hamburger__righe::before, .hamburger__righe::after {
  position: absolute; left: 12px; width: 24px; height: 2px; border-radius: 2px;
  background: var(--navy);
  transition: transform .25s var(--ease-out), opacity .2s ease;
}
.hamburger__righe { top: 23px; }
.hamburger__righe::before, .hamburger__righe::after { content: ""; left: 0; }
.hamburger__righe::before { transform: translateY(-7px); }
.hamburger__righe::after { transform: translateY(7px); }
.hamburger[aria-expanded="true"] .hamburger__righe { background: transparent; }
.hamburger[aria-expanded="true"] .hamburger__righe::before { transform: rotate(45deg); background: var(--navy); }
.hamburger[aria-expanded="true"] .hamburger__righe::after { transform: rotate(-45deg); background: var(--navy); }

/* ── hero ─────────────────────────────────────────────────────────────── */
.hero {
  display: grid;
  grid-template-columns: minmax(0, 470px) minmax(0, 1fr);
  column-gap: 0;
  align-items: start;
  padding-left: max(calc(var(--margine) + 22px), calc((100% - var(--larghezza)) / 2 + 22px));
}
.hero__testo {
  align-self: center;
  padding: 24px 28px 64px 0;
}
.hero__titolo {
  color: var(--navy);
  font-size: clamp(38px, 3.2vw + 6px, 52px);
  font-weight: 700;
  line-height: 1.06;
  letter-spacing: -0.035em;
  margin-bottom: 20px;
}
.hero__titolo .riga { display: block; }
@media (min-width: 700px) { .hero__titolo .riga { white-space: nowrap; } }
.hero__sotto { font-size: clamp(17px, .5vw + 12px, 20px); line-height: 1.5; color: var(--testo); }
.hero__link { display: flex; flex-wrap: wrap; gap: 14px 48px; margin-top: 34px; }
.hero__media { min-width: 0; }
.hero__media picture { display: block; border-radius: 10px 0 0 10px; overflow: hidden; background: var(--ricerca); }
.hero__media img { width: 100%; aspect-ratio: 1649 / 954; object-fit: cover; }
.didascalia {
  display: flex; align-items: center; gap: 20px;
  margin-top: 16px;
  font-size: 17px;
  color: var(--testo);
}
.didascalia::before { content: ""; flex: none; width: 66px; height: 3px; border-radius: 2px; background: var(--blu); }

/* ── ricerca ──────────────────────────────────────────────────────────── */
.ricerca-sezione { margin-top: 44px; }
.ricerca {
  background: var(--ricerca);
  padding: 0 var(--interno) 26px;
  box-shadow: 0 1px 0 rgba(5, 11, 63, .03);
}
.ricerca__testa {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  border-bottom: 1px solid #DCE6F0;
  margin-bottom: 22px;
}
.ricerca__schede { display: flex; gap: 8px; }
.ricerca__scheda {
  position: relative;
  border: 0; background: transparent;
  min-height: 68px;
  padding: 10px 26px 8px;
  color: var(--navy);
  font-size: 17px; font-weight: 400;
  -webkit-user-select: none; user-select: none;
  transition: color .2s ease;
}
.ricerca__scheda::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; border-radius: 2px;
  background: var(--blu); transform: scaleX(0);
  transition: transform .3s var(--ease-out);
}
.ricerca__scheda[aria-pressed="true"] { font-weight: 600; }
.ricerca__scheda[aria-pressed="true"]::after { transform: scaleX(1); }
.ricerca__scheda:active { color: var(--blu-testo); }
.ricerca__avanzata { padding: 12px 0; }
.ricerca__campi {
  display: grid;
  grid-template-columns: 1.25fr 1.25fr 1fr 0.8fr;
  gap: 18px;
  align-items: end;
}
.btn--cerca { min-height: 83px; font-size: 17px; padding-inline: 20px; }
.btn--cerca .icona { width: 22px; height: 22px; }

/* ── sezioni ──────────────────────────────────────────────────────────── */
.sezione { padding-top: 56px; }
.sezione__testa {
  display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  margin-bottom: 24px;
}
.sezione__azioni { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }

.pillole { display: flex; gap: 12px; }
.pillola {
  display: inline-flex; align-items: center;
  min-height: 36px; padding: 6px 18px;
  border-radius: 999px;
  background: var(--pillola);
  color: var(--testo);
  font-size: 15px;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
  transition: background-color .2s ease, color .2s ease, transform .16s var(--ease-out);
}
.pillola[aria-current] { background: var(--blu); color: var(--bianco); font-weight: 500; }
.pillola:active { transform: scale(0.97); }
@media (hover: hover) and (pointer: fine) { .pillola:not([aria-current]):hover { background: #E2EBF4; color: var(--navy); } }

/* schede degli immobili (riusabili nella pagina Immobili) */
.schede-immobili {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.scheda-immobile {
  position: relative;
  height: 100%;
  display: flex; flex-direction: column;
  background: var(--bianco);
  border: 1px solid var(--bordo);
  border-radius: var(--raggio-scheda);
  overflow: hidden;
  transition: box-shadow .3s ease, transform .16s var(--ease-out), border-color .3s ease;
}
.scheda-immobile:active { transform: scale(0.97); }
@media (hover: hover) and (pointer: fine) {
  .scheda-immobile:hover { box-shadow: 0 18px 40px -24px rgba(5, 11, 63, .35); border-color: #D9E3EE; }
  .scheda-immobile:hover .scheda-immobile__foto img { transform: scale(1.05); }
}
.scheda-immobile__foto { position: relative; overflow: hidden; background: var(--ricerca); }
.scheda-immobile__foto img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; transition: transform .6s var(--ease-out); }
.etichetta {
  position: absolute; top: 16px; left: 16px;
  padding: 5px 14px;
  border-radius: 999px;
  background: var(--bianco);
  color: var(--navy);
  font-size: 13px; font-weight: 500;
}
.cuore {
  position: absolute; top: 10px; right: 10px; z-index: 2;
  width: 44px; height: 44px;
  border: 0; border-radius: 50%;
  background: transparent;
  color: var(--bianco);
  display: grid; place-items: center;
  -webkit-user-select: none; user-select: none;
  transition: background-color .2s ease, color .2s ease, transform .16s var(--ease-out);
}
.cuore::before {
  content: ""; width: 26px; height: 26px;
  background: currentColor;
  -webkit-mask: url("/assets/img/icone/icona-cuore-bianco.png") center / contain no-repeat;
  mask: url("/assets/img/icone/icona-cuore-bianco.png") center / contain no-repeat;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .25));
}
.cuore:active { transform: scale(0.95); }
.cuore[aria-pressed="true"] { background: var(--bianco); color: var(--blu); }
.cuore[aria-pressed="true"]::before { filter: none; }
.scheda-immobile__corpo { padding: 18px 24px 22px; display: flex; flex-direction: column; gap: 6px; }
.luogo { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--testo-tenue); }
.luogo .icona { width: 16px; height: 16px; color: var(--blu-icona); }
.scheda-immobile__titolo { color: var(--navy); font-size: clamp(20px, .6vw + 15px, 24px); font-weight: 600; line-height: 1.25; letter-spacing: -0.015em; margin-bottom: 4px; }
.scheda-immobile__link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.scheda-immobile__link:focus-visible { outline: none; }
.scheda-immobile:has(.scheda-immobile__link:focus-visible) { outline: 3px solid var(--blu); outline-offset: 3px; }
.scheda-immobile .link-freccia { font-size: 16px; align-self: flex-start; }

/* tipologie */
.tipologie {
  display: flex;
  margin-top: 26px;
}
.tipologie li { flex: 1 1 auto; display: flex; justify-content: center; border-left: 1px solid var(--divisore); }
.tipologie li:first-child { border-left: 0; }
.tipologia {
  display: inline-flex; align-items: center; gap: 18px;
  min-height: 60px; padding: 8px 26px;
  border-radius: var(--raggio);
  color: var(--testo);
  font-size: 17px; font-weight: 500;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
  transition: background-color .2s ease, color .2s ease, transform .16s var(--ease-out);
}
.tipologia .icona { width: 32px; height: 32px; color: var(--blu-icona); }
.tipologia:active { transform: scale(0.97); }
.tipologia .icona { transition: transform .25s var(--ease-out); }
@media (hover: hover) and (pointer: fine) {
  .tipologia:hover { background: var(--ricerca); color: var(--navy); }
  .tipologia:hover .icona { transform: translateY(-3px); }
}

/* vendi con noi */
.vendi { padding-top: 38px; }
.vendi__box {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 384px;
  gap: 28px;
  padding: 24px 24px 24px 45px;
}
.vendi__testo { padding: 22px 0 14px; }
.vendi__testo .titolo-sezione { margin-bottom: 14px; }
.passi { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 40px; }
.passo { padding: 0 18px 0 22px; border-left: 1px solid #CFE3F0; }
.passo:first-child { padding-left: 0; border-left: 0; }
.passo__icona { width: 42px; height: 42px; color: var(--blu-icona); margin-bottom: 18px; }
.passo__titolo { color: var(--navy); font-size: 21px; font-weight: 700; letter-spacing: -0.015em; margin-bottom: 6px; }
.passo p { font-size: 15.5px; line-height: 1.55; }

.modulo-valutazione {
  display: flex; flex-direction: column; gap: 14px;
  padding: 32px 30px 24px;
  box-shadow: 0 12px 34px -26px rgba(5, 11, 63, .35);
}
.modulo-valutazione__titolo { color: var(--navy); font-size: 25px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; }
.modulo-valutazione__sotto { font-size: 16px; margin-top: -8px; margin-bottom: 6px; }
.modulo-valutazione .btn { margin-top: 6px; min-height: 52px; }

/* commerciale */
.commerciale { padding-top: 31px; }
.commerciale__griglia {
  display: grid;
  grid-template-columns: minmax(0, 690fr) minmax(0, 574fr);
  gap: 52px;
  align-items: start;
}
.commerciale__foto { border-radius: var(--raggio-scheda); overflow: hidden; background: var(--ricerca); }
.commerciale__foto img { width: 100%; aspect-ratio: 1.95 / 1; object-fit: cover; }
.commerciale__testo { padding-top: 4px; }
.commerciale__testo .titolo-sezione { margin-bottom: 10px; }
.bottoni-tipo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; margin: 24px 0 26px; }
.btn-tipo {
  display: flex; align-items: center; gap: 16px;
  min-height: 56px; padding: 8px 20px;
  border: 1px solid var(--bordo);
  border-radius: var(--raggio);
  background: var(--bianco);
  color: var(--blu-testo);
  font-size: 17px; font-weight: 500;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
  transition: border-color .2s ease, background-color .2s ease, transform .16s var(--ease-out);
}
.btn-tipo .icona { width: 28px; height: 28px; color: var(--blu-icona); }
.btn-tipo::after {
  content: ""; width: 16px; height: 16px; flex: none;
  background: currentColor;
  -webkit-mask: url("/assets/img/icone/icona-freccia-destra.png") center / contain no-repeat;
  mask: url("/assets/img/icone/icona-freccia-destra.png") center / contain no-repeat;
  transition: transform .25s var(--ease-out);
}
.btn-tipo:active { transform: scale(0.97); }
@media (hover: hover) and (pointer: fine) {
  .btn-tipo:hover { border-color: var(--bordo-blu); background: #F7FBFE; }
  .btn-tipo:hover::after { transform: translateX(4px); }
}

/* servizi */
.servizi { padding-top: 46px; }
.servizi .titolo-sezione { margin-bottom: 30px; }
.servizi__griglia { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 30px; }
.servizio { display: flex; gap: 20px; align-items: flex-start; padding: 0 18px 0 22px; border-left: 1px solid var(--divisore); }
.servizio:nth-child(3n + 1) { padding-left: 0; border-left: 0; }
.cerchio {
  flex: none;
  width: 64px; height: 64px; border-radius: 50%;
  background: var(--azzurro-cerchio);
  display: grid; place-items: center;
  color: var(--blu-icona);
}
.cerchio .icona { width: 30px; height: 30px; }
.servizio__titolo { color: var(--navy); font-size: 18px; font-weight: 600; letter-spacing: -0.01em; margin: 4px 0 6px; }
.servizio p { font-size: 15px; line-height: 1.55; }

/* agenzia */
.agenzia { padding-top: 36px; padding-bottom: 16px; }
.agenzia__box {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 470px);
  padding: 30px 42px 32px;
}
.agenzia__testo { padding-right: 40px; border-right: 1px solid var(--bordo); }
.agenzia__titolo { margin-bottom: 18px; }
.agenzia__titolo-leggero { display: block; font-weight: 400; letter-spacing: -0.025em; }
.agenzia__cta { padding: 16px 0 0 46px; }
.agenzia__cta-titolo { color: var(--navy); font-size: 22px; font-weight: 700; letter-spacing: -0.02em; margin-bottom: 8px; }
.agenzia__cta p { font-size: 15.5px; }
.agenzia__bottoni { display: flex; gap: 12px; margin-top: 24px; }
.agenzia__bottoni .btn { flex: 1 1 0; min-height: 52px; padding-inline: 16px; }

/* ── footer ───────────────────────────────────────────────────────────── */
.piede { background: var(--piede); margin-top: 22px; padding: 40px 0 24px; padding-bottom: calc(28px + env(safe-area-inset-bottom, 0px)); }
.piede__griglia {
  display: grid;
  grid-template-columns: minmax(0, 440px) repeat(3, minmax(0, 1fr)) minmax(0, 1.4fr);
  gap: 0;
}
.logo--piede { align-self: start; margin-top: 6px; }
.logo--piede img { height: 70px; }
.piede__colonna { padding: 0 24px; border-left: 1px solid #DCE4EC; }
.piede__colonna:nth-child(2) { border-left: 0; }
.piede__titolo { color: var(--navy); font-size: 16px; font-weight: 600; margin-bottom: 14px; }
.piede__colonna ul { display: flex; flex-direction: column; gap: 6px; }
.piede__colonna a, .piede__colonna p { font-size: 15px; color: var(--testo-tenue); line-height: 1.55; }
.piede__colonna ul a { display: inline-block; padding: 2px 0; -webkit-user-select: none; user-select: none; }
.piede__colonna a:active { color: var(--blu-testo); }
@media (hover: hover) and (pointer: fine) { .piede a:hover { color: var(--blu-testo); } }
.piede__contatti { margin-top: 12px; }
.piede__contatti a { font-weight: 500; color: var(--navy); }
.piede__fondo {
  display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 32px; flex-wrap: wrap;
  margin-top: 32px; padding-top: 20px;
  border-top: 1px solid #E0E8F0;
  font-size: 15px; color: var(--testo-tenue);
}
.piede__legale { font-size: 13px; margin-top: 4px; }
.piede__legali { display: flex; }
.piede__legali a { padding: 4px 16px; border-left: 1px solid var(--divisore); color: var(--testo-tenue); }
.piede__legali a:first-child { border-left: 0; }
.credit { margin-top: 18px; font-size: 13px; color: var(--testo-tenue); }
.credit a { text-decoration: underline; text-underline-offset: 3px; }

/* ── pagine semplici (legali, 404) ────────────────────────────────────── */
.pagina { padding: 56px 0 72px; }
.pagina .contenitore--interno { max-width: calc(860px + 2 * (var(--margine) + var(--interno))); }
.legale h1, .pagina h1 { color: var(--navy); font-size: clamp(32px, 2vw + 20px, 44px); font-weight: 700; letter-spacing: -0.03em; line-height: 1.1; margin-bottom: 12px; }
.legale h2 { color: var(--navy); font-size: 22px; font-weight: 700; letter-spacing: -0.015em; margin: 36px 0 10px; }
.legale h3 { color: var(--navy); font-size: 18px; font-weight: 600; margin: 24px 0 8px; }
.legale p, .legale li { font-size: 16px; line-height: 1.65; }
.legale p + p { margin-top: 10px; }
.legale ul, .legale ol { padding-left: 22px; margin: 10px 0; }
.legale li + li { margin-top: 6px; }
.legale a:not(.btn) { color: var(--blu-testo); text-decoration: underline; text-underline-offset: 3px; word-break: break-word; }
.legale table { width: 100%; border-collapse: collapse; margin: 16px 0; font-size: 15px; display: block; overflow-x: auto; }
.legale th, .legale td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1px solid var(--bordo); }
.legale th { color: var(--navy); font-weight: 600; background: var(--ricerca); }
.pagina__azioni { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

/* ════════════════════════════════════════════════════════════════════════
   computer piccolo (1100-1279 px): stesso impaginato, più stretto
   ════════════════════════════════════════════════════════════════════════ */
@media (min-width: 1100px) and (max-width: 1279px) {
  .logo img { height: 62px; }
  .menu__voci { gap: 24px; }
  .menu__cta { margin-left: 36px; }
  .vendi__box { grid-template-columns: minmax(0, 1fr) 340px; }
}

/* ════════════════════════════════════════════════════════════════════════
   tablet (sotto i 1100 px)
   ════════════════════════════════════════════════════════════════════════ */
@media (max-width: 1099px) {
  :root { --margine: 24px; --interno: 0px; --altezza-testata: 76px; }

  .logo img { height: 52px; }
  .hamburger { display: block; }
  .menu {
    position: fixed; z-index: 49;
    top: calc(var(--altezza-testata) + env(safe-area-inset-top, 0px)); left: 0; right: 0;
    height: calc(100dvh - var(--altezza-testata) - env(safe-area-inset-top, 0px));
    flex-direction: column; align-items: stretch; justify-content: flex-start;
    margin: 0;
    padding: 20px max(24px, env(safe-area-inset-right, 0px)) calc(32px + env(safe-area-inset-bottom, 0px)) max(24px, env(safe-area-inset-left, 0px));
    background: var(--bianco);
    border-top: 1px solid var(--bordo);
    overflow-y: auto; overscroll-behavior: contain;
    opacity: 0; visibility: hidden; transform: translateY(-8px);
    transition: opacity .2s ease, transform .25s var(--ease-out), visibility 0s linear .25s;
  }
  .menu.aperto { opacity: 1; visibility: visible; transform: none; transition: opacity .25s ease, transform .3s var(--ease-out), visibility 0s; }
  .menu__voci { flex-direction: column; gap: 0; }
  .menu__voci li { border-bottom: 1px solid var(--bordo); }
  .menu__voci a { display: block; padding: 16px 2px; font-size: 20px; }
  .menu__voci a::after { display: none; }
  .menu__cta { margin: 28px 0 0; min-height: 54px; font-size: 17px; }

  .testata__riga { padding-inline: max(var(--margine), env(safe-area-inset-left, 0px)) max(14px, env(safe-area-inset-right, 0px)); }

  .hero { grid-template-columns: 1fr; padding-left: 0; }
  .hero__testo { padding: 40px max(var(--margine), env(safe-area-inset-right, 0px)) 28px max(var(--margine), env(safe-area-inset-left, 0px)); }
  .hero__media picture { border-radius: 0; }
  .didascalia { padding-inline: max(var(--margine), env(safe-area-inset-left, 0px)); font-size: 15px; gap: 14px; }
  .didascalia::before { width: 44px; }

  .ricerca-sezione { margin-top: 32px; }
  .ricerca { padding: 0 20px 22px; }
  .ricerca__campi { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .btn--cerca { grid-column: 1 / -1; min-height: 56px; margin-top: 4px; }

  .schede-immobili { gap: 14px; }
  .scheda-immobile__corpo { padding: 16px 18px 20px; }
  ul.tipologie {
    display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
    margin-inline: calc(-1 * var(--margine)); padding-inline: var(--margine); scroll-padding-inline: var(--margine);
  }
  .tipologie::-webkit-scrollbar { display: none; }
  .tipologie li, .tipologie li:first-child, .tipologie li:last-child { flex: none; justify-content: flex-start; scroll-snap-align: start; }
  .tipologia { padding-inline: 18px; white-space: nowrap; }

  .vendi__box { grid-template-columns: 1fr; padding: 28px 20px 20px; gap: 28px; }
  .vendi__testo { padding: 0; }
  .passi { margin-top: 28px; }

  .commerciale__griglia { grid-template-columns: 1fr; gap: 28px; }

  .servizi__griglia { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 28px; }
  .servizio, .servizio:nth-child(3n + 1) { padding: 0 20px; border-left: 1px solid var(--divisore); }
  .servizio:nth-child(2n + 1) { padding-left: 0; border-left: 0; }

  .agenzia__box { grid-template-columns: 1fr; padding: 28px 24px; }
  .agenzia__testo { padding: 0 0 26px; border-right: 0; border-bottom: 1px solid var(--bordo); }
  .agenzia__cta { padding: 26px 0 0; }

  .piede__griglia { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 32px; }
  .logo--piede { grid-column: 1 / -1; }
  .logo--piede img { height: 58px; }
  .piede__colonna:nth-child(2) { padding-left: 0; }
  .piede__colonna--testo { grid-column: 1 / -1; padding: 0; border-left: 0; }
}

/* ════════════════════════════════════════════════════════════════════════
   telefono (sotto i 700 px)
   ════════════════════════════════════════════════════════════════════════ */
@media (max-width: 699px) {
  :root { --margine: 20px; --altezza-testata: 72px; }

  .logo img { height: 50px; }

  .hero__testo { padding-top: 30px; padding-bottom: 26px; }
  .occhiello { font-size: 13px; margin-bottom: 10px; }
  .hero__titolo { font-size: clamp(34px, 9.6vw, 40px); margin-bottom: 14px; }
  .hero__sotto { font-size: 17px; }
  .hero__link { margin-top: 20px; gap: 4px 20px; }
  .link-freccia { font-size: 16px; min-height: 44px; }

  .ricerca { display: flex; flex-direction: column; }
  .ricerca__testa { display: contents; }
  .ricerca__schede { order: 1; gap: 0; border-bottom: 1px solid #DCE6F0; margin-bottom: 18px; }
  .ricerca__scheda { flex: 1 1 0; min-height: 56px; padding-inline: 8px; font-size: 16px; white-space: nowrap; }
  .ricerca__campi { order: 2; grid-template-columns: 1fr; gap: 14px; }
  .ricerca__avanzata { order: 3; align-self: center; margin-top: 10px; padding: 8px 0; min-height: 44px; }
  .campo label { font-size: 14px; }
  .selezione select { height: 50px; padding: 0 36px 0 12px; }
  .selezione::after { right: 12px; width: 14px; height: 14px; margin-top: -7px; }

  .sezione { padding-top: 48px; }
  .sezione__testa { margin-bottom: 18px; gap: 14px; }
  .sezione__azioni { width: 100%; justify-content: space-between; gap: 12px; }
  .pillole { gap: 8px; }
  .pillola { padding-inline: 14px; font-size: 14px; }

  /* le schede scorrono in una riga, col bordo della successiva in vista */
  ul.schede-immobili {
    display: flex; gap: 14px;
    overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
    margin-inline: calc(-1 * var(--margine)); padding: 2px var(--margine) 6px; scroll-padding-inline: var(--margine);
  }
  .schede-immobili::-webkit-scrollbar { display: none; }
  .schede-immobili li { flex: 0 0 82%; scroll-snap-align: start; }
  .scheda-immobile__corpo { padding: 14px 18px 18px; }

  .tipologie { margin-top: 18px; }
  .tipologia { min-height: 52px; gap: 12px; font-size: 16px; padding-inline: 14px; }
  .tipologia .icona { width: 26px; height: 26px; }

  .vendi { padding-top: 40px; }
  .vendi__box { padding: 26px 16px 16px; border-radius: var(--raggio-scheda); }
  .vendi__testo { padding-inline: 4px; }
  .passi { grid-template-columns: 1fr; gap: 18px; }
  .passo, .passo:first-child {
    display: grid; grid-template-columns: 40px 1fr; column-gap: 16px;
    padding: 0; border-left: 0;
  }
  .passo__icona { width: 34px; height: 34px; margin: 2px 0 0; grid-row: span 2; }
  .passo__titolo { font-size: 18px; margin-bottom: 2px; }
  .passo p { font-size: 15px; }
  .modulo-valutazione { padding: 24px 18px 20px; }
  .modulo-valutazione__titolo { font-size: 22px; }

  .commerciale { padding-top: 40px; }
  .commerciale__foto img { aspect-ratio: 16 / 10; }
  .bottoni-tipo { gap: 10px; margin: 20px 0 22px; }
  .btn-tipo { gap: 10px; padding: 8px 12px; min-height: 54px; font-size: 16px; }
  .btn-tipo .icona { width: 22px; height: 22px; }
  .btn-tipo::after { margin-left: auto; width: 14px; height: 14px; }

  .servizi .titolo-sezione { margin-bottom: 24px; }
  .servizi__griglia { grid-template-columns: 1fr; row-gap: 22px; }
  .servizio, .servizio:nth-child(3n + 1), .servizio:nth-child(2n + 1) { padding: 0; border-left: 0; gap: 16px; }
  .cerchio { width: 54px; height: 54px; }
  .cerchio .icona { width: 26px; height: 26px; }
  .servizio__titolo { font-size: 17px; margin-top: 2px; }
  .servizio p { font-size: 15px; }

  .agenzia { padding-top: 40px; }
  .agenzia__box { padding: 24px 18px; border-radius: var(--raggio-scheda); }
  .agenzia__titolo { font-size: 27px; }
  .agenzia__titolo-leggero { font-size: 24px; margin-top: 4px; }
  .agenzia .testo-medio { font-size: 15.5px; }
  .agenzia__cta-titolo { font-size: 20px; }
  .agenzia__bottoni { flex-direction: column; gap: 10px; }

  .piede { padding-top: 36px; }
  .piede__griglia { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 28px; }
  .logo--piede img { height: 50px; }
  .piede__colonna, .piede__colonna:nth-child(2) { padding: 0 0 0 16px; border-left: 1px solid #DCE4EC; }
  .piede__colonna:nth-child(2n) { padding-left: 0; border-left: 0; }
  .piede__colonna--testo { padding: 0; border-left: 0; }
  .piede__fondo { flex-direction: column; align-items: flex-start; margin-top: 32px; font-size: 14px; }
  .piede__legali { margin-left: -16px; flex-wrap: wrap; }
  .piede__legali a { padding: 10px 16px; }
}


/* riga del modello sotto i moduli */
.thk-avviso-modulo { font-size: 12.5px; line-height: 1.5; color: var(--testo-tenue); margin-top: -2px; }
.thk-avviso-modulo a { color: var(--blu-testo); text-decoration: underline; text-underline-offset: 2px; }

/* ════════════════════════════════════════════════════════════════════════
   SEZIONI DEL COPY (step 6) — con le forme del design: pillole, passi con icona,
   riquadri, schede, cerchi, pulsanti. Riusabili nelle pagine interne.
   ════════════════════════════════════════════════════════════════════════ */
.vh {
  position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
.hamburger[aria-expanded="false"] .hamburger__chiudi,
.hamburger[aria-expanded="true"] .hamburger__apri { display: none; }

.sezione__testa { align-items: flex-end; }
.sezione__sotto { margin-top: 10px; font-size: clamp(16px, .3vw + 13px, 18px); line-height: 1.55; color: var(--testo); }
.btn--grande { min-height: 56px; padding-inline: 34px; font-size: 17px; }
.hero__azioni { margin-top: 32px; }

/* ricerca: il prezzo massimo si scrive, in euro */
.selezione--testo::after { display: none; }
.selezione__unita {
  position: absolute; left: 16px; top: 50%; transform: translateY(-50%);
  color: var(--testo-tenue); font-size: 16px; pointer-events: none;
}
.selezione--testo input {
  width: 100%; height: 52px;
  padding: 0 16px 0 34px;
  border: 1px solid var(--bordo-campo); border-radius: var(--raggio);
  background: var(--bianco); color: var(--navy); font-size: 16px;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.selezione--testo input::placeholder { color: var(--testo); opacity: 1; }
.selezione--testo input:focus-visible { outline: none; border-color: var(--blu); box-shadow: 0 0 0 3px rgba(0, 155, 254, .25); }
@media (hover: hover) and (pointer: fine) { .selezione--testo input:hover { border-color: #A9C6E4; } }

/* schede degli immobili: prezzo */
.schede-immobili { row-gap: 24px; }
.prezzo { color: var(--navy); font-size: 19px; font-weight: 600; letter-spacing: -0.01em; margin: -2px 0 4px; }
.prezzo span { font-size: 15px; font-weight: 400; color: var(--testo-tenue); }

/* i comuni: le pillole del design, più grandi da toccare */
.pillole--comuni { flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.pillole--comuni .pillola { min-height: 44px; padding: 8px 15px 8px 12px; font-size: 15px; gap: 7px; color: var(--navy); }
.pillole--comuni .pillola .icona { width: 18px; height: 18px; color: var(--blu-icona); transition: color .2s ease; }
@media (hover: hover) and (pointer: fine) {
  .pillole--comuni .pillola:hover { background: var(--blu); color: var(--bianco); }
  .pillole--comuni .pillola:hover .icona { color: var(--bianco); }
}

/* le tipologie */
.tipologie-sezione .tipologie { margin-top: 8px; }
.tipologia { line-height: 1.3; }

/* come funziona: i passi del design, numerati */
.passi--numerati { counter-reset: passo; margin-top: 30px; }
.passi--numerati .passo { counter-increment: passo; border-color: var(--divisore); }
.passi--numerati .passo p { font-size: 17px; line-height: 1.5; color: var(--testo); max-width: 340px; }
.passi--numerati .passo p::before { content: counter(passo) ". "; font-weight: 700; color: var(--navy); }

/* la valutazione: il riquadro azzurro del design, con la scheda bianca */
.valutazione { padding-top: 64px; }
.valutazione__box {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 384px;
  gap: 28px;
  align-items: center;
  padding: 24px 24px 24px 45px;
}
.valutazione__testo { padding: 26px 0; }
.valutazione__testo .titolo-sezione { margin-bottom: 14px; }
.valutazione__scheda {
  display: flex; flex-direction: column; gap: 18px;
  padding: 30px 30px 26px;
  box-shadow: 0 12px 34px -26px rgba(5, 11, 63, .35);
}
.valutazione__icone { display: flex; gap: 12px; margin: 0; padding: 0; list-style: none; }
.valutazione__icone li {
  width: 52px; height: 52px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--azzurro-cerchio); color: var(--blu-icona);
}
.valutazione__icone .icona { width: 26px; height: 26px; }
.valutazione__nota { color: var(--navy); font-size: 18px; font-weight: 600; line-height: 1.4; letter-spacing: -0.01em; }

/* i servizi: i cerchi del design, otto in due righe da quattro */
.servizi__griglia--otto { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: 26px; }
.servizi__griglia--otto > li { padding: 0 16px 0 22px; border-left: 1px solid var(--divisore); }
.servizi__griglia--otto > li:nth-child(4n + 1) { padding-left: 0; border-left: 0; }
.servizi__griglia--otto .servizio {
  display: flex; align-items: center; gap: 18px;
  padding: 6px 0; border: 0; border-radius: var(--raggio);
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
  transition: transform .16s var(--ease-out);
}
.servizi__griglia--otto .servizio:active { transform: scale(0.97); }
.servizi__griglia--otto .cerchio { width: 62px; height: 62px; transition: background-color .2s ease; }
.servizi__griglia--otto .cerchio .icona { transition: transform .25s var(--ease-out); }
.servizi__griglia--otto .servizio__titolo { margin: 0; font-size: 17px; line-height: 1.3; transition: color .2s ease; }
@media (hover: hover) and (pointer: fine) {
  .servizi__griglia--otto .servizio:hover .cerchio { background: #D6EFFC; }
  .servizi__griglia--otto .servizio:hover .cerchio .icona { transform: translateY(-2px); }
  .servizi__griglia--otto .servizio:hover .servizio__titolo { color: var(--blu-testo); }
}

/* chi siamo: la forma «foto e testo» del design */
.chi-siamo { padding-top: 64px; }
.chi-siamo .commerciale__griglia { align-items: center; }
.chi-siamo__testo .titolo-sezione { margin-bottom: 14px; }
.chi-siamo__testo .testo-medio + .testo-medio { margin-top: 12px; }
.chi-siamo__testo .link-freccia { margin-top: 22px; }

/* domande frequenti: riquadri a fisarmonica */
.domande { padding-top: 64px; }
.domande__griglia { display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: 48px; align-items: start; }
.domande__elenco { display: flex; flex-direction: column; gap: 12px; }
.domanda { background: var(--bianco); border: 1px solid var(--bordo); border-radius: var(--raggio-scheda); transition: border-color .2s ease; }
.domanda summary {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  min-height: 58px; padding: 14px 22px;
  color: var(--navy); font-size: 17px; font-weight: 600; line-height: 1.35;
  list-style: none; cursor: pointer;
  border-radius: var(--raggio-scheda);
  -webkit-user-select: none; user-select: none;
  transition: background-color .2s ease;
}
.domanda summary::-webkit-details-marker { display: none; }
.domanda summary::after {
  content: ""; flex: none; width: 16px; height: 16px;
  background: var(--navy);
  -webkit-mask: url("/assets/img/icone/icona-chevron-giu.png") center / contain no-repeat;
  mask: url("/assets/img/icone/icona-chevron-giu.png") center / contain no-repeat;
  transition: transform .25s var(--ease-out);
}
.domanda[open] summary::after { transform: rotate(180deg); }
.domanda summary:active { background: var(--ricerca); }
.domanda p { padding: 0 22px 20px; font-size: 16px; line-height: 1.6; }
.domanda p + p { margin-top: -12px; }
.domanda[open] p { animation: apri-risposta .3s var(--ease-out); }
@keyframes apri-risposta { from { opacity: 0; transform: translateY(-6px); } }
@media (hover: hover) and (pointer: fine) { .domanda:hover { border-color: #D2DEEA; } }

/* contatti: il riquadro col bordo del design, recapiti a sinistra e modulo a destra */
.contatti { padding-top: 64px; padding-bottom: 16px; }
.contatti__box {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 540px);
  padding: 36px 42px 38px;
}
.contatti__testo { padding-right: 46px; border-right: 1px solid var(--bordo); }
.contatti__testo .titolo-sezione { margin-bottom: 12px; }
.recapiti { display: flex; flex-direction: column; gap: 10px; margin: 24px 0 26px; padding: 0; list-style: none; font-size: 17px; }
.recapiti__voce { color: var(--navy); font-weight: 600; }
.recapiti a { color: var(--blu-testo); }
.modulo { display: flex; flex-direction: column; gap: 14px; padding-left: 46px; }
.modulo__titolo { color: var(--navy); font-size: 22px; font-weight: 700; letter-spacing: -0.02em; margin-bottom: 2px; }
.modulo__coppia { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.casella {
  width: 100%; min-height: 52px;
  padding: 0 16px;
  border: 1px solid var(--bordo-campo); border-radius: var(--raggio);
  background: var(--bianco); color: var(--navy); font-size: 16px;
  transition: border-color .2s ease, box-shadow .2s ease;
}
textarea.casella { padding: 12px 16px; min-height: 124px; resize: vertical; line-height: 1.5; }
.casella::placeholder { color: var(--testo-tenue); opacity: 1; }
.casella:focus-visible { outline: none; border-color: var(--blu); box-shadow: 0 0 0 3px rgba(0, 155, 254, .25); }
.casella[aria-invalid="true"] { border-color: #C2341B; }
@media (hover: hover) and (pointer: fine) { .casella:hover { border-color: #A9C6E4; } }
.campo__errore { font-size: 14px; line-height: 1.4; color: #B42318; }
.modulo > .campo__errore { margin-top: -6px; }
.modulo .btn { margin-top: 4px; min-height: 54px; }
.modulo .btn[disabled] { opacity: .7; cursor: progress; }
.modulo__esito { padding: 12px 14px; border-radius: var(--raggio); font-size: 15px; line-height: 1.5; }
.modulo__esito--ok { background: var(--azzurro); color: var(--navy); }
.modulo__esito--errore { background: #FDEDEB; color: #8A1C14; }
.modulo__esito a { color: inherit; font-weight: 600; text-decoration: underline; }

/* footer col copy */
.piede__griglia { grid-template-columns: minmax(0, 1.5fr) minmax(0, .7fr) minmax(0, 1fr); }
.piede__marchio p { margin-top: 18px; max-width: 380px; font-size: 15px; line-height: 1.55; color: var(--testo-tenue); }
.piede__colonna--testo p { margin-top: 4px; }
.piede__colonna--testo a { font-weight: 500; color: var(--navy); }

/* il pulsante fisso da telefono */
.cta-fissa { display: none; }

@media (min-width: 1100px) and (max-width: 1399px) {
  .pillole--comuni { gap: 6px; }
  .pillole--comuni .pillola { padding: 7px 11px 7px 9px; font-size: 14px; gap: 6px; }
}
@media (min-width: 1100px) and (max-width: 1279px) {
  .valutazione__box, .vendi__box { grid-template-columns: minmax(0, 1fr) 340px; }
  .contatti__box { grid-template-columns: minmax(0, 1fr) minmax(0, 480px); }
}

@media (max-width: 1099px) {
  .ricerca__campi .campo:nth-child(3) { grid-column: 1 / -1; }
  .valutazione__box { grid-template-columns: 1fr; padding: 28px 20px 20px; gap: 22px; }
  .valutazione__testo { padding: 0; }
  .servizi__griglia--otto { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .servizi__griglia--otto > li, .servizi__griglia--otto > li:nth-child(4n + 1) { padding: 0 0 0 20px; border-left: 1px solid var(--divisore); }
  .servizi__griglia--otto > li:nth-child(2n + 1) { padding-left: 0; border-left: 0; }
  .domande__griglia { grid-template-columns: 1fr; gap: 24px; }
  .contatti__box { grid-template-columns: 1fr; padding: 28px 24px; }
  .contatti__testo { padding: 0 0 26px; border-right: 0; border-bottom: 1px solid var(--bordo); }
  .modulo { padding: 26px 0 0; }
  .piede__griglia { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .piede__marchio { grid-column: 1 / -1; }
  .piede__colonna--testo { grid-column: auto; padding: 0 0 0 24px; border-left: 1px solid #DCE4EC; }
}

@media (max-width: 699px) {
  .sezione__testa { align-items: flex-start; }
  .sezione__testa .btn { width: 100%; }
  .sezione__sotto { margin-top: 8px; }
  .hero__azioni { margin-top: 24px; }
  .hero__azioni .btn { width: 100%; }
  .ricerca__campi .campo:nth-child(3) { grid-column: auto; }
  .prezzo { font-size: 18px; }
  .pillole--comuni { gap: 10px; }
  .pillole--comuni .pillola { font-size: 15px; padding: 8px 14px 8px 12px; }
  .passi--numerati { margin-top: 22px; }
  .passi--numerati .passo { grid-template-columns: 40px 1fr; }
  .passi--numerati .passo__icona { grid-row: auto; }
  .passi--numerati .passo p { font-size: 16px; }
  .valutazione { padding-top: 48px; }
  .valutazione__box { padding: 26px 16px 16px; border-radius: var(--raggio-scheda); }
  .valutazione__scheda { padding: 22px 18px 18px; }
  .servizi__griglia--otto { row-gap: 20px; }
  .servizi__griglia--otto > li, .servizi__griglia--otto > li:nth-child(4n + 1) { padding: 0 0 0 14px; }
  .servizi__griglia--otto > li:nth-child(2n + 1) { padding-left: 0; }
  .servizi__griglia--otto .servizio { flex-direction: column; align-items: flex-start; gap: 10px; }
  .servizi__griglia--otto .cerchio { width: 52px; height: 52px; }
  .servizi__griglia--otto .cerchio .icona { width: 26px; height: 26px; }
  .servizi__griglia--otto .servizio__titolo { font-size: 16px; }
  .chi-siamo, .domande, .contatti { padding-top: 48px; }
  .domanda summary { padding: 14px 16px; font-size: 16px; }
  .domanda p { padding: 0 16px 18px; font-size: 15.5px; }
  .contatti__box { padding: 24px 18px; border-radius: var(--raggio-scheda); }
  .recapiti { font-size: 16px; margin: 20px 0 22px; }
  .modulo__coppia { grid-template-columns: 1fr; }
  .piede__griglia { grid-template-columns: 1fr; row-gap: 24px; }
  .piede__colonna, .piede__colonna:nth-child(2), .piede__colonna--testo { padding: 0; border-left: 0; }
  .piede__colonna ul { flex-direction: row; flex-wrap: wrap; gap: 4px 18px; }
  .piede__colonna ul a { padding: 6px 0; font-size: 15px; }
  .piede { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }

  .cta-fissa {
    display: flex; align-items: center; justify-content: center;
    position: fixed; z-index: 40;
    left: max(16px, env(safe-area-inset-left, 0px)); right: max(16px, env(safe-area-inset-right, 0px));
    bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    min-height: 54px; padding: 12px 20px;
    border-radius: var(--raggio);
    background: var(--blu); color: var(--bianco);
    font-size: 16px; font-weight: 600;
    box-shadow: 0 12px 30px -10px rgba(5, 11, 63, .45);
    opacity: 0; transform: translateY(calc(100% + 24px));
    pointer-events: none;
    -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
    transition: transform .2s var(--ease-out), opacity .2s ease;
  }
  .cta-fissa.visibile { opacity: 1; transform: none; pointer-events: auto; transition-duration: .4s, .3s; }
  .cta-fissa.visibile:active { transform: scale(0.97); transition-duration: .16s; }
}

@media (prefers-reduced-motion: reduce) {
  .cta-fissa, .cta-fissa.visibile { transform: none; }
  .domanda[open] p { animation-name: appare; }
}

/* ════════════════════════════════════════════════════════════════════════
   PAGINE INTERNE (step 6-bis) — gli stessi pezzi della home: titoli, riquadri,
   schede, cerchi, pillole, pulsanti; niente di nuovo.
   ════════════════════════════════════════════════════════════════════════ */
.titolo-pagina {
  color: var(--navy);
  font-size: clamp(32px, 2.6vw + 10px, 48px);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -0.032em;
  max-width: 900px;
}
.testa-pagina { padding: 56px 0 8px; }
.testa-pagina .titolo-pagina { animation: entra-su .85s var(--ease-out) .06s both; }
.testa-pagina__sotto { margin-top: 14px; max-width: 760px; font-size: clamp(17px, .5vw + 12px, 20px); line-height: 1.5; color: var(--testo); animation: entra-su .85s var(--ease-out) .14s both; }
.testa-pagina .hero__azioni, .testa-pagina .recapiti, .testa-pagina .elenco-segni, .testa-pagina .pillole--indice { animation: entra-su .85s var(--ease-out) .22s both; }
.testa-pagina .recapiti { margin: 22px 0 0; }
.testa-pagina__griglia { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 52px; align-items: center; }
.testa-pagina__foto { animation: appare .9s ease .1s both; }
.testa-pagina__foto img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.testa-pagina .elenco-segni { margin-top: 14px; }
.foto-larga { margin-top: 40px; border-radius: var(--raggio-scheda); overflow: hidden; }
.foto-larga img { width: 100%; aspect-ratio: 2.4 / 1; object-fit: cover; }
.pillole--indice { margin-top: 30px; }
.pillole--indice { gap: 8px; }
.pillole--indice .pillola { padding: 7px 13px; font-size: 14px; }

.titolo-sezione--piccolo { font-size: clamp(24px, 1.2vw + 14px, 30px); }
.link-testo { color: var(--blu-testo); text-decoration: underline; text-underline-offset: 3px; }
.maiuscola { display: inline-block; }
.maiuscola::first-letter { text-transform: uppercase; }

/* elenco con un segno davanti */
.elenco-segni { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.elenco-segni li { position: relative; padding-left: 26px; font-size: 17px; line-height: 1.5; color: var(--testo); }
.elenco-segni li::before { content: ""; position: absolute; left: 4px; top: .62em; width: 9px; height: 9px; border-radius: 50%; background: var(--blu); }
.elenco-segni li::first-letter { text-transform: uppercase; }
.elenco-segni--grande { gap: 12px; margin-bottom: 18px; }
.elenco-segni--grande li { font-size: 18px; color: var(--navy); }

/* due colonne: titolo a sinistra, testo a destra */
.due-colonne { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: start; }
.due-colonne--centro { align-items: center; }
.due-colonne .testo-medio + .testo-medio { margin-top: 12px; }
.due-colonne .titolo-sezione { margin-bottom: 4px; }
.link-coppia { display: flex; flex-wrap: wrap; gap: 10px 32px; margin-top: 22px; }

/* fasce: il riquadro azzurro, quello col bordo e quello della ricerca */
.fascia {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 48px; align-items: center;
  padding: 36px 45px;
}
.fascia .titolo-sezione { margin-bottom: 10px; }
.fascia .testo-medio + .testo-medio { margin-top: 8px; }
.fascia--ricerca { background: var(--ricerca); grid-template-columns: auto minmax(0, 1fr); padding: 30px 36px; }
.fascia--sobria { grid-template-columns: auto minmax(0, 1fr) auto; padding: 28px 36px; }
.fascia--sobria:not(:has(.cerchio)) { grid-template-columns: minmax(0, 1fr) auto; }
.cerchio--bianco { background: var(--bianco); }

/* /immobili: i filtri, i risultati */
.ricerca-sezione--pagina { margin-top: 26px; }
.filtri { padding-top: 24px; }
.filtri__campi { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 18px; }
.filtri__azioni { display: flex; align-items: center; gap: 24px; margin-top: 20px; }
.filtri .btn--cerca { min-height: 54px; min-width: 200px; }
.link-togli { color: var(--blu-testo); font-weight: 500; text-decoration: underline; text-underline-offset: 4px; padding: 12px 0; }
.risultati { padding-top: 40px; }
.risultati__testa { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 32px; flex-wrap: wrap; margin-bottom: 22px; }
.risultati__conteggio { color: var(--navy); font-size: 22px; font-weight: 700; letter-spacing: -0.015em; margin-bottom: 6px; }
.risultati__nota { font-size: 14px; color: var(--testo-tenue); }
.campo--ordina { min-width: 230px; }
.schede-immobili--elenco > li[hidden] { display: none; }
.nessun-risultato { padding: 40px 32px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.nessun-risultato .testo-medio a { color: var(--blu-testo); }
.risultati__altri { display: flex; justify-content: center; margin-top: 30px; }
.dati-brevi { font-size: 14px; color: var(--testo-tenue); margin-top: -4px; }

/* le tipologie e i luoghi */
.servizio--senza-link { cursor: default; }
.servizi__griglia--lunghi .servizio__titolo { font-size: 16px; }
.servizi__griglia--due { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.servizi__griglia--due > li:nth-child(4n + 1) { padding-left: 22px; border-left: 1px solid var(--divisore); }
.servizi__griglia--due > li:nth-child(2n + 1) { padding-left: 0; border-left: 0; }
.luoghi { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px 48px; }
.luoghi__titolo { color: var(--navy); font-size: 18px; font-weight: 600; margin-bottom: 14px; }
.luoghi--testo { margin: 24px 0 0; padding: 0; list-style: none; }
.luoghi__voce { display: flex; gap: 14px; align-items: flex-start; padding: 22px 24px; font-size: 17px; line-height: 1.6; }
.luoghi__voce .icona { width: 22px; height: 22px; margin-top: 3px; color: var(--blu-icona); }
.luoghi__voce strong { color: var(--navy); font-weight: 600; }
.luoghi__voce a { color: var(--blu-testo); text-decoration: underline; text-underline-offset: 3px; }
.luoghi__nota { margin-top: 22px; }
.tipologie--testo .tipologia { cursor: default; }

/* /valutazione: un esempio di scheda accanto al testo */
.schede-immobili--una { display: block; max-width: 460px; justify-self: end; width: 100%; }

/* /servizi: una scheda col bordo per servizio */
.servizi-schede { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.servizio-scheda { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 28px 30px 30px; scroll-margin-top: calc(var(--altezza-testata) + 24px); }
.servizio-scheda .cerchio { margin-bottom: 8px; }
.servizio-scheda__titolo { color: var(--navy); font-size: 22px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; }
.servizio-scheda .link-freccia { margin-top: 6px; }
.servizio-scheda--larga { grid-column: 1 / -1; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; column-gap: 24px; align-items: center; background: var(--azzurro); border-color: transparent; }
.servizio-scheda--larga .cerchio { grid-row: span 2; margin: 0; background: var(--bianco); }
.servizio-scheda--larga .link-freccia { grid-row: span 2; grid-column: 3; margin: 0; }
.contatti__vai { margin-top: 22px; }

/* la scheda dell'immobile */
.scheda-testa { padding: 32px 0 0; }
.link-freccia--indietro { flex-direction: row-reverse; font-size: 15px; }
.link-freccia--indietro::after { transform: scaleX(-1); }
@media (hover: hover) and (pointer: fine) { a.link-freccia--indietro:hover::after { transform: scaleX(-1) translateX(4px); } }
.scheda-testa__riga { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px 40px; flex-wrap: wrap; margin: 18px 0 26px; }
.scheda-testa__testo { max-width: 820px; }
.titolo-pagina--scheda { font-size: clamp(28px, 1.8vw + 12px, 40px); animation: entra-su .85s var(--ease-out) .06s both; }
.luogo--grande { margin-top: 12px; font-size: 16px; }
.luogo--grande .icona { width: 18px; height: 18px; }
.scheda-testa__prezzo { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.etichetta--in-riga { position: static; background: var(--pillola); font-size: 14px; padding: 6px 14px; }
.separatore { color: var(--testo-tenue); }
.prezzo--grande { margin: 0; font-size: 26px; font-weight: 700; letter-spacing: -0.02em; color: var(--navy); }
.prezzo--grande span { font-size: 17px; }
.link-chiedi { margin-top: 10px; font-size: 16px; }
.scheda-testa__azioni { display: flex; flex-wrap: wrap; gap: 12px; animation: entra-su .85s var(--ease-out) .2s both; }

.galleria { position: relative; display: grid; gap: 12px; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); grid-template-rows: 1fr 1fr; height: clamp(320px, 38vw, 540px); }
.galleria--1 { grid-template-columns: 1fr; grid-template-rows: 1fr; }
.galleria--2 { grid-template-rows: 1fr; }
.galleria__foto {
  display: block; padding: 0; border: 0; background: var(--ricerca);
  border-radius: var(--raggio-scheda); overflow: hidden; cursor: zoom-in;
  transition: transform .16s var(--ease-out);
}
.galleria__foto:active { transform: scale(0.99); }
.galleria__foto picture, .galleria__foto img { width: 100%; height: 100%; }
.galleria__foto img { object-fit: cover; transition: transform .6s var(--ease-out); }
.galleria__foto--grande { grid-row: 1 / -1; }
.galleria__foto:nth-of-type(n + 4) { display: none; }
.galleria__tutte { position: absolute; right: 16px; bottom: 16px; min-height: 44px; padding: 8px 18px; font-size: 15px; box-shadow: 0 8px 24px -12px rgba(5, 11, 63, .45); }
@media (hover: hover) and (pointer: fine) { .galleria__foto:hover img { transform: scale(1.04); } }

.scheda-corpo { padding-top: 48px; }
.scheda-corpo__griglia { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 440px); gap: 48px; align-items: start; }
.scheda-corpo__testo { display: flex; flex-direction: column; gap: 40px; }
.scheda-blocco__titolo { color: var(--navy); font-size: 24px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; margin-bottom: 14px; }
.descrizione p + p { margin-top: 12px; }
.caratteristiche { width: 100%; border-collapse: collapse; font-size: 16px; }
.caratteristiche th, .caratteristiche td { padding: 12px 0; border-bottom: 1px solid var(--bordo); text-align: left; vertical-align: top; }
.caratteristiche th { width: 46%; font-weight: 500; color: var(--testo-tenue); padding-right: 16px; }
.caratteristiche td { color: var(--navy); font-weight: 600; }
.caratteristiche tr[hidden] { display: none; }
.nota-classe { margin-top: 12px; font-size: 14px; color: var(--testo-tenue); }
.scheda-blocco .link-freccia { margin-top: 12px; }
.chiedi { padding: 28px 30px; }
.chiedi .recapiti { margin: 16px 0 0; }
.visita { padding: 28px 24px 24px; }
.visita .scheda-blocco__titolo { margin-bottom: 8px; }
.visita__modulo { margin-top: 18px; padding: 24px 22px 22px; }
.modulo--visita { padding: 0; }
.altri-immobili__torna { margin-top: 26px; }
.simile { padding-bottom: 8px; }

/* la galleria a tutto schermo */
.lightbox { width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: rgba(5, 11, 63, .94); color: var(--bianco); overscroll-behavior: contain; }
.lightbox[open] { display: block; animation: appare .25s ease; }
.lightbox::backdrop { background: transparent; }
.lightbox__dentro { position: relative; height: 100%; display: grid; place-items: center; padding: 64px 72px; padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px)); }
.lightbox__foto { margin: 0; padding: 0; list-style: none; width: 100%; height: 100%; display: grid; place-items: center; }
.lightbox__voce { width: 100%; height: 100%; display: grid; place-items: center; }
.lightbox__voce[hidden] { display: none; }
.lightbox__voce picture, .lightbox__voce img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; border-radius: 6px; }
.lightbox__voce:not([hidden]) img { animation: appare .3s ease; }
.lightbox__conto { position: absolute; top: 22px; left: 50%; transform: translateX(-50%); font-size: 15px; opacity: .85; }
.lightbox__tasto, .lightbox__chiudi {
  position: absolute; width: 52px; height: 52px; border: 0; border-radius: 50%;
  background: rgba(255, 255, 255, .12); color: var(--bianco);
  display: grid; place-items: center;
  transition: background-color .2s ease, transform .16s var(--ease-out);
}
.lightbox__tasto:active, .lightbox__chiudi:active { transform: scale(0.94); }
.lightbox__tasto::before, .lightbox__chiudi::before {
  content: ""; width: 22px; height: 22px; background: currentColor;
  -webkit-mask: url("/assets/img/icone/icona-freccia-destra.png") center / contain no-repeat;
  mask: url("/assets/img/icone/icona-freccia-destra.png") center / contain no-repeat;
}
.lightbox__tasto--prima { left: 14px; top: 50%; margin-top: -26px; }
.lightbox__tasto--prima::before { transform: scaleX(-1); }
.lightbox__tasto--dopo { right: 14px; top: 50%; margin-top: -26px; }
.lightbox__chiudi { right: 14px; top: 14px; }
.lightbox__chiudi::before { -webkit-mask-image: none; mask-image: none; background: none; width: 20px; height: 20px;
  background-image: linear-gradient(45deg, transparent 45%, currentColor 45%, currentColor 55%, transparent 55%), linear-gradient(-45deg, transparent 45%, currentColor 45%, currentColor 55%, transparent 55%); }
@media (hover: hover) and (pointer: fine) { .lightbox__tasto:hover, .lightbox__chiudi:hover { background: rgba(255, 255, 255, .22); } }
html.foto-aperte { overflow: hidden; }

/* scelte del modulo (vendere o dare in affitto) */
.scelte { border: 0; margin: 0; padding: 0; }
.scelte legend { padding: 0; margin-bottom: 8px; font-size: 15px; font-weight: 500; color: var(--navy); }
.scelte__voci { display: flex; flex-wrap: wrap; gap: 10px; }
.scelta { position: relative; display: inline-flex; }
.scelta input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.scelta span {
  display: inline-flex; align-items: center; min-height: 44px; padding: 8px 18px;
  border: 1px solid var(--bordo-campo); border-radius: 999px; background: var(--bianco);
  color: var(--navy); font-size: 16px;
  -webkit-user-select: none; user-select: none;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .16s var(--ease-out);
}
.scelta input:checked + span { background: var(--blu); border-color: var(--blu); color: var(--bianco); font-weight: 500; }
.scelta input:focus-visible + span { outline: 3px solid var(--blu); outline-offset: 2px; }
.scelta:active span { transform: scale(0.97); }

.pagina-404 .pagina__azioni { gap: 24px; }

@media (max-width: 1099px) {
  .testa-pagina__griglia { grid-template-columns: 1fr; gap: 28px; }
  .due-colonne { grid-template-columns: 1fr; gap: 20px; }
  .schede-immobili--una { justify-self: start; }
  .fascia, .fascia--sobria, .fascia--sobria:not(:has(.cerchio)) { grid-template-columns: 1fr; padding: 28px 24px; }
  .fascia--ricerca { grid-template-columns: auto minmax(0, 1fr); }
  .scheda-corpo__griglia { grid-template-columns: 1fr; }
  .luoghi { grid-template-columns: 1fr; }
  .servizi-schede { grid-template-columns: 1fr; }
  .servizio-scheda--larga { grid-template-columns: auto minmax(0, 1fr); }
  .servizio-scheda--larga .link-freccia { grid-column: 2; grid-row: auto; justify-self: start; }
  .galleria { height: clamp(300px, 52vw, 460px); }
}

@media (max-width: 699px) {
  .testa-pagina { padding-top: 32px; }
  .testa-pagina__sotto { font-size: 17px; }
  .foto-larga { margin-top: 28px; }
  .foto-larga img { aspect-ratio: 16 / 10; }
  .elenco-segni li { font-size: 16px; }
  .elenco-segni--grande li { font-size: 17px; }
  .fascia, .fascia--sobria, .fascia--sobria:not(:has(.cerchio)) { padding: 24px 18px; border-radius: var(--raggio-scheda); }
  .fascia--ricerca { grid-template-columns: 1fr; gap: 14px; }
  .fascia .btn { width: 100%; }
  .filtri { padding-top: 20px; }
  .filtri__campi { grid-template-columns: 1fr; gap: 14px; }
  .filtri__azioni { flex-direction: column; align-items: stretch; gap: 8px; }
  .filtri .btn--cerca { width: 100%; }
  .link-togli { text-align: center; }
  .risultati__testa { align-items: stretch; }
  .campo--ordina { min-width: 0; width: 100%; }
  ul.schede-immobili--elenco { display: grid; grid-template-columns: 1fr; gap: 16px; margin: 0; padding: 0; overflow: visible; }
  ul.schede-immobili--elenco li { flex: none; }
  .servizi__griglia--lunghi, .servizi__griglia--due { grid-template-columns: 1fr; }
  .servizi__griglia--lunghi > li, .servizi__griglia--lunghi > li:nth-child(n), .servizi__griglia--due > li, .servizi__griglia--due > li:nth-child(n) { padding: 0; border-left: 0; }
  .servizi__griglia--lunghi .servizio, .servizi__griglia--due .servizio { flex-direction: row; align-items: center; gap: 16px; }
  .luoghi__voce { padding: 16px 14px; font-size: 15.5px; line-height: 1.55; }
  .luoghi__voce .icona { display: none; }
  .servizio-scheda { padding: 22px 20px 24px; }
  .servizio-scheda--larga { grid-template-columns: 1fr; row-gap: 10px; }
  .servizio-scheda--larga .cerchio, .servizio-scheda--larga .link-freccia { grid-row: auto; grid-column: auto; }
  .scheda-testa { padding-top: 22px; }
  .scheda-testa__azioni { width: 100%; }
  .scheda-testa__azioni .btn { flex: 1 1 100%; }
  .galleria {
    display: flex; height: auto; gap: 10px;
    overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
    margin-inline: calc(-1 * var(--margine)); padding-inline: var(--margine); scroll-padding-inline: var(--margine);
  }
  .galleria::-webkit-scrollbar { display: none; }
  .galleria__foto, .galleria__foto:nth-of-type(n + 4) { display: block; flex: 0 0 86%; aspect-ratio: 4 / 3; scroll-snap-align: start; }
  .galleria--1 .galleria__foto { flex-basis: 100%; }
  .galleria__tutte { position: static; flex: none; align-self: center; margin-left: 4px; }
  .scheda-corpo { padding-top: 36px; }
  .scheda-corpo__testo { gap: 32px; }
  .caratteristiche th { width: 50%; }
  .chiedi { padding: 22px 18px; }
  .visita { padding: 22px 14px 14px; border-radius: var(--raggio-scheda); }
  .visita__modulo { padding: 20px 16px 18px; }
  .lightbox__dentro { padding: 60px 8px 88px; }
  .lightbox__tasto--prima, .lightbox__tasto--dopo { top: auto; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); margin-top: 0; }
  .lightbox__tasto--prima { left: calc(50% - 64px); }
  .lightbox__tasto--dopo { right: calc(50% - 64px); }
}

@media (prefers-reduced-motion: reduce) {
  .testa-pagina .titolo-pagina, .testa-pagina__sotto, .testa-pagina .hero__azioni, .testa-pagina .recapiti,
  .testa-pagina .elenco-segni, .testa-pagina .pillole--indice, .titolo-pagina--scheda, .scheda-testa__azioni { animation-name: appare; }
  .galleria__foto:hover img { transform: none; }
}

/* ════════════════════════════════════════════════════════════════════════
   MOVIMENTO (step 5-bis) — curve e durate di Emil Kowalski, solo transform e opacity
   ════════════════════════════════════════════════════════════════════════ */
@keyframes entra-su { from { opacity: 0; transform: translateY(28px); } }
@keyframes appare { from { opacity: 0; } }
@keyframes traccia { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes assesta { from { scale: 1.1; } to { scale: 1.04; } }
@keyframes respiro { from { scale: 1.04; } to { scale: 1.08; } }

/* la prima schermata entra al caricamento, senza aspettare il JavaScript; la foto è visibile da subito */
.hero__titolo .riga,
.hero__sotto,
.hero__azioni,
.ricerca-sezione { animation: entra-su .85s var(--ease-out) both; }
.hero__titolo .riga:nth-child(1) { animation-delay: .08s; }
.hero__titolo .riga:nth-child(2) { animation-delay: .15s; }
.hero__sotto { animation-delay: .24s; }
.hero__azioni { animation-delay: .32s; }
.ricerca-sezione { animation-duration: .9s; animation-delay: .42s; }
/* la foto di Lecco si assesta e poi «respira» piano; col mouse, in più, una profondità leggera allo scroll (main.js) */
.hero__media img {
  scale: 1.04;
  transform-origin: 50% 0;   /* cresce verso il lago: il profilo delle case resta sempre intero */
  animation: assesta 1.8s var(--ease-out) both, respiro 22s linear 1.8s infinite alternate;
}

/* sezioni che entrano scorrendo: .reveal → .in (main.js); senza JavaScript tutto resta visibile */
.reveal { transition: opacity .8s var(--ease-out), transform .9s var(--ease-out); }
.js .reveal:not(.in) { opacity: 0; transform: translateY(32px); }
/* i gruppi entrano uno dopo l'altro, a 70 ms */
.js .reveal-gruppo:not(.in) { opacity: 1; transform: none; }
.reveal-gruppo > * { transition: opacity .7s var(--ease-out), transform .8s var(--ease-out); }
.js .reveal-gruppo:not(.in) > * { opacity: 0; transform: translateY(28px); }
.reveal-gruppo.in > :nth-child(2) { transition-delay: 70ms; }
.reveal-gruppo.in > :nth-child(3) { transition-delay: 140ms; }
.reveal-gruppo.in > :nth-child(4) { transition-delay: 210ms; }
.reveal-gruppo.in > :nth-child(5) { transition-delay: 280ms; }
.reveal-gruppo.in > :nth-child(6) { transition-delay: 350ms; }
.reveal-gruppo.in > :nth-child(n + 7) { transition-delay: 400ms; }
.passi.in > :nth-child(1) { transition-delay: 200ms; }
.passi.in > :nth-child(2) { transition-delay: 270ms; }
.passi.in > :nth-child(3) { transition-delay: 340ms; }
/* la foto della sezione commerciale si apre dal centro, e intanto si assesta */
.commerciale__foto { clip-path: inset(0 0 0 0 round 10px); }
.commerciale__foto.reveal { transition: clip-path 1.1s var(--ease-out), opacity .6s ease; }
.js .commerciale__foto.reveal:not(.in) { opacity: 1; transform: none; clip-path: inset(9% 6% 9% 6% round 10px); }
.commerciale__foto img { transition: transform 1.4s var(--ease-out); }
.js .commerciale__foto:not(.in) img { transform: scale(1.12); }

/* menu da telefono: le voci arrivano in fila all'apertura, escono insieme e più in fretta */
@media (max-width: 1099px) {
  .menu__voci li, .menu__cta { transition: opacity .3s var(--ease-out), transform .4s var(--ease-out); }
  .menu:not(.aperto) .menu__voci li, .menu:not(.aperto) .menu__cta { opacity: 0; transform: translateY(12px); transition-duration: .15s; }
  .menu.aperto .menu__voci li:nth-child(2) { transition-delay: 40ms; }
  .menu.aperto .menu__voci li:nth-child(3) { transition-delay: 80ms; }
  .menu.aperto .menu__voci li:nth-child(4) { transition-delay: 120ms; }
  .menu.aperto .menu__voci li:nth-child(5) { transition-delay: 160ms; }
  .menu.aperto .menu__cta { transition-delay: 200ms; }
}

/* meno movimento, non zero: restano le dissolvenze e i colori, spariscono gli spostamenti */
@media (prefers-reduced-motion: reduce) {
  .hero__titolo .riga, .hero__sotto, .hero__azioni, .ricerca-sezione { animation-name: appare; }
  .hero__media img { animation: none; scale: 1; }
  .js .reveal:not(.in), .js .reveal-gruppo:not(.in) > * { transform: none; }
  .js .commerciale__foto.reveal:not(.in) { clip-path: inset(0 0 0 0 round 10px); opacity: 0; }
  .js .commerciale__foto:not(.in) img { transform: none; }
  .menu, .menu:not(.aperto) .menu__voci li, .menu:not(.aperto) .menu__cta { transform: none; }
  .scheda-immobile:hover .scheda-immobile__foto img, .tipologia:hover .icona { transform: none; }
}
.pagina__azioni { align-items: center; }
.pillola--testo { cursor: default; }