/* =====================================================================
   Studio Lawcompliance — foglio di stile
   Bodoni Moda (titoli) + EB Garamond (testo e interfaccia): coppia classica
   da studio legale, in luogo della precedente Fraunces/Inter più moderna.
   Nessuno stile inline: la CSP del sito dichiara style-src 'self'.
   ===================================================================== */

/* ---------- Caratteri (serviti in locale, nessuna chiamata a terzi) ---------- */
@font-face{
  font-family:"Bodoni Moda";
  font-style:normal; font-weight:400 900; font-display:swap;
  src:url("../fonts/bodoni-moda-latin-opsz-normal.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Bodoni Moda";
  font-style:normal; font-weight:400 900; font-display:swap;
  src:url("../fonts/bodoni-moda-latin-ext-opsz-normal.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"Bodoni Moda";
  font-style:italic; font-weight:400 900; font-display:swap;
  src:url("../fonts/bodoni-moda-latin-opsz-italic.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"EB Garamond";
  font-style:normal; font-weight:400 800; font-display:swap;
  src:url("../fonts/eb-garamond-latin-wght-normal.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"EB Garamond";
  font-style:normal; font-weight:400 800; font-display:swap;
  src:url("../fonts/eb-garamond-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"EB Garamond";
  font-style:italic; font-weight:400 800; font-display:swap;
  src:url("../fonts/eb-garamond-latin-wght-italic.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/* ---------- Gettoni ---------- */
:root{
  --grafite:#16181A;
  --rosa:#E6ACAD;
  --crema:#FEE3C2;
  --rosa-scuro:#A04E56;
  --carta:#FFFFFF;
  --carta-2:#FFF7EE;
  --linea:#EADFD6;
  --linea-ctl:#8A7F79;          /* bordi dei controlli: > 3:1 su carta (1.4.11) */
  --testo:#16181A;
  --testo-2:#4A4D52;
  --su-scuro:#E4E0DB;

  /* --serif: titoli, in Bodoni Moda. --sans: testo e interfaccia — il nome è
     storico (nella prima versione era un carattere bastone): oggi è un
     Garamond, ma i componenti continuano a chiamarlo così. */
  --serif:"Bodoni Moda", Didot, "Times New Roman", serif;
  --sans:"EB Garamond", Georgia, "Times New Roman", serif;

  --larghezza:1200px;
  --margine:clamp(20px, 5vw, 64px);
  --sezione:clamp(64px, 9vw, 128px);
  --testata:76px;

  /* alias usati dai componenti */
  --lc-grafite:var(--grafite); --lc-rosa:var(--rosa); --lc-crema:var(--crema);
  --lc-rosa-scuro:var(--rosa-scuro); --lc-carta:var(--carta); --lc-carta-2:var(--carta-2);
  --lc-testo:var(--testo); --lc-testo-2:var(--testo-2);
  --lc-serif:var(--serif); --lc-sans:var(--sans);
  --lc-margine:var(--margine); --lc-larghezza:var(--larghezza);
}

/* ---------- Base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{
  color-scheme:light; -webkit-text-size-adjust:100%; scroll-padding-top:calc(var(--testata) + 16px);
  font-size:106.25%; /* 17px: l'EB Garamond ha un occhio più piccolo di Inter, serve un filo di respiro in più */
}
@media (prefers-reduced-motion:no-preference){ html{ scroll-behavior:smooth; } }
body{
  margin:0;
  background:var(--carta);
  color:var(--testo);
  font-family:var(--sans);
  font-size:1.0625rem;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg{ max-width:100%; }
img{ height:auto; }
h1,h2,h3,h4{ margin:0; font-family:var(--serif); font-weight:400; text-wrap:balance; color:var(--testo);
  overflow-wrap:anywhere; } /* con testo al 200% su schermi stretti le parole lunghe vanno a capo (1.4.4, 1.4.10);
  'anywhere' e non 'break-word': così anche le colonne della griglia possono restringersi */
p,ul,ol,dl,figure,blockquote{ margin:0; }
a{ color:var(--rosa-scuro); text-underline-offset:.22em; text-decoration-thickness:1px; }
a:hover{ color:var(--grafite); }
/* indirizzi email e PEC sono parole lunghe senza spazi: vanno a capo se non entrano (1.4.4, 1.4.10) */
a[href^="mailto:"]{ overflow-wrap:anywhere; }
.griglia-2 > *, .piede__griglia > *{ min-width:0; }
:focus-visible{ outline:3px solid var(--rosa-scuro); outline-offset:3px; }
::selection{ background:var(--crema); color:var(--grafite); }

.solo-lettori{
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.salta{
  position:absolute; left:var(--margine); top:0; transform:translateY(-110%); z-index:100; /* nascosto a qualunque altezza, anche con testo ingrandito */
  background:var(--grafite); color:var(--carta); padding:.8rem 1.1rem; font-weight:600;
}
.salta:focus{ top:12px; transform:none; color:var(--carta); }

.contenitore{ max-width:var(--larghezza); margin-inline:auto; padding-inline:var(--margine); }
.sezione{ padding-block:var(--sezione); }
.sezione--tinta{ background:var(--carta-2); }
.sezione--scura{ background:var(--grafite); color:var(--su-scuro); }
.sezione--scura h2,.sezione--scura h3{ color:var(--carta); }
.sezione--scura a:not(.btn){ color:var(--rosa); }
.sezione--scura a:not(.btn):hover{ color:var(--crema); }
.sezione--scura :focus-visible{ outline-color:var(--rosa); }

/* ---------- Utility di spaziatura (al posto degli attributi style) ---------- */
.u-m0{ margin:0 !important; }
.u-mt-s{ margin-top:.75rem !important; }
.u-mt-m{ margin-top:1.5rem !important; }
.u-mt-l{ margin-top:2.5rem !important; }
.u-mt-xl{ margin-top:clamp(48px, 7vw, 96px) !important; }
.u-mb-l{ margin-bottom:2.5rem !important; }

/* ---------- Tipografia ---------- */
.titolo-pagina{
  font-size:clamp(2.4rem, 1.4rem + 4vw, 4.4rem);
  line-height:1.03; letter-spacing:-.028em;
  font-variation-settings:"opsz" 144;
}
.titolo-sezione{
  font-size:clamp(1.9rem, 1.3rem + 2.4vw, 3rem);
  line-height:1.08; letter-spacing:-.022em;
}
.titolo-blocco{
  font-size:clamp(1.4rem, 1.15rem + 1.1vw, 2rem);
  line-height:1.15; letter-spacing:-.016em;
}
.sommario{
  font-size:clamp(1.0625rem, 1rem + .35vw, 1.25rem);
  line-height:1.6; color:var(--testo-2); max-width:44rem;
}
.sezione--scura .sommario{ color:var(--su-scuro); }
.rif{ font-size:.9375rem; font-weight:500; color:var(--rosa-scuro); }

/* testo corrente giustificato con sillabazione italiana (vedi README) */
.prosa{ overflow-wrap:break-word; } /* parole lunghe (indirizzi web) a capo solo se non entrano */
.prosa p{ text-align:justify; hyphens:auto; -webkit-hyphens:auto; max-width:40rem; }
.prosa p + p{ margin-top:1.1em; }
.prosa h2{ font-size:clamp(1.5rem,1.2rem + 1.2vw,2.1rem); line-height:1.15; letter-spacing:-.016em; margin:2.4em 0 .7em; }
.prosa h3{ font-size:1.3rem; line-height:1.25; margin:2em 0 .5em; }
.prosa ul{ padding-left:1.2em; max-width:40rem; }
.prosa li + li{ margin-top:.45em; }
.prosa ul + p,.prosa p + ul{ margin-top:1em; }
@media (max-width:560px){
  .prosa p{ text-align:left; }
}

/* ---------- Pulsanti ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  min-height:48px; padding:.8rem 1.4rem;
  font-family:var(--sans); font-size:.9688rem; font-weight:600; line-height:1.2;
  text-decoration:none; border-radius:2px; border:1px solid transparent; cursor:pointer;
}
.btn--primario{ background:var(--grafite); color:var(--carta); }
.btn--primario:hover{ background:var(--rosa-scuro); color:var(--carta); }
.btn--rosa{ background:var(--rosa); color:var(--grafite); }
.btn--rosa:hover{ background:var(--crema); color:var(--grafite); }
.btn--ghost{ background:transparent; color:var(--grafite); border-color:var(--linea-ctl); }
.btn--ghost:hover{ border-color:var(--grafite); color:var(--grafite); }
.sezione--scura .btn--ghost{ color:var(--carta); border-color:rgba(254,227,194,.6); }
.sezione--scura .btn--ghost:hover{ border-color:var(--rosa); color:var(--carta); }

/* ---------- Testata ---------- */
.testata{
  position:sticky; top:0; z-index:50;
  background:var(--carta);           /* fondo pieno: niente backdrop-filter (vedi README) */
  border-bottom:1px solid var(--linea);
}
.testata__in{
  max-width:var(--larghezza); margin-inline:auto; padding-inline:var(--margine);
  min-height:var(--testata); display:flex; align-items:center; justify-content:space-between; gap:.25rem 1.5rem;
  flex-wrap:wrap; /* con testo molto ingrandito il pulsante Menu scende a capo invece di uscire dallo schermo */
}
.marchio{ display:inline-flex; align-items:center; gap:.8rem; text-decoration:none; color:var(--grafite); }
.marchio:hover{ color:var(--grafite); }
.marchio__segno{ width:42px; height:42px; flex:none; }
.marchio__nome{ display:flex; flex-direction:column; line-height:1; }
.marchio__nome b{ font-family:var(--serif); font-weight:500; font-size:1.375rem; letter-spacing:-.01em; }
.marchio__nome span{ font-size:.75rem; color:var(--testo-2); margin-top:.35rem; }

.nav__elenco{ display:flex; gap:.25rem 1.75rem; margin:0; padding:0; list-style:none; }
.nav a:not(.btn){
  display:inline-block; padding:.5rem 0; color:var(--grafite); text-decoration:none;
  font-size:.9688rem; font-weight:600; letter-spacing:.01em; border-bottom:2px solid transparent;
}
.nav a:not(.btn):hover{ border-bottom-color:var(--rosa); }
.nav a[aria-current="page"]:not(.btn){ border-bottom-color:var(--rosa-scuro); }
.nav__cta{ display:none; }

.menu-btn{
  display:none; align-items:center; gap:.6rem;
  min-height:48px; padding:.5rem .9rem; margin-right:-.9rem;
  background:none; border:0; color:var(--grafite); font:600 .9375rem var(--sans); letter-spacing:.01em; cursor:pointer;
}
.menu-btn__icona{ position:relative; width:22px; height:14px; }
.menu-btn__testo{ min-width:3.3em; text-align:left; } /* «Menu» e «Chiudi» occupano lo stesso spazio: la testata non cambia altezza */
.menu-btn__icona::before,.menu-btn__icona::after{
  content:""; position:absolute; left:0; right:0; height:2px; background:currentColor;
  transition:transform .2s ease, top .2s ease;
}
.menu-btn__icona::before{ top:2px; }
.menu-btn__icona::after{ top:10px; }
.menu-btn[aria-expanded="true"] .menu-btn__icona::before{ top:6px; transform:rotate(45deg); }
.menu-btn[aria-expanded="true"] .menu-btn__icona::after{ top:6px; transform:rotate(-45deg); }

@media (max-width:900px){
  .js .menu-btn{ display:inline-flex; }
  .js .nav{
    position:fixed; inset:var(--nav-top, var(--testata)) 0 0 0; z-index:49;
    background:var(--carta); padding:1.5rem var(--margine) 2rem; overflow-y:auto;
    visibility:hidden; opacity:0; transition:opacity .2s ease, visibility 0s linear .2s;
  }
  .js .nav.is-aperto{ visibility:visible; opacity:1; transition:opacity .2s ease; }
  .js .nav__elenco{ flex-direction:column; gap:0; }
  .js .nav a:not(.btn){
    display:flex; align-items:center; min-height:60px; font-family:var(--serif);
    font-size:1.625rem; border-bottom:1px solid var(--linea);
    hyphens:auto; overflow-wrap:anywhere; /* solo se una parola non entra (testo al 200% su schermi stretti);
    dove il browser non ha la sillabazione italiana, la parola va comunque a capo */
  }
  .js .nav a[aria-current="page"]:not(.btn){ color:var(--rosa-scuro); border-bottom-color:var(--linea); }
  .js .nav__cta{ display:flex; margin-top:1.75rem; width:100%; }
  html:not(.js) .nav__elenco{ flex-wrap:wrap; gap:.25rem 1.25rem; }
  html:not(.js) .testata__in{ flex-wrap:wrap; padding-block:.75rem; }
}
.js body.menu-aperto{ overflow:hidden; }

/* ---------- Intestazione delle pagine interne ---------- */
.intestazione{ padding-block:clamp(56px, 8vw, 112px) clamp(40px, 6vw, 80px); border-bottom:1px solid var(--linea); }
.intestazione .sommario{ margin-top:1.4rem; }
.briciole{ margin-bottom:1.75rem; font-size:.875rem; color:var(--testo-2); }
.briciole ol{ display:flex; flex-wrap:wrap; gap:.4rem; margin:0; padding:0; list-style:none; }
.briciole li + li::before{ content:"/"; margin-right:.4rem; color:var(--linea-ctl); }
.briciole a{ color:var(--testo-2); }

/* ---------- Griglie ---------- */
.griglia-2{ display:grid; gap:clamp(32px, 5vw, 72px); }
@media (min-width:900px){ .griglia-2{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
.testa-sezione{ display:grid; gap:1rem; margin-bottom:clamp(40px, 6vw, 72px); }
@media (min-width:900px){
  .testa-sezione--affiancata{ grid-template-columns:minmax(0,5fr) minmax(0,6fr); align-items:end; gap:4rem; }
}

/* ---------- Home: i due ingressi ---------- */
.ingressi{ margin:0; padding:0; list-style:none; display:grid; gap:1px; background:var(--linea); border:1px solid var(--linea); }
@media (min-width:760px){ .ingressi{ grid-template-columns:repeat(3, minmax(0,1fr)); } }
.ingresso{ background:var(--carta); padding:clamp(24px, 3vw, 36px); display:flex; flex-direction:column; gap:.75rem; position:relative; }
.ingresso h3{ font-size:1.4rem; line-height:1.15; }
.ingresso p{ color:var(--testo-2); font-size:.9688rem; line-height:1.6; }
.ingresso a{ color:var(--grafite); text-decoration:none; }
.ingresso a::after{ content:""; position:absolute; inset:0; }
.ingresso:hover{ background:var(--carta-2); }
.ingresso:hover h3{ color:var(--rosa-scuro); }
.ingresso:focus-within{ outline:3px solid var(--rosa-scuro); outline-offset:-3px; }
.ingresso a:focus-visible{ outline:none; }
.ingresso__segno{ width:28px; height:2px; background:var(--rosa); margin-top:auto; }

/* ---------- Home: aree in griglia con immagine ---------- */
.aree{ display:grid; gap:clamp(28px, 4vw, 48px) clamp(20px, 3vw, 36px); margin:0; padding:0; list-style:none; }
@media (min-width:640px){ .aree{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (min-width:1024px){ .aree{ grid-template-columns:repeat(3, minmax(0,1fr)); } }
.area{ position:relative; display:flex; flex-direction:column; }
.area__img{ display:block; width:100%; aspect-ratio:3 / 2; object-fit:cover; background:var(--carta-2); }
.area__tavola{
  aspect-ratio:3 / 2; display:grid; align-content:center; padding:1.5rem 2rem;
  background:var(--crema); color:var(--grafite); font:italic 400 clamp(1.3rem,1rem + 1.2vw,1.9rem)/1.15 var(--serif);
}
.area__tavola span:nth-child(even){ padding-left:1.4em; color:var(--rosa-scuro); }
.area__corpo{ padding-top:1.25rem; border-top:2px solid var(--rosa); margin-top:1.25rem; }
.area h3{ font-size:1.375rem; line-height:1.2; }
.area h3 a{ color:var(--grafite); text-decoration:none; }
.area h3 a::after{ content:""; position:absolute; inset:0; }
.area:hover h3 a{ color:var(--rosa-scuro); }
.area h3 a:focus-visible{ outline:none; }
.area:focus-within{ outline:3px solid var(--rosa-scuro); outline-offset:6px; }
.area .rif{ margin-top:.35rem; font-size:.875rem; }
.area p:last-child{ margin-top:.6rem; color:var(--testo-2); font-size:.9688rem; line-height:1.6; }

/* ---------- Ritratto / segnaposto fotografico ---------- */
.foto-segnaposto{
  position:relative; aspect-ratio:4 / 5; background:var(--carta-2);
  display:grid; place-items:center; border:1px solid var(--linea);
}
.foto-segnaposto svg{ width:38%; height:auto; opacity:.35; }
.foto-segnaposto figcaption{
  position:absolute; left:0; right:0; bottom:1rem; text-align:center; font-size:.8125rem; color:var(--testo-2);
}
.foto-segnaposto--largo{ aspect-ratio:16 / 10; }
.foto-segnaposto img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:top center;
}
.foto-contatti img{ object-position:70% center; } /* se il riquadro taglia, resta in quadro la dott.ssa Persi */

.persona{ display:grid; gap:clamp(28px, 5vw, 72px); align-items:start; }
@media (min-width:860px){ .persona{ grid-template-columns:minmax(0,4fr) minmax(0,7fr); } }
.persona__ruolo{ margin-top:.5rem; color:var(--rosa-scuro); font-weight:500; }
.cita{
  margin-top:2rem; padding-left:1.25rem; border-left:2px solid var(--rosa);
  font:italic 400 1.25rem/1.45 var(--serif); color:var(--grafite); max-width:36rem;
}
.cita footer{ margin-top:.4rem; font:500 .875rem var(--sans); font-style:normal; color:var(--testo-2); }

/* ---------- Elenco con segni (checklist) ---------- */
.spunte{ margin:0; padding:0; list-style:none; display:grid; gap:.1rem; }
.spunte li{
  position:relative; padding:.7rem 0 .7rem 1.9rem; border-bottom:1px solid var(--linea);
  font-size:.9688rem; line-height:1.55;
}
.spunte li::before{
  content:""; position:absolute; left:.1rem; top:1.2rem; width:.85rem; height:.45rem;
  border-left:2px solid var(--rosa-scuro); border-bottom:2px solid var(--rosa-scuro); transform:rotate(-45deg);
}
.spunte--colonne{ column-gap:3rem; }
@media (min-width:760px){ .spunte--colonne{ display:block; columns:2; } .spunte--colonne li{ break-inside:avoid; } }
.spunte__titolo{ font:600 .9375rem var(--sans); color:var(--grafite); margin:2rem 0 .5rem; }

/* ---------- Metodo (sequenza reale: numeri) ---------- */
.metodo{ counter-reset:passo; display:grid; gap:0; margin:0; padding:0; list-style:none; border-top:1px solid var(--linea); }
@media (min-width:900px){ .metodo{ grid-template-columns:repeat(4, minmax(0,1fr)); border-top:0; } }
.metodo li{ counter-increment:passo; padding:1.5rem 0; border-bottom:1px solid var(--linea); }
@media (min-width:900px){
  .metodo li{ padding:0 1.75rem 0 0; border-bottom:0; border-top:2px solid var(--grafite); padding-top:1.5rem; }
  .metodo li + li{ padding-left:0; }
}
.metodo li::before{
  content:counter(passo); display:block; font:400 2.4rem/1 var(--serif); color:var(--rosa-scuro); margin-bottom:.9rem;
}
.metodo h3{ font-size:1.3rem; line-height:1.2; }
.metodo p{ margin-top:.5rem; color:var(--testo-2); font-size:.9688rem; line-height:1.6; }

/* ---------- Rete di professionisti ---------- */
.rete{ display:grid; gap:clamp(24px, 4vw, 40px); margin:0; padding:0; list-style:none; }
@media (min-width:900px){ .rete{ grid-template-columns:repeat(3, minmax(0,1fr)); } }
.rete li{ padding-top:1.4rem; border-top:1px solid var(--linea); }
.rete h3{ font-size:1.375rem; line-height:1.2; }
.rete .rif{ margin-top:.3rem; }
.rete p{ margin-top:.8rem; font-size:.9688rem; line-height:1.6; color:var(--testo-2); }

/* ---------- Competenze e settori: blocchi di dettaglio ---------- */
.indice{ display:flex; flex-wrap:wrap; gap:.6rem; margin:2rem 0 0; padding:0; list-style:none; }
.indice a{
  display:inline-flex; align-items:center; min-height:44px; padding:.5rem 1rem;
  border:1px solid var(--linea-ctl); border-radius:100px; color:var(--grafite); text-decoration:none; font-size:.9375rem; font-weight:500;
}
.indice a:hover{ border-color:var(--grafite); background:var(--carta-2); }

.dettaglio{ display:grid; gap:clamp(28px, 5vw, 72px); padding-block:clamp(56px, 8vw, 104px); border-bottom:1px solid var(--linea); }
.dettaglio:last-child{ border-bottom:0; }
@media (min-width:900px){ .dettaglio{ grid-template-columns:minmax(0,5fr) minmax(0,6fr); align-items:start; } }
.dettaglio__testa .rif{ margin-top:.6rem; }
.dettaglio__testa .prosa{ margin-top:1.25rem; }
.dettaglio__figura{ margin-top:2rem; }
.settore__destinatari{ margin-top:1.5rem; font-size:.9375rem; color:var(--testo-2); }

/* ---------- Dichiarazione di accessibilità ---------- */
.esito-conformita{ max-width:40rem; box-sizing:border-box; margin-bottom:2.5rem; padding:1.25rem 1.5rem; background:var(--carta-2); border-left:4px solid var(--rosa-scuro); }
.esito-conformita p{ margin:0; text-align:left; }
.esito-conformita__titolo{ font-family:var(--serif); font-size:1.5rem; line-height:1.2; color:var(--grafite); margin-bottom:.5rem !important; }

/* ---------- Contatti ---------- */
.recapiti{ display:grid; grid-template-columns:auto 1fr; gap:.9rem 1.5rem; margin:0; }
.recapiti dt{ font-size:.875rem; color:var(--testo-2); padding-top:.15rem; }
.recapiti dd{ margin:0; font-size:1.0625rem; }
.recapiti a{ color:var(--grafite); }
.recapiti a:hover{ color:var(--rosa-scuro); }
@media (max-width:420px){ .recapiti{ grid-template-columns:1fr; gap:.15rem; } .recapiti dd{ margin-bottom:.9rem; } }

/* ---------- Invito finale ---------- */
.invito{ display:grid; gap:2rem; align-items:end; }
@media (min-width:900px){ .invito{ grid-template-columns:minmax(0,7fr) auto; } }
.invito__azioni{ display:flex; flex-wrap:wrap; gap:.75rem; }

/* ---------- Piede ---------- */
.piede{ border-top:1px solid rgba(233,229,224,.16); background:var(--grafite); color:var(--su-scuro); padding-block:clamp(56px, 7vw, 88px) 2rem; font-size:.9375rem; }
.piede a{ color:var(--carta); text-decoration-color:rgba(230,172,173,.6); }
.piede a:hover{ color:var(--rosa); }
.piede :focus-visible{ outline-color:var(--rosa); }
.piede__griglia{ display:grid; gap:2.5rem; }
@media (min-width:860px){ .piede__griglia{ grid-template-columns:minmax(0,4fr) minmax(0,3fr) minmax(0,3fr); } }
.piede .marchio{ color:var(--carta); }
/* conformità WCAG 2.1 AA in evidenza nel piede */
.piede__a11y{
  display:inline-flex; flex-direction:column; gap:.2rem; margin-top:1.5rem; padding:.85rem 1.1rem;
  border:1px solid var(--rosa); border-left-width:4px; border-radius:2px;
  color:var(--carta); text-decoration:none; line-height:1.35;
}
.piede__a11y:hover{ background:rgba(254,227,194,.08); color:var(--carta); }
.piede__a11y-titolo{ font-family:var(--serif); font-size:1.125rem; color:var(--rosa); }
.piede__a11y span:last-child{ text-decoration:underline; text-decoration-color:rgba(230,172,173,.6); text-underline-offset:.22em; }
/* con testo molto ingrandito su schermi stretti il nome scende sotto il sigillo invece di uscire */
.piede .marchio{ flex-wrap:wrap; row-gap:.75rem; }
.piede .marchio__nome span{ color:#BDB7B0; }
.piede h2{ font:600 .9375rem var(--sans); color:var(--carta); margin-bottom:.9rem; }
.piede ul{ margin:0; padding:0; list-style:none; display:grid; gap:.45rem; }
.piede address{ font-style:normal; line-height:1.7; }
.piede__nota{ margin-top:1.25rem; max-width:26rem; color:#BDB7B0; font-size:.875rem; }
.piede__fondo{
  margin-top:3rem; padding-top:1.5rem; border-top:1px solid rgba(233,229,224,.16);
  display:flex; flex-wrap:wrap; gap:.5rem 2rem; justify-content:space-between; font-size:.8438rem; color:#BDB7B0;
}

/* ---------- Movimento ridotto ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ transition-duration:.01ms !important; animation-duration:.01ms !important; }
}


/* =====================================================================
   Lawcompliance — carosello di apertura + immagini delle aree di competenza
   File autonomo: va caricato dopo style.css. Nessuno stile inline,
   compatibile con la CSP del sito (style-src 'self').
   ===================================================================== */



/* ---------------------------------------------------------------------
   Carosello
   Senza JavaScript è una striscia scorrevole con aggancio (swipe / frecce
   della tastiera sulla traccia): tutto il contenuto resta raggiungibile.
   Con JavaScript si aggiungono comandi, avanzamento automatico e pausa.
   --------------------------------------------------------------------- */
.carosello{
  position:relative;
  background:var(--lc-grafite);
  color:var(--lc-carta);
}

.carosello__traccia{
  display:flex;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  overscroll-behavior-x:contain;
  margin:0;
  padding:0;
  list-style:none;
}
.carosello__traccia::-webkit-scrollbar{ display:none; }
.carosello__traccia:focus-visible{ outline:3px solid var(--lc-rosa); outline-offset:-3px; }

.carosello__slide{
  position:relative;
  flex:0 0 100%;
  scroll-snap-align:start;
  scroll-snap-stop:always;
  min-height:clamp(520px, 80vh, 760px);
  display:flex;
  align-items:flex-end;
  overflow:hidden;
}

.carosello__immagine{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
.carosello__immagine--destra{ object-position:78% 50%; }

/* Velatura: garantisce il contrasto del testo su qualsiasi fotografia */
.carosello__slide::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(0deg, rgba(22,24,26,.95) 0%, rgba(22,24,26,.84) 55%, rgba(22,24,26,.3) 100%);
}
@media (min-width:860px){
  .carosello__slide{ align-items:center; }
  /* la parte scura (almeno 86%) arriva fino al bordo reale della colonna di testo,
     calcolato come la colonna stessa: contrasto ≥ 4,5:1 anche su un pixel bianco */
  .carosello__slide::after{
    --fine-testo:calc((100% - min(100%, var(--lc-larghezza))) / 2 + var(--lc-margine) + 36rem);
    background:
      linear-gradient(90deg, rgba(22,24,26,.95) 0%, rgba(22,24,26,.86) var(--fine-testo),
        rgba(22,24,26,.35) calc(var(--fine-testo) + 14%), rgba(22,24,26,.12) 100%);
  }
}
/* su schermi stretti il testo sta in basso, di altezza variabile: un fondo sfumato
   agganciato al blocco di testo garantisce il contrasto qualunque sia la sua altezza */
@media (max-width:859.98px){
  .carosello__testo::before{
    content:""; position:absolute; z-index:-1; left:0; right:0; bottom:0; top:-3rem;
    background:linear-gradient(0deg, rgba(22,24,26,.88) calc(100% - 3rem), rgba(22,24,26,0) 100%);
  }
}

.carosello__testo{
  position:relative;
  z-index:1;
  width:100%;
  max-width:var(--lc-larghezza);
  margin-inline:auto;
  padding:0 var(--lc-margine) 7.5rem;
}
@media (min-width:860px){
  .carosello__testo{ padding-bottom:4.5rem; }
}
.carosello__testo > *{ max-width:34rem; }

.carosello__rif{
  margin:0 0 1rem;
  font-family:var(--lc-sans);
  font-size:.9375rem;
  font-weight:500;
  color:var(--lc-rosa);
}
.carosello__rif::before{
  content:"";
  display:inline-block;
  width:2rem;
  height:1px;
  margin-right:.75rem;
  vertical-align:middle;
  background:currentColor;
}

.carosello__titolo{
  margin:0;
  font-family:var(--lc-serif);
  font-weight:400;
  font-size:clamp(2rem, 1.2rem + 3.4vw, 3.6rem);
  line-height:1.06;
  letter-spacing:-.022em;
  color:var(--lc-carta);
  text-wrap:balance;
}

.carosello__desc{
  margin:1.25rem 0 0;
  font-family:var(--lc-sans);
  font-size:clamp(1rem, .95rem + .25vw, 1.125rem);
  line-height:1.6;
  color:#E4E0DB;
}

.carosello__cita{
  margin:1.25rem 0 0;
  font-family:var(--lc-serif);
  font-style:italic;
  font-size:1.125rem;
  color:var(--lc-crema);
}

.carosello__azioni{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem 1.5rem;
  align-items:center;
  margin-top:2rem;
}
.carosello__cta{
  display:inline-block;
  padding:.85rem 1.4rem;
  font-family:var(--lc-sans);
  font-size:.9375rem;
  font-weight:600;
  color:var(--lc-grafite);
  background:var(--lc-rosa);
  border:0;
  border-radius:2px;
  text-decoration:none;
}
.carosello__cta:hover{ background:var(--lc-crema); }
.carosello__link{
  font-family:var(--lc-sans);
  font-size:.9375rem;
  font-weight:500;
  color:var(--lc-carta);
  text-decoration:underline;
  text-decoration-color:rgba(230,172,173,.7);
  text-underline-offset:.3em;
}
.carosello__link:hover{ text-decoration-color:var(--lc-rosa); }
.carosello a:focus-visible,
.carosello button:focus-visible{
  outline:3px solid var(--lc-rosa);
  outline-offset:3px;
}

/* --- comandi (compaiono solo con JavaScript: attributo hidden rimosso da slider.js) --- */
.carosello__comandi{
  position:absolute;
  z-index:2;
  left:0;
  right:0;
  bottom:0;
  max-width:var(--lc-larghezza);
  margin-inline:auto;
  padding:0 var(--lc-margine) 1.75rem;
  display:flex;
  align-items:center;
  gap:1rem;
}
.carosello__comandi[hidden]{ display:none; }

.carosello__punti{
  display:flex;
  gap:.5rem;
  margin:0;
  padding:0;
  list-style:none;
  flex:1 1 auto;
  max-width:22rem;
}
.carosello__punti li{ flex:1 1 0; }

.carosello__punto{
  display:block;
  width:100%;
  padding:1rem 0;          /* area di tocco alta 34px, linea visibile 2px */
  background:none;
  border:0;
  cursor:pointer;
}
.carosello__barra{
  display:block;
  position:relative;
  height:2px;
  background:rgba(254,227,194,.5);   /* ≥ 3:1 sul fondo scuro (1.4.11) */
  overflow:hidden;
}
.carosello__barra::after{
  content:"";
  position:absolute;
  inset:0;
  background:var(--lc-rosa);
  transform:scaleX(0);
  transform-origin:left center;
}
.carosello__punto[aria-current="true"] .carosello__barra{ height:3px; background:rgba(254,227,194,.8); }
.carosello__punto[aria-current="true"] .carosello__barra::after{ transform:scaleX(1); }

/* l'avanzamento automatico È l'animazione: a fine corsa si passa alla diapositiva successiva */
.carosello.is-in-corso .carosello__punto[aria-current="true"] .carosello__barra::after{
  animation:carosello-avanza var(--lc-durata, 7s) linear forwards;
}
.carosello.is-in-corso.is-trattenuto .carosello__punto[aria-current="true"] .carosello__barra::after{
  animation-play-state:paused;
}
@keyframes carosello-avanza{
  from{ transform:scaleX(0); }
  to{ transform:scaleX(1); }
}

.carosello__btn{
  display:inline-grid;
  place-items:center;
  width:44px;
  height:44px;
  padding:0;
  color:var(--lc-carta);
  background:rgba(22,24,26,.55);
  border:1px solid rgba(254,227,194,.55);
  border-radius:50%;
  cursor:pointer;
}
.carosello__btn:hover{ background:var(--lc-grafite); border-color:var(--lc-rosa); }
.carosello__btn svg{ width:18px; height:18px; display:block; }
.carosello__btn .icona-avvia{ display:none; }
.carosello:not(.is-in-corso) .carosello__btn--pausa .icona-pausa{ display:none; }
.carosello:not(.is-in-corso) .carosello__btn--pausa .icona-avvia{ display:block; }

.carosello__contatore{
  font-family:var(--lc-sans);
  font-size:.875rem;
  font-variant-numeric:tabular-nums;
  color:#E4E0DB;
  min-width:3.5em;
}
@media (max-width:520px){
  .carosello__contatore{ display:none; }
}

/* ---------------------------------------------------------------------
   Aree di competenza con immagine dedicata
   --------------------------------------------------------------------- */
.servizi{
  background:var(--lc-carta);
  color:var(--lc-testo);
  padding-block:clamp(56px, 8vw, 112px);
}
.servizi__intro,
.servizi__elenco{
  max-width:var(--lc-larghezza);
  margin-inline:auto;
  padding-inline:var(--lc-margine);
}
.servizi__intro{ margin-bottom:clamp(40px, 6vw, 80px); }
.servizi__titolo{
  margin:0;
  font-family:var(--lc-serif);
  font-weight:400;
  font-size:clamp(1.9rem, 1.3rem + 2.4vw, 3rem);
  line-height:1.1;
  letter-spacing:-.02em;
}
.servizi__sommario{
  margin:1rem 0 0;
  max-width:40rem;
  font-family:var(--lc-sans);
  font-size:1.0625rem;
  line-height:1.65;
  color:var(--lc-testo-2);
}

.servizi__elenco{
  display:grid;
  gap:clamp(56px, 8vw, 120px);
}

.servizio{
  display:grid;
  gap:clamp(24px, 4vw, 64px);
  align-items:center;
  scroll-margin-top:96px;
}
@media (min-width:860px){
  .servizio{ grid-template-columns:minmax(0, 7fr) minmax(0, 5fr); }
  .servizio:nth-child(even){ grid-template-columns:minmax(0, 5fr) minmax(0, 7fr); }
  .servizio:nth-child(even) .servizio__figura{ order:2; }
}

.servizio__figura{
  position:relative;
  margin:0;
}
/* filetto rosa sfalsato: lega immagini di provenienza diversa allo stesso marchio */
.servizio__figura::before{
  content:"";
  position:absolute;
  inset:14px -14px -14px 14px;
  border:1px solid var(--lc-rosa);
  pointer-events:none;
}
.servizio:nth-child(even) .servizio__figura::before{ inset:14px 14px -14px -14px; }
@media (max-width:520px){
  .servizio__figura::before,
  .servizio:nth-child(even) .servizio__figura::before{ inset:10px -8px -10px 8px; }
}
.servizio__immagine{
  position:relative;
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3 / 2;
  object-fit:cover;
  background:var(--lc-carta-2);
}

/* tavola tipografica per le aree ancora senza fotografia */
.servizio__tavola{
  position:relative;
  aspect-ratio:3 / 2;
  display:grid;
  align-content:center;
  gap:.1em;
  padding:clamp(24px, 5vw, 56px);
  background:var(--lc-crema);
  color:var(--lc-grafite);
  font-family:var(--lc-serif);
  font-style:italic;
  font-size:clamp(1.6rem, 1rem + 2.6vw, 3rem);
  line-height:1.15;
}
.servizio__tavola span:nth-child(even){ padding-left:1.4em; color:var(--lc-rosa-scuro); }

.servizio__corpo{ max-width:34rem; }
.servizio__titolo{
  margin:0;
  font-family:var(--lc-serif);
  font-weight:400;
  font-size:clamp(1.5rem, 1.15rem + 1.4vw, 2.25rem);
  line-height:1.12;
  letter-spacing:-.018em;
}
.servizio__rif{
  margin:.6rem 0 0;
  font-family:var(--lc-sans);
  font-size:.9375rem;
  font-weight:500;
  color:var(--lc-rosa-scuro);
}
.servizio__desc{
  margin:1.1rem 0 0;
  font-family:var(--lc-sans);
  font-size:1.0625rem;
  line-height:1.7;
  color:var(--lc-testo-2);
  text-align:justify;
  hyphens:auto;
  -webkit-hyphens:auto;
}
@media (max-width:560px){
  .servizio__desc{ text-align:left; }
}
.servizio__link{
  display:inline-block;
  margin-top:1.4rem;
  font-family:var(--lc-sans);
  font-size:.9375rem;
  font-weight:600;
  color:var(--lc-rosa-scuro);
  text-decoration:underline;
  text-underline-offset:.3em;
}
.servizio__link:hover{ color:var(--lc-grafite); }
.servizio__link:focus-visible{ outline:3px solid var(--lc-rosa-scuro); outline-offset:3px; }

/* ---------------------------------------------------------------------
   Movimento ridotto: niente scorrimento morbido né avanzamento automatico
   --------------------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  .carosello__traccia{ scroll-behavior:auto; }
  .carosello .carosello__barra::after{ animation:none !important; }
}
main:focus{ outline:none; }

/* testata su schermi molto stretti */
@media (max-width:440px){
  .testata .marchio__nome span{ display:none; }
  .testata .marchio__segno{ width:36px; height:36px; }
  .menu-btn{ margin-right:-.5rem; padding-inline:.5rem; }
  .testata__in{ column-gap:.5rem; }
  .testata .marchio{ gap:.6rem; }
  .testata .marchio__nome b{ font-size:1.125rem; }
}
@media (max-width:360px){
  .testata .marchio__nome b{ font-size:1.0625rem; }
  .testata .marchio{ gap:.45rem; }
  .menu-btn{ gap:.4rem; }
  .menu-btn__testo{ min-width:3.05em; }
}