/* Il Duo · gelato artigianale italiano · Loviisa
   Step 5: la home fedele al design del kit (Design/kit/design-il-duo/home-approvata.png), rifinita.
   Colori misurati sul design con confronta-design.py; caratteri serviti dal sito. */

@font-face {
  font-family: "Anton";
  src: url("/assets/fonts/anton-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Allura";
  src: url("/assets/fonts/allura-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/inter-variable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Barlow Condensed";
  src: url("/assets/fonts/barlow-condensed-latin-600-normal.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

:root {
  /* colori misurati sul design */
  --crema: #FDFDF4;
  --bianco: #FFFFFF;
  --nero: #0A0A0A;
  --testo: #444C5C;
  --testo-forte: #3A4150;
  --testo-2: #6C707C;
  --rosso: #E20D2A;
  --verde: #027D4A;
  --verde-banda: #027544;
  --salvia: #D6E3BF;
  --salvia-chiaro: #E9F0D9;
  --linea: #E8E8E0;
  /* stati (non nel design statico) */
  --rosso-hover: #C40A23;
  --verde-hover: #01643B;

  /* caratteri */
  --f-titolo: "Anton", "Impact", "Arial Narrow", sans-serif;
  --f-script: "Allura", "Segoe Script", cursive;
  --f-testo: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --f-stretto: "Barlow Condensed", "Arial Narrow", sans-serif;

  /* misure */
  --largo: 1300px;
  --margine: clamp(20px, 4.2vw, 64px);
  --raggio: 8px;
  --sezione: clamp(56px, 7vw, 104px);

  /* movimento (Emil Kowalski) */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
}

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

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
  scroll-behavior: smooth;
}
html.menu-aperto { overflow: hidden; }

body {
  margin: 0;
  background: var(--crema);
  color: var(--testo);
  font-family: var(--f-testo);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: clip;
}

img, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
a, button { touch-action: manipulation; }
p { margin: 0; text-wrap: pretty; }
h1, h2, h3 { margin: 0; font-weight: 400; }
ul, ol { margin: 0; padding: 0; list-style: none; }
figure { margin: 0; }

:focus-visible {
  outline: 3px solid var(--verde);
  outline-offset: 3px;
  border-radius: 4px;
}

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

.nascosto,
.salta:not(:focus) {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}
.salta:focus {
  position: fixed;
  top: 12px; left: 12px;
  z-index: 100;
  padding: 10px 16px;
  background: var(--nero);
  color: var(--bianco);
  border-radius: var(--raggio);
  text-decoration: none;
}

/* ── tipografia del design ────────────────────────────────────────────── */
.titolo {
  font-family: var(--f-titolo);
  font-weight: 400;
  color: var(--nero);
  text-transform: uppercase;
  line-height: 1;
  letter-spacing: 0.002em;
}
.titolo--basso { text-transform: none; }
.titolo--bianco { color: var(--bianco); }
.verde { color: var(--verde); }

.script {
  font-family: var(--f-script);
  font-weight: 400;
  line-height: 0.95;
  -webkit-text-stroke: 0.022em currentColor;
  paint-order: stroke fill;
  letter-spacing: 0.005em;
}
.script--rosso { color: var(--rosso); }
.script--verde { color: var(--verde); }
.script--bianco { color: var(--bianco); }

.freccia {
  display: inline-block;
  font-family: var(--f-testo);
  font-weight: 600;
  line-height: 1;
  margin-left: 0.35em;
  transform: translateY(-0.02em);
}

/* ── pulsanti e link ──────────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.1em;
  min-height: 48px;
  padding: 0.75em 1.35em;
  border: 0;
  border-radius: var(--raggio);
  font-family: var(--f-testo);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  transition: background-color 160ms ease, box-shadow 160ms ease, transform 140ms var(--ease-out);
}
.btn:active { transform: scale(0.97); }
.btn--rosso {
  background: var(--rosso);
  color: var(--bianco);
  box-shadow: 0 6px 16px -8px rgba(226, 13, 42, 0.55);
}
.btn--grande {
  font-size: clamp(17px, 1.35vw, 20px);
  padding: 0.85em 1.6em;
  min-height: 60px;
}
.btn--pieno { width: 100%; }

.link-verde {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding-bottom: 16px;
  color: var(--verde);
  font-weight: 600;
  font-size: clamp(17.5px, 1.6vw, 23px);
  text-decoration: none;
  user-select: none;
  -webkit-user-select: none;
  transition: color 160ms ease;
}
.link-verde::after {
  content: "";
  position: absolute;
  left: -2%;
  bottom: 0;
  width: 104%;
  height: 11px;
  background: url("/assets/img/sottolineatura-verde.webp") center / 100% 100% no-repeat;
  pointer-events: none;
}
.link-verde .freccia { transition: transform 200ms var(--ease-out); }

@media (hover: hover) and (pointer: fine) {
  .btn--rosso:hover { background: var(--rosso-hover); box-shadow: 0 10px 22px -10px rgba(226, 13, 42, 0.6); }
  .link-verde:hover { color: var(--verde-hover); }
  .link-verde:hover .freccia { transform: translate(3px, -3px); }
}

/* ── intestazione ─────────────────────────────────────────────────────── */
.testata {
  position: sticky;
  top: 0;
  z-index: 30;
  padding-top: env(safe-area-inset-top, 0px);
  pointer-events: none;
  transition: transform 320ms var(--ease-out);
}
.testata__fondo {
  position: absolute;
  inset: 0;
  background: var(--crema);
  transform-origin: top;
  box-shadow: 0 10px 24px -18px rgba(40, 45, 30, 0);
  transition: transform 340ms var(--ease-out), box-shadow 240ms ease;
}
.testata__in { position: relative; z-index: 1; }
.testata__in > * { pointer-events: auto; }
.testata__logo,
.testata__azioni,
.menu__voci { transition: transform 340ms var(--ease-out); }
.testata__logo { transform-origin: left top; }
/* scorrendo: la barra si accorcia (scala) e scende con la pagina; giù si nasconde, su ricompare */
.testata.is-compatta .testata__fondo {
  transform: scaleY(var(--quota, 0.62));
  box-shadow: 0 10px 24px -18px rgba(40, 45, 30, 0.35);
}
.testata.is-compatta .testata__logo { transform: scale(var(--logo, 0.6)); }
.testata.is-compatta .testata__azioni { transform: translateY(var(--su, -26px)); }
@media (min-width: 1180px) {
  .testata.is-compatta .menu__voci { transform: translateY(var(--su, -26px)); }
}
.testata.is-nascosta { transform: translateY(-110%); transition-duration: 240ms; }
.testata__in {
  display: flex;
  align-items: center;
  gap: 24px;
  max-width: calc(var(--largo) + 2 * var(--margine));
  margin-inline: auto;
  padding: 12px max(var(--margine), env(safe-area-inset-right, 0px)) 6px max(var(--margine), env(safe-area-inset-left, 0px));
}
.testata__logo {
  flex: none;
  display: block;
  width: clamp(112px, 13.4vw, 192px);
  margin-left: -6px;
}
.testata__logo img { width: 100%; }

.menu { flex: 1; display: flex; justify-content: center; }
.menu__voci {
  display: flex;
  gap: clamp(14px, 2.05vw, 32px);
}
.menu__voci a {
  position: relative;
  display: inline-block;
  padding: 10px 2px;
  color: var(--testo);
  font-size: 16px;
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none;
  user-select: none;
  -webkit-user-select: none;
  transition: color 160ms ease;
}
.menu__voci a::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 4px;
  height: 2px;
  background: var(--rosso);
  border-radius: 2px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 220ms var(--ease-out);
}
.menu__cta { display: none; }

@media (hover: hover) and (pointer: fine) {
  .menu__voci a:hover { color: var(--nero); }
  .menu__voci a:hover::after { transform: scaleX(1); }
}

.testata__azioni {
  flex: none;
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 18px;
}
/* il posto del selettore delle lingue a tendina (step 9-ter): vuoto, non si vede */
.lingue-posto { display: flex; align-items: center; }
.lingue-posto:empty { display: none; }

.btn--testata { font-size: 15.5px; min-height: 48px; padding: 0.7em 1.15em; }

.burger {
  display: none;
  position: relative;
  width: 48px;
  height: 48px;
  margin-right: -8px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--nero);
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  transition: transform 140ms var(--ease-out);
}
.burger:active { transform: scale(0.94); }
.burger span {
  position: absolute;
  left: 12px;
  width: 24px;
  height: 2.5px;
  border-radius: 2px;
  background: currentColor;
  transition: transform 260ms var(--ease-out), opacity 160ms ease;
}
.burger span:nth-child(1) { top: 16px; }
.burger span:nth-child(2) { top: 23px; }
.burger span:nth-child(3) { top: 30px; }
.burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ── 01 · hero ────────────────────────────────────────────────────────── */
.hero {
  position: relative;
  overflow-x: clip;
}
.hero__griglia {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  align-items: start;
}
.hero__testo {
  position: relative;
  z-index: 2;
  padding: clamp(34px, 2.8vw, 42px) 0 clamp(36px, 4vw, 64px);
}
.hero__script {
  font-size: clamp(44px, 5.4vw, 78px);
  transform: rotate(-5deg);
  transform-origin: left bottom;
  margin: 0 0 clamp(4px, 0.8vw, 14px) 0.04em;
}
.hero__script br + * { display: inline; }
.hero__h1, .formati__h2, .trailer__h2, .pc__h2-chioschi { margin: 0; font-weight: 400; }
.hero__script, .hero__titolo, .formati__script, .formati__titolo, .trailer__titolo, .trailer__script,
.pc__titolo-chioschi, .pc__sotto { display: block; }
.hero__titolo .riga { display: block; }
.hero__titolo {
  font-size: clamp(60px, 7.8vw, 112px);
  line-height: 0.95;
  /* inclinato da manifesto, come nel design: la riga sale verso destra, le lettere restano dritte */
  transform: skewY(-3.5deg);
  transform-origin: left center;
  margin-top: 10px;
}
.hero__segno {
  width: clamp(240px, 25vw, 360px);
  height: auto;
  margin: clamp(2px, 0.4vw, 6px) 0 0 clamp(36px, 5vw, 84px);
  transform: rotate(-4deg);
}
.hero__lead {
  max-width: 24em;
  margin: clamp(8px, 0.9vw, 12px) 0 clamp(20px, 1.9vw, 26px);
  color: var(--testo);
  font-size: clamp(18px, 1.68vw, 24px);
  line-height: 1.4;
  font-weight: 450;
}

.hero__visual {
  position: relative;
  height: clamp(440px, 64vw, 920px);
  margin-right: clamp(-40px, -2vw, 0px);
  overflow: clip;
  overflow-clip-margin: 40px;
}
.hero__cerchio {
  position: absolute;
  top: 50%;
  left: 54%;
  width: min(96%, 760px);
  aspect-ratio: 1;
  transform: translate(-50%, -55%);
  filter: saturate(1.9) brightness(0.955);
}
.hero__cono {
  position: absolute;
  bottom: 0;
  left: 56%;
  height: 100%;
  width: auto;
  max-width: none;
  transform: translateX(-50%);
}
.hero__guarnizione {
  position: absolute;
  width: clamp(58px, 7.8vw, 118px);
  filter: drop-shadow(0 14px 14px rgba(60, 40, 20, 0.2));
}
.hero__guarnizione--suklaa { top: 16%; left: 12%; rotate: -18deg; }
.hero__guarnizione--nocciola { top: 30%; right: 1%; width: clamp(50px, 6vw, 94px); rotate: 12deg; }
.hero__guarnizione--pistaasi { top: 60%; left: 13%; width: clamp(52px, 6.6vw, 100px); rotate: -8deg; }

/* ── 02 · punti di forza ──────────────────────────────────────────────── */
.punti { padding: clamp(28px, 3vw, 44px) 0 clamp(36px, 4vw, 60px); }
.punti__lista {
  display: grid;
  grid-template-columns: 1.35fr 1fr 1fr 1.35fr 1fr;
  align-items: stretch;
}
.punto {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  padding: 6px 12px;
  text-align: center;
  border-left: 1px solid var(--linea);
}
.punto:first-child { border-left: 0; align-items: flex-start; }
.punto__marchio { width: clamp(150px, 15.5vw, 222px); }
.punto--finlandia .punto__nome { padding-left: clamp(6px, 0.8vw, 12px); max-width: 13em; text-align: left; }
.punto__link { margin: -2px 0 0 clamp(6px, 0.8vw, 12px); padding-bottom: 12px; font-size: clamp(15px, 1.2vw, 17px); }
.punto__icone {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 10px;
  height: clamp(62px, 6.4vw, 92px);
}
.punto__icone img { height: 100%; width: auto; }
.punto__icone--due img { height: 92%; }
.punto__nome {
  color: var(--testo-forte);
  font-size: clamp(15.5px, 1.53vw, 22px);
  font-weight: 550;
  line-height: 1.28;
}

/* ── 03 · formati ─────────────────────────────────────────────────────── */
.formati { padding: clamp(28px, 3vw, 44px) 0 clamp(40px, 4.4vw, 64px); overflow-x: clip; }
.formati__script {
  font-size: clamp(40px, 4.7vw, 68px);
  transform: rotate(-4deg);
  transform-origin: left bottom;
  margin-bottom: clamp(4px, 0.6vw, 10px);
}
.formati__titolo {
  font-size: clamp(54px, 7.8vw, 112px);
  transform: skewY(-3deg);
  transform-origin: left center;
}

.formati__lista {
  display: grid;
  grid-template-columns: 1.3fr 0.82fr 1.08fr;
  gap: clamp(16px, 3vw, 48px);
  align-items: end;
  margin-top: clamp(4px, 1.2vw, 18px);
}
.formato { display: flex; flex-direction: column; align-items: center; }
.formato__img {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 100%;
}
.formato--vaschetta .formato__img img { width: 100%; max-width: 520px; transform: translateY(6%); }
.formato--coppetta .formato__img img { width: 72%; max-width: 230px; }
.formato--barattolini .formato__img { justify-content: center; }
.formato__barattolo--1 { width: 56%; max-width: 236px; position: relative; z-index: 1; }
.formato__barattolo--2 { width: 46%; max-width: 196px; margin-left: -4%; }
.formato__nome {
  position: relative;
  margin-top: clamp(16px, 2vw, 30px);
  padding-top: 10px;
  color: var(--testo-forte);
  font-size: clamp(15px, 1.53vw, 22px);
  font-weight: 500;
  text-align: center;
}
.formato__nome::before {
  content: "";
  position: absolute;
  top: -6px;
  left: -42%;
  width: 72%;
  height: 9px;
  background: url("/assets/img/sottolineatura-verde.webp") left center / 100% 100% no-repeat;
}
.formati__clienti {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px 0;
  margin-top: clamp(26px, 3vw, 44px);
  padding-top: clamp(18px, 1.8vw, 26px);
  border-top: 1px solid var(--linea);
  color: var(--testo-2);
  font-size: clamp(14px, 1.25vw, 18px);
  font-weight: 500;
}
.formati__voce { white-space: nowrap; }
.formati__intro { margin-right: 0.85em; color: var(--testo); }
.formati__voce:not(:last-of-type)::after {
  content: "·";
  margin: 0 0.85em;
  color: var(--testo-2);
}
.formati__link {
  margin-left: 1.2em;
  color: var(--verde);
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none;
  transition: color 160ms ease;
}
.formati__link .freccia { transition: transform 200ms var(--ease-out); }
@media (hover: hover) and (pointer: fine) {
  .formati__link:hover { color: var(--verde-hover); }
  .formati__link:hover .freccia { transform: translate(3px, -3px); }
}

/* ── 04 · gusti ───────────────────────────────────────────────────────── */
.gusti { padding: clamp(24px, 3vw, 40px) 0 clamp(48px, 5.4vw, 80px); }
.gusti__titolo {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0 clamp(14px, 2vw, 30px);
  margin-left: clamp(0px, 0.4vw, 8px);
}
.gusti__titolo .titolo { font-size: clamp(46px, 5.2vw, 76px); }
.gusti__titolo .script {
  font-size: clamp(46px, 5.5vw, 80px);
  transform: rotate(-4deg) translateY(-0.06em);
  transform-origin: left bottom;
}
.gusti__riga {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(20px, 3vw, 48px);
  margin-top: clamp(18px, 2.4vw, 34px);
}
.gusti__lista {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(14px, 2.4vw, 40px);
}
.gusto {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.gusto img {
  height: clamp(90px, 11vw, 160px);
  width: auto;
  object-fit: contain;
  filter: drop-shadow(0 12px 12px rgba(60, 40, 20, 0.12));
}
.gusto span {
  color: var(--testo-forte);
  font-size: clamp(15.5px, 1.53vw, 22px);
  font-weight: 500;
}
.gusti__lato {
  align-self: center;
  max-width: 300px;
  margin-left: clamp(0px, 1vw, 16px);
  padding: 10px 0 10px clamp(24px, 3vw, 44px);
  border-left: 1px solid var(--linea);
}
.gusti__testo {
  margin-bottom: 14px;
  color: var(--testo);
  font-size: clamp(16px, 1.3vw, 18.5px);
  line-height: 1.45;
}
.gusti__catalogo { white-space: nowrap; }

/* ── 05 · trailer ─────────────────────────────────────────────────────── */
.trailer {
  position: relative;
  padding: clamp(36px, 3.2vw, 48px) 0;
  background: var(--salvia-chiaro);
  overflow-x: clip;
}
/* il bordo a pennello del design: la fascia salvia ha i bordi sfrangiati in alto e in basso */
.trailer, .sezione--salvia { clip-path: polygon(0.0% 2.3px, 0.67% 4.6px, 1.33% 2.5px, 2.0% 0.9px, 2.67% 3.1px, 3.33% 0.5px, 4.0% 0.5px, 4.67% 10.9px, 5.33% 4.8px, 6.0% 3.1px, 6.67% 0.1px, 7.33% 0.3px, 8.0% 7.8px, 8.67% 2.2px, 9.33% 2.6px, 10.0% 2.5px, 10.67% 2.3px, 11.33% 5.0px, 12.0% 4.2px, 12.67% 1.6px, 13.33% 9.6px, 14.0% 2.0px, 14.67% 1.9px, 15.33% 6.3px, 16.0% 4.6px, 16.67% 4.9px, 17.33% 0.4px, 18.0% 3.9px, 18.67% 0.4px, 19.33% 4.8px, 20.0% 0.6px, 20.67% 9.8px, 21.33% 0.9px, 22.0% 2.2px, 22.67% 3.7px, 23.33% 3.2px, 24.0% 2.1px, 24.67% 1.3px, 25.33% 4.0px, 26.0% 4.4px, 26.67% 2.0px, 27.33% 3.2px, 28.0% 4.9px, 28.67% 1.3px, 29.33% 1.6px, 30.0% 8.5px, 30.67% 1.2px, 31.33% 1.9px, 32.0% 4.8px, 32.67% 2.9px, 33.33% 0.9px, 34.0% 4.5px, 34.67% 1.2px, 35.33% 3.7px, 36.0% 1.0px, 36.67% 4.4px, 37.33% 2.1px, 38.0% 0.2px, 38.67% 1.2px, 39.33% 1.3px, 40.0% 3.0px, 40.67% 0.9px, 41.33% 0.3px, 42.0% 2.8px, 42.67% 3.1px, 43.33% 4.6px, 44.0% 0.1px, 44.67% 6.1px, 45.33% 1.8px, 46.0% 0.7px, 46.67% 4.5px, 47.33% 3.3px, 48.0% 2.9px, 48.67% 10.5px, 49.33% 3.5px, 50.0% 0.1px, 50.67% 2.4px, 51.33% 1.6px, 52.0% 0.4px, 52.67% 3.7px, 53.33% 3.7px, 54.0% 4.0px, 54.67% 1.8px, 55.33% 4.5px, 56.0% 2.1px, 56.67% 4.3px, 57.33% 3.1px, 58.0% 2.9px, 58.67% 0.4px, 59.33% 5.0px, 60.0% 3.6px, 60.67% 3.7px, 61.33% 2.2px, 62.0% 0.4px, 62.67% 0.1px, 63.33% 2.4px, 64.0% 3.5px, 64.67% 3.1px, 65.33% 6.8px, 66.0% 3.4px, 66.67% 0.8px, 67.33% 3.3px, 68.0% 4.5px, 68.67% 3.3px, 69.33% 2.2px, 70.0% 4.6px, 70.67% 1.9px, 71.33% 1.6px, 72.0% 2.5px, 72.67% 4.2px, 73.33% 4.8px, 74.0% 0.8px, 74.67% 1.4px, 75.33% 2.1px, 76.0% 2.5px, 76.67% 4.2px, 77.33% 5.2px, 78.0% 9.3px, 78.67% 2.9px, 79.33% 5.8px, 80.0% 10.0px, 80.67% 1.2px, 81.33% 0.2px, 82.0% 2.2px, 82.67% 3.3px, 83.33% 4.8px, 84.0% 1.0px, 84.67% 7.8px, 85.33% 3.6px, 86.0% 1.4px, 86.67% 3.5px, 87.33% 3.1px, 88.0% 2.0px, 88.67% 10.6px, 89.33% 3.6px, 90.0% 2.3px, 90.67% 4.5px, 91.33% 2.8px, 92.0% 4.0px, 92.67% 2.3px, 93.33% 1.0px, 94.0% 4.1px, 94.67% 3.6px, 95.33% 4.5px, 96.0% 4.9px, 96.67% 4.0px, 97.33% 4.5px, 98.0% 7.6px, 98.67% 2.8px, 99.33% 9.9px, 100.0% 0.3px, 100.0% calc(100% - 2.4px), 99.33% calc(100% - 3.3px), 98.67% calc(100% - 0.1px), 98.0% calc(100% - 1.4px), 97.33% calc(100% - 3.5px), 96.67% calc(100% - 2.8px), 96.0% calc(100% - 0.7px), 95.33% calc(100% - 0.8px), 94.67% calc(100% - 0.3px), 94.0% calc(100% - 0.4px), 93.33% calc(100% - 1.7px), 92.67% calc(100% - 5.4px), 92.0% calc(100% - 4.6px), 91.33% calc(100% - 0.5px), 90.67% calc(100% - 4.7px), 90.0% calc(100% - 2.1px), 89.33% calc(100% - 1.6px), 88.67% calc(100% - 0.8px), 88.0% calc(100% - 0.3px), 87.33% calc(100% - 4.1px), 86.67% calc(100% - 2.1px), 86.0% calc(100% - 2.4px), 85.33% calc(100% - 0.2px), 84.67% calc(100% - 4.8px), 84.0% calc(100% - 3.3px), 83.33% calc(100% - 1.8px), 82.67% calc(100% - 3.4px), 82.0% calc(100% - 1.2px), 81.33% calc(100% - 2.6px), 80.67% calc(100% - 9.9px), 80.0% calc(100% - 2.2px), 79.33% calc(100% - 1.1px), 78.67% calc(100% - 1.9px), 78.0% calc(100% - 0.5px), 77.33% calc(100% - 0.9px), 76.67% calc(100% - 0.2px), 76.0% calc(100% - 1.7px), 75.33% calc(100% - 0.3px), 74.67% calc(100% - 1.0px), 74.0% calc(100% - 2.4px), 73.33% calc(100% - 2.4px), 72.67% calc(100% - 0.8px), 72.0% calc(100% - 1.8px), 71.33% calc(100% - 3.7px), 70.67% calc(100% - 0.0px), 70.0% calc(100% - 3.9px), 69.33% calc(100% - 5.2px), 68.67% calc(100% - 3.1px), 68.0% calc(100% - 5.0px), 67.33% calc(100% - 0.1px), 66.67% calc(100% - 3.9px), 66.0% calc(100% - 3.2px), 65.33% calc(100% - 2.6px), 64.67% calc(100% - 3.1px), 64.0% calc(100% - 4.7px), 63.33% calc(100% - 0.8px), 62.67% calc(100% - 4.4px), 62.0% calc(100% - 4.7px), 61.33% calc(100% - 3.5px), 60.67% calc(100% - 1.1px), 60.0% calc(100% - 1.3px), 59.33% calc(100% - 3.5px), 58.67% calc(100% - 4.4px), 58.0% calc(100% - 1.2px), 57.33% calc(100% - 4.9px), 56.67% calc(100% - 3.1px), 56.0% calc(100% - 4.8px), 55.33% calc(100% - 2.1px), 54.67% calc(100% - 4.5px), 54.0% calc(100% - 2.9px), 53.33% calc(100% - 1.8px), 52.67% calc(100% - 9.3px), 52.0% calc(100% - 4.5px), 51.33% calc(100% - 4.5px), 50.67% calc(100% - 2.7px), 50.0% calc(100% - 7.1px), 49.33% calc(100% - 1.6px), 48.67% calc(100% - 3.4px), 48.0% calc(100% - 3.1px), 47.33% calc(100% - 2.7px), 46.67% calc(100% - 2.0px), 46.0% calc(100% - 2.0px), 45.33% calc(100% - 3.4px), 44.67% calc(100% - 0.5px), 44.0% calc(100% - 3.5px), 43.33% calc(100% - 3.3px), 42.67% calc(100% - 7.9px), 42.0% calc(100% - 2.2px), 41.33% calc(100% - 3.3px), 40.67% calc(100% - 1.2px), 40.0% calc(100% - 7.2px), 39.33% calc(100% - 1.4px), 38.67% calc(100% - 2.2px), 38.0% calc(100% - 4.6px), 37.33% calc(100% - 3.5px), 36.67% calc(100% - 2.3px), 36.0% calc(100% - 4.2px), 35.33% calc(100% - 2.3px), 34.67% calc(100% - 4.2px), 34.0% calc(100% - 2.7px), 33.33% calc(100% - 2.0px), 32.67% calc(100% - 3.3px), 32.0% calc(100% - 2.8px), 31.33% calc(100% - 1.8px), 30.67% calc(100% - 1.6px), 30.0% calc(100% - 1.8px), 29.33% calc(100% - 0.7px), 28.67% calc(100% - 2.7px), 28.0% calc(100% - 0.2px), 27.33% calc(100% - 1.4px), 26.67% calc(100% - 3.0px), 26.0% calc(100% - 4.4px), 25.33% calc(100% - 1.6px), 24.67% calc(100% - 3.2px), 24.0% calc(100% - 3.0px), 23.33% calc(100% - 2.1px), 22.67% calc(100% - 1.3px), 22.0% calc(100% - 1.9px), 21.33% calc(100% - 2.0px), 20.67% calc(100% - 0.8px), 20.0% calc(100% - 1.3px), 19.33% calc(100% - 10.0px), 18.67% calc(100% - 4.4px), 18.0% calc(100% - 1.8px), 17.33% calc(100% - 1.5px), 16.67% calc(100% - 4.3px), 16.0% calc(100% - 1.1px), 15.33% calc(100% - 0.1px), 14.67% calc(100% - 0.1px), 14.0% calc(100% - 0.8px), 13.33% calc(100% - 1.5px), 12.67% calc(100% - 0.9px), 12.0% calc(100% - 4.3px), 11.33% calc(100% - 0.5px), 10.67% calc(100% - 2.7px), 10.0% calc(100% - 2.6px), 9.33% calc(100% - 4.0px), 8.67% calc(100% - 3.2px), 8.0% calc(100% - 3.2px), 7.33% calc(100% - 2.1px), 6.67% calc(100% - 3.6px), 6.0% calc(100% - 4.6px), 5.33% calc(100% - 4.3px), 4.67% calc(100% - 4.8px), 4.0% calc(100% - 2.1px), 3.33% calc(100% - 3.0px), 2.67% calc(100% - 4.2px), 2.0% calc(100% - 0.3px), 1.33% calc(100% - 5.1px), 0.67% calc(100% - 1.2px), 0.0% calc(100% - 3.4px)); }
.trailer__griglia {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.13fr) minmax(0, 1fr);
  gap: clamp(28px, 4.4vw, 72px);
  align-items: center;
}
.trailer__foto {
  overflow: hidden;
  border-radius: 4px;
  box-shadow: 0 22px 40px -26px rgba(40, 50, 30, 0.45);
}
.trailer__foto img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.trailer__testo { position: relative; padding-right: clamp(0px, 1vw, 16px); }
.trailer__sole {
  position: absolute;
  top: clamp(52px, 5.4vw, 80px);
  right: clamp(4px, 3vw, 44px);
  width: clamp(58px, 6.8vw, 100px);
}
.trailer__titolo { position: relative; font-size: clamp(46px, 5.3vw, 78px); }
.trailer__script {
  font-size: clamp(44px, 4.6vw, 68px);
  transform: rotate(-5deg);
  transform-origin: left bottom;
  margin: clamp(10px, 1vw, 14px) 0 clamp(14px, 1.6vw, 24px);
}
.trailer__corpo {
  max-width: 25em;
  font-size: clamp(17px, 1.64vw, 23.5px);
  line-height: 1.42;
}
.trailer__corpo strong { color: var(--nero); font-weight: 650; }
.trailer__azioni {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px 24px;
  margin-top: clamp(22px, 2.4vw, 36px);
}
.trailer__solo {
  font-size: clamp(16.5px, 1.53vw, 22px);
  line-height: 1.38;
}
.trailer__solo strong { color: var(--nero); font-weight: 650; }
.trailer__solo a {
  color: var(--testo);
  text-decoration: underline;
  text-decoration-color: rgba(68, 76, 92, 0.35);
  text-underline-offset: 3px;
  transition: text-decoration-color 160ms ease, color 160ms ease;
}
@media (hover: hover) and (pointer: fine) {
  .trailer__solo a:hover { color: var(--verde); text-decoration-color: currentColor; }
}

/* ── 06 · laboratorio ─────────────────────────────────────────────────── */
.laboratorio { padding: clamp(64px, 6.4vw, 96px) 0 clamp(40px, 4vw, 60px); }
.laboratorio__griglia {
  display: grid;
  grid-template-columns: minmax(0, 1.13fr) minmax(0, 1fr);
  gap: clamp(28px, 4.4vw, 72px);
  align-items: center;
}
.video-box {
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  background: #1d1d1b;
  box-shadow: 0 22px 40px -26px rgba(30, 30, 30, 0.5);
  margin-left: clamp(0px, 2.6vw, 40px);
}
.video-box__video {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.video-box__nota {
  position: absolute;
  right: clamp(14px, 3.6vw, 56px);
  bottom: clamp(12px, 2.2vw, 30px);
  padding-bottom: 8px;
  color: var(--bianco);
  font-family: var(--f-script);
  font-size: clamp(22px, 2.3vw, 34px);
  line-height: 1;
  -webkit-text-stroke: 0.02em currentColor;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
  pointer-events: none;
}
.video-box__nota::after {
  content: "";
  position: absolute;
  left: -6%;
  bottom: -2px;
  width: 125%;
  height: 8px;
  background: url("/assets/img/sottolineatura-rossa.webp") center / 100% 100% no-repeat;
}
.laboratorio__titolo { font-size: clamp(46px, 5vw, 74px); line-height: 1.1; }
.laboratorio__corpo--dopo { margin-top: calc(-1 * clamp(8px, 1.2vw, 18px)); }
.laboratorio__corpo {
  max-width: 24em;
  margin: clamp(14px, 1.6vw, 22px) 0 clamp(22px, 2.4vw, 34px);
  font-size: clamp(17px, 1.64vw, 23.5px);
  line-height: 1.42;
}

/* ── 07 · premio e chioschi ───────────────────────────────────────────── */
.premio-chioschi { padding: clamp(24px, 3vw, 44px) 0 clamp(44px, 4.6vw, 70px); overflow-x: clip; }
.pc__griglia {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: clamp(24px, 3.4vw, 56px);
  align-items: center;
}
.pc__blocco {
  display: grid;
  align-items: center;
  gap: clamp(18px, 2.6vw, 40px);
}
.pc__premio { grid-template-columns: minmax(0, 0.82fr) minmax(0, 1fr); }
.pc__chioschi { grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr); }
.pc__attestato {
  width: 100%;
  max-width: 250px;
  margin-left: clamp(0px, 1.4vw, 20px);
  transform: rotate(-1.5deg);
  box-shadow: 0 18px 30px -18px rgba(60, 40, 90, 0.45);
}
.pc__titolo-premio {
  color: var(--verde);
  font-family: var(--f-stretto);
  font-weight: 600;
  font-size: clamp(26px, 2.6vw, 38px);
  line-height: 1.05;
  letter-spacing: 0.005em;
}
.pc__testo p {
  margin-top: 10px;
  color: var(--testo);
  font-size: clamp(16.5px, 1.64vw, 23.5px);
  line-height: 1.38;
}
.pc__foto {
  overflow: hidden;
  border-radius: 4px;
  box-shadow: 0 18px 30px -20px rgba(40, 50, 30, 0.45);
}
.pc__chiosco {
  width: 100%;
  aspect-ratio: 1.55;
  object-fit: cover;
  object-position: 62% 50%;
}
.pc__sotto {
  margin-top: 8px;
  color: var(--testo);
  font-family: var(--f-testo);
  font-size: clamp(16.5px, 1.64vw, 23.5px);
  line-height: 1.38;
}
.pc__link { margin-top: 14px; }
.pc__titolo-chioschi {
  font-size: clamp(40px, 3.7vw, 56px);
  transform: rotate(-9deg);
  transform-origin: left bottom;
}

/* ── 08 · contatti ────────────────────────────────────────────────────── */
.contatti { padding: clamp(16px, 2vw, 28px) 0 clamp(20px, 2.6vw, 36px); }
.contatti__banda, .banda-cta {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  gap: clamp(28px, 4vw, 64px);
  align-items: center;
  margin-inline: clamp(-24px, -1.6vw, 0px);
  padding: clamp(40px, 3.6vw, 54px) clamp(40px, 6vw, 96px) clamp(40px, 3.6vw, 54px) clamp(40px, 6.6vw, 100px);
  background: var(--verde-banda);
  /* il bordo a pennello del design, sfrangiato sui quattro lati */
  clip-path: polygon(0.0% 1.6px, 0.83% 8.8px, 1.67% 8.6px, 2.5% 0.2px, 3.33% 8.0px, 4.17% 4.1px, 5.0% 1.1px, 5.83% 4.7px, 6.67% 2.0px, 7.5% 0.2px, 8.33% 1.4px, 9.17% 0.6px, 10.0% 4.1px, 10.83% 2.9px, 11.67% 1.9px, 12.5% 6.4px, 13.33% 3.4px, 14.17% 1.6px, 15.0% 2.3px, 15.83% 4.0px, 16.67% 1.2px, 17.5% 2.6px, 18.33% 3.6px, 19.17% 4.9px, 20.0% 2.1px, 20.83% 0.8px, 21.67% 0.2px, 22.5% 3.8px, 23.33% 4.4px, 24.17% 3.5px, 25.0% 2.9px, 25.83% 4.2px, 26.67% 2.4px, 27.5% 0.3px, 28.33% 3.2px, 29.17% 4.1px, 30.0% 1.9px, 30.83% 0.1px, 31.67% 0.8px, 32.5% 0.3px, 33.33% 0.6px, 34.17% 2.0px, 35.0% 0.4px, 35.83% 2.7px, 36.67% 4.1px, 37.5% 1.4px, 38.33% 1.8px, 39.17% 4.8px, 40.0% 0.9px, 40.83% 1.2px, 41.67% 2.9px, 42.5% 0.0px, 43.33% 1.8px, 44.17% 4.8px, 45.0% 2.6px, 45.83% 11.3px, 46.67% 3.9px, 47.5% 4.0px, 48.33% 2.0px, 49.17% 5.5px, 50.0% 1.0px, 50.83% 5.0px, 51.67% 0.8px, 52.5% 11.1px, 53.33% 3.1px, 54.17% 1.3px, 55.0% 1.8px, 55.83% 4.2px, 56.67% 2.3px, 57.5% 0.4px, 58.33% 1.7px, 59.17% 4.1px, 60.0% 0.1px, 60.83% 2.6px, 61.67% 8.7px, 62.5% 4.9px, 63.33% 3.5px, 64.17% 1.8px, 65.0% 3.9px, 65.83% 3.9px, 66.67% 1.1px, 67.5% 4.9px, 68.33% 4.0px, 69.17% 3.7px, 70.0% 2.6px, 70.83% 7.0px, 71.67% 1.3px, 72.5% 4.8px, 73.33% 4.7px, 74.17% 4.8px, 75.0% 1.1px, 75.83% 1.0px, 76.67% 3.1px, 77.5% 4.2px, 78.33% 3.3px, 79.17% 0.4px, 80.0% 4.5px, 80.83% 3.8px, 81.67% 0.9px, 82.5% 1.7px, 83.33% 4.9px, 84.17% 2.0px, 85.0% 3.6px, 85.83% 0.6px, 86.67% 4.5px, 87.5% 0.7px, 88.33% 4.9px, 89.17% 1.8px, 90.0% 11.8px, 90.83% 3.2px, 91.67% 4.7px, 92.5% 4.4px, 93.33% 1.1px, 94.17% 1.5px, 95.0% 2.9px, 95.83% 2.1px, 96.67% 4.6px, 97.5% 2.3px, 98.33% 4.5px, 99.17% 4.6px, 100.0% 2.7px, calc(100% - 3.5px) 3.85%, calc(100% - 4.9px) 7.69%, calc(100% - 3.9px) 11.54%, calc(100% - 3.1px) 15.38%, calc(100% - 1.5px) 19.23%, calc(100% - 13.7px) 23.08%, calc(100% - 3.6px) 26.92%, calc(100% - 1.7px) 30.77%, calc(100% - 2.7px) 34.62%, calc(100% - 4.0px) 38.46%, calc(100% - 4.6px) 42.31%, calc(100% - 5.8px) 46.15%, calc(100% - 7.2px) 50.0%, calc(100% - 5.6px) 53.85%, calc(100% - 2.2px) 57.69%, calc(100% - 1.9px) 61.54%, calc(100% - 11.3px) 65.38%, calc(100% - 5.1px) 69.23%, calc(100% - 1.3px) 73.08%, calc(100% - 0.2px) 76.92%, calc(100% - 4.9px) 80.77%, calc(100% - 3.2px) 84.62%, calc(100% - 0.9px) 88.46%, calc(100% - 2.2px) 92.31%, calc(100% - 0.7px) 96.15%, 100.0% calc(100% - 1.1px), 99.17% calc(100% - 0.6px), 98.33% calc(100% - 0.4px), 97.5% calc(100% - 5.0px), 96.67% calc(100% - 3.2px), 95.83% calc(100% - 2.3px), 95.0% calc(100% - 1.0px), 94.17% calc(100% - 0.4px), 93.33% calc(100% - 0.1px), 92.5% calc(100% - 2.0px), 91.67% calc(100% - 1.9px), 90.83% calc(100% - 1.3px), 90.0% calc(100% - 0.3px), 89.17% calc(100% - 1.9px), 88.33% calc(100% - 1.7px), 87.5% calc(100% - 2.5px), 86.67% calc(100% - 4.5px), 85.83% calc(100% - 11.6px), 85.0% calc(100% - 2.4px), 84.17% calc(100% - 4.7px), 83.33% calc(100% - 3.6px), 82.5% calc(100% - 1.4px), 81.67% calc(100% - 4.4px), 80.83% calc(100% - 9.8px), 80.0% calc(100% - 3.5px), 79.17% calc(100% - 4.2px), 78.33% calc(100% - 1.0px), 77.5% calc(100% - 2.6px), 76.67% calc(100% - 0.4px), 75.83% calc(100% - 2.5px), 75.0% calc(100% - 1.1px), 74.17% calc(100% - 0.1px), 73.33% calc(100% - 1.3px), 72.5% calc(100% - 1.9px), 71.67% calc(100% - 4.5px), 70.83% calc(100% - 2.0px), 70.0% calc(100% - 3.3px), 69.17% calc(100% - 1.0px), 68.33% calc(100% - 10.4px), 67.5% calc(100% - 1.7px), 66.67% calc(100% - 2.2px), 65.83% calc(100% - 2.1px), 65.0% calc(100% - 2.1px), 64.17% calc(100% - 5.6px), 63.33% calc(100% - 0.5px), 62.5% calc(100% - 1.8px), 61.67% calc(100% - 2.5px), 60.83% calc(100% - 5.1px), 60.0% calc(100% - 0.7px), 59.17% calc(100% - 2.9px), 58.33% calc(100% - 1.8px), 57.5% calc(100% - 0.0px), 56.67% calc(100% - 1.1px), 55.83% calc(100% - 0.2px), 55.0% calc(100% - 3.8px), 54.17% calc(100% - 2.9px), 53.33% calc(100% - 4.8px), 52.5% calc(100% - 0.4px), 51.67% calc(100% - 2.5px), 50.83% calc(100% - 0.8px), 50.0% calc(100% - 2.9px), 49.17% calc(100% - 0.6px), 48.33% calc(100% - 3.6px), 47.5% calc(100% - 2.4px), 46.67% calc(100% - 1.8px), 45.83% calc(100% - 1.0px), 45.0% calc(100% - 0.5px), 44.17% calc(100% - 3.5px), 43.33% calc(100% - 0.1px), 42.5% calc(100% - 11.8px), 41.67% calc(100% - 3.8px), 40.83% calc(100% - 3.5px), 40.0% calc(100% - 1.1px), 39.17% calc(100% - 3.7px), 38.33% calc(100% - 0.0px), 37.5% calc(100% - 4.5px), 36.67% calc(100% - 4.6px), 35.83% calc(100% - 1.1px), 35.0% calc(100% - 2.7px), 34.17% calc(100% - 1.8px), 33.33% calc(100% - 4.3px), 32.5% calc(100% - 3.1px), 31.67% calc(100% - 3.9px), 30.83% calc(100% - 4.2px), 30.0% calc(100% - 1.8px), 29.17% calc(100% - 4.2px), 28.33% calc(100% - 1.5px), 27.5% calc(100% - 4.2px), 26.67% calc(100% - 4.7px), 25.83% calc(100% - 4.1px), 25.0% calc(100% - 1.8px), 24.17% calc(100% - 2.4px), 23.33% calc(100% - 4.2px), 22.5% calc(100% - 0.3px), 21.67% calc(100% - 1.4px), 20.83% calc(100% - 0.6px), 20.0% calc(100% - 1.4px), 19.17% calc(100% - 4.0px), 18.33% calc(100% - 1.4px), 17.5% calc(100% - 2.1px), 16.67% calc(100% - 4.8px), 15.83% calc(100% - 3.7px), 15.0% calc(100% - 4.1px), 14.17% calc(100% - 4.1px), 13.33% calc(100% - 3.9px), 12.5% calc(100% - 1.9px), 11.67% calc(100% - 3.9px), 10.83% calc(100% - 4.6px), 10.0% calc(100% - 0.7px), 9.17% calc(100% - 8.2px), 8.33% calc(100% - 4.3px), 7.5% calc(100% - 9.2px), 6.67% calc(100% - 4.3px), 5.83% calc(100% - 11.4px), 5.0% calc(100% - 4.3px), 4.17% calc(100% - 1.8px), 3.33% calc(100% - 4.1px), 2.5% calc(100% - 3.0px), 1.67% calc(100% - 1.5px), 0.83% calc(100% - 1.6px), 0.0% calc(100% - 0.6px), 0.8px 96.15%, 0.0px 92.31%, 11.0px 88.46%, 9.4px 84.62%, 4.2px 80.77%, 4.4px 76.92%, 1.4px 73.08%, 3.0px 69.23%, 3.5px 65.38%, 2.3px 61.54%, 0.6px 57.69%, 4.0px 53.85%, 8.4px 50.0%, 1.3px 46.15%, 4.9px 42.31%, 5.3px 38.46%, 0.3px 34.62%, 9.8px 30.77%, 5.4px 26.92%, 3.6px 23.08%, 3.5px 19.23%, 6.8px 15.38%, 6.8px 11.54%, 3.0px 7.69%, 2.5px 3.85%);
}
.contatti__testo { position: relative; padding-bottom: clamp(44px, 4vw, 60px); }
.contatti__titolo { font-size: clamp(44px, 5.1vw, 76px); }
.contatti__segno {
  width: clamp(200px, 24vw, 340px);
  margin: clamp(14px, 1.6vw, 22px) 0 0 -6px;
  filter: brightness(0) invert(1);
  opacity: 0.95;
  transform: rotate(-2deg);
}
.contatti__script {
  position: absolute;
  right: clamp(-10px, -0.5vw, 0px);
  bottom: clamp(-14px, -0.8vw, -4px);
  font-size: clamp(34px, 3.4vw, 50px);
  line-height: 1.02;
  transform: rotate(-13deg);
  transform-origin: center;
}
.modulo {
  display: grid;
  gap: 10px;
  padding: clamp(18px, 1.7vw, 24px);
  background: var(--bianco);
  border-radius: var(--raggio);
  box-shadow: 0 24px 50px -24px rgba(0, 40, 20, 0.55);
}
.modulo input,
.modulo select {
  width: 100%;
  min-height: 48px;
  padding: 10px 16px;
  border: 1px solid #DCDFD6;
  border-radius: 6px;
  background: var(--bianco);
  color: var(--nero);
  font: 500 16px/1.3 var(--f-testo);
  transition: border-color 160ms ease, box-shadow 160ms ease;
}
.modulo input::placeholder { color: var(--testo); opacity: 1; }
.modulo select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 44px;
  background-image: linear-gradient(45deg, transparent 50%, var(--testo) 50%), linear-gradient(135deg, var(--testo) 50%, transparent 50%);
  background-position: calc(100% - 21px) 50%, calc(100% - 15.5px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  color: var(--testo);
}
.modulo select:valid { color: var(--nero); }
.modulo input:focus,
.modulo select:focus { outline: none; border-color: var(--verde); box-shadow: 0 0 0 3px rgba(2, 125, 74, 0.18); }
.modulo [aria-invalid="true"] { border-color: var(--rosso); }
.modulo .btn { min-height: 52px; font-size: 17px; margin-top: 2px; }
.modulo__trappola { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.thk-avviso-modulo,
.modulo__privacy {
  color: var(--testo-2);
  font-size: 13px;
  line-height: 1.45;
}
.thk-avviso-modulo a { color: var(--testo); text-underline-offset: 2px; }
.modulo__esito {
  font-size: 14px;
  line-height: 1.4;
  color: var(--verde);
}
.modulo__esito:empty { display: none; }
.modulo__esito.errore { color: var(--rosso); }

/* ── piede ────────────────────────────────────────────────────────────── */
.piede { padding: clamp(20px, 2.4vw, 32px) 0 calc(22px + env(safe-area-inset-bottom, 0px)); }
.piede__riga {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) minmax(0, 1fr);
  align-items: center;
  gap: 24px;
}
.piede__marca { display: flex; align-items: center; gap: 18px; }
.piede__logo { flex: none; display: block; width: clamp(120px, 11vw, 160px); margin-left: clamp(0px, 1.6vw, 24px); }
.piede__descrizione { max-width: 17em; color: var(--testo-2); font-size: 14px; line-height: 1.45; }
.piede__contatti { justify-self: end; text-align: right; color: var(--testo); font-size: 14.5px; line-height: 1.75; }
.piede__contatti a { color: var(--testo); text-decoration: none; transition: color 160ms ease; }
.piede__social { color: var(--testo-2); }
.piede__menu ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 4px clamp(16px, 2vw, 28px);
}
.piede__menu a {
  display: inline-block;
  padding: 8px 2px;
  color: var(--testo);
  font-size: 16.5px;
  font-weight: 600;
  text-decoration: none;
  transition: color 160ms ease;
}

