/* =====================================================================
   Revisione grafica — 29 luglio 2026

   Foglio statico caricato DOPO il bundle di Vite (il <link> sta in
   resources/views/layouts/app.blade.php, subito sotto @vite): senza Node
   in produzione il bundle non e' ricompilabile, quindi le modifiche
   vivono qui. A parita' di peso vince l'ultimo foglio, percio' qui non
   serve !important ne' il trucco di partire da "html" usato in
   aic-prova-kicker.css, che invece viene stampato prima.

   Al prossimo build in locale queste regole vanno spostate dentro
   resources/css/app.css e questo file (con il suo <link>) eliminato.

   Attenzione alle media query: le regole di app.css dentro @media hanno
   lo stesso peso delle mie fuori da @media, ma vengono prima, quindi
   perdono. Dove app.css cambia una proprieta' a 980/1080px e io tocco la
   stessa proprieta', la media query va ripetuta anche qui.
   ===================================================================== */


/* ============================================================ HEADER */

.header .wrap { min-height: 74px; gap: 18px; }

/* Il logo si schiacciava a certe larghezze: .brand e' un flex item che
   puo' restringersi e l'immagine ha max-width:100% senza height:auto,
   quindi si deformava invece di mantenere le proporzioni. */
.brand { flex: 0 0 auto; }
.brand .logo { max-width: none; object-fit: contain; }
.nav { min-width: 0; }

/* Menu piu' compatto: carattere piu' piccolo e voci piu' vicine. */
.nav { gap: 0; }
.nav > a,
.nav .has-menu > a { font-size: 13.5px; padding: 9px 9px; }

/* Pulsanti dell'header piu' bassi e un filo piu' stretti. */
.header .cta { gap: 16px; }
.header .cta .btn { padding: 10px 20px; font-size: 14px; }

/* "Contatti" non e' piu' un pulsante ma una voce di menu. */
.header .voce {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--ink-soft);
  padding: 9px 2px;
  transition: color .2s;
}
.header .voce:hover { color: var(--accent); }

@media (max-width: 1080px) {
  /* stessa sorte di .nav: sotto i 1080px comanda il menu mobile */
  .header .voce { display: none; }
}


/* ====================================================== HERO: BAGLIORE */

/* Il pulsante principale si illumina ogni tanto, da sinistra a destra. */
.hero .actions .btn-gold { position: relative; overflow: hidden; }
.hero .actions .btn-gold::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(105deg,
    rgba(255, 246, 214, 0) 34%,
    rgba(255, 246, 214, .70) 47%,
    rgba(255, 255, 255, .55) 55%,
    rgba(255, 246, 214, 0) 68%);
  transform: translateX(-130%);
  animation: aic-bagliore 6s cubic-bezier(.4, 0, .2, 1) infinite;
}

@keyframes aic-bagliore {
  0%, 58% { transform: translateX(-130%); }
  86%, 100% { transform: translateX(130%); }
}


/* ============================================== FASCIA NUMERI (STATS) */

/* Padding verticale dimezzato: era clamp(48px, 7vw, 84px). */
.stats-band { padding-block: clamp(24px, 3.5vw, 42px); }


/* ================================================= PERCORSI FORMATIVI */

.creds .percentuali {
  margin-top: 16px;
  color: var(--ink-soft);
  font-size: 16.5px;
}
.creds .percentuali strong { color: var(--accent); font-weight: 700; }


/* ============================================================ BLOCCO IUL */

/* Logo a un terzo, testo a due terzi. */
.feature .grid { grid-template-columns: 1fr 2fr; }
.feature .media.plain { padding: 16px; }
.feature .media.plain img { max-width: 100%; }

@media (max-width: 980px) {
  .feature .grid { grid-template-columns: 1fr; }
  .feature .media.plain img { max-width: 320px; margin-inline: auto; }
}


/* ========================================================== CAROSELLI */

/* Le strisce di loghi partner scorrono come su Pisa. Senza JavaScript
   restano comunque sfogliabili: il carosello e' uno scroll con snap. */
.partner-strip.carosello { display: block; padding-block: clamp(18px, 2.5vw, 28px); }

.carosello .cs-track {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.carosello .cs-track::-webkit-scrollbar { display: none; }

.carosello .cs-slide {
  flex: 0 0 100%;
  scroll-snap-align: center;
  display: grid;
  place-items: center;
}
.carosello .cs-slide img { width: 100%; height: auto; }

.carosello .cs-dots {
  display: flex;
  justify-content: center;
  gap: 9px;
  margin-top: 16px;
}
.carosello .cs-dots button {
  width: 9px;
  height: 9px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--line);
  cursor: pointer;
  transition: background .2s, transform .2s;
}
.carosello .cs-dots button.on { background: var(--accent); transform: scale(1.25); }


/* ============================================ SCHEDE CORSO E SPEC. */

/* Immagine intera nel rapporto giusto (i file sono 800x415, praticamente
   16/9: cosi' non si taglia niente di significativo). */
.course .thumb,
.spec .thumb { aspect-ratio: 16/9; }

/* Il link diventa un pulsante in evidenza. */
.course .foot,
.spec .foot { padding-top: 22px; }
.course .foot .btn,
.spec .foot .btn {
  width: 100%;
  justify-content: center;
  padding: 13px 20px;
  font-size: 14.5px;
}


/* ============================================ CTA "CORSO SU MISURA" */

.custom-cta {
  background: linear-gradient(115deg,
    var(--terra-deep) 0%,
    var(--terra) 40%,
    var(--accent-2) 100%);
  background-size: 220% 100%;
  animation: aic-onda 14s ease-in-out infinite;
  box-shadow: 0 30px 64px -44px rgba(138, 51, 36, .85);
}
.custom-cta .ct p { color: rgba(255, 246, 232, .92); }

