/* =========================================================================
   COPPA DEGLI ASSI — COMPONENTI (Fase 3)
   Usa i token di tokens.css. Nessun colore hard-coded fuori dai token.
   ========================================================================= */

/* ---------- Utility layout ---------- */
.ca-wrap{max-width:1120px;margin:0 auto;padding:0 clamp(24px,4vw,32px)}
/* Respiro verticale delle sezioni: tetto sceso da 120px a 80px (0.7.50, richiesta cliente).
   Su schermo largo 120+120 fra una sezione e l'altra facevano scorrere molto per vedere poco:
   la home ci perdeva 480px, quasi un decimo della sua altezza.
   NB: con il tetto a 80 il valore elastico (9vw) satura gia' a 889px di finestra, quindi da li'
   in su il padding e' costantemente 80 e la forbice reale e' 64-80. Se un domani si volesse
   tornare a una progressione piu' marcata, la leva e' il 9vw, non il tetto. */
.ca-section{padding:clamp(64px,9vw,80px) 0}
.ca-section--alt{background:var(--ca-bg-alt)}
.ca-eyebrow{font-family:var(--ca-font-ui);font-size:11.5px;letter-spacing:3px;text-transform:uppercase;color:var(--ca-amaranto);font-weight:600;margin:0 0 12px;display:flex;align-items:center;gap:10px}
.ca-eyebrow::before{content:"";width:30px;height:2px;background:var(--ca-oro-deep)}
.ca-h2{font-family:var(--ca-font-head);font-weight:200;font-size:38px;line-height:1.12;letter-spacing:0;color:var(--ca-amaranto);margin:0 0 10px}
.ca-lead{font-size:17px;color:var(--ca-muted);max-width:720px;font-weight:300;margin:0 0 28px}

/* =========================================================================
   COMANDI — sistema unico (Mockup-Bottoni.html, approvato 26/07/2026)
   -------------------------------------------------------------------------
   TRE LIVELLI: primary (pieno) · ghost (contorno) · text (sottolineato).
   UNA FORMA: 8px, per bottoni, chip, paginazione e bottoni-icona.
   IL COLORE LO DECIDE IL CONTENITORE: mettere .ca-on-dark sulle fasce scure
   (e .ca-on-photo sopra le immagini) e i comandi dentro si adeguano da soli.
   NON aggiungere varianti di colore ai singoli bottoni: se serve un colore
   diverso, e' il CONTESTO che va dichiarato.

   CF5 / CF5-ter / CF5-quater (carry-forward, NON rimuovere):
   Kadence sovrascrive :hover, :focus E :active dei <button> e di ogni <a>,
   cambiando SIA il colore SIA lo sfondo; il :focus sopravvive al click, quindi
   un comando cliccato resta illeggibile anche togliendo il mouse. Per questo
   ogni variante dichiara esplicitamente i tre stati, e l'ordine e' obbligato:
   prima :focus/:active, poi :hover, poi il contesto scuro (a parita' di
   specificita' vince l'ultima regola scritta).
   L'anello di focus di fabbrica e' BLU: qui si toglie per il mouse e si tiene,
   in oro, per la tastiera (:focus-visible). Toglierlo del tutto sarebbe una
   barriera di accessibilita'.
   ========================================================================= */

.ca-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--ca-font-ui);font-weight:700;font-size:14px;letter-spacing:.2px;
  padding:13px 24px;border-radius:var(--ca-radius-btn);border:2px solid transparent;
  cursor:pointer;transition:background-color .15s,color .15s,border-color .15s;text-decoration:none}
.ca-btn--sm{padding:9px 16px;font-size:12.5px}

/* 1) PRIMARIO — azione principale, uno per schermata. */
.ca-btn--primary{background:var(--ca-cta-bg);border-color:var(--ca-cta-bg);color:var(--ca-cta-text)}
.ca-btn--primary:focus,.ca-btn--primary:active{background:var(--ca-cta-bg);border-color:var(--ca-cta-bg);color:var(--ca-cta-text)}
.ca-btn--primary:hover{background:var(--ca-cta-bg-hover);border-color:var(--ca-cta-bg-hover);color:var(--ca-cta-text)}
.ca-btn--primary:active{background:var(--ca-amaranto-ink);border-color:var(--ca-amaranto-ink);color:#fff}

/* 2) SECONDARIO — alternativa a contorno. */
.ca-btn--ghost{background:transparent;border-color:var(--ca-amaranto);color:var(--ca-amaranto)}
.ca-btn--ghost:focus,.ca-btn--ghost:active{color:var(--ca-amaranto);background:transparent}
.ca-btn--ghost:hover{background:var(--ca-amaranto);border-color:var(--ca-amaranto);color:#fff}
.ca-btn--ghost:active{background:var(--ca-amaranto-ink);border-color:var(--ca-amaranto-ink);color:#fff}

/* 3) TESTO — azione minore ("torna a…", "vedi tutto"). */
.ca-btn--text{background:transparent;border-color:transparent;color:var(--ca-amaranto);
  padding-left:6px;padding-right:6px;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1.5px}
.ca-btn--text:focus,.ca-btn--text:active{background:transparent;color:var(--ca-amaranto)}
.ca-btn--text:hover{background:transparent;color:var(--ca-amaranto-ink)}

/* 4) DISATTIVATO — vale per tutte le varianti. */
.ca-btn:disabled,.ca-btn[aria-disabled="true"]{background:var(--ca-paper-2);border-color:var(--ca-paper-2);
  color:var(--ca-muted);cursor:not-allowed;text-decoration:none}

/* 5) ANELLO DI FOCUS — mai blu, e solo per la tastiera. */
.ca-btn:focus,.ca-chip:focus,.ca-pagination .page-numbers:focus,.ca-share__a:focus{outline:none}
.ca-btn:focus-visible,.ca-chip:focus-visible,.ca-pagination .page-numbers:focus-visible,.ca-share__a:focus-visible{
  outline:3px solid var(--ca-oro-deep);outline-offset:3px}

/* 6) CONTESTO SCURO — due modi, entrambi legittimi (rivisto 26/07 dopo il cleanup di Code).
   a) I COMPONENTI qui elencati sono scuri per definizione (l'hero, la fascia diretta, il
      cenno storico, le fasce CTA, l'hero delle pagine): restano nell':is() per sempre.
      Serve anche perche' alcuni di essi vivono nel DATABASE come blocchi — l'hero della
      pagina Contatti, per esempio — e li' una classe aggiunta dal template non arriverebbe.
   b) .ca-on-dark e' per QUALUNQUE ALTRO contenitore scuro: sezioni costruite a blocchi,
      fasce nuove, casi una tantum. E' la strada da usare d'ora in poi.
   Non serve piu' allungare questo elenco: se aggiungi una fascia scura, mettile la classe. */
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage,.qz-cta-strip) .ca-btn--primary{
  background:var(--ca-oro);border-color:var(--ca-oro);color:var(--ca-amaranto-ink)}
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage,.qz-cta-strip) .ca-btn--primary:focus,
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage,.qz-cta-strip) .ca-btn--primary:active{
  background:var(--ca-oro);border-color:var(--ca-oro);color:var(--ca-amaranto-ink)}
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage,.qz-cta-strip) .ca-btn--primary:hover{
  background:var(--ca-oro-light);border-color:var(--ca-oro-light);color:var(--ca-amaranto-ink)}
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage,.qz-cta-strip) .ca-btn--ghost,
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage,.qz-cta-strip) .ca-btn--ghost:focus,
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage,.qz-cta-strip) .ca-btn--ghost:active{
  background:transparent;border-color:rgba(255,255,255,.6);color:#fff}
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage,.qz-cta-strip) .ca-btn--ghost:hover{
  background:#fff;border-color:#fff;color:var(--ca-amaranto)}
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage,.qz-cta-strip) .ca-btn--text{color:var(--ca-oro-light)}
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage,.qz-cta-strip) .ca-btn--text:hover{color:#fff}
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage,.qz-cta-strip) .ca-btn:disabled{
  background:rgba(255,255,255,.14);border-color:transparent;color:rgba(255,255,255,.55)}
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage,.qz-cta-strip) .ca-btn:focus-visible{outline-color:var(--ca-oro-light)}

/* 7) SOPRA UN'IMMAGINE — .ca-on-photo: niente contorni nudi, la foto cambia a ogni edizione. */
.ca-on-photo .ca-btn--ghost,.ca-on-photo .ca-btn--ghost:focus{background:rgba(42,15,20,.55);border-color:#fff;color:#fff}
.ca-on-photo .ca-btn--ghost:hover{background:#fff;border-color:#fff;color:var(--ca-amaranto)}
.ca-on-photo .ca-btn--text{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.5)}

/* 8) ALIAS STORICO — .ca-btn--gold non e' piu' una variante di colore (era l'ibrido che
   generava le discordanze). I template sono stati ripuliti il 26/07 (0 occorrenze), e anche
   ca_btn() converte 'gold' in 'primary'. L'alias RESTA lo stesso, di proposito: i contenuti
   scritti dal cliente vivono nel DATABASE e non possiamo cercarli da qui: una CTA vecchia in
   una pagina a blocchi diventerebbe un bottone senza colore, e nessuno di noi la vedrebbe.
   Costa sei righe. Togliere solo dopo aver cercato "ca-btn--gold" anche nel database. */
.ca-btn--gold{background:var(--ca-cta-bg);border-color:var(--ca-cta-bg);color:var(--ca-cta-text)}
.ca-btn--gold:focus,.ca-btn--gold:active{background:var(--ca-cta-bg);border-color:var(--ca-cta-bg);color:var(--ca-cta-text)}
.ca-btn--gold:hover{background:var(--ca-cta-bg-hover);border-color:var(--ca-cta-bg-hover);color:var(--ca-cta-text)}
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage,.qz-cta-strip) .ca-btn--gold,
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage,.qz-cta-strip) .ca-btn--gold:focus{
  background:var(--ca-oro);border-color:var(--ca-oro);color:var(--ca-amaranto-ink)}
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage,.qz-cta-strip) .ca-btn--gold:hover{
  background:var(--ca-oro-light);border-color:var(--ca-oro-light);color:var(--ca-amaranto-ink)}