.piede__legale {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px 24px;
  margin-top: clamp(16px, 2vw, 26px);
  padding-top: 16px;
  border-top: 1px solid var(--linea);
  color: var(--testo-2);
  font-size: 13.5px;
}
.piede__legale a { color: var(--testo); text-underline-offset: 2px; }
.piede__link a { text-decoration: none; }
.credit a { font-weight: 600; }
@media (hover: hover) and (pointer: fine) {
  .piede__menu a:hover,
  .piede__contatti a:hover,
  .piede__legale a:hover { color: var(--rosso); }
}

/* ── pagine semplici (legali, 404) ────────────────────────────────────── */
.pagina { padding: clamp(32px, 5vw, 72px) 0 clamp(48px, 6vw, 96px); }
.legale { max-width: 760px; color: var(--testo); font-size: 16.5px; line-height: 1.65; }
.legale h1 {
  margin-bottom: 8px;
  color: var(--nero);
  font-family: var(--f-titolo);
  font-size: clamp(40px, 5vw, 64px);
  line-height: 1;
  text-transform: uppercase;
}
.legale h2 {
  margin: 34px 0 10px;
  color: var(--nero);
  font-family: var(--f-testo);
  font-size: 21px;
  font-weight: 700;
  line-height: 1.3;
}
.legale p, .legale ul { margin: 0 0 12px; }
.legale ul { padding-left: 1.2em; list-style: disc; }
.legale li { margin-bottom: 6px; }
.legale a { color: var(--verde); text-underline-offset: 2px; overflow-wrap: anywhere; }
.legale table { width: 100%; border-collapse: collapse; margin: 10px 0 18px; font-size: 14.5px; }
.legale th, .legale td { padding: 10px 12px; border-bottom: 1px solid var(--linea); text-align: left; vertical-align: top; }
.legale th { color: var(--nero); font-weight: 650; background: var(--salvia-chiaro); }
.tabella-scorre { overflow-x: auto; -webkit-overflow-scrolling: touch; }

