/* Il Mio Cognome · colori e caratteri presi dai PDF */
@font-face { font-family: "Playfair Display"; src: url(/fonts/playfair-display-400-normal.woff2) format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Playfair Display"; src: url(/fonts/playfair-display-400-italic.woff2) format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Playfair Display"; src: url(/fonts/playfair-display-600-normal.woff2) format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "EB Garamond"; src: url(/fonts/eb-garamond-400-normal.woff2) format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "EB Garamond"; src: url(/fonts/eb-garamond-400-italic.woff2) format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "EB Garamond"; src: url(/fonts/eb-garamond-600-normal.woff2) format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Dancing Script"; src: url(/fonts/dancing-script-400-normal.woff2) format("woff2"); font-weight: 400; font-display: swap; }

:root {
  --carta: #f0e6cf;
  --carta-chiara: #f6efdf;
  --carta-scura: #e6d9bd;
  --filetto: #cdbb9c;
  --inchiostro: #38201a;
  --seppia: #6b5238;
  --seppia-chiara: #8c765c;
  --ceralacca: #981818;
  --ceralacca-scura: #761010;
  --blu: #385870;
  --rosso-acquisto: #b3241b;
  --rosso-acquisto-scuro: #8a170f;
  --titoli: "Playfair Display", Georgia, serif;
  --testo: "EB Garamond", Garamond, Georgia, serif;
  --larghezza: 1160px;
  --raggio: 3px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--carta);
  background-image:
    radial-gradient(ellipse at 20% 0%, rgba(255,255,255,.35), transparent 60%),
    radial-gradient(ellipse at 100% 100%, rgba(150,110,60,.08), transparent 55%);
  background-attachment: fixed;
  color: var(--inchiostro);
  font: 400 1.2rem/1.6 var(--testo);
  font-feature-settings: "kern", "liga", "onum";
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--ceralacca); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--ceralacca-scura); }
h1, h2, h3 { font-family: var(--titoli); font-weight: 400; line-height: 1.15; color: var(--inchiostro); margin: 0 0 .5em; }
h1 { font-size: clamp(2.3rem, 5vw, 3.6rem); letter-spacing: -.01em; }
h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); }
h3 { font-size: 1.35rem; }
p { margin: 0 0 1em; }
:focus-visible { outline: 2px solid var(--ceralacca); outline-offset: 3px; }

.contenitore { width: min(100% - 32px, var(--larghezza)); margin-inline: auto; }
.stretto { max-width: 760px; }
.centro { text-align: center; }
.nascosto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.salta { position: absolute; left: -999px; }
.salta:focus { left: 16px; top: 16px; background: var(--carta-chiara); padding: 8px 12px; z-index: 10; }

.occhiello {
  font: 600 .78rem/1.3 var(--testo);
  letter-spacing: .28em; text-transform: uppercase;
  color: var(--ceralacca); margin-bottom: .9em;
}

.avviso-bozza { background: var(--inchiostro); color: var(--carta); text-align: center; font-size: .85rem; letter-spacing: .1em; padding: 4px; }
.avviso-esempio { border: 1px dashed var(--ceralacca); color: var(--ceralacca); font-size: 1rem; padding: 8px 14px; margin-top: 16px; margin-bottom: 0; }

/* Testata */
.testata { border-bottom: 1px solid var(--filetto); background: rgba(246,239,223,.7); position: relative; z-index: 5; }
.testata__riga { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 12px; }
.marchio { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--inchiostro); }
.marchio img { width: 52px; height: 52px; }
.marchio__testo { display: flex; flex-direction: column; }
.marchio__nome { font: 400 1.45rem/1.1 var(--titoli); }
.marchio__sotto { font-size: .72rem; letter-spacing: .22em; text-transform: uppercase; color: var(--seppia-chiara); }
.menu { display: flex; align-items: center; gap: 26px; }
.menu a { color: var(--inchiostro); text-decoration: none; font-size: 1.1rem; }
.menu a:hover, .menu a[aria-current] { color: var(--ceralacca); }
.menu a[aria-current] { text-decoration: underline; }
.menu .menu__cerca { border: 1px solid var(--ceralacca); color: var(--ceralacca); padding: 6px 14px; border-radius: var(--raggio); }
.menu-pulsante { display: none; background: none; border: 0; padding: 10px; cursor: pointer; }
.social-testata { display: flex; align-items: center; gap: 10px; }
.social-testata a { display: block; line-height: 0; transition: transform .15s; }
.social-testata a:hover { transform: translateY(-1px) scale(1.08); }
.social-testata svg { width: 26px; height: 26px; }
.menu-pulsante span:not(.nascosto) { display: block; width: 24px; height: 2px; background: var(--inchiostro); margin: 5px 0; }

