/*
 * Il foglio unico del sito. I valori vengono dal pacchetto di handoff (design/README.md,
 * sezione Design Tokens): qui ci sono solo i token e la base comune; i componenti arrivano
 * con le pagine che li usano.
 */

/*
 * Font self-hosted: nessuna richiesta a Google dal browser del visitatore.
 * Solo il subset latin, che basta per l'italiano.
 *   Archivo variabile  — @fontsource-variable/archivo 5.3.0, file wdth: assi peso 100–900
 *                        e larghezza 62–125% (qui si dichiarano i pesi 400–800 del design)
 *   JetBrains Mono     — @fontsource/jetbrains-mono 5.3.0, pesi 400 e 500
 */
@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 400 800;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url("/assets/fonts/archivo-latin-wdth-normal.woff2")
    format("woff2-variations");
  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: "JetBrains Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/jetbrains-mono-latin-400-normal.woff2")
    format("woff2");
  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: "JetBrains Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/jetbrains-mono-latin-500-normal.woff2")
    format("woff2");
  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;
}

/* — token — */
:root {
  /* tema scuro (sito) */
  --sfondo: #0e1310;
  --superficie: #151c17;
  --bordo: #26302a;
  --bordo-input: #2f3a33;
  --bordo-pulsante: #3a463e;
  --testo: #eef2ee;
  --testo-secondario: #aeb9b1;
  --etichetta: #98a39b;
  --testo-riquadro: #c9d3cb;
  --accento: #5bc236;
  --accento-scuro: #2e7a12;
  --errore: #ff8a7a;

  /* tema chiaro (preventivatore e pagina Preventivo) */
  --chiaro-sfondo: #ffffff;
  --chiaro-testo: #111712;
  --chiaro-divisore: #dde2dc;
  --chiaro-bordo-controlli: #cdd4ce;
  --chiaro-etichetta: #5f6a62;
  --chiaro-contatore: #f1f3ef;

  /* barre di temperatura */
  --temp-ambiente: #ddefd3;
  --temp-frigo: #9ed88a;
  --temp-meno20: #5bc236;
  --temp-meno80: #2e7a12;

  --font-testo: "Archivo", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;

  --raggio-controlli: 4px;
  --raggio-foto-team: 6px;
  --raggio-card: 8px;

  --padding-pagina: clamp(20px, 4.45cqw, 64px);
  --spazio-sezioni: clamp(72px, 7.8cqw, 112px);
}

/* — base — */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--sfondo);
  color: var(--testo);
  font-family: var(--font-testo);
  font-size: 16px;
  line-height: 1.5;
}

/* Le misure fluide del design sono in cqw: la pagina è il container. */
.pagina {
  container-type: inline-size;
}

img {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
}

:focus-visible {
  outline: 2px solid var(--accento);
  outline-offset: 2px;
}

.skip-link {
  position: absolute;
  left: var(--padding-pagina);
  top: -100px;
  padding: 12px 16px;
  background: var(--accento);
  color: var(--sfondo);
  font-weight: 600;
  border-radius: var(--raggio-controlli);
}

.skip-link:focus {
  top: 12px;
}

a {
  text-decoration: none;
}