.errore404 { text-align: center; padding: clamp(40px, 8vw, 120px) 0; }
.errore404 .script { font-size: clamp(54px, 7vw, 96px); transform: rotate(-6deg); }
.errore404 .titolo { font-size: clamp(56px, 8vw, 112px); margin-top: 6px; }
.errore404 p { max-width: 36ch; margin: 18px auto 30px; font-size: 18px; }
.errore404 .azioni { display: flex; flex-wrap: wrap; gap: 14px 26px; justify-content: center; align-items: center; }

/* ── tablet e telefono ────────────────────────────────────────────────── */
@media (max-width: 1179px) {
  .menu {
    position: fixed;
    inset: 0;
    z-index: 25;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    gap: 28px;
    height: 100dvh;
    padding: calc(108px + env(safe-area-inset-top, 0px)) 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(--crema);
    overflow-y: auto;
    overscroll-behavior: contain;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-12px);
    transition: opacity 180ms ease, transform 200ms var(--ease-out), visibility 0s linear 200ms;
  }
  .menu.aperto {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: opacity 260ms var(--ease-out), transform 320ms var(--ease-out), visibility 0s;
  }
  .menu__voci { flex-direction: column; gap: 0; }
  .menu__voci li { border-bottom: 1px solid var(--linea); }
  .menu__voci a {
    display: block;
    padding: 16px 0;
    color: var(--nero);
    font-family: var(--f-titolo);
    font-size: clamp(34px, 8vw, 44px);
    font-weight: 400;
    line-height: 1.05;
    text-transform: uppercase;
  }
  .menu__voci a::after { content: none; }
  .menu__voci a:active { color: var(--rosso); }
  .menu__cta { display: inline-flex; align-self: flex-start; font-size: 17px; min-height: 54px; }
  .testata__logo, .testata__azioni { position: relative; z-index: 30; }
  .burger { display: block; }
  .btn--testata { display: none; }
}