/* Pulsanti */
.pulsante {
  display: inline-block; font: 600 1.05rem/1 var(--testo); letter-spacing: .03em;
  padding: 13px 22px; border: 1px solid var(--ceralacca); color: var(--ceralacca);
  border-radius: var(--raggio); text-decoration: none; background: transparent; cursor: pointer;
}
.pulsante:hover { background: var(--ceralacca); color: var(--carta-chiara); }
.pulsante--pieno { background: var(--rosso-acquisto); border-color: var(--rosso-acquisto); color: #fff; box-shadow: 0 3px 0 var(--rosso-acquisto-scuro), 0 6px 16px rgba(140,25,15,.25); }
.pulsante--pieno:hover { background: var(--rosso-acquisto-scuro); border-color: var(--rosso-acquisto-scuro); color: #fff; }
.pulsante--spento { cursor: not-allowed; }

/* Ricerca */
.cerca { display: flex; gap: 8px; max-width: 520px; }
.cerca input {
  flex: 1; min-width: 0; font: 400 1.2rem var(--testo); color: var(--inchiostro);
  padding: 12px 16px; background: var(--carta-chiara); border: 1px solid var(--filetto); border-radius: var(--raggio);
}
.cerca input::placeholder { color: var(--seppia-chiara); font-style: italic; }
.cerca--catalogo { margin: 0 auto 32px; }
.cerca__vuoto { text-align: center; max-width: 640px; margin: 0 auto 32px; }

/* Apertura della home */
.apertura { padding-block: clamp(40px, 7vw, 90px); border-bottom: 1px solid var(--filetto); }
.apertura__griglia { display: grid; grid-template-columns: 1.15fr .85fr; gap: 48px; align-items: center; }
.apertura__lead { font-size: 1.35rem; color: var(--seppia); max-width: 34em; margin-bottom: 28px; }
.apertura__sigillo img { width: min(100%, 440px); margin-inline: auto; filter: drop-shadow(0 12px 24px rgba(70,40,20,.18)); }

/* Sezioni */
.sezione { padding-block: clamp(48px, 7vw, 88px); }
.sezione--prima { padding-top: 24px; }
.sezione--scura { background: rgba(214,196,160,.28); border-block: 1px solid var(--filetto); }
.sezione__testa { text-align: center; max-width: 720px; margin: 0 auto 40px; }
.sezione__testa p:not(.occhiello) { color: var(--seppia); }

/* Volumi */
.griglia-volumi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.carta-volume { background: var(--carta-chiara); border: 1px solid var(--filetto); padding: 24px; text-align: center; display: flex; flex-direction: column; align-items: center; }
.carta-volume img { width: 100%; max-width: 260px; margin-bottom: 20px; box-shadow: 0 8px 20px rgba(70,40,20,.2); }
.carta-volume h2, .carta-volume h3 { font-size: 1.4rem; }
.carta-volume h2 a, .carta-volume h3 a { color: inherit; text-decoration: none; }
.carta-volume__regioni { font-size: 1rem; color: var(--seppia-chiara); font-style: italic; }
.carta-volume__dati { font-size: 1rem; color: var(--seppia); margin-top: auto; }
.carta-volume--attesa { opacity: .8; }
.carta-volume__segnaposto {
  width: 100%; max-width: 260px; aspect-ratio: 1 / 1.414; margin-bottom: 20px;
  border: 1px solid var(--filetto); outline: 1px solid var(--filetto); outline-offset: -8px;
  display: grid; place-items: center; background: var(--carta);
}
.carta-volume__segnaposto span { font: italic 400 1.8rem var(--titoli); color: var(--seppia-chiara); }

/* Cognomi */
.griglia-cognomi { display: grid; grid-template-columns: repeat(4, minmax(0, 210px)); justify-content: center; gap: 28px; margin-bottom: 36px; }
.carta-cognome { display: flex; flex-direction: column; align-items: center; text-align: center; text-decoration: none; color: var(--inchiostro); }
.carta-cognome img { box-shadow: 0 6px 16px rgba(70,40,20,.2); margin-bottom: 14px; transition: transform .2s; }
.carta-cognome:hover img { transform: translateY(-4px); }
.carta-cognome__nome { font: 400 1.4rem var(--titoli); }
.carta-cognome__motto { font-style: italic; color: var(--seppia); font-size: 1rem; }
.carta-cognome__prezzo { font-size: .9rem; color: var(--ceralacca); letter-spacing: .08em; margin-top: 4px; }
.alfabeto { border-top: 1px solid var(--filetto); padding-top: 24px; font-size: 1.05rem; }
.alfabeto__lettera { font-size: 1.3rem; color: var(--ceralacca); margin: 12px 0 4px; }

/* Progetto */
.progetto { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; }
.promesse { list-style: none; margin: 0; padding: 0; }
.promesse li { border-left: 3px solid var(--ceralacca); padding: 4px 0 4px 18px; margin-bottom: 22px; color: var(--seppia); }
.promesse strong { display: block; color: var(--inchiostro); font-family: var(--titoli); font-weight: 400; font-size: 1.2rem; }

/* Video */
.video-home { display: grid; grid-template-columns: .8fr 1.2fr; gap: 48px; align-items: center; }
.video__pulsante { position: relative; display: block; width: 100%; padding: 0; border: 1px solid var(--filetto); background: var(--inchiostro); cursor: pointer; aspect-ratio: 16 / 9; overflow: hidden; }
.video__pulsante img { width: 100%; height: 100%; object-fit: cover; }
.video__play { position: absolute; inset: 0; margin: auto; width: 78px; height: 78px; border-radius: 50%; background: var(--ceralacca); box-shadow: 0 4px 14px rgba(0,0,0,.35); }
.video__play::after { content: ""; position: absolute; left: 31px; top: 23px; border-style: solid; border-width: 16px 0 16px 26px; border-color: transparent transparent transparent var(--carta-chiara); }
.video iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; display: block; }
.video__nota { font-size: .9rem; color: var(--seppia-chiara); font-style: italic; margin-top: 8px; }

/* Domande */
.domanda { border-bottom: 1px solid var(--filetto); padding: 14px 0; }
.domanda summary { cursor: pointer; font: 400 1.25rem var(--titoli); list-style: none; display: flex; justify-content: space-between; gap: 16px; }
.domanda summary::-webkit-details-marker { display: none; }
.domanda summary::after { content: "+"; color: var(--ceralacca); font-size: 1.5rem; line-height: 1; }
.domanda[open] summary::after { content: "–"; }
.domanda p { margin: 12px 0 4px; color: var(--seppia); }

/* Briciole */
.briciole { font-size: .95rem; color: var(--seppia-chiara); padding-top: 18px; }
.briciole a { color: var(--seppia); }

/* Pagina prodotto (volume) */
.prodotto { display: grid; grid-template-columns: .9fr 1.1fr; gap: 56px; padding-block: 32px 64px; align-items: start; }
.prodotto__immagine img { box-shadow: 0 14px 32px rgba(70,40,20,.25); margin-inline: auto; }
.prodotto__sotto { font: italic 400 1.35rem var(--titoli); color: var(--seppia); }
.prodotto__dati { color: var(--seppia-chiara); font-size: 1.05rem; }
.prodotto .pulsante { margin-bottom: 28px; }
.prodotto__regioni { font-size: 1rem; color: var(--seppia); }
.contiene { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.elenco-segni { list-style: none; padding: 0; margin: 0 0 28px; }
.elenco-segni li { padding-left: 28px; position: relative; margin-bottom: 12px; }
.elenco-segni li::before { content: "✦"; color: var(--ceralacca); position: absolute; left: 0; font-size: .9rem; top: 4px; }
.anteprime { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: start; }
.anteprime a { display: block; transition: transform .2s; }
.anteprime a:hover { transform: translateY(-4px); }
.anteprime img { width: 100%; height: auto; box-shadow: 0 10px 24px rgba(70,40,20,.22); }

/* Pagina del volume */
.elenco-cognomi { list-style: none; padding: 0; margin: 12px 0 8px; columns: 4 140px; column-gap: 24px; font-size: 1rem; }
.elenco-cognomi li { padding: 2px 0; break-inside: avoid; }
.elenco-cognomi a { color: var(--ceralacca); }

/* Pagina del volume */
.prodotto__acquisto { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; margin: 8px 0 26px; }
.prodotto .prodotto__acquisto .pulsante { margin: 0; padding: 18px 34px; font-size: 1.2rem; }
.prodotto__prezzo { margin: 0; font: 600 2rem/1.1 var(--titoli); color: var(--inchiostro); }
.prodotto__prezzo span { display: block; font: 400 .95rem var(--testo); color: var(--seppia-chiara); margin-top: 4px; }
.etichette { list-style: none; padding: 0; margin: 18px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
.etichette li { border: 1px solid var(--filetto); background: var(--carta-chiara); border-radius: 999px; padding: 6px 14px; font-size: .95rem; color: var(--seppia); }
.numeri { background: var(--inchiostro); color: var(--carta); }
.numeri__griglia { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; padding-block: 26px; text-align: center; }
.numeri p { margin: 0; font-size: 1rem; color: #e6d6b8; }
.numeri strong { display: block; font: 600 2.2rem/1.1 var(--titoli); color: #f0c98a; margin-bottom: 4px; }
.volume__corpo { max-width: 820px; padding-block: 40px 16px; }
.volume__corpo h2 { margin-top: 1.6em; }
.volume__chiusura { margin-top: 44px; padding-bottom: 32px; }
.trova { background: var(--carta-chiara); border: 2px solid var(--ceralacca); border-radius: 6px; padding: 26px 28px; margin: 48px 0 16px; }
.trova h2 { margin-top: 0; }
.trova__cerca { max-width: none; margin: 14px 0; }
.trova__cerca input { font-size: 1.15rem; }
.trova__esito { border-left: 4px solid var(--ceralacca); background: #fff8ec; padding: 14px 18px; margin: 0 0 18px; }
.trova__esito p { margin: 0 0 10px; }
.trova__esito p:last-child { margin-bottom: 0; }
.trova__esito--si { border-left-color: #2f6b3a; }
.trova__apri { display: flex; width: 100%; justify-content: space-between; align-items: center; gap: 12px; margin-top: 10px; padding: 14px 18px; background: var(--carta); border: 1px solid var(--seppia-chiara); border-radius: 4px; font: 600 1.05rem var(--testo); color: var(--inchiostro); cursor: pointer; text-align: left; }
.trova__apri::after { content: "▾"; color: var(--ceralacca); font-size: 1.2rem; transition: transform .2s; }
.trova__apri[aria-expanded="true"]::after { transform: rotate(180deg); }
.trova__apri:hover { border-color: var(--ceralacca); }
.trova__proposta { font: 600 1rem var(--testo); color: var(--ceralacca); background: none; border: 1px solid var(--filetto); border-radius: 999px; padding: 3px 12px; margin: 2px 2px; cursor: pointer; }
.trova__proposta:hover { border-color: var(--ceralacca); }
.trova__nota { font-size: .95rem; color: var(--seppia-chiara); margin: 14px 0 0; }
.elenco-cognomi { list-style: none; padding: 12px 4px 4px; margin: 0; columns: 4 140px; column-gap: 24px; font-size: 1rem; }
.elenco-cognomi li { padding: 2px 0; break-inside: avoid; }
.elenco-cognomi a { color: var(--ceralacca); font-weight: 600; }

.prodotto__riassunto { font-size: 1.1rem; color: var(--seppia); margin: 0; }
.rimando-volume { display: grid; grid-template-columns: 150px 1fr; gap: 28px; align-items: center; background: var(--carta-chiara); border: 2px solid var(--ceralacca); border-radius: 6px; padding: 24px 28px; margin: 48px 0 16px; }
.rimando-volume img { box-shadow: 0 8px 18px rgba(70,40,20,.22); }
.rimando-volume p { margin: 0 0 12px; }
.rimando-volume .occhiello { margin-bottom: 4px; }
.rimando-volume__titolo { font: 400 1.5rem var(--titoli); }
.rimando-volume__titolo a { color: var(--inchiostro); text-decoration: none; }

/* Pagina del cognome */
.cognome { padding-block: 24px 48px; }
.cognome__testa { text-align: center; border-bottom: 1px solid var(--filetto); padding-bottom: 28px; margin-bottom: 40px; }
.cognome__testa h1 { font-size: clamp(2.8rem, 7vw, 4.6rem); letter-spacing: .06em; text-transform: uppercase; margin-bottom: .1em; }
.cognome__h1-sotto { display: block; font-size: 1.15rem; letter-spacing: .02em; text-transform: none; font-style: italic; color: var(--seppia); margin-top: 8px; }
.cognome__motto { font: italic 400 1.3rem var(--titoli); color: var(--ceralacca); }
.cognome__griglia { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 56px; align-items: start; }
.cognome__corpo h2 { margin-top: 1.6em; }
.acquisto { position: sticky; top: 24px; background: var(--carta-chiara); border: 1px solid var(--filetto); padding: 22px; text-align: center; }
.acquisto img { width: 190px; margin: 0 auto 14px; box-shadow: 0 8px 18px rgba(70,40,20,.22); }
.acquisto__titolo { font: 400 1.25rem var(--titoli); margin-bottom: 4px; }
.acquisto__dati, .acquisto__nota { font-size: .95rem; color: var(--seppia-chiara); }
.acquisto .pulsante { width: 100%; }
.acquisto__nota { margin: 12px 0 0; font-style: italic; }

.scheda-archivio { border: 1px solid var(--seppia-chiara); outline: 1px solid var(--seppia-chiara); outline-offset: 4px; background: var(--carta-chiara); padding: 22px 26px; margin: 6px 6px 32px; }
.scheda-archivio__titolo { font-size: 1.4rem; text-align: center; margin: 0 0 12px; }
.scheda-archivio dl { margin: 0; }
.scheda-archivio dl div { display: grid; grid-template-columns: 170px 1fr; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--carta-scura); }
.scheda-archivio dl div:last-child { border-bottom: 0; }
.scheda-archivio dt { font-size: .75rem; letter-spacing: .2em; text-transform: uppercase; color: var(--seppia-chiara); padding-top: 4px; }
.scheda-archivio dd { margin: 0; }

.testo-lungo h2 { margin-top: 1.4em; }
.testo-lungo blockquote { margin: 0 0 1.5em; border-left: 3px solid var(--ceralacca); padding: 4px 0 4px 18px; color: var(--seppia); }
.testo-lungo em { color: var(--seppia); }
.tabella { width: 100%; border-collapse: collapse; font-size: 1.1rem; margin-bottom: 24px; }
.tabella th { text-align: left; font-size: .75rem; letter-spacing: .2em; text-transform: uppercase; color: var(--seppia-chiara); font-weight: 400; border-bottom: 1px solid var(--seppia-chiara); padding: 8px 10px; }
.tabella td { padding: 10px; border-bottom: 1px solid var(--carta-scura); }
.tabella td:first-child { font-family: var(--titoli); }

.rimando { border: 1px solid var(--filetto); background: var(--carta-chiara); padding: 18px 24px; margin: 0 0 40px; text-align: center; }
.rimando p { margin: 0; }
.articolo__immagine { width: 100%; height: auto; margin: 8px 0 32px; border: 1px solid var(--filetto); box-shadow: 0 8px 20px rgba(70,40,20,.15); }
.griglia-volumi--articolo { gap: 16px; margin: 40px 0; }
.griglia-volumi--articolo .carta-volume { padding: 16px; }
.griglia-volumi--articolo .carta-volume h3 { font-size: 1.1rem; }
.griglia-volumi--articolo .pulsante { margin-top: 8px; }
.carta-articolo { display: flex; flex-direction: column; background: var(--carta-chiara); border: 1px solid var(--filetto); transition: box-shadow .2s, transform .2s; }
.carta-articolo:hover { box-shadow: 0 10px 24px rgba(70,40,20,.14); transform: translateY(-2px); }
.carta-articolo__immagine img { display: block; width: 100%; height: auto; aspect-ratio: 1200 / 630; object-fit: cover; }
.carta-articolo__corpo { display: flex; flex-direction: column; flex: 1; padding: 20px 22px 24px; }
.carta-articolo__meta { font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ceralacca); margin: 0 0 8px; }
.carta-articolo h2, .carta-articolo h3 { margin: 0 0 10px; }
.carta-articolo h3 { font-size: 1.3rem; }
.carta-articolo h2 a, .carta-articolo h3 a { color: var(--inchiostro); text-decoration: none; }
.carta-articolo__corpo > p:not(.carta-articolo__meta) { color: var(--seppia); }
.carta-articolo__leggi { margin-top: auto; color: var(--ceralacca); font-weight: 600; text-decoration: none; }
.carta-articolo--grande { display: grid; grid-template-columns: 1.25fr 1fr; align-items: center; margin-bottom: 40px; }
.carta-articolo--grande .carta-articolo__corpo { padding: 32px 36px; }
.carta-articolo--grande h2 { font-size: 2rem; }
.griglia-articoli { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 360px)); justify-content: center; gap: 28px; margin-bottom: 36px; }

.barra-acquisto { display: none; }

/* Piede */
.piede { border-top: 1px solid var(--filetto); background: rgba(214,196,160,.35); padding-top: 48px; font-size: 1.05rem; }
.piede__griglia { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 32px; }
.piede__marchio { display: flex; gap: 16px; align-items: flex-start; color: var(--seppia); }
.piede__marchio img { flex: none; }
.piede__marchio strong { font: 400 1.2rem var(--titoli); color: var(--inchiostro); }
.piede nav { display: flex; flex-direction: column; gap: 6px; }
.piede nav a { color: var(--seppia); text-decoration: none; }
.piede nav a:hover { color: var(--ceralacca); }
.piede__titolo { font-size: .75rem; letter-spacing: .22em; text-transform: uppercase; color: var(--ceralacca); margin-bottom: 6px; }
.piede__fondo { border-top: 1px solid var(--filetto); margin-top: 40px; padding-block: 18px; font-size: .9rem; color: var(--seppia-chiara); text-align: center; }

/* Schermi piccoli */
@media (max-width: 900px) {
  .apertura__griglia, .progetto, .video-home, .prodotto, .contiene, .cognome__griglia { grid-template-columns: 1fr; gap: 32px; }
  .apertura__sigillo { order: -1; }
  .apertura__sigillo img { width: 220px; }
  .griglia-volumi { grid-template-columns: 1fr; max-width: 420px; margin-inline: auto; }
  .carta-articolo--grande { grid-template-columns: 1fr; }
  .carta-articolo--grande .carta-articolo__corpo { padding: 22px; }
  .carta-articolo--grande h2 { font-size: 1.6rem; }
  .griglia-articoli { grid-template-columns: 1fr 1fr; gap: 20px; }
  .acquisto { position: static; }
  .piede__griglia { grid-template-columns: 1fr 1fr; }
  .piede__marchio { grid-column: 1 / -1; }
  .menu-pulsante { display: block; order: 2; }
  .social-testata { order: 1; margin-left: auto; gap: 8px; }
  .social-testata svg { width: 24px; height: 24px; }
  .menu { display: none; position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 0; background: var(--carta-chiara); border-bottom: 1px solid var(--filetto); padding: 8px 16px 16px; }
  .menu a { padding: 12px 0; border-bottom: 1px solid var(--carta-scura); }
  .menu .menu__cerca { margin-top: 12px; text-align: center; }
  .menu.aperto { display: flex; }
  .barra-acquisto { display: flex; position: sticky; bottom: 0; z-index: 4; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 16px; background: var(--carta-chiara); border-top: 1px solid var(--filetto); box-shadow: 0 -4px 14px rgba(70,40,20,.12); font-family: var(--titoli); }
  .barra-acquisto .pulsante { padding: 11px 16px; }
}
@media (max-width: 560px) {
  body { font-size: 1.12rem; }
  .marchio__sotto { display: none; }
  .marchio__nome { font-size: 1.25rem; }
  .griglia-cognomi { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
  .griglia-cognomi--home > :nth-child(n+5) { display: none; }
  .numeri__griglia { grid-template-columns: repeat(2, 1fr); }
  .griglia-articoli { grid-template-columns: 1fr; }
  .trova { padding: 20px 18px; }
  .rimando-volume { grid-template-columns: 90px 1fr; gap: 16px; padding: 18px; }
  .rimando-volume .pulsante { white-space: nowrap; padding: 12px 16px; font-size: 1rem; }
  .prodotto__acquisto { gap: 14px; }
  .prodotto .prodotto__acquisto .pulsante { padding: 15px 20px; font-size: 1.05rem; }
  .prodotto__prezzo { font-size: 1.7rem; flex: 1 1 0; min-width: 110px; }
  .scheda-archivio dl div { grid-template-columns: 1fr; gap: 2px; }
  .anteprime { gap: 10px; }
  .piede__griglia { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .carta-cognome img { transition: none; } }