/* Topbar (fondo scuro): i link non devono diventare amaranto in hover. */
.ca-topbar a:hover{color:#fff}

/* ---------- TOP BAR (lingua + live) ----------
   Era #2A0F14, quasi nera: l'unico elemento pesante di un sito costruito sul paper luminoso, e
   in cima alla pagina sembrava un bordo nero. Ora la fascia SCHIARISCE da sinistra a destra,
   dall'amaranto del marchio a un rame caldo, e chiude su una riga d'oro che la lega all'header
   chiaro sotto. Il rame si ferma a #963F30 e non prosegue verso tinte piu' accese: li' il testo
   crema tiene 6,4:1, mentre un rame piu' chiaro scendeva a 4,5, appena sopra la soglia AA.
   Testo e link in paper (non bianco puro): stessa luce del resto del sito. */
.ca-topbar{background:linear-gradient(90deg,var(--ca-amaranto) 0%,#8E2E36 52%,var(--ca-rame) 100%);color:var(--ca-paper);font-family:var(--ca-font-ui);font-size:12px;letter-spacing:.3px;box-shadow:inset 0 -2px 0 var(--ca-oro)}
.ca-topbar__in{max-width:1120px;margin:0 auto;padding:8px clamp(24px,4vw,32px);display:flex;justify-content:space-between;align-items:center;gap:16px}
/* Lo stile del blocco di destra era inline nel PHP: qui sta insieme al resto della barra.
   margin-left:auto lo tiene a destra anche adesso che a sinistra non c'e' piu' nulla. */
.ca-topbar__right{display:flex;gap:16px;align-items:center;margin-left:auto}
.ca-topbar a{color:var(--ca-paper);text-decoration:none}
.ca-lang{display:flex;gap:10px;align-items:center}
.ca-lang a{opacity:.6;font-weight:600}
.ca-lang a.current-lang,.ca-lang .current-lang{opacity:1;color:#fff}
/* Bandiere: altezza uguale, larghezza secondo le proporzioni vere (3:2 l'italiana, 2:1 la
   britannica) — allinearle a forza alla stessa larghezza le deformerebbe entrambe.
   Il filo bianco attorno stacca il bianco della bandiera dal fondo scuro della topbar, che
   altrimenti la fa sembrare bucata; la lingua corrente ha il filo pieno, le altre appena
   accennato, cosi' si capisce dove si e' anche senza distinguere i colori. */
.ca-lang__a{display:flex;align-items:center;line-height:0}
.ca-flag{height:13px;width:auto;display:block;border-radius:2px;box-shadow:0 0 0 1px rgba(255,255,255,.35)}
.ca-lang__a.current-lang .ca-flag{box-shadow:0 0 0 1px rgba(255,255,255,.9)}
.ca-lang__a:hover .ca-flag,.ca-lang__a:focus-visible .ca-flag{box-shadow:0 0 0 1px #fff}
.ca-lang__a:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:3px}
.ca-livepill{display:inline-flex;align-items:center;gap:7px;background:var(--ca-live);color:#fff;font-family:var(--ca-font-ui);font-size:12px;font-weight:700;padding:6px 13px;border-radius:100px;text-decoration:none}
.ca-dotlive{width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 0 0 rgba(255,255,255,.6);animation:ca-pulse 1.8s infinite}
@keyframes ca-pulse{0%{box-shadow:0 0 0 0 rgba(255,255,255,.6)}70%{box-shadow:0 0 0 8px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}

/* ---------- HERO ---------- */
.ca-hero{position:relative;overflow:hidden;color:#fff;background:radial-gradient(80% 120% at 82% 0%, rgba(195,154,78,.22), transparent 58%),linear-gradient(160deg,var(--ca-amaranto-dark),var(--ca-amaranto-ink))}
/* Hero con video di sfondo: sfondo scuro neutro + video coprente + scrim per leggibilità */
.ca-hero--video{background:var(--ca-amaranto-ink)}
.ca-hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.ca-hero--video::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(160deg,rgba(42,15,20,.62),rgba(42,15,20,.30) 42%,rgba(42,15,20,.66))}
/* VELO SOTTO IL TESTO (0.9.16). Il velo diagonale qui sopra bastava con il video vecchio, una
   ripresa aerea di toni scuri; il nuovo apre su erba al sole e nella fascia centrale, dove sta
   il testo, scendeva al 30%: misurato, il claim in oro chiaro cadeva a 2,3 di contrasto — sotto
   qualunque soglia — e il titolo bianco restava a 3,85, cioè appena sopra il minimo che vale
   solo perché è testo grande.
   Questo secondo velo scurisce SOLO la metà sinistra, quella occupata dal testo, e sfuma prima
   di arrivare a destra: il video resta pieno dove non c'è niente da leggere. Cosi' il claim
   torna a 4,8 e il titolo a 8,0, senza spegnere l'immagine. */
.ca-hero--video::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(42,15,20,.45) 0%,rgba(42,15,20,.34) 38%,rgba(42,15,20,0) 68%)}
/* Hero più alto (0.9.18, richiesta utente): cresce SOLO lo spazio attorno al testo, non il testo.
   I titoli restano quelli — il video ha più aria e la sezione occupa circa tre quarti dello
   schermo invece di due terzi. Restano valori fluidi: sul telefono i margini scendono al minimo,
   altrimenti l'hero mangerebbe tutta la prima schermata e il resto della home sparirebbe. */
.ca-hero--video .ca-hero__in{padding-top:clamp(170px,15vw,260px);padding-bottom:clamp(140px,12vw,215px)}
.ca-hero__media{position:absolute;inset:0;z-index:0}
.ca-hero__media img,.ca-hero__media video{width:100%;height:100%;object-fit:cover;opacity:.34}
.ca-hero__in{position:relative;z-index:2;max-width:1120px;margin:0 auto;padding:clamp(84px,10vw,150px) clamp(24px,4vw,32px) clamp(64px,8vw,110px)}
.ca-hero__badge{display:inline-block;font-family:var(--ca-font-ui);font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--ca-amaranto-ink);background:var(--ca-oro-light);padding:7px 15px;border-radius:100px;margin-bottom:20px}
.ca-hero h1{font-family:var(--ca-font-head);font-weight:200;font-size:58px;line-height:1.03;letter-spacing:0;color:#fff;margin:0 0 14px}
.ca-hero__claim{font-family:var(--ca-font-accent);font-style:italic;font-weight:200;font-size:22px;color:var(--ca-oro-light);margin:0 0 26px}
.ca-hero__cta{display:flex;gap:12px;flex-wrap:wrap}

/* ---------- COUNTDOWN ---------- */
.ca-countdown{display:flex;gap:26px;flex-wrap:wrap;align-items:flex-end}
.ca-cd{text-align:center;min-width:64px}
.ca-cd b{font-family:var(--ca-font-head);font-size:38px;color:var(--ca-amaranto);display:block;line-height:1;font-weight:400}
.ca-cd span{font-family:var(--ca-font-ui);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--ca-muted)}
.ca-daterow{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin-bottom:18px}
.ca-daterow .d{font-family:var(--ca-font-head);font-weight:400;color:var(--ca-amaranto-dark);font-size:20px}
.ca-daterow .s{color:var(--ca-muted);font-size:15px}

/* ---------- LIVE BAND ---------- */
.ca-liveband{background:linear-gradient(150deg,var(--ca-amaranto),var(--ca-amaranto-ink));color:#fff;border-radius:var(--ca-radius-lg);padding:30px 34px;display:flex;align-items:center;gap:22px;flex-wrap:wrap;box-shadow:var(--ca-shadow)}
.ca-liveband .b{background:var(--ca-live);color:#fff;font-family:var(--ca-font-ui);font-weight:700;font-size:12px;letter-spacing:1px;text-transform:uppercase;padding:7px 13px;border-radius:100px;display:inline-flex;align-items:center;gap:7px}
.ca-liveband h3{font-family:var(--ca-font-head);color:#fff;font-size:22px;margin:0}
.ca-liveband__cta{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap}

/* ---------- HERITAGE ---------- */
/* Heritage: sfondo (gradiente amaranto) spostato sulla SEZIONE a tutta larghezza */
.ca-section--heritage{background:linear-gradient(150deg,var(--ca-amaranto),var(--ca-amaranto-ink));color:#f2e7d8}
/* Griglia esterna: 50% info (sinistra) + 50% immagine (destra) */
.ca-heritage{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
/* Info a sinistra: numero a larghezza contenuto + testo accostato (gap ridotto) */
.ca-heritage__main{display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:center}
/* Immagine a destra: ritaglio ORIZZONTALE 3:2, più grande */
.ca-heritage__img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;object-position:center;border-radius:var(--ca-radius-lg);box-shadow:var(--ca-shadow)}
.ca-heritage__ph{aspect-ratio:3/4;border:1px dashed rgba(255,255,255,.35);border-radius:var(--ca-radius-lg);background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.55);font-family:var(--ca-font-ui);font-size:12px;letter-spacing:2px;text-transform:uppercase}
.ca-heritage__num b{font-family:var(--ca-font-head);font-size:92px;color:var(--ca-oro-light);line-height:.9;font-weight:300;display:block}
.ca-heritage__num span{font-family:var(--ca-font-ui);letter-spacing:2px;text-transform:uppercase;font-size:12px;color:#c9bba7}
.ca-heritage__txt .q{font-family:var(--ca-font-accent);font-style:italic;font-size:25px;line-height:1.4;color:#fff;margin:0 0 18px}

/* ---------- CARD NEWS ---------- */
.ca-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ca-newscard{background:#fff;border:1px solid var(--ca-border);border-radius:14px;overflow:hidden;box-shadow:var(--ca-shadow);display:block;text-decoration:none;color:inherit;transition:.2s}
.ca-newscard:hover{transform:translateY(-3px)}
.ca-newscard__img{display:block;height:150px;background:linear-gradient(140deg,var(--ca-amaranto-dark),var(--ca-amaranto));background-size:cover;background-position:center}
.ca-newscard__in{display:block;padding:16px 18px}
.ca-newscard__k{display:block;font-family:var(--ca-font-ui);font-size:10.5px;letter-spacing:1px;text-transform:uppercase;color:var(--ca-oro-deep);font-weight:700}
.ca-newscard__t{display:block;font-family:var(--ca-font-head);font-size:18px;color:var(--ca-amaranto-dark);margin:6px 0 6px;line-height:1.15}
.ca-newscard__d{display:block;font-size:12.5px;color:var(--ca-muted)}

/* ---------- PHOTO GRID ---------- */
.ca-grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.ca-photo{position:relative;display:block;border-radius:12px;overflow:hidden;aspect-ratio:4/3;background:var(--ca-paper-2);text-decoration:none}
.ca-photo img{width:100%;height:100%;object-fit:cover}
.ca-photo__cap{position:absolute;left:0;right:0;bottom:0;padding:10px 12px;color:#fff;font-family:var(--ca-font-ui);font-weight:700;font-size:13px;background:linear-gradient(0deg,rgba(42,15,20,.8),transparent)}

/* ---------- PARTNER STRIP ---------- */
.ca-partners{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;align-items:center}
.ca-partner{background:#fff;border:1px solid var(--ca-border);border-radius:10px;padding:16px 22px;min-width:150px;min-height:70px;display:flex;align-items:center;justify-content:center}
.ca-partner{--h:46px}
.ca-partner img{max-width:130px;max-height:var(--h);width:auto;height:auto;filter:grayscale(1);opacity:.75;transition:.2s}
.ca-partner--xwide{--h:36px}
.ca-partner--wide{--h:40px}
.ca-partner--std{--h:46px}
.ca-partner--largo{--h:52px}
.ca-partner--square{--h:58px}
.ca-partner--tall{--h:62px}
.ca-partner--tela{--h:64px}
.ca-partner:hover img{filter:none;opacity:1}
.ca-partner__name{font-family:var(--ca-font-ui);font-weight:700;color:var(--ca-muted);font-size:14px}

/* ---------- SOCIAL ---------- */
/* Barra social home "Seguici" — icone SVG in bottoni tondi (stesse del footer .ca-ft-social) */
.ca-social{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:center}
.ca-social a{width:44px;height:44px;border:1px solid var(--ca-border);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--ca-amaranto);background:#fff;transition:.15s;text-decoration:none}
.ca-social a:hover{background:var(--ca-amaranto);color:#fff;border-color:var(--ca-amaranto)}
.ca-social svg{width:20px;height:20px;display:block}

/* Barra "Condividi:" in fondo agli articoli — icone tonde in stile social */
.ca-share{display:flex;align-items:center;flex-wrap:wrap;gap:14px;margin:30px 0 0;padding-top:22px;border-top:1px solid var(--ca-line)}
.ca-share__lab{font-family:var(--ca-font-ui);font-weight:700;font-size:12.5px;letter-spacing:.5px;text-transform:uppercase;color:var(--ca-muted)}
.ca-share__nets{display:flex;gap:10px;flex-wrap:wrap}
/* BOTTONE ICONA — stessa forma degli altri comandi (era l'unico tondo del sistema). */
.ca-share__a{width:42px;height:42px;padding:0;border:1.5px solid var(--ca-line-strong);border-radius:var(--ca-radius-btn);display:flex;align-items:center;justify-content:center;color:var(--ca-amaranto);background:#fff;transition:.15s;text-decoration:none}
.ca-share__a:focus,.ca-share__a:active{background:#fff;color:var(--ca-amaranto)}
.ca-share__a:hover{background:var(--ca-amaranto);color:#fff;border-color:var(--ca-amaranto)}
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage) .ca-share__a{background:transparent;border-color:rgba(255,255,255,.5);color:#fff}
:is(.ca-on-dark,.ca-hero,.ca-pagehero,.ca-liveband,.ca-ctaband,.ca-heritage) .ca-share__a:hover{background:#fff;border-color:#fff;color:var(--ca-amaranto)}
.ca-share__a svg{width:19px;height:19px;display:block}
.ca-share__copy{cursor:pointer;position:relative}
.ca-share__copy.is-copied::after{content:"Copiato!";position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:var(--ca-amaranto-ink);color:#fff;font-family:var(--ca-font-ui);font-size:11px;font-weight:600;letter-spacing:.3px;padding:5px 9px;border-radius:6px;white-space:nowrap;z-index:3}

/* ---------- Responsive ---------- */
@media(max-width:820px){
  .ca-h2{font-size:30px}
  .ca-hero h1{font-size:40px}
  .ca-grid3,.ca-grid4{grid-template-columns:1fr 1fr}
  .ca-heritage{grid-template-columns:1fr;text-align:left}
  .ca-heritage__main{grid-template-columns:1fr}
  .ca-liveband__cta{margin-left:0;width:100%}
}
@media(max-width:560px){
  .ca-grid3,.ca-grid4{grid-template-columns:1fr}
  .ca-countdown{gap:16px}
  .ca-cd b{font-size:30px}
}

/* =========================================================================
   Fase 3.2 — LA STORIA / SINGLE EDIZIONE
   ========================================================================= */

/* ---------- Page hero (pagine interne) ---------- */
/* ALTEZZA UNIFORME (0.9.22). Gli header non erano alti uguali perché non hanno lo stesso
   contenuto: Programma porta data, sede e countdown e arrivava a 438px, La storia si fermava a
   301. Il padding era già identico, quindi non era lì che si poteva agire: serve un'altezza
   MINIMA, con il contenuto centrato in verticale, così le pagine povere di testo si allineano
   alle altre e quelle piene continuano a crescere come prima.
   flex-direction:column e non row: il figlio è .ca-wrap, che si centra da sé con margin auto —
   in una riga flex perderebbe la larghezza piena e il centraggio salterebbe. */
.ca-pagehero{background:radial-gradient(120% 120% at 85% -10%, rgba(195,154,78,.20), transparent 55%),linear-gradient(160deg,var(--ca-amaranto-dark),var(--ca-amaranto-ink));color:#fff;padding:clamp(72px,8vw,120px) 0 clamp(52px,6vw,84px);background-size:cover;background-position:center;min-height:clamp(300px,30vw,440px);display:flex;flex-direction:column;justify-content:center}
/* Il contenitore interno deve restare a tutta larghezza: ha `margin:0 auto` e, dentro un
   contenitore flex, un margine automatico sull'asse trasversale impedisce all'elemento di
   stirarsi — si stringeva sul testo e finiva schiacciato al centro. */
.ca-pagehero > .ca-wrap{width:100%}
.ca-pagehero--photo{padding:clamp(96px,10vw,150px) 0 clamp(64px,7vw,96px)}
/* ---------- HEADER DI PAGINA CON FOTO (0.9.20) ----------
   Le immagini arrivano gia' virate in amaranto e scurite: fanno da sole il lavoro che qui
   faceva il gradiente, quindi NON si aggiunge un secondo velo — due veli sovrapposti
   spegnerebbero la foto fino a farla sparire, e a quel punto tanto valeva il fondo pieno.
   Il colore di fondo resta sotto: se l'immagine non carica, il titolo bianco ha comunque il
   suo scuro sotto invece di finire su bianco. */
.ca-pagehero--foto{background-color:var(--ca-amaranto-ink);background-size:cover;background-position:center;background-repeat:no-repeat}
/* L'inquadratura non e' al centro per caso: l'header e' una fascia larga e bassa, e di una foto
   16:9 ne mostra meno di un terzo. Nella foto storica il salto sta nella meta' alta, quindi si
   alza il taglio per non far vedere solo il prato; nell'aerea del campo il centro va bene. */
.ca-pagehero--storia{background-image:url(pagehero-storia.jpg);background-position:center 30%}
.ca-pagehero--programma{background-image:url(pagehero-programma.jpg)}
/* Le altre cinque voci del menu (0.9.24). L'abbinamento non e' casuale: il podio dove si
   raccontano i risultati, il salto con le insegne istituzionali sulla pagina della gara, la
   veduta dalle tribune per chi deve venire, il ritratto per chi scrive, il saluto sui contatti.
   L'inquadratura di ciascuna e' calibrata sul suo soggetto: la fascia visibile e' meno di un
   terzo della foto, e al centro capita spesso il pezzo meno interessante. */
.ca-pagehero--news{background-image:url(pagehero-news.jpg);background-position:center 58%}
.ca-pagehero--equestrian{background-image:url(pagehero-equestrian.jpg);background-position:center 42%}
.ca-pagehero--visita{background-image:url(pagehero-visita.jpg);background-position:center 45%}
.ca-pagehero--stampa{background-image:url(pagehero-stampa.jpg);background-position:center 38%}
.ca-pagehero--contatti{background-image:url(pagehero-contatti.jpg);background-position:center 40%}
.ca-pagehero__ey{font-family:var(--ca-font-ui);font-size:11.5px;letter-spacing:3px;text-transform:uppercase;color:var(--ca-oro-light);font-weight:600;display:inline-block;margin-bottom:14px}
.ca-pagehero h1{font-family:var(--ca-font-head);font-weight:200;font-size:52px;letter-spacing:0;color:#fff;margin:0}
.ca-pagehero__sub{font-family:var(--ca-font-accent);font-style:italic;font-size:21px;color:var(--ca-oro-light);margin:10px 0 0;max-width:680px}
/* ---------- STAFF SPORTIVO (Equestrian) ---------- */
/* minmax(300px,1fr) e non un numero fisso di colonne: sulla larghezza del contenitore
   fa 3 colonne (le 9 voci riempiono tre righe piene), 2 sul tablet, 1 sul telefono,
   senza media query. Ogni voce e' separata da un filetto, come una scheda tecnica. */
.ca-staff{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px 32px;margin:0 0 28px}
.ca-staff__i{border-top:1px solid var(--ca-line);padding-top:12px}
.ca-staff__role{display:block;font-family:var(--ca-font-ui);font-size:10.5px;letter-spacing:1px;text-transform:uppercase;color:var(--ca-oro-deep);font-weight:700}
.ca-staff__name{display:block;font-family:var(--ca-font-head);font-weight:200;font-size:22px;color:var(--ca-amaranto-dark);line-height:1.15;margin:5px 0 6px}
.ca-staff__tel,.ca-staff__mail{display:block;font-family:var(--ca-font-ui);font-size:14px;color:var(--ca-ink);text-decoration:none;border-bottom:1px solid var(--ca-line);width:max-content;max-width:100%;padding-bottom:1px}
.ca-staff__tel:hover,.ca-staff__mail:hover{color:var(--ca-amaranto);border-bottom-color:var(--ca-amaranto)}
.ca-staff__mail{margin-top:4px;word-break:break-word}

/* Riga propria per il badge "LIVE ORA" quando convive con l'occhiello sopra al titolo.
   Il margine sotto lo mette gia' il badge (.ca-livebadge), qui serve solo l'a capo. */
.ca-pagehero__live{display:block;margin:0}
/* Riga delle categorie FEI sotto al titolo (CSIYH - CSI* - ...): caratteri UI e non il corsivo
   di __sub, perche' li' gli asterischi delle stelle diventano illeggibili. */
.ca-pagehero__cat{font-family:var(--ca-font-ui);font-size:14px;letter-spacing:2px;color:var(--ca-oro-light);font-weight:500;margin:12px 0 0}

/* ---------- Prose (contenuto editoriale) ---------- */
.ca-prose{max-width:760px;font-size:17px;line-height:1.75;color:var(--ca-ink)}
.ca-prose p{margin:0 0 18px}
.ca-prose h2,.ca-prose h3{font-family:var(--ca-font-head);color:var(--ca-amaranto);margin:28px 0 10px}
.ca-prose a{color:var(--ca-cta-bg);text-decoration:underline}

/* ---------- Timeline ---------- */
.ca-timeline{list-style:none;margin:0;padding:0;position:relative}
.ca-timeline::before{content:"";position:absolute;left:88px;top:6px;bottom:6px;width:2px;background:var(--ca-line)}
.ca-tl{display:grid;grid-template-columns:88px 1fr;gap:22px;padding:0 0 26px;position:relative}
.ca-tl__year{font-family:var(--ca-font-head);font-weight:400;font-size:22px;color:var(--ca-oro-deep);text-align:right;padding-top:1px}
.ca-tl__body{position:relative;padding-left:24px}
.ca-tl__body::before{content:"";position:absolute;left:-6px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--ca-amaranto);border:2px solid var(--ca-paper)}
.ca-tl__title{font-family:var(--ca-font-head);font-size:19px;color:var(--ca-amaranto-dark);margin:0 0 4px}
.ca-tl__text{font-size:15px;color:var(--ca-muted)}
.ca-tl__text p{margin:0 0 8px}

/* ---------- Albo d'Oro (tabella) ---------- */
.ca-albo-wrap{overflow-x:auto}
.ca-albo{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--ca-border);border-radius:14px;overflow:hidden;box-shadow:var(--ca-shadow);font-size:15px}
.ca-albo th,.ca-albo td{padding:13px 18px;text-align:left;border-bottom:1px solid var(--ca-line)}
.ca-albo thead th{background:var(--ca-amaranto);color:#fff;font-family:var(--ca-font-ui);font-size:12px;letter-spacing:.5px;text-transform:uppercase}
.ca-albo tbody tr:last-child td{border-bottom:none}
.ca-albo tbody tr:hover{background:var(--ca-paper-2)}
.ca-albo__y{font-family:var(--ca-font-ui);font-weight:600;color:var(--ca-amaranto-dark)}
.ca-albo__y a{color:inherit;text-decoration:none}
.ca-albo__y a:hover{color:var(--ca-cta-bg)}
/* Albo d'Oro collassabile: ~5 righe visibili + sfumatura + "Guarda tutto" (JS collapse.js) */
.ca-albo.is-collapsed{-webkit-mask-image:linear-gradient(#000 72%,transparent);mask-image:linear-gradient(#000 72%,transparent)}
.ca-albo.is-collapsed tbody tr:nth-child(n+7){display:none}
.ca-albo-more{display:flex;justify-content:center;margin-top:20px}

/* ---------- Card Edizione ---------- */
/* Griglia "Ultime edizioni" (5 card): 2025 in evidenza a sinistra + 4 (2x2) a destra */
.ca-edgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr;grid-auto-rows:1fr;gap:16px}
.ca-edgrid .ca-edcard:first-child{grid-column:1;grid-row:1 / span 2;display:flex;flex-direction:column}
.ca-edgrid .ca-edcard:first-child .ca-edcard__img{flex:1 0 auto;min-height:300px}
.ca-edgrid .ca-edcard:first-child .ca-edcard__y{font-size:32px}
@media(max-width:900px){
  .ca-edgrid{grid-template-columns:1fr 1fr}
  .ca-edgrid .ca-edcard:first-child{grid-column:1 / -1;grid-row:auto}
  .ca-edgrid .ca-edcard:first-child .ca-edcard__img{min-height:220px}
}
@media(max-width:460px){.ca-edgrid{grid-template-columns:1fr}}
.ca-edcard{display:block;background:#fff;border:1px solid var(--ca-border);border-radius:14px;overflow:hidden;box-shadow:var(--ca-shadow);text-decoration:none;color:inherit;transition:.2s}
.ca-edcard:hover{transform:translateY(-3px)}
.ca-edcard__img{display:block;height:120px;background:linear-gradient(150deg,var(--ca-amaranto),var(--ca-amaranto-ink));background-size:cover;background-position:center}
.ca-edcard__in{display:block;padding:14px 16px}
.ca-edcard__y{display:block;font-family:var(--ca-font-head);font-weight:400;font-size:24px;color:var(--ca-amaranto)}
.ca-edcard__v{display:block;font-size:13px;color:var(--ca-muted);margin-top:2px}

/* ---------- Embed responsive (video) ---------- */
.ca-embed{position:relative;max-width:900px}
.ca-embed iframe{width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:14px;box-shadow:var(--ca-shadow)}

/* ---------- CTA band ---------- */
.ca-ctaband{background:linear-gradient(150deg,var(--ca-amaranto),var(--ca-amaranto-ink));color:#fff;border-radius:var(--ca-radius-lg);padding:34px 38px;display:flex;align-items:center;gap:22px;flex-wrap:wrap;box-shadow:var(--ca-shadow)}
.ca-ctaband h3{font-family:var(--ca-font-head);color:#fff;font-size:24px;margin:0}
.ca-ctaband__cta{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap}

@media(max-width:820px){
  .ca-pagehero h1{font-size:38px}
  .ca-timeline::before{left:60px}
  .ca-tl{grid-template-columns:60px 1fr;gap:14px}
  .ca-tl__year{font-size:18px}
  .ca-ctaband__cta{margin-left:0;width:100%}
}

/* =========================================================================
   Fase 3.3 — PROGRAMMA (filtri + lista eventi + dettaglio)
   ========================================================================= */

/* countdown dentro l'hero pagina */
.ca-pagehero__cd{margin-top:22px}
.ca-pagehero__cd .ca-daterow .d{color:#fff}
.ca-pagehero__cd .ca-daterow .s{color:var(--ca-oro-light)}
.ca-pagehero__cd .ca-cd b{color:var(--ca-oro-light)}
.ca-pagehero__cd .ca-cd span{color:#c9bba7}

/* ---------- Barra filtri ---------- */
.ca-filters{display:flex;flex-wrap:wrap;gap:20px 34px;padding:0 0 26px;margin-bottom:8px;border-bottom:1px solid var(--ca-line)}
.ca-filtergroup{display:flex;flex-direction:column;gap:8px}
.ca-filtergroup__label{font-family:var(--ca-font-ui);font-size:11px;letter-spacing:1.4px;text-transform:uppercase;color:var(--ca-muted);font-weight:700}
.ca-chips{display:flex;flex-wrap:wrap;gap:8px}
/* CHIP di filtro — stessa forma dei bottoni. Il bordo usa --ca-line-strong: quello chiaro
   (1,35 su bianco) rendeva la pastiglia indistinguibile da un'etichetta. Selezionato = pieno. */
.ca-chip{font-family:var(--ca-font-ui);font-size:13px;font-weight:600;letter-spacing:.4px;text-transform:uppercase;padding:8px 15px;border-radius:var(--ca-radius-btn);border:1.5px solid var(--ca-line-strong);background:#fff;color:var(--ca-amaranto-dark);cursor:pointer;transition:.15s}
.ca-chip:focus,.ca-chip:active{background:#fff;color:var(--ca-amaranto-dark)}
/* I chip delle NEWS sono link e non pulsanti (0.7.58: il filtro interroga il database, v.
   ca_news_filter): serve solo togliere la sottolineatura e tenerli in riga, il resto lo eredita
   la classe .ca-chip. Il numero accanto al nome dice quanti articoli ci sono in quella
   categoria: e' scritto piu' piccolo perche' e' un'informazione di servizio, non l'etichetta. */
.ca-filters--link .ca-chip{display:inline-flex;align-items:center;gap:7px;text-decoration:none}
.ca-chip__n{font-size:11px;font-weight:600;opacity:.62;font-variant-numeric:tabular-nums}
/* Cambio categoria o pagina senza ricaricare (assets/news.js): mentre arriva la risposta la
   lista si smorza appena. Non uno spinner: il ricambio dura poche centinaia di millisecondi e
   una rotellina che appare e sparisce disturba piu' di quanto informi. Il puntatore diventa
   "attesa" e i click non passano, cosi' nessuno preme due volte. */
.ca-section.is-caricamento .ca-grid3,
.ca-section.is-caricamento .ca-pagination{opacity:.45;transition:opacity .15s;pointer-events:none}
.ca-section.is-caricamento{cursor:progress}
@media (prefers-reduced-motion:reduce){ .ca-section.is-caricamento .ca-grid3{transition:none} }
.ca-filters--link .ca-chip.is-active .ca-chip__n{opacity:.8}
.ca-chip:hover{border-color:var(--ca-amaranto);background:var(--ca-paper-2);color:var(--ca-amaranto-dark)}
.ca-chip.is-active,.ca-chip[aria-pressed="true"]{background:var(--ca-cta-bg);border-color:var(--ca-cta-bg);color:var(--ca-cta-text)}
.ca-chip.is-active:hover,.ca-chip.is-active:focus{background:var(--ca-cta-bg-hover);border-color:var(--ca-cta-bg-hover);color:var(--ca-cta-text)}
.ca-chip:disabled{background:var(--ca-paper-2);border-color:var(--ca-line);color:var(--ca-muted);cursor:not-allowed}

/* ---------- Lista per giornata ---------- */
.ca-programma{margin-top:26px}
.ca-daygroup{margin-bottom:30px}
.ca-daygroup__h{font-family:var(--ca-font-ui);font-size:15px;letter-spacing:1px;text-transform:uppercase;color:var(--ca-amaranto);font-weight:600;padding:0 0 10px;margin:0 0 8px;border-bottom:2px solid var(--ca-oro);
  /* Riga: nome della giornata a sinistra, comando di stampa a filo destro (0.7.53). */
  display:flex;align-items:baseline;justify-content:space-between;gap:12px}
/* Comando "PDF" della giornata: piccolo e in oro scuro, cosi' non compete col nome della
   giornata, che e' l'unico titolo della sezione. Le maiuscole e la spaziatura le eredita
   dall'h3 e vanno bene: e' la stessa famiglia di segnali.
   flex:0 0 auto perche' con nomi lunghi ("Domenica 27 settembre") il comando non deve
   stringersi ne' andare a capo. */
.ca-daypdf{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;
  font-size:11.5px;letter-spacing:.06em;color:var(--ca-oro-deep);text-decoration:none;
  border:1px solid var(--ca-line-strong);border-radius:999px;padding:5px 11px;
  transition:color .15s,border-color .15s,background .15s}
.ca-daypdf:hover{color:var(--ca-amaranto);border-color:var(--ca-amaranto);background:var(--ca-paper-2)}
.ca-daypdf svg{flex:0 0 auto}
@media(max-width:520px){
  /* Sul telefono il nome della giornata da solo riempie la riga: il comando resta, ma solo icona. */
  .ca-daypdf{padding:5px 8px}
  .ca-daypdf span{display:none}
}
.ca-erow{display:grid;grid-template-columns:74px 1fr auto auto;gap:16px;align-items:center;padding:14px 16px;background:#fff;border:1px solid var(--ca-border);border-radius:12px;margin-bottom:10px;text-decoration:none;color:inherit;transition:.15s;box-shadow:var(--ca-shadow-sm)}
.ca-erow:hover{border-color:var(--ca-amaranto);transform:translateX(2px)}
.ca-erow__time{font-family:var(--ca-font-ui);font-weight:600;font-size:18px;color:var(--ca-amaranto)}
/* Orario testuale ("a seguire", "dopo la 102"): stessa colonna da 74px, corpo piu' piccolo
   e a capo consentito, altrimenti sborda o schiaccia il titolo della prova. */
.ca-erow__time--txt{font-size:12px;font-weight:500;line-height:1.25}
.ca-erow__main{min-width:0}
.ca-erow__title{display:block;font-family:var(--ca-font-ui);font-weight:700;font-size:16px;color:var(--ca-amaranto-dark)}
.ca-erow__meta{display:block;font-size:13px;color:var(--ca-muted);margin-top:2px}
.ca-erow__prize{font-family:var(--ca-font-ui);font-weight:700;color:var(--ca-oro-deep);font-size:15px;white-space:nowrap}
.ca-erow__stato{font-family:var(--ca-font-ui);font-size:10.5px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;padding:5px 10px;border-radius:100px;white-space:nowrap}
.ca-stato--in_programma{background:var(--ca-paper-2);color:var(--ca-muted);border:1px solid var(--ca-line)}
.ca-stato--in_corso{background:var(--ca-live);color:#fff}
.ca-stato--conclusa{background:rgba(195,154,78,.18);color:var(--ca-oro-deep);border:1px solid var(--ca-oro)}

/* ---------- CTA area (download/diretta) ---------- */
.ca-progcta{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}

/* ---------- Tabella dettaglio prova ---------- */
.ca-detail{width:100%;max-width:620px;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--ca-border);border-radius:14px;overflow:hidden;box-shadow:var(--ca-shadow-sm)}
.ca-detail th,.ca-detail td{padding:12px 18px;text-align:left;border-bottom:1px solid var(--ca-line);font-size:15px}
.ca-detail th{font-family:var(--ca-font-ui);font-size:12px;letter-spacing:.5px;text-transform:uppercase;color:var(--ca-oro-deep);width:160px;font-weight:700}
.ca-detail tr:last-child th,.ca-detail tr:last-child td{border-bottom:none}

@media(max-width:640px){
  .ca-erow{grid-template-columns:56px 1fr;grid-template-areas:"time main" "stato prize";row-gap:8px}
  .ca-erow__time{grid-area:time}.ca-erow__main{grid-area:main}
  .ca-erow__prize{grid-area:prize}.ca-erow__stato{grid-area:stato;justify-self:start}
}

/* =========================================================================
   Fase 3.4 — EQUESTRIAN (live badge, info block, documenti)
   ========================================================================= */
.ca-livebadge{display:inline-flex;align-items:center;gap:8px;background:var(--ca-live);color:#fff;font-family:var(--ca-font-ui);font-weight:700;font-size:12px;letter-spacing:1px;text-transform:uppercase;padding:7px 14px;border-radius:100px;margin-bottom:14px}
.ca-pagehero__lead{max-width:680px;font-size:16px;color:#f0e2d0;font-weight:300;margin-top:10px}
.ca-pagehero__lead p{margin:0 0 10px}

.ca-infoblock{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.ca-infoblock .ca-prose{max-width:760px}

/* Lista documenti */
.ca-doclist{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;max-width:900px}
.ca-doc{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid var(--ca-border);border-radius:12px;padding:16px 18px;text-decoration:none;color:inherit;transition:.15s;box-shadow:var(--ca-shadow-sm)}
.ca-doc:hover{border-color:var(--ca-amaranto);transform:translateY(-2px)}
.ca-doc__ico{flex:0 0 38px;height:38px;border-radius:9px;background:var(--ca-amaranto);color:var(--ca-oro-light);display:flex;align-items:center;justify-content:center;font-family:var(--ca-font-ui);font-weight:700;font-size:18px}
.ca-doc__t{display:block;font-family:var(--ca-font-ui);font-weight:700;font-size:15px;color:var(--ca-amaranto-dark)}
.ca-doc__d{display:block;font-size:13px;color:var(--ca-muted);margin-top:2px}

@media(max-width:640px){ .ca-doclist{grid-template-columns:1fr} }

/* =========================================================================
   Fase 3.5 — PIANIFICA LA VISITA (mappa, espositori)
   ========================================================================= */
.ca-map{position:relative;border-radius:var(--ca-radius-lg);overflow:hidden;box-shadow:var(--ca-shadow);border:1px solid var(--ca-border)}
.ca-map iframe{width:100%;height:420px;border:0;display:block}
.ca-prose--wide{max-width:900px}

/* Espositori */
.ca-esp{display:flex;flex-direction:column;gap:10px;background:#fff;border:1px solid var(--ca-border);border-radius:14px;padding:18px;text-decoration:none;color:inherit;box-shadow:var(--ca-shadow-sm);transition:.15s}
.ca-esp:hover{border-color:var(--ca-amaranto);transform:translateY(-2px)}
.ca-esp__logo{display:flex;align-items:center;justify-content:center;height:70px}
.ca-esp__logo img{max-width:100%;max-height:60px;width:auto;height:auto}
.ca-esp__name{font-family:var(--ca-font-ui);font-weight:700;color:var(--ca-muted);font-size:15px;text-align:center}
.ca-esp__body{display:block;text-align:center}
.ca-esp__t{display:block;font-family:var(--ca-font-ui);font-weight:700;font-size:15px;color:var(--ca-amaranto-dark)}
.ca-esp__stand{display:block;font-size:12.5px;color:var(--ca-muted);margin-top:2px}

@media(max-width:640px){ .ca-map iframe{height:300px} }

/* =========================================================================
   Fase 3.6 — NEWS (in evidenza, paginazione)
   ========================================================================= */
.ca-featured{display:grid;grid-template-columns:1.2fr 1fr;gap:0;background:#fff;border:1px solid var(--ca-border);border-radius:16px;overflow:hidden;box-shadow:var(--ca-shadow);text-decoration:none;color:inherit;transition:.2s}
.ca-featured:hover{transform:translateY(-3px)}
.ca-featured__img{display:block;min-height:300px;background:linear-gradient(140deg,var(--ca-amaranto-dark),var(--ca-amaranto));background-size:cover;background-position:center}
.ca-featured__in{display:flex;flex-direction:column;justify-content:center;padding:32px 34px}
.ca-featured__k{font-family:var(--ca-font-ui);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--ca-oro-deep);font-weight:600}
.ca-featured__t{font-family:var(--ca-font-head);font-size:28px;line-height:1.12;color:var(--ca-amaranto);margin:8px 0 6px;font-weight:400}
.ca-featured__d{font-size:13px;color:var(--ca-muted)}
.ca-featured__x{font-size:15px;color:var(--ca-muted);margin-top:12px;line-height:1.55}

/* Paginazione */
.ca-pagination{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:34px}
.ca-pagination .page-numbers{font-family:var(--ca-font-ui);font-weight:700;font-size:14px;min-width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;padding:0 12px;border-radius:var(--ca-radius-btn);border:1.5px solid var(--ca-line-strong);background:#fff;color:var(--ca-amaranto-dark);text-decoration:none;transition:.15s}
.ca-pagination .page-numbers:focus{background:#fff;color:var(--ca-amaranto-dark)}
.ca-pagination .page-numbers:hover{border-color:var(--ca-amaranto);background:var(--ca-paper-2);color:var(--ca-amaranto-dark)}
.ca-pagination .page-numbers.current{background:var(--ca-cta-bg);border-color:var(--ca-cta-bg);color:var(--ca-cta-text)}
.ca-pagination .page-numbers.dots{border-color:transparent;background:transparent;color:var(--ca-muted)}

@media(max-width:640px){ .ca-featured{grid-template-columns:1fr} .ca-featured__img{min-height:180px} }

/* =========================================================================
   Fase 3.7 — AREA STAMPA (comunicati, form)
   ========================================================================= */
.ca-comunicati{display:flex;flex-direction:column;gap:12px;max-width:900px}
.ca-comrow{display:flex;gap:18px;align-items:center;justify-content:space-between;background:#fff;border:1px solid var(--ca-border);border-radius:12px;padding:18px 20px;box-shadow:var(--ca-shadow-sm)}
.ca-comrow__main{min-width:0}
.ca-comrow__d{display:block;font-family:var(--ca-font-ui);font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--ca-oro-deep);font-weight:700}
.ca-comrow__t{display:block;font-family:var(--ca-font-ui);font-weight:700;font-size:17px;color:var(--ca-amaranto-dark);text-decoration:none;margin:4px 0}
.ca-comrow__t:hover{color:var(--ca-cta-bg)}
.ca-comrow__x{display:block;font-size:14px;color:var(--ca-muted)}
.ca-comrow__act{display:flex;gap:10px;flex:0 0 auto;flex-wrap:wrap}
.ca-comrow .ca-btn{flex:0 0 auto;padding:9px 16px;font-size:12.5px}

/* Wrapper form: eredita i font del tema */
.ca-formwrap{max-width:760px}
.ca-formwrap input[type=text],.ca-formwrap input[type=email],.ca-formwrap textarea,.ca-formwrap select{font-family:var(--ca-font-body)}

/* ---------- MODULI (Fluent Forms) ----------
   I moduli arrivavano col vestito del plugin: testo a 17px e pulsante di invio piu' grande dei
   CTA del sito. 17px e' la misura del BODY, quindi non era sbagliata in assoluto, ma accanto ai
   componenti del tema — tabella recapiti 15px, comandi 14px — i campi sembravano ingranditi.
   Gli INPUT restano a 16px e non scendono oltre: sotto i 16px Safari su iPhone ingrandisce la
   pagina da solo quando si tocca un campo, e l'utente si ritrova il modulo fuori scala.
   Il selettore parte da .fluentform e non dal wrapper del tema: cosi' vale anche per un modulo
   messo domani in una pagina a blocchi, senza contenitore .ca-formwrap attorno. */
/* La classe RIPETUTA (.x.x) non e' un refuso: i fogli di Fluent Forms vengono accodati DOPO
   quelli del tema, quindi a parita' di specificita' vincono loro. Ripetere la classe alza il
   peso quel tanto che basta per passare davanti, senza spargere !important. */
.fluentform .ff-el-input--label.ff-el-input--label label{font-family:var(--ca-font-ui);font-size:15px;font-weight:600}
/* Il colore lo dichiariamo noi: senza, il testo digitato resta sul grigio freddo di Kadence
   (#2D3748), che non è in palette — il testo del sito è antracite. */
.fluentform .ff-el-form-control.ff-el-form-control{font-family:var(--ca-font-body);font-size:16px;color:var(--ca-ink)}
/* Il SUGGERIMENTO dentro il campo va piu' piccolo dell'etichetta (14 contro 15): e' un aiuto,
   non un dato, e a parita' di corpo con il testo vero si legge come se il campo fosse gia'
   compilato. Si scende solo sul placeholder, non sul campo: il testo che si DIGITA resta a 16px,
   ed e' quello a cui guarda Safari su iPhone per decidere se ingrandire la pagina. */
.fluentform .ff-el-form-control.ff-el-form-control::placeholder{font-size:14px;opacity:.75}
/* Il "- Seleziona -" di una tendina non e' un placeholder ma una voce vera, quindi il CSS di
   sopra non lo tocca: senza questa regola resterebbe l'unico suggerimento grande e a colore
   pieno in mezzo agli altri. Due strade perche' i menu sono di due tipi: quelli obbligatori
   sono :invalid finche' non si sceglie, gli altri si riconoscono dalla voce vuota selezionata.
   Appena si sceglie qualcosa il testo torna pieno, com'e' giusto: quello e' un dato. */
.fluentform select.ff-el-form-control.ff-el-form-control:invalid,
.fluentform select.ff-el-form-control.ff-el-form-control:has(option[value=""]:checked){font-size:14px;opacity:.75}
.fluentform .ff-el-form-check-label,.fluentform .ff-el-input--content .ff-el-form-check label{font-size:15px}
/* Caselle e pallini: spuntati erano BLU, il colore di sistema — l'ultimo blu rimasto sul sito.
   accent-color li porta sull'amaranto senza doverli ridisegnare a mano. */
.fluentform input[type=checkbox],.fluentform input[type=radio]{accent-color:var(--ca-amaranto)}
/* Nota GDPR / testo di servizio sotto i campi: piu' piccolo, come le didascalie del sito. */
.fluentform .ff-el-help-message{font-size:13px;color:var(--ca-muted)}

/* Il pulsante di invio prende la forma dei comandi del sito (stessa misura, stesso raggio,
   stesso colore azione). L'!important e' l'eccezione motivata: Fluent Forms stampa per OGNI
   modulo un <style> inline con il colore scelto nel builder — oggi #0E8A82, un verde deciso
   quando la palette non era ancora definitiva — e quel blocco sta in fondo al documento, quindi
   a parita' di specificita' vincerebbe lui. Il colore giusto resta comunque da togliere anche
   nel builder, altrimenti nell'editor dei moduli si continua a vedere il verde. */
.fluentform .ff-btn-submit.ff-btn-submit{
  font-family:var(--ca-font-ui);font-weight:700;font-size:14px;letter-spacing:.2px;
  padding:13px 24px;border-radius:var(--ca-radius-btn);border:2px solid transparent;
  background-color:var(--ca-cta-bg) !important;color:var(--ca-cta-text) !important;
  transition:background-color .15s,color .15s}
.fluentform .ff-btn-submit.ff-btn-submit:hover,.fluentform .ff-btn-submit.ff-btn-submit:focus{
  background-color:var(--ca-cta-bg-hover) !important;color:var(--ca-cta-text) !important}

@media(max-width:640px){ .ca-comrow{flex-direction:column;align-items:flex-start;gap:12px} }

/* =========================================================================
   Fase 3.8 — CONTATTI (griglia recapiti/modulo, rimandi)
   ========================================================================= */
.ca-contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:40px;align-items:start}
.ca-contact-col .ca-detail{max-width:none}
.ca-org{margin-top:14px;font-size:13px;color:var(--ca-muted);font-family:var(--ca-font-ui);font-weight:600}

.ca-rimandi{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.ca-rimando{display:block;background:#fff;border:1px solid var(--ca-border);border-left:4px solid var(--ca-oro);border-radius:12px;padding:18px 20px;text-decoration:none;box-shadow:var(--ca-shadow-sm);transition:.15s}
.ca-rimando:hover{transform:translateY(-2px);border-left-color:var(--ca-amaranto)}
.ca-rimando__t{display:block;font-family:var(--ca-font-ui);font-weight:600;font-size:17px;color:var(--ca-amaranto)}
.ca-rimando__d{display:block;font-size:13px;color:var(--ca-muted);margin-top:4px}

@media(max-width:820px){ .ca-contact-grid{grid-template-columns:1fr} .ca-rimandi{grid-template-columns:1fr 1fr} }
@media(max-width:480px){ .ca-rimandi{grid-template-columns:1fr} }

/* =========================================================================
   FOOTER brandizzato (inc/footer.php) — paper chiaro, muro sponsor a categorie.
   ========================================================================= */
.ca-ft{background:var(--ca-paper);border-top:2px solid var(--ca-oro);position:relative}
.ca-ft:before{content:"";position:absolute;top:2px;left:0;right:0;height:1px;background:var(--ca-line)}

/* --- muro sponsor --- */
.ca-ft-wall{padding:clamp(40px,6vw,60px) 0 clamp(34px,5vw,54px);border-bottom:1px solid var(--ca-line)}
/* DUE colonne per riga dalla 0.9.38 (Organizer|Main Partner, poi Partner|Technical Partner).
   Il numero di colonne deve corrispondere a quante categorie stanno nella riga in
   inc/footer.php: se una viene aggiunta o tolta di la', qui va rifatto il conto. */
.ca-ft-wall__top{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(28px,4vw,48px);margin-bottom:clamp(34px,5vw,50px)}
/* Colonne 2:1, non 1:1 — Partner ha 5 loghi e Technical Partner uno solo: a colonne
   uguali la seconda restava mezza vuota. align-items:start perche' la colonna corta non
   si stiri in altezza per pareggiare l'altra. */
.ca-ft-wall__mid{display:grid;grid-template-columns:2fr 1fr;gap:clamp(28px,4vw,48px);align-items:start;margin-bottom:clamp(32px,4vw,48px)}
.ca-ft-wall__bot{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(28px,4vw,48px);max-width:940px;margin:0 auto}
.ca-ft-cat__lab{display:block;text-align:center;font-family:var(--ca-font-head);font-weight:300;font-size:clamp(18px,2.4vw,22px);color:var(--ca-ink);padding-bottom:16px;border-bottom:1px solid var(--ca-ink);letter-spacing:.2px}
/* Muro sponsor: una sola riga per categoria (no wrap) + altezza loghi uniforme.
   I loghi larghi si restringono (flex-shrink) invece di andare a capo. */
.ca-ft-logos{display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;gap:clamp(16px,2.4vw,28px);padding-top:28px}
.ca-ft-logolink{display:inline-flex;flex:0 1 auto;min-width:0}
/* PESO OTTICO DEI LOGHI — vedi ca_logo_forma() in inc/helpers.php.
   Vincolare la sola altezza li rende alti uguali ma non equivalenti: l'occhio legge l'AREA, e coi
   file reali un logo lungo pesava 3,5 volte un logo quadrato. Qui l'altezza dipende dalla FORMA
   (--h), la fascia resta alta uguale per tutti (60px) e i loghi si centrano dentro. --k e' il
   moltiplicatore delle categorie piu' importanti. Senza classe (SVG, che WordPress non misura)
   si resta alla misura standard. */
.ca-ft-logo{--h:44px;--k:1;height:66px;flex:0 1 auto;min-width:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:0}
.ca-ft-logo img{max-height:calc(var(--h) * var(--k));max-width:100%;width:auto;height:auto;object-fit:contain;display:block}
.ca-ft-logo--xwide{--h:34px}   /* rapporto >= 3,0 — es. ILS 3,45 */
.ca-ft-logo--wide{--h:38px}    /* 2,2 - 3,0 */
.ca-ft-logo--std{--h:44px}     /* 1,7 - 2,2 */
.ca-ft-logo--largo{--h:50px}   /* 1,25 - 1,7 */
.ca-ft-logo--square{--h:56px}  /* 0,85 - 1,25 — es. Ministero, Comune */
.ca-ft-logo--tall{--h:60px}    /* < 0,85 — es. Mercedes verticale */
/* Tela standard 700x400: piu' alta perche' il 25% e' margine dentro al file, non logo. */
.ca-ft-logo--tela{--h:62px}
.ca-ft-logo__txt{font-family:var(--ca-font-ui);font-weight:700;font-size:12.5px;color:var(--ca-muted);line-height:1.15;letter-spacing:.3px}
.ca-ft-logo.is-ph{min-width:84px;border:1px dashed var(--ca-line);border-radius:8px;background:#fff}
.ca-ft-logolink:hover .ca-ft-logo__txt{color:var(--ca-amaranto)}
.ca-ft-cat--main .ca-ft-logos{gap:22px}
.ca-ft-cat--main .ca-ft-logo{--k:1.2;height:80px}

/* --- colonne --- */
.ca-ft-grid{display:grid;grid-template-columns:1.4fr 1fr 1.2fr 1.3fr;gap:clamp(28px,4vw,44px);padding:clamp(40px,5vw,58px) 0 clamp(36px,4vw,50px)}
.ca-ft-mark{font-family:var(--ca-font-head);font-weight:300;font-size:29px;color:var(--ca-amaranto);line-height:1;margin:0 0 12px}
.ca-ft-brandlogo{display:inline-block;line-height:0;margin:0 0 16px}
.ca-ft-brandlogo__img{height:96px;width:auto;display:block}
.ca-ft-brand p{font-size:14px;color:var(--ca-muted);max-width:280px;margin:0 0 20px}
.ca-ft-col h4{font-family:var(--ca-font-ui);font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--ca-muted);margin:0 0 18px}
.ca-ft-col ul{list-style:none;margin:0;padding:0}
.ca-ft-col li{margin:0 0 11px}
.ca-ft-col li a{font-size:14.5px;color:var(--ca-ink);transition:.15s}
.ca-ft-col li a:hover{color:var(--ca-amaranto)}
.ca-ft-info div{font-size:14px;color:var(--ca-ink);margin:0 0 12px;line-height:1.5}
.ca-ft-lab{display:block;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--ca-oro-deep);font-weight:700;margin-bottom:2px}
.ca-ft-info a:hover{color:var(--ca-amaranto)}
.ca-ft-news p{font-size:14px;color:var(--ca-muted);margin:0 0 16px}
.ca-ft-nl{display:flex;gap:8px;margin-bottom:26px}
.ca-ft-nl input{flex:1;min-width:0;padding:12px 14px;border:1px solid var(--ca-line);border-radius:9px;background:#fff;font-family:var(--ca-font-ui);font-size:14px;color:var(--ca-ink)}
.ca-ft-nl input::placeholder{color:#a99f97}
.ca-ft-nl button{background:var(--ca-amaranto);color:#fff;border:none;border-radius:9px;padding:0 18px;font-family:var(--ca-font-ui);font-weight:600;font-size:13px;cursor:pointer;transition:.15s;white-space:nowrap}
.ca-ft-nl button:hover{background:var(--ca-amaranto-dark)}
.ca-ft-cta{display:block;background:var(--ca-amaranto);color:#fff;text-align:center;padding:14px 18px;border-radius:10px;font-family:var(--ca-font-ui);font-weight:600;font-size:14px;transition:.15s;text-decoration:none}
.ca-ft-cta:hover{background:var(--ca-amaranto-dark);color:#fff}
.ca-ft-cta small{display:block;font-weight:400;font-size:11.5px;opacity:.85;margin-top:2px}
/* Telefono del footer su riga propria sotto l'email (0.7.47). display:block e non un <br>
   perche' cosi' l'area cliccabile e' tutta la riga: sul telefono il bersaglio del dito diventa
   alto quanto la riga invece che alto quanto il testo. */
.ca-ft-tel{display:block;margin-top:2px}

/* --- barra finale --- */
.ca-ft-bottom{background:var(--ca-paper-2);border-top:1px solid var(--ca-line)}
.ca-ft-bottom__in{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;padding:20px 0}
.ca-ft-copy{font-size:12.5px;color:var(--ca-muted)}
.ca-ft-legal{display:flex;align-items:center;gap:20px;font-size:12.5px}
.ca-ft-legal a{color:var(--ca-muted)}
.ca-ft-legal a:hover{color:var(--ca-amaranto)}

@media(max-width:860px){
  .ca-ft-grid{grid-template-columns:1fr 1fr}
  .ca-ft-wall__top,.ca-ft-wall__mid,.ca-ft-wall__bot{grid-template-columns:1fr;gap:34px}
}
@media(max-width:560px){
  .ca-ft-grid{grid-template-columns:1fr}
  .ca-ft-bottom__in{flex-direction:column;align-items:flex-start}
}

/* Footer — social a icone (SVG) */
.ca-ft-social{display:flex;gap:10px}
.ca-ft-social a{width:38px;height:38px;border:1px solid var(--ca-line);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--ca-amaranto);background:#fff;transition:.15s;text-decoration:none}
.ca-ft-social a:hover{background:var(--ca-amaranto);color:#fff;border-color:var(--ca-amaranto)}
.ca-ft-social svg{width:18px;height:18px;display:block}

/* =========================================================================
   EDIZIONE (Variante A, v0.4.4) — mosaico foto anteprima + lightbox
   ========================================================================= */
.ca-gal{display:grid;gap:12px;grid-template-columns:repeat(4,1fr);grid-auto-rows:150px}
.ca-gal .g0{grid-column:span 2;grid-row:span 2}
.ca-gal figure{margin:0;border-radius:12px;overflow:hidden;position:relative;cursor:pointer;background:var(--ca-amaranto-ink)}
.ca-gal img{width:100%;height:100%;object-fit:cover;transition:.3s}
.ca-gal figure:hover img{transform:scale(1.05)}
.gal-actions{margin-top:24px}

/* Lightbox a schermo intero */
.ca-lb{position:fixed;inset:0;background:rgba(20,10,13,.95);z-index:1000;display:none;flex-direction:column}
.ca-lb.on{display:flex}
.ca-lb__top{display:flex;justify-content:space-between;align-items:center;padding:16px 22px;color:#fff}
.ca-lb__count{font-family:var(--ca-font-ui);font-size:13px;letter-spacing:1px;color:var(--ca-oro-light)}
.ca-lb__x{background:transparent;border:0;color:#fff;font-size:30px;line-height:1;cursor:pointer}
.ca-lb__stage{flex:1;display:flex;align-items:center;justify-content:center;gap:14px;padding:0 14px 22px;min-height:0}
.ca-lb__img{max-width:min(1100px,92vw);max-height:82vh;border-radius:8px;box-shadow:0 30px 80px -20px rgba(0,0,0,.6)}
.ca-lb__nav{background:rgba(255,255,255,.12);border:0;color:#fff;width:52px;height:52px;border-radius:999px;font-size:26px;line-height:1;cursor:pointer;flex:0 0 auto;transition:.15s}
.ca-lb__nav:hover{background:var(--ca-oro-light);color:var(--ca-amaranto-ink)}

@media(max-width:820px){
  .ca-gal{grid-template-columns:repeat(2,1fr)}
  .ca-gal .g0{grid-column:span 2;grid-row:span 1}
  .ca-lb__nav{width:44px;height:44px}
}

/* Embed video (YouTube) dentro gli articoli (.ca-prose) — responsive 16:9 */
.ca-prose iframe{width:100%;max-width:760px;aspect-ratio:16/9;height:auto;border:0;border-radius:12px;display:block;margin:22px 0;box-shadow:var(--ca-shadow)}
.ca-prose .wp-block-embed,.ca-prose figure{margin:22px 0}
.ca-prose .wp-block-embed__wrapper{position:relative}

/* Galleria interna agli articoli (recuperata dal vecchio sito) — griglia 3 col + "Guarda tutte" */
.ca-artgal{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:26px 0}
.ca-artgal a{display:block;aspect-ratio:3/2;border-radius:10px;overflow:hidden;background:var(--ca-amaranto-ink)}
.ca-artgal img{width:100%;height:100%;object-fit:cover;transition:.3s}
.ca-artgal a:hover img{transform:scale(1.06)}
/* Collassata: 4 righe piene + 5ª riga sfumata (il resto nascosto finché non si espande) */
/* ---------- COLLASSO A DUE RIGHE (griglie di card) ---------- */
/* Stesso gesto della galleria, applicato alle griglie di articoli che il chiamante marca con
   .ca-collapse (oggi: le news nella pagina di un'edizione, che sono tutte quelle dell'anno).
   Il numero di elementi visibili segue le colonne, che cambiano ai due breakpoint di .ca-grid3:
   3 colonne -> 9 card, 2 colonne -> 6, 1 colonna -> 3. Sempre due righe piene + una che sfuma. */
.ca-collapse.is-collapsed{-webkit-mask-image:linear-gradient(#000 68%,transparent);mask-image:linear-gradient(#000 68%,transparent)}
.ca-collapse.is-collapsed > *:nth-child(n+10){display:none}
@media(max-width:900px){ .ca-collapse.is-collapsed > *:nth-child(n+7){display:none} }
@media(max-width:560px){ .ca-collapse.is-collapsed > *:nth-child(n+4){display:none} }
.ca-collapse-more{display:flex;justify-content:center;margin:18px 0 0}

/* Collasso: DUE righe piene + la terza che sfuma. A 3 colonne sono 9 foto (6 in chiaro),
   e la maschera parte al 68% cosi' il velo cade sulla terza riga e non morde la seconda. */
.ca-artgal.is-collapsed{-webkit-mask-image:linear-gradient(#000 68%,transparent);mask-image:linear-gradient(#000 68%,transparent)}
.ca-artgal.is-collapsed a:nth-child(n+10){display:none}
.ca-artgal-more{display:flex;justify-content:center;margin:-14px 0 26px}
/* Sul telefono le colonne sono 2: perche' le righe in chiaro restino due, gli elementi
   visibili scendono da 9 a 6 (altrimenti 9 foto farebbero quattro righe e mezza). */
@media(max-width:520px){
  .ca-artgal{grid-template-columns:repeat(2,1fr)}
  .ca-artgal.is-collapsed a:nth-child(n+7){display:none}
}

/* Difesa tipografia: neutralizza stili inline residui nel corpo degli articoli importati */
.ca-prose [style]{font-family:inherit!important;font-size:inherit!important;line-height:inherit!important;color:inherit!important;background:transparent!important}
.ca-prose font{font:inherit!important;color:inherit!important}

/* Header Kadence: respiro verticale sulla riga header.
   NB: in questa versione di Kadence la classe è ...-inner (non ...-in). */
div.site-header-row-container-inner{
  padding-top:12px;
  padding-bottom:12px;
}

/* Header STICKY: la barra di navigazione resta in cima allo scroll (la topbar commerciale scorre via) */
#masthead{position:sticky;top:0;z-index:100}
/* Da loggati: non finire sotto la admin bar WP (fissa da 783px in su) */
@media screen and (min-width:783px){.admin-bar #masthead{top:32px}}

/* 404: riga di scorciatoie sotto la CTA "Torna alla home" */
.ca-404links{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:16px}

/* Menu principale (desktop): voci top-level maiuscole.
   14px e non 15: il punto in meno libera i ~47px che servono ai loghi main partner in coda alla
   riga, e permette di tenere le etichette intere ("Pianifica la tua visita" non diventa "Visita"). */
.header-navigation .primary-menu-container .menu > li > a{
  font-size:14px;
  text-transform:uppercase;
}

/* ---- Riga header desktop: menu accanto al logo, main partner a filo destro ----
   Kadence dichiara `.site-header-row{display:grid;grid-template-columns:auto auto}`: due tracce
   entrambe elastiche, quindi lo spazio che avanza viene spartito a meta' e ne cade altrettanto
   DOPO il logo quanto PRIMA del menu (misurati ~70+70px su finestra da 1900px). Non e' un margine
   del logo: e' stiramento della griglia, e infatti non si toglie agendo sull'immagine.
   Qui la traccia sinistra torna a misura di contenuto (il logo) e tutto il residuo passa a destra;
   dentro, il menu parte da sinistra e la voce dei main partner si stacca a fine riga con
   margin-left:auto — resta ancorata al bordo destro del contenuto qualunque sia la larghezza.
   Il distacco dal logo e' elastico e non fisso: sotto i 1280px i loghi partner spariscono
   (v. piu' avanti) e in quella fascia il menu ha bisogno di tutta la riga. */
.site-main-header-inner-wrap.site-header-row-has-sides.site-header-row-no-center{
  grid-template-columns:auto minmax(0,1fr);
}
.site-header-main-section-right{ justify-content:flex-start; }

/* ---- LARGHEZZA DEL LOGO BRAND ----
   Il Customizer di Kadence ragiona in LARGHEZZA (stampa `.site-branding a.brand img{max-width}`
   in un <style> nel <head>, quindi dopo questo foglio: serve la doppia classe per vincere di
   specificita', non un !important).
   Il valore del Customizer e' 90px, misura nata quando il logo era il TONDO, cioe' quadrato:
   90 di larghezza erano anche 90 di altezza. Dal logo dei 50 anni (agosto 2026) il marchio e'
   orizzontale 1,31:1, e a 90px di larghezza sarebbe alto 69 — il brand nell'header risulterebbe
   PIU' PICCOLO di prima proprio mentre cambia. A 125px torna alto 96, come il tondo di prima.
   Il tetto e' la riga, non il gusto: il logo sta nella traccia sinistra e ogni pixel che prende
   lo toglie al menu. Misurati: 110px -> 37px di residuo, 125px -> 22px, 140px -> 7px (rotto).
   Se un domani il Customizer viene riportato in pari, questa regola si puo' togliere. */
.site-branding a.brand img.custom-logo{ max-width:125px; }

/* Sul telefono il marchio scende a 105px (logo reso 105x80). Non e' una questione di spazio —
   accanto all'hamburger ne avanzano quasi 200 — ma di proporzione: a 125px l'header mobile
   valeva 120px e, con la fascia partner sotto, la prima schermata partiva con 172px di
   intestazione. A 105 la riga torna a 104px, la stessa altezza che aveva prima del cambio logo.
   Sotto i 105 non conviene: l'header ha comunque un minimo di 104px (lo dettano il bottone del
   menu e i suoi margini), quindi da li' in giu' si rimpicciolisce il marchio senza guadagnare
   nulla — misurato: a 95px l'header resta 104. */
@media (max-width:1279px){
  #mobile-header .site-branding a.brand img.custom-logo{ max-width:105px; }
}
/* Il distacco fra logo e prima voce di menu, accorciato due volte: era clamp(16,2.5vw,48) fino
   alla 0.7.36, clamp(12,1.6vw,28) con l'ingrandimento dei main partner (0.7.37), ora
   clamp(10,1vw,20) da quando il logo brand e' largo 125 e non piu' 90 (0.7.40).
   E' la riserva da cui si attinge ogni volta che qualcosa nella riga deve crescere: a 1920 il
   vuoto dopo il logo valeva 48px, piu' del doppio dello stacco fra due voci di menu, e si
   leggeva come un buco. A 19-20px il logo e la prima voce restano staccati ma nella stessa
   frase. Sotto non si scende: diventerebbero attaccati. */
.site-header-main-section-right > .site-header-item-main-navigation{
  flex:1 1 auto; min-width:0;
  padding-left:clamp(10px, 1vw, 20px);
}
.site-header-main-section-right .main-navigation,
.site-header-main-section-right .primary-menu-container,
.site-header-main-section-right .primary-menu-container > ul.menu{ width:100%; }
.site-header-main-section-right .primary-menu-container > ul.menu > li.ca-hdrp-item{ margin-left:auto; }

/* ---- MAIN PARTNER in coda alla navigazione (inc/topbar.php) ----
   Entrano come ultima voce del menu: nessuna fascia in piu', nessuna altezza aggiunta.
   Il filetto verticale dice "qui finisce il sito e comincia chi lo sostiene".
   A COLORI e sempre uguali: nessun grigio a riposo, nessun cambio al passaggio del mouse (scelta
   utente). I main partner si vedono per come sono, e la riga resta identica su mouse e touch. */
.ca-hdrp-item{ display:flex; align-items:center; }
.ca-hdrp-item > a{ display:none; } /* la voce non e' un link: non deve comportarsi da menu */
/* Aria PRIMA della dimensione: con gap 10 e stacco 14 i tre loghi si leggevano come un blocco
   unico appiccicato all'ultima voce di menu. Dalla 0.7.37 gap 14 e stacco 18 — costa una
   quindicina di pixel di riga e restituisce tre marchi distinti invece di una macchia. */
.ca-hdrp{
  display:flex; align-items:center; gap:14px;
  margin-left:18px; padding-left:18px;
  border-left:1px solid var(--ca-line-strong);
}
.ca-hdrp__link{ display:inline-flex; align-items:center; }
.ca-hdrp__logo{ display:inline-flex; align-items:center; }
.ca-hdrp__logo img{
  width:auto; height:auto; max-width:none; display:block;
}

/* Altezze per FORMA, non uguali per tutti: i tre loghi hanno rapporti da 0,81 a 3,47 e a pari
   altezza il piu' lungo peserebbe quattro volte il piu' alto. Cosi' occupano la stessa area. */
/* Altezze ELASTICHE, non fisse: un menu che va a capo spaccherebbe l'header, quindi con clamp()
   i loghi si stringono da soli quando la finestra si restringe, invece di spingere. Il minimo e'
   la soglia di leggibilita', il massimo la misura calcolata a peso ottico uguale.
   TETTI +30% dalla 0.7.37 (erano 21/24/26/32/36/42/30), su misura fatta a schermo e non a stima:
   il vuoto fra "CONTATTI" e la terna era 92px a 1920, 96px a 1280, 104-113px in mezzo — il
   collo di bottiglia e' lo schermo LARGO, non la fascia stretta, perche' il contenuto
   dell'header vive in un container a larghezza fissa (1242px) mentre il padding del menu e'
   elastico. Con questi tetti restano 52-57px liberi a ogni misura, il menu sta su una riga e
   l'header NON cresce: la riga e' alta 114px per via del logo brand (90px), e i main partner
   arrivano al massimo a 54. Verticalmente c'e' margine fino a ~86px; il limite e' orizzontale.
   Sopra il +30% si passa a 26px di residuo (provato): troppo poco per reggere una voce di menu
   in piu' o un'etichetta EN piu' lunga. */
.ca-hdrp__logo--xwide img{ max-height:clamp(16px, 1.9vw, 27px) }  /* Randazzo, 3,47 */
.ca-hdrp__logo--wide img{ max-height:clamp(18px, 2.2vw, 31px) }
.ca-hdrp__logo--std img{ max-height:clamp(20px, 2.4vw, 34px) }
.ca-hdrp__logo--largo img{ max-height:clamp(24px, 2.9vw, 41px) }  /* Tasca, 1,47 */
.ca-hdrp__logo--square img{ max-height:clamp(27px, 3.3vw, 46px) }
.ca-hdrp__logo--tall img{ max-height:clamp(32px, 3.8vw, 54px) }   /* Mercedes verticale, 0,81 */
.ca-hdrp__logo--tela img{ max-height:clamp(23px, 2.8vw, 39px) }   /* non ritagliato: 25% e' margine */

/* ---- FASCIA MAIN PARTNER (mobile e tablet) ----
   Stampata dentro <header id="masthead"> via 'kadence_mobile_header', quindi eredita lo sticky:
   resta in cima allo scorrimento senza calcoli sull'altezza dell'header.
   A COLORI come la riga desktop (dalla 0.7.22 le due versioni sono coerenti: nessun grigio, nessun
   hover). Un filetto oro sopra la stacca dalla navigazione.
   Dalla 0.7.38 SENZA ETICHETTA scritta (l'ha tolta il PHP, v. inc/topbar.php): sul telefono la
   riga e' corta e "MAIN PARTNER" si prendeva 87px dei 375 disponibili, cioe' quasi un quarto,
   spingendo la terna fuori asse. Tolta la scritta i tre loghi sono davvero centrati e il gap
   puo' essere generoso: da clamp(10,3vw,18) a clamp(24,8vw,44) — misurati 26px a 320, 31 a 390,
   44 (tetto) da 550 in su. */
.ca-hdrb{ display:none }
@media (max-width:1279px){
  .ca-hdrb{
    display:flex; align-items:center; justify-content:center; gap:clamp(24px,8vw,44px);
    background:var(--ca-paper-2); border-top:1px solid var(--ca-oro-light);
    padding:6px clamp(14px,4vw,24px);
  }
  .ca-hdrb__link{ display:inline-flex; align-items:center; }
  .ca-hdrb__logo{ display:inline-flex; align-items:center; }
  .ca-hdrb__logo img{ width:auto; height:auto; max-width:none; display:block; }
  /* Stesse forme della riga desktop, +30% dalla 0.7.39 (erano 18/20/22/25/28/30/24) per stare
     al passo con l'ingrandimento fatto sul desktop nella 0.7.37. Il posto c'e': tolta
     l'etichetta, a 320px — il caso peggiore — la terna misura ~159px piu' due gap, su 292px
     utili. La fascia passa da 43 a ~52px di altezza: e' l'unica cosa che cresce. */
  .ca-hdrb__logo--xwide img{ max-height:23px }
  .ca-hdrb__logo--wide img{ max-height:26px }
  .ca-hdrb__logo--std img{ max-height:29px }
  .ca-hdrb__logo--largo img{ max-height:32px }
  .ca-hdrb__logo--square img{ max-height:36px }
  .ca-hdrb__logo--tall img{ max-height:39px }
  .ca-hdrb__logo--tela img{ max-height:31px }
}
/* ---- HAMBURGER A FILO DESTRO (header mobile) ----
   Kadence usa la STESSA classe .site-header-main-section-right nella riga desktop e nell'header
   mobile. La regola che nella riga desktop fa partire il menu da sinistra (piu' sopra, senza
   media query) tracimava quindi sul telefono e incollava il bottone del menu al logo: sezione
   larga 237px su 375, con il toggle all'inizio invece che alla fine.
   Qui la sezione mobile torna ad allineare a destra. Regola mirata su #mobile-header, cosi' la
   riga desktop resta intatta. Se un domani si tocca il justify-content della sezione destra,
   ricordarsi che vale per due header diversi. */
@media (max-width:1279px){
  #mobile-header .site-header-main-section-right{ justify-content:flex-end; }
}

/* Soglia a 1280px e non a 1024: fra le due misure il menu a 14px occupa gia' quasi tutta la riga,
   e i loghi entrerebbero solo a costo di diventare illeggibili. Meglio non mostrarli che mostrarli
   a 12px. Sotto, resta il muro sponsor del footer. */
@media (max-width:1279px){ .ca-hdrp-item{ display:none } }

/* ===== POPUP della prova (pagina Programma) — assets/evento.js =====
   Il <dialog> nativo fa da solo trappola del fuoco, sfondo inerte e chiusura con ESC: qui c'e'
   solo l'aspetto. Su desktop e' una scheda al centro; sul telefono un pannello che sale dal basso,
   perche' li' i comandi devono stare sotto il pollice e dietro si deve continuare a intravedere la
   lista — e' quello che dice "non hai cambiato pagina". */

/* La scheda vive nascosta dentro la lista (la clona il JS). Doppia cintura con [hidden]. */
/* ---------- SCHEDA PROVA: coppie etichetta/valore ---------- */
/* Stesso aspetto della vecchia .ca-detail (riquadro bianco, etichette oro, filetti), ma su
   griglia: due colonne su schermo largo, una sul telefono. Vale sia nel popup del Programma
   sia nella pagina della singola prova, che usano la stessa funzione. */
/* I filetti orizzontali sono lo SFONDO del riquadro che traspare dalle fessure fra le righe
   (row-gap 1px), non bordi sulle celle: cosi' non resta mai una riga di troppo in fondo,
   qualunque sia il numero di voci — che cambia da prova a prova, perche' le righe vuote si
   saltano. Fra etichetta e valore la fessura non c'e' (column-gap 0). */
.ca-evdata{
  display:grid; grid-template-columns:auto 1fr; row-gap:1px; column-gap:0; margin:14px 0 0;
  background:var(--ca-line); border:1px solid var(--ca-border); border-radius:14px;
  overflow:hidden; box-shadow:var(--ca-shadow-sm);
}
.ca-evdata dt{
  background:#fff;
  font-family:var(--ca-font-ui); font-size:12px; letter-spacing:.5px; text-transform:uppercase;
  color:var(--ca-oro-deep); font-weight:700; padding:11px 14px 11px 18px;
}
.ca-evdata dd{
  background:#fff; margin:0; padding:11px 18px 11px 0; font-size:15px;
}

/* "Aggiungi al calendario" nella scheda della prova: icona + testo piccolo, non un bottone.
   Non e' l'azione principale della scheda — quella resta leggere i dettagli della prova — ma
   deve restare toccabile col pollice: da qui min-height 34px, che e' il vero motivo
   dell'inline-flex. Il colore e' l'amaranto solo al passaggio: a riposo resta grigio testo,
   cosi' non compete con Start list e Risultati, che sono i comandi veri. */
.ca-evcal{ margin:14px 0 0 }
.ca-evcal a{
  display:inline-flex; align-items:center; gap:7px; min-height:34px;
  font-family:var(--ca-font-ui); font-size:13px; color:var(--ca-muted);
  text-decoration:none; transition:color .15s;
}
.ca-evcal a:hover{ color:var(--ca-amaranto) }
.ca-evcal__ico{ flex:0 0 auto; opacity:.85 }

.ca-evdet{ display:none }

dialog.ca-evmodal{
  padding:0; border:0; background:transparent; color:var(--ca-text);
  /* Largo: la scheda di una prova FEI arriva a 14 voci e in colonna singola diventava una
     striscia verticale piu' alta dello schermo. Piu' larghezza = meta' altezza. */
  width:100%; max-width:min(860px, calc(100% - 32px));
}
dialog.ca-evmodal::backdrop{ background:rgba(42,15,20,.55) }  /* amaranto-ink velato */

.ca-evmodal__box{
  position:relative;
  background:var(--ca-paper);
  border:1px solid var(--ca-border);
  border-radius:var(--ca-radius-lg);
  box-shadow:var(--ca-shadow);
  padding:26px 26px 24px;
}
.ca-evmodal__grip{ display:none }
.ca-evmodal__x{
  position:absolute; top:10px; right:12px;
  width:34px; height:34px; line-height:1; font-size:22px;
  display:flex; align-items:center; justify-content:center;
  background:transparent; border:1px solid transparent; border-radius:var(--ca-radius-btn);
  color:var(--ca-muted); cursor:pointer;
}
.ca-evmodal__x:hover{ border-color:var(--ca-line-strong); color:var(--ca-amaranto) }

.ca-evmodal__body .ca-evdet__ey{
  display:block; font-family:var(--ca-font-ui); font-size:11px;
  letter-spacing:.14em; text-transform:uppercase; color:var(--ca-oro-deep); margin-bottom:6px;
}
.ca-evmodal__body .ca-evdet__title{
  font-family:var(--ca-font-head); font-weight:200; line-height:1.15;
  font-size:clamp(23px, 2.6vw, 29px); color:var(--ca-amaranto);
  margin:0 0 10px; padding-right:34px;  /* non finire sotto la X */
}
.ca-evmodal__body .ca-erow__stato{ display:inline-block }
.ca-evmodal__body .ca-detail{ max-width:none; margin-top:14px }
/* Due coppie per riga quando c'e' spazio: etichetta, valore, etichetta, valore.
   Il filetto verticale separa le due metà (i dt di destra sono il 3°, 7°, 11° figlio). */
@media (min-width:760px){
  .ca-evmodal__body .ca-evdata{ grid-template-columns:auto 1fr auto 1fr }
  .ca-evmodal__body .ca-evdata dt:nth-child(4n+3){ border-left:1px solid var(--ca-line) }
  .ca-evmodal__body .ca-evdata dd{ padding-right:14px }
}
.ca-evmodal__body .ca-evdet__cta{ display:flex; flex-wrap:wrap; gap:10px; margin-top:18px }

@media (max-width:720px){
  dialog.ca-evmodal{
    max-width:none; width:100%;
    position:fixed; inset:auto 0 0 0; margin:0;
  }
  .ca-evmodal__box{
    border-radius:var(--ca-radius-lg) var(--ca-radius-lg) 0 0;
    border-bottom:0; padding:22px 18px calc(20px + env(safe-area-inset-bottom));
    max-height:85vh; overflow:auto;
  }
  .ca-evmodal__grip{
    display:block; position:absolute; top:8px; left:50%; transform:translateX(-50%);
    width:42px; height:4px; border-radius:100px; background:var(--ca-line);
  }
}

/* L'animazione e' un di piu': chi ha chiesto meno movimento al sistema non la vede. */
@media (prefers-reduced-motion:no-preference){
  dialog.ca-evmodal[open]{ animation:ca-evmodal-in .18s ease-out }
  @keyframes ca-evmodal-in{
    from{ opacity:0; transform:translateY(10px) }
    to{ opacity:1; transform:none }
  }
}

/* ===== Timeline "La storia" — serpente (ca_timeline) ===== */
.ca-tl-snake{position:relative; padding:0 52px 8px;}
/* Collasso: si vede la prima riga, il resto sfuma; il pulsante espande (timeline.js) */
.ca-tl-snake.is-collapsed{overflow:hidden;-webkit-mask-image:linear-gradient(#000 80%,transparent);mask-image:linear-gradient(#000 80%,transparent)}
.ca-tl-more{display:flex;justify-content:center;margin-top:26px}
.ca-tl-line{position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; z-index:0;}
.ca-tl-row{display:flex; gap:26px; align-items:stretch; margin-bottom:52px; position:relative; z-index:1;}
.ca-tl-row.is-rev{flex-direction:row-reverse;}
.ca-tl-row:last-child{margin-bottom:0;}
.ca-tl-st{flex:1 1 0; min-width:0; background:#fff; border:1px solid var(--ca-line); border-radius:16px;
  padding:20px 22px 22px; box-shadow:0 14px 34px -26px rgba(42,15,20,.55); position:relative;}
.ca-tl-st::before{content:""; position:absolute; top:50%; left:-9px; transform:translateY(-50%);
  width:15px; height:15px; border-radius:50%; background:var(--ca-amaranto); box-shadow:0 0 0 4px var(--ca-paper); z-index:2;}
.ca-tl-st__period{font-family:var(--ca-font-head); font-weight:500; font-size:38px; line-height:1.02;
  color:var(--ca-oro-deep); letter-spacing:.005em; margin-bottom:2px;}
.ca-tl-st__title{font-family:var(--ca-font-head); font-weight:500; color:var(--ca-amaranto);
  line-height:1.16; font-size:21px; margin:8px 0 9px;}
.ca-tl-st__text{color:var(--ca-ink); font-size:14.5px; line-height:1.6;}
.ca-tl-st__text p{margin:0 0 .5em;}
.ca-tl-st__text p:last-child{margin-bottom:0;}
.ca-tl-st__more{display:inline-block; margin-top:6px; color:var(--ca-amaranto); font-weight:600;
  font-size:13.5px; text-underline-offset:3px;}
@media (max-width:980px){ .ca-tl-snake{padding:0 34px 8px;} .ca-tl-st__period{font-size:32px;} .ca-tl-st__title{font-size:20px;} }
@media (max-width:620px){ .ca-tl-snake{padding:0 16px 8px;} .ca-tl-row{gap:0; margin-bottom:26px;} }

/* =========================================================================
   PAGINE A BLOCCHI (Gutenberg controllato) — v0.5.0
   Mappa il markup core (wp-block-group / wp-block-columns) sulle classi .ca-*.
   Tutto sotto .ca-blocks: le pagine a template PHP non vengono toccate.
   ========================================================================= */
.ca-blocks .wp-block-group{margin-top:0;margin-bottom:0}
.ca-blocks .ca-section > .ca-wrap,
.ca-blocks .ca-pagehero > .ca-wrap{max-width:1120px;margin:0 auto;padding:0 clamp(24px,4vw,32px)}

/* Hero: l'occhiello diventa un <p>, il titolo un blocco heading */
.ca-blocks .ca-pagehero p.ca-pagehero__ey{margin:0 0 14px}
.ca-blocks .ca-pagehero h1{margin:0;color:#fff}
.ca-blocks .ca-pagehero p.ca-pagehero__sub{margin:10px 0 0}

/* Occhielli di sezione come paragrafi */
.ca-blocks p.ca-eyebrow{margin:0 0 12px}
.ca-blocks .ca-eyebrow--center{justify-content:center}
.ca-blocks .ca-center{text-align:center}
.ca-blocks .ca-center .ca-eyebrow{justify-content:center}

/* Titoli e testo di default dentro le sezioni */
.ca-blocks .ca-section h2{font-family:var(--ca-font-head);font-weight:200;font-size:38px;line-height:1.12;
  letter-spacing:0;color:var(--ca-amaranto);margin:0 0 14px}
.ca-blocks .ca-section h3{font-family:var(--ca-font-head);font-weight:300;font-size:23px;
  color:var(--ca-amaranto);margin:0 0 10px}
.ca-blocks .ca-section p:not([class]){font-size:16.5px;line-height:1.72;color:var(--ca-ink);max-width:760px;margin:0 0 16px}
.ca-blocks .ca-section ul:not([class]),.ca-blocks .ca-section ol:not([class]){font-size:16.5px;line-height:1.72;color:var(--ca-ink);max-width:760px}
@media(max-width:760px){ .ca-blocks .ca-section h2{font-size:30px} }

/* Colonne: la griglia Contatti vince sul flex del block library */
.ca-blocks .wp-block-columns{margin-bottom:0}
.ca-blocks .wp-block-columns.ca-contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:40px;align-items:start}
.ca-blocks .wp-block-columns.ca-contact-grid > .wp-block-column{flex-basis:auto!important;min-width:0}
.ca-blocks .wp-block-columns.ca-split{gap:44px;align-items:center}
@media(max-width:900px){
  .ca-blocks .wp-block-columns.ca-contact-grid{grid-template-columns:1fr;gap:32px}
  .ca-blocks .wp-block-columns.ca-split{flex-wrap:wrap}
}

/* Immagini e gallerie inserite dal cliente */
.ca-blocks .wp-block-image{margin:0 0 18px}
.ca-blocks .wp-block-image img{border-radius:var(--ca-radius-lg);box-shadow:var(--ca-shadow-sm);height:auto}
.ca-blocks .wp-block-gallery img{border-radius:12px}

/* Bottoni core → CTA del brand */
.ca-blocks .wp-block-button__link{border-radius:8px;font-family:var(--ca-font-ui);font-weight:600;
  font-size:14px;letter-spacing:.6px;text-transform:uppercase;padding:14px 26px}

/* ---------- FASCIA DI EVIDENZA ----------
   Invito a tutta larghezza: titolo, riga di spiegazione e un comando in oro. Nata dentro
   Pianifica la visita, ora serve anche ai Contatti (l'invito verso la pagina Partner), quindi
   sta qui e non nel foglio di una pagina sola. */
.ca-hilite{background:linear-gradient(150deg,var(--ca-amaranto),var(--ca-amaranto-ink));color:#f3e7d7;border-radius:16px;
  padding:24px 28px;display:flex;gap:22px;align-items:center;flex-wrap:wrap;justify-content:space-between}
/* Il titolo va scritto in BIANCO: la fascia è su fondo amaranto e il colore di serie dei titoli
   è amaranto — cioè invisibile. Serve `.wp-block-heading` accanto al tag: finché questa regola
   viveva in visita.css bastava `h3`, perché quel foglio è accodato dopo e vinceva per ordine;
   qui, nel foglio comune, la regola generica dei titoli arriva dopo e la batteva. */
.ca-hilite h3,.ca-hilite h4,
.ca-hilite h3.wp-block-heading,.ca-hilite h4.wp-block-heading{color:#fff;font-size:26px;margin:0}
.ca-hilite p{color:#e6d6c2;margin:6px 0 0;font-size:15px;max-width:520px}
.ca-hilite .wp-block-button__link,.ca-hilite .ca-btn{background:var(--ca-oro);color:var(--ca-amaranto-ink);border-color:var(--ca-oro)}
.ca-hilite .wp-block-button__link:hover,.ca-hilite .ca-btn:hover{background:var(--ca-oro-light);border-color:var(--ca-oro-light);color:var(--ca-amaranto-ink)}

/* Box nota / avviso */
.ca-note{max-width:760px;background:#fff;border:1px solid var(--ca-border);border-left:4px solid var(--ca-oro);
  border-radius:12px;padding:20px 24px;box-shadow:var(--ca-shadow-sm);margin:0 auto}
.ca-note h3{margin:0 0 8px;font-family:var(--ca-font-head);color:var(--ca-amaranto);font-size:20px}
.ca-note p{margin:0;font-size:15.5px;line-height:1.65;color:var(--ca-ink)}

/* Segnaposto visibili solo a chi può modificare (dato dinamico non ancora compilato) */
.ca-ph{font-family:var(--ca-font-ui);font-size:13px;color:var(--ca-muted);background:var(--ca-bg-alt);
  border:1px dashed var(--ca-line);border-radius:8px;padding:10px 14px;display:inline-block}

/* === PROVA: IvyOra "normal" (400) → "light" (300). Blocco TOGGLE: per tornare
   indietro basta rimuovere queste righe (le regole originali restano intatte). === */
.ca-cd b,.ca-daterow .d,.ca-tl__year,.ca-edcard__y,.ca-featured__t,.ca-step h4,.ca-step h3{font-weight:300!important}


/* =========================================================================
   CF7 — MENU MOBILE (drawer Kadence): pannello SCURO, voci chiare.
   Kadence porta hover/focus e la voce corrente a --global-palette-highlight-alt
   (amaranto scuro): su fondo scuro il testo sparisce. Qui si tiene l'oro chiaro,
   che e' anche il colore "attivo" del brand. Delta runtime di Code (25/07).
   NON rimuovere: e' invisibile al lint, si vede solo aprendo il menu su mobile.
   ========================================================================= */
.popup-drawer .drawer-content a:hover,
.popup-drawer .drawer-content a:focus,
.popup-drawer .drawer-content .current-menu-item > a,
.popup-drawer .drawer-content .current-menu-ancestor > a,
.popup-drawer .drawer-content .current_page_item > a{color:var(--ca-oro-light)!important}

/* Icona hamburger: in hover Kadence la schiarisce (contrasto ~2,1 su header chiaro).
   DA VERIFICARE A RUNTIME: se i selettori del toggle cambiano in una versione di Kadence
   questa regola diventa un no-op silenzioso — segnalarlo, non lasciarlo cosi'. */
.drawer-toggle:hover .kadence-svg-iconset,
.drawer-toggle:focus .kadence-svg-iconset{color:var(--ca-amaranto)!important}