/* ==========================================================================
   cdx.css — porting del concept, Fase 1: fondamenta
   Caricato SOLO con l'interruttore cdx acceso (inc/cdx.php), priorità 110,
   dopo cd-sistema-visivo. Fonte: concept-sorgenti/assets/sito.css.
   Classi prefissate cdx-, token prefissati --cdx- (collisioni trovate con
   sistema-visivo.css: --notte, --rosso, --carta; con style.css: --acheo).
   ========================================================================== */

/* ---------- 1. Font locali ---------- */
@font-face{font-family:"Anton";src:url("fonts/anton.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Barlow";src:url("fonts/barlow-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Barlow";src:url("fonts/barlow-500.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Barlow";src:url("fonts/barlow-600.woff2") format("woff2");font-weight:600;font-display:swap}

/* ---------- 2. Rimappatura dei font esistenti ----------
   Invece di riscrivere le regole (molte con !important) di style.css,
   sistema-visivo.css, template-home.php e del tema padre, i nomi di famiglia che
   usano puntano agli stessi woff2 locali. Valgono solo quando questo file è
   caricato, cioè con cdx acceso. Gli intervalli di peso evitano il grassetto finto.
   - Antonio (titoli sistema visivo e home)      → Anton
   - Playfair Display (titoli style.css)          → Barlow
   - Inter (testo style.css)                      → Barlow
   - Abril Fatface, PT Sans (tema padre)          → Barlow                    */
@font-face{font-family:"Antonio";src:url("fonts/anton.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Playfair Display";src:url("fonts/barlow-400.woff2") format("woff2");font-weight:100 449;font-display:swap}
@font-face{font-family:"Playfair Display";src:url("fonts/barlow-500.woff2") format("woff2");font-weight:450 549;font-display:swap}
@font-face{font-family:"Playfair Display";src:url("fonts/barlow-600.woff2") format("woff2");font-weight:550 900;font-display:swap}
@font-face{font-family:"Inter";src:url("fonts/barlow-400.woff2") format("woff2");font-weight:100 449;font-display:swap}
@font-face{font-family:"Inter";src:url("fonts/barlow-500.woff2") format("woff2");font-weight:450 549;font-display:swap}
@font-face{font-family:"Inter";src:url("fonts/barlow-600.woff2") format("woff2");font-weight:550 900;font-display:swap}
@font-face{font-family:"Abril Fatface";src:url("fonts/barlow-600.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"PT Sans";src:url("fonts/barlow-400.woff2") format("woff2");font-weight:100 449;font-display:swap}
@font-face{font-family:"PT Sans";src:url("fonts/barlow-500.woff2") format("woff2");font-weight:450 549;font-display:swap}
@font-face{font-family:"PT Sans";src:url("fonts/barlow-600.woff2") format("woff2");font-weight:550 900;font-display:swap}

/* ---------- 3. Token ---------- */
:root{
  --cdx-notte:#0A1F3C; --cdx-notte-2:#17304F; --cdx-blu:#134292; --cdx-rosso:#D92B1D; --cdx-oro:#DBB94E; --cdx-carta:#F2F2F0; --cdx-bianco:#FFFFFF;
  --cdx-ink:#0A1F3C; --cdx-ink-soft:#3A4658; --cdx-on-dark-soft:#C9D3E2; --cdx-piede-testo:#DCE4F2;
  --cdx-acheo:#01BEE6; --cdx-ldv:#EBDBCB;
  --cdx-f-display:"Anton","Arial Narrow",Impact,sans-serif;
  --cdx-f-text:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
  /* scala tipografica */
  --cdx-s-small:clamp(1rem,0.98rem + 0.05vw,1.0625rem);
  --cdx-s-body:clamp(1.0625rem,1rem + 0.25vw,1.1875rem);
  --cdx-s-lead:clamp(1.25rem,1.1rem + 0.6vw,1.625rem);
  --cdx-s-head:clamp(2.75rem,1.4rem + 4.4vw,5.75rem);
  --cdx-s-title:clamp(2.1rem,1.1rem + 2.7vw,3.9rem);
  --cdx-s-display:clamp(3.4rem,0.6rem + 9.4vw,9.6rem);
  --cdx-margin:clamp(1rem,2vw,1.75rem);
  --cdx-gutter:clamp(1rem,2vw,2rem);
  --cdx-ease-out:cubic-bezier(0.22,1,0.36,1);
  --cdx-ease-soft:cubic-bezier(0.33,1,0.68,1);
}
@media (max-width:640px){:root{--cdx-s-display:11.2vw;--cdx-s-head:9vw}}

/* ---------- 4. Base ---------- */
body.cdx{background:var(--cdx-carta);color:var(--cdx-ink);font-family:var(--cdx-f-text);font-size:var(--cdx-s-body);line-height:1.5;-webkit-font-smoothing:antialiased;text-size-adjust:100%}
body.cdx :focus-visible{outline:3px solid var(--cdx-oro);outline-offset:3px}
.cdx-h{font-family:var(--cdx-f-text);font-weight:600;line-height:.98;letter-spacing:-0.025em}
.cdx-poster{font-family:var(--cdx-f-display);font-weight:400;text-transform:uppercase;letter-spacing:0;line-height:.88}
.cdx-wrap{padding-inline:var(--cdx-margin)}
.cdx-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--cdx-gutter)}
.cdx-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.cdx-soft{color:var(--cdx-ink-soft)}

/* salta al contenuto: visibile solo con il focus */
.cdx-salta{position:absolute;left:var(--cdx-margin);top:-100px;z-index:1000;padding:.7rem 1.1rem;border-radius:999px;background:var(--cdx-oro);color:var(--cdx-notte);font-weight:600;text-decoration:none}
.cdx-salta:focus{top:.75rem}
body.admin-bar .cdx-salta:focus{top:calc(32px + .75rem)}

/* ---------- 5. Pulsanti e link ---------- */
body.cdx .cdx-btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:3.25rem;padding:0 1.6rem;border-radius:999px;border:0;font-family:var(--cdx-f-text);font-weight:600;font-size:var(--cdx-s-body);line-height:1.2;letter-spacing:0;text-transform:none;text-decoration:none;white-space:nowrap;transition:transform 140ms var(--cdx-ease-out),background-color 180ms ease,color 180ms ease}
body.cdx .cdx-btn:active{transform:scale(.97)}
body.cdx .cdx-btn--oro,body.cdx .cdx-btn--oro:hover,body.cdx .cdx-btn--oro:focus{color:var(--cdx-notte)}
body.cdx .cdx-btn--oro{background:var(--cdx-oro)}
body.cdx .cdx-btn--bianco{background:var(--cdx-bianco);color:var(--cdx-notte)}
body.cdx .cdx-btn--notte{background:var(--cdx-notte);color:var(--cdx-bianco)}
body.cdx .cdx-btn--blu{background:var(--cdx-blu);color:var(--cdx-bianco)}
@media (hover:hover) and (pointer:fine){
  body.cdx .cdx-btn--oro:hover{background:#E8CC5F}
  body.cdx .cdx-btn--bianco:hover{background:var(--cdx-carta);color:var(--cdx-notte)}
  body.cdx .cdx-btn--notte:hover,body.cdx .cdx-btn--blu:hover{background:var(--cdx-rosso);color:var(--cdx-bianco)}
  body.cdx .cdx-link:hover{text-decoration-color:currentColor}
}
body.cdx .cdx-link{color:inherit;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:.22em;text-decoration-thickness:.08em;transition:text-decoration-color 180ms ease}
body.cdx .cdx-link-plain{color:inherit;text-decoration:underline;text-underline-offset:.22em;text-decoration-thickness:.08em;font-weight:600}

/* ---------- 6. Nav ---------- */
.cdx-nav{position:relative;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:1.3rem var(--cdx-margin);color:var(--cdx-bianco);font-family:var(--cdx-f-text);font-size:var(--cdx-s-body);line-height:1.5}
.cdx-nav--notte{background:var(--cdx-notte)}
.cdx-nav__logo{display:block;flex:none}
.cdx-nav__logo img{display:block;height:clamp(48px,4.4vw,66px);width:auto;max-width:none}
.cdx-nav .cdx-nav__links{display:flex;align-items:center;gap:1.8rem;font-weight:500}
.cdx-nav .cdx-nav__voci{display:flex;align-items:center;gap:1.8rem;margin:0;padding:0;list-style:none}
.cdx-nav .cdx-nav__voci li{margin:0;padding:0;list-style:none}
body.cdx .cdx-nav a.cdx-link,body.cdx .cdx-nav a.cdx-link:hover,body.cdx .cdx-nav a.cdx-link:focus{color:var(--cdx-bianco)}
body.cdx .cdx-nav a.cdx-link{text-decoration-line:underline;font-weight:500;font-size:inherit;letter-spacing:0;text-transform:none}
body.cdx .cdx-nav a[aria-current="page"]{text-decoration-color:currentColor;text-underline-offset:.3em;text-decoration-thickness:.1em}
.cdx-nav__carrello{display:inline-flex;align-items:center;gap:.5rem;font-weight:600}
.cdx-nav__carrello[hidden]{display:none}
.cdx-nav__carrello b{display:inline-grid;place-items:center;min-width:1.75rem;height:1.75rem;padding:0 .4rem;border-radius:999px;background:var(--cdx-oro);color:var(--cdx-notte);font-size:.95rem}
.cdx-nav__menu{display:none}
.cdx-nav__menu summary{list-style:none;cursor:pointer;min-height:2.75rem;padding:0 1.1rem;border-radius:999px;background:var(--cdx-notte-2);color:var(--cdx-bianco);display:inline-flex;align-items:center;font-weight:600}
.cdx-nav__menu summary::-webkit-details-marker{display:none}
/* variante su fondo scuro trasparente (hero): pronta, non usata in Fase 1 */
.cdx-nav:not(.cdx-nav--notte){background:transparent}

/* ---------- 7. Piede ---------- */
.cdx-piede{background:var(--cdx-notte);color:var(--cdx-bianco);padding:clamp(4rem,8vw,7rem) var(--cdx-margin) 1.75rem;font-family:var(--cdx-f-text);font-size:var(--cdx-s-body);line-height:1.5}
.cdx-piede .cdx-grid{row-gap:3.5rem}
.cdx-piede__mark{grid-column:1 / span 8;align-self:center}
.cdx-piede__mark img{display:block;width:100%;height:auto;max-width:none}
.cdx-piede__invito{grid-column:9 / span 4;align-self:center;display:flex;flex-direction:column;align-items:flex-start;gap:1.4rem}
/* specificità sopra body.cd-pagina p (sistema-visivo.css: font-size, max-width) */
body.cdx .cdx-piede .cdx-piede__invito p{margin:0;max-width:none;font-size:var(--cdx-s-lead);line-height:1.35;color:var(--cdx-piede-testo)}
.cdx-piede .cdx-piede__cucinotta{display:block;width:140px;height:auto;max-width:none} /* Fase 2B: 140 px di larghezza */
.cdx-piede__col{grid-column:span 3;display:flex;flex-direction:column;gap:.55rem}
/* !important necessario: style.css (h1–h6) e sistema-visivo.css (body.cd-pagina h1–h4: font, peso,
   maiuscolo, interlinea, spaziatura, margine) forzano i titoli con !important. Senza, il titolo del
   piede cambierebbe aspetto tra le pagine del sistema visivo e le altre. */
body.cdx .cdx-piede h2.cdx-piede__titolo{margin:0 0 .3rem !important;padding:0;font-family:var(--cdx-f-text) !important;font-size:var(--cdx-s-body) !important;font-weight:600 !important;line-height:1.4 !important;letter-spacing:0 !important;text-transform:none !important;color:var(--cdx-bianco) !important;text-wrap:wrap}
body.cdx .cdx-piede__col a.cdx-link,body.cdx .cdx-piede__col a.cdx-link:hover,body.cdx .cdx-piede__col a.cdx-link:focus{color:var(--cdx-piede-testo);text-decoration-line:underline}
.cdx-piede__col span{color:var(--cdx-piede-testo)}
.cdx-piede__legal{grid-column:1 / -1;display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;font-size:var(--cdx-s-small);color:var(--cdx-on-dark-soft);padding-top:1rem}
body.cdx .cdx-piede__legal a.cdx-link{color:var(--cdx-on-dark-soft)}

/* ---------- 8. Movimento ---------- */
@media (prefers-reduced-motion:no-preference){
  .js body.cdx [data-reveal]{opacity:0;transform:translateY(26px);transition:opacity 700ms var(--cdx-ease-out),transform 900ms var(--cdx-ease-out);transition-delay:calc(var(--i,0) * 75ms)}
  .js body.cdx [data-reveal].is-in{opacity:1;transform:none}
}

/* ---------- 9. Tablet ---------- */
@media (max-width:1024px){
  .cdx-nav > .cdx-nav__links{display:none}
  .cdx-nav__menu{display:block;position:relative}
  .cdx-nav__menu[open] .cdx-nav__links{display:flex;flex-direction:column;align-items:flex-start;gap:1rem;position:absolute;right:0;top:calc(100% + .6rem);background:var(--cdx-notte);padding:1.4rem;min-width:15rem;box-shadow:0 18px 40px rgba(10,31,60,.35)}
  .cdx-nav__menu .cdx-nav__voci{flex-direction:column;align-items:flex-start;gap:1rem}
  .cdx-nav__menu:not([open]) .cdx-nav__links{display:none}
}

/* ---------- 10. Telefono ---------- */
@media (max-width:640px){
  .cdx-nav{padding:1rem var(--cdx-margin)}
  .cdx-nav__logo img{height:38px}
  .cdx-piede .cdx-grid{display:flex;flex-direction:column;align-items:stretch}
  .cdx-piede__legal{flex-direction:column}
}

/* =========================================================================
   RITOCCHI 1 — piede: logo Sibega più piccolo (300 / 240 / 200 px) e griglia 1/3 – 2/3,
   logo e invito allineati in alto. Le 4 colonne sotto restano come prima.
   ========================================================================= */
.cdx-piede__mark{grid-column:1 / span 4;align-self:start}
.cdx-piede__mark img{width:100%;max-width:300px}
.cdx-piede__invito{grid-column:5 / span 8;align-self:start}
body.cdx .cdx-piede .cdx-piede__invito p{max-width:46ch}
@media (max-width:1023.98px){
  .cdx-piede__mark img{max-width:240px}
}
@media (max-width:767.98px){
  .cdx-piede__mark img{max-width:200px}
  .cdx-piede__mark,.cdx-piede__invito{grid-column:1 / -1}
}

/* RITOCCHI 1 — interlinea unica dei titoli display in Anton su più righe (prima .8–.9: righe quasi attaccate) */
:root{--cdx-lh-display:.96}
.cdx-poster{line-height:var(--cdx-lh-display)}

/* Risposte del cliente (11/11/2026): link alle pagine legali nella riga in fondo al piede */
.cdx-piede__norme{display:flex;flex-wrap:wrap;gap:.4rem 1.25rem}