a:hover,
button:hover {
  opacity: 0.82;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* — tipografia — */
.occhiello {
  margin: 0;
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.occhiello--verde {
  color: var(--accento);
}

.h1 {
  margin: 0;
  font-weight: 800;
  font-stretch: 68%;
  font-size: clamp(60px, 7.2cqw, 104px);
  line-height: 0.9;
  letter-spacing: -0.01em;
  text-transform: uppercase;
}

.h2 {
  margin: 0;
  font-weight: 800;
  font-stretch: 68%;
  font-size: clamp(44px, 5cqw, 72px);
  line-height: 0.92;
  text-transform: uppercase;
}

.verde {
  color: var(--accento);
}

.intro {
  margin: 0;
  font-size: clamp(17px, 1.32cqw, 19px);
  line-height: 1.5;
  color: var(--testo-secondario);
  max-width: 520px;
  text-wrap: pretty;
}

.titolo-card {
  font-weight: 700;
  font-stretch: 70%;
  font-size: 30px;
  line-height: 1;
  text-transform: uppercase;
}

.testo-secondario {
  margin: 0;
  font-size: 15px;
  line-height: 1.5;
  color: var(--testo-secondario);
}

.link-verde {
  font-weight: 500;
  font-size: 15px;
  line-height: 1;
  color: var(--accento);
}

/* — pulsanti — */
.pulsanti {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.pulsante {
  height: 52px;
  padding: 0 24px;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  border-radius: var(--raggio-controlli);
  font-weight: 600;
  font-size: 16px;
  line-height: 1;
}

.pulsante--primario {
  background: var(--accento);
  color: var(--sfondo);
}

.pulsante--secondario {
  border: 1px solid var(--bordo-pulsante);
  font-weight: 500;
}

/* — logo (segnaposto in HTML finché non arriva il vettoriale ufficiale) — */
.logo {
  display: flex;
  align-items: center;
  gap: 5px;
  align-self: flex-start;
}

.logo__emn {
  position: relative;
  padding-left: 14px;
  font-weight: 700;
  font-size: 34px;
  line-height: 1;
  color: #c9cec9;
}

.logo__emn::before {
  content: "";
  position: absolute;
  left: 0;
  top: 13px;
  width: 36px;
  height: 8px;
  background: var(--accento);
  clip-path: polygon(0 38%, 100% 0, 100% 100%, 0 62%);
}

.logo__logistic {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-weight: 600;
  font-size: 7.5px;
  line-height: 1;
  letter-spacing: 0.12em;
  color: var(--accento);
}

/* — header — */
.header {
  position: relative;
  z-index: 30;
  border-bottom: 1px solid var(--bordo);
  background: var(--sfondo);
}

.header__barra {
  padding: 22px var(--padding-pagina);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.header__nav {
  display: flex;
  gap: clamp(20px, 2.5cqw, 36px);
  font-weight: 500;
  font-size: 15px;
  line-height: 1;
}

.header__nav a {
  white-space: nowrap;
  padding: 8px 0;
  color: var(--testo-secondario);
  border-bottom: 2px solid transparent;
}

.header__nav a[aria-current] {
  color: var(--testo);
  border-bottom-color: var(--accento);
}

.header__azioni {
  display: flex;
  gap: 12px;
  align-items: center;
}

.lingue {
  display: flex;
  border: 1px solid var(--bordo-input);
  border-radius: var(--raggio-controlli);
  overflow: hidden;
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 11px;
  line-height: 1;
}

.lingue > * {
  padding: 6px 9px;
  color: var(--etichetta);
}

.lingue [aria-current="true"] {
  background: var(--testo);
  color: var(--sfondo);
}

.header__area {
  border: 1px solid var(--bordo-pulsante);
  white-space: nowrap;
  padding: 12px 18px;
  border-radius: var(--raggio-controlli);
  font-weight: 500;
  font-size: 14px;
  line-height: 1;
}

.header__preventivo {
  background: var(--accento);
  color: var(--sfondo);
  white-space: nowrap;
  padding: 13px 18px;
  border-radius: var(--raggio-controlli);
  font-weight: 600;
  font-size: 14px;
  line-height: 1;
}

.header__hamburger,
.menu-mobile {
  display: none;
}

@media (max-width: 767px) {
  .header__barra {
    padding: 14px 20px;
  }

  .header .logo__emn {
    padding-left: 12px;
    font-size: 28px;
  }

  .header .logo__emn::before {
    top: 11px;
    width: 30px;
    height: 7px;
  }

  .header .logo__logistic {
    font-size: 6.5px;
  }

  .header__nav,
  .header__azioni .lingue,
  .header__area {
    display: none;
  }

  .header__azioni {
    gap: 8px;
  }

  .header__preventivo {
    height: 44px;
    padding: 0 14px;
    display: flex;
    align-items: center;
  }

  .header__hamburger {
    width: 44px;
    height: 44px;
    border: 1px solid var(--bordo-pulsante);
    background: transparent;
    border-radius: var(--raggio-controlli);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    cursor: pointer;
    color: var(--testo);
    padding: 0;
    font: inherit;
  }

  .header__hamburger span {
    width: 18px;
    height: 2px;
    background: var(--testo);
  }

  .header__hamburger[aria-expanded="true"] span {
    display: none;
  }

  .header__hamburger[aria-expanded="true"]::after {
    content: "✕";
    font-size: 20px;
    line-height: 1;
  }

  .menu-mobile:not([hidden]) {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    min-height: calc(100vh - 73px);
    background: var(--sfondo);
    padding: 4px 20px 32px;
    display: flex;
    flex-direction: column;
    gap: 28px;
    max-height: calc(100vh - 73px);
    overflow-y: auto;
  }

  .menu-aperto {
    overflow: hidden;
  }

  .menu-mobile nav {
    display: flex;
    flex-direction: column;
  }

  .menu-mobile nav a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 0;
    border-bottom: 1px solid var(--bordo);
    font-weight: 800;
    font-stretch: 68%;
    font-size: 34px;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
  }

  .menu-mobile nav a::after {
    content: "→";
    font-family: var(--font-mono);
    font-weight: 500;
    font-size: 18px;
    color: var(--accento);
  }

  .menu-mobile nav a[aria-current] {
    color: var(--accento);
  }

  .menu-mobile__area {
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--bordo-pulsante);
    border-radius: var(--raggio-controlli);
    font-weight: 500;
    font-size: 16px;
  }

  .menu-mobile__piede {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 16px;
  }

  .menu-mobile__telefono {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }

  .menu-mobile__telefono a {
    font-weight: 600;
    font-size: 24px;
    line-height: 1;
  }

  .menu-mobile .lingue {
    font-size: 12px;
  }

  .menu-mobile .lingue > * {
    width: 44px;
    height: 36px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

.etichetta {
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 11px;
  line-height: 1;
  color: var(--etichetta);
  text-transform: uppercase;
}

/* — foto segnaposto: il riquadro dice quale foto ci andrà — */
.foto {
  position: relative;
  overflow: hidden;
  background: var(--superficie);
}

.foto--segnaposto {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  text-align: center;
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.4;
  color: var(--etichetta);
  background: repeating-linear-gradient(
    135deg,
    var(--superficie) 0 12px,
    #18201a 12px 24px
  );
}

/* — sezioni — */
.sezione {
  padding: var(--spazio-sezioni) var(--padding-pagina) 0;
  display: flex;
  flex-direction: column;
  gap: clamp(28px, 2.8cqw, 40px);
}

.sezione__testa {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 16px 40px;
}

.sezione__testa-titolo {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* — Home: hero — */
.hero {
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--bordo);
}

.hero__testo {
  flex: 1 1 560px;
  min-width: 0;
  padding: clamp(48px, 5.5cqw, 80px) var(--padding-pagina);
  display: flex;
  flex-direction: column;
  gap: clamp(20px, 2.2cqw, 32px);
  justify-content: center;
}

.hero__foto {
  flex: 1 1 560px;
  min-width: 0;
  min-height: 760px;
  border-left: 1px solid var(--bordo);
}

/* Sotto i 1120px le due colonne vanno a capo: la foto passa sotto il testo. */
@media (max-width: 1119px) {
  .hero__foto {
    flex-basis: 100%;
    min-height: 0;
    height: clamp(280px, 50cqw, 520px);
    border-left: 0;
  }
}

/* — Home: striscia di dati — */
.dati {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr));
  gap: 1px;
  background: var(--bordo);
  border-bottom: 1px solid var(--bordo);
}

.dati__cella {
  background: var(--sfondo);
  padding: clamp(20px, 2.2cqw, 32px);
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.dati__valore {
  font-weight: 700;
  font-stretch: 70%;
  font-size: clamp(30px, 3cqw, 44px);
  line-height: 1;
}

.dati__etichetta {
  font-size: 15px;
  line-height: 1.4;
  color: var(--etichetta);
}

/* — Home: banda chiara del preventivo — */
.banda-chiara {
  background: var(--chiaro-contatore);
  color: var(--chiaro-testo);
  padding: clamp(64px, 6.7cqw, 96px) var(--padding-pagina);
  display: flex;
  flex-direction: column;
  gap: clamp(28px, 2.8cqw, 40px);
}

.banda-chiara .occhiello {
  color: var(--accento-scuro);
}

.banda-chiara__nota {
  margin: 0;
  font-size: 16px;
  line-height: 1.5;
  color: #4f5a52;
  max-width: 360px;
}

/* — Home: card servizi — */
.griglia-servizi {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
  gap: 16px;
}

.card-servizio {
  background: var(--superficie);
  border: 1px solid var(--bordo);
  border-radius: var(--raggio-card);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.card-servizio .foto {
  height: 220px;
}

.card-servizio__corpo {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.card-servizio__numero {
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 12px;
  line-height: 1;
  color: var(--accento);
}

.card-tutti {
  border: 1px solid var(--accento);
  border-radius: var(--raggio-card);
  padding: 28px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 24px;
  min-height: 200px;
}

.card-tutti__titolo {
  font-weight: 800;
  font-stretch: 68%;
  font-size: 44px;
  line-height: 0.92;
  text-transform: uppercase;
}

/* — Home: come funziona — */
.passi {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 32px 24px;
}

.passo {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.passo__linea {
  display: flex;
  align-items: center;
}

.passo__linea::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--bordo-pulsante);
}

.passo__etichetta {
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 13px;
  line-height: 1;
  color: var(--sfondo);
  background: var(--accento);
  padding: 6px 8px;
  border-radius: 3px;
}

.passo__titolo {
  margin: 0;
  font-weight: 700;
  font-stretch: 70%;
  font-size: 26px;
  line-height: 1;
  text-transform: uppercase;
}

/* — Home: per chi — */
.per-chi {
  padding: var(--spazio-sezioni) var(--padding-pagina) 0;
  display: flex;
  flex-wrap: wrap;
  gap: 28px 48px;
  align-items: flex-start;
}

.per-chi .h2 {
  flex: 1 1 320px;
}

.per-chi__elenco {
  flex: 2 1 640px;
  min-width: 0;
  margin: 0;
  border-top: 1px solid var(--bordo);
}

.per-chi__riga {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 4px 24px;
  padding: 18px 0;
  border-bottom: 1px solid var(--bordo);
}

.per-chi__riga dt {
  font-weight: 600;
  font-size: 20px;
  line-height: 1.3;
}

.per-chi__riga dd {
  margin: 0;
  font-size: 15px;
  line-height: 1.5;
  color: var(--testo-secondario);
}

/* — Home: le persone — */
.griglia-persone {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
  gap: 24px 16px;
}

.persona {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}

.persona .foto {
  aspect-ratio: 3 / 4;
  border-radius: var(--raggio-foto-team);
}

.persona__ruolo {
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 11px;
  line-height: 1.3;
  color: var(--accento);
  text-transform: uppercase;
}

.persona__nome {
  font-weight: 700;
  font-stretch: 70%;
  font-size: clamp(22px, 2cqw, 28px);
  line-height: 1;
  text-transform: uppercase;
}

.persona__testo {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* — CTA verde — */
.cta {
  margin-top: var(--spazio-sezioni);
  background: var(--accento);
  color: var(--sfondo);
  padding: clamp(48px, 5cqw, 72px) var(--padding-pagina);
  display: flex;
  flex-wrap: wrap;
  gap: 28px 64px;
  align-items: flex-end;
  justify-content: space-between;
}

.cta :focus-visible {
  outline-color: var(--sfondo);
}

.cta__testo {
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 1 1 480px;
  min-width: 0;
}

.cta .h2 {
  font-size: clamp(48px, 5.5cqw, 80px);
  line-height: 0.9;
}

.cta__azioni {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.cta__telefono {
  font-weight: 700;
  font-stretch: 80%;
  font-size: clamp(30px, 2.8cqw, 40px);
  line-height: 1;
  white-space: nowrap;
}

.cta .pulsante {
  font-size: 15px;
}

.cta .pulsante--scuro {
  background: var(--sfondo);
  color: var(--testo);
}

.cta .pulsante--bordo {
  border: 1px solid var(--sfondo);
}

/* — footer — */
.footer {
  margin-top: 0;
  border-top: 1px solid var(--bordo);
  padding: clamp(48px, 4.5cqw, 64px) var(--padding-pagina) 32px;
  display: flex;
  flex-direction: column;
  gap: 48px;
}

.footer__alto {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 40px;
}

.footer__marchio {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: 340px;
}

.footer__colonne {
  display: flex;
  flex-wrap: wrap;
  gap: 40px clamp(40px, 5.5cqw, 80px);
  white-space: nowrap;
  font-size: 15px;
  line-height: 1;
  color: var(--testo-riquadro);
}

.footer__colonna {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.footer__colonna address {
  font-style: normal;
  line-height: 1.45;
}

.footer__legale {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 16px;
  border-top: 1px solid var(--bordo);
  padding-top: 24px;
  font-size: 13px;
  line-height: 1.4;
  color: var(--etichetta);
}

.footer__legale div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
  white-space: nowrap;
}

/* — testata delle pagine interne — */
.briciole {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 12px;
  line-height: 1;
  color: var(--etichetta);
  text-transform: uppercase;
}

.briciole li + li::before {
  content: "/" / "";
  margin-right: 8px;
  color: var(--etichetta);
}

.briciole [aria-current="page"] {
  color: var(--accento);
}

.testata {
  padding: clamp(48px, 6cqw, 88px) var(--padding-pagina) clamp(40px, 4cqw, 56px);
  display: flex;
  flex-direction: column;
  gap: 24px;
  border-bottom: 1px solid var(--bordo);
}

.h1--grande {
  font-size: clamp(72px, 9.4cqw, 136px);
  line-height: 0.86;
}

.h1--pagina {
  font-size: clamp(64px, 7.6cqw, 112px);
  line-height: 0.88;
}

.testata__piede {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px 48px;
}

.testata__piede .intro {
  font-size: clamp(17px, 1.4cqw, 20px);
  max-width: 640px;
}

.h2--blocco {
  font-size: clamp(36px, 3.6cqw, 52px);
  line-height: 0.95;
}

/* — elenco a righe «etichetta · valore» — */
.righe {
  margin: 0;
  border-top: 1px solid var(--bordo);
}

.righe > div {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid var(--bordo);
}

.righe dt {
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 11px;
  line-height: 1.6;
  color: var(--etichetta);
  text-transform: uppercase;
}

.righe dd {
  margin: 0;
  font-size: 15px;
  line-height: 1.5;
}

.mono {
  font-family: var(--font-mono);
}

/* — Servizi: intervalli di temperatura — */
.sezione--stretta {
  padding-top: clamp(56px, 5.5cqw, 80px);
  gap: 32px;
}

.intervalli {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 1px;
  background: var(--bordo);
  border: 1px solid var(--bordo);
  border-radius: var(--raggio-card);
  overflow: hidden;
}

.intervallo {
  background: var(--sfondo);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.intervallo::before {
  content: "";
  height: 6px;
  border-radius: 3px;
  background: var(--barra);
}

.barra--ambiente {
  --barra: var(--temp-ambiente);
}

.barra--frigo {
  --barra: var(--temp-frigo);
}

.barra--meno20 {
  --barra: var(--temp-meno20);
}

.barra--meno80 {
  --barra: var(--temp-meno80);
}

.intervallo__valore {
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 28px;
  line-height: 1;
}

.intervallo__nome {
  margin: 0;
  font-weight: 600;
  font-size: 16px;
  line-height: 1;
}

.intervallo p {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--testo-secondario);
}

/* — Servizi: blocchi servizio — */
.blocchi {
  padding: var(--spazio-sezioni) var(--padding-pagina) 0;
}

.blocco {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
  gap: 24px clamp(32px, 4cqw, 64px);
  padding: clamp(28px, 3cqw, 40px) 0;
  border-top: 1px solid var(--bordo);
}

.blocco > .foto {
  height: clamp(240px, 24cqw, 340px);
  border-radius: var(--raggio-card);
}

.blocco__testo {
  display: flex;
  flex-direction: column;
  gap: 16px;
  justify-content: center;
}

.blocco__testo > p {
  margin: 0;
  font-size: 16px;
  line-height: 1.55;
  color: var(--testo-secondario);
  max-width: 520px;
}

.link-scopri {
  align-self: flex-start;
  font-weight: 600;
  font-size: 15px;
  line-height: 1;
  color: var(--accento);
  padding: 8px 0;
}

.riquadro {
  margin: clamp(40px, 4cqw, 56px) var(--padding-pagina) 0;
  border: 1px solid var(--bordo-input);
  border-radius: var(--raggio-card);
  padding: clamp(20px, 2.2cqw, 32px);
  display: flex;
  flex-wrap: wrap;
  gap: 16px 40px;
  align-items: center;
  justify-content: space-between;
}

.riquadro__testo {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-width: 760px;
}

.riquadro__testo .etichetta {
  color: var(--accento);
}

.riquadro__testo p {
  margin: 0;
  font-size: 17px;
  line-height: 1.5;
  color: var(--testo-riquadro);
}

/* — Catena del freddo — */
.hero--servizio .hero__testo {
  gap: 24px;
}

.hero--servizio .hero__foto {
  flex: 1 1 480px;
  min-height: clamp(280px, 40cqw, 600px);
  border-left: 0;
}

.hero__range {
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: clamp(22px, 2cqw, 28px);
  line-height: 1;
  color: var(--accento);
}

.hero--servizio .intro {
  max-width: 540px;
}

.tabella-intervalli {
  border-top: 1px solid var(--testo);
}

.tabella-intervalli__riga {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 16px 32px;
  padding: 24px 0;
  border-bottom: 1px solid var(--bordo);
}

.tabella-intervalli__nome {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.tabella-intervalli__nome::before {
  content: "";
  width: 6px;
  align-self: stretch;
  border-radius: 3px;
  background: var(--barra);
  flex: none;
}

.tabella-intervalli__nome > div,
.tabella-intervalli__cella {
  display: flex;
  flex-direction: column;
}

.tabella-intervalli__nome > div {
  gap: 8px;
}

.tabella-intervalli__cella {
  gap: 6px;
}

.tabella-intervalli__valore {
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 24px;
  line-height: 1;
}

.tabella-intervalli__etichetta {
  font-weight: 600;
  font-size: 16px;
  line-height: 1;
  color: var(--testo-secondario);
}

.tabella-intervalli__cella span:last-child {
  font-size: 15px;
  line-height: 1.5;
}

.etichetta--grigia {
  font-size: 12px;
  color: var(--etichetta);
}

.modalita {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr));
  gap: 16px;
}

.modalita__card {
  background: var(--superficie);
  border: 1px solid var(--bordo);
  border-radius: var(--raggio-card);
  padding: clamp(24px, 2.8cqw, 40px);
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.modalita__titolo {
  margin: 0;
  font-weight: 700;
  font-stretch: 70%;
  font-size: clamp(30px, 2.6cqw, 38px);
  line-height: 1;
  text-transform: uppercase;
}

/* — FAQ: <details name> tiene aperta una sola voce alla volta, senza JavaScript — */
.faq {
  padding: var(--spazio-sezioni) var(--padding-pagina) 0;
  display: flex;
  flex-wrap: wrap;
  gap: 28px 48px;
  align-items: flex-start;
}

.faq .h2 {
  flex: 1 1 320px;
}

.faq__elenco {
  flex: 2 1 640px;
  min-width: 0;
  border-top: 1px solid var(--bordo);
}

.faq__voce {
  border-bottom: 1px solid var(--bordo);
}

.faq__voce summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  padding: 22px 0;
  cursor: pointer;
  list-style: none;
  font-weight: 600;
  font-size: clamp(17px, 1.4cqw, 20px);
  line-height: 1.35;
}

.faq__voce summary::-webkit-details-marker {
  display: none;
}

.faq__voce summary::after {
  content: "+";
  flex: none;
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 20px;
  line-height: 1;
  color: var(--accento);
}

.faq__voce[open] summary::after {
  content: "−";
}

.faq__voce p {
  margin: 0;
  padding: 0 40px 24px 0;
  font-size: 16px;
  line-height: 1.6;
  color: var(--testo-secondario);
}

/* — altri servizi — */
.altri {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 1px;
  background: var(--bordo);
  border: 1px solid var(--bordo);
  border-radius: var(--raggio-card);
  overflow: hidden;
}

.altri a {
  background: var(--sfondo);
  padding: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

.altri a::after {
  content: "→";
  color: var(--accento);
}

.altri .titolo-card {
  font-size: 26px;
}

/* — Chi siamo — */
.testata--aperta {
  border-bottom: 0;
}

.foto-squadra {
  margin: 0 var(--padding-pagina);
  height: clamp(260px, 36cqw, 560px);
  border-radius: var(--raggio-card);
}

.presentazione {
  padding: clamp(56px, 5.5cqw, 80px) var(--padding-pagina) 0;
  display: flex;
  flex-wrap: wrap;
  gap: 28px 48px;
}

.presentazione > .occhiello {
  flex: 1 1 320px;
}

.presentazione__testo {
  flex: 2 1 640px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
  font-size: clamp(17px, 1.4cqw, 20px);
  line-height: 1.6;
  color: var(--testo-riquadro);
}

.presentazione__testo p {
  margin: 0;
  text-wrap: pretty;
}

.presentazione__testo strong {
  color: var(--testo);
  font-weight: 600;
}

.dati--riquadro {
  margin: clamp(56px, 5.5cqw, 80px) var(--padding-pagina) 0;
  padding: 0;
  list-style: none;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  border: 1px solid var(--bordo);
  border-radius: var(--raggio-card);
  overflow: hidden;
}

.dati--riquadro .dati__cella {
  gap: 12px;
}

.dati--riquadro .dati__valore {
  text-transform: uppercase;
}

.dati--riquadro .dati__etichetta {
  line-height: 1.5;
  color: var(--testo-secondario);
}

.sezione__nota {
  font-size: 16px;
  max-width: 380px;
}

.persona__descrizione {
  font-size: 14px;
  line-height: 1.45;
  color: var(--testo-secondario);
}

.gruppo {
  margin: var(--spazio-sezioni) var(--padding-pagina) 0;
  background: var(--superficie);
  border: 1px solid var(--bordo);
  border-radius: var(--raggio-card);
  padding: clamp(24px, 3.3cqw, 48px);
  display: flex;
  flex-wrap: wrap;
  gap: 24px 48px;
  align-items: flex-end;
  justify-content: space-between;
}

.gruppo__testo {
  flex: 1 1 480px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.gruppo__titolo {
  font-size: clamp(40px, 4.4cqw, 64px);
}

.gruppo__testo .testo-secondario {
  font-size: 16px;
  line-height: 1.55;
  max-width: 560px;
}

.gruppo .pulsante {
  font-size: 15px;
}

.loghi {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
  gap: 12px;
}

.loghi > li {
  height: 100px;
  border: 1px solid var(--bordo);
  border-radius: var(--raggio-foto-team);
}

/* — Contatti — */
.testata--contatti {
  padding-bottom: 0;
}

.testata--contatti .intro {
  max-width: 560px;
}

.h1--contatti {
  font-size: clamp(64px, 8cqw, 120px);
  line-height: 0.86;
}

.contatti {
  padding: clamp(48px, 4.5cqw, 64px) var(--padding-pagina) 0;
  display: flex;
  flex-wrap: wrap;
  gap: 48px clamp(40px, 5.5cqw, 80px);
}

.recapiti {
  flex: 1 1 360px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-self: flex-start;
  border-top: 1px solid var(--testo);
}

.recapiti__voce {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 20px 0;
  border-bottom: 1px solid var(--bordo);
}

.recapiti__voce p,
.recapiti__voce address {
  margin: 0;
  font-style: normal;
  font-size: 17px;
  line-height: 1.5;
  color: var(--testo-riquadro);
}

.recapiti__grande {
  font-weight: 600;
  font-size: clamp(24px, 2cqw, 28px);
  line-height: 1.1;
  overflow-wrap: anywhere;
}

.recapiti__portale {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 20px 0;
  border-bottom: 1px solid var(--bordo);
  font-weight: 600;
  font-size: 16px;
  line-height: 1;
  color: var(--accento);
}

.recapiti__portale::after {
  content: "→";
}

.contatti__form {
  flex: 1.4 1 520px;
  min-width: 0;
  background: var(--superficie);
  border: 1px solid var(--bordo);
  border-radius: var(--raggio-card);
  padding: clamp(20px, 2.8cqw, 40px);
}

.mappa {
  margin: clamp(64px, 6.7cqw, 96px) var(--padding-pagina);
  height: clamp(240px, 28cqw, 420px);
  border: 1px solid var(--bordo);
  border-radius: var(--raggio-card);
}

/* — Form contatti — */
.form-contatti {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.form-contatti[hidden],
.conferma[hidden],
.campo[hidden],
.preventivo-allegato[hidden] {
  display: none;
}

.preventivo-allegato {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid var(--accento);
  border-radius: var(--raggio-controlli);
  padding: 14px 16px;
}

.preventivo-allegato__corpo {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.preventivo-allegato .etichetta {
  color: var(--accento);
}

.preventivo-allegato__testo {
  margin: 0;
  font-size: 14px;
  line-height: 1.45;
  white-space: pre-line;
}

.preventivo-allegato__rimuovi {
  align-self: flex-start;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  line-height: 1;
  color: var(--etichetta);
}

/* Le scelte sono radio veri, nascosti: il riquadro è la loro etichetta. */
.scelte {
  margin: 0;
  padding: 0;
  border: 0;
  display: flex;
  flex-wrap: wrap;
  min-width: 0;
}

.scelte label {
  position: relative;
}

.scelte input {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
}

.scelte span {
  height: 44px;
  display: flex;
  align-items: center;
  white-space: nowrap;
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  color: var(--testo);
}

.scelte input:checked + span {
  background: var(--accento);
  color: var(--sfondo);
}

.scelte input:focus-visible + span {
  outline: 2px solid var(--accento);
  outline-offset: 2px;
}

.scelte--segmenti {
  align-self: flex-start;
  border: 1px solid var(--bordo-pulsante);
  border-radius: var(--raggio-controlli);
  overflow: hidden;
}

.scelte--segmenti span {
  padding: 0 18px;
  font-weight: 600;
}

.scelte--chip {
  gap: 8px;
}

.scelte--chip span {
  padding: 0 14px;
  border: 1px solid var(--bordo-pulsante);
  border-radius: var(--raggio-controlli);
  font-weight: 500;
}

.scelte--chip input:checked + span {
  border-color: var(--accento);
}

.campi {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 0 24px;
}

.campo {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 0;
  border-bottom: 1px solid var(--bordo-input);
}

.campo:has([aria-invalid="true"]) {
  border-bottom-color: var(--errore);
}

.campo input,
.campo textarea {
  border: 0;
  background: transparent;
  padding: 6px 0;
  font: inherit;
  font-weight: 500;
  font-size: 18px;
  color: var(--testo);
}

.campo textarea {
  font-weight: 400;
  font-size: 17px;
  line-height: 1.5;
  resize: vertical;
}

.campo input:focus-visible,
.campo textarea:focus-visible {
  outline: 0;
}

.campo:focus-within {
  border-bottom-color: var(--accento);
}

.campo__errore {
  font-size: 13px;
  line-height: 1.3;
  color: var(--errore);
}

.consenso {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.consenso__voce {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  cursor: pointer;
  font-size: 14px;
  line-height: 1.45;
  color: var(--testo-secondario);
}

.consenso__voce input {
  margin: 3px 0 0;
  width: 18px;
  height: 18px;
  flex: none;
  accent-color: var(--accento);
}

.consenso__voce a {
  text-decoration: underline;
}

.form-contatti__errore-invio {
  margin: 0;
  font-size: 15px;
  line-height: 1.5;
  color: var(--errore);
}

.form-contatti__errore-invio a {
  text-decoration: underline;
}

.form-contatti .pulsante {
  align-self: flex-start;
  height: 54px;
  padding: 0 30px;
  border: 0;
  cursor: pointer;
  font-family: inherit;
}

.conferma {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  padding: 24px 0;
}

.conferma__stato {
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 13px;
  line-height: 1;
  color: var(--accento);
  text-transform: uppercase;
}

.conferma__titolo {
  margin: 0;
  font-weight: 800;
  font-stretch: 68%;
  font-size: clamp(44px, 4cqw, 56px);
  line-height: 0.95;
  text-transform: uppercase;
}

.conferma__titolo:focus {
  outline: 0;
}

.conferma .testo-secondario {
  font-size: 17px;
}

.conferma .pulsante {
  margin-top: 8px;
  height: 48px;
  padding: 0 20px;
  background: transparent;
  color: var(--testo);
  cursor: pointer;
  font-family: inherit;
  font-size: 15px;
}

/* — Preventivo: testata chiara — */
.banda-chiara--preventivo {
  padding-top: clamp(48px, 6cqw, 88px);
}

.testata-chiara {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.banda-chiara .briciole {
  color: var(--chiaro-etichetta);
}

.banda-chiara .briciole li + li::before {
  color: var(--chiaro-etichetta);
}

.banda-chiara .briciole [aria-current="page"] {
  color: var(--accento-scuro);
}

.banda-chiara .intro {
  color: #4f5a52;
  max-width: 560px;
}

.banda-chiara :focus-visible {
  outline-color: var(--accento-scuro);
}

.note-preventivo {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: 24px 32px;
  border-top: 1px solid var(--chiaro-bordo-controlli);
  padding-top: 28px;
}

.note-preventivo > div {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.note-preventivo .occhiello {
  font-size: 11px;
}

.note-preventivo p:not(.occhiello) {
  margin: 0;
  font-size: 15px;
  line-height: 1.5;
  color: #3f4942;
}

/* — Preventivatore — */
.preventivatore {
  display: flex;
  flex-wrap: wrap;
  border: 1px solid var(--chiaro-testo);
  border-radius: var(--raggio-card);
  overflow: hidden;
  background: var(--chiaro-sfondo);
  color: var(--chiaro-testo);
}

.preventivatore__senza-js {
  margin: 0;
  padding: 24px;
  font-size: 16px;
  line-height: 1.5;
}

.preventivatore__senza-js a {
  text-decoration: underline;
}

.preventivatore__scelte {
  flex: 2 1 560px;
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: 1px;
  background: var(--chiaro-divisore);
}

.pannello {
  margin: 0;
  border: 0;
  min-width: 0;
  background: var(--chiaro-sfondo);
  padding: clamp(20px, 2cqw, 28px);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.pannello__titolo {
  padding: 0;
  margin-bottom: 12px;
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 12px;
  line-height: 1;
  color: var(--chiaro-etichetta);
  text-transform: uppercase;
}

.pannello__select {
  height: 48px;
  padding: 0 12px;
  border: 1px solid var(--chiaro-bordo-controlli);
  border-radius: var(--raggio-controlli);
  background: var(--chiaro-sfondo);
  color: var(--chiaro-testo);
  font: inherit;
  font-weight: 500;
  font-size: 16px;
}

.pannello__inverti {
  align-self: flex-start;
  border: 0;
  background: transparent;
  padding: 8px 0;
  cursor: pointer;
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 13px;
  line-height: 1;
  color: var(--accento-scuro);
}

/* Le scelte sono radio e caselle veri, invisibili sopra il riquadro che li rappresenta. */
.scelta-temp,
.scelta-riga {
  position: relative;
  border: 1px solid var(--chiaro-bordo-controlli);
  border-radius: var(--raggio-controlli);
  background: var(--chiaro-sfondo);
  color: var(--chiaro-testo);
  cursor: pointer;
}

.scelta-temp input,
.scelta-riga input {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  cursor: inherit;
}

.scelta-temp:has(input:checked),
.scelta-riga:has(input:checked) {
  background: var(--chiaro-testo);
  border-color: var(--chiaro-testo);
  color: var(--accento);
}

.scelta-temp:has(input:focus-visible),
.scelta-riga:has(input:focus-visible) {
  outline: 2px solid var(--accento-scuro);
  outline-offset: 2px;
}

.scelta-riga:has(input:disabled) {
  opacity: 0.4;
  cursor: not-allowed;
}

.scelta-griglia {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

.scelta-colonna {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.scelta-temp {
  min-height: 56px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.scelta-temp__etichetta,
.scelta-riga__etichetta {
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 15px;
  line-height: 1;
  white-space: nowrap;
}

.scelta-temp__nome,
.scelta-riga__nome {
  font-size: 12px;
  line-height: 1;
  color: var(--chiaro-etichetta);
}

.scelta-temp:has(input:checked) .scelta-temp__nome,
.scelta-riga:has(input:checked) .scelta-riga__nome {
  color: var(--testo-riquadro);
}

.scelta-riga {
  height: 46px;
  padding: 0 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}

.scelta-riga--urgenza .scelta-riga__etichetta {
  font-family: var(--font-testo);
  font-weight: 600;
}

.scelta-riga--casella {
  justify-content: flex-start;
  gap: 10px;
}

.scelta-riga--casella::before {
  content: "";
  width: 18px;
  height: 18px;
  flex: none;
  border: 1.5px solid currentColor;
  border-radius: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 12px;
  line-height: 1;
}

.scelta-riga--casella:has(input:checked)::before {
  content: "✓";
}

.scelta-riga--casella .scelta-riga__nome {
  margin-left: auto;
  white-space: nowrap;
}

.contatori {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 6px;
}

.contatore {
  display: grid;
  grid-template-columns: 44px 1fr 44px;
  height: 46px;
  border: 1px solid var(--chiaro-bordo-controlli);
  border-radius: var(--raggio-controlli);
  overflow: hidden;
}

.contatore button {
  border: 0;
  background: var(--chiaro-contatore);
  color: var(--chiaro-testo);
  cursor: pointer;
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
}

.contatore button:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.contatore output {
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 14px;
  line-height: 1;
}

.preventivatore__stima {
  flex: 1 1 300px;
  min-width: 0;
  background: var(--chiaro-testo);
  color: var(--testo);
  padding: clamp(20px, 2cqw, 28px);
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.preventivatore__stima :focus-visible {
  outline-color: var(--accento);
}

.stima {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.stima__totale {
  font-weight: 800;
  font-stretch: 68%;
  font-size: 88px;
  line-height: 0.9;
  color: var(--accento);
}

.stima__forchetta {
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1;
  color: var(--etichetta);
}

.stima__righe {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid #2a342d;
}

.stima__righe li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid #2a342d;
  font-size: 13px;
  line-height: 1.3;
}

.stima__righe li span:first-child {
  color: var(--testo-secondario);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.stima__righe li span:last-child {
  font-family: var(--font-mono);
  white-space: nowrap;
}

.stima__nota {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--testo-riquadro);
  border-left: 2px solid var(--accento);
  padding-left: 10px;
}

.stima__nota[hidden] {
  display: none;
}

.stima__prenota {
  margin-top: auto;
  background: var(--accento);
  color: var(--sfondo);
  padding: 17px;
  border-radius: var(--raggio-controlli);
  text-align: center;
  font-weight: 600;
  font-size: 15px;
  line-height: 1;
}

/* — Preventivo: passo 2, la richiesta — */
.richiesta {
  padding: clamp(64px, 6.7cqw, 96px) var(--padding-pagina);
  display: flex;
  flex-wrap: wrap;
  gap: 40px clamp(40px, 5.5cqw, 80px);
  scroll-margin-top: 16px;
}

.richiesta__testo {
  flex: 1 1 360px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.richiesta__testo .testo-secondario {
  font-size: 16px;
  line-height: 1.55;
  max-width: 420px;
}

.richiesta__telefono {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 8px;
}

.richiesta__telefono a {
  font-weight: 600;
  font-size: 26px;
  line-height: 1.1;
}

.richiesta__form {
  flex: 1.4 1 520px;
  min-width: 0;
}