/* Pulsante chiaro: si stacca da entrambi i capi del gradiente. */
.custom-cta .btn-gold {
  background: #fff6e5;
  color: var(--terra-deep);
  animation: aic-pulsa 2.8s ease-out infinite;
}
.custom-cta .btn-gold:hover { background: #fff; }

@keyframes aic-onda {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

@keyframes aic-pulsa {
  0% { box-shadow: 0 0 0 0 rgba(255, 241, 204, .6); }
  70% { box-shadow: 0 0 0 15px rgba(255, 241, 204, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 241, 204, 0); }
}


/* =============================================== BLOCCO "CHI SIAMO" */

.about-foto {
  border-radius: 6px;
  overflow: hidden;
  aspect-ratio: 16/9;
  margin-bottom: 30px;
  box-shadow: 0 34px 66px -48px rgba(34, 26, 18, .9);
}
.about-foto img { width: 100%; height: 100%; object-fit: cover; }


/* ======================================================= TESTIMONIANZE */

/* Foto dell'allievo del 50% piu' grande (da 50 a 75px). */
.tcard .av { width: 75px; height: 75px; }

/* Le virgolette adesso chiudono anche la citazione. */
.tcard .chiusura {
  display: block;
  margin-top: 10px;
  font-family: var(--display);
  font-size: 46px;
  line-height: .1;
  height: 18px;
  text-align: right;
  color: var(--accent-2);
}


/* ==================================================== CTA FINALE */

.final { text-align: left; }
.final-card {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 46px 96px -54px rgba(0, 0, 0, .85);
}

.final-foto {
  min-height: 400px;
  background-size: cover;
  background-position: center;
}

.final-testo {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(34px, 4.6vw, 66px);
  background: linear-gradient(140deg, #a53c28 0%, var(--terra) 45%, var(--terra-deep) 100%);
  background-size: 160% 160%;
  animation: aic-onda 16s ease-in-out infinite;
}
.final-testo h2 {
  margin-top: 18px;
  margin-inline: 0;
  max-width: 15ch;
  font-size: clamp(32px, 4.2vw, 54px);
  color: #fff6e5;
}
.final-testo h2 em { color: var(--gold-soft); font-style: italic; }
.final-testo .sub { margin-top: 16px; color: rgba(255, 246, 229, .88); }
.final-testo .actions { justify-content: flex-start; margin-top: 30px; }

@media (max-width: 900px) {
  .final-card { grid-template-columns: 1fr; }
  .final-foto { min-height: 230px; }
}


/* ================================================== TORNA IN CIMA */

.to-top {
  position: fixed;
  left: clamp(14px, 2vw, 30px);
  bottom: clamp(14px, 2vw, 30px);
  z-index: 80;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  padding: 0;
  border: 1px solid rgba(215, 184, 120, .4);
  border-radius: 50%;
  background: var(--teal);
  color: var(--gold-soft);
  cursor: pointer;
  box-shadow: 0 20px 38px -22px rgba(34, 26, 18, .95);
  opacity: 0;
  visibility: hidden;
  transform: translateY(14px);
  transition: opacity .3s, transform .3s, visibility .3s, background .2s, color .2s;
}
.to-top.visibile { opacity: 1; visibility: visible; transform: none; }
.to-top:hover { background: var(--accent-2); color: var(--espresso); border-color: var(--accent-2); }
.to-top svg { width: 18px; height: 18px; }


/* ============================================================ FOOTER */

/* Cappello dello chef accanto al nome della sede: stessa sagoma della
   favicon usata in aic-prova-kicker.css, qui in versione maschera cosi'
   il colore lo decide background-color. */
.footer .sedi a { display: flex; align-items: center; gap: 8px; }
.footer .sedi a::before {
  content: "";
  flex: none;
  width: 15px;
  height: 15px;
  background-color: var(--gold-soft);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='6.4' r='3.9'/%3E%3Ccircle cx='6.5' cy='8.6' r='3.3'/%3E%3Ccircle cx='17.5' cy='8.6' r='3.3'/%3E%3Crect x='6' y='8' width='12' height='7.1' rx='0.5'/%3E%3Crect x='5.7' y='16.6' width='12.6' height='5' rx='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='6.4' r='3.9'/%3E%3Ccircle cx='6.5' cy='8.6' r='3.3'/%3E%3Ccircle cx='17.5' cy='8.6' r='3.3'/%3E%3Crect x='6' y='8' width='12' height='7.1' rx='0.5'/%3E%3Crect x='5.7' y='16.6' width='12.6' height='5' rx='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
  opacity: .85;
  transition: background-color .2s;
}
.footer .sedi a:hover::before { background-color: #fff; }

.footer .bottom { align-items: center; }
.footer .bottom .legale { max-width: 62ch; }
.footer .bottom .coda { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.footer .bottom .socials { margin-top: 0; }
.footer .bottom .socials a { width: 30px; height: 30px; }
.footer .bottom .socials svg { width: 13px; height: 13px; }


/* ============================================== MOVIMENTO RIDOTTO */

/* Chi ha chiesto meno animazioni al sistema operativo non le vede. */
@media (prefers-reduced-motion: reduce) {
  .hero .actions .btn-gold::after,
  .custom-cta,
  .custom-cta .btn-gold,
  .final-testo { animation: none; }
  .hero .actions .btn-gold::after { opacity: 0; }
  .carosello .cs-track { scroll-behavior: auto; }
}


/* ====================================================== NEWS ED EVENTI */

.sezioni-rete { background: var(--alt); }

.cat-btns { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.cat-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 22px 26px;
  border-radius: 5px;
  font-family: var(--body);
  font-weight: 700;
  font-size: 16px;
  line-height: 1.25;
  color: #fff6e5;
  box-shadow: 0 26px 48px -36px rgba(34, 26, 18, .9);
  transition: transform .25s, filter .2s;
}
.cat-btn:hover { transform: translateY(-4px); filter: brightness(1.07); }
.cat-btn .arr { transition: transform .25s; }
.cat-btn:hover .arr { transform: translateX(4px); }

.cat-btn.terra { background: linear-gradient(120deg, #a53c28, var(--terra-deep)); }
.cat-btn.oro { background: linear-gradient(120deg, #cf9c33, var(--accent-2)); color: var(--espresso); }
.cat-btn.oliva { background: linear-gradient(120deg, #6f8046, var(--olive)); }

.news-elenco { background: var(--cream); }
.news-altri { background: var(--alt); border-top: 1px solid var(--line-soft); }
.news-altri .section-cta { margin-top: 30px; text-align: center; }

@media (max-width: 900px) {
  .cat-btns { grid-template-columns: 1fr; }
}


/* ========================================================== LA SCUOLA */

.galleria-sede { background: var(--alt); }
.galleria {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.galleria figure {
  margin: 0;
  border-radius: 5px;
  overflow: hidden;
  aspect-ratio: 4/3;
  background: var(--cream-2);
}
.galleria img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s cubic-bezier(.2, .7, .3, 1);
}
.galleria figure:hover img { transform: scale(1.05); }

.altre-sedi {
  margin-top: 26px;
  text-align: center;
  font-size: 14px;
  letter-spacing: .04em;
  color: var(--ink-faint);
}
.altre-sedi a { font-weight: 700; color: var(--ink-soft); }
.altre-sedi a:hover { color: var(--accent); }
.altre-sedi .sep { color: var(--accent-2); }

/* la coccarda dei 15 anni */
.coccarda-band { background: var(--teal); color: #eef3f2; }
.coccarda {
  display: grid;
  grid-template-columns: 190px 1fr;
  align-items: center;
  gap: clamp(24px, 4vw, 52px);
}
.coccarda img { width: 100%; height: auto; }
.coccarda h2 { color: #fbf4e6; font-size: clamp(28px, 3.6vw, 44px); }
.coccarda p { margin-top: 16px; color: rgba(238, 243, 242, .82); max-width: 60ch; }

/* i tre fattori di qualita' */
.fattori { background: var(--cream); }
.fattori .cred .numero {
  font-family: var(--display);
  font-size: 46px;
  font-weight: 700;
  line-height: 1;
  color: var(--accent-2);
  margin-bottom: 14px;
}

/* i numeri che salgono */
.numeri-band { background: var(--espresso); color: #f3e9d8; }
.numeri-band h2 { color: #fbf4e6; }
.numeri {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1px;
  background: rgba(215, 184, 120, .22);
  border-radius: 4px;
  overflow: hidden;
}
.numero-voce { background: var(--espresso); padding: clamp(24px, 3vw, 36px) 16px; text-align: center; }
.numero-voce .n {
  font-family: var(--display);
  font-size: clamp(30px, 3.4vw, 44px);
  font-weight: 700;
  line-height: 1;
  color: var(--gold-soft);
}
.numero-voce .l { margin-top: 10px; font-size: 13.5px; color: rgba(243, 233, 216, .8); }

/* la citazione del comitato scientifico */
.citazione-band { background: var(--alt); }
.citazione {
  margin: 0;
  border-left: 3px solid var(--accent-2);
  padding-left: clamp(22px, 3vw, 40px);
  max-width: 78ch;
}
.citazione h2 { font-size: clamp(26px, 3.2vw, 40px); }
.citazione p {
  margin-top: 20px;
  font-family: var(--display);
  font-size: clamp(19px, 2.2vw, 24px);
  font-style: italic;
  color: var(--ink-soft);
}
.citazione cite {
  display: block;
  margin-top: 18px;
  font-family: var(--body);
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--accent);
}

/* i due percorsi */
.percorsi { background: var(--cream); }
.percorsi-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.via {
  display: flex;
  flex-direction: column;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: clamp(28px, 3.4vw, 44px);
  transition: transform .3s, box-shadow .3s, border-color .3s;
}
.via:hover {
  transform: translateY(-6px);
  border-color: var(--accent-2);
  box-shadow: 0 36px 64px -44px rgba(34, 26, 18, .55);
}
.via h3 { font-size: clamp(24px, 2.6vw, 32px); }
.via p { margin-top: 14px; color: var(--ink-soft); }
/* i pulsanti restano allineati fra loro anche se i testi hanno righe diverse */
.via .btn { margin-top: auto; align-self: flex-start; margin-top: 26px; }

@media (max-width: 980px) {
  .galleria { grid-template-columns: repeat(2, 1fr); }
  .numeri { grid-template-columns: repeat(2, 1fr); }
  .percorsi-grid { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .galleria { grid-template-columns: 1fr; }
  .coccarda { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .coccarda img { max-width: 170px; }
  .numeri { grid-template-columns: 1fr; }
}

.foto-gruppo { background: var(--teal-2); }
.foto-gruppo img { width: 100%; height: auto; max-height: 460px; object-fit: cover; }


/* ================================================== CALENDARIO CORSI */

.gia-iniziati {
  margin-bottom: 26px;
  padding: 14px 20px;
  border: 1px dashed var(--line);
  border-radius: 4px;
  background: var(--cream-2);
  font-size: 15px;
  color: var(--ink-soft);
}
.gia-iniziati a { font-weight: 700; color: var(--accent); }
.gia-iniziati a:hover { color: var(--accent-deep); }

.cal-lista { display: grid; gap: 18px; }

.cal-scheda {
  display: grid;
  grid-template-columns: 264px 1fr;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 5px;
  overflow: hidden;
  transition: transform .3s, border-color .3s, box-shadow .3s;
}
.cal-scheda:hover {
  transform: translateY(-4px);
  border-color: var(--accent-2);
  box-shadow: 0 34px 62px -46px rgba(34, 26, 18, .6);
}

.cal-foto { position: relative; background: var(--cream-2); min-height: 200px; }
.cal-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.cal-corpo { padding: clamp(22px, 2.6vw, 32px); }
.cal-corpo h3 { font-size: clamp(22px, 2.4vw, 29px); }

.cal-scheda .etichetta {
  display: block;
  font-family: var(--body);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-faint);
}

.cal-dati {
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 26px;
  font-size: 14.5px;
  color: var(--ink-soft);
}
.cal-dati li span {
  display: block;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-faint);
  margin-bottom: 2px;
}

.cal-date {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 14px;
}
.cal-date .prossima .valore {
  font-family: var(--display);
  font-size: 26px;
  font-weight: 700;
  line-height: 1.1;
  color: var(--accent);
}
.cal-date .prossima .valore.attesa { font-size: 21px; font-style: italic; color: var(--ink-faint); }
.cal-date .prossima .posti {
  margin-left: 10px;
  font-family: var(--body);
  font-size: 13px;
  font-weight: 700;
  color: var(--olive);
}
.cal-date .prossima .posti.esaurito { color: var(--accent); }

.cal-date .successive ul {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.cal-date .successive li {
  border: 1px solid var(--line);
  border-radius: 100px;
  padding: 6px 14px;
  background: var(--cream);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink-soft);
}
.cal-date .successive li.esaurito { opacity: .6; }
.cal-date .successive li .posti {
  margin-left: 8px;
  font-size: 12px;
  font-weight: 700;
  color: var(--accent);
}

.cal-date .lezioni { font-size: 14.5px; color: var(--ink-soft); }

.cal-azioni { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 12px; }
.cal-azioni .btn { padding: 12px 22px; font-size: 14px; }

@media (max-width: 860px) {
  .cal-scheda { grid-template-columns: 1fr; }
  .cal-foto { min-height: 0; aspect-ratio: 16/9; }
}

/* ====================================================== TEAM BUILDING */

/* i plus, chiari su fondo scuro */
.plus-band { background: var(--teal); color: #eef3f2; }
.plus-band h2 { color: #fbf4e6; }
.plus-band .lead { color: rgba(238, 243, 242, .82); }
.plus-lista {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.plus-lista li {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  border: 1px solid rgba(215, 184, 120, .28);
  border-radius: 4px;
  background: rgba(255, 255, 255, .04);
  font-size: 15px;
}
.plus-lista li::before {
  content: "";
  flex: none;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--gold-soft);
}
.plus-band .section-cta { margin-top: 30px; }

/* i format gia' realizzati, due per riga */
.format-team { background: var(--alt); }
.format-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.format {
  display: flex;
  flex-direction: column;
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: 5px;
  overflow: hidden;
  transition: transform .3s, border-color .3s, box-shadow .3s;
}
.format:hover {
  transform: translateY(-5px);
  border-color: var(--accent-2);
  box-shadow: 0 36px 64px -44px rgba(34, 26, 18, .55);
}
.format .thumb { position: relative; aspect-ratio: 16/9; }
.format .thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.format .thumb .tag {
  position: absolute;
  top: 14px;
  left: 14px;
  padding: 6px 11px;
  border-radius: 2px;
  background: var(--accent);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.format .body { padding: 26px 26px 28px; display: flex; flex-direction: column; flex: 1; }
.format h3 { font-size: clamp(21px, 2.2vw, 26px); }
.format p { margin-top: 12px; color: var(--ink-soft); font-size: 15.5px; }
.format .riga-durata {
  margin-top: auto;
  padding-top: 18px;
  border-top: 1px solid var(--line);
  font-size: 14px;
  color: var(--ink-soft);
}
.format .riga-durata span {
  display: block;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-faint);
  margin-bottom: 2px;
}
.nota-format { margin-top: 26px; text-align: center; color: var(--ink-soft); }

/* i modi per metterci in contatto */
.contatto-rapido { background: var(--cream); }
.contatto-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; }
.contatto {
  display: grid;
  justify-items: center;
  gap: 6px;
  padding: clamp(26px, 3vw, 38px) 24px;
  border-radius: 6px;
  text-align: center;
  color: #fff6e5;
  transition: transform .25s, filter .2s;
}
.contatto:hover { transform: translateY(-4px); filter: brightness(1.06); }
.contatto svg { width: 30px; height: 30px; margin-bottom: 6px; }
.contatto .tit { font-family: var(--display); font-size: 24px; font-weight: 700; line-height: 1.15; }
.contatto .sub { font-size: 13.5px; opacity: .82; }
.contatto.whatsapp { background: linear-gradient(130deg, #35a862, #1f7a45); }
.contatto.chiama { background: linear-gradient(130deg, #a53c28, var(--terra-deep)); }
.contatto.modulo { background: linear-gradient(130deg, var(--espresso-2), var(--espresso)); }

@media (max-width: 980px) {
  .plus-lista { grid-template-columns: repeat(2, 1fr); }
  .format-grid { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .plus-lista { grid-template-columns: 1fr; }
}

/* =================================================== ENTE DI FORMAZIONE */

.riga-testo { padding-block: clamp(38px, 5vw, 66px); }
.riga-testo.chiara { background: var(--alt); }
.riga-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  align-items: center;
  gap: clamp(28px, 4vw, 62px);
}
/* a righe alterne la foto passa a sinistra */
.riga-testo.invertita .riga-grid { grid-template-columns: 1fr 1.2fr; }
.riga-testo.invertita .prose { order: 2; }
.riga-testo.invertita .riga-media { order: 1; }

.riga-media { border-radius: 6px; overflow: hidden; aspect-ratio: 4/3; }
.riga-media img { width: 100%; height: 100%; object-fit: cover; }

.sedi-bottoni {
  margin-top: clamp(26px, 3vw, 38px);
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.sedi-bottoni .btn { padding: 11px 20px; font-size: 14px; }

@media (max-width: 900px) {
  .riga-grid,
  .riga-testo.invertita .riga-grid { grid-template-columns: 1fr; }
  .riga-testo.invertita .prose { order: 2; }
  .riga-testo.invertita .riga-media { order: 1; }
}

/* ============================================ HEADER: LARGHEZZE STRETTE */

/* Il menu desktop e' largo: logo + sei voci + Contatti + pulsante non
   stanno sotto i ~1200px. Prima ci stavano solo perche' il logo si
   schiacciava (era il difetto segnalato), quindi il punto di passaggio al
   menu mobile sale da 1080 a 1200px e le regole del burger vanno ripetute
   qui, altrimenti fra 1080 e 1200 non resterebbe nessun menu. */
@media (max-width: 1200px) {
  .nav,
  .header .voce,
  .header .cta .btn-ghost { display: none; }
  .header .cta { margin-left: auto; }

  .burger {
    display: grid;
    gap: 5px;
    padding: 10px;
    background: none;
    border: none;
    cursor: pointer;
  }
  .burger span {
    display: block;
    width: 26px;
    height: 2px;
    background: var(--ink);
    transition: transform .25s, opacity .2s;
  }
  .header.nav-open .burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .header.nav-open .burger span:nth-child(2) { opacity: 0; }
  .header.nav-open .burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
}

/* Poco sopra la soglia il menu ci sta, ma stretto: logo e voci si
   rimpiccioliscono insieme, cosi' il logo mantiene le proporzioni. */
@media (min-width: 1201px) and (max-width: 1440px) {
  .header .wrap { gap: 12px; }
  .brand .logo { height: 42px; }
  .nav > a,
  .nav .has-menu > a { padding: 9px 6px; font-size: 13px; }
  .header .cta { gap: 12px; }
  .header .cta .btn { padding: 9px 16px; font-size: 13.5px; }
}


/* ========================================================== IL METODO */

/* Entrata in scena allo scroll: la classe .anima la mette il JS (cosi'
   senza JavaScript nulla resta nascosto), .in-vista arriva quando il
   blocco entra nello schermo. I figli si presentano uno alla volta. */
[data-scena].anima > * {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .6s ease, transform .65s cubic-bezier(.2, .7, .3, 1);
}
[data-scena].anima.in-vista > * { opacity: 1; transform: none; }
[data-scena].anima > :nth-child(2) { transition-delay: .1s; }
[data-scena].anima > :nth-child(3) { transition-delay: .2s; }
[data-scena].anima > :nth-child(4) { transition-delay: .3s; }
[data-scena].anima > :nth-child(5) { transition-delay: .4s; }
[data-scena].anima > :nth-child(6) { transition-delay: .5s; }

/* la citazione della norma, chiara su fondo scuro */
.metodo-citazione {
  background: linear-gradient(120deg, var(--teal-2) 0%, var(--teal) 55%, #24393a 100%);
  background-size: 180% 180%;
  animation: aic-onda 18s ease-in-out infinite;
  color: #eef3f2;
  padding-block: clamp(46px, 6vw, 84px);
  position: relative;
  overflow: hidden;
}
.metodo-citazione::before {
  content: "\201C";
  position: absolute;
  top: -40px;
  left: 4%;
  font-family: var(--display);
  font-size: clamp(200px, 30vw, 380px);
  line-height: 1;
  color: rgba(215, 184, 120, .16);
  pointer-events: none;
}
.metodo-citazione blockquote { margin: 0; max-width: 26ch; margin-inline: auto; text-align: center; }
.metodo-citazione p {
  font-family: var(--display);
  font-size: clamp(26px, 3.6vw, 44px);
  font-style: italic;
  font-weight: 600;
  line-height: 1.2;
  color: #fbf4e6;
}
.metodo-citazione cite {
  display: block;
  margin-top: 20px;
  font-family: var(--body);
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold-soft);
}

/* i quattro elementi, ognuno con la sua tinta */
.elementi { background: var(--alt); }
.elementi-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }

.elemento {
  --tinta: var(--terra);
  position: relative;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 30px 26px 32px;
  overflow: hidden;
  transition: transform .3s, box-shadow .3s, border-color .3s;
}
.elemento:nth-child(2) { --tinta: var(--gold); }
.elemento:nth-child(3) { --tinta: var(--olive); }
.elemento:nth-child(4) { --tinta: var(--teal); }

/* filo colorato in alto che si allunga al passaggio */
.elemento::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 44px;
  height: 3px;
  background: var(--tinta);
  transition: width .45s cubic-bezier(.2, .7, .3, 1);
}
.elemento:hover { transform: translateY(-6px); border-color: var(--tinta); box-shadow: 0 34px 60px -44px rgba(34, 26, 18, .6); }
.elemento:hover::before { width: 100%; }

.elemento .ico {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 16px;
  background: color-mix(in srgb, var(--tinta) 12%, transparent);
  color: var(--tinta);
  transition: background .3s, color .3s, transform .35s cubic-bezier(.2, .7, .3, 1);
}
.elemento .ico svg { width: 26px; height: 26px; }
.elemento:hover .ico { background: var(--tinta); color: #fff; transform: rotate(-6deg) scale(1.07); }
.elemento h3 { margin-top: 18px; font-size: 24px; }
.elemento p { margin-top: 10px; font-size: 14.5px; color: var(--ink-soft); }

/* il mercato, in contrasto scuro */
.mercato-band { background: var(--espresso); color: #f3e9d8; }
.mercato-grid {
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  gap: clamp(28px, 4vw, 64px);
  align-items: start;
}
.mercato-band h2 { margin-top: 14px; color: #fbf4e6; font-size: clamp(28px, 3.4vw, 42px); }
.mercato-band p { color: rgba(243, 233, 216, .85); font-size: 16.5px; }
.mercato-band p + p { margin-top: 16px; }
.mercato-band strong { color: var(--gold-soft); }

/* le quattro tappe del percorso */
.metodo-fasi { background: var(--cream); }
.tappe-lista { display: grid; gap: clamp(40px, 6vw, 72px); margin-top: 10px; }

.tappa {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: clamp(26px, 4vw, 60px);
  align-items: center;
}
.tappa.invertita .tappa-media { order: 2; }
.tappa.invertita .tappa-corpo { order: 1; }

.tappa-media { position: relative; }
.tappa-media img {
  width: 100%;
  height: auto;
  aspect-ratio: 3/2;
  object-fit: cover;
  border-radius: 6px;
  box-shadow: 0 36px 70px -48px rgba(34, 26, 18, .85);
  transition: transform .5s cubic-bezier(.2, .7, .3, 1);
}
.tappa-media:hover img { transform: scale(1.03) rotate(.4deg); }

/* il numero gigante, appena accennato, che sborda dalla foto */
.tappa-numero {
  position: absolute;
  z-index: 2;
  top: -34px;
  left: -12px;
  font-family: var(--display);
  font-size: clamp(74px, 9vw, 120px);
  font-weight: 700;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1.5px var(--accent-2);
  opacity: .8;
  pointer-events: none;
}
.tappa.invertita .tappa-numero { left: auto; right: -12px; }

.tappa-chip {
  display: inline-block;
  padding: 6px 14px;
  border-radius: 100px;
  background: var(--accent);
  color: #fff;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.tappa:nth-child(2) .tappa-chip { background: var(--gold); color: var(--espresso); }
.tappa:nth-child(3) .tappa-chip { background: var(--olive); }
.tappa:nth-child(4) .tappa-chip { background: var(--teal); }

.tappa-corpo h3 { margin-top: 16px; font-size: clamp(26px, 3vw, 36px); }
.tappa-lead {
  margin-top: 12px;
  font-family: var(--display);
  font-size: clamp(18px, 2vw, 22px);
  font-style: italic;
  color: var(--accent);
}
.tappa-testo { margin-top: 14px; font-size: 15.5px; color: var(--ink-soft); }

/* i traguardi: barre che si riempiono quando entrano nello schermo */
.traguardi { margin-top: 24px; display: grid; gap: 14px; }
.traguardi .etichetta {
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-faint);
}
.traguardo .nome {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  font-size: 14.5px;
  font-weight: 600;
}
.traguardo .nome b { color: var(--accent); font-size: 13.5px; }
.traguardo .binario {
  display: block;
  margin-top: 7px;
  height: 9px;
  border-radius: 100px;
  background: var(--cream-2);
  border: 1px solid var(--line-soft);
  overflow: hidden;
}
.traguardo .binario i {
  display: block;
  height: 100%;
  width: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--gold) 0%, var(--gold-soft) 60%, var(--terra) 100%);
}
.tappa.anima .binario i { width: 0; transition: width 1.2s cubic-bezier(.2, .7, .3, 1); }
.tappa.anima.in-vista .binario i { width: 100%; }
.tappa.anima.in-vista .traguardo:nth-child(3) .binario i { transition-delay: .15s; }
.tappa.anima.in-vista .traguardo:nth-child(4) .binario i { transition-delay: .3s; }

@media (max-width: 980px) {
  .elementi-grid { grid-template-columns: repeat(2, 1fr); }
  .mercato-grid { grid-template-columns: 1fr; }
  .tappa { grid-template-columns: 1fr; }
  .tappa.invertita .tappa-media { order: 1; }
  .tappa.invertita .tappa-corpo { order: 2; }
  .tappa-numero { top: -28px; }
}

@media (max-width: 620px) {
  .elementi-grid { grid-template-columns: 1fr; }
}

/* ============================================================ OPINIONI */

/* il blocco dei numeri: caldo, in contrasto con il resto della pagina */
.opinioni-band {
  background: linear-gradient(125deg, var(--terra-deep) 0%, var(--terra) 42%, #b06a1f 100%);
  background-size: 200% 200%;
  animation: aic-onda 16s ease-in-out infinite;
  color: #fff6e5;
  padding-block: clamp(46px, 6vw, 84px);
  position: relative;
  overflow: hidden;
}
.opinioni-band::after {
  content: "\201D";
  position: absolute;
  right: 2%;
  bottom: -140px;
  font-family: var(--display);
  font-size: clamp(240px, 34vw, 420px);
  line-height: 1;
  color: rgba(255, 246, 229, .1);
  pointer-events: none;
}
.opinioni-testa { max-width: 78ch; }
.opinioni-testa h2 { color: #fff6e5; font-size: clamp(26px, 3.4vw, 42px); }
.opinioni-testa h2 em { color: var(--gold-soft); font-style: italic; }
.opinioni-testa p { margin-top: 16px; color: rgba(255, 246, 229, .88); font-size: 17px; }

.opinioni-numeri {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin-top: clamp(28px, 4vw, 44px);
  background: rgba(255, 246, 229, .25);
  border-radius: 5px;
  overflow: hidden;
}
.opinioni-numeri .numero-voce { background: rgba(80, 25, 14, .35); backdrop-filter: blur(2px); }
.opinioni-numeri .n { color: #fff; }
.opinioni-numeri .l { color: rgba(255, 246, 229, .85); }

/* l'elenco a colonne: altezze diverse, ritmo da bacheca */
.opinioni-elenco { background: var(--alt); }
.opinioni-colonne { columns: 3 300px; column-gap: 24px; }
.opinioni-colonne .tcard { break-inside: avoid; margin-bottom: 24px; }

/* iniziali al posto della foto, con le tinte della palette a rotazione */
.tcard .av.iniziali {
  font-family: var(--display);
  font-weight: 700;
  font-size: 20px;
  color: #fff;
  background: var(--terra);
}
.opinione:nth-child(4n+2) .av.iniziali { background: var(--gold); color: var(--espresso); }
.opinione:nth-child(4n+3) .av.iniziali { background: var(--olive); }
.opinione:nth-child(4n+4) .av.iniziali { background: var(--teal); }

.opinioni-pagine {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: clamp(30px, 4vw, 44px);
}
.opinioni-pagine a,
.opinioni-pagine .corrente,
.opinioni-pagine .puntini {
  display: grid;
  place-items: center;
  min-width: 42px;
  height: 42px;
  padding-inline: 8px;
  border: 1px solid var(--line);
  border-radius: 4px;
  font-weight: 600;
  font-size: 15px;
  transition: background .2s, color .2s, border-color .2s, transform .2s;
}
.opinioni-pagine a:hover { background: var(--accent); border-color: var(--accent); color: #fff; transform: translateY(-2px); }
.opinioni-pagine .corrente { background: var(--accent); border-color: var(--accent); color: #fff; }
.opinioni-pagine .puntini { border-color: transparent; color: var(--ink-faint); }
.opinioni-conteggio { margin-top: 14px; text-align: center; font-size: 13.5px; color: var(--ink-faint); }

@media (max-width: 700px) {
  .opinioni-numeri { grid-template-columns: 1fr; }
}

/* ================================================= HERO CON FOTO TENUE */

/* La foto c'e' ma sottovoce: resta il fondo scuro del tema e l'immagine
   affiora in trasparenza. La velatura di serie qui e' troppa: la foto e'
   gia' quasi spenta di suo. */
.hero.cpt-hero.tenue { background: var(--teal-2); }
.hero.cpt-hero.tenue .photo {
  opacity: .22;
  filter: saturate(.75);
}
.hero.cpt-hero.tenue .scrim {
  background: linear-gradient(100deg, rgba(18, 26, 28, .5) 0%, rgba(18, 26, 28, .1) 60%, rgba(18, 26, 28, 0) 100%);
}

/* ================================================== ELENCO DEI CORSI */

.elenco-prosa + .elenco-prosa { padding-top: 0; }
.corso-riga { padding-block: clamp(34px, 4.5vw, 60px); }
.corso-riga.chiara { background: var(--alt); }

.riga-corso {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: clamp(26px, 4vw, 60px);
  align-items: center;
}
.riga-corso.invertita .rc-media { order: 2; }
.riga-corso.invertita .rc-corpo { order: 1; }

.rc-media { position: relative; border-radius: 6px; overflow: hidden; aspect-ratio: 16/10; box-shadow: 0 34px 66px -48px rgba(34, 26, 18, .8); }
.rc-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s cubic-bezier(.2, .7, .3, 1); }
.riga-corso:hover .rc-media img { transform: scale(1.04); }
.rc-chip {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 2;
  padding: 6px 12px;
  border-radius: 2px;
  background: var(--accent);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.rc-corpo h2 { font-size: clamp(26px, 3.2vw, 40px); }
.rc-corpo p { margin-top: 14px; color: var(--ink-soft); font-size: 16px; }

.rc-dati {
  list-style: none;
  margin: 18px 0 0;
  padding: 14px 0 0;
  border-top: 1px solid var(--line);
  display: flex;
  flex-wrap: wrap;
  gap: 10px 28px;
  font-size: 14.5px;
  color: var(--ink);
  font-weight: 600;
}
.rc-dati li span {
  display: block;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--ink-faint);
  margin-bottom: 2px;
}

.rc-azioni { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.rc-azioni .btn { padding: 12px 22px; font-size: 14px; }

.custom-cta-solo { padding-block: clamp(34px, 5vw, 64px); background: var(--cream); }

@media (max-width: 900px) {
  .riga-corso { grid-template-columns: 1fr; }
  .riga-corso.invertita .rc-media { order: 1; }
  .riga-corso.invertita .rc-corpo { order: 2; }
}

/* ==================================== PAGINE CORSO: ENFASI E COLORE */

/* pulsanti dentro l'hero del corso */
.cpt-hero .actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 30px; }

/* la striscia dei dati in evidenza: una tinta per scheda */
.fact-strip .fact {
  --tinta: var(--terra);
  position: relative;
  border-top: 3px solid var(--tinta);
  transition: transform .3s, box-shadow .3s;
}
.fact-strip .fact:nth-child(2) { --tinta: var(--gold); }
.fact-strip .fact:nth-child(3) { --tinta: var(--olive); }
.fact-strip .fact:nth-child(4) { --tinta: var(--teal); }
.fact-strip .fact:hover { transform: translateY(-4px); box-shadow: 0 26px 48px -38px rgba(34, 26, 18, .6); }
.fact-strip .fact .lbl { color: var(--tinta); }

/* informazioni generali: icone con le tinte della palette */
.loc-row .ico {
  transition: background .3s, color .3s, transform .35s cubic-bezier(.2, .7, .3, 1);
}
/* la rotazione conta SOLO le righe-icona (nth-child "of"): un Text Block
   o una nota infilati fra le voci non spostano i colori */
.loc-rows > :nth-child(4n+1 of .loc-row) .ico { background: color-mix(in srgb, var(--terra) 12%, transparent); color: var(--terra); }
.loc-rows > :nth-child(4n+2 of .loc-row) .ico { background: color-mix(in srgb, var(--gold) 14%, transparent); color: var(--gold); }
.loc-rows > :nth-child(4n+3 of .loc-row) .ico { background: color-mix(in srgb, var(--olive) 12%, transparent); color: var(--olive); }
.loc-rows > :nth-child(4n+4 of .loc-row) .ico { background: color-mix(in srgb, var(--teal) 12%, transparent); color: var(--teal); }

/* dentro una scheda: testi liberi e note si infilano fra le righe */
.loc-rows > .wpb_text_column { padding: 10px 2px; }
.loc-rows > .riquadro { margin-block: 10px; }
.loc-row:hover .ico { transform: rotate(-6deg) scale(1.1); }

/* le fasi del corso: numeri colorati e foto viva */
.fasi .fase .step { transition: transform .3s; }
.fasi .fase:nth-child(2) .step { background: var(--gold); color: var(--espresso); }
.fasi .fase:nth-child(3) .step { background: var(--olive); }
.fasi .fase:nth-child(4) .step { background: var(--teal); }
.fasi .fase:hover .step { transform: scale(1.12) rotate(-4deg); }
.fasi .fase .thumb { overflow: hidden; }
.fasi .fase .thumb img { transition: transform .5s cubic-bezier(.2, .7, .3, 1); }
.fasi .fase:hover .thumb img { transform: scale(1.05); }

/* il programma: filo dorato a lato, come una pagina di quaderno */
.programma-corso .prose {
  border-left: 3px solid var(--accent-2);
  padding-left: clamp(20px, 3vw, 40px);
}

/* ================================================= POPUP DEL MODULO */

/* La scatola: cornice dorata interna, filo di gradiente in testa,
   angoli morbidi. Mirato al solo popup del modulo (#popmake-214). */
#popmake-214.pum-container {
  padding: 42px 38px 36px;
  border-radius: 8px;
  position: relative;
}
#popmake-214.pum-container::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 5px;
  border-radius: 8px 8px 0 0;
  background: linear-gradient(90deg, var(--terra-deep), var(--terra) 35%, var(--gold) 75%, var(--gold-soft));
}
#popmake-214.pum-container::after {
  content: "";
  position: absolute;
  inset: 12px;
  border: 1px solid color-mix(in srgb, var(--gold) 45%, transparent);
  border-radius: 5px;
  pointer-events: none;
}

/* La testata: cappello, occhiello, titolo nel serif del sito */
#popmake-214 .pum-testa { text-align: center; margin-bottom: 18px; }
#popmake-214 .pum-kicker {
  display: block;
  font-family: var(--body);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--gold);
}
#popmake-214 .pum-kicker::before {
  content: "";
  display: block;
  width: 26px;
  height: 26px;
  margin: 0 auto 10px;
  background-color: var(--gold);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='6.4' r='3.9'/%3E%3Ccircle cx='6.5' cy='8.6' r='3.3'/%3E%3Ccircle cx='17.5' cy='8.6' r='3.3'/%3E%3Crect x='6' y='8' width='12' height='7.1' rx='0.5'/%3E%3Crect x='5.7' y='16.6' width='12.6' height='5' rx='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='6.4' r='3.9'/%3E%3Ccircle cx='6.5' cy='8.6' r='3.3'/%3E%3Ccircle cx='17.5' cy='8.6' r='3.3'/%3E%3Crect x='6' y='8' width='12' height='7.1' rx='0.5'/%3E%3Crect x='5.7' y='16.6' width='12.6' height='5' rx='1.3'/%3E%3C/svg%3E") no-repeat center / contain;
}
#popmake-214 .pum-corso {
  margin-top: 10px;
  font-family: var(--display);
  font-size: clamp(24px, 4vw, 31px);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -.01em;
  color: var(--ink);
  text-wrap: balance;
}
#popmake-214 .pum-sotto {
  margin-top: 10px;
  font-size: 14.5px;
  color: var(--ink-soft);
}

/* Il modulo: e' Gravity Forms col tema Orbital, i colori glieli diamo
   con le sue variabili. Il selettore doppio (id+id) serve a battere il
   blocco di stile che GF stampa in linea con l'id del wrapper. */
#popmake-214 #gform_wrapper_41.gform-theme,
#popmake-214 [data-parent-form="41_0"] {
  --gf-color-primary: #8a3324;
  --gf-color-primary-rgb: 138, 51, 36;
  --gf-color-primary-contrast: #ffffff;
  --gf-color-primary-contrast-rgb: 255, 255, 255;
  --gf-color-primary-darker: #6c2418;
  --gf-color-primary-lighter: #a53c28;
  --gf-color-in-ctrl: #fdf7ec;
  --gf-color-in-ctrl-contrast: #221a12;
  --gf-color-out-ctrl-dark: #5a4d3f;
  --gf-color-out-ctrl-dark-darker: #221a12;
  --gf-radius: 4px;
  --gf-font-size-secondary: 13px;
}

/* etichette nello stile degli occhielli del sito */
#popmake-214 .gform-theme--orbital .gfield_label {
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
#popmake-214 .gform-theme--orbital .gfield_consent_label { font-size: 13px; color: var(--ink-soft); }

/* pulsante di invio pieno, come i primari del tema */
#popmake-214 .gform-theme--orbital .gform_footer { margin-top: 6px; }
#popmake-214 .gform-theme--orbital .gform_button {
  width: 100%;
  justify-content: center;
  font-family: var(--body);
  font-weight: 600;
  letter-spacing: .02em;
  transition: background .2s, transform .2s, box-shadow .25s;
}
#popmake-214 .gform-theme--orbital .gform_button:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 30px -18px rgba(108, 36, 24, .9);
}

/* su schermi piccoli la cornice rientra un filo */
@media (max-width: 540px) {
  #popmake-214.pum-container { padding: 34px 22px 26px; }
  #popmake-214.pum-container::after { inset: 8px; }
}

/* --- ritocchi dal collaudo del cliente --------------------------------- */

/* i due testi introduttivi erano troppo esili */
#popmake-214 .pum-sotto {
  font-size: 15.5px;
  font-weight: 600;
  color: var(--ink);
}
#popmake-214 .gform-theme--orbital .gform_required_legend {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-soft);
}

/* email e telefono riempiono la loro colonna (la taglia GF li fermava) */
#popmake-214 .gform-theme--orbital .gfield input:where([type="text"], [type="email"], [type="tel"]) {
  width: 100%;
  max-width: 100%;
}

/* meno aria tra le righe del modulo */
#popmake-214 #gform_wrapper_41.gform-theme,
#popmake-214 [data-parent-form="41_0"] {
  --gf-form-gap-y: 14px;
  --gf-form-gap-x: 14px;
  --gf-label-space-y-secondary: 4px;
}
#popmake-214 .gform-theme--orbital .gform_fields { row-gap: 14px; }
#popmake-214 .gform-theme--orbital .gfield_label { margin-bottom: 5px; }
#popmake-214 .pum-testa { margin-bottom: 14px; }
#popmake-214 .gform-theme--orbital .gform_required_legend { margin-bottom: 8px; }




/* ============================================================
   Pagine "Pagina Builder" (WPBakery)
   Qui si veste con l'aspetto del sito ciò che il cliente monta
   col builder usando gli elementi DI SERIE: righe, colonne,
   blocco testo, immagine singola, pulsante. Convenzioni:
   - pulsante senza colore scelto (o grigio) = terracotta; stile
     "outline" = ghost; classe extra "oro" = dorato; classe extra
     "js-info" = apre il popup richiesta informazioni;
   - riga con classe extra "banda-cta" (impostata su "stretch row")
     = fascia colorata a tutta larghezza, testo centrato;
   - immagine con classe extra "foto-corso" = taglio 3:2 uniforme.
   Un colore diverso scelto apposta nel builder resta suo.
   ============================================================ */

.pagina-builder { padding-block: clamp(44px, 6vw, 84px) clamp(56px, 7vw, 100px); }

.pb-wrap {
  max-width: var(--maxw);
  padding-inline: var(--gut);
  margin-inline: auto;
}

.pagina-builder .vc_row { margin-bottom: clamp(26px, 4vw, 54px); }
.pagina-builder .pb-wrap > :last-child { margin-bottom: 0; }

/* tipografia dei blocchi testo: il tema azzera i margini di p/h*,
   qui si ridanno (stessa logica della .prose delle pagine disegnate) */
.pagina-builder .wpb_text_column .wpb_wrapper > p,
.pagina-builder .wpb_text_column .wpb_wrapper > ul,
.pagina-builder .wpb_text_column .wpb_wrapper > ol { font-size: 17.5px; color: var(--ink-soft); }
.pagina-builder .wpb_text_column .wpb_wrapper > * + * { margin-top: 1.05em; }

.pagina-builder .wpb_text_column .wpb_wrapper > h2,
.pagina-builder .wpb_text_column .wpb_wrapper > h3,
.pagina-builder .wpb_text_column .wpb_wrapper > h4 {
  font-family: var(--display);
  color: var(--ink);
  line-height: 1.12;
  font-weight: 600;
}

.pagina-builder .wpb_text_column .wpb_wrapper > h2 { font-size: clamp(30px, 3.6vw, 44px); }
.pagina-builder .wpb_text_column .wpb_wrapper > h3 { font-size: clamp(24px, 2.6vw, 31px); }
.pagina-builder .wpb_text_column .wpb_wrapper > h4 { font-size: clamp(19px, 2vw, 23px); }
.pagina-builder .wpb_text_column .wpb_wrapper > * + h2 { margin-top: 1.5em; }
.pagina-builder .wpb_text_column .wpb_wrapper > * + h3 { margin-top: 1.35em; }

.pagina-builder .wpb_text_column .wpb_wrapper > p a:not(.btn),
.pagina-builder .wpb_text_column .wpb_wrapper > ul a:not(.btn) {
  color: var(--terra);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.pagina-builder .wpb_text_column .wpb_wrapper > p a:not(.btn):hover,
.pagina-builder .wpb_text_column .wpb_wrapper > ul a:not(.btn):hover { color: var(--terra-deep); }

.pagina-builder .wpb_text_column .wpb_wrapper > ul { list-style: none; padding: 0; }
.pagina-builder .wpb_text_column .wpb_wrapper > ul > li { position: relative; padding-left: 24px; }
.pagina-builder .wpb_text_column .wpb_wrapper > ul > li + li { margin-top: 0.5em; }

.pagina-builder .wpb_text_column .wpb_wrapper > ul > li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 0.58em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--gold);
}

.pagina-builder .wpb_text_column .wpb_wrapper > ol { padding-left: 22px; }

/* respiro degli elementi dentro le colonne */
.pagina-builder .wpb_content_element { margin-bottom: 24px; }
.pagina-builder .wpb_wrapper > :last-child { margin-bottom: 0; }

/* pulsanti del builder → pulsanti del sito.
   WPBakery 9 NON stampa la classe colore se il colore non e' salvato
   nello shortcode: le regole coprono sia il grigio (default in admin)
   sia i pulsanti senza classe colore. */
.pagina-builder .vc_btn3-container {
  display: inline-block;
  margin: 4px 12px 12px 0;
  vertical-align: middle;
}

.pagina-builder .vc_btn3.vc_general {
  font-family: var(--body);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.01em;
  padding: 14px 26px;
  border-radius: 2px;
  border: 1.5px solid transparent;
  transition:
    transform 0.25s cubic-bezier(0.2, 0.7, 0.3, 1),
    background 0.25s, color 0.25s, border-color 0.25s;
}

.pagina-builder .vc_btn3.vc_general:hover { transform: translateY(-2px); }

.pagina-builder .vc_btn3.vc_btn3-color-grey:not(.vc_btn3-style-outline),
.pagina-builder .vc_btn3.vc_general:not([class*="vc_btn3-color-"]):not(.vc_btn3-style-outline) {
  background: var(--terra);
  color: #fff;
}

.pagina-builder .vc_btn3.vc_btn3-color-grey:not(.vc_btn3-style-outline):hover,
.pagina-builder .vc_btn3.vc_general:not([class*="vc_btn3-color-"]):not(.vc_btn3-style-outline):hover {
  background: var(--terra-deep);
  color: #fff;
}

.pagina-builder .vc_btn3.vc_btn3-color-grey.vc_btn3-style-outline,
.pagina-builder .vc_btn3.vc_general.vc_btn3-style-outline:not([class*="vc_btn3-color-"]) {
  background: transparent;
  color: var(--ink);
  border-color: currentColor;
}

.pagina-builder .vc_btn3.vc_btn3-color-grey.vc_btn3-style-outline:hover,
.pagina-builder .vc_btn3.vc_general.vc_btn3-style-outline:not([class*="vc_btn3-color-"]):hover {
  background: var(--ink);
  color: var(--cream);
}

/* variante dorata: classe extra "oro" sul pulsante */
.pagina-builder .vc_btn3-container.oro .vc_btn3.vc_general {
  background: var(--gold);
  color: var(--espresso);
  border-color: transparent;
}

.pagina-builder .vc_btn3-container.oro .vc_btn3.vc_general:hover { background: var(--gold-soft); }

/* immagini */
.pagina-builder .wpb_single_image .vc_single_image-wrapper {
  display: block;
  border-radius: 4px;
  overflow: hidden;
  box-shadow: 0 26px 48px -30px rgba(28, 19, 12, 0.5);
}

.pagina-builder .wpb_single_image img { display: block; width: 100%; height: auto; }
.pagina-builder .wpb_single_image.foto-corso img { aspect-ratio: 3 / 2; object-fit: cover; }

/* fasce a tutta larghezza (riga "stretch" + classe extra) */
.pagina-builder .vc_row.banda-cta {
  background: linear-gradient(140deg, #a53c28 0%, var(--terra) 45%, var(--terra-deep) 100%);
  padding-block: clamp(44px, 6vw, 80px);
  text-align: center;
}

.pagina-builder .banda-cta .wpb_text_column { color: #f7ead9; font-size: 18px; }

.pagina-builder .banda-cta .wpb_text_column h2,
.pagina-builder .banda-cta .wpb_text_column h3 { color: #fff; }

.pagina-builder .banda-cta .vc_btn3-container { margin: 10px 6px 0; }

.pagina-builder .banda-cta .vc_btn3.vc_btn3-style-outline { color: #fff; }

.pagina-builder .banda-cta .vc_btn3.vc_btn3-style-outline:hover {
  background: #fff;
  color: var(--terra-deep);
}

.pagina-builder .vc_row.banda-crema {
  background: var(--cream-2);
  padding-block: clamp(36px, 5vw, 64px);
}


/* --- builder, secondo lotto: bande scure, numeri, citazioni, schede --- */

/* le sezioni rese dagli shortcode dentro una pagina builder respirano meno
   (il padding grande ce l'ha gia' .pagina-builder) */
.pagina-builder .section { padding-block: clamp(36px, 5vw, 72px); }

.pagina-builder .foto-piena img { width: 100%; display: block; }

.pagina-builder .centrato .wpb_text_column { text-align: center; }

.pagina-builder .occhiello-vc {
  font-family: var(--body);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--accent);
}

.pagina-builder .vc_row.banda-scura,
.pagina-builder .vc_row.banda-verde {
  color: #f3e9d8;
  padding-block: clamp(44px, 6vw, 80px);
}

.pagina-builder .vc_row.banda-scura { background: var(--espresso); }
.pagina-builder .vc_row.banda-verde { background: var(--teal); }

.pagina-builder .banda-scura .wpb_text_column,
.pagina-builder .banda-verde .wpb_text_column { color: #f3e9d8; }

.pagina-builder .banda-scura .wpb_text_column h2,
.pagina-builder .banda-scura .wpb_text_column h3,
.pagina-builder .banda-verde .wpb_text_column h2,
.pagina-builder .banda-verde .wpb_text_column h3 { color: #fbf4e6; }

.pagina-builder .banda-scura .occhiello-vc,
.pagina-builder .banda-verde .occhiello-vc { color: var(--gold-soft); }

.pagina-builder .banda-scura .wpb_text_column a:not(.vc_btn3),
.pagina-builder .banda-verde .wpb_text_column a:not(.vc_btn3) { color: #fbf4e6; }

.pagina-builder .numerone {
  font-family: var(--display);
  font-size: clamp(34px, 4vw, 52px);
  font-weight: 700;
  line-height: 1;
  color: var(--terra);
}

.pagina-builder .banda-scura .numerone,
.pagina-builder .banda-verde .numerone { color: var(--gold-soft); }

.pagina-builder .etich { font-size: 13.5px; letter-spacing: 0.04em; }

.pagina-builder .wpb_text_column .wpb_wrapper > blockquote {
  margin: 0;
  padding: 10px 0 10px 28px;
  border-left: 3px solid var(--gold);
  font-family: var(--display);
  font-size: clamp(20px, 2.3vw, 26px);
  font-style: italic;
  color: var(--ink);
  line-height: 1.45;
}

.pagina-builder .wpb_text_column .wpb_wrapper > blockquote cite {
  display: block;
  margin-top: 12px;
  font-family: var(--body);
  font-style: normal;
  font-size: 14px;
  color: var(--ink-soft);
}

.pagina-builder .card-fattore > .vc_column-inner {
  background: var(--cream-2);
  border-radius: 6px;
  padding: 30px 26px;
  height: 100%;
}

.pagina-builder ul.lista-due { columns: 2; column-gap: 48px; }
.pagina-builder ul.lista-due > li { break-inside: avoid; }

.pagina-builder .wpb_text_column .wpb_wrapper > ul.traguardi-vc > li { padding-left: 0; }
.pagina-builder .wpb_text_column .wpb_wrapper > ul.traguardi-vc > li::before { display: none; }
.pagina-builder .traguardi-vc li b { float: right; color: var(--terra); }

.pagina-builder .traguardi-vc li::after {
  content: "";
  display: block;
  clear: both;
  height: 4px;
  margin-top: 8px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--gold), var(--terra));
}

@media (max-width: 640px) {
  .pagina-builder ul.lista-due { columns: 1; }
}


/* --- builder, ritocchi La Scuola: foto piena centrata, loghi, pill --- */

/* la figure di WPBakery e' inline-block e si incolla a sinistra: nelle
   foto a tutta larghezza deve riempire la riga (come il vecchio
   .foto-gruppo: taglio a 460px e fondo scuro dietro) */
.pagina-builder .foto-piena { background: var(--teal-2); }

.pagina-builder .foto-piena .vc_figure,
.pagina-builder .foto-piena .vc_single_image-wrapper {
  display: block;
  width: 100%;
  border-radius: 0;
  box-shadow: none;
}

.pagina-builder .foto-piena img {
  width: 100%;
  height: auto;
  max-height: 460px;
  object-fit: cover;
}

/* le foto delle griglie riempiono sempre la loro colonna */
.pagina-builder .foto-corso .vc_figure,
.pagina-builder .foto-corso .vc_single_image-wrapper {
  display: block;
  width: 100%;
}

/* loghi e certificazioni: niente ombra ne' angoli, dimensione contenuta */
.pagina-builder .logo-vc { text-align: center; }

.pagina-builder .logo-vc .vc_figure { display: block; }

.pagina-builder .logo-vc .vc_single_image-wrapper {
  display: block;
  box-shadow: none;
  border-radius: 0;
  overflow: visible;
  background: none;
}

.pagina-builder .logo-vc img {
  width: auto;
  max-width: min(240px, 100%);
  margin-inline: auto;
}

.pagina-builder .logo-vc.logo-vc-piccolo img { max-width: min(170px, 100%); }

/* le "pill" della home, utilizzabili anche nei testi del builder */
.pagina-builder .pill {
  display: inline-block;
  border: 1px solid var(--line);
  color: var(--ink-soft);
  background: var(--paper);
  border-radius: 100px;
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 600;
  margin: 0 6px 6px 0;
}

/* home nel builder: hero del tema spento, i blocchi si danno i loro spazi */
.pagina-builder.senza-hero { padding-block: 0; }

/* ============ header sotto i 1200: via il margine a destra ============
   Il logo era inchiodato alle sue proporzioni piene (fix dello
   schiacciamento di luglio: flex 0 0 auto + max-width none), ma sui
   telefoni logo + pulsante + burger superavano lo schermo: la riga
   dell'header non va a capo e tutta la pagina scorreva di lato.
   Qui il logo torna a restringersi MA in proporzione (height auto +
   max-width: entrambe le dimensioni libere = niente deformazione),
   il pulsante si fa compatto e il body taglia ogni sbordo laterale. */
@media (max-width: 1200px) {
  .header .wrap { gap: 12px; }
  .brand { flex: 1 1 auto; min-width: 0; }
  .brand .logo { height: auto; max-height: 46px; max-width: 100%; }
  .header .cta { gap: 10px; }
  .header .cta .btn { padding: 9px 14px; font-size: 13px; }
  .burger { padding: 8px; }
}

@media (max-width: 640px) {
  .brand .logo { max-height: 40px; }
  .header .cta .btn { padding: 8px 12px; font-size: 12.5px; letter-spacing: 0; }
}

/* nessun elemento (righe stretch del builder comprese) deve piu' poter
   creare lo scroll orizzontale: clip non crea un contenitore di scroll,
   quindi sticky e fixed continuano a funzionare */
body { overflow-x: clip; }


/* --- la home nel builder deve respirare come prima --- */
/* ⚠️ regola-coperta ad alta specificità (0,3,0): dà il respiro di
   contesto a TUTTE le sezioni, pila compresa (per il padding-top).
   Le regole di pila dei caroselli (fondo del file) la battono con
   selettori più specifici sulle sole proprietà che governano. */
.pagina-builder.senza-hero .section { padding-block: clamp(64px, 9vw, 132px); }
.pagina-builder.senza-hero .vc_row { margin-bottom: 0; }


/* --- caroselli partner a tessere: un logo per slide ---
   distanza (--cs-gap) e altezza (--cs-h) regolabili dal pannello del
   "Carosello loghi"; senza variabile valgono gli standard qui sotto. */
.carosello .cs-slide { flex: 0 0 16.666%; padding-inline: calc(var(--cs-gap, 20px) / 2); scroll-snap-align: start; }
.carosello .cs-slide img { width: 100%; height: var(--cs-h, 64px); object-fit: contain; }

@media (max-width: 900px) {
  .carosello .cs-slide { flex-basis: 33.333%; }
}

@media (max-width: 640px) {
  .carosello .cs-slide { flex-basis: 50%; }
  .carosello .cs-slide img { height: var(--cs-h, 78px); }
}


/* --- hero a piu' foto (slider dal pannello) e testi ricchi dei blocchi --- */
.hero .bg-slot .photo { position: absolute; inset: 0; }

[data-hero-slider] .photo { opacity: 0; }
[data-hero-slider] .photo.attiva { opacity: 1; z-index: 1; }

[data-hero-slider][data-transizione="dissolvenza"] .photo,
[data-hero-slider][data-transizione="zoom"] .photo { transition: opacity 1.4s ease; }

[data-hero-slider][data-transizione="zoom"] .photo.attiva { animation: aic-hero-zoom 9s ease-out forwards; }

@keyframes aic-hero-zoom {
  from { transform: scale(1); }
  to { transform: scale(1.07); }
}

[data-hero-slider][data-transizione="scorrimento"] .photo {
  opacity: 1;
  transform: translateX(100%);
  transition: transform 1.1s cubic-bezier(0.2, 0.7, 0.3, 1);
}

[data-hero-slider][data-transizione="scorrimento"] .photo.attiva { transform: none; z-index: 1; }
[data-hero-slider][data-transizione="scorrimento"] .photo.uscente { transform: translateX(-100%); z-index: 0; }

@media (prefers-reduced-motion: reduce) {
  [data-hero-slider] .photo { transition: none !important; animation: none !important; }
}

/* i testi dall'editor completo possono avere piu' paragrafi */
.testo-ricco p + p { margin-top: 0.9em; }


/* --- caroselli partner a flusso continuo (marquee senza cuciture) --- */
.carosello.continuo { overflow: hidden; }

.carosello.continuo .cs-track {
  overflow: visible;
  scroll-snap-type: none;
  width: max-content;
  animation: aic-flusso var(--durata, 60s) linear infinite;
}

.carosello.continuo:hover .cs-track,
.carosello.continuo:focus-within .cs-track { animation-play-state: paused; }

/* tessere a misura di logo: niente vuoti da riquadro fisso, distanza
   uniforme e regolabile (--cs-gap dal pannello) */
.carosello.continuo .cs-slide {
  flex: 0 0 auto;
  width: auto;
  padding-inline: calc(var(--cs-gap, clamp(24px, 3.5vw, 44px)) / 2);
}

.carosello.continuo .cs-slide img { width: auto; max-width: min(60vw, 300px); }

/* direzione invertita (verso destra) dal pannello */
.carosello.continuo.inverso .cs-track { animation-direction: reverse; }

@keyframes aic-flusso {
  to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  .carosello.continuo .cs-track { animation: none; overflow-x: auto; width: auto; }
  .carosello.continuo .cs-slide.clone { display: none; }
}


/* --- dentro le fasce colorate il testo del cliente resta chiaro:
       le regole tipografiche (figli diretti) battevano il colore
       ereditato e i paragrafi tornavano scuri su fondo scuro --- */
.pagina-builder .banda-cta .wpb_text_column .wpb_wrapper > p,
.pagina-builder .banda-cta .wpb_text_column .wpb_wrapper > ul,
.pagina-builder .banda-cta .wpb_text_column .wpb_wrapper > ol,
.pagina-builder .banda-scura .wpb_text_column .wpb_wrapper > p,
.pagina-builder .banda-scura .wpb_text_column .wpb_wrapper > ul,
.pagina-builder .banda-scura .wpb_text_column .wpb_wrapper > ol,
.pagina-builder .banda-verde .wpb_text_column .wpb_wrapper > p,
.pagina-builder .banda-verde .wpb_text_column .wpb_wrapper > ul,
.pagina-builder .banda-verde .wpb_text_column .wpb_wrapper > ol { color: inherit; }

.pagina-builder .banda-cta .wpb_text_column .wpb_wrapper > h2,
.pagina-builder .banda-cta .wpb_text_column .wpb_wrapper > h3,
.pagina-builder .banda-scura .wpb_text_column .wpb_wrapper > h2,
.pagina-builder .banda-scura .wpb_text_column .wpb_wrapper > h3,
.pagina-builder .banda-verde .wpb_text_column .wpb_wrapper > h2,
.pagina-builder .banda-verde .wpb_text_column .wpb_wrapper > h3 { color: #fbf4e6; }

/* hero pagina con piu' foto: in modalita' velata anche la foto attiva
   resta in trasparenza */
.cpt-hero.tenue [data-hero-slider] .photo.attiva { opacity: 0.22; }

/* --- elenchi corsi: ogni corso in un box decorato (righe "scheda-corso") --- */
.pagina-builder .vc_row.scheda-corso {
  position: relative;
  margin-left: 0;
  margin-right: 0;
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  padding: clamp(14px, 2.5vw, 26px);
  box-shadow: 0 18px 40px -30px rgba(28, 19, 12, 0.35);
  overflow: hidden;
  transition: transform 0.3s cubic-bezier(0.2, 0.7, 0.3, 1), box-shadow 0.3s;
}

.pagina-builder .vc_row.scheda-corso::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--terra), var(--gold));
}

.pagina-builder .vc_row.scheda-corso:hover {
  transform: translateY(-4px);
  box-shadow: 0 30px 55px -32px rgba(28, 19, 12, 0.5);
}

.pagina-builder .scheda-corso .wpb_text_column .wpb_wrapper > h3 { color: var(--terra-deep); }
.pagina-builder .scheda-corso .wpb_single_image .vc_single_image-wrapper { border-radius: 8px; }

@media (prefers-reduced-motion: reduce) {
  .pagina-builder .vc_row.scheda-corso:hover { transform: none; }
}

/* --- blocco Testimonianze allievi: foto degli allievi +50% (112px) --- */
.testi .tcard .av { width: 112px; height: 112px; }


/* pagine con l'hero dentro il contenuto: niente cuscino sopra l'hero,
   ma padding sotto e margini tra le righe restano quelli normali */
.pagina-builder.hero-interno { padding-top: 0; }

/* --- griglia-corsi: pulsanti-card leggibili per costruzione --- */
.pagina-builder .griglia-corsi .vc_column-inner > .wpb_wrapper {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}

.pagina-builder .griglia-corsi .vc_btn3-container { display: block; margin: 0; }

.pagina-builder .griglia-corsi .vc_btn3.vc_general {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 64px;
  white-space: normal;
  text-align: center;
  background: #fff;
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px 12px;
  box-shadow: 0 12px 26px -20px rgba(28, 19, 12, 0.4);
}

.pagina-builder .griglia-corsi .vc_btn3.vc_general:hover {
  background: var(--terra);
  color: #fff;
  border-color: transparent;
  transform: translateY(-3px);
}

@media (max-width: 900px) {
  .pagina-builder .griglia-corsi .vc_column-inner > .wpb_wrapper { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
  .pagina-builder .griglia-corsi .vc_column-inner > .wpb_wrapper { grid-template-columns: 1fr; }
}


/* --- riquadro: sezione informativa in card col filo dorato --- */
.pagina-builder .vc_row.riquadro {
  margin-left: 0;
  margin-right: 0;
  background: #fff;
  border: 1px solid var(--line-soft);
  border-left: 4px solid var(--gold);
  border-radius: 10px;
  padding: clamp(18px, 3vw, 34px);
  box-shadow: 0 18px 40px -30px rgba(28, 19, 12, 0.3);
}

/* --- calendario: foto delle schede sempre in 16:9, niente ritagli estremi --- */
.cal-scheda .cal-foto {
  min-height: 0;
  aspect-ratio: 16 / 9;
  align-self: start;
}

/* ================================================================
   Pulsanti del builder: regole ESPLICITE e definitive. Niente piu'
   condizioni fragili: dentro .pagina-builder ogni vc_btn e' del brand
   (terracotta pieno; outline = ghost scuro; bianco nelle fasce; oro con
   la classe; card bianca nelle griglie). !important solo sulle
   proprieta' di visibilita', per blindarle contro i default di VC.
   ================================================================ */
.pagina-builder .vc_btn3 {
  background: var(--terra) !important;
  color: #fff !important;
  border: 1.5px solid transparent !important;
}

.pagina-builder .vc_btn3:hover { background: var(--terra-deep) !important; }

.pagina-builder .vc_btn3.vc_btn3-style-outline {
  background: transparent !important;
  color: var(--ink) !important;
  border-color: currentColor !important;
}

.pagina-builder .vc_btn3.vc_btn3-style-outline:hover {
  background: var(--ink) !important;
  color: var(--cream) !important;
}

.pagina-builder .banda-cta .vc_btn3.vc_btn3-style-outline,
.pagina-builder .banda-scura .vc_btn3.vc_btn3-style-outline,
.pagina-builder .banda-verde .vc_btn3.vc_btn3-style-outline { color: #fff !important; }

.pagina-builder .banda-cta .vc_btn3.vc_btn3-style-outline:hover {
  background: #fff !important;
  color: var(--terra-deep) !important;
}

.pagina-builder .vc_btn3-container.oro .vc_btn3 {
  background: var(--gold) !important;
  color: var(--espresso) !important;
  border-color: transparent !important;
}

.pagina-builder .vc_btn3-container.oro .vc_btn3:hover { background: var(--gold-soft) !important; }

.pagina-builder .griglia-corsi .vc_btn3 {
  background: #fff !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
}

.pagina-builder .griglia-corsi .vc_btn3:hover {
  background: var(--terra) !important;
  color: #fff !important;
  border-color: transparent !important;
}

/* --- calendario: card compatte, foto a tutta altezza e piu' larga --- */
.cal-scheda { grid-template-columns: clamp(300px, 38%, 470px) 1fr; }

.cal-scheda .cal-foto {
  aspect-ratio: auto;
  align-self: stretch;
  min-height: 220px;
}

.cal-corpo { padding: clamp(16px, 2vw, 24px); }
.cal-corpo h3 { font-size: clamp(20px, 2vw, 25px); }
.cal-corpo .cal-dati li { font-size: 13.5px; }
.cal-azioni { margin-top: 12px; }
.cal-azioni .btn { padding: 10px 18px; font-size: 13.5px; }

@media (max-width: 900px) {
  .cal-scheda { grid-template-columns: 1fr; }
  .cal-scheda .cal-foto { aspect-ratio: 16 / 9; min-height: 0; }
}

/* --- pagine corso: riga "posti a numero chiuso" centrata --- */
.final .sub { text-align: center; }


/* --- "Guarda anche gli altri corsi": card con la foto del corso --- */
.cred.cred-foto { padding: 0 0 24px; overflow: hidden; }

.cred-foto .thumb {
  display: block;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  margin-bottom: 18px;
  background: var(--cream-2);
}

.cred-foto .thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s cubic-bezier(0.2, 0.7, 0.3, 1);
}

.cred-foto:hover .thumb img { transform: scale(1.05); }

.cred-foto h3,
.cred-foto .link-arrow { padding-inline: 26px; }

/* --- calendario: piu aria tra una scheda e la altra --- */
.cal-lista { gap: clamp(26px, 3.5vw, 42px); }

/* --- calendario: titoli dei gruppi piu grandi, con aria sopra e
       attaccati alle schede che introducono --- */
.calendario-pagina .section-head { margin: clamp(44px, 6vw, 72px) 0 16px; }
.calendario-pagina > .wrap > .section-head:first-child { margin-top: 0; }

.calendario-pagina .section-head .kicker {
  font-size: clamp(17px, 2vw, 22px);
  letter-spacing: 0.14em;
}

.calendario-pagina .section-head .kicker::before { width: 38px; height: 2px; }


/* ============================== IMMAGINI CON LINK (campo "Link (URL)") */

/* Il campo "Link (URL)" nei dettagli dell'allegato rende cliccabile
   l'immagine nei caroselli partner, nelle strisce loghi e negli hero.
   Qui solo la resa: senza link il markup resta identico a prima. */

.cs-slide a { display: block; }

.tech-partners a,
.certbar .logos a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.cs-slide a img,
.tech-partners a img,
.certbar .logos a img { transition: transform 0.18s ease; }

.cs-slide a:hover img,
.cs-slide a:focus-visible img,
.tech-partners a:hover img,
.tech-partners a:focus-visible img,
.certbar .logos a:hover img,
.certbar .logos a:focus-visible img { transform: translateY(-3px); }

/* Hero con foto cliccabili: il velo e la colonna del testo lasciano
   passare i clic verso la foto; i pezzi interattivi restano cliccabili.
   Riceve i clic solo la foto attiva (le altre sono impilate invisibili). */
a.photo { display: block; cursor: pointer; }

.hero.foto-cliccabile .scrim,
.hero.foto-cliccabile .wrap { pointer-events: none; }

.hero.foto-cliccabile .wrap :is(a, button, input, select, textarea, label, iframe) { pointer-events: auto; }

.hero.foto-cliccabile .bg-slot .photo { pointer-events: none; }
.hero.foto-cliccabile .bg-slot .photo.attiva { pointer-events: auto; }

@media (prefers-reduced-motion: reduce) {
  .cs-slide a img,
  .tech-partners a img,
  .certbar .logos a img { transition: none; }
}


/* ================== CAROSELLI SPACCHETTATI (un elemento per carosello) */

/* [aic_sezione_testa] + [aic_carosello]: impilati nella STESSA colonna
   ricostruiscono i ritmi della vecchia sezione partner unica (testa che
   si incolla a ciò che segue, caroselli che si dividono i respiri).
   In righe separate ogni sezione tiene i suoi respiri pieni. */

.sezione-testa { background: var(--cream); padding-bottom: 0; }
.partners-blocco { background: var(--cream); }
.sezione-testa.fondo-bianco,
.partners-blocco.fondo-bianco { background: #fff; }

/* il respiro del blocco lo danno le regole di pila qui sotto;
   l'intestazione si attacca a ciò che introduce */
.partners-blocco .partner-block { margin-top: 0; }
.sezione-testa .section-head { margin-bottom: 0; }

/* fratelli generali (~), non adiacenti stretti: un eventuale <p> vuoto
   infilato da wpautop tra gli elementi non spezza il ritmo.
   ⚠️ selettori RINFORZATI apposta: le regole-coperta del builder
   (.pagina-builder .section = 0,2,0 e .pagina-builder.senza-hero
   .section = 0,3,0, righe ~1633/1831) altrimenti vincono sui padding
   della pila — è successo: buchi da ~130px sopra i caroselli. */
.sezione-testa,
.pagina-builder .sezione-testa,
.pagina-builder.senza-hero .sezione-testa { padding-bottom: 0; }

.sezione-testa ~ .partners-blocco,
.pagina-builder .sezione-testa ~ .partners-blocco,
.pagina-builder.senza-hero .sezione-testa ~ .partners-blocco { padding-top: clamp(22px, 3vw, 34px); }

.partners-blocco ~ .partners-blocco,
.pagina-builder .partners-blocco ~ .partners-blocco,
.pagina-builder.senza-hero .partners-blocco ~ .partners-blocco { padding-top: clamp(34px, 5vw, 56px); }

.partners-blocco:has(~ .partners-blocco),
.pagina-builder .partners-blocco:has(~ .partners-blocco),
.pagina-builder.senza-hero .partners-blocco:has(~ .partners-blocco) { padding-bottom: 0; }

/* opzioni fini del carosello singolo: loghi affiancati (desktop) e
   altezza/distanza via --cs-h / --cs-gap (le regole base dei caroselli
   leggono le variabili, qui solo il conteggio per vista) */
@media (min-width: 901px) {
  .partners-blocco .carosello:not(.continuo) .cs-slide { flex-basis: calc(100% / var(--cs-n, 6)); }
}

.tech-partners { gap: var(--cs-gap, clamp(30px, 6vw, 80px)); }
.tech-partners img { height: var(--cs-h, 64px); }
.tech-partners img.armando { height: calc(var(--cs-h, 64px) * 1.22); }


/* ===================== CALENDARIO E CORSO: rifiniture date e note */

/* la specifica delle date successive (es. "(di Giovedì)"), dal pannello */
.cal-date .successive li .spec,
.date-list li .spec {
  margin-left: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-faint);
}

/* nota in evidenza del corso (editor completo nel pannello dell'elemento) */
.info-corso .corso-nota { margin-top: 28px; }
.info-corso .corso-nota p:first-child { margin-top: 0; }