/* Ristorante Al Duomo — la terza versione, pizzeriaduomo.nexoratlab.com (12/10/2026).

   Simone: «fanne una nuova versione copiando questo stile estetico e grafico principale https://crazypizza.com/it/».
   Da crazypizza.com si prende l'impianto: copertina a tutta pagina con le pizze viste dall'alto, avorio e bordeaux, titoli
   in maiuscolo, pulsanti squadrati, collage di foto, fascia scura con l'invito, piede bordeaux, menu «a panino» con il
   marchio al centro. Non si prendono marchio, foto, testi ne' caratteri (i loro sono Adobe Fonts a pagamento: qui Jost,
   licenza SIL OFL, della stessa famiglia geometrica). Il bordeaux #701010 e' il rosso del marchio DUOMO sul loro menu stampato.
   Si carica dopo sito.css solo in questa versione (<html data-tema="bordeaux">) e lo riveste: le regole hanno sempre il
   prefisso [data-tema="bordeaux"], cosi' vincono su quelle di base anche dentro le media query.
   Il tema e' sempre chiaro, anche col telefono in modalita' scura: avorio e bordeaux sono l'identita' di questa versione. */

@font-face { font-family: 'Jost'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url('/assets/fonts/Jost-var-latin-ext-b2a539cd.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Jost'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url('/assets/fonts/Jost-var-latin-235d8f89.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root[data-tema="bordeaux"] {
  color-scheme: light;
  --fondo: #f7f2ea;            /* avorio */
  --grigio: #efe6d8;           /* avorio piu' scuro, per le sezioni alterne */
  --carta: #fbf8f3;
  --tessera: #efe6d8;
  --testo: #1f1a17;
  --testo-2: #5d544c;
  --testo-3: #8a8178;
  --filo: #ddd2c2;
  --filo-tenue: rgba(80, 30, 20, .10);
  --vetro: rgba(247, 242, 234, .96);
  --bordeaux: #701010;         /* il rosso del marchio sul menu stampato */
  --bordeaux-chiaro: #8a1a18;
  --bordeaux-scuro: #4a0808;
  --crema: #f4ecdc;
  --oro: #701010;              /* le regole di base che usano l'oro diventano bordeaux */
  --oro-testo: #701010;
  --su-oro: #f4ecdc;
  --oro-su: #8a1a18;
  --verde: #1f7a38;
  --rosso: #b3261e;
  --nero: #701010;             /* la sezione dei piatti tondi */
  --ombra: none;
  --font: 'Jost', 'Futura', 'Century Gothic', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
  --r-grande: 0px;
  --r-medio: 0px;
  --r-piccolo: 0px;
  --barra: 64px;
}

[data-tema="bordeaux"] body { font-family: var(--font); letter-spacing: 0; background: var(--fondo); }
[data-tema="bordeaux"] h1, [data-tema="bordeaux"] h2, [data-tema="bordeaux"] h3, [data-tema="bordeaux"] h4 { letter-spacing: 0; }
[data-tema="bordeaux"] ::selection { background: rgba(112, 16, 16, .2); }
[data-tema="bordeaux"] :focus-visible { outline-color: var(--bordeaux); }

/* ---------------------------------------------------------------- titoli e testi */
[data-tema="bordeaux"] .titolo-pagina { font-weight: 700; font-size: clamp(34px, 5.4vw, 66px); line-height: 1.04; letter-spacing: .01em; text-transform: uppercase; color: var(--bordeaux); }
[data-tema="bordeaux"] .titolo-sezione { font-weight: 700; font-size: clamp(28px, 3.4vw, 44px); line-height: 1.08; letter-spacing: .015em; text-transform: uppercase; color: var(--bordeaux); }
[data-tema="bordeaux"] .titolo-medio { font-weight: 400; font-size: clamp(28px, 3vw, 40px); color: var(--bordeaux); }
[data-tema="bordeaux"] .punto { color: inherit; }
[data-tema="bordeaux"] .sotto { font-weight: 400; letter-spacing: 0; color: var(--testo-2); }
[data-tema="bordeaux"] .sotto strong { color: var(--testo); font-weight: 600; }

/* ---------------------------------------------------------------- pulsanti squadrati */
[data-tema="bordeaux"] .pillola {
  border-radius: 0; min-height: 48px; padding: 12px 24px; font-size: 14px; font-weight: 500; letter-spacing: .1em;
  text-transform: uppercase; background: var(--bordeaux); color: var(--crema);
}
@media (hover: hover) { [data-tema="bordeaux"] .pillola:hover { background: var(--bordeaux-chiaro); } }
[data-tema="bordeaux"] .pillola.chiara { background: transparent; color: var(--bordeaux); box-shadow: inset 0 0 0 1.5px var(--bordeaux); }
@media (hover: hover) { [data-tema="bordeaux"] .pillola.chiara:hover { background: var(--bordeaux); color: var(--crema); } }   /* sul telefono il tocco non lascia il pulsante «acceso» */
[data-tema="bordeaux"] .pillola.scura { background: var(--bordeaux); color: var(--crema); }
[data-tema="bordeaux"] .pillola.wa { background: var(--bordeaux); color: var(--crema); }
@media (hover: hover) { [data-tema="bordeaux"] .pillola.wa:hover { background: var(--bordeaux-chiaro); } }
[data-tema="bordeaux"] .scopri { color: var(--bordeaux); font-size: 14px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }

/* ---------------------------------------------------------------- spigoli vivi, come le loro foto */
[data-tema="bordeaux"] .cornice, [data-tema="bordeaux"] .riquadro, [data-tema="bordeaux"] .riquadro-foto, [data-tema="bordeaux"] .rapida,
[data-tema="bordeaux"] .scheda, [data-tema="bordeaux"] .foto-dove, [data-tema="bordeaux"] .momento, [data-tema="bordeaux"] .promo,
[data-tema="bordeaux"] .modulo, [data-tema="bordeaux"] .riepilogo, [data-tema="bordeaux"] .salute, [data-tema="bordeaux"] .esito,
[data-tema="bordeaux"] .vini, [data-tema="bordeaux"] .avviso-menu, [data-tema="bordeaux"] .mosaico figure, [data-tema="bordeaux"] .pagine-menu a,
[data-tema="bordeaux"] .campo input, [data-tema="bordeaux"] .campo select, [data-tema="bordeaux"] .campo textarea, [data-tema="bordeaux"] .cerca input,
[data-tema="bordeaux"] .filtro, [data-tema="bordeaux"] .segno, [data-tema="bordeaux"] .passi-modulo span, [data-tema="bordeaux"] .scelta span,
[data-tema="bordeaux"] .sezioni-menu a, [data-tema="bordeaux"] .lingua-scelta, [data-tema="bordeaux"] .striscia { border-radius: 0; }
[data-tema="bordeaux"] .riquadro-foto { margin: auto 0 0; }

/* ---------------------------------------------------------------- la barra: menu a sinistra, marchio al centro, prenota a destra */
[data-tema="bordeaux"] .barra::before {
  background: var(--fondo); -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: 0 1px 0 rgba(112, 16, 16, .14);
  transition: background-color .35s var(--uscita), box-shadow .35s var(--uscita);
}
[data-tema="bordeaux"] .barra-dentro { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 12px; }
[data-tema="bordeaux"] .barra nav, [data-tema="bordeaux"] .barra .lingue { display: none !important; }
[data-tema="bordeaux"] .apri-menu { display: inline-flex !important; grid-column: 1; grid-row: 1; justify-self: start; width: 48px; height: 48px; margin: 0 0 0 -12px; }
[data-tema="bordeaux"] .apri-menu span { width: 28px; height: 14px; }
[data-tema="bordeaux"] .apri-menu span::before, [data-tema="bordeaux"] .apri-menu span::after { height: 2px; background: var(--bordeaux); }
[data-tema="bordeaux"] .apri-menu span::after { top: 12px; }
[data-tema="bordeaux"] .apri-menu[aria-expanded="true"] span::before, [data-tema="bordeaux"] .apri-menu[aria-expanded="true"] span::after { top: 6px; }
[data-tema="bordeaux"] .marchio-barra { grid-column: 2; grid-row: 1; justify-self: center; margin: 0; }
[data-tema="bordeaux"] .marchio-barra img { height: 26px; }
[data-tema="bordeaux"] .barra-azione {
  display: inline-flex; grid-column: 3; grid-row: 1; justify-self: end; min-height: 44px; padding: 8px 0; background: transparent;
  color: var(--bordeaux); border-radius: 0; font-size: 13px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
}
[data-tema="bordeaux"] .barra-azione:hover { background: transparent; text-decoration: underline; text-underline-offset: 6px; }
/* sopra la copertina scura: barra trasparente, marchio crema */
[data-tema="bordeaux"].sopra-eroe .barra::before { background: linear-gradient(rgba(0, 0, 0, .55), rgba(0, 0, 0, 0)); box-shadow: none; }
[data-tema="bordeaux"].sopra-eroe .marchio-barra .m-base, [data-tema="bordeaux"].menu-aperto .marchio-barra .m-base { display: none; }
[data-tema="bordeaux"].sopra-eroe .marchio-barra .m-crema, [data-tema="bordeaux"].menu-aperto .marchio-barra .m-crema { display: block; }
[data-tema="bordeaux"].sopra-eroe .apri-menu span::before, [data-tema="bordeaux"].sopra-eroe .apri-menu span::after { background: #fff; }
[data-tema="bordeaux"].sopra-eroe .barra-azione { color: #fff; }
/* col menu aperto la barra diventa bordeaux come il menu */
[data-tema="bordeaux"].menu-aperto .barra::before { background: var(--bordeaux); box-shadow: none; }
[data-tema="bordeaux"].menu-aperto .apri-menu span::before, [data-tema="bordeaux"].menu-aperto .apri-menu span::after { background: var(--crema); }
[data-tema="bordeaux"].menu-aperto .barra-azione { color: var(--crema); }

/* il menu a tutto schermo (anche sul PC, come crazypizza.com) */
[data-tema="bordeaux"] .menu-tel { display: block !important; background: var(--bordeaux); color: var(--crema); padding-top: clamp(20px, 6vh, 64px); }
[data-tema="bordeaux"] .menu-tel nav, [data-tema="bordeaux"] .menu-tel > .pillola, [data-tema="bordeaux"] .menu-tel .menu-chiama,
[data-tema="bordeaux"] .menu-tel .lingue-tel { max-width: 760px; margin-inline: auto; }
[data-tema="bordeaux"] .menu-tel li + li { border-top-color: rgba(244, 236, 220, .16); }
[data-tema="bordeaux"] .menu-tel a.voce-tel { min-height: clamp(56px, 8.6vh, 78px); font-size: clamp(24px, 3.6vw, 40px); font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--crema); }
[data-tema="bordeaux"] .menu-tel a.voce-tel::after { color: rgba(244, 236, 220, .55); }
[data-tema="bordeaux"] .menu-tel a[aria-current="page"] { color: #fff; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 8px; }
[data-tema="bordeaux"] .menu-tel > .pillola { display: flex; background: var(--crema); color: var(--bordeaux); }
[data-tema="bordeaux"] .menu-tel .menu-chiama { color: var(--crema); }
[data-tema="bordeaux"] .lingua-scelta { background: rgba(244, 236, 220, .12); color: var(--crema); }
[data-tema="bordeaux"] .lingua-scelta[aria-current="true"] { background: transparent; color: var(--crema); box-shadow: inset 0 0 0 1.5px var(--crema); }

[data-tema="bordeaux"] .striscia { background: var(--bordeaux); color: var(--crema); }

/* ---------------------------------------------------------------- la copertina: le pizze viste dall'alto che girano piano */
[data-tema="bordeaux"] body.pag-home { padding-top: 0; }
.eroe-pizze {
  position: relative; height: 100vh; height: 100svh; min-height: 560px; max-height: 1080px; overflow: hidden;
  display: grid; place-items: center; text-align: center; color: #fff; background: #000; isolation: isolate;
}
.eroe-pizze .pizze { position: absolute; inset: 0; z-index: -2; }
/* sotto la barra un velo scuro: il menu e il marchio si leggono anche sopra la mozzarella */
.eroe-pizze::before { content: ''; position: absolute; inset: 0 0 auto; height: 190px; z-index: -1; pointer-events: none; background: linear-gradient(rgba(0, 0, 0, .72), rgba(0, 0, 0, .35) 55%, transparent); }
.eroe-pizze .pz { position: absolute; width: var(--d); aspect-ratio: 1; }
.eroe-pizze .pz picture, .eroe-pizze .pz img { display: block; width: 100%; height: 100%; }
.eroe-pizze .pz-1 { --d: min(46vw, 82vh); left: -12vw; top: -20vh; }
.eroe-pizze .pz-2 { --d: min(34vw, 62vh); left: -5vw; bottom: -18vh; }
.eroe-pizze .pz-3 { --d: min(40vw, 72vh); right: -11vw; top: -16vh; }
.eroe-pizze .pz-4 { --d: min(36vw, 64vh); right: -7vw; bottom: -22vh; }
.eroe-pizze .pz-5 { --d: min(24vw, 44vh); left: 38vw; bottom: -22vh; }
/* il centro piu' scuro, per leggere il titolo anche dove le pizze ci passano sotto */
.eroe-pizze::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(52% 46% at 50% 50%, rgba(0, 0, 0, .78), rgba(0, 0, 0, .35) 62%, rgba(0, 0, 0, 0) 85%); }
.eroe-pizze-testo { padding: 0 22px; max-width: 1040px; }
.eroe-pizze h1 { font: 600 clamp(38px, 5.8vw, 80px)/1.03 var(--font); letter-spacing: -.005em; color: #fff; text-wrap: balance; text-shadow: 0 2px 34px rgba(0, 0, 0, .55); }
.eroe-pizze h1 .punto { color: #fff; }
.eroe-pizze-testo p { margin-top: 20px; font: 500 13.5px/1.4 var(--font); letter-spacing: .24em; text-transform: uppercase; color: rgba(255, 255, 255, .88); }
.eroe-giu { position: absolute; left: 50%; bottom: calc(22px + env(safe-area-inset-bottom)); width: 48px; height: 26px; margin-left: -24px; color: #fff; opacity: .9; }
.eroe-giu svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.eroe-giu:hover { opacity: 1; }
@media (max-width: 734px) {
  .eroe-pizze { min-height: 520px; }
  .eroe-pizze .pz-1 { --d: 96vw; left: -46vw; top: -10svh; }
  .eroe-pizze .pz-3 { --d: 84vw; right: -44vw; top: 16svh; }
  .eroe-pizze .pz-2 { --d: 90vw; left: -40vw; bottom: -8svh; }
  .eroe-pizze .pz-4 { --d: 78vw; right: -36vw; bottom: 8svh; }
  .eroe-pizze .pz-5 { display: none; }
  .eroe-pizze::after { background: radial-gradient(80% 50% at 50% 50%, rgba(0, 0, 0, .8), rgba(0, 0, 0, .4) 65%, rgba(0, 0, 0, .1) 100%); }
}
@keyframes gira-pizza { to { transform: rotate(360deg); } }
@keyframes pizze-entra { from { opacity: 0; transform: scale(1.08); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: no-preference) {
  .eroe-pizze .pz img { animation: gira-pizza 150s linear infinite; }
  .eroe-pizze .pz-2 img, .eroe-pizze .pz-3 img { animation-direction: reverse; animation-duration: 120s; }
  .eroe-pizze .pz-4 img { animation-duration: 170s; }
  .eroe-pizze .pizze { animation: pizze-entra 1.6s var(--uscita) .05s both; }
  html.ap-on .eroe-pizze .pz img, html.ap-on .eroe-pizze .pizze { animation-play-state: paused; }
}

/* ---------------------------------------------------------------- le sezioni della home */
.b-sezione { padding-block: clamp(72px, 9vw, 128px); }
.b-sezione + .b-sezione { padding-top: 0; }
.b-chiaro { background: var(--grigio); padding-top: clamp(72px, 9vw, 128px) !important; }
.b-chiaro + .b-sezione, .b-banda + .b-sezione, .vetrina + .b-sezione { padding-top: clamp(72px, 9vw, 128px) !important; }
.b-intro .contenitore { max-width: 1120px; }
.b-maiuscolo { font: 700 clamp(26px, 3.1vw, 42px)/1.12 var(--font); letter-spacing: .015em; text-transform: uppercase; color: var(--bordeaux); text-wrap: balance; max-width: 26em; }
.b-testo { margin-top: 22px; font-size: 18px; line-height: 1.62; color: var(--testo-2); max-width: 38em; }
.b-testo p + p { margin-top: 1em; }
.b-testo-piccolo { font-size: 16px; }
.b-azioni { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 14px; margin-top: 30px; }
.b-azioni.centro { justify-content: center; }
.b-titolo-leggero { font: 400 clamp(32px, 3.6vw, 50px)/1.1 var(--font); color: var(--bordeaux); text-wrap: balance; }
.b-sottotitolo { margin-top: 38px; font: 700 14px/1.3 var(--font); letter-spacing: .16em; text-transform: uppercase; color: var(--bordeaux); }

/* il collage di foto, a scalini */
.b-collage-griglia { display: grid; grid-template-columns: minmax(0, 1fr); gap: 52px; align-items: center; }
.b-foto { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-items: start; }
.b-foto figure, .b-pizze-tre figure, .b-foto-sola { margin: 0; overflow: hidden; background: var(--tessera); }
.b-foto picture, .b-pizze-tre picture, .b-foto-sola picture { display: block; width: 100%; height: 100%; }
.b-foto img, .b-pizze-tre img, .b-foto-sola img { width: 100%; height: 100%; object-fit: cover; }
.b-foto figure { aspect-ratio: 3 / 4; }
.b-foto figure:nth-child(even) { margin-top: 42px; }
.b-foto figure:nth-child(3) { margin-top: -42px; }
figure.nero { background: #000 !important; }
figure.nero img { object-fit: contain !important; }
@media (min-width: 900px) {
  .b-collage-griglia { grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: clamp(44px, 6vw, 100px); }
  .b-foto { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: auto auto; }
  .b-foto .f1 { grid-column: 1; grid-row: 1 / 3; aspect-ratio: 2 / 3; margin-top: 36px; }
  .b-foto .f2 { grid-column: 2; grid-row: 1; aspect-ratio: 1; margin-top: 0; }
  .b-foto .f3 { grid-column: 2; grid-row: 2; aspect-ratio: 1; margin-top: 0; }
  .b-foto .f4 { grid-column: 3; grid-row: 1 / 3; aspect-ratio: 2 / 3; margin-top: 110px; }
}

/* due colonne: testo e foto */
.b-due { display: grid; grid-template-columns: minmax(0, 1fr); gap: 44px; align-items: center; }
@media (min-width: 900px) { .b-due { grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); gap: clamp(44px, 6vw, 100px); } }
.b-pizze-tre { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.b-pizze-tre figure { aspect-ratio: 1; }
.b-pizze-tre figure:nth-child(2) { margin-top: 64px; }
.b-foto-sola { aspect-ratio: 4 / 5; }

/* la sezione dei piatti tondi: bordeaux */
[data-tema="bordeaux"] .vetrina { background: var(--bordeaux); color: var(--crema); }
[data-tema="bordeaux"] .vetrina .b-maiuscolo { color: var(--crema); margin-inline: auto; }
[data-tema="bordeaux"] .vetrina .sotto { color: rgba(244, 236, 220, .82); }
[data-tema="bordeaux"] .vetrina .sotto strong { color: var(--crema); }
[data-tema="bordeaux"] .arco text { fill: var(--crema); font-family: var(--font); font-weight: 600; }
[data-tema="bordeaux"] .piatto, [data-tema="bordeaux"] .piatto-nome { color: var(--crema); }
/* il nome lo dice gia' la scritta ad arco sopra il piatto: il titolo resta per chi usa il lettore di schermo */
[data-tema="bordeaux"] .piatto { position: relative; }   /* il titolo nascosto resta dentro la striscia che scorre: fuori allargava la pagina */
[data-tema="bordeaux"] .piatto-nome { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
[data-tema="bordeaux"] .arco text { font-size: 17px; font-weight: 600; letter-spacing: .2em; }
[data-tema="bordeaux"] .piatto-dati { margin-top: 10px; }
[data-tema="bordeaux"] .piatto-dati { color: rgba(244, 236, 220, .78); }
[data-tema="bordeaux"] .piatto-dati b { color: var(--crema); }
[data-tema="bordeaux"] .piatto-voci { color: rgba(244, 236, 220, .62); }
[data-tema="bordeaux"] .piatto-vai { color: var(--crema); font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
[data-tema="bordeaux"] .vetrina .pillola.chiara { background: var(--crema); color: var(--bordeaux); box-shadow: none; }
[data-tema="bordeaux"] .vetrina .pillola.chiara:hover { background: #fff; color: var(--bordeaux); }
[data-tema="bordeaux"] .pallini-piatti span { background: rgba(244, 236, 220, .35); }
[data-tema="bordeaux"] .pallini-piatti span.attivo { background: var(--crema); }

/* la fascia con la foto della piazza e l'invito (come la loro «restiamo in contatto») */
.b-banda { padding: 0 clamp(12px, 2vw, 24px); background: var(--fondo); }
.b-banda-dentro { position: relative; display: grid; place-items: center; min-height: clamp(440px, 52vw, 640px); overflow: hidden; color: #fff; text-align: center; isolation: isolate; }
.b-banda-dentro > picture { position: absolute; inset: 0; z-index: -2; }
.b-banda-dentro > picture img { width: 100%; height: 100%; object-fit: cover; }
.b-banda-dentro::after { content: ''; position: absolute; inset: 0; z-index: -1; background: rgba(24, 8, 6, .6); }
.b-banda-testo { padding: 56px 22px; max-width: 900px; }
.b-banda .b-maiuscolo { color: #fff; margin-inline: auto; }
.b-banda p { margin: 14px auto 0; max-width: 34em; font-size: 18px; color: rgba(255, 255, 255, .9); }
.b-banda .b-orario { font-size: 14px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; }
[data-tema="bordeaux"] .pillola.b-chiara { background: var(--crema); color: var(--bordeaux); }
[data-tema="bordeaux"] .pillola.b-chiara:hover { background: #fff; }
[data-tema="bordeaux"] .pillola.b-vuota { background: transparent; color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .85); }
[data-tema="bordeaux"] .pillola.b-vuota:hover { background: rgba(255, 255, 255, .12); }

/* dove, orari, contatti */
.b-tre { display: grid; grid-template-columns: minmax(0, 1fr); gap: 44px; }
@media (min-width: 900px) { .b-tre { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 56px; } }
.b-etichetta { margin-bottom: 18px; padding-bottom: 12px; border-bottom: 1.5px solid var(--bordeaux); font: 700 14px/1.3 var(--font); letter-spacing: .16em; text-transform: uppercase; color: var(--bordeaux); }
.b-colonna { min-width: 0; }
.b-colonna p { color: var(--testo-2); }
.b-colonna p + p, .b-colonna p + .orari { margin-top: 10px; }
.b-colonna .scopri { margin-top: 16px; }
.b-grande { font: 500 23px/1.3 var(--font); color: var(--testo) !important; overflow-wrap: anywhere; }
.b-grande a:hover { color: var(--bordeaux); }
.b-colonna .b-azioni { margin-top: 18px; }
.b-domande .b-maiuscolo { margin-bottom: 26px; }

/* ---------------------------------------------------------------- le pagine interne */
[data-tema="bordeaux"] .pagina-testa { text-align: left; }
[data-tema="bordeaux"] .pagina-testa .sotto { margin-left: 0; }
[data-tema="bordeaux"] .pagina-testa .azioni { justify-content: flex-start; }
[data-tema="bordeaux"] .sezione.grigia { background: var(--grigio); }
[data-tema="bordeaux"] .testa.centro { text-align: center; }
[data-tema="bordeaux"] .sezione.invito { background: var(--bordeaux); color: var(--crema); }
[data-tema="bordeaux"] .invito .titolo-sezione { color: var(--crema); }
[data-tema="bordeaux"] .invito .sotto { color: rgba(244, 236, 220, .85); }
[data-tema="bordeaux"] .invito .pillola { background: var(--crema); color: var(--bordeaux); }
[data-tema="bordeaux"] .invito .scopri { color: var(--crema); }
[data-tema="bordeaux"] .riquadro h3, [data-tema="bordeaux"] .scheda h3 { text-transform: uppercase; letter-spacing: .04em; color: var(--bordeaux); font-size: 21px; }
[data-tema="bordeaux"] .domanda summary { font-weight: 500; }
[data-tema="bordeaux"] .domanda summary::after { border-color: var(--bordeaux); }
[data-tema="bordeaux"] .voce-contatto a { color: var(--bordeaux); }
[data-tema="bordeaux"] .momento figcaption { text-transform: uppercase; letter-spacing: .06em; font-size: 14px; }

/* il menu */
[data-tema="bordeaux"] .sezioni-menu { background: rgba(247, 242, 234, .97); border-bottom-color: var(--filo); }
[data-tema="bordeaux"] .sezioni-menu a { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--testo-2); }
[data-tema="bordeaux"] .sezioni-menu a.attiva { background: var(--bordeaux); color: var(--crema); }
[data-tema="bordeaux"] .cerca input { background: #fff; box-shadow: inset 0 0 0 1px var(--filo); }
[data-tema="bordeaux"] .filtro { background: var(--grigio); font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; }
[data-tema="bordeaux"] .filtro[aria-pressed="true"] { background: var(--bordeaux); color: var(--crema); }
[data-tema="bordeaux"] .menu-sezione > header { border-bottom: 1.5px solid var(--bordeaux); }
[data-tema="bordeaux"] .menu-sezione h2 { font-size: clamp(26px, 3.2vw, 38px); font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: var(--bordeaux); }
[data-tema="bordeaux"] .gruppo-menu { letter-spacing: .14em; text-transform: uppercase; }
[data-tema="bordeaux"] .voce .nome { font-size: 16px; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; }
[data-tema="bordeaux"] .voce .prezzo { color: var(--bordeaux); }
[data-tema="bordeaux"] .segno { background: var(--grigio); }
[data-tema="bordeaux"] .segno.casa { background: rgba(112, 16, 16, .1); color: var(--bordeaux); }
[data-tema="bordeaux"] .tabella-allergeni td:first-child { color: var(--bordeaux); }

/* la prenotazione */
[data-tema="bordeaux"] .modulo { background: var(--grigio); }
[data-tema="bordeaux"] .campo input, [data-tema="bordeaux"] .campo select, [data-tema="bordeaux"] .campo textarea { background: #fff; }
[data-tema="bordeaux"] .passi-modulo span { background: var(--fondo); }
[data-tema="bordeaux"] .passi-modulo span.attivo { background: var(--bordeaux); color: var(--crema); }
[data-tema="bordeaux"] .scelta input:checked + span { background: var(--bordeaux); border-color: var(--bordeaux); color: var(--crema); }

/* ---------------------------------------------------------------- il piede bordeaux */
[data-tema="bordeaux"] .piede { background: var(--bordeaux); color: rgba(244, 236, 220, .78); }
[data-tema="bordeaux"] .piede-alto, [data-tema="bordeaux"] .piede-colonne, [data-tema="bordeaux"] .dati-societari { border-color: rgba(244, 236, 220, .18); }
[data-tema="bordeaux"] .piede-marchio img { width: 170px; }
[data-tema="bordeaux"] .piede-colonne h2 { color: var(--crema); font-size: 12.5px; letter-spacing: .16em; text-transform: uppercase; }
[data-tema="bordeaux"] .piede a, [data-tema="bordeaux"] .piede-colonne a, [data-tema="bordeaux"] .copy-bar a, [data-tema="bordeaux"] .piede-recapiti a { color: var(--crema); }
[data-tema="bordeaux"] .piede .stato.aperto { color: #a6e3b2; }
[data-tema="bordeaux"] .piede .stato.chiuso { color: #ffb8ad; }
[data-tema="bordeaux"] .social a { background: rgba(244, 236, 220, .12); color: var(--crema); }
[data-tema="bordeaux"] .social a:hover { background: rgba(244, 236, 220, .22); }
[data-tema="bordeaux"] .credit { color: var(--crema) !important; }

/* ---------------------------------------------------------------- l'apertura: il marchio crema sul bordeaux */
[data-tema="bordeaux"] #ap { background: radial-gradient(120% 90% at 50% 42%, #8a1a18 0%, #5c0c0c 58%, #3a0606 100%); --ap-oro: #F4ECDC; --ap-luce: #FFFFFF; }

/* ---------------------------------------------------------------- 12/10: le foto del loro sito (Simone) */
/* la frase d'apertura col disegno a tratto di Piazza Duomo (dal loro sito, ricolorato bordeaux) */
.b-intro-griglia { display: grid; grid-template-columns: minmax(0, 1fr); gap: 36px; align-items: center; }
.b-disegno { margin: 0; }
.b-disegno img { width: 100%; height: auto; }
@media (min-width: 900px) { .b-intro-griglia { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(36px, 5vw, 80px); } }
/* la pizzeria: il forno largo sopra, due pizze sotto */
.b-pizze-tre .b-forno { grid-column: 1 / -1; aspect-ratio: 2 / 1; margin-top: 0 !important; }
.b-pizze-tre .b-forno img { object-fit: cover; }
.b-pizze-tre figure.nero:nth-of-type(3) { margin-top: 48px; }
.b-pizze-tre figure:nth-child(2) { margin-top: 0; }
/* la foto di giorno larga */
.b-foto-sola.largo { aspect-ratio: 4 / 3; }
/* il Duomo: due immagini d'epoca, una sopra l'altra a scalino */
.b-duomo { background: var(--fondo); padding-top: clamp(72px, 9vw, 128px) !important; }
.b-epoca { position: relative; padding-bottom: 18%; }
.b-epoca figure { margin: 0; overflow: hidden; background: var(--tessera); box-shadow: 0 18px 40px rgba(40, 10, 5, .18); }
.b-epoca picture { display: block; }
.b-epoca img { width: 100%; height: auto; }
.b-epoca .e1 { width: 58%; }
.b-epoca .e2 { position: absolute; right: 0; bottom: 0; width: 66%; }

/* la pizzeria sul nero: il forno e le foto delle pizze hanno il fondo nero, cosi' le pizze galleggiano (12/10/2026) */
.b-pizzeria { background: #000; padding-top: clamp(72px, 9vw, 128px) !important; }
.b-pizzeria .b-titolo-leggero { color: var(--crema); }
.b-pizzeria .b-testo { color: rgba(244, 236, 220, .78); }
[data-tema="bordeaux"] .b-pizzeria .pillola { background: var(--crema); color: var(--bordeaux); }
[data-tema="bordeaux"] .b-pizzeria .pillola:hover { background: #fff; }
.b-pizzeria .b-forno { background: #000; }
.b-orario .unito { white-space: nowrap; }
@media (max-width: 600px) { .b-banda .b-orario { font-size: 13px; letter-spacing: .14em; } }

/* «In tavola»: le foto dei piatti scelte da Ermuut il 13/10/2026 */
.b-cucina { background: var(--grigio); padding-top: clamp(72px, 9vw, 128px) !important; }
.b-cucina-testa { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 18px 24px; margin-bottom: clamp(28px, 4vw, 48px); }
.b-cucina-griglia { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 12px; }
@media (min-width: 900px) { .b-cucina-griglia { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } }
.b-piatto { display: block; color: inherit; text-decoration: none; }
.b-piatto figure { margin: 0; aspect-ratio: 4 / 5; overflow: hidden; background: var(--tessera); }
.b-piatto picture, .b-piatto img { display: block; width: 100%; height: 100%; }
.b-piatto img { object-fit: cover; transition: transform .9s var(--uscita); }
@media (hover: hover) { a.b-piatto:hover img { transform: scale(1.04); } }
.b-piatto-nome { display: block; margin-top: 12px; font: 600 13px/1.35 var(--font); letter-spacing: .14em; text-transform: uppercase; color: var(--bordeaux); }
a.b-piatto .b-piatto-nome::after { content: ' \203A'; }
/* la pizza nuova sotto il forno, larga */
.b-pizze-tre .b-pizza { grid-column: 1 / -1; aspect-ratio: 3 / 2; margin-top: 0 !important; }