@media (max-width: 959px) {
  .hero__griglia { grid-template-columns: 1fr; min-height: 0; }
  .hero__testo { padding: 34px 0 8px; }
  .hero__visual { height: clamp(380px, 96vw, 660px); margin: 8px 0 0; }
  .hero__cerchio { width: min(82%, 520px); left: 52%; }
  .hero__cono { left: 54%; }
  .hero__guarnizione--suklaa { left: 6%; }
  .hero__guarnizione--pistaasi { left: 10%; }
  .hero__guarnizione--nocciola { right: 6%; }

  .punti__lista { grid-template-columns: 1fr 1fr; row-gap: 22px; }
  .punto { border-left: 0; padding: 4px 8px; }
  .punto:first-child {
    grid-column: 1 / -1;
    align-items: center;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--linea);
  }
  .punto--finlandia .punto__nome { padding-left: 0; }
  .punto:nth-child(3), .punto:nth-child(5) { border-left: 1px solid var(--linea); }

  .formati__lista { margin-top: 26px; }

  .trailer__griglia, .laboratorio__griglia { grid-template-columns: 1fr; }
  .video-box { margin-left: 0; }
  .trailer__sole { top: 44px; right: 4px; }

  .pc__griglia { grid-template-columns: 1fr; gap: 30px; }
  .pc__premio { grid-template-columns: minmax(0, 0.7fr) minmax(0, 1fr); }
  .pc__chioschi { grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); }
  .pc__titolo-chioschi { transform: rotate(-6deg); }

  .contatti__banda, .banda-cta {
    grid-template-columns: 1fr;
    margin-inline: calc(-1 * max(var(--margine), env(safe-area-inset-left, 0px)));
    padding: 52px max(var(--margine), env(safe-area-inset-right, 0px)) 40px max(var(--margine), env(safe-area-inset-left, 0px));
  }
  .contatti__testo { padding-bottom: 76px; }
  .contatti__script { right: auto; left: 46%; bottom: 4px; }

  .piede__riga { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: 14px; }
  .piede__logo { margin-left: 0; }
  .piede__marca { flex-direction: column; gap: 6px; text-align: center; }
  .piede__descrizione { max-width: 24em; }
  .piede__menu ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 0 22px; }
  .piede__menu a { font-size: 15.5px; padding: 6px 2px; }
  .piede__contatti { justify-self: center; text-align: center; line-height: 1.6; }
  .piede__legale { flex-direction: column; text-align: center; justify-content: center; }
}

