/*
Theme Name: 21 giorni per sceglierTi
Description: Tema su misura per il Metodo. La grafica sta qui; i testi e le
  fotografie che la cliente puo' cambiare stanno nel pannello Contenuti.
Author: Cristiano
Version: 1.0
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: 21giorni
*/

/* Il foglio e' quello della proposta, portato qui senza ritocchi: la grafica
   approvata e quella pubblicata devono essere lo stesso file, se no divergono
   al primo cambiamento. */
/* ── I CARATTERI, OSPITATI QUI ─────────────────────────────────────────────
   Non su Google Fonts. Non e' pignoleria: ogni visita manderebbe l'indirizzo
   IP di chi guarda a un terzo, andrebbe dichiarato nella cookie policy, e la
   pagina dipenderebbe da un servizio che puo' non rispondere — il controllo
   telefono e' andato in timeout proprio per quello.

   Sono font VARIABILI: un file solo copre tutti i pesi dell'intervallo, ed e'
   il motivo per cui bastano 297 KB invece di 800. Il corsivo di Newsreader e'
   disegnato, non inclinato dal browser: per questo ha un file suo.

   font-display: swap — il testo si legge subito col carattere di sistema e
   poi cambia. L'alternativa e' mezzo secondo di pagina bianca.            */

@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('caratteri/newsreader-dritto.woff2') format('woff2');
}
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 200 800;
  font-display: swap;
  src: url('caratteri/newsreader-corsivo.woff2') format('woff2');
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('caratteri/manrope-dritto.woff2') format('woff2');
}

