/* Centro DEA — foglio di stile comune
   Valori misurati sulla bozza sitocentrodea.consenso.it (tema Hospa) a 1440 px di larghezza. */

:root {
  --blu: #0073C2;          /* colore principale (link, pulsanti, voce di menu attiva) */
  --viola: #9588E8;        /* link secondari, torna su */
  --nero: #020D2B;         /* titoli, footer */
  --testo: #444F6F;        /* paragrafi */
  --grigio-footer: #ADB1BC;
  --azzurro: #C4DCF3;
  --verde: #D7ECE4;
  --lilla: #D6D2F1;
  --rosa: #F2DDD9;
  --corallo: #E67A66;
  --grigio: #E1E6EB;       /* fondi dei riquadri grandi */
  --bordo: #E9E8F2;
  --bianco: #fff;
  --font: "Libre Franklin", Arial, sans-serif;
  --contenitore: 1296px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.5;
  color: var(--testo);
  background: var(--bianco);
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: var(--blu); text-decoration: none; transition: color .3s; }
h1, h2, h3, h4, h5 { color: var(--nero); margin: 0; font-weight: 500; }
p { margin: 0 0 15px; line-height: 1.8; }
ul { margin: 0; padding: 0; list-style: none; }
b, strong { font-weight: 800; }

.contenitore { width: 100%; max-width: calc(var(--contenitore) + 24px); margin: 0 auto; padding: 0 12px; }
.salta { position: absolute; left: -9999px; }
.salta:focus { left: 10px; top: 10px; z-index: 1000; background: var(--bianco); padding: 10px 15px; }

/* Titoli di sezione */
.titolo-sezione { font-size: 42px; line-height: 1.3; text-align: center; max-width: 635px; margin: 0 auto 40px; }

/* Pulsante pieno con freccia nel cerchio */
.btn {
  position: relative; display: inline-block;
  background: var(--blu); color: var(--bianco);
  font-size: 15px; font-weight: 500; line-height: 1.5;
  padding: 10px 20px 10px 55px; border-radius: 50px;
  transition: background .3s;
}
.btn i { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); font-size: 25px; }
.btn:hover { background: var(--nero); color: var(--bianco); }

/* Link con freccia */
.link-freccia { position: relative; display: inline-block; padding-left: 22px; font-size: 14.5px; font-weight: 500; color: var(--nero); transition: all .6s; }
.link-freccia i { position: absolute; left: 0; top: 50%; transform: translateY(-50%); font-size: 16px; transition: all .6s; }
/* al passaggio del mouse la freccia passa da sinistra a destra, come nel tema */
.link-freccia:hover { color: var(--viola); padding-left: 0; padding-right: 22px; }
.link-freccia:hover i { left: calc(100% - 16px); }

/* ===== SEGNAPOSTO IMMAGINI ===== */
.ph {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 4px; text-align: center; overflow: hidden;
  background:
    repeating-linear-gradient(45deg, rgba(2,13,43,.035) 0 12px, transparent 12px 24px),
    #DCE3EC;
  color: #5B6787; font-size: 13px; line-height: 1.35; padding: 10px;
  border: 1px dashed #9AA6BE;
}
.ph > i { font-size: 30px; opacity: .55; }
.ph strong { font-size: 15px; font-weight: 700; color: var(--nero); }
.ph em { font-style: normal; font-size: 12px; max-width: 90%; }
.ph.ph-icona { padding: 2px; gap: 0; font-size: 9px; line-height: 1.1; border-radius: 12px; }
.ph.ph-icona > i { font-size: 16px; }
.ph.ph-icona strong { font-size: 10px; }
.ph.ph-tondo { border-radius: 50%; padding: 0; font-size: 8px; }
.ph.ph-tondo > i { font-size: 14px; }
.ph.ph-tondo strong { font-size: 8px; }

/* ===== INTESTAZIONE ===== */
.intestazione {
  position: sticky; top: 0; z-index: 100;
  background: var(--bianco); box-shadow: 0 4px 30px rgba(146,139,221,.1);
}
.intestazione .barra { display: flex; align-items: center; justify-content: space-between; height: 120px; padding: 0 30px; }
.logo img { width: 300px; height: 120px; }
.menu { display: flex; gap: 20px; margin-right: 151px; }
.menu > li { position: relative; }
.menu > li > a, .menu > li > button {
  display: block; padding: 27.5px 0; font: 500 14.5px/1.5 var(--font); color: var(--nero);
  background: none; border: 0; cursor: pointer;
}
.menu > li.sottomenu > a, .menu > li.sottomenu > button { padding-right: 18px; }
.menu > li.sottomenu > button > i { position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-size: 13px; }
.menu > li > a:hover, .menu > li > button:hover, .menu > li > a.attivo, .menu > li > button.attivo, .menu ul a.attivo { color: var(--blu); }
.menu ul {
  position: absolute; top: 70px; left: 0; width: 265px; padding: 15px 0;
  background: var(--bianco); border-radius: 20px; box-shadow: 0 4px 70px rgba(0,0,0,.1);
  opacity: 0; visibility: hidden; transform: translateY(10px); transition: all .3s;
}
.menu li:hover > ul, .menu li:focus-within > ul, .menu li.aperto > ul { opacity: 1; visibility: visible; transform: none; }
.menu ul a { display: block; padding: 10px 30px; font-size: 14px; font-weight: 500; line-height: 1.5; color: var(--testo); }
.menu ul a:hover { color: var(--blu); }
.hamburger { display: none; background: none; border: 0; font-size: 30px; color: var(--nero); cursor: pointer; }

/* ===== HERO ===== */
.hero {
  position: relative; padding: 150px 0 280px;
  background: url("../img/foto/hero-sfondo.jpg") center / cover no-repeat,
              linear-gradient(105deg, #F6F5FB 0%, #ECEAF8 45%, #E3EDF8 75%, #EEF2F7 100%);
}
.hero .ph-sfondo { position: absolute; right: 30px; top: 18px; padding: 6px 12px; font-size: 12px; flex-direction: row; gap: 6px; border-radius: 6px; }
.hero .ph-sfondo > i { font-size: 16px; }
.hero .ph-sfondo strong { font-size: 12px; }
.hero-interno { position: relative; padding: 0 30px; }
.hero-testo { position: relative; z-index: 2; max-width: 630px; }
.hero h1 { font-size: 60px; line-height: 72px; margin: 15px 0 15px; }
.hero p { max-width: 595px; margin-bottom: 25px; }
.hero-foto { position: absolute; z-index: 1; right: 30px; top: 40px; width: 600px; height: 424px; border-radius: 30px; }
.hero-foto img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 30px; box-shadow: 0 30px 60px -20px rgba(2,13,43,.35); }
/* silhouette in vetro in trasparenza sullo sfondo (immagine decorativa) */
.hero { overflow: hidden; }
.hero-visual { position: absolute; z-index: 1; right: 0; top: -120px; width: 760px; height: 734px; opacity: .9; pointer-events: none;
  -webkit-mask-image: radial-gradient(ellipse 50% 50% at 50% 45%, #000 45%, transparent 75%); mask-image: radial-gradient(ellipse 50% 50% at 50% 45%, #000 45%, transparent 75%); }
.hero-visual img { display: block; width: 100%; height: 100%; }

/* ===== QUATTRO RIQUADRI ===== */
.riquadri { position: relative; z-index: 3; margin-top: -120px; background: var(--bianco); border-radius: 100px 100px 0 0; padding: 50px 30px 0; }
.riquadri-bordo { border: 1px solid var(--bordo); border-radius: 100px; padding: 50px 50px 25px; }
.riquadri-griglia { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.riquadro { border-radius: 40px; padding: 35px; align-self: start; }
.riquadro.azzurro { background: var(--azzurro); }
.riquadro.verde { background: var(--verde); }
.riquadro.lilla { background: var(--lilla); }
.riquadro.rosa { background: var(--rosa); }
.riquadro-testa { display: flex; gap: 15px; align-items: flex-start; margin-bottom: 15px; }
.riquadro-testa i { font-size: 40px; color: var(--nero); line-height: 1; flex: none; }
.riquadro h3 { font-size: 14px; line-height: 1.2; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; }
.riquadro-testa i { margin-top: 5px; }
.riquadro p { margin-bottom: 22px; }
.riquadro .link-freccia { font-size: 14px; }

/* ===== ORARI ===== */
.orari { padding: 100px 0 100px; }
.due-colonne { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: center; }
.due-colonne > *, .carta-griglia > *, .prevenzione-griglia > * { min-width: 0; }
.orari h2 { font-size: 42px; line-height: 1.2; margin-bottom: 40px; }
.tabella-orari { display: grid; grid-template-columns: 306px 306px; column-gap: 24px; row-gap: 25px; margin-bottom: 25px; }
.tabella-orari span { font-weight: 500; color: var(--nero); line-height: 24px; }
.tabella-orari .giorno { position: relative; padding-left: 35px; }
.tabella-orari .giorno i { position: absolute; left: 0; top: 1px; font-size: 22px; color: var(--blu); }
.orari .ph { width: 586px; height: 541px; margin-left: 50px; border-radius: 30px; }

/* ===== CITAZIONI ===== */
.citazioni { padding: 20px 0 45px; text-align: center; }
.citazioni .scorrevole { overflow: hidden; }
.citazioni .binario { display: flex; transition: transform .6s ease; }
.citazioni .contenitore { max-width: 1440px; }
.citazione { flex: 0 0 100%; padding: 0 44px; }
.citazione blockquote { margin: 0 0 25px; font-size: 20.8px; line-height: 1.5; font-style: italic; color: var(--testo); }
.firma { display: inline-flex; align-items: center; gap: 20px; text-align: left; }
.firma .ph { width: 50px; height: 50px; }
.firma span { display: block; font-size: 14px; line-height: 21px; }
.firma b { font-weight: 700; }
.puntini { display: flex; justify-content: center; gap: 12px; margin-top: 40px; }
.puntini button { width: 6px; height: 6px; padding: 0; border: 0; border-radius: 50%; background: #000; opacity: .3; cursor: pointer; }
.puntini button.attivo { opacity: 1; }

/* ===== AREE SPECIALISTICHE ===== */
.aree { margin: 0 20px; background: var(--grigio); border-radius: 20px; padding: 100px 0; }
.aree .titolo-sezione { margin-bottom: 40px; }
.griglia-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; align-items: start; }
.scheda { background: var(--bianco); border-radius: 20px; padding: 40.7px 30px; }
.griglia-4 { position: relative; z-index: 0; } /* l'ombra lilla delle schede resta dietro la scheda */
.scheda { position: relative; transition: background .6s; }
.scheda .icona { margin-bottom: 30px; }
/* effetto al passaggio del mouse: ombra lilla sfalsata e silhouette DEA in alto a destra */
.scheda::before { content: ""; position: absolute; right: -10px; bottom: -10px; width: 100%; height: 100%; border-radius: 20px; background: var(--lilla); z-index: -1; opacity: 0; visibility: hidden; transition: .6s; }
.scheda::after { content: ""; position: absolute; top: 30px; right: 30px; width: 39px; height: 55px; background: #9FC3E8; -webkit-mask: url(../img/grafica/silhouette-dea.svg) center / contain no-repeat; mask: url(../img/grafica/silhouette-dea.svg) center / contain no-repeat; opacity: 0; visibility: hidden; transition: .6s; }
.scheda:hover::before, .scheda:hover::after { opacity: 1; visibility: visible; }
.scheda:hover h3 a { color: var(--viola); }
.scheda h3 { font-size: 18px; line-height: 1.2; font-weight: 700; margin-bottom: 15px; }
.scheda h3 a { color: var(--nero); }
.scheda h3 a:hover { color: var(--blu); }
.scheda p { margin-bottom: 20px; }

/* ===== SERVIZI SSN ===== */
.ssn { padding: 20px 0 100px; }
.ssn .titolo-sezione { margin-bottom: 40px; }
.ssn-griglia { display: grid; grid-template-columns: 380px 380px; gap: 60px; justify-content: center; }
.ssn-voce .illustrazione { height: 225px; width: auto; margin-bottom: 30px; }
.ssn-voce h3 { font-size: 25px; line-height: 1.4; margin-bottom: 15px; }
.ssn-voce p { max-width: 365px; margin-bottom: 20px; }
.da-definire { color: #B34E4E; font-style: italic; }

/* ===== CARTA DEI SERVIZI ===== */
.carta { padding: 50px 0 100px; }
.carta .titolo-sezione { margin-bottom: 40px; }
.carta-griglia { display: grid; grid-template-columns: 746px 1fr; gap: 24px; align-items: center; }
.carta-immagine img { width: 100%; height: auto; border-radius: 20px; }
.vademecum { background: var(--azzurro); border-radius: 20px; padding: 75px 60px; }
.vademecum h2 { font-size: 42px; line-height: 1.2; margin-bottom: 65px; }
.vademecum ul { display: flex; gap: 15px; flex-wrap: wrap; }
.vademecum li a { display: flex; align-items: center; gap: 10px; padding: 20px 30px; border-radius: 10px; color: var(--bianco); font-weight: 500; line-height: 1.2; transition: opacity .3s; }
.vademecum li a:hover { opacity: .85; }
.vademecum li i { font-size: 18px; }
.vademecum .corallo { background: var(--corallo); }
.vademecum .scuro { background: var(--testo); }

/* ===== FORMAZIONE ===== */
.formazione { padding: 100px 0; }
.formazione h2 { font-size: 52px; line-height: 1.8; text-align: center; font-weight: 400; margin-bottom: 100px; }
.formazione h2 strong { font-weight: 700; }
.formazione .due-colonne { align-items: center; }
.formazione .ph-foto { height: 382px; border-radius: 20px; }
.colonna-sx > .ph-foto { margin-bottom: 24px; }
.testimonianze { position: relative; background: var(--lilla); border-radius: 20px; overflow: hidden; }
.testimonianze .binario { display: flex; transition: transform .6s ease; }
.testimonianza { flex: 0 0 100%; padding: 40px; }
.testimonianza .virgolette { margin-bottom: 15px; }
.testimonianza p { font-size: 20px; line-height: 36px; color: var(--nero); margin-bottom: 35px; }
.testimonianza .firma { gap: 15px; }
.testimonianza .firma .ph { width: 55px; height: 55px; }
.testimonianza .firma h3 { font-size: 15px; line-height: 18px; font-weight: 600; letter-spacing: 1.4px; text-transform: uppercase; margin-bottom: 8px; }
.frecce { position: absolute; right: 40px; bottom: 45px; display: flex; gap: 15px; }
.frecce button { width: 45px; height: 45px; border-radius: 50%; border: 1px solid rgba(255,255,255,.5); background: transparent; color: var(--nero); font-size: 18px; cursor: pointer; transition: all .3s; }
.frecce button:hover { background: var(--bianco); }

/* ===== PREVENZIONE ===== */
.prevenzione { padding: 0 30px 50px; }
.prevenzione-griglia { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.prevenzione-griglia > .ph { border-radius: 20px; min-height: 863px; }
.pannello { background: var(--grigio); border-radius: 20px; padding: 100px 65px; overflow: hidden; }
.pannello h2 { font-size: 42px; line-height: 1.3; margin-bottom: 40px; }
.pannello .binario { display: flex; gap: 25px; transition: transform .6s ease; }
.consiglio { flex: 0 0 258px; background: var(--bianco); border-radius: 20px; padding: 50px 30px 30px; }
.consiglio .icona { margin-bottom: 30px; }
.consiglio h3 { font-size: 18px; line-height: 1.2; font-weight: 700; margin-bottom: 20px; }
.consiglio h3 a { color: var(--nero); }
.consiglio h3 a:hover { color: var(--blu); }
.consiglio p { margin: 0; }

/* ===== NOTIZIE ===== */
.notizie { padding: 0 0 100px; }
.notizie .titolo-sezione { max-width: 555px; margin-bottom: 40px; }
.griglia-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.notizia-foto { position: relative; margin-bottom: 27px; }
.notizia-foto .ph { height: 276px; border-radius: 20px; }
.etichetta { transition: all .3s; position: absolute; left: 8px; bottom: 8px; background: var(--azzurro); color: var(--nero); border-radius: 20px; padding: 12px 20px; font-size: 12px; font-weight: 600; letter-spacing: 1.2px; text-transform: uppercase; }
.meta { display: flex; gap: 34px; margin-bottom: 16px; font-size: 12.5px; line-height: 1; letter-spacing: 1.2px; }
.meta li:last-child { text-transform: uppercase; }
.notizia h3 { font-size: 23.5px; line-height: 1.4; margin-bottom: 20px; }
.notizia h3 a { color: var(--nero); }
.notizia h3 a:hover { color: var(--blu); }
.leggi-tutti { margin-top: 42px; border: 1px solid var(--grigio); border-radius: 40px; padding: 20px 50px; text-align: center; font-size: 15px; line-height: 27px; }
.leggi-tutti a { color: var(--viola); font-weight: 500; }
.leggi-tutti a:hover { color: var(--blu); }
.etichetta:hover { background: var(--blu); color: var(--bianco); }

/* ===== FOOTER ===== */
.piede { margin: 0 30px; background: var(--nero); border-radius: 40px 40px 0 0; overflow: hidden; }
.piede-griglia { display: grid; grid-template-columns: 290px 1fr 176px 176px 176px; column-gap: 72px; padding: 100px 35px 150px; }
.piede-logo img { width: 290px; height: auto; margin-bottom: 30px; }
.piede address { font-style: normal; font-weight: 700; line-height: 1.8; color: var(--grigio-footer); }
.piede h3 { color: var(--bianco); font-size: 20px; line-height: 1.2; font-weight: 700; margin-bottom: 30px; }
.piede li + li { margin-top: 18px; }
.piede li a, .link-piede { color: var(--grigio-footer); }
.link-piede { background: none; border: 0; padding: 0; font: inherit; cursor: pointer; transition: color .3s; }
.link-piede:hover { color: var(--bianco); }
.piede li a:hover { color: var(--bianco); }
.copyright { background: var(--azzurro); padding: 25px 15px; text-align: center; font-size: 14px; line-height: 1.8; color: var(--testo); }
.copyright p { margin: 0; }
.copyright .dati-societari { font-size: 12.5px; line-height: 1.6; margin-top: 4px; }
.copyright b { font-weight: 700; }
.copyright a { color: var(--testo); }

.su {
  position: fixed; right: 20px; bottom: 20px; z-index: 99; width: 40px; height: 40px; border-radius: 50%;
  background: var(--viola); color: var(--bianco); border: 0; font-size: 20px; cursor: pointer;
  opacity: 0; visibility: hidden; transition: all .3s;
}
.su.visibile { opacity: 1; visibility: visible; }

/* ===== RESPONSIVE ===== */
@media (max-width: 1399px) {
  .hero-foto { left: auto; right: 30px; width: 55%; height: auto; aspect-ratio: 1700 / 1200; }
  .orari .ph { width: 100%; height: auto; aspect-ratio: 586 / 541; margin-left: 0; }
  .carta-griglia { grid-template-columns: 58% 1fr; }
  .menu { margin-right: 0; }
}
@media (max-width: 1199px) {
  .hero h1 { font-size: 48px; line-height: 1.2; }
  .riquadri-griglia, .griglia-4 { grid-template-columns: repeat(2, 1fr); }
  .riquadri-bordo { border-radius: 60px; }
  .tabella-orari { grid-template-columns: auto auto; }
  .piede-griglia { grid-template-columns: 1fr 1fr 1fr; row-gap: 40px; }
  .piede-griglia > :first-child { grid-column: 1 / -1; }
  .piede-griglia > :nth-child(2) { display: none; }
}
@media (max-width: 991px) {
  .intestazione .barra { height: 90px; padding: 0 15px; }
  .logo img { width: 225px; height: 90px; }
  .hamburger { display: block; }
  .menu {
    display: none; position: absolute; top: 90px; left: 0; right: 0; flex-direction: column; gap: 0;
    background: var(--bianco); padding: 10px 20px 20px; box-shadow: 0 20px 30px rgba(146,139,221,.15);
    max-height: calc(100vh - 90px); overflow: auto;
  }
  .menu.aperto { display: flex; }
  .menu > li > a, .menu > li > button { padding: 12px 0; width: 100%; text-align: left; border-bottom: 1px solid var(--bordo); }
  .menu ul { position: static; width: auto; box-shadow: none; padding: 0 0 0 15px; display: none; opacity: 1; visibility: visible; transform: none; }
  .menu li.aperto > ul { display: block; }
  .menu li:hover > ul { display: none; }
  .menu li.aperto:hover > ul { display: block; }
  .hero { padding: 80px 0 200px; }
  .hero-foto { position: relative; right: auto; top: auto; width: 100%; margin-top: 40px; }
  .hero-foto { aspect-ratio: 1700 / 1200; height: auto; }
  .hero-visual { top: auto; bottom: 60px; right: -60px; width: 120%; height: auto; aspect-ratio: 611 / 590; opacity: .45; }
  .due-colonne, .carta-griglia, .prevenzione-griglia { grid-template-columns: 1fr; }
  .ssn-griglia { grid-template-columns: 1fr 1fr; gap: 30px; }
  .formazione h2 { font-size: 40px; line-height: 1.3; margin-bottom: 50px; }
  .prevenzione-griglia > .ph { min-height: 420px; }
  .griglia-3 { grid-template-columns: 1fr 1fr; }
  .titolo-sezione, .orari h2, .vademecum h2, .pannello h2 { font-size: 34px; }
}
@media (max-width: 767px) {
  .hero h1 { font-size: 36px; }
  .riquadri { padding: 30px 12px 0; border-radius: 50px 50px 0 0; }
  .riquadri-bordo { padding: 20px; border-radius: 30px; }
  .riquadri-griglia, .griglia-4, .griglia-3, .ssn-griglia { grid-template-columns: 1fr; }
  .tabella-orari { grid-template-columns: 1fr 1fr; column-gap: 10px; font-size: 14px; }
  .aree { margin: 0 10px; padding: 60px 0; }
  .citazione { padding: 0 10px; }
  .vademecum, .pannello { padding: 40px 25px; }
  .pannello .binario { flex-direction: column; }
  .consiglio { flex-basis: auto; }
  .prevenzione { padding: 0 12px 50px; }
  .formazione h2 { font-size: 30px; }
  .formazione .ph-foto { height: auto; aspect-ratio: 636 / 382; }
  .frecce { position: static; padding: 0 40px 30px; }
  .piede { margin: 0 10px; }
  .piede-griglia { grid-template-columns: 1fr; padding: 60px 25px; }
  .titolo-sezione, .orari h2, .vademecum h2, .pannello h2 { font-size: 28px; }
}

/* ===== PAGINA: ACCESSO ALLA STRUTTURA ===== */
.percorso { padding: 100px 0; }
.percorso-interno { max-width: 1099px; margin: 0 auto; padding: 0 12px; }
.percorso-titolo { max-width: 875px; margin: 0 auto 55px; font-size: 40px; line-height: 1.3; font-weight: 500; }
.passi { display: flex; justify-content: center; gap: 24px; margin: 0 0 50px; padding: 0; list-style: none; counter-reset: none; }
.passi li { position: relative; flex: 0 0 196px; text-align: center; }
.passi .cerchio { display: flex; align-items: center; justify-content: center; width: 120px; height: 120px; margin: 0 auto 22px; border-radius: 50%; }
.passi .cerchio img { width: auto; height: 48px; }
.passi .cerchio img[width="55"] { height: 42px; }
.passi-azzurri .cerchio { background: #7BA8C9; }
.passi-lilla .cerchio { background: var(--lilla); }
.passi h2, .passi h3 { font-size: 16px; line-height: 1.2; font-weight: 600; }
/* freccia tra un passo e l'altro (non dopo l'ultimo) */
.passi li:not(:last-child)::before {
  content: ""; position: absolute; top: 56px; left: 188px; width: 40px; height: 8px;
  background: url(../img/grafica/freccia-passo.png) center / contain no-repeat;
}
.percorso-foto { height: 316px; border-radius: 20px; }

@media (max-width: 1199px) {
  .passi { flex-wrap: wrap; row-gap: 40px; }
  .passi li::before { display: none; }
}
@media (max-width: 767px) {
  .percorso { padding: 60px 0; }
  .percorso-titolo { font-size: 28px; margin-bottom: 40px; }
  .passi li { flex-basis: calc(50% - 12px); }
  .passi .cerchio { width: 100px; height: 100px; }
  .percorso-foto { height: auto; aspect-ratio: 1075 / 316; }
}

/* ===== PAGINE: AREE SPECIALISTICHE ===== */
.pagina-area { overflow-x: hidden; }
.avviso-bozza { max-width: 1296px; margin: 30px auto 0; padding: 14px 20px; border-radius: 10px; background: #FFF4D6; color: #7A5A00; font-size: 14px; display: flex; gap: 10px; align-items: center; }
.avviso-bozza i { font-size: 20px; }

.area-intro { padding: 100px 0; }
.area-intro-griglia { display: grid; grid-template-columns: 856px 416px; gap: 24px; align-items: start; }
.area-intro h1 { font-size: 42px; line-height: 1.3; font-weight: 500; margin: 12px 0 30px; }
.area-intro h1 b { font-weight: 700; }
.area-intro-testo { display: grid; grid-template-columns: 269px 1fr; gap: 39px; align-items: start; }
.area-foto-piccola { height: 193px; border-radius: 10px; }
.area-intro-testo p { margin: 0; }
.area-foto-grande { height: 289px; border-radius: 20px; }

.area-riquadri { padding-bottom: 100px; }
.area-riquadri-griglia { display: grid; grid-template-columns: 428px 416px 428px; gap: 23px; justify-content: center; align-items: start; }
.area-riquadro { border-radius: 20px; padding: 50px; }
.area-riquadro.azzurro { background: var(--azzurro); }
.area-riquadro.verde { background: var(--verde); }
.area-riquadro.lilla { background: var(--lilla); }
.area-riquadro .riquadro-testa { align-items: center; margin-bottom: 15px; }
.area-riquadro .riquadro-testa i { margin-top: 0; }
.area-riquadro h2 { font-size: 14px; line-height: 1.2; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; }
.area-riquadro p { margin: 0 0 18px; }


/* nastro: carosello che scorre di una scheda alla volta */
.nastro { position: relative; }
.nastro .binario { display: flex; gap: 25px; transition: transform .6s ease; }

.tecnologie { background: #F5F7FB; padding: 100px 0 135px; }
.tecnologie-titolo { font-size: 42px; line-height: 1.3; padding-left: 330px; margin-bottom: 40px; }
.tecnologie .nastro { margin-right: -450px; }
.tecnologia { position: relative; flex: 0 0 305px; align-self: flex-start; background: var(--bianco); border-radius: 15px; padding: 30px 45px 30px 30px; }
.tecnologia h3 { font-size: 18px; line-height: 1.4; font-weight: 700; margin-bottom: 25px; }
.tecnologia h3 a { color: var(--nero); }
.tecnologia h3 a:hover { color: var(--blu); }
.tacca { position: absolute; top: 0; right: 0; width: 15px; height: 15px; background: #F5F7FB; border-radius: 0 0 0 15px; }

.convenzionate { padding: 100px 0 0; }
.convenzionate-titolo { font-size: 42px; line-height: 1.3; text-align: center; margin-bottom: 40px; }
.convenzionate-griglia { display: grid; grid-template-columns: 566px 636px; gap: 94px; align-items: start; }
.convenzionate-foto { position: relative; margin-top: 32px; background: var(--blu); border-radius: 20px; padding: 50px 50px 0; }

/* silhouette DEA in filigrana dietro la foto (nella bozza qui c'era il logo del tema) */
.convenzionate-foto::before { content: ""; position: absolute; left: 50%; top: 30px; width: 390px; height: 554px; transform: translateX(-45%); background: rgba(255,255,255,.2); -webkit-mask: url(../img/grafica/silhouette-dea.svg) center / contain no-repeat; mask: url(../img/grafica/silhouette-dea.svg) center / contain no-repeat; }
.convenzionate-foto .ph { position: relative; height: 717px; border-radius: 12px 12px 0 0; background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.6); color: #fff; }
.convenzionate-foto .ph strong { color: #fff; }
.convenzionate-nota { position: absolute; left: 221px; top: 593px; width: 415px; display: flex; gap: 40px; background: var(--lilla); border-radius: 20px; padding: 35px 30px; }
.convenzionate-nota h3 { font-size: 18px; line-height: 1.5; font-weight: 700; color: var(--testo); }
.convenzionate-schede { display: grid; grid-template-columns: 306px 306px; gap: 24px; align-items: start; }
.prestazione { background: #F7F9FD; border: 1px solid #E1E6F0; border-radius: 20px; padding: 35px 30px; }
.prestazione img { margin-bottom: 105px; }
.prestazione h3 { font-size: 18px; line-height: 1.2; font-weight: 700; margin-bottom: 14px; }
.prestazione p { margin: 0; }

.area-team { padding: 100px 0; }
.titolo-largo { max-width: 1050px; }
.nastro-team { overflow: hidden; }
.membro { position: relative; flex: 0 0 305px; height: 362px; border-radius: 20px; overflow: hidden; }
.membro .ph { height: 362px; border-radius: 20px; }
.membro::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; border-radius: 0 0 20px 20px; background: linear-gradient(rgba(149,136,232,0) 60%, #574AAD 100%); }
.membro-testo { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 30px; text-align: center; }
.membro-testo h3 { font-size: 18px; line-height: 1.2; font-weight: 700; margin: 20px 0 12px; }
.membro-testo h3 a, .membro-testo span { color: var(--bianco); }
.nastro-prec, .nastro-succ { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 45px; height: 45px; border-radius: 50%; border: 0; background: var(--bianco); color: var(--nero); font-size: 18px; cursor: pointer; box-shadow: 0 4px 20px rgba(2,13,43,.12); transition: all .3s; }
.nastro-prec { left: 10px; }
.nastro-succ { right: 10px; }
.nastro-prec:hover, .nastro-succ:hover { background: var(--blu); color: var(--bianco); }

.area-consigli { background: var(--verde); padding: 100px 0; }
.griglia-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.articolo-foto { position: relative; margin-bottom: 28px; }
.articolo-foto .ph { height: 424px; border-radius: 20px; }
.data-tacca { position: absolute; top: 0; left: 0; background: var(--verde); border-radius: 0 0 20px 0; padding: 0 15px 15px 0; }
.data { background: #5DB996; border-radius: 10px; padding: 10px 15px; color: var(--bianco); }
.data span { display: block; line-height: 24px; }
.data b { display: block; font-size: 18px; line-height: 1.2; font-weight: 700; margin-top: 5px; }
.articolo .meta { gap: 30px; font-size: 13px; line-height: 1.5; letter-spacing: 0; margin-bottom: 14px; }
.articolo .meta li:last-child { position: relative; }
.articolo .meta li:last-child::before { content: ""; position: absolute; left: -17px; top: 50%; width: 4px; height: 4px; border-radius: 50%; background: var(--testo); }
.articolo h3 { font-size: 23.5px; line-height: 1.4; margin-bottom: 20px; }
.articolo h3 a { color: var(--nero); }
.articolo h3 a:hover { color: var(--blu); }
.articolo .link-freccia { font-size: 15px; }

@media (max-width: 1399px) {
  .area-intro-griglia { grid-template-columns: 1fr 34%; }
  .convenzionate-griglia { grid-template-columns: 1fr 1fr; gap: 40px; }
  .convenzionate-schede { grid-template-columns: 1fr 1fr; }
  .convenzionate-nota { left: auto; right: -20px; width: 80%; }
}
@media (max-width: 1199px) {
  .area-riquadri-griglia { grid-template-columns: 1fr 1fr; }
    .tecnologie-titolo { padding-left: 0; }
}
@media (max-width: 991px) {
  .area-intro-griglia, .convenzionate-griglia { grid-template-columns: 1fr; }
  .area-foto-grande { height: auto; aspect-ratio: 416 / 289; }
  .convenzionate-foto .ph { height: auto; aspect-ratio: 466 / 717; }
  .convenzionate-nota { position: static; width: auto; margin: -40px -20px 0; }
  .area-intro h1, .tecnologie-titolo, .convenzionate-titolo { font-size: 34px; }
}
@media (max-width: 767px) {
  .avviso-bozza { margin: 20px 12px 0; }
  .area-intro { padding: 60px 0; }
  .area-intro-testo, .area-riquadri-griglia, .convenzionate-schede, .griglia-2 { grid-template-columns: 1fr; }
  .area-foto-piccola { height: auto; aspect-ratio: 269 / 193; }
  .area-riquadro { padding: 30px; }
    .tecnologie .nastro { margin-right: 0; }
  .tecnologia { flex-basis: 260px; }
  .membro { flex-basis: 280px; }
  .articolo-foto .ph { height: auto; aspect-ratio: 3 / 2; }
  .area-intro h1, .tecnologie-titolo, .convenzionate-titolo { font-size: 28px; }
  .prestazione img { margin-bottom: 40px; }
}
.convenzionate-griglia > *, .area-intro-griglia > *, .area-intro-testo > * { min-width: 0; }

/* ===== PAGINA: PRESTAZIONI MEDICO-SPECIALISTICHE ===== */
.carta-foto { height: 526px; border-radius: 20px; }
.area-riquadro .link-freccia { margin-top: 5px; }
.scheda .btn { margin-top: 5px; }
.tempi { background: #F5F7FB; padding: 100px 0; }
.tempi-griglia { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.tempi-scheda { background: var(--bianco); border-radius: 20px; padding: 45px 50px; }
.tempi-scheda.evidenza { background: var(--azzurro); }
.tempi-scheda h3 { font-size: 14px; line-height: 1.2; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; margin-bottom: 30px; }
.tempi-scheda li { display: flex; align-items: center; gap: 15px; padding: 16px 0; border-top: 1px solid var(--bordo); }
.tempi-scheda.evidenza li { border-color: rgba(2,13,43,.1); }
.tempi-scheda li div { line-height: 1.5; }
.tempi-scheda li b { display: block; font-weight: 700; color: var(--nero); }
.classe { flex: none; width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 18px; color: var(--bianco); }
.classe + .classe { margin-left: -25px; box-shadow: 0 0 0 3px var(--azzurro); }
.c-u { background: var(--corallo); }
.c-b { background: var(--blu); }
.c-d { background: #5DB996; }
.c-p { background: var(--viola); }
@media (max-width: 991px) { .tempi-griglia { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .tempi { padding: 60px 0; } .tempi-scheda { padding: 30px 25px; } .carta-foto { height: auto; aspect-ratio: 746 / 526; } }

/* voce di menu con pagina propria e sottomenu */
.menu > li.sottomenu > a > i { position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-size: 13px; }
.menu .solo-mobile { display: none; }
@media (max-width: 991px) { .menu .solo-mobile { display: block; } }
/* schede delle aree con pulsante: stessa altezza, pulsante allineato in basso */
.pagina-area .griglia-4 { align-items: stretch; }
.pagina-area .scheda { display: flex; flex-direction: column; align-items: flex-start; }
.pagina-area .scheda .btn { margin-top: auto; }
.menu > li.sottomenu > a, .menu > li.sottomenu > button { position: relative; }
/* schede delle aree con foto (pagina Prestazioni) */
.scheda-foto { padding: 0; overflow: visible; }
.scheda-foto::after { display: none; }
.scheda-immagine { display: block; width: 100%; }
.scheda-immagine .ph { aspect-ratio: 306 / 230; border-radius: 20px 20px 0 0; border: 0; }
.scheda-corpo { padding: 30px 30px 35px; display: flex; flex-direction: column; align-items: flex-start; gap: 20px; flex: 1; }
.scheda-foto h3 { margin: 0; font-size: 20px; }
.pagina-area .scheda-foto .btn { margin-top: auto; }
.scheda-immagine img { width: 100%; height: auto; aspect-ratio: 306 / 230; object-fit: cover; border-radius: 20px 20px 0 0; }

/* ===== AREE SPECIALISTICHE: modello personalizzato per area ===== */
.area-apertura { padding: 80px 0 100px; background: linear-gradient(180deg, #F5F7FB 0%, #fff 100%); }
.area-apertura-griglia { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.area-apertura-griglia > * { min-width: 0; }
.occhiello { font-size: 14px; font-weight: 500; color: var(--testo); margin-bottom: 18px; display: flex; align-items: center; gap: 6px; }
.occhiello a { color: var(--blu); }
.occhiello i { font-size: 14px; }
.area-apertura h1 { font-size: 56px; line-height: 1.1; font-weight: 800; margin-bottom: 14px; }
.area-apertura .sottotitolo { font-size: 20px; line-height: 1.5; color: var(--nero); font-weight: 500; margin-bottom: 20px; }
.area-apertura .pulsanti { margin-top: 30px; display: flex; gap: 15px; flex-wrap: wrap; }
.area-apertura-foto img { width: 100%; height: auto; border-radius: 20px; box-shadow: 0 20px 60px rgba(2,13,43,.12); }
.area-diabetologia .area-apertura-foto { border-left: 0; }
/* tocco di colore per area: barra sotto il titolo */
.area-apertura h1::after { content: ""; display: block; width: 70px; height: 5px; border-radius: 5px; margin-top: 16px; background: var(--azzurro); }
.area-cardiologia .area-apertura h1::after { background: var(--rosa); }
.area-dietologia .area-apertura h1::after { background: var(--verde); }
.area-psicologia .area-apertura h1::after { background: var(--lilla); }

.area-prestazioni { padding: 100px 0; }
.prestazioni-griglia { display: grid; gap: 24px; grid-template-columns: repeat(4, 1fr); }
.prestazioni-griglia.n3 { grid-template-columns: repeat(3, 1fr); }
.prestazioni-griglia.n5 { grid-template-columns: repeat(5, 1fr); }
.prestazioni-griglia .prestazione img, .prestazioni-griglia .prestazione .icona-ti { margin-bottom: 40px; }
.icona-ti { display: block; font-size: 48px; line-height: 1; color: var(--blu); }
.link-elenco { margin-top: 30px; text-align: center; }

.area-accesso { padding: 0 0 100px; }
.area-accesso-griglia { display: grid; grid-template-columns: 380px 1fr; gap: 60px; align-items: start; background: var(--grigio); border-radius: 20px; padding: 60px; }
.area-accesso h2 { font-size: 36px; line-height: 1.25; margin-bottom: 30px; }
.accesso-voci { display: grid; gap: 16px; }
.accesso-voce { display: flex; gap: 18px; align-items: flex-start; background: var(--bianco); border-radius: 15px; padding: 22px 26px; }
.accesso-voce > i { font-size: 30px; color: var(--blu); flex: none; }
.accesso-voce h3 { font-size: 17px; font-weight: 700; margin-bottom: 4px; }
.accesso-voce p { margin: 0; }

.tecnologie-area { padding: 100px 0; }
.tecnologie-area .tecnologie-titolo { padding-left: 0; text-align: center; }
.tecnologie-griglia { display: flex; flex-wrap: wrap; justify-content: center; gap: 25px; }
.tecnologie-griglia .tecnologia { flex: 0 0 305px; }

.persone-griglia { display: flex; flex-wrap: wrap; justify-content: center; gap: 25px; }
.persone-griglia .membro { flex: 0 0 305px; }

.griglia-2.singolo { grid-template-columns: minmax(0, 636px); justify-content: center; }

.area-prenota { padding: 100px 0; }
.prenota-box { display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: center; background: var(--azzurro); border-radius: 20px; padding: 60px; }
.prenota-box h2 { font-size: 36px; line-height: 1.25; margin-bottom: 12px; }
.prenota-box p { margin: 0; }
.prenota-azioni { display: flex; flex-direction: column; gap: 12px; }
.prenota-azioni a { display: flex; align-items: center; gap: 10px; padding: 16px 26px; border-radius: 10px; font-weight: 600; color: var(--bianco); min-width: 250px; }
.prenota-azioni a i { font-size: 20px; }
.prenota-azioni .corallo { background: var(--corallo); }
.prenota-azioni .scuro { background: var(--testo); }
.prenota-azioni .chiaro { background: var(--bianco); color: var(--nero); }
.prenota-azioni a:hover { opacity: .88; }

@media (max-width: 1199px) {
  .prestazioni-griglia, .prestazioni-griglia.n5 { grid-template-columns: repeat(3, 1fr); }
  .area-accesso-griglia { grid-template-columns: 1fr; gap: 30px; }
}
@media (max-width: 991px) {
  .area-apertura-griglia, .prenota-box { grid-template-columns: 1fr; }
  .area-apertura h1 { font-size: 44px; }
  .prestazioni-griglia, .prestazioni-griglia.n3, .prestazioni-griglia.n5 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  .area-apertura { padding: 40px 0 60px; }
  .area-apertura h1 { font-size: 36px; }
  .prestazioni-griglia, .prestazioni-griglia.n3, .prestazioni-griglia.n5 { grid-template-columns: 1fr; }
  .area-accesso-griglia, .prenota-box { padding: 30px 22px; }
  .area-accesso h2, .prenota-box h2 { font-size: 28px; }
  .prenota-azioni a { min-width: 0; }
  .area-prestazioni, .tecnologie-area, .area-prenota { padding: 60px 0; }
}
.area-apertura-foto.grafica { display: flex; justify-content: center; }
.ruota-complicanze { width: 100%; max-width: 560px; height: auto; display: block; }
.mappa-cardiologia { width: 100%; max-width: 640px; height: auto; display: block; }
.mappa-dietologia { width: 100%; max-width: 640px; height: auto; display: block; }
.bolle-psicologia { width: 100%; max-width: 600px; height: auto; display: block; }
.bolle-psicologia .bolla { animation: galleggia 6.6s ease-in-out infinite; }
@keyframes galleggia { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
:is(.mappa-cardiologia, .mappa-dietologia) .alone { transform-box: fill-box; transform-origin: center; animation: pulsa 2.4s ease-out infinite; }
:is(.mappa-cardiologia, .mappa-dietologia) .alone-2 { animation-delay: 1.2s; }
:is(.mappa-cardiologia, .mappa-dietologia) .punto { transform-box: fill-box; transform-origin: center; animation: battito 2.4s ease-in-out infinite; }
@keyframes pulsa { 0% { transform: scale(.7); opacity: .9; } 100% { transform: scale(2.4); opacity: 0; } }
@keyframes battito { 0%, 40%, 100% { transform: scale(1); } 15% { transform: scale(1.18); } 28% { transform: scale(1.06); } }
@media (prefers-reduced-motion: reduce) { :is(.mappa-cardiologia, .mappa-dietologia) :is(.alone, .punto), .bolle-psicologia .bolla { animation: none; } }

/* ===================== CHI SIAMO (misure della bozza a 1440 px) ===================== */
.nascosto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* La nostra storia: blocchi foto/testo alternati, foto con la sagoma del tema */
.storia-blocco { padding-top: 100px; }
.storia-blocco:last-child { padding-bottom: 100px; }
.storia-griglia { display: grid; grid-template-columns: 591fr 636fr; gap: 69px; align-items: center; }
.storia-blocco.inverso .storia-griglia { grid-template-columns: 636fr 586fr; }
.storia-blocco.inverso .storia-foto { order: 2; }
.storia-foto { aspect-ratio: 875 / 808; height: auto; border-radius: 0;
  -webkit-mask: url(../img/grafica/forma-foto.svg) center / 100% 100% no-repeat; mask: url(../img/grafica/forma-foto.svg) center / 100% 100% no-repeat; }
.storia-anni { display: inline-block; margin-bottom: 14px; padding: 4px 14px; border-radius: 50px; background: var(--azzurro); color: var(--nero); font-size: 14px; font-weight: 600; }
.storia-testo h1, .storia-testo h2 { font-size: 42px; line-height: 1.2; margin-bottom: 16px; }
.storia-testo p { margin: 0 0 12px; }
.evidenza { color: var(--blu); }

/* Il nostro team: categorie con schede centrate */
.team-categoria { padding-top: 100px; }
.team-categoria + .team-categoria { padding-top: 25px; }
.team-categoria:last-child { padding-bottom: 100px; }
.team-categoria .titolo-sezione { margin-bottom: 40px; }
.team-griglia { display: flex; flex-wrap: wrap; justify-content: center; gap: 48px 24px; }
.persona { flex: 0 0 416px; text-align: center; }
.persona .ph { height: 493px; border-radius: 20px; }
.persona h3 { font-size: 18px; line-height: 1.2; font-weight: 700; margin-top: 25px; }
.persona h3 a { color: var(--nero); }
.persona h3 a:hover { color: var(--blu); }
.persona span { display: block; margin-top: 12px; font-size: 16px; line-height: 1.5; }

/* Sistema qualità */
.qualita-politica { padding-top: 100px; }
.qualita-politica-griglia { display: grid; grid-template-columns: 636fr 586fr; gap: 74px; align-items: center; }
.qualita-collage { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 310px 190px; gap: 22px 24px; }
.qualita-collage .ph { border-radius: 20px; height: auto; }
.qualita-collage .collage-3 { grid-column: 2; grid-row: 1 / 3; }
.qualita-testo h1 { font-size: 42px; line-height: 1.2; margin-bottom: 20px; }
.qualita-obiettivi { padding: 100px 0; }
.qualita-obiettivi-griglia { display: grid; grid-template-columns: 611fr 636fr; gap: 49px; align-items: start; }
.qualita-obiettivi h2 { font-size: 42px; line-height: 1.2; margin-bottom: 50px; }
.obiettivi-titolo { font-size: 25px; line-height: 1.2; padding-bottom: 25px; margin-bottom: 30px; border-bottom: 1px solid #F2F4F6; }
.fisarmonica-voce { padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid #F2F4F6; }
.fisarmonica-voce:last-child { margin-bottom: 0; }
.fisarmonica-voce summary { position: relative; list-style: none; cursor: pointer; padding: 4px 30px 4px 55px; font-size: 18px; line-height: 1.5; font-weight: 700; color: var(--nero); }
.fisarmonica-voce summary::-webkit-details-marker { display: none; }
/* quadratino blu con + / − (icone Tabler) e freccia a destra, come nel tema */
.fisarmonica-voce summary::before { content: "\eb0b"; font-family: "tabler-icons"; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 35px; height: 35px; border-radius: 10px; background: var(--blu); color: var(--bianco); font-size: 20px; font-weight: 400; display: flex; align-items: center; justify-content: center; }
.fisarmonica-voce[open] summary::before { content: "\eaf2"; }
.fisarmonica-voce summary::after { content: "\ea5f"; font-family: "tabler-icons"; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-size: 20px; font-weight: 400; transition: transform .3s; }
.fisarmonica-voce[open] summary::after { transform: translateY(-50%) rotate(180deg); }
.fisarmonica-voce summary:hover { color: var(--blu); }
.fisarmonica-voce p { margin: 15px 0 0; padding-left: 55px; font-size: 16px; line-height: 1.5; }
.qualita-foto { height: 380px; border-radius: 20px; }

@media (max-width: 1199px) {
  .persona { flex-basis: 340px; }
  .persona .ph { height: 400px; }
}
@media (max-width: 991px) {
  .storia-griglia, .storia-blocco.inverso .storia-griglia, .qualita-politica-griglia, .qualita-obiettivi-griglia { grid-template-columns: 1fr; gap: 40px; }
  .storia-blocco.inverso .storia-foto { order: 0; }
  .storia-foto { max-width: 591px; }
  .storia-testo h1, .storia-testo h2, .qualita-testo h1, .qualita-obiettivi h2 { font-size: 34px; }
  .storia-blocco, .team-categoria:first-of-type, .qualita-politica { padding-top: 70px; }
  .storia-blocco:last-child, .team-categoria:last-child { padding-bottom: 70px; }
  .qualita-obiettivi { padding: 70px 0; }
}
@media (max-width: 767px) {
  .persona { flex-basis: 100%; max-width: 416px; }
  .persona .ph { height: auto; aspect-ratio: 416 / 493; }
  .qualita-collage { grid-template-rows: 200px 130px; }
  .qualita-foto { height: 240px; }
}

/* ===================== CONTATTI (misure della bozza a 1440 px) ===================== */
.contatti { padding: 100px 0; }
.contatti-griglia { display: grid; grid-template-columns: 416px 1fr; gap: 49px; align-items: start; }
.recapito { border-radius: 40px; padding: 50px; margin-bottom: 25px; }
.recapito:last-child { margin-bottom: 0; }
.recapito.lilla { background: var(--lilla); }
.recapito.rosa { background: var(--rosa); }
.recapito.verde { background: var(--verde); }
.recapito-titolo { display: flex; align-items: center; margin-bottom: 15px; }
.recapito-titolo i { font-size: 40px; color: var(--nero); }
.recapito-titolo h2 { font-size: 14px; line-height: 1.2; font-weight: 700; letter-spacing: 1.4px; margin-left: 15px; }
.recapito p { margin: 0; }
.recapito a { color: var(--testo); }
.recapito a:hover { color: var(--blu); }
.contatti-modulo h2 { font-size: 42px; line-height: 1.2; margin-bottom: 15px; }
.contatti-modulo > p { margin-bottom: 24px; }
.modulo { border: 1px solid var(--grigio); border-radius: 20px; padding: 30px; }
.campo { margin-bottom: 25px; }
.campo label { display: block; font-size: 14px; line-height: 1.5; margin-bottom: 10px; }
.campo input, .campo textarea { width: 100%; font: 14px/1.5 var(--font); color: var(--nero); background: var(--grigio); border: 1px solid var(--grigio); border-radius: 50px; padding: 15px 20px; height: 55px; outline: none; transition: border-color .3s; }
.campo textarea { height: 145px; border-radius: 20px; resize: vertical; }
.campo input::placeholder, .campo textarea::placeholder { color: #687390; }
.campo input:focus, .campo textarea:focus { border-color: var(--blu); }
.consenso { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.5; margin-bottom: 30px; }
.consenso input { margin: 3px 0 0; flex: none; }
.btn-scuro { background: var(--nero); border: 0; cursor: pointer; font-family: var(--font); }
.btn-scuro:hover { background: var(--blu); }
.modulo-esito { margin: 15px 0 0; font-size: 14px; color: var(--nero); }
.mappa { padding: 10px 23px; }
.mappa-riquadro { height: 450px; background: var(--grigio) url(../img/grafica/come-arrivare.jpg) center / cover; position: relative; }
.mappa-riquadro iframe { width: 100%; height: 100%; border: 0; display: block; }
.mappa-avviso { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; text-align: center; padding: 20px; background: rgba(233,238,242,.88); }
.mappa-avviso > i { font-size: 44px; color: var(--blu); }
.mappa-avviso p { margin: 0; max-width: 460px; color: var(--nero); }
.come-arrivare { padding: 10px 0 100px; }
.come-arrivare-testo { max-width: 929px; }
.come-arrivare h2 { font-size: 30px; line-height: 1; font-weight: 600; margin-bottom: 20px; }
.come-arrivare img { margin: 20px auto 0; width: 724px; }

/* ===================== ORARI ===================== */
.orari-apertura { padding: 50px 0 100px; }
.orari-riquadro { max-width: 855px; margin: 0 auto; background: #E9EEF2; border-radius: 20px; padding: 50px 80px 0; text-align: center; }
.orari-riquadro h1 { font-size: 25px; line-height: 1.2; margin-bottom: 18px; }
.orari-aree { font-size: 20px; font-weight: 500; color: var(--nero); margin-bottom: 20px; word-spacing: 6px; }
.orari-aree span { margin: 0 12px; }
.orari-colonne { display: grid; grid-template-columns: 1fr 1fr; gap: 0 95px; text-align: left; position: relative; }
.orari-colonne::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 20px; border-left: 1px solid var(--bianco); }
.orari-colonne li { display: flex; justify-content: space-between; padding: 0 0 15px; margin-bottom: 15px; border-bottom: 1px solid var(--bianco); min-height: 40px; }
.orari-colonne strong { font-weight: 700; color: var(--nero); font-size: 14px; }
.calendario { padding: 0 0 100px; text-align: center; }
.occhiello-viola { display: block; font-size: 12px; font-weight: 700; letter-spacing: 1px; color: var(--viola); margin-bottom: 15px; }
.calendario .titolo-sezione { margin-bottom: 40px; }
.calendario-filtri { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 40px; }
.calendario-filtri button { font: 600 12px/1.5 var(--font); color: var(--nero); background: var(--bianco); border: 1px solid var(--azzurro); border-radius: 20px; padding: 10px 20px; cursor: pointer; text-transform: uppercase; transition: background .3s; }
.calendario-filtri button[aria-pressed="true"], .calendario-filtri button:hover { background: var(--azzurro); }
.calendario-tabella { overflow-x: auto; }
.calendario table { width: 100%; border-collapse: collapse; text-align: left; min-width: 760px; }
.calendario thead th { background: #E9EDF0; border: 1px solid var(--bianco); font-size: 12px; font-weight: 600; color: var(--nero); text-transform: uppercase; text-align: center; padding: 25px 10px; }
.calendario tbody th, .calendario td { border: 1px solid #E9EDF0; padding: 25px; vertical-align: middle; }
.calendario tbody th { font-size: 16px; font-weight: 500; color: var(--testo); width: 200px; }
.calendario td { text-align: center; }
.visita { display: inline-block; white-space: nowrap; margin: 3px; padding: 6px 14px; border-radius: 50px; font-size: 13px; font-weight: 600; color: var(--nero); }
.visita.diabetologia { background: var(--azzurro); }
.visita.cardiologia { background: var(--rosa); }
.calendario-vuoto { margin: 20px 0 0; }
.calendario-nota { margin: 20px 0 0; font-size: 14px; }
.avviso-appuntamento { padding-bottom: 100px; }
.avviso-riquadro { max-width: 855px; margin: 0 auto; background: #E9EEF2; border-radius: 20px; padding: 50px; text-align: center; font-size: 25px; line-height: 1.2; font-weight: 700; color: #C01818; }
.prenotazioni { padding-bottom: 100px; }
.prenotazioni-colonna { max-width: 660px; }
.prenotazioni h2 { font-size: 42px; line-height: 1.2; margin-bottom: 50px; padding-bottom: 25px; border-bottom: 1px solid #F2F4F6; }
.fisarmonica-voce .elenco { margin: 10px 0 0; padding-left: 75px; list-style: disc; }
.fisarmonica-voce .elenco li { margin-bottom: 4px; }
.fisarmonica-voce .elenco + p { margin-top: 10px; }

@media (max-width: 991px) {
  .contatti-griglia { grid-template-columns: 1fr; }
  .contatti, .orari-apertura { padding: 70px 0; }
  .come-arrivare, .calendario, .avviso-appuntamento, .prenotazioni { padding-bottom: 70px; }
  .contatti-modulo h2, .prenotazioni h2 { font-size: 34px; }
}
@media (max-width: 767px) {
  .recapito { padding: 35px; border-radius: 30px; }
  .modulo { padding: 20px; }
  .mappa { padding: 10px 12px; }
  .mappa-riquadro { height: 360px; }
  .come-arrivare img { width: 100%; }
  .orari-riquadro { padding: 35px 20px 15px; }
  .orari-colonne { grid-template-columns: 1fr; }
  .orari-colonne::before { display: none; }
  .avviso-riquadro { font-size: 20px; padding: 30px 20px; }
}

/* ===================== BANNER DEL TITOLO (tema: page-banner) ===================== */
.banner-pagina { padding: 15px 30px 0; }
.banner-pagina-interno { display: flex; align-items: center; justify-content: space-between; gap: 30px; background: #E9EEF2; border-radius: 20px; padding: 50px 55px 50px 75px; min-height: 206px; }
.banner-pagina h1 { font-size: 40px; line-height: 1.2; margin-bottom: 9px; }
.briciole { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; font-size: 12px; line-height: 1.5; letter-spacing: 1.2px; }
.briciole li + li::before { content: ">"; margin: 0 12px; color: var(--testo); }
.briciole a { color: var(--viola); font-weight: 500; }
.briciole a:hover { color: var(--blu); }
.banner-strumenti { display: flex; flex-direction: column; align-items: flex-end; gap: 15px; }
.banner-telefono { display: inline-flex; align-items: center; gap: 15px; background: var(--bianco); border-radius: 50px; padding: 5px 25px 5px 5px; color: var(--testo); letter-spacing: 1.28px; white-space: nowrap; }
.banner-telefono i { width: 40px; height: 40px; border-radius: 50%; background: #5DB996; color: var(--bianco); font-size: 22px; display: flex; align-items: center; justify-content: center; }
.banner-telefono b { color: #2C7559; }
.banner-azioni { display: flex; gap: 22px; background: var(--blu); border-radius: 30px; padding: 10px 22px; }
.banner-azioni a, .banner-azioni button { display: flex; color: var(--bianco); background: none; border: 0; padding: 0; cursor: pointer; font-size: 20px; }
.banner-azioni a:hover, .banner-azioni button:hover { color: var(--azzurro); }

/* ===================== AREA MEDICI ===================== */
.area-medici { padding: 100px 0; }
.area-medici-intro { max-width: 760px; margin: 0 auto 50px; text-align: center; }
.area-medici h2 { font-size: 42px; line-height: 1.2; margin-bottom: 20px; }
.area-medici-griglia { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; max-width: 1080px; margin: 0 auto; }
.area-medici-riquadro { border: 1px solid var(--grigio); border-radius: 40px; padding: 50px; }
.area-medici-riquadro.azzurro { background: var(--azzurro); border-color: var(--azzurro); }
.riquadro-icona { width: 64px; height: 64px; border-radius: 20px; background: var(--blu); color: var(--bianco); font-size: 32px; display: flex; align-items: center; justify-content: center; margin-bottom: 25px; }
.area-medici-riquadro h3 { font-size: 25px; line-height: 1.2; margin-bottom: 12px; }
.area-medici-riquadro .modulo { border: 0; padding: 0; margin-top: 25px; }
.nota-password { margin: 20px 0 0; font-size: 14px; }
.iscrizione-colonna { max-width: 900px; }
.modulo-iscrizione { margin-top: 30px; }
.campi-griglia { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 20px; }
.campo select { width: 100%; font: 14px/1.5 var(--font); color: var(--nero); background: var(--grigio); border: 1px solid var(--grigio); border-radius: 50px; padding: 15px 20px; height: 55px; outline: none; appearance: none; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23020D2B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M6 9l6 6l6 -6'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right 18px center; background-size: 18px; }
.campo select:focus { border-color: var(--blu); }
.riservata-testa { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 50px; }
.riservata-testa h2 { margin: 0; }
.area-medici .riservata-titolo { display: flex; align-items: center; gap: 12px; font-size: 25px; margin: 0 0 25px; padding-bottom: 20px; border-bottom: 1px solid #F2F4F6; }
.riservata-titolo i { color: var(--blu); font-size: 30px; }
.eventi { display: grid; gap: 20px; margin-bottom: 60px; }
.evento { display: grid; grid-template-columns: 90px 1fr auto; gap: 25px; align-items: center; border: 1px solid var(--grigio); border-radius: 20px; padding: 20px 30px 20px 20px; }
.evento-data { background: var(--blu); color: var(--bianco); border-radius: 15px; text-align: center; padding: 12px 6px; line-height: 1.2; }
.evento-data span { display: block; font-size: 26px; font-weight: 800; }
.evento-data b { font-size: 13px; font-weight: 500; }
.evento h3 { font-size: 18px; font-weight: 700; margin-bottom: 8px; }
.evento-info { display: flex; flex-wrap: wrap; gap: 6px 22px; font-size: 14px; }
.evento-info li { display: flex; align-items: center; gap: 6px; }
.evento-info i { color: var(--blu); font-size: 18px; }
.materiali { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; }
.materiali a { display: flex; align-items: center; gap: 12px; background: #E9EEF2; border-radius: 15px; padding: 18px 22px; color: var(--nero); font-weight: 500; }
.materiali a:hover { background: var(--azzurro); }
.materiali i { font-size: 26px; color: #C01818; }

@media print { .intestazione, .piede, .banner-strumenti, .su { display: none !important; } }
@media (max-width: 991px) {
  .banner-pagina-interno { flex-direction: column; align-items: flex-start; padding: 40px; }
  .banner-strumenti { align-items: flex-start; }
  .area-medici { padding: 70px 0; }
  .area-medici h2 { font-size: 34px; }
  .area-medici-griglia { grid-template-columns: 1fr; }
  .campi-griglia { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 767px) {
  .banner-pagina { padding: 10px 12px 0; }
  .banner-pagina-interno { padding: 30px 22px; min-height: 0; }
  .banner-pagina h1 { font-size: 30px; }
  .area-medici-riquadro { padding: 30px 22px; border-radius: 30px; }
  .campi-griglia, .materiali { grid-template-columns: 1fr; }
  .evento { grid-template-columns: 70px 1fr; }
  .evento .link-freccia { grid-column: 2; }
}

/* campi obbligatori: asterisco rosso ovunque */
.obbligatorio { color: #C01818; font-weight: 700; margin-left: 2px; }

/* ===================== BANNER COOKIE ===================== */
.cookie-banner { position: fixed; z-index: 1000; left: 30px; bottom: 30px; width: min(560px, calc(100% - 60px)); background: var(--bianco); border-radius: 20px; padding: 30px; box-shadow: 0 20px 60px rgba(2,13,43,.25); font-size: 14px; line-height: 1.6; }
.cookie-banner h2 { font-size: 20px; line-height: 1.2; font-weight: 700; margin: 0 30px 10px 0; }
.cookie-banner p { margin: 0 0 18px; line-height: 1.6; }
.cookie-chiudi { position: absolute; top: 18px; right: 18px; width: 34px; height: 34px; border-radius: 50%; border: 0; background: #E9EEF2; color: var(--nero); font-size: 18px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.cookie-chiudi:hover { background: var(--azzurro); }
.cookie-preferenze { display: grid; gap: 10px; margin-bottom: 18px; }
.cookie-preferenze[hidden] { display: none; }
.cookie-voce { display: flex; align-items: center; justify-content: space-between; gap: 15px; background: #E9EEF2; border-radius: 14px; padding: 12px 16px; }
.cookie-voce input { width: 20px; height: 20px; flex: none; accent-color: var(--blu); }
.cookie-pulsanti { display: flex; flex-wrap: wrap; gap: 10px; }
/* Accetta e Rifiuta con lo stesso peso visivo, come chiede il Garante */
.cookie-btn { flex: 1 1 120px; font: 600 14px/1.5 var(--font); padding: 11px 18px; border-radius: 50px; border: 2px solid var(--blu); background: var(--blu); color: var(--bianco); cursor: pointer; transition: background .3s, border-color .3s; }
.cookie-btn:hover { background: var(--nero); border-color: var(--nero); }
.cookie-btn-testo { background: var(--bianco); color: var(--blu); }
.cookie-btn-testo:hover { background: var(--azzurro); border-color: var(--azzurro); color: var(--nero); }
.link-testo { background: none; border: 0; padding: 0; font: inherit; color: var(--blu); cursor: pointer; text-decoration: underline; }
@media (max-width: 767px) { .cookie-banner { left: 12px; bottom: 12px; width: calc(100% - 24px); padding: 24px 20px; } }
@media print { .cookie-banner { display: none !important; } }

/* ===================== PAGINE LEGALI ===================== */
.legale { padding: 100px 0; }
.legale-griglia { display: grid; grid-template-columns: 300px 1fr; gap: 70px; align-items: start; }
.legale-indice { position: sticky; top: 140px; background: #E9EEF2; border-radius: 20px; padding: 30px; }
.legale-indice p { font-weight: 700; color: var(--nero); margin-bottom: 12px; }
.legale-indice ol { margin: 0; padding-left: 20px; font-size: 14px; line-height: 1.5; }
.legale-indice li + li { margin-top: 8px; }
.legale-indice a { color: var(--testo); }
.legale-indice a:hover { color: var(--blu); }
.legale-testo { max-width: 860px; min-width: 0; overflow-wrap: anywhere; }
.legale-data { font-size: 14px; color: var(--viola); font-weight: 600; margin-bottom: 30px; }
.legale-testo section { scroll-margin-top: 140px; padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid #F2F4F6; }
.legale-testo section:last-child { border-bottom: 0; }
.legale-testo h2 { font-size: 28px; line-height: 1.25; margin-bottom: 18px; }
.legale-testo h3 { font-size: 18px; font-weight: 700; margin: 22px 0 10px; }
.legale-testo ul { list-style: disc; padding-left: 22px; margin: 0 0 15px; }
.legale-testo ul li { margin-bottom: 6px; line-height: 1.7; }
.legale-avviso { display: flex; gap: 12px; background: var(--rosa); border-radius: 15px; padding: 18px 20px; }
.legale-avviso i { font-size: 24px; color: #C01818; flex: none; }
.legale-tabella { overflow-x: auto; margin-bottom: 15px; }
.legale-tabella table { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 1.6; min-width: 560px; }
.legale-tabella th { background: #E9EDF0; color: var(--nero); font-weight: 600; text-align: left; padding: 12px 16px; border: 1px solid var(--bianco); }
.legale-tabella td { padding: 12px 16px; border: 1px solid #E9EDF0; vertical-align: top; }
.legale-tabella code { font-size: 13px; }
@media (max-width: 991px) {
  .legale { padding: 70px 0; }
  .legale-griglia { grid-template-columns: 1fr; gap: 40px; }
  .legale-indice { position: static; }
  .legale-testo h2 { font-size: 24px; }
}

/* ===================== BLOG (tema: blog-details con barra laterale) ===================== */
.blog { padding: 100px 0; }
.blog-griglia { display: grid; grid-template-columns: minmax(0, 856px) minmax(0, 416px); gap: 24px; justify-content: space-between; align-items: start; }
.articolo-copertina { height: 570px; border-radius: 20px; margin-bottom: 30px; }
.articolo-meta { flex-wrap: wrap; gap: 14px 34px; margin-bottom: 30px; }
.articolo-meta a { color: var(--viola); font-weight: 600; text-transform: uppercase; }
.articolo-meta a:hover { color: var(--blu); }
.articolo-pagina { min-width: 0; }
.articolo-testo { font-size: 16px; overflow-wrap: anywhere; }
.articolo-testo .articolo-attacco { font-size: 22px; line-height: 1.55; font-weight: 500; color: var(--nero); margin-bottom: 30px; }
.articolo-testo h2 { font-size: 30px; line-height: 1.25; margin: 40px 0 16px; }
.articolo-testo h3 { font-size: 22px; line-height: 1.3; margin: 30px 0 12px; }
.articolo-testo ul { list-style: disc; padding-left: 22px; margin: 0 0 18px; }
.articolo-testo li { margin-bottom: 8px; line-height: 1.7; }
.articolo-img { height: 428px; border-radius: 20px; margin: 30px 0; }
.articolo-img-coppia { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin: 30px 0; }
.articolo-img-coppia .ph { height: 298px; border-radius: 20px; }
.articolo-tabella { margin: 20px 0 25px; }
.articolo-invito { display: flex; align-items: center; justify-content: space-between; gap: 20px 30px; flex-wrap: wrap; background: var(--azzurro); border-radius: 20px; padding: 30px 35px; margin: 30px 0; }
.articolo-invito p { margin: 0; flex: 1 1 340px; font-size: 18px; line-height: 1.5; font-weight: 700; color: var(--nero); }
.articolo-nota { font-size: 14px; line-height: 1.7; font-style: italic; color: var(--testo); margin-bottom: 8px; }
.articolo-condividi { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; padding: 30px 0; margin-top: 30px; border-top: 1px solid #F2F4F6; border-bottom: 1px solid #F2F4F6; }
.articolo-condividi span { font-size: 14px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; color: var(--nero); }
.articolo-condividi ul { display: flex; gap: 10px; }
.articolo-condividi a { width: 40px; height: 40px; border-radius: 50%; background: #E9EEF2; color: var(--nero); font-size: 20px; display: flex; align-items: center; justify-content: center; transition: background .3s, color .3s; }
.articolo-condividi a:hover { background: var(--blu); color: var(--bianco); }
.articoli-vicini { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 40px; }
.articolo-vicino { display: flex; align-items: center; gap: 18px; color: var(--nero); }
.articolo-vicino.successivo { flex-direction: row-reverse; text-align: right; }
.articolo-vicino .ph { flex: none; width: 90px; height: 90px; border-radius: 15px; }
.vicino-etichetta { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--viola); margin-bottom: 6px; }
.successivo .vicino-etichetta { justify-content: flex-end; }
.vicino-etichetta i { font-size: 18px; }
.articolo-vicino b { font-size: 16px; line-height: 1.4; font-weight: 600; transition: color .3s; }
.articolo-vicino:hover b { color: var(--blu); }
.blog-laterale { display: grid; gap: 30px; position: sticky; top: 140px; }
.blog-cerca { position: relative; }
.blog-cerca input { width: 100%; font: 14px/1.5 var(--font); color: var(--nero); background: #E9EEF2; border: 1px solid #E9EEF2; border-radius: 50px; padding: 15px 60px 15px 22px; height: 55px; outline: none; }
.blog-cerca input:focus { border-color: var(--blu); }
.blog-cerca button { position: absolute; right: 6px; top: 6px; width: 43px; height: 43px; border-radius: 50%; border: 0; background: var(--blu); color: var(--bianco); font-size: 20px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.blog-widget { background: #E9EEF2; border-radius: 20px; padding: 35px 30px; }
.blog-widget h3 { font-size: 22px; line-height: 1.2; margin-bottom: 22px; }
.recente { display: flex; gap: 15px; align-items: center; }
.recente + .recente { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--bianco); }
.recente .ph { flex: none; width: 80px; height: 80px; border-radius: 15px; }
.recente span { display: block; font-size: 12.5px; letter-spacing: 1px; margin-bottom: 6px; }
.recente h4 { font-size: 15px; line-height: 1.4; font-weight: 600; }
.recente h4 a { color: var(--nero); }
.recente h4 a:hover { color: var(--blu); }
.categorie li + li { margin-top: 10px; }
.categorie a { display: flex; justify-content: space-between; align-items: center; background: var(--bianco); border-radius: 50px; padding: 12px 20px; color: var(--nero); font-weight: 500; }
.categorie a:hover { background: var(--blu); color: var(--bianco); }
.categorie span { font-size: 13px; color: var(--viola); }
.categorie a:hover span { color: var(--azzurro); }
.blog-elenco .titolo-sezione { margin-bottom: 30px; }
.blog-strumenti { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; margin-bottom: 40px; }
.blog-strumenti .calendario-filtri { margin: 0; justify-content: flex-start; }
.blog-strumenti .blog-cerca { flex: 0 1 380px; }
.blog-elenco .notizia { margin-bottom: 30px; }
.blog-vuoto { text-align: center; font-size: 18px; color: var(--nero); }
@media (max-width: 1199px) {
  .blog-griglia { grid-template-columns: minmax(0, 1fr); }
  .blog-laterale { position: static; grid-template-columns: 1fr 1fr; }
  .blog-laterale .blog-cerca { grid-column: 1 / -1; }
}
@media (max-width: 991px) {
  .blog { padding: 70px 0; }
  .articolo-copertina { height: 420px; }
}
@media (max-width: 767px) {
  .articolo-copertina { height: 240px; }
  .articolo-img { height: 200px; }
  .articolo-img-coppia { grid-template-columns: 1fr; }
  .articolo-img-coppia .ph { height: 200px; }
  .articolo-testo .articolo-attacco { font-size: 19px; }
  .articolo-testo h2 { font-size: 25px; }
  .articoli-vicini, .blog-laterale { grid-template-columns: 1fr; }
  .articolo-invito { padding: 25px 22px; }
}

/* ===================== INFOGRAFICA PDCA (Sistema qualità) ===================== */
.qualita-pdca { padding: 100px 0 0; }
.pdca-intro { max-width: 760px; margin: -20px auto 50px; text-align: center; font-size: 17px; }
.pdca { display: grid; grid-template-columns: 1fr 320px 1fr; grid-template-areas: "p centro d" "a centro c"; gap: 30px 40px; align-items: center; max-width: 1180px; margin: 0 auto; }
.pdca-p { grid-area: p; } .pdca-d { grid-area: d; } .pdca-c { grid-area: c; } .pdca-a { grid-area: a; }
.pdca-centro { grid-area: centro; }
.pdca-ruota { width: 100%; height: auto; display: block; }
.pdca-passo { display: flex; gap: 20px; align-items: flex-start; background: #E9EEF2; border-radius: 20px; padding: 28px 30px; border-top: 5px solid var(--colore); }
.pdca-lettera { flex: none; width: 52px; height: 52px; border-radius: 15px; background: var(--colore); color: var(--bianco); font-size: 26px; font-weight: 800; display: flex; align-items: center; justify-content: center; }
.pdca-passo h3 { display: flex; align-items: center; gap: 8px; font-size: 21px; font-weight: 700; margin-bottom: 8px; }
.pdca-passo h3 i { color: var(--colore); font-size: 24px; }
.pdca-passo p { margin: 0; line-height: 1.6; }
@media (max-width: 991px) {
  .qualita-pdca { padding-top: 70px; }
  .pdca { grid-template-columns: 1fr; grid-template-areas: "centro" "p" "d" "c" "a"; }
  .pdca-centro { max-width: 280px; margin: 0 auto; }
}

/* passi dell'iscrizione all'Area medici (infografica) */
.passi-mini { list-style: none; margin: 0 0 28px; padding: 0; position: relative; }
.passi-mini::before { content: ""; position: absolute; left: 25px; top: 30px; bottom: 30px; border-left: 2px dashed var(--blu); opacity: .45; }
.passi-mini li { position: relative; display: flex; align-items: center; gap: 18px; }
.passi-mini li + li { margin-top: 16px; }
.passo-num { flex: none; width: 52px; height: 52px; border-radius: 50%; background: var(--bianco); color: var(--blu); font-size: 25px; display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 18px rgba(0,115,194,.15); position: relative; z-index: 1; }
.passi-mini b { display: block; color: var(--nero); font-size: 17px; }
.passi-mini div { line-height: 1.5; }

/* linea del tempo della Storia (infografica) */
.storia-tappe { padding-top: 100px; }
.linea-tempo { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(8, 1fr); position: relative; }
.linea-tempo::before { content: ""; position: absolute; left: 6%; right: 6%; top: 52px; height: 4px; border-radius: 4px; background: linear-gradient(90deg, var(--azzurro), var(--blu)); }
.linea-tempo a { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; padding: 0 6px; color: var(--testo); }
.tappa-anno { font-size: 24px; font-weight: 800; color: var(--nero); line-height: 1; height: 30px; display: flex; align-items: flex-end; }
.tappa-punto { width: 22px; height: 22px; border-radius: 50%; background: var(--bianco); border: 5px solid var(--blu); position: relative; z-index: 1; transition: transform .3s, background .3s; }
.tappa-testo { font-size: 14px; line-height: 1.4; font-weight: 500; }
.linea-tempo a:hover .tappa-punto { transform: scale(1.25); background: var(--corallo); }
.linea-tempo a:hover .tappa-testo { color: var(--blu); }
.storia-blocco { scroll-margin-top: 110px; }
@media (max-width: 991px) {
  .storia-tappe { padding-top: 70px; }
  .linea-tempo { grid-template-columns: 1fr; gap: 14px; padding-left: 4px; }
  .linea-tempo::before { left: 13px; right: auto; top: 10px; bottom: 10px; width: 4px; height: auto; background: linear-gradient(180deg, var(--azzurro), var(--blu)); }
  .linea-tempo a { flex-direction: row; text-align: left; gap: 14px; }
  .tappa-punto { order: -1; flex: none; }
  .tappa-anno { font-size: 20px; height: auto; width: 52px; flex: none; }
}

/* foto degli articoli (Firefly) al posto dei segnaposto: stesse misure */
.notizia-foto img { width: 100%; height: 276px; object-fit: cover; border-radius: 20px; display: block; }
.articolo-foto img { width: 100%; height: 424px; object-fit: cover; border-radius: 20px; display: block; }
img.articolo-copertina { width: 100%; object-fit: cover; display: block; }
.recente-foto { flex: none; display: block; }
.recente-foto img { width: 80px; height: 80px; border-radius: 15px; object-fit: cover; }
.vicino-foto { flex: none; width: 90px; height: 90px; border-radius: 15px; object-fit: cover; }
.notizia-foto img, .articolo-foto img, .recente-foto img, .vicino-foto { transition: transform .5s; }
.notizia:hover .notizia-foto img, .articolo:hover .articolo-foto img { transform: scale(1.03); }
.notizia-foto, .articolo-foto { overflow: hidden; border-radius: 20px; }
@media (max-width: 767px) {
  .articolo-foto img { height: auto; aspect-ratio: 3 / 2; }
  .notizia-foto img { height: auto; aspect-ratio: 3 / 2; }
}

/* foto interne degli articoli */
img.articolo-img { width: 100%; height: auto; aspect-ratio: 2 / 1; object-fit: cover; border-radius: 20px; display: block; margin: 30px 0; }
.articolo-img-coppia img { width: 100%; height: 298px; object-fit: cover; border-radius: 20px; display: block; }
@media (max-width: 767px) { .articolo-img-coppia img { height: auto; aspect-ratio: 7 / 5; } }

/* foto della home (Firefly) */
.foto-formazione { width: 100%; height: 382px; object-fit: cover; border-radius: 20px; display: block; }
.colonna-sx > .foto-formazione { margin-bottom: 24px; }
.foto-prevenzione { width: 100%; height: 100%; min-height: 863px; object-fit: cover; border-radius: 20px; display: block; }
@media (max-width: 767px) { .foto-formazione { height: auto; aspect-ratio: 5 / 3; } .foto-prevenzione { min-height: 0; height: auto; aspect-ratio: 1340 / 1726; } }

/* ritratti del personale (foto 21.09.2026) e iniziali per chi non ha ancora la foto */
.persona .ritratto, .persona .ritratto-iniziali { display: block; width: 100%; height: 493px; border-radius: 20px; object-fit: cover; object-position: 50% 30%; }
.membro .ritratto, .membro .ritratto-iniziali { display: block; width: 100%; height: 362px; border-radius: 20px; object-fit: cover; object-position: 50% 30%; }
.firma .ritratto { flex: none; width: 100px; height: 100px; border-radius: 50%; object-fit: cover; }
.ritratto-iniziali { display: flex !important; align-items: center; justify-content: center; background: linear-gradient(160deg, var(--azzurro) 0%, var(--lilla) 100%); color: var(--blu); }
.ritratto-iniziali span { font-size: 72px; font-weight: 700; letter-spacing: 3px; opacity: .8; }
.membro .ritratto-iniziali { align-items: flex-start; padding-top: 95px; }
@media (max-width: 1199px) { .persona .ritratto, .persona .ritratto-iniziali { height: 400px; } }
@media (max-width: 767px) { .persona .ritratto, .persona .ritratto-iniziali { height: auto; aspect-ratio: 416 / 493; } .persona .ritratto-iniziali span { font-size: 56px; } }

/* foto dello staff accanto agli orari (home) */
.orari .foto-orari { display: block; width: 586px; height: 541px; margin-left: 50px; border-radius: 30px; object-fit: cover; object-position: 50% 40%; }
@media (max-width: 1399px) { .orari .foto-orari { width: 100%; height: auto; aspect-ratio: 586 / 541; margin-left: 0; } }

/* home, quattro riquadri: stessa altezza, link "Scopri di più" allineato in basso */
.riquadri-griglia .riquadro { align-self: stretch; display: flex; flex-direction: column; }
.riquadri-griglia .riquadro .link-freccia { margin-top: auto; }