@media (max-width: 600px) {
  body { font-size: 16px; }
  .testata__in { padding-top: 10px; padding-bottom: 6px; gap: 12px; }
  .hero__script { transform: rotate(-6deg); }
  .hero__segno { margin-left: 28px; }
  .hero__lead { max-width: 28ch; }
  .btn--grande { width: 100%; max-width: 360px; min-height: 56px; }

  .formati__lista { grid-template-columns: 1.25fr 0.8fr 1.1fr; gap: 10px; }
  .formato__nome { font-size: 14px; line-height: 1.3; margin-top: 14px; }
  .formato__nome::before { left: 6%; width: 60%; top: -4px; height: 7px; }
  .formati__clienti { font-size: 13.5px; line-height: 1.6; }
  .formati__voce:not(:last-of-type)::after { margin: 0 0.55em; }
  .formati__intro { display: block; width: 100%; margin: 0 0 2px; text-align: center; }
  .formati__link { display: block; width: 100%; margin: 6px 0 0; text-align: center; }

  .gusti__titolo { flex-direction: column; align-items: flex-start; gap: 10px; }
  .gusti__titolo .script { margin-left: 0.3em; }
  .gusti__riga { grid-template-columns: 1fr; justify-items: center; gap: 10px; }
  .gusti__lista { grid-template-columns: 1fr 1fr; row-gap: 26px; width: 100%; }
  .gusto img { height: 112px; }
  .gusti__lato { max-width: 34em; margin: 4px 0 0; padding: 0; border-left: 0; text-align: center; }

  .trailer__azioni { flex-direction: column; align-items: flex-start; }
  .trailer__azioni .btn { width: 100%; }

  .pc__premio { grid-template-columns: 128px minmax(0, 1fr); }
  .pc__chioschi { grid-template-columns: 132px minmax(0, 1fr); }
  .pc__attestato { margin-left: 0; }
  .pc__chiosco { aspect-ratio: 4 / 3; }
  .pc__titolo-chioschi { font-size: 33px; }

  .contatti__script { left: auto; right: 4px; }
}