:root {
    --avorio: #FDF7EC;
    --panna: #FFFCF6;
    --sabbia: #F7EEDD;
    --rosa-tenue: #FCEAF0;
    --rosa-chiaro: #F6C9D6;
    --rosa: #EE7FA5;
    --linea: #E9DCC6;
    --linea-forte: #D8C4A6;
    --bruno: #43332F;
    --bruno-2: #7A6660;
    --bruno-3: #A9958D;
    --fucsia: #C2276B;
    --fucsia-scuro: #8E1748;
    --oro: #E0A02E;
    --oro-chiaro: #FADFA0;
    --oro-ink: #9A7326;
    --notte: #2A1D1A;

    --disp: 'Newsreader', 'Iowan Old Style', Georgia, serif;
    --ui: 'Manrope', 'Avenir Next', system-ui, sans-serif;
    --gut: clamp(20px, 4.5vw, 72px);
    --band: clamp(64px, 7.5vw, 116px);
    --max: 1280px;
  }
  :root{
  --b-raggi: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20400%20210%27%3E%3Cline%20x1%3D%22146.0%22%20y1%3D%22200.0%22%20x2%3D%224.0%22%20y2%3D%22200.0%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22146.1%22%20y1%3D%22196.4%22%20x2%3D%2222.4%22%20y2%3D%22188.1%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22146.5%22%20y1%3D%22192.8%22%20x2%3D%225.7%22%20y2%3D%22173.9%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22147.1%22%20y1%3D%22189.2%22%20x2%3D%2225.6%22%20y2%3D%22164.5%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22147.9%22%20y1%3D%22185.7%22%20x2%3D%2211.0%22%20y2%3D%22148.2%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22149.0%22%20y1%3D%22182.3%22%20x2%3D%2231.8%22%20y2%3D%22141.6%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22150.3%22%20y1%3D%22178.9%22%20x2%3D%2219.6%22%20y2%3D%22123.5%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22151.8%22%20y1%3D%22175.6%22%20x2%3D%2241.1%22%20y2%3D%22119.7%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22153.5%22%20y1%3D%22172.5%22%20x2%3D%2231.4%22%20y2%3D%22100.1%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22155.5%22%20y1%3D%22169.4%22%20x2%3D%2253.2%22%20y2%3D%2299.3%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22157.6%22%20y1%3D%22166.5%22%20x2%3D%2246.2%22%20y2%3D%2278.5%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22160.0%22%20y1%3D%22163.8%22%20x2%3D%2268.0%22%20y2%3D%2280.6%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22162.5%22%20y1%3D%22161.2%22%20x2%3D%2263.7%22%20y2%3D%2259.1%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22165.1%22%20y1%3D%22158.8%22%20x2%3D%2285.1%22%20y2%3D%2264.1%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22168.0%22%20y1%3D%22156.5%22%20x2%3D%2283.7%22%20y2%3D%2242.2%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22170.9%22%20y1%3D%22154.5%22%20x2%3D%22104.2%22%20y2%3D%2250.0%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22174.0%22%20y1%3D%22152.6%22%20x2%3D%22105.8%22%20y2%3D%2228.1%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22177.3%22%20y1%3D%22151.0%22%20x2%3D%22125.1%22%20y2%3D%2238.5%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22180.6%22%20y1%3D%22149.6%22%20x2%3D%22129.6%22%20y2%3D%2217.1%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22184.0%22%20y1%3D%22148.4%22%20x2%3D%22147.3%22%20y2%3D%2230.0%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22187.5%22%20y1%3D%22147.5%22%20x2%3D%22154.6%22%20y2%3D%229.3%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22191.0%22%20y1%3D%22146.8%22%20x2%3D%22170.4%22%20y2%3D%2224.5%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22194.6%22%20y1%3D%22146.3%22%20x2%3D%22180.4%22%20y2%3D%225.0%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22198.2%22%20y1%3D%22146.0%22%20x2%3D%22194.1%22%20y2%3D%2222.1%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22201.8%22%20y1%3D%22146.0%22%20x2%3D%22206.5%22%20y2%3D%224.1%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22205.4%22%20y1%3D%22146.3%22%20x2%3D%22217.8%22%20y2%3D%2222.9%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22209.0%22%20y1%3D%22146.8%22%20x2%3D%22232.6%22%20y2%3D%226.7%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22212.5%22%20y1%3D%22147.5%22%20x2%3D%22241.3%22%20y2%3D%2226.8%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22216.0%22%20y1%3D%22148.4%22%20x2%3D%22258.1%22%20y2%3D%2212.8%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22219.4%22%20y1%3D%22149.6%22%20x2%3D%22264.0%22%20y2%3D%2233.9%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22222.7%22%20y1%3D%22151.0%22%20x2%3D%22282.5%22%20y2%3D%2222.2%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22226.0%22%20y1%3D%22152.6%22%20x2%3D%22285.5%22%20y2%3D%2243.9%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22229.1%22%20y1%3D%22154.5%22%20x2%3D%22305.5%22%20y2%3D%2234.8%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22232.0%22%20y1%3D%22156.5%22%20x2%3D%22305.6%22%20y2%3D%2256.7%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22234.9%22%20y1%3D%22158.8%22%20x2%3D%22326.5%22%20y2%3D%2250.3%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22237.5%22%20y1%3D%22161.2%22%20x2%3D%22323.7%22%20y2%3D%2272.0%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22240.0%22%20y1%3D%22163.8%22%20x2%3D%22345.4%22%20y2%3D%2268.5%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22242.4%22%20y1%3D%22166.5%22%20x2%3D%22339.7%22%20y2%3D%2289.7%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22244.5%22%20y1%3D%22169.4%22%20x2%3D%22361.6%22%20y2%3D%2289.1%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22246.5%22%20y1%3D%22172.5%22%20x2%3D%22353.2%22%20y2%3D%22109.3%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22248.2%22%20y1%3D%22175.6%22%20x2%3D%22374.9%22%20y2%3D%22111.6%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22249.7%22%20y1%3D%22178.9%22%20x2%3D%22363.9%22%20y2%3D%22130.5%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22251.0%22%20y1%3D%22182.3%22%20x2%3D%22385.2%22%20y2%3D%22135.7%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22252.1%22%20y1%3D%22185.7%22%20x2%3D%22371.7%22%20y2%3D%22153.0%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22252.9%22%20y1%3D%22189.2%22%20x2%3D%22392.1%22%20y2%3D%22161.0%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22253.5%22%20y1%3D%22192.8%22%20x2%3D%22376.4%22%20y2%3D%22176.3%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22253.9%22%20y1%3D%22196.4%22%20x2%3D%22395.6%22%20y2%3D%22186.9%22%20stroke%3D%22currentColor%22%20stroke-width%3D%223.4%22%20stroke-linecap%3D%22round%22%2F%3E%3Cline%20x1%3D%22254.0%22%20y1%3D%22200.0%22%20x2%3D%22378.0%22%20y2%3D%22200.0%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.6%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E");
  --b-sentiero: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20160%20620%27%3E%3Cpath%20d%3D%27M80%20620C80%20540%2034%20500%2034%20430%2034%20366%20118%20340%20118%20272%20118%20208%2046%20186%2046%20126%2046%2076%2080%2044%2080%200%27%20fill%3D%27none%27%20stroke%3D%27currentColor%27%20stroke-width%3D%272.4%27%20stroke-linecap%3D%27round%27%20stroke-dasharray%3D%271%2014%27%2F%3E%3C%2Fsvg%3E");
  --b-anello: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20200%20200%27%3E%3Ccircle%20cx%3D%27100%27%20cy%3D%27100%27%20r%3D%2796%27%20fill%3D%27none%27%20stroke%3D%27currentColor%27%20stroke-width%3D%272.6%27%2F%3E%3Ccircle%20cx%3D%27100%27%20cy%3D%27100%27%20r%3D%2788%27%20fill%3D%27none%27%20stroke%3D%27currentColor%27%20stroke-width%3D%271%27%20opacity%3D%27.55%27%2F%3E%3C%2Fsvg%3E");
}
  * { box-sizing: border-box; }
  body {
    margin: 0; background: var(--avorio); color: var(--bruno);
    font-family: var(--ui); font-size: 16.5px; line-height: 1.68; -webkit-font-smoothing: antialiased;
  }
  h1, h2, h3 { font-family: var(--disp); font-weight: 600; letter-spacing: -0.022em; margin: 0; line-height: 1.08; text-wrap: balance; }
  p { margin: 0; }
  a { color: var(--fucsia); text-decoration: none; }
  img { display: block; max-width: 100%; }
  :focus-visible { outline: 2px solid var(--fucsia); outline-offset: 3px; }

  .wrap { padding-left: var(--gut); padding-right: var(--gut); }
  .inner { max-width: var(--max); margin: 0 auto; }
  .mx { margin-left: auto; margin-right: auto; }
  .centro { text-align: center; }
  .rel { position: relative; }

  .t1 { font-size: clamp(38px, 5.4vw, 70px); }
  .t2 { font-size: clamp(28px, 3.5vw, 45px); }
  .t3 { font-size: clamp(20px, 2vw, 26px); }
  .lead { font-size: clamp(16.5px, 1.28vw, 19px); line-height: 1.7; color: var(--bruno-2); max-width: 64ch; }
  .txt { color: var(--bruno-2); }
  .mini { font-size: 14px; }
  .cifra { font-family: var(--disp); font-weight: 500; font-variant-numeric: lining-nums tabular-nums; letter-spacing: -0.03em; line-height: 1; }

  .occhio { display: inline-flex; align-items: center; gap: 12px; font-size: 11.5px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--oro-ink); }
  .occhio::before { content: ""; width: 26px; height: 1.5px; background: var(--oro); flex-shrink: 0; }
  .occhio.chiaro { color: var(--oro-chiaro); }
  .occhio.chiaro::before { background: var(--oro-chiaro); }

  .btn { font-family: var(--ui); font-size: 15.5px; font-weight: 700; background: transparent; border: 1.5px solid transparent; border-radius: 3px; padding: 16px 30px; min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; cursor: pointer; line-height: 1.2; text-align: center; transition: background-color .18s ease, color .18s ease, border-color .18s ease; }
  .btn-p { background: var(--fucsia); color: var(--panna); }
  .btn-p:hover { background: var(--fucsia-scuro); }
  .btn-o { border-color: var(--linea-forte); color: var(--bruno); }
  .btn-o:hover { border-color: var(--fucsia); color: var(--fucsia); }
  .btn-c { border-color: rgba(253,247,236,.62); color: var(--avorio); background: rgba(253,247,236,.10); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
  .btn-c:hover { background: var(--avorio); color: var(--notte); border-color: var(--avorio); }
  .btn-b { width: 100%; }

  /* ── corredo di marca ── */
  .raggi { position: absolute; background-color: currentColor; pointer-events: none;
    -webkit-mask: var(--b-raggi) center bottom/contain no-repeat; mask: var(--b-raggi) center bottom/contain no-repeat; }
  .sentiero-orn { position: absolute; background-color: currentColor; pointer-events: none;
    -webkit-mask: var(--b-sentiero) center/contain no-repeat; mask: var(--b-sentiero) center/contain no-repeat; }
  .colline { display: block; width: 100%; height: clamp(48px, 6vw, 96px); }
  .grana { position: absolute; inset: 0; pointer-events: none; opacity: .5; mix-blend-mode: multiply; background-size: 420px; }

  .anello { position: relative; width: 100%; aspect-ratio: 1; border-radius: 999px; overflow: hidden; }
  .anello img { width: 100%; height: 100%; object-fit: cover; border-radius: 999px; }
  .con-anello { position: relative; }
  .con-anello::after { content: ""; position: absolute; inset: -14px; border-radius: 999px; border: 1.5px solid var(--oro); opacity: .75; pointer-events: none; }
  .con-anello::before { content: ""; position: absolute; inset: -24px; border-radius: 999px; border: 1px solid var(--rosa); opacity: .5; pointer-events: none; }

  /* testata */
  header { position: sticky; top: 0; z-index: 60; background: color-mix(in srgb, var(--avorio) 90%, transparent); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid transparent; transition: border-color .2s ease; }
  header.giu { border-bottom-color: var(--linea); }
  .bar { display: flex; align-items: center; justify-content: space-between; gap: 22px; height: 84px; }
  .marchio { display: flex; align-items: center; gap: 13px; background: none; border: none; cursor: pointer; padding: 0; }
  .marchio img { width: 56px; height: 56px; object-fit: contain; }
  .marchio b { display: block; font-family: var(--disp); font-weight: 600; font-size: 19px; letter-spacing: -0.02em; color: var(--bruno); text-align: left; line-height: 1.05; }
  .marchio i { font-style: normal; display: block; font-size: 9.5px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--oro-ink); margin-top: 3px; }
  nav { display: flex; align-items: center; gap: 30px; }
  .nl { font-family: var(--ui); font-size: 14.5px; font-weight: 600; color: var(--bruno); background: none; border: none; padding: 6px 0; cursor: pointer; border-bottom: 1.5px solid transparent; }
  .nl:hover { color: var(--fucsia); border-bottom-color: var(--fucsia); }
  .burger { display: none; width: 48px; height: 48px; background: none; border: none; cursor: pointer; flex-direction: column; align-items: flex-end; justify-content: center; gap: 6px; }
  .burger span { display: block; width: 25px; height: 2px; background: var(--bruno); }
  @media (max-width: 1040px) {
    .bar { height: 70px; } nav { display: none; } .burger { display: flex; }
    nav.open { display: flex; flex-direction: column; align-items: stretch; gap: 0; position: fixed; inset: 70px 0 0 0; background: var(--notte); z-index: 70; padding: 28px var(--gut); overflow-y: auto; }
    nav.open .nl { font-family: var(--disp); font-size: 30px; font-weight: 600; color: var(--avorio); text-align: left; padding: 16px 0; border-bottom: 1px solid rgba(253,247,236,.16); }
  }

  .band { padding-top: var(--band); padding-bottom: var(--band); }
  .b-panna { background: var(--panna); }
  .b-sabbia { background: var(--sabbia); }
  .b-rosa { background: var(--rosa-tenue); }
  .b-notte { background: var(--notte); color: var(--avorio); }
  .b-notte .txt, .b-notte .lead { color: rgba(253,247,236,.76); }
  .b-notte h1, .b-notte h2, .b-notte h3 { color: var(--avorio); }

  .due { display: grid; grid-template-columns: 1.12fr .88fr; gap: clamp(30px, 5vw, 76px); align-items: start; }
  .due-c { align-items: center; }
  .due-r { grid-template-columns: .88fr 1.12fr; }
  .g2 { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 22px; }
  .g3 { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 26px; }
  .g4 { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1px; background: var(--linea); border: 1px solid var(--linea); }
  .g4 > * { background: var(--panna); padding: 30px 26px; }
  @media (max-width: 1040px) { .due, .due-r, .g3, .g4 { grid-template-columns: repeat(2, minmax(0,1fr)); } }
  @media (max-width: 700px) { .due, .due-r, .g2, .g3, .g4 { grid-template-columns: 1fr; } }
  .pila { display: flex; flex-direction: column; gap: 18px; }
  .azioni { display: flex; flex-wrap: wrap; gap: 14px; }
  .cresci { flex-grow: 1; }

  /* apertura */
  .hero { position: relative; overflow: hidden; padding-top: clamp(30px, 4vw, 56px); padding-bottom: clamp(46px, 5vw, 76px); }
  .hero .cielo { position: absolute; inset: 0 0 auto 0; height: min(560px, 62%); overflow: hidden; }
  .hero .cielo img { width: 100%; height: 100%; object-fit: cover; opacity: .34; }
  .hero .cielo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(253,247,236,.42) 0%, rgba(253,247,236,.72) 46%, var(--avorio) 100%); }
  .hero .raggi { left: 50%; top: -34px; transform: translateX(-50%); width: min(760px, 108%); aspect-ratio: 400/210; color: var(--oro); opacity: .3; }
  .sigillo { width: min(330px, 66vw); height: auto; margin: 0 auto; filter: drop-shadow(0 18px 34px rgba(67,51,47,.16)); }
  .marca { font-family: var(--disp); font-size: clamp(20px, 2.2vw, 29px); font-weight: 500; color: var(--fucsia); font-style: italic; }

  .numeri { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--linea); border-bottom: 1px solid var(--linea); }
  .numeri > div { padding: 26px 20px; text-align: center; border-left: 1px solid var(--linea); }
  .numeri > div:first-child { border-left: none; }
  .numeri .cifra { font-size: clamp(30px, 3.2vw, 44px); color: var(--fucsia); }
  .numeri .eti { font-size: 12.5px; font-weight: 600; color: var(--bruno-2); margin-top: 8px; line-height: 1.35; }
  @media (max-width: 700px) { .numeri { grid-template-columns: repeat(2, 1fr); } .numeri > div:nth-child(odd) { border-left: none; } .numeri > div:nth-child(n+3) { border-top: 1px solid var(--linea); } }

  /* banda fotografica */
  .banda { position: relative; overflow: hidden; }
  .banda > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .banda .velo { position: absolute; inset: 0; }
  .banda .dentro { position: relative; }

  /* tappe */
  .tappe { display: grid; grid-template-columns: repeat(5, 1fr); position: relative; }
  .tappe::before { content: ""; position: absolute; left: 8%; right: 8%; top: 33px; height: 1.5px; background: linear-gradient(90deg, var(--oro), var(--rosa), var(--fucsia)); }
  .tappa { position: relative; padding: 0 12px; text-align: center; }
  .tappa .bollo { width: 66px; height: 66px; border-radius: 999px; margin: 0 auto; display: grid; place-items: center; background: var(--panna); border: 1.5px solid var(--linea-forte); position: relative; z-index: 2; }
  .tappa.forte .bollo { background: var(--fucsia); border-color: var(--fucsia); color: var(--panna); }
  .tappa.morbida .bollo { background: var(--sabbia); border-style: dashed; }
  .tappa .bollo span { font-family: var(--disp); font-size: 20px; font-weight: 600; }
  .tappa h3 { margin-top: 15px; font-size: 18px; }
  .tappa .durata { font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--oro-ink); margin-top: 7px; }
  @media (max-width: 1040px) { .tappe { grid-template-columns: 1fr; gap: 22px; } .tappe::before { left: 33px; right: auto; top: 24px; bottom: 24px; width: 1.5px; height: auto; background: linear-gradient(180deg, var(--oro), var(--fucsia)); } .tappa { display: grid; grid-template-columns: 66px 1fr; gap: 20px; text-align: left; padding: 0; align-items: center; } .tappa h3 { margin-top: 0; } }

  /* capitoli */
  .capitolo { background: var(--panna); border: 1px solid var(--linea); padding: 0 0 30px; display: flex; flex-direction: column; }
  .capitolo .foto { position: relative; aspect-ratio: 4/3; overflow: hidden; }
  .capitolo .foto img { width: 100%; height: 100%; object-fit: cover; }
  .capitolo .foto span { position: absolute; left: 20px; bottom: 18px; font-family: var(--disp); font-size: 46px; font-weight: 600; color: var(--panna); text-shadow: 0 3px 16px rgba(0,0,0,.5); line-height: 1; }
  .capitolo .corpo { padding: 26px 26px 0; display: flex; flex-direction: column; gap: 12px; flex-grow: 1; }
  .capitolo .durata { font-size: 11px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--oro-ink); }
  .capitolo p { font-size: 15px; color: var(--bruno-2); line-height: 1.62; }
  .capitolo .stato { font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--fucsia); padding: 0 26px; margin-top: 14px; }

  .scheda { background: var(--panna); border: 1px solid var(--linea); padding: 30px 28px; display: flex; flex-direction: column; gap: 12px; }
  .scheda .num { font-family: var(--disp); font-size: 15px; font-weight: 600; color: var(--oro-ink); letter-spacing: .1em; }
  .scheda h3 { font-size: 21px; }
  .scheda p { font-size: 15px; color: var(--bruno-2); line-height: 1.62; }

  /* giorni */
  .giorno { display: grid; grid-template-columns: 92px 1fr auto; gap: 24px; padding: 22px 0; border-top: 1px solid var(--linea); align-items: center; }
  .giorno:last-child { border-bottom: 1px solid var(--linea); }
  .giorno .g { font-family: var(--disp); font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--oro-ink); }
  .giorno h3 { font-size: 21px; }
  .giorno p { font-size: 15px; color: var(--bruno-2); margin-top: 6px; }
  .giorno .etichette { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 11px; }
  .giorno .etichette span { font-size: 11px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; border: 1px solid var(--linea-forte); border-radius: 2px; padding: 4px 10px; color: var(--bruno-2); }
  .giorno .mini-foto { width: 96px; height: 96px; border-radius: 999px; overflow: hidden; flex-shrink: 0; }
  .giorno .mini-foto img { width: 100%; height: 100%; object-fit: cover; }
  @media (max-width: 860px) { .giorno { grid-template-columns: 1fr; gap: 10px; } .giorno .mini-foto { display: none; } }

  .temi { display: flex; flex-wrap: wrap; gap: 9px; }
  .temi span { font-size: 13.5px; font-weight: 600; background: var(--panna); border: 1px solid var(--linea); border-radius: 2px; padding: 9px 15px; color: var(--bruno-2); }

  /* schermate */
  .telaio { background: var(--panna); border: 1px solid var(--linea); box-shadow: 0 30px 64px -46px rgba(67,51,47,.6); }
  .telaio .barra { display: flex; align-items: center; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--linea); background: var(--sabbia); }
  .telaio .barra i { width: 9px; height: 9px; border-radius: 999px; background: var(--linea-forte); display: block; }
  .telaio .barra em { font-style: normal; margin-left: 10px; font-size: 11.5px; color: var(--bruno-3); letter-spacing: .02em; }
  .app { width: 320px; margin: 0 auto; border: 10px solid var(--notte); border-radius: 34px; overflow: hidden; background: var(--panna); box-shadow: 0 34px 70px -44px rgba(42,29,26,.9); }
  .app .schermo { height: 620px; overflow: hidden; display: flex; flex-direction: column; }

  .voce-app { display: flex; gap: 13px; align-items: flex-start; padding: 15px 0; border-bottom: 1px solid var(--linea); }
  .voce-app:last-child { border-bottom: none; }
  .voce-app .pallino { width: 30px; height: 30px; border-radius: 999px; display: grid; place-items: center; flex-shrink: 0; background: var(--rosa-tenue); color: var(--fucsia); }
  .voce-app b { display: block; font-size: 14.5px; }
  .voce-app span { display: block; font-size: 13px; color: var(--bruno-2); margin-top: 2px; }

  .file { display: flex; align-items: center; gap: 14px; padding: 15px 18px; border: 1px solid var(--linea); background: var(--panna); }
  .file .tipo { font-size: 10px; font-weight: 800; letter-spacing: .1em; border: 1px solid var(--linea-forte); padding: 4px 7px; color: var(--oro-ink); flex-shrink: 0; }
  .file b { font-size: 14.5px; font-weight: 700; }
  .file span { font-size: 12.5px; color: var(--bruno-3); }
  .file .scarica { margin-left: auto; color: var(--fucsia); flex-shrink: 0; }

  .prima-dopo { display: grid; grid-template-columns: 1fr auto 1fr; gap: 24px; align-items: center; }
  .prima-dopo .col { background: var(--panna); border: 1px solid var(--linea); padding: 26px 24px; }
  @media (max-width: 780px) { .prima-dopo { grid-template-columns: 1fr; } .prima-dopo .freccia { transform: rotate(90deg); margin: 0 auto; } }

  .listino { border: 1px solid var(--linea); background: var(--panna); padding: 34px 32px; display: flex; flex-direction: column; gap: 16px; }
  .listino.forte { border-color: var(--fucsia); border-width: 2px; }
  .listino .tag { font-size: 11px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--oro-ink); }
  .listino .prezzo { font-family: var(--disp); font-size: clamp(34px, 3.6vw, 46px); font-weight: 500; color: var(--fucsia); letter-spacing: -0.03em; line-height: 1; }
  .listino ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 11px; }
  .listino li { display: flex; gap: 11px; align-items: flex-start; font-size: 15px; color: var(--bruno-2); }
  .listino li svg { flex-shrink: 0; margin-top: 4px; color: var(--oro); }

  footer { background: var(--notte); color: rgba(253,247,236,.8); }
  footer .cols { display: flex; justify-content: space-between; gap: 44px; flex-wrap: wrap; padding-top: 54px; padding-bottom: 54px; }
  footer .lk { background: none; border: none; padding: 0; font-family: var(--ui); font-size: 14.5px; color: rgba(253,247,236,.8); cursor: pointer; text-align: left; }
  footer .lk:hover { color: var(--oro-chiaro); }
  footer .disc { font-size: 13.5px; color: rgba(253,247,236,.5); line-height: 1.65; max-width: 56ch; }


  /* la finestra dell'area personale si impila sugli schermi stretti */
  .telaio > div[style*="grid-template-columns"] { }
  @media (max-width: 860px) {
    .telaio .griglia-area { grid-template-columns: 1fr !important; }
    .telaio .griglia-area aside { border-right: none !important; border-bottom: 1px solid var(--linea); }
    .app { width: 100%; max-width: 320px; }
  }
  @media (max-width: 1040px) { .prima-dopo { grid-template-columns: 1fr; } .prima-dopo .freccia, .prima-dopo svg.fr { transform: rotate(90deg); margin: 0 auto; } }

  /* ═══ testata rifatta: striscia + barra che galleggia sulla fotografia ═══ */
  :root { --h-testa: 122px; }
  @media (max-width: 1040px) { :root { --h-testa: 104px; } }

  .testata { position: fixed; top: 0; left: 0; right: 0; z-index: 70; transition: background-color .3s ease, box-shadow .3s ease; }
  .testata::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
    background: linear-gradient(90deg, var(--oro), var(--rosa), var(--fucsia)); opacity: 0; transition: opacity .3s ease; }
  .testata.giu { background: color-mix(in srgb, var(--avorio) 95%, transparent); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 12px 34px -28px rgba(67,51,47,.7); }
  .testata.giu::after { opacity: 1; }

  .striscia { background: rgba(42,29,26,.62); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-bottom: 1px solid rgba(253,247,236,.16); transition: background-color .3s ease, border-color .3s ease; }
  .testata.giu .striscia { background: var(--notte); border-bottom-color: transparent; }
  .striscia .dentro { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 10px 0; }
  .striscia p, .striscia span { font-size: 13.5px; font-weight: 700; letter-spacing: .06em; color: rgba(253,247,236,.9); }
  .striscia .segna { display: inline-flex; align-items: center; gap: 10px; }
  .striscia .segna::before { content: ""; width: 7px; height: 7px; border-radius: 999px; background: var(--oro); flex-shrink: 0; box-shadow: 0 0 0 4px rgba(224,160,46,.22); }
  .striscia .accedi { display: inline-flex; align-items: center; gap: 8px; color: var(--oro-chiaro); }
  @media (max-width: 760px) { .striscia .accedi { display: none; } .striscia .dentro { justify-content: center; } }

  .testata .bar { height: 84px; }
  @media (max-width: 1040px) { .testata .bar { height: 68px; } }
  .testata .marchio img, .testata .marchio > svg { width: 54px; height: 54px; transition: width .3s ease, height .3s ease; }
  .testata.giu .marchio img, .testata.giu .marchio > svg { width: 46px; height: 46px; }
  .testata .marchio b { color: var(--avorio); }
  .testata .marchio i { color: var(--oro-chiaro); }
  .testata.giu .marchio b { color: var(--bruno); }
  .testata.giu .marchio i { color: var(--oro-ink); }

  .testata .nl { position: relative; color: rgba(253,247,236,.92); border-bottom: none; padding: 10px 2px; letter-spacing: .01em; }
  .testata.giu .nl { color: var(--bruno); }
  .testata .nl::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 6px; height: 6px; border-radius: 999px;
    background: var(--oro); transform: translateX(-50%) scale(0); transition: transform .22s cubic-bezier(.3,1.5,.5,1); }
  .testata .nl:hover { color: var(--avorio); border-bottom: none; }
  .testata.giu .nl:hover { color: var(--fucsia); }
  .testata .nl:hover::after { transform: translateX(-50%) scale(1); }
  .testata .divisorio { width: 1px; height: 26px; background: rgba(253,247,236,.28); }
  .testata.giu .divisorio { background: var(--linea-forte); }
  .testata .btn-p svg { transition: transform .2s ease; }
  .testata .btn-p:hover svg { transform: translateX(3px); }
  .testata .burger span { background: var(--avorio); }
  .testata.giu .burger span { background: var(--bruno); }

  /* ═══ apertura A ═══ */
  .apertura { position: relative; overflow: hidden; background: var(--notte); padding-top: var(--h-testa); }
  .apertura > .sfondo { position: absolute; inset: 0; }
  .apertura > .sfondo img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); }
  .apertura > .velo { position: absolute; inset: 0; background:
      radial-gradient(120% 84% at 50% 36%, rgba(42,29,26,.22) 0%, rgba(42,29,26,.64) 56%, rgba(42,29,26,.88) 100%),
      linear-gradient(180deg, rgba(42,29,26,.72) 0%, rgba(42,29,26,.16) 26%, rgba(42,29,26,.56) 70%, rgba(42,29,26,.94) 100%); }
  .apertura .corpo { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; gap: 16px; padding-top: clamp(34px, 4.4vw, 62px); padding-bottom: clamp(44px, 5.4vw, 78px);
    min-height: min(74svh, 660px); }
  .apertura .raggi { left: 50%; top: 2%; transform: translateX(-50%); width: min(780px, 112%); aspect-ratio: 400/210;
    color: var(--oro-chiaro); opacity: .22; }
  .apertura .sigillo { position: relative; width: min(300px, 60vw); height: auto; filter: drop-shadow(0 26px 54px rgba(0,0,0,.42)); }
  .apertura h1 { color: var(--avorio); max-width: 17ch; }
  .apertura .marca { color: var(--oro-chiaro); font-style: italic; }
  .apertura .lead { color: rgba(253,247,236,.85); }
  .apertura .sotto { font-size: 14px; color: rgba(253,247,236,.66); }
  .apertura .numeri { position: relative; background: rgba(42,29,26,.46); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
    border-top: 1px solid rgba(253,247,236,.2); border-bottom: none; }
  .apertura .numeri > div { border-left-color: rgba(253,247,236,.2); }
  .apertura .numeri .cifra { color: var(--oro-chiaro); }
  .apertura .numeri .eti { color: rgba(253,247,236,.74); }
  @media (max-width: 700px) { .apertura .numeri > div:nth-child(n+3) { border-top-color: rgba(253,247,236,.2); } }

  @media (max-width: 1040px) {
    .testata nav.open { inset: var(--h-testa) 0 0 0; padding-top: 30px; }
    .testata nav.open .nl { color: var(--avorio); }
    .testata nav.open .nl::after { display: none; }
    .testata nav.open .divisorio { display: none; }
  }


  /* ═══ scaletta dei capitoli sugli schermi stretti ═══ */
  @media (max-width: 1040px) {
    .tappe { gap: 4px; }
    .tappa { grid-template-columns: 66px 1fr; align-items: center; padding: 7px 0; }
    .tappa > div:last-child { display: flex; align-items: baseline; justify-content: space-between;
      gap: 18px; border-bottom: 1px solid var(--linea); padding-bottom: 10px; }
    .tappa:last-child > div:last-child { border-bottom: none; }
    .tappa .durata { margin-top: 0; flex-shrink: 0; }
  }


  /* ═══ piede ═══ */
  footer { position: relative; overflow: hidden; }
  footer::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px;
    background: linear-gradient(90deg, var(--oro), var(--rosa), var(--fucsia)); }
  footer .bagliore { left: 50%; bottom: -46%; transform: translateX(-50%);
    width: min(1020px, 128%); aspect-ratio: 400/210; color: var(--oro-chiaro); opacity: .05; }

  footer .alto { position: relative; display: grid; grid-template-columns: 1.5fr 1fr 1.3fr 1.05fr;
    gap: 44px; padding-top: 64px; padding-bottom: 48px; }
  @media (max-width: 1040px) { footer .alto { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 40px 34px; } }
  @media (max-width: 620px) { footer .alto { grid-template-columns: 1fr; gap: 34px; } }

  footer .tit { font-size: 11px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase;
    color: var(--oro-chiaro); margin-bottom: 17px; }
  footer .tit + .voci { margin-top: -11px; }
  footer .voci { display: flex; flex-direction: column; gap: 0; align-items: flex-start; }
  footer .voci .lk { padding: 11px 0; }
  footer .lk:disabled { cursor: default; }

  footer .fatti { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 11px; }
  footer .fatti li { display: flex; gap: 11px; font-size: 13.5px; line-height: 1.5; color: rgba(253,247,236,.68); }
  footer .fatti li::before { content: ""; width: 5px; height: 5px; border-radius: 999px; background: var(--oro);
    margin-top: 8px; flex: none; }

  footer .payoff { font-family: var(--disp); font-style: italic; font-size: 18.5px; line-height: 1.35;
    color: var(--oro-chiaro); margin-top: 18px; }
  footer .partenza { display: inline-flex; align-items: center; gap: 10px; align-self: flex-start; margin-top: 20px;
    border: 1px solid rgba(253,247,236,.22); border-radius: 999px; padding: 8px 16px;
    font-size: 12px; font-weight: 700; letter-spacing: .04em; color: rgba(253,247,236,.9); }
  footer .partenza::before { content: ""; width: 7px; height: 7px; border-radius: 999px; background: var(--oro);
    box-shadow: 0 0 0 4px rgba(224,160,46,.22); flex: none; }

  footer .recapito { display: flex; flex-direction: column; gap: 4px; margin-bottom: 15px; }
  footer .recapito .eti { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
    color: rgba(253,247,236,.45); }
  footer .recapito .val { font-size: 14.5px; color: rgba(253,247,236,.86); }
  /* la mail e' un collegamento: sul telefono deve essere grande almeno
     quanto un polpastrello, non alta quanto la sua riga di testo */
  footer .recapito a.val { display: inline-block; padding: 8px 0; }

  footer .basso { position: relative; border-top: 1px solid rgba(253,247,236,.14);
    padding-top: 26px; padding-bottom: 38px; }
  footer .basso .riga { display: flex; flex-wrap: wrap; justify-content: space-between;
    align-items: baseline; gap: 12px 30px; margin-top: 20px; }
  footer .basso p, footer .legali .lk { font-size: 13.5px; color: rgba(253,247,236,.58); }
  footer .legali { display: flex; flex-wrap: wrap; gap: 4px 22px; margin: -11px 0; }
  footer .legali .lk { padding: 11px 0; }



  /* ═══ pannelli dei documenti legali ═══ */
  .documento { position: fixed; inset: 0; z-index: 90; display: none; }
  .documento.aperto { display: block; }
  .documento .scrim { position: absolute; inset: 0; background: rgba(42,29,26,.74);
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
  .documento .foglio { position: relative; margin: clamp(14px, 4vh, 54px) auto; max-width: 880px;
    width: calc(100% - clamp(20px, 6vw, 64px)); max-height: calc(100svh - clamp(28px, 8vh, 108px));
    background: var(--avorio); border: 1px solid var(--linea-forte);
    box-shadow: 0 44px 96px -52px rgba(0,0,0,.85); display: flex; flex-direction: column; }
  .documento .capo { position: relative; flex: none; padding: 26px clamp(22px, 4vw, 46px) 20px;
    border-bottom: 1px solid var(--linea); background: var(--panna); }
  .documento .capo::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px;
    background: linear-gradient(90deg, var(--oro), var(--rosa), var(--fucsia)); }
  .documento .capo h2 { margin-top: 12px; padding-right: 52px; }
  .documento .chiudi { position: absolute; top: 20px; right: clamp(16px, 3vw, 26px); width: 42px; height: 42px;
    border-radius: 999px; border: 1px solid var(--linea-forte); background: var(--avorio); color: var(--bruno);
    font-size: 21px; line-height: 1; cursor: pointer; display: grid; place-items: center; }
  .documento .chiudi:hover { border-color: var(--fucsia); color: var(--fucsia); }
  .documento .testo { overflow-y: auto; -webkit-overflow-scrolling: touch;
    padding: 26px clamp(22px, 4vw, 46px) 44px; }
  .documento .testo h3 { font-size: 19px; margin-top: 32px; }
  .documento .testo > h3:first-child { margin-top: 0; }
  .documento .testo p, .documento .testo li { font-size: 15px; line-height: 1.72; color: var(--bruno-2); }
  .documento .testo p + p { margin-top: 12px; }
  .documento .testo h3 + p { margin-top: 10px; }
  .documento .testo ul { margin: 12px 0 0; padding-left: 20px; display: flex; flex-direction: column; gap: 9px; }
  .documento .testo strong { color: var(--bruno); font-weight: 700; }
  .documento .agg { font-size: 11.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase;
    color: var(--oro-ink); }
  .documento .avvolgi { overflow-x: auto; margin-top: 14px; border: 1px solid var(--linea); }
  .documento .tab { width: 100%; border-collapse: collapse; font-size: 14px; min-width: 520px; background: var(--panna); }
  .documento .tab th { text-align: left; font-size: 10.5px; font-weight: 800; letter-spacing: .12em;
    text-transform: uppercase; color: var(--oro-ink); padding: 11px 14px; border-bottom: 1px solid var(--linea-forte); }
  .documento .tab td { padding: 12px 14px; border-bottom: 1px solid var(--linea); color: var(--bruno-2);
    vertical-align: top; line-height: 1.5; }
  .documento .tab tr:last-child td { border-bottom: none; }
  .documento .nota { margin-top: 16px; border-left: 2px solid var(--oro); background: var(--sabbia);
    padding: 15px 18px; font-size: 14px; }
  .documento .nota p { font-size: 14px; }
  body.bloccato { overflow: hidden; }


  /* ═══ la testata deve stare in 360px ═══
     Un elemento flessibile non scende sotto il proprio contenuto minimo
     finche' non gli si dice min-width:0. Senza, la striscia dell'annuncio
     e il marchio tenevano larga la pagina e il telefono la rimpiccioliva
     tutta per farcela stare. */
  .striscia .dentro > *, .testata .bar > * { min-width: 0; }
  .striscia .segna { flex-wrap: wrap; justify-content: center; row-gap: 2px; }
  .testata .marchio { min-width: 0; }
  .testata .marchio span { min-width: 0; }
  .testata .marchio b { overflow-wrap: anywhere; }
  @media (max-width: 420px) {
    .testata .marchio b { font-size: 16.5px; }
    .testata .marchio img, .testata .marchio > svg { width: 44px; height: 44px; }
    .testata.giu .marchio img, .testata.giu .marchio > svg { width: 40px; height: 40px; }
    .striscia p, .striscia span { font-size: 13px; letter-spacing: .03em; }
  }


  /* Un figlio di griglia o di flex non si stringe sotto il proprio contenuto
     minimo finche' non glielo si concede. E' la causa piu' comune di pagine
     che sul telefono non stanno nello schermo. */
  .due > *, .g2 > *, .g3 > *, .g4 > *, .prima-dopo > *, .tappe > *,
  .numeri > *, footer .alto > * { min-width: 0; }

  @media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }