/* ============================================================
   CONSENSO COOKIE — banner + segnaposto per i contenuti Google
   File unico, caricato sia dalle pagine del sito sia dalle 4 pagine
   legali (che hanno un loro CSS inline e non caricano alt.css/fx.css):
   per questo ogni var() ha un fallback esplicito.
   ============================================================ */

/* z-index 190: sopra la nav (60) e la freccetta (50), ma SOTTO la lightbox (200),
   altrimenti il banner coprirebbe la foto aperta a schermo intero */
/* --consent-sotto: quanta parte del fondo e' nascosta dalla barra strumenti del
   browser (iOS Safari sopra tutti). La scrive consent.js leggendo visualViewport:
   senza, i pulsanti finiscono dietro la toolbar e non si possono premere. */
.consent-bar{position:fixed;left:0;right:0;bottom:var(--consent-sotto,0px);z-index:190;
  background:var(--navy,#1B2B42);color:var(--ivory,#F5F0E8);
  display:flex;align-items:center;gap:clamp(14px,3vw,38px);flex-wrap:wrap;justify-content:space-between;
  /* env(): sotto i pulsanti serve spazio per l'indicatore home, che intercetta i tocchi */
  padding:18px clamp(18px,5vw,54px);
  padding-bottom:calc(18px + env(safe-area-inset-bottom,0px));
  box-shadow:0 -18px 44px rgba(9,14,22,.28);
  transform:translateY(130%);transition:transform .42s cubic-bezier(.2,.7,.2,1)}
.consent-bar.on{transform:none}
/* con lo zoom molto alto (WCAG 1.4.10) la barra puo' superare lo schermo: invece di uscire
   dall'alto, scorre al suo interno. A dimensioni normali non cambia nulla */
.consent-bar{max-height:100vh;max-height:calc(100dvh - var(--consent-sotto,0px));overflow-y:auto;overscroll-behavior:contain}
.consent-bar p{margin:0;flex:1 1 380px;font:400 13.5px/1.6 var(--sans,"Inter",sans-serif);color:rgba(245,240,232,.9)}
.consent-bar a{color:var(--sand,#B8A98A);text-decoration:underline;text-underline-offset:3px}
.consent-bar a:hover{color:var(--ivory,#F5F0E8)}
.consent-btns{display:flex;gap:10px;flex:0 0 auto}
.consent-bar button{font:600 11px/1 var(--sans,"Inter",sans-serif);letter-spacing:.14em;text-transform:uppercase;
  padding:0 20px;min-height:44px;border-radius:2px;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
/* rifiuto e accettazione hanno lo stesso peso visivo: il rifiuto deve essere facile quanto l'accettazione */
.consent-bar .consent-no{background:transparent;color:var(--ivory,#F5F0E8);border:1px solid rgba(245,240,232,.55)}
.consent-bar .consent-no:hover{border-color:var(--ivory,#F5F0E8);background:rgba(245,240,232,.08)}
.consent-bar .consent-ok{background:var(--sand,#B8A98A);color:var(--navy,#1B2B42);border:1px solid var(--sand,#B8A98A)}
.consent-bar .consent-ok:hover{background:#c9bb9d;border-color:#c9bb9d}
.consent-bar :focus-visible{outline:2px solid var(--ivory,#F5F0E8);outline-offset:2px;box-shadow:0 0 0 5px rgba(9,14,22,.75)}
/* con Google Analytics attivo (GA_ID in consent.js) il banner ha un terzo comando, "Scegli", che apre
   il secondo livello con una casella per finalita'. Ha meno peso visivo: rifiuto e accettazione restano pari */
.consent-bar .consent-scegli{background:transparent;color:var(--sand,#B8A98A);border:1px solid transparent;padding:0 12px;
  text-decoration:underline;text-underline-offset:4px}
.consent-bar .consent-scegli:hover{color:var(--ivory,#F5F0E8)}
.consent-cats{flex:1 1 100%;display:flex;flex-wrap:wrap;gap:12px 32px}
.consent-cat{flex:1 1 300px;display:flex;gap:12px;align-items:flex-start;cursor:pointer;
  font:400 13px/1.55 var(--sans,"Inter",sans-serif);color:rgba(245,240,232,.82)}
.consent-cat strong{display:block;font-weight:600;color:var(--ivory,#F5F0E8)}
.consent-cat input{flex:0 0 auto;width:20px;height:20px;margin:1px 0 0;accent-color:var(--sand,#B8A98A);cursor:pointer}
.consent-pannello .consent-btns{margin-left:auto}
/* la X (chiudere = rifiutare) in alto a destra: la barra si allarga a destra per non sovrapporla ai pulsanti */
.consent-bar.consent-stat{padding-right:max(clamp(18px,5vw,54px),64px)}
.consent-bar .consent-x{position:absolute;top:8px;right:8px;width:44px;min-height:44px;height:44px;padding:0;
  display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid transparent;
  color:rgba(245,240,232,.75)}
.consent-bar .consent-x:hover{color:var(--ivory,#F5F0E8);border-color:rgba(245,240,232,.35)}

/* --- lo spazio occupato dalla barra va restituito, altrimenti a fine documento
   non resta scroll e cio' che finisce sotto (link del footer, firma) e' irraggiungibile.
   --consent-h e' l'altezza reale, misurata e scritta da consent.js. --- */
body.consent-open{padding-bottom:calc(var(--consent-h,0px) + var(--consent-sotto,0px))}
/* la freccetta di scroll vive a bottom:20px, cioe' esattamente dietro al banner */
body.consent-open .fly-cue.fixed-cue{opacity:0}
/* le didascalie delle sezioni .fly stanno dentro un blocco fissato a tutto schermo:
   il padding sul body non le libera, vanno alzate a parte */
body.consent-open .fly-cap{margin-bottom:calc(var(--consent-h,0px) + var(--consent-sotto,0px))}
/* il menu mobile e' a schermo intero ma z-index 55: senza questo la barra lo coprirebbe */
body.menu-open .consent-bar{transform:translateY(110%)}

@media (max-width:600px){
  .consent-bar{padding:16px 18px calc(18px + env(safe-area-inset-bottom,0px));gap:14px}
  .consent-bar p{flex:1 1 100%;font-size:13px}
  .consent-btns{width:100%}
  .consent-bar button{flex:1 1 0}
  /* tre comandi non stanno in una riga: "Scegli" va sotto, a tutta larghezza */
  .consent-stat .consent-btns{flex-wrap:wrap}
  .consent-stat button{padding:0 12px}
  .consent-bar .consent-scegli{flex:1 1 100%;min-height:40px}
  /* su telefono i pulsanti vanno a tutta larghezza sotto il testo: si fa spazio alla X solo accanto al testo */
  .consent-bar.consent-stat{padding-right:18px}
  .consent-stat > p{padding-right:40px}
}
/* --- telefono, banner con Google Analytics (.consent-stat): testo piu' piccolo e i tre comandi in una riga sola.
   Prima era alto ~270 px su 844 (un terzo dello schermo) e copriva "Richiedi disponibilita'" nella home e il modulo
   nei Contatti. Rifiuto e accettazione restano uguali per peso e dimensione; "Scegli" resta un link sottolineato.
   Sotto i 350 px i tre comandi non stanno in una riga: "Scegli" torna sotto, come prima. --- */
@media (max-width:600px){
  .consent-bar.consent-stat{padding-top:12px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));gap:10px}
  .consent-stat > p{font-size:12px;line-height:1.5}
  .consent-stat .consent-btns{flex-wrap:nowrap;gap:8px}
  .consent-bar.consent-stat button{padding:0 8px;letter-spacing:.08em}
  .consent-bar.consent-stat .consent-scegli{flex:0 0 auto;min-height:44px;padding:0 6px}
}
@media (max-width:349px){
  .consent-stat .consent-btns{flex-wrap:wrap}
  .consent-bar.consent-stat .consent-scegli{flex:1 1 100%;min-height:40px}
}
@media (prefers-reduced-motion:reduce){
  .consent-bar{transition:none}
}

/* --- pagine Matrimoni (body.pg-matrimoni), solo telefono: chi arriva dalla pubblicita' Instagram atterra li'.
   Il banner e' piu' basso (testo accanto ai due pulsanti, uno sopra l'altro, sempre con lo stesso peso) e la
   freccetta "scorri" resta visibile appena sopra il banner invece di sparire dietro. Con Google Analytics
   attivo (.consent-stat, tre comandi e la X) resta l'impaginazione normale. Le altre pagine non cambiano. --- */
@media (max-width:600px){
  .pg-matrimoni .consent-bar:not(.consent-stat){flex-wrap:nowrap;align-items:center;gap:14px;
    padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px))}
  .pg-matrimoni .consent-bar:not(.consent-stat) p{flex:1 1 auto;min-width:0;font-size:12px;line-height:1.5}
  .pg-matrimoni .consent-bar:not(.consent-stat) .consent-btns{width:auto;flex:0 0 auto;flex-direction:column;gap:8px}
  .pg-matrimoni .consent-bar:not(.consent-stat) button{flex:0 0 auto;min-width:104px;padding:0 14px}
  /* solo col banner basso: il banner e' il primo figlio del body e la freccetta l'ultimo (~). Con quello a tre
     comandi (Analytics) la freccetta resta nascosta come prima */
  body.pg-matrimoni.consent-open .consent-bar:not(.consent-stat) ~ .fly-cue.fixed-cue{bottom:calc(var(--consent-h,0px) + var(--consent-sotto,0px) + 14px)}
  body.pg-matrimoni.consent-open .consent-bar:not(.consent-stat) ~ .fly-cue.fixed-cue.show{opacity:1}
  .pg-matrimoni .fly-cue.fixed-cue{transition:opacity .55s ease,bottom .42s cubic-bezier(.2,.7,.2,1)}
}
/* telefoni stretti (320-350px): pulsanti meno larghi, cosi' il testo accanto va meno a capo */
@media (max-width:350px){
  .pg-matrimoni .consent-bar:not(.consent-stat){gap:10px;padding-left:14px;padding-right:14px}
  .pg-matrimoni .consent-bar:not(.consent-stat) button{min-width:88px;padding:0 10px}
}
/* testo molto ingrandito (zoom 200% su un telefono: schermo largo meno di 260 px): una colonna accanto ai
   pulsanti sarebbe di poche lettere, torna il testo sopra e i due pulsanti affiancati sotto */
@media (max-width:260px){
  .pg-matrimoni .consent-bar:not(.consent-stat){flex-wrap:wrap}
  .pg-matrimoni .consent-bar:not(.consent-stat) .consent-btns{width:100%;flex-direction:row}
  .pg-matrimoni .consent-bar:not(.consent-stat) button{flex:1 1 0;min-width:0}
}
@media (max-width:600px) and (prefers-reduced-motion:reduce){
  .pg-matrimoni .fly-cue.fixed-cue{transition:none}
}

/* --- segnaposto al posto dell'iframe bloccato --- */
.consent-ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;text-align:center;padding:26px;background:#ece7dd;color:var(--earth,#6B5B47);border-radius:inherit}
.consent-ph-t{font:600 10px/1 var(--sans,"Inter",sans-serif);letter-spacing:.24em;text-transform:uppercase;color:var(--sand,#B8A98A)}
.consent-ph p{margin:0;max-width:34ch;font:400 13.5px/1.6 var(--sans,"Inter",sans-serif);color:var(--earth,#6B5B47)}
.consent-ph button{margin-top:6px;font:600 11px/1 var(--sans,"Inter",sans-serif);letter-spacing:.14em;text-transform:uppercase;
  background:var(--navy,#1B2B42);color:var(--ivory,#F5F0E8);border:0;padding:0 20px;min-height:44px;border-radius:2px;cursor:pointer;transition:opacity .2s}
.consent-ph button:hover{opacity:.86}
.embed-frame{position:relative}

/* "Rivedi le preferenze", solo nelle pagine di cookie policy */
[data-consent-reset]{margin-top:14px;font:600 11px/1 var(--sans,"Inter",sans-serif);letter-spacing:.14em;text-transform:uppercase;
  background:var(--navy,#1B2B42);color:var(--ivory,#F5F0E8);border:0;padding:0 22px;min-height:44px;border-radius:2px;cursor:pointer;transition:opacity .2s}
[data-consent-reset]:hover{opacity:.86}
[data-consent-reset]:focus-visible{outline:2px solid var(--navy,#1B2B42);outline-offset:3px}