@media (max-width: 360px) {
  .testata__logo { width: 100px; }
  .modulo { padding: 14px; }
  .modulo input, .modulo select { padding-left: 12px; }
  .modulo select { padding-right: 34px; background-position: calc(100% - 17px) 50%, calc(100% - 11.5px) 50%; }
  .formato__nome { font-size: 12.5px; }
  .pc__chioschi { grid-template-columns: 128px minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .menu, .menu.aperto { transform: none; }
}

/* ═══ IL MOVIMENTO (step 5-bis) ═══════════════════════════════════════════
   Regole di Emil Kowalski (Animazioni/): solo transform, translate, opacity e clip-path; curve --ease-out e
   --ease-in-out; uscite più veloci delle entrate; hover solo col mouse; meno movimento con prefers-reduced-motion. */

/* hero: entra al caricamento, con CSS, senza aspettare il JavaScript */
@keyframes entra-su { from { opacity: 0; translate: 0 34px; } to { opacity: 1; translate: 0 0; } }
@keyframes scrivi { from { clip-path: inset(-30% 100% -45% -6%); } to { clip-path: inset(-30% -6% -45% -6%); } }
@keyframes traccia { from { clip-path: inset(-20% 100% -20% 0); } to { clip-path: inset(-20% 0 -20% 0); } }
@keyframes compare { from { opacity: 0; scale: 0.95; } to { opacity: 1; scale: 1; } }
@keyframes sale { from { translate: 0 6%; } to { translate: 0 0; } }
@keyframes galleggia { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes gira { to { rotate: 1turn; } }
@keyframes dissolvi { from { opacity: 0; } to { opacity: 1; } }

.hero__script { animation: scrivi 1150ms var(--ease-in-out) 120ms both; }
.hero__titolo .riga { animation: entra-su 820ms var(--ease-out) both; }
.hero__titolo .riga:nth-child(1) { animation-delay: 420ms; }
.hero__titolo .riga:nth-child(2) { animation-delay: 500ms; }
.hero__titolo .riga:nth-child(3) { animation-delay: 580ms; }
.hero__segno { animation: traccia 900ms var(--ease-in-out) 900ms both; }
.hero__lead { animation: entra-su 800ms var(--ease-out) 820ms both; }
.hero__testo .btn--grande { animation: entra-su 800ms var(--ease-out) 900ms both; }
.hero__cerchio { animation: compare 1100ms var(--ease-out) 150ms both; }
.hero__cono { animation: sale 1200ms var(--ease-out) both; }
.hero__guarnizione {
  animation: compare 700ms var(--ease-out) both, galleggia 6.5s ease-in-out infinite;
}
.hero__guarnizione--suklaa { animation-delay: 700ms, 1.4s; }
.hero__guarnizione--nocciola { animation-delay: 820ms, 2.2s; animation-duration: 700ms, 7.5s; }
.hero__guarnizione--pistaasi { animation-delay: 940ms, 0.6s; animation-duration: 700ms, 5.8s; }

/* le sezioni entrano mentre si scorre (.reveal → .in): visibili senza JavaScript */
.js .reveal {
  opacity: 0;
  translate: 0 32px;
  transition: opacity 800ms var(--ease-out), translate 900ms var(--ease-out);
  transition-delay: calc(var(--i, 0) * 70ms);
}
.js .reveal.scrivi,
.js .reveal.traccia { translate: none; opacity: 1; clip-path: inset(-30% 100% -45% -6%); transition: clip-path 1100ms var(--ease-in-out); transition-delay: calc(var(--i, 0) * 70ms); }
.js .reveal.svela { translate: none; opacity: 1; clip-path: inset(0 0 100% 0); transition: clip-path 1000ms var(--ease-in-out); }
.js .reveal.in,
.js .reveal.is-in { opacity: 1; translate: 0 0; }
.js .reveal.scrivi.in, .js .reveal.scrivi.is-in,
.js .reveal.traccia.in, .js .reveal.traccia.is-in { clip-path: inset(-30% -6% -45% -6%); }
.js .reveal.svela.in, .js .reveal.svela.is-in { clip-path: inset(-40px -40px -70px -40px); }
.js .reveal .link-verde::after,
.js .link-verde.reveal::after { transform: scaleX(0); transform-origin: left; transition: transform 900ms var(--ease-in-out) 350ms; }
.js .reveal.in .link-verde::after, .js .reveal.is-in .link-verde::after,
.js .link-verde.reveal.in::after, .js .link-verde.reveal.is-in::after { transform: scaleX(1); }

/* il «44» che sale da zero: il numero vero resta nella pagina, sopra scorre il conteggio */
.conta { position: relative; display: inline-block; }
.conta.is-contando { color: transparent; }
.conta.is-contando::before { content: attr(data-mostra); position: absolute; left: 0; top: 0; color: var(--nero); }

/* il sole del trailer gira piano */
.trailer__sole { animation: gira 38s linear infinite; }

/* immagini che si avvicinano col mouse; tutto ciò che si preme risponde al dito */
.trailer__foto img,
.pc__chiosco,
.gusto img,
.formato__img img { transition: transform 600ms var(--ease-out); }
.pc__attestato { transition: rotate 500ms var(--ease-out), scale 500ms var(--ease-out); }
.link-verde:active, .trailer__solo a:active, .menu__voci a:active, .piede a:active { opacity: 0.7; }
@media (hover: hover) and (pointer: fine) {
  .trailer__foto:hover img { transform: scale(1.045); }
  .pc__foto:hover .pc__chiosco { transform: scale(1.05); }
  .gusto:hover img { transform: scale(1.08) rotate(-3deg); }
  .formato:hover .formato__img img { transform: translateY(-8px); }
  .formato--barattolini:hover .formato__barattolo--2 { transform: translateY(-14px) rotate(4deg); }
  .pc__attestato:hover { rotate: 1.5deg; scale: 1.03; }
}

/* riduci animazioni: meno movimento, non zero (restano le dissolvenze) */
@media (prefers-reduced-motion: reduce) {
  .hero__script, .hero__segno, .hero__titolo .riga, .hero__lead, .hero__testo .btn--grande,
  .hero__cerchio, .hero__cono { animation: dissolvi 600ms ease both; }
  .hero__guarnizione { animation: dissolvi 600ms ease 300ms both; }
  .trailer__sole { animation: none; }
  .js .reveal, .js .reveal.scrivi, .js .reveal.traccia, .js .reveal.svela { translate: none; clip-path: none; transition: opacity 600ms ease; }
  .js .reveal.scrivi:not(.in):not(.is-in), .js .reveal.traccia:not(.in):not(.is-in), .js .reveal.svela:not(.in):not(.is-in) { opacity: 0; }
  .js .reveal .link-verde::after, .js .link-verde.reveal::after { transform: none; transition: none; }
  .testata, .testata__fondo, .testata__logo, .testata__azioni, .menu__voci { transition-duration: 1ms; }
  .trailer__foto img, .pc__chiosco, .gusto img, .formato__img img { transition: none; }
}

/* il pulsante WhatsApp fisso, da telefono (extra.md) */
.whatsapp-fisso { display: none; }
@media (max-width: 760px) {
  .whatsapp-fisso {
    position: fixed;
    left: 0;
    right: 0;
    width: max-content;
    margin-inline: auto;
    bottom: calc(14px + env(safe-area-inset-bottom, 0px));
    z-index: 20;
    display: inline-flex;
    align-items: center;
    min-height: 48px;
    padding: 12px 22px;
    border-radius: 999px;
    background: var(--verde);
    color: var(--bianco);
    font-weight: 600;
    font-size: 15.5px;
    white-space: nowrap;
    text-decoration: none;
    box-shadow: 0 14px 28px -12px rgba(2, 80, 45, 0.6);
    user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
    transition: transform 140ms var(--ease-out), opacity 240ms ease;
    animation: entra-su 700ms var(--ease-out) 1.4s both;
  }
  .whatsapp-fisso:active { transform: scale(0.97); }
  html.menu-aperto .whatsapp-fisso { opacity: 0; pointer-events: none; }
  .piede { padding-bottom: calc(86px + env(safe-area-inset-bottom, 0px)); }
}

/* ═══ PAGINE INTERNE (6-bis): gli stessi pezzi della home ════════════════
   Titoli Anton inclinati, corsivi, foto in cornice, fasce salvia e verdi a pennello, icone del kit, link verdi. */
.menu__voci a[aria-current="page"] { color: var(--nero); }
.menu__voci a[aria-current="page"]::after { transform: scaleX(1); }

.pagina-hero { padding: clamp(28px, 3.6vw, 56px) 0 clamp(52px, 5.6vw, 88px); overflow-x: clip; }
.pagina-hero__griglia {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.95fr);
  gap: clamp(28px, 4.4vw, 72px);
  align-items: center;
}
.pagina-hero__titolo {
  font-size: clamp(44px, 5.4vw, 80px);
  transform: skewY(-3deg);
  transform-origin: left center;
  margin: 8px 0 clamp(14px, 1.6vw, 22px);
}
.pagina-hero__lead { max-width: 30em; font-size: clamp(18px, 1.6vw, 23px); line-height: 1.42; }
.pagina-hero__lead + .pagina-hero__lead { margin-top: 12px; }
.azioni { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 30px; margin-top: clamp(22px, 2.4vw, 34px); }
.azioni .link-verde { font-size: clamp(16.5px, 1.4vw, 20px); }

.cornice { position: relative; overflow: hidden; border-radius: 4px; box-shadow: 0 22px 40px -26px rgba(40, 50, 30, 0.45); background: var(--salvia-chiaro); }
.cornice img, .cornice video { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform 600ms var(--ease-out); }
.cornice--alta img { aspect-ratio: 4 / 5; }
.cornice--larga img { aspect-ratio: 16 / 9; }
.cornice--piccola { max-width: 320px; }
@media (hover: hover) and (pointer: fine) {
  .cornice:hover img { transform: scale(1.045); }
}
.mosaico { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 1.4vw, 20px); }
.mosaico--tre { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mosaico--tre .cornice img { aspect-ratio: 3 / 4; }
.mosaico .cornice:first-child:nth-last-child(2) { margin-top: clamp(24px, 3vw, 48px); }

.composizione { position: relative; width: 100%; max-width: 520px; margin-inline: auto; aspect-ratio: 1; }
.composizione__cerchio { position: absolute; inset: 4%; width: 92%; filter: saturate(1.9) brightness(0.955); }
.composizione__prodotto { position: absolute; left: 50%; bottom: 6%; width: 64%; translate: -50% 0; filter: drop-shadow(0 26px 30px rgba(60, 40, 20, 0.18)); }
.composizione__marchio { position: absolute; left: 0; top: 2%; width: 34%; rotate: -6deg; filter: drop-shadow(0 10px 14px rgba(0, 30, 90, 0.18)); }
.composizione__bollino { position: absolute; right: 2%; top: 4%; width: 30%; rotate: 8deg; filter: drop-shadow(0 10px 16px rgba(60, 40, 90, 0.25)); }

.sezione { padding: clamp(52px, 6vw, 96px) 0; overflow-x: clip; }
.sezione--salvia { background: var(--salvia-chiaro); }
.sezione--stretta { padding-top: clamp(20px, 2.4vw, 36px); }
.sezione__titolo { font-size: clamp(38px, 4.4vw, 66px); margin-bottom: clamp(14px, 1.6vw, 22px); }
.sezione__titolo--inclinato { transform: skewY(-3deg); transform-origin: left center; }
.sezione__testo { max-width: 34em; }
.sezione__testo p, .testo { font-size: clamp(17px, 1.6vw, 22.5px); line-height: 1.45; }
.sezione__testo p + p { margin-top: 14px; }
.sezione__testo .azioni { margin-top: clamp(18px, 2vw, 28px); }
.centrato { text-align: center; margin-inline: auto; }
.centrato .azioni { justify-content: center; }

.split > *, .pagina-hero__griglia > * { min-width: 0; }
.split { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(28px, 4.4vw, 72px); align-items: center; }
.split--inverso > :first-child { order: 2; }
.split--largo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }

/* le icone in riga, come i punti di forza della home */
.icone-riga { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); margin-top: clamp(26px, 3vw, 44px); }
.icone-riga li { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 6px clamp(10px, 1.4vw, 22px); text-align: center; border-left: 1px solid var(--linea); }
.icone-riga li:first-child { border-left: 0; }
.icone-riga img { height: clamp(58px, 5.6vw, 82px); width: auto; }
.icone-riga p { color: var(--testo-forte); font-size: clamp(15.5px, 1.4vw, 20px); font-weight: 500; line-height: 1.32; }
.icone-riga b { display: block; color: var(--nero); font-weight: 650; }

/* i passi numerati */
.passi { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(16px, 2.4vw, 36px); margin-top: clamp(26px, 3vw, 44px); counter-reset: passo; }
.passi li { position: relative; padding-top: 10px; counter-increment: passo; }
.passi li::before { content: counter(passo); display: block; color: var(--rosso); font-family: var(--f-titolo); font-size: clamp(54px, 5vw, 76px); line-height: 1; }
.passi li::after { content: ""; position: absolute; left: 0; top: 0; width: 64px; height: 8px; background: url("/assets/img/sottolineatura-verde.webp") left center / 100% 100% no-repeat; }
.passi p { margin-top: 10px; color: var(--testo-forte); font-size: clamp(16px, 1.45vw, 20.5px); line-height: 1.4; }

/* gelato contro ice cream: la frase intera, con le cifre grandi */
.confronto { display: grid; gap: clamp(14px, 1.8vw, 22px); }
.confronto__voce { display: grid; grid-template-columns: auto 1fr 1fr; align-items: end; gap: 6px clamp(14px, 2vw, 28px); padding: clamp(18px, 2vw, 26px); border-radius: var(--raggio); background: var(--bianco); box-shadow: 0 18px 36px -26px rgba(40, 50, 30, 0.4); }
.confronto__nome { align-self: center; color: var(--nero); font-family: var(--f-titolo); font-size: clamp(24px, 2.4vw, 34px); text-transform: uppercase; line-height: 1; }
.confronto__riga { display: block; color: var(--testo); font-size: clamp(15px, 1.25vw, 17.5px); line-height: 1.3; }
.confronto__riga strong { display: block; color: var(--testo-2); font-family: var(--f-titolo); font-weight: 400; font-size: clamp(34px, 3.4vw, 52px); line-height: 1.05; }
.confronto__riga--gelato strong { color: var(--verde); }

/* elenco con le spunte del kit */
.spunte li { position: relative; padding-left: 40px; font-size: clamp(17px, 1.55vw, 21.5px); line-height: 1.4; }
.spunte li + li { margin-top: 12px; }
.spunte li::before { content: ""; position: absolute; left: 0; top: 0.2em; width: 26px; height: 20px; background: url("/assets/img/simbolo-check.webp") center / contain no-repeat; }

/* i gusti, sempre in griglia */
.gusti-gruppo + .gusti-gruppo { margin-top: clamp(48px, 5.4vw, 84px); }
.gusti-griglia { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(22px, 2.4vw, 36px) clamp(12px, 1.6vw, 24px); margin-top: clamp(22px, 2.6vw, 36px); }
.gusti-griglia .gusto { position: relative; }
.gusti-griglia .gusto img { height: clamp(86px, 8.4vw, 124px); }
.gusti-griglia .gusto span { font-size: clamp(14.5px, 1.25vw, 17.5px); text-align: center; line-height: 1.25; }
.gusto__premio { display: block; color: var(--verde); font-size: 13px; font-weight: 600; }
.gusti-griglia .gusto .gusto__bollino { position: absolute; top: -6px; right: 4%; width: clamp(38px, 3.6vw, 52px); height: auto; rotate: 10deg; filter: drop-shadow(0 6px 8px rgba(60, 40, 90, 0.25)); }

/* le domande frequenti, a fisarmonica */
.domande { margin-top: clamp(20px, 2.4vw, 32px); border-top: 1px solid var(--linea); }
.domande details { border-bottom: 1px solid var(--linea); }
.domande summary {
  position: relative; display: block; padding: 20px 52px 20px 0; cursor: pointer; list-style: none;
  color: var(--nero); font-size: clamp(17px, 1.55vw, 21.5px); font-weight: 650; line-height: 1.35;
  user-select: none; -webkit-user-select: none; touch-action: manipulation;
}
.domande summary::-webkit-details-marker { display: none; }
.domande summary::after {
  content: "+"; position: absolute; right: 8px; top: 50%; translate: 0 -50%;
  color: var(--rosso); font-family: var(--f-testo); font-weight: 400; font-size: 34px; line-height: 1;
  transition: rotate 220ms var(--ease-out);
}
.domande details[open] summary::after { rotate: 45deg; }
.domande summary:active { opacity: 0.7; }
.domande details p { padding: 0 0 22px; max-width: 46em; font-size: clamp(16.5px, 1.45vw, 20px); line-height: 1.5; }
.domande details[open] p { animation: entra-su 320ms var(--ease-out) both; }

/* le recensioni, in una riga che scorre col dito */
.recensioni {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(280px, 31%); gap: clamp(14px, 1.8vw, 24px);
  margin-top: clamp(22px, 2.6vw, 36px); padding: 4px 4px 22px; overflow-x: auto; scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch;
}
.recensioni::-webkit-scrollbar { height: 6px; }
.recensioni::-webkit-scrollbar-thumb { background: var(--salvia); border-radius: 3px; }
.recensione {
  scroll-snap-align: start; display: flex; flex-direction: column; gap: 12px; padding: clamp(18px, 2vw, 26px);
  border-radius: var(--raggio); background: var(--bianco); box-shadow: 0 18px 36px -28px rgba(40, 50, 30, 0.45);
}
.recensione__stelle { color: var(--rosso); letter-spacing: 3px; font-size: 18px; }
.recensione blockquote { margin: 0; color: var(--testo-forte); font-size: clamp(16.5px, 1.4vw, 19.5px); line-height: 1.45; }
.recensione cite { margin-top: auto; color: var(--testo-2); font-size: 15px; font-style: normal; font-weight: 600; }
.recensioni-nota { margin-top: 6px; color: var(--testo-2); font-size: 14.5px; }

/* la frase grande (il nostro obiettivo) */
.citazione { max-width: 22em; font-family: var(--f-titolo); color: var(--nero); font-size: clamp(30px, 3.4vw, 50px); line-height: 1.12; text-transform: uppercase; }

/* il richiamo finale nella fascia verde */
.banda-cta { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
.banda-cta .titolo { font-size: clamp(40px, 4.6vw, 68px); }
.banda-cta p { color: var(--bianco); font-size: clamp(17px, 1.55vw, 21.5px); line-height: 1.45; }
.banda-cta .azioni { justify-content: flex-start; }
.banda-cta .link-verde, .banda-cta .link-verde .freccia { color: var(--bianco); }
.banda-cta .link-verde::after { filter: brightness(0) invert(1); }
.banda-cta .btn--rosso { box-shadow: 0 10px 22px -10px rgba(0, 0, 0, 0.45); }

/* contatti */
.schede-contatto { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(16px, 2.4vw, 32px); }
.scheda-contatto { padding: clamp(22px, 2.6vw, 36px); border-radius: var(--raggio); background: var(--bianco); box-shadow: 0 18px 36px -28px rgba(40, 50, 30, 0.45); }
.scheda-contatto h2 { font-family: var(--f-titolo); color: var(--nero); font-size: clamp(30px, 3vw, 44px); line-height: 1; text-transform: uppercase; margin-bottom: 16px; }
.scheda-contatto p, .scheda-contatto li { font-size: clamp(16.5px, 1.45vw, 20px); line-height: 1.5; }
.scheda-contatto p + p, .scheda-contatto ul { margin-top: 10px; }
.scheda-contatto a { color: var(--verde); font-weight: 600; text-underline-offset: 3px; }
.modulo--completo { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; align-items: start; }
.modulo--completo .modulo__campo--intero, .modulo--completo .btn, .modulo--completo .thk-avviso-modulo, .modulo--completo .modulo__esito { grid-column: 1 / -1; }
.modulo__campo label:not(.nascosto) { display: block; margin-bottom: 6px; color: var(--testo-forte); font-size: 14.5px; font-weight: 600; }
.modulo textarea {
  width: 100%; min-height: 120px; padding: 12px 16px; border: 1px solid #DCDFD6; border-radius: 6px;
  background: var(--bianco); color: var(--nero); font: 500 16px/1.45 var(--f-testo); resize: vertical;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}
.modulo textarea::placeholder { color: var(--testo-2); opacity: 1; }
.modulo textarea:focus { outline: none; border-color: var(--verde); box-shadow: 0 0 0 3px rgba(2, 125, 74, 0.18); }
.modulo__nota { grid-column: 1 / -1; color: var(--testo-2); font-size: 14px; }

@media (max-width: 959px) {
  .pagina-hero__griglia, .split, .split--largo { grid-template-columns: 1fr; }
  .split--inverso > :first-child { order: 0; }
  .icone-riga { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 26px; }
  .icone-riga li:nth-child(odd) { border-left: 0; }
  .passi { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 30px; }
  .gusti-griglia { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .schede-contatto { grid-template-columns: 1fr; }
  .banda-cta { grid-template-columns: 1fr; }
  .composizione { max-width: 400px; }
}
@media (max-width: 600px) {
  .gusti-griglia { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gusti-griglia .gusto img { height: 96px; }
  .mosaico--tre { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .recensioni { grid-auto-columns: 82%; }
  .modulo--completo { grid-template-columns: 1fr; }
  .azioni { gap: 14px 22px; }
  .azioni .btn--rosso { width: 100%; max-width: 360px; }
}
@media (prefers-reduced-motion: reduce) {
  .domande details[open] p { animation: dissolvi 300ms ease both; }
  .cornice img { transition: none; }
}

/* pagine interne: i pezzi che mancavano */
.schede-foto { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2.4vw, 36px); margin-top: clamp(22px, 2.6vw, 36px); }
.schede-foto .cornice img { aspect-ratio: 1; }
.schede-foto li p { margin-top: 14px; color: var(--testo-forte); font-size: clamp(16px, 1.45vw, 20px); font-weight: 500; line-height: 1.4; }
.schede-foto__nota, .nota-icone { margin-top: clamp(26px, 3vw, 40px); max-width: 34em; }
.icone-grandi { display: flex; align-items: flex-end; justify-content: center; gap: clamp(24px, 4vw, 64px); }
.icone-grandi img { width: clamp(96px, 11vw, 160px); height: auto; }
.passi--due { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.premio-media { position: relative; max-width: 340px; margin-inline: auto; }
.premio-media .pc__attestato { max-width: none; margin: 0; }
.premio-media__bollino { position: absolute; right: -6%; bottom: -8%; width: 40%; rotate: 10deg; filter: drop-shadow(0 12px 16px rgba(60, 40, 90, 0.25)); }
.composizione--logo .composizione__logo { position: absolute; left: 50%; top: 50%; width: 74%; translate: -50% -50%; }
.citazione { margin-top: 10px; }
.citazione__segno { width: clamp(200px, 26vw, 360px); margin: 18px auto 0; }
.banda-cta__testo .azioni { margin-top: clamp(16px, 2vw, 24px); }
.banda-cta__frase { margin-top: clamp(16px, 2vw, 22px); max-width: 26em; color: var(--bianco); font-size: clamp(17px, 1.5vw, 21px); line-height: 1.45; }
.contatti__banda--modulo { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); align-items: start; }
.contatti__banda--modulo .contatti__testo { padding-bottom: 0; }
.gusti-gruppo .sezione__testo { max-width: 40em; }
@media (max-width: 959px) {
  .schede-foto { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 78%; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 12px; overscroll-behavior-x: contain; }
  .schede-foto li { scroll-snap-align: start; }
  .contatti__banda--modulo { grid-template-columns: 1fr; }
  .premio-media { max-width: 300px; }
}
@media (max-width: 600px) {
  .confronto__voce { grid-template-columns: 1fr 1fr; }
  .confronto__riga strong { font-size: 32px; white-space: nowrap; }
  .confronto__nome { grid-column: 1 / -1; }
  .passi--due { grid-template-columns: 1fr 1fr; }
}
.confronto { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 959px) {
  .banda-cta .contatti__testo { padding-bottom: 6px; }
  .contatti__banda--modulo .contatti__testo { padding-bottom: 10px; }
}
.intero { white-space: nowrap; }

/* ═══════════════════════════════════════════════════════════════════════════════════════════════════════════════
   🚀 STEP 6-QUATER · IL SALTO DI LIVELLO (Design/SALTO-DI-LIVELLO.md). Stessa struttura, copy, kit, colori e caratteri:
   cambia la qualità grafica. Tutto qui sotto, sopra le regole di prima.
   ═══════════════════════════════════════════════════════════════════════════════════════════════════════════════ */
:root {
  --raggio-foto: 18px;
  --ombra-piena: 14px 14px 0 var(--salvia);
  --ombra-morbida: 0 30px 50px -30px rgba(40, 50, 30, 0.38);
}

/* ── i titoli: scala chiara, a capo bilanciati ── */
.titolo, .sezione__titolo, .pagina-hero__titolo, .citazione, .scheda-contatto h2 { text-wrap: balance; }
.sezione__titolo { font-size: clamp(36px, 4.1vw, 60px); line-height: 0.98; }
.sezione { padding: clamp(64px, 7.4vw, 116px) 0; }
.sezione--salvia { padding: clamp(76px, 8.6vw, 136px) 0; }

/* ── un solo trattamento per foto e video: angoli ampi, ombra piena salvia sfalsata (verde sulle fasce salvia) ── */
.cornice, .trailer__foto, .video-box, .pc__foto {
  border-radius: var(--raggio-foto);
  box-shadow: var(--ombra-piena), var(--ombra-morbida);
}
.sezione--salvia .cornice, .sezione--salvia .video-box, .trailer .trailer__foto { --ombra-piena: 14px 14px 0 var(--verde-banda); }
.video-box { margin-left: 0; }
.video-box__video { border-radius: inherit; }

/* ── le icone in un tondo, come un bollino ── */
.icone-riga img, .punto__icone img {
  box-sizing: content-box;
  width: clamp(48px, 4.4vw, 62px);
  height: clamp(48px, 4.4vw, 62px);
  padding: clamp(18px, 1.7vw, 24px);
  object-fit: contain;
  border-radius: 50%;
  background: var(--salvia-chiaro);
  transition: transform 400ms var(--ease-out);
}
.sezione--salvia .icone-riga img { background: var(--bianco); box-shadow: 0 14px 26px -18px rgba(40, 50, 30, 0.5); }
.icone-riga li { border-left: 0; }
.punto__icone { height: auto; }
.punto__icone img { height: clamp(48px, 4.4vw, 62px); }
@media (hover: hover) and (pointer: fine) {
  .icone-riga li:hover img, .punto:hover .punto__icone img { transform: translateY(-4px) rotate(-6deg); }
}

/* ═══ HOME ═══ */
/* la hero spaziale: a tutto schermo, il cono dentro due orbite disegnate a mano che girano piano */
@keyframes orbita { to { rotate: 1turn; } }
@keyframes orbita-indietro { to { rotate: -1turn; } }
.hero__griglia { min-height: max(600px, calc(100svh - 140px)); align-items: center; }
.hero__testo { padding: clamp(10px, 1.6vw, 24px) 0 clamp(96px, 9vw, 140px); }
.hero__script { font-size: clamp(44px, 4.7vw, 70px); }
.hero__titolo { font-size: clamp(64px, 8.6vw, 128px); line-height: 0.93; }
.hero__lead { font-size: clamp(18px, 1.62vw, 24px); max-width: 23em; }
.hero__visual {
  align-self: stretch;
  height: auto;
  min-height: clamp(460px, 62vw, 960px);
  margin-bottom: clamp(-150px, -8vw, -70px);
  overflow: visible;
}
.hero__cerchio { width: min(98%, 800px); }
.hero__orbita {
  position: absolute;
  top: 45%;
  left: 54%;
  width: min(104%, 840px);
  height: auto;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.hero__orbita--verde { rotate: -14deg; animation: compare 1100ms var(--ease-out) 300ms both, orbita 90s linear 1.4s infinite; }
.hero__orbita--rossa { width: min(84%, 680px); top: 50%; left: 50%; rotate: 32deg; opacity: 0.85; animation: compare 1100ms var(--ease-out) 450ms both, orbita-indietro 120s linear 1.6s infinite; }
.hero__cono { height: 104%; bottom: -2%; filter: drop-shadow(0 40px 50px rgba(90, 60, 40, 0.22)); }

/* i punti di forza: una scheda bianca sospesa che si appoggia sul fondo della hero */
.punti { position: relative; z-index: 3; padding-top: 0; }
.punti__lista {
  padding: clamp(22px, 2.4vw, 36px) clamp(18px, 2.4vw, 40px);
  border-radius: 26px;
  background: var(--bianco);
  box-shadow: 0 40px 70px -40px rgba(40, 50, 30, 0.45), 0 2px 0 rgba(40, 50, 30, 0.04);
}
.punto { border-left-color: var(--linea); }

/* i formati in vetrina: ogni prodotto sul suo tondo salvia, con l'ombra a terra */
.formato__img { isolation: isolate; }
.formato__img::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 50%;
  bottom: 4%;
  width: min(86%, 300px);
  aspect-ratio: 1;
  translate: -50% 0;
  background: url("/assets/img/cerchio-salvia.webp") center / contain no-repeat;
}
.formato__img::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: 50%;
  bottom: -2%;
  width: 70%;
  height: 22px;
  translate: -50% 0;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(40, 50, 30, 0.22), transparent);
}
.formato--vaschetta .formato__img::before { width: min(70%, 300px); }

/* i gusti: il 44 enorme nel cerchio rosso disegnato a mano, i gusti su piattini bianchi */
.conta-cerchio { position: relative; display: inline-block; margin-right: 0.12em; padding: 0 0.12em; color: var(--rosso); font-size: 1.55em; line-height: 0.9; }
.gusti__cerchio { position: absolute; left: 50%; top: 50%; width: 150%; max-width: none; height: auto; transform: translate(-50%, -48%) rotate(-8deg); pointer-events: none; }
.conta, .conta.is-contando::before { color: var(--rosso); }
.gusti__titolo { align-items: center; }
.gusti__lista .gusto, .gusti-griglia .gusto {
  padding: clamp(14px, 1.4vw, 22px) 10px clamp(12px, 1.2vw, 18px);
  border-radius: 22px;
  background: var(--bianco);
  box-shadow: 0 22px 40px -28px rgba(40, 50, 30, 0.42);
  transition: transform 400ms var(--ease-out), box-shadow 400ms var(--ease-out);
}
.gusti__lista .gusto:active, .gusti-griglia .gusto:active { transform: scale(0.97); }
@media (hover: hover) and (pointer: fine) {
  .gusti__lista .gusto:hover, .gusti-griglia .gusto:hover { transform: translateY(-6px); box-shadow: 0 30px 50px -28px rgba(40, 50, 30, 0.5); }
}
.gusti-griglia .gusto .gusto__bollino { top: -14px; right: -8px; }

/* trailer: il sole si appoggia sull'angolo della foto */
.trailer__griglia { position: relative; }
.trailer__testo { position: static; }
.trailer__sole { top: clamp(-26px, -1.8vw, -16px); right: auto; left: calc(53% - clamp(80px, 7vw, 110px)); z-index: 2; }

/* premio e chioschi: due schede bianche affiancate */
.pc__blocco {
  padding: clamp(20px, 2.2vw, 34px);
  border-radius: 26px;
  background: var(--bianco);
  box-shadow: 0 30px 60px -38px rgba(40, 50, 30, 0.45);
}
.pc__attestato { margin: clamp(-48px, -3vw, -24px) 0 0; transform: rotate(-5deg); max-width: 230px; }
.pc__foto { --ombra-piena: 10px 10px 0 var(--salvia); }

/* contatti: la coppetta del kit che esce dalla fascia verde */
.contatti .contenitore { position: relative; }
.contatti__coppetta {
  position: absolute;
  z-index: 4;
  left: clamp(-6px, 1vw, 24px);
  top: clamp(-90px, -5.4vw, -50px);
  width: clamp(110px, 10.5vw, 160px);
  height: auto;
  rotate: -10deg;
  filter: drop-shadow(0 24px 24px rgba(0, 40, 20, 0.3));
  pointer-events: none;
}

/* ═══ PAGINE INTERNE ═══ */
.pagina-hero { padding-bottom: clamp(64px, 7vw, 110px); }
.pagina-hero__titolo { font-size: clamp(46px, 5.8vw, 86px); line-height: 0.95; }
.pagina-hero__titolo::after {
  content: "";
  display: block;
  width: clamp(200px, 22vw, 320px);
  height: clamp(10px, 1vw, 15px);
  margin-top: clamp(12px, 1.4vw, 20px);
  background: url("/assets/img/sottolineatura-verde.webp") left center / 100% 100% no-repeat;
}
.pagina-hero__media { position: relative; isolation: isolate; }
.pagina-hero__media::before, .pagina-hero__media::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  background: center / contain no-repeat;
}
.pagina-hero__media::before { right: -9%; bottom: -16%; width: 72%; aspect-ratio: 1; background-image: url("/assets/img/cerchio-salvia.webp"); }
.pagina-hero__media::after { right: -12%; bottom: -20%; width: 80%; aspect-ratio: 700 / 635; background-image: url("/assets/img/cerchio-verde.webp"); rotate: -12deg; animation: orbita 120s linear infinite; }
.pagina-hero__media:has(.composizione)::before, .pagina-hero__media:has(.composizione)::after { display: none; }

.composizione { isolation: isolate; }
.composizione::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -2% -4%;
  background: url("/assets/img/cerchio-rosso.webp") center / contain no-repeat;
  rotate: 24deg;
  opacity: 0.8;
  pointer-events: none;
  animation: orbita-indietro 140s linear infinite;
}
.composizione--logo::after { background-image: url("/assets/img/cerchio-verde.webp"); }

/* i passi: numeri più grandi, uniti da una linea tratteggiata da computer */
.passi li::before { font-size: clamp(64px, 6vw, 96px); }
@media (min-width: 960px) {
  .passi:not(.passi--due) { position: relative; }
  .passi:not(.passi--due)::before {
    content: "";
    position: absolute;
    left: 0;
    right: 6%;
    top: clamp(48px, 4.4vw, 70px);
    border-top: 2px dashed var(--salvia);
  }
  .passi:not(.passi--due) li::before { position: relative; display: inline-block; padding-right: 16px; background: var(--crema); }
  .sezione--salvia .passi:not(.passi--due) li::before { background: var(--salvia-chiaro); }
}

/* le domande su una scheda bianca */
.domande { padding: 4px clamp(18px, 2.4vw, 36px); border-top: 0; border-radius: 24px; background: var(--bianco); box-shadow: 0 30px 60px -40px rgba(40, 50, 30, 0.45); }
.domande details:last-child { border-bottom: 0; }

/* il confronto: le cifre del gelato grandi in verde, quelle dell'ice cream piccole e grigie */
.confronto__voce { border-radius: 22px; }
.confronto__riga--gelato strong { font-size: clamp(42px, 4.2vw, 64px); }
.confronto__riga:not(.confronto__riga--gelato) strong { font-size: clamp(26px, 2.4vw, 36px); color: var(--testo-2); }

/* le recensioni: schede con le virgolette grandi */
.recensione { position: relative; border-radius: 22px; padding-top: clamp(34px, 3vw, 44px); }
.recensione::before {
  content: "\201D";
  position: absolute;
  right: 22px;
  top: -6px;
  color: var(--salvia);
  font-family: var(--f-titolo);
  font-size: 96px;
  line-height: 1;
}

/* chi siamo: l'obiettivo, la frase più importante, grande sul tondo salvia */
.sezione:has(.citazione) .centrato { position: relative; isolation: isolate; }
.sezione:has(.citazione) .centrato::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 50%;
  top: 50%;
  width: min(80vw, 640px);
  aspect-ratio: 1;
  translate: -50% -50%;
  background: url("/assets/img/cerchio-salvia.webp") center / contain no-repeat;
  opacity: 0.9;
}
.citazione { font-size: clamp(32px, 3.9vw, 58px); max-width: 20em; }

/* contatti: le schede dei recapiti col bordo verde e i numeri grandi */
.scheda-contatto { border-top: 6px solid var(--verde); border-radius: 22px; }
.scheda-contatto a[href^="tel:"], .scheda-contatto a[href*="wa.me"] { font-size: 1.18em; }
.schede-foto .cornice { --ombra-piena: 10px 10px 0 var(--verde-banda); }

/* la 404: il cono dentro le orbite, come la hero */
.errore404__visual { position: relative; width: clamp(200px, 22vw, 280px); aspect-ratio: 1; margin: 0 auto 10px; }
.errore404__cerchio { position: absolute; inset: 6%; width: 88%; filter: saturate(1.9) brightness(0.955); }
.errore404__orbita { position: absolute; left: 50%; top: 50%; width: 104%; translate: -50% -50%; }
.errore404__orbita--verde { rotate: -14deg; animation: orbita 90s linear infinite; }
.errore404__orbita--rossa { width: 84%; rotate: 32deg; opacity: 0.85; animation: orbita-indietro 120s linear infinite; }
.errore404__cono { position: absolute; left: 50%; bottom: 0; height: 112%; width: auto; max-width: none; translate: -50% 0; filter: drop-shadow(0 20px 26px rgba(90, 60, 40, 0.2)); }

/* le pagine legali: la colonna di lettura e le tabelle su scheda */
.tabella-scorre { border-radius: 18px; background: var(--bianco); box-shadow: 0 20px 40px -30px rgba(40, 50, 30, 0.4); }
.legale table { margin: 0; }

/* ═══ TELEFONO ═══ */
@media (max-width: 959px) {
  .hero__griglia { min-height: 0; }
  .hero__testo { padding: 30px 0 4px; }
  .hero__visual { min-height: 0; height: clamp(400px, 104vw, 680px); margin-bottom: -70px; }
  .hero__orbita--verde { width: 96%; }
  .punti__lista { padding: 22px 14px; border-radius: 22px; row-gap: 18px; }
  .punto:first-child { padding-bottom: 18px; }
  .trailer__sole { left: auto; right: 2px; top: -26px; }
  .pagina-hero__media { margin-top: 10px; }
  .pagina-hero__media::before { right: -14%; bottom: -10%; }
  .pagina-hero__media::after { right: -18%; bottom: -14%; }
  .contatti__coppetta { left: auto; right: 6px; top: -62px; width: 104px; rotate: 10deg; }
}
@media (max-width: 600px) {
  .hero__titolo { font-size: clamp(58px, 17vw, 76px); }
  .hero__script { font-size: clamp(40px, 11.6vw, 50px); }
  .conta-cerchio { font-size: 1.4em; }
  .gusti__lista { gap: 12px; }
  .gusti-griglia { gap: 14px 12px; }
  .icone-riga img, .punto__icone img { width: 46px; height: 46px; padding: 16px; }
  .pc__blocco { padding: 16px; border-radius: 20px; }
  .pc__attestato { margin-top: -26px; }
  .domande { padding: 2px 16px; }
  .cornice, .trailer__foto, .video-box, .pc__foto { --ombra-piena: 9px 9px 0 var(--salvia); border-radius: 14px; }
  .sezione--salvia .cornice, .sezione--salvia .video-box, .trailer .trailer__foto { --ombra-piena: 9px 9px 0 var(--verde-banda); }
}

@media (prefers-reduced-motion: reduce) {
  .hero__orbita, .errore404__orbita, .pagina-hero__media::after, .composizione::after { animation: dissolvi 600ms ease both; }
  .icone-riga img, .punto__icone img, .gusti__lista .gusto, .gusti-griglia .gusto { transition: none; }
}

/* salto · secondo passaggio: le orbite centrate sul tondo salvia, il 44 che respira, la coppetta che non tocca il titolo */
.hero__orbita { top: 45%; left: 54%; }
.hero__orbita--verde { width: min(102%, 820px); }
.hero__orbita--rossa { top: 45%; left: 54%; width: min(90%, 720px); opacity: 0.7; }
.punto { justify-content: flex-start; padding-top: 10px; }
.punto:first-child { justify-content: flex-end; }
.gusti__cerchio { width: 128%; transform: translate(-50%, -50%) rotate(-8deg); }
.gusti__titolo { margin-bottom: clamp(10px, 1.6vw, 26px); }
.gusti__riga { margin-top: clamp(26px, 3vw, 44px); }
.contatti__coppetta { top: clamp(-150px, -9vw, -90px); width: clamp(100px, 9.6vw, 140px); }
@media (max-width: 959px) {
  .contatti__coppetta { right: 18px; top: -70px; width: 96px; rotate: 8deg; }
  .hero__orbita--rossa { width: 88%; }
}
.hero__orbita--rossa { top: 50%; left: 52%; width: min(76%, 600px); }
.pagina-hero__titolo { font-size: clamp(44px, 5.1vw, 76px); }
.pagina-hero__media::after { right: -6%; width: 74%; }