@font-face{font-family:"Cormorant Garamond";src:url("/maddalena-home/fonts/cormorant-garamond-latin-wght-normal.woff2")}@font-face{font-family:Karla;src:url("/maddalena-home/fonts/karla-latin-wght-normal.woff2")}/* Maddalena classico. All the theme's style, rebuilt from the previous site's computed styles.

   No UIkit: same sizes, same rhythm, our class names.

   Breakpoints as the original: phone first; 640 px the container gets wider margins; 960 px the computer header and two columns.

   Fonts: @font-face comes from theme.json (Cormorant Garamond, Karla, files in assets/fonts).

   The agreed corrections are marked "correzione N". */



/* ===================================================================== TOKENS (brand kit, custom.css of the original) */

:root {

  --mb-crema: #F7F4EE;

  --mb-antracite: #1C1A17;

  --mb-crema-deep: #E4DCCC;

  --mb-bordeaux: #6E2E2A;

  --mb-beige: #C9B79C;

  --mb-display: 'Cormorant Garamond', Georgia, serif;

  --mb-testo: Karla, system-ui, sans-serif;

  --mb-tenue: rgba(28, 26, 23, .72);      /* the original's small text (uk-text-meta in the I2 style) */

  --mb-grigio: #635458;                   /* the original's dates and article navigation (UIkit muted) */

  --mb-enfasi: #A8384C;                   /* correzione 4: the original's pink italics #D55067 were 3.9:1 on crema; this is 5.7:1 on crema, 4.6:1 on crema-deep */

  --bordo: 15px;                          /* page edge, as UIkit's container: 15 / 30 / 40 px */

  --fascia: 40px;                         /* section padding, as UIkit's section: 40 / 70 px */

  /* Text scale (review 2026-10-12): the original's ratio 1.25 from the 17 px body (theme.json), and no size outside it.

     Small for labels, dates and notes only; reading text is always --t-testo. Headings one step smaller on the phone. */

  --t-piccolo: 13.6px;

  --t-testo: 17px;

  --t-attacco: 21.2px;

  --t-t3: 26.6px;

  --t-t2: 26.6px;

  --t-t1: 33.2px;

  --t-grande: clamp(46px, 8vw, 96px);

  /* Corners (2026-10-12: «arrotonda un po' gli angoli delle box»): boxes and cards 12 px, fields and choices 8 px;

     buttons stay pills, photos stay square. */

  --raggio: 12px;

  --raggio-piccolo: 8px;    /* the display titles: the name on the home, the book, the 404 */

}

@media (min-width: 640px) { :root { --bordo: 30px; } }

@media (min-width: 960px) { :root { --bordo: 40px; --fascia: 70px; --t-t2: 33.2px; --t-t1: 41.5px; } }



*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body { margin: 0; background: var(--mb-crema); color: var(--mb-antracite); font: 400 var(--t-testo)/1.62 var(--mb-testo); overflow-wrap: break-word; }

img { display: block; max-width: 100%; height: auto; }

figure, p, blockquote, ul, ol { margin: 0; }

ul { padding: 0; list-style: none; }

.testo ul, .testo ol { padding-left: 1.4em; list-style: revert; }

em { color: var(--mb-enfasi); }

a { color: var(--mb-bordeaux); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }

a:hover { text-decoration-thickness: 2px; }

:focus-visible { outline: 2px solid var(--mb-bordeaux); outline-offset: 2px; }

h1, h2, h3, h4 { margin: 0; font-family: var(--mb-display); font-weight: 300; color: var(--mb-antracite); }

h1 { font-size: var(--t-t1); line-height: 1.2; }

h2 { font-size: var(--t-t2); line-height: 1.3; }

h3 { font-size: var(--t-t3); line-height: 1.35; }

.vh { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.salta { position: absolute; z-index: 1100; left: var(--bordo); top: -100px; padding: 12px 16px; background: var(--mb-antracite); color: var(--mb-crema); }

.salta:focus { top: 8px; }



.contenitore { width: 100%; max-width: calc(1200px + 2 * var(--bordo)); margin-inline: auto; padding-inline: var(--bordo); }

.colonna-lettura { max-width: 606px; }    /* custom.css rule 11: 64 characters, aligned left */



/* small texts */

.attacco { font: 600 var(--t-attacco)/1.5 var(--mb-testo); }

.meta, .testo .mb-segnaposto, .testo .mb-nota, .testo .mb-occhiello { font-size: var(--t-piccolo); line-height: 1.4; color: var(--mb-tenue); }

.maiuscolo, .testo .mb-occhiello { text-transform: uppercase; }

.testo .mb-attacco { font: 600 var(--t-attacco)/1.5 var(--mb-testo); }

.data { font-size: var(--t-piccolo); line-height: 1.4; color: var(--mb-grigio); }

h2.meta { font-family: var(--mb-testo); font-weight: 400; }



/* the beige "filetto" with its short stitch (custom.css rules 3 and 5); headings sit 40 px under it, text 20 px */

.filetto { position: relative; height: 1px; margin: 0; border: 0; background: var(--mb-crema-deep); }

.filetto::after { content: ""; position: absolute; left: 0; top: -1px; width: 64px; height: 3px; background: var(--mb-beige); }

.sezione-bordeaux .filetto { background: rgba(201, 183, 156, .32); }

.filetto + * { margin-top: 20px; }

.filetto + :is(h1, h2) { margin-top: 40px; }



/* the original's vertical rhythm: 20 px between blocks (UIkit's margin) */

.colonna > * + *, .pila > * + *, .testo > * + *, .scheda > * + * { margin-top: 20px; }

:is(.colonna, .pila) > .filetto + :is(h1, h2) { margin-top: 40px; }



/* ===================================================================== SECTIONS */

.sezione { padding-block: var(--fascia); }

.sezione-beige { background: var(--mb-crema-deep); }

.sezione-bordeaux { background: var(--mb-bordeaux); color: var(--mb-crema); }

.sezione-bordeaux .meta { color: var(--mb-beige); }

.sezione-bordeaux a:not(.btn) { color: var(--mb-beige); }

.sezione-bordeaux :focus-visible { outline-color: var(--mb-crema); }



.due { display: grid; gap: 30px; }

.tre { display: grid; gap: 40px; }

@media (min-width: 960px) {

  .due { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; align-items: center; }

  .tre { grid-template-columns: repeat(3, minmax(0, 1fr)); }

}

.foto img, .copertina img { width: 100%; }

.ritratto img { margin-inline: auto; }



/* ===================================================================== BUTTONS AND FIELDS (the I2 pills of the original) */

.btn, .cd-bottone, .wp-block-button__link, .wp-element-button, .comment-form .submit {

  display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 24px;

  border: 1px solid var(--mb-bordeaux); border-radius: 999px; background: var(--mb-bordeaux); color: var(--mb-crema);

  font: 600 var(--t-piccolo)/1.2 var(--mb-testo); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; text-align: center; cursor: pointer;

  transition: background-color .2s, color .2s, border-color .2s;

}

.btn:hover, .cd-bottone:hover, .wp-block-button__link:hover, .comment-form .submit:hover { background: var(--mb-antracite); border-color: var(--mb-antracite); color: var(--mb-crema); }

.btn-secondo { background: transparent; color: var(--mb-antracite); border-color: var(--mb-antracite); }

.btn-secondo:hover { background: var(--mb-crema-deep); border-color: var(--mb-antracite); color: var(--mb-antracite); }

.sezione-bordeaux .btn-secondo { color: var(--mb-crema); border-color: rgba(247, 244, 238, .2); }

.sezione-bordeaux .btn-secondo:hover { background: rgba(247, 244, 238, .12); color: var(--mb-crema); }

.pulsanti { display: flex; flex-wrap: wrap; gap: 15px; }

.wp-block-buttons { display: flex; flex-wrap: wrap; gap: 15px; }



input[type=text], input[type=email], input[type=url], input[type=tel], textarea {

  width: 100%; min-height: 48px; padding: 0 16px; border: 1px solid var(--mb-antracite); border-radius: var(--raggio-piccolo); background: #fff;   /* review 2026-10-12: one shape for every field */

  color: var(--mb-antracite); font: 400 var(--t-testo) var(--mb-testo);

}

textarea { padding: 12px 16px; line-height: 1.5; }



/* ===================================================================== HEADER */

.testata-riga { display: flex; align-items: center; justify-content: space-between; height: 100px; }

.marchio { display: flex; align-items: center; gap: 8px; color: var(--mb-antracite); text-decoration: none; }

.marchio img { width: auto; height: 48px; }

.marchio span { font: 600 var(--t-attacco)/1 var(--mb-display); white-space: nowrap; }

.menu-computer { display: none; }

.menu-btn { display: grid; place-items: center; width: 44px; height: 44px; margin-right: -12px; padding: 0; border: 0; background: none; color: var(--mb-antracite); cursor: pointer; }

@media (min-width: 960px) {

  .marchio { gap: 12px; }

  .marchio img { height: 56px; }

  .marchio span { font-size: var(--t-t3); }

  .menu-btn { display: none; }

  .menu-computer { display: block; }

  .menu-computer ul { display: flex; align-items: center; }

  .menu-computer a:not(.btn) { display: flex; align-items: center; height: 100px; padding: 0 10px; color: var(--mb-antracite); font: 500 var(--t-testo)/1 var(--mb-testo);

    letter-spacing: .01em; text-decoration: none; white-space: nowrap; }

  .menu-computer a:not(.btn):hover { text-decoration: underline; text-underline-offset: .45em; }

  .menu-computer a[aria-current="page"]:not(.btn) { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .45em; }

  .menu-computer .pillola { margin-left: 12px; }

  .menu-computer .pillola .btn { min-height: 44px; padding: 0 22px; }

}



/* phone menu: the panel from the right, crema, big Cormorant items (I2 style of the original) */

.pannello { position: fixed; inset: 0; z-index: 1000; }

.pannello[hidden] { display: none; }

.pannello-velo { position: absolute; inset: 0; background: rgba(247, 244, 238, .6); }

.pannello-foglio { position: absolute; top: 0; right: 0; bottom: 0; width: min(325px, 85vw); padding: 20px; overflow-y: auto; background: var(--mb-crema);

  box-shadow: -10px 0 30px -20px rgba(28, 26, 23, .4); }

.pannello-chiudi { position: absolute; top: 0; right: 0; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; background: none; color: var(--mb-antracite); cursor: pointer; }

.pannello-foglio a { display: block; padding: 18px 0; border-bottom: 1px solid var(--mb-crema-deep); color: var(--mb-antracite); font: 500 var(--t-t1)/1.2 var(--mb-display); text-decoration: none; }

.pannello-foglio a[aria-current="page"] { color: var(--mb-bordeaux); font-weight: 600; }

html.menu-aperto { overflow: hidden; }

@media (min-width: 960px) { .pannello { display: none; } }



/* ===================================================================== FOOTER (the bordeaux band) */

.piede-dentro { text-align: center; }

.piede .firma { margin-top: 20px; color: rgba(247, 244, 238, .7); }

.piede-btn { margin-top: 40px; }

.piede-note { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 16px; margin-top: 30px; font-size: var(--t-piccolo); color: var(--mb-beige); }

.piede-cookie { min-height: 44px; padding: 0 8px; border: 0; background: none; color: var(--mb-beige); font: 400 var(--t-piccolo)/1 var(--mb-testo); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

.piede-cookie:hover { color: var(--mb-crema); }



/* ===================================================================== HOME */

.frontespizio { font-size: var(--t-grande); line-height: .96; letter-spacing: -.018em; text-wrap: balance; }

.libro .copertina img { max-width: 600px; margin-inline: auto; }

.prezzo-blocco > * + * { margin-top: 4px; }

.consegna { color: var(--mb-tenue); }   /* review 2026-10-12: the shipping cost next to the price, before the cart */

.filoni .tre { margin-top: 20px; }

.voce blockquote p { font: italic 400 var(--t-attacco)/1.45 var(--mb-display); }

.voce figcaption { margin-top: 10px; }



/* ===================================================================== PAGES

   Since the design review of 2026-10-19 every page sits in the blog's two columns, as the article (template-parts/pagina-colonne.php):

   same container, title and spacing; one ground, beige only for boxes. Until then the original's bands and a 606 px column. */

.testo .wp-block-image img { width: 100%; }

.testo h2 + *, .testo h3 + * { margin-top: 20px; }



.semplice { padding-bottom: var(--fascia); }

.titolo-pagina { margin: 0; }

.semplice .titolo-pagina + * { margin-top: 40px; }

/* the title of pages and articles a step larger on the computer (review 2026-10-19: the first screen had nothing that led) */

@media (min-width: 960px) { .titolo-pagina { font-size: clamp(41.5px, 4.4vw, 60px); line-height: 1.1; letter-spacing: -.01em; text-wrap: balance; } }



.pagina-colonne .pagina-attacco { margin-top: 20px; }

.pagina-colonne .pagina-attacco p { font: 600 var(--t-attacco)/1.5 var(--mb-testo); }

.pagina-colonne .corpo-articolo > h2 { margin-top: 56px; }

.pagina-colonne .pagina-blocco { margin-top: 56px; }

.pagina-colonne .pagina-blocco > * + * { margin-top: 20px; }

.pagina-colonne .voci-elenco { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 20px; }

.pagina-colonne .filo-voci .filo-maglie { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }

/* the help numbers: first in the text on the phone, on the side (and still while scrolling) on the computer */

.pagina-colonne .solo-telefono { margin-top: 40px; }

.pagina-colonne .solo-telefono .mb-aiuto, .pagina-colonne .blog-lato .mb-aiuto { margin-top: 0; }

@media (min-width: 960px) { .pagina-colonne .solo-telefono { display: none; } }

@media (max-width: 959px) {

  .pagina-colonne .solo-computer { display: none; }

  .pagina-colonne .lato-numeri:not(:has(.lato-blocco, .lato-rimando)) { display: none; }   /* only the numbers: they are already in the text */

}

/* the side column of a page: Contatti's notes, the way to the book, the Bio's photo and books, an association's book */

.pagina-colonne .blog-lato :is(.mb-contatti-lato, .mb-invito) { padding: 28px; background: var(--mb-crema-deep); border-radius: var(--raggio); }

.pagina-colonne .blog-lato .mb-invito .wp-block-button__link { width: 100%; }

.pagina-colonne .lato-pagina > h2 { font-size: var(--t-t3); line-height: 1.2; }

.pagina-colonne .lato-pagina > h2 + * { margin-top: 16px; }

.pagina-colonne .lato-ritratto img { width: 100%; }

.pagina-colonne .lato-ritratto figcaption { margin-top: 10px; }

.pagina-colonne .lato-copertina { width: 160px; height: auto; margin-inline: auto; }

.pagina-colonne .blog-lato .lato-nome a { color: var(--mb-antracite); }

.pagina-colonne .lato-rimando { padding-inline: 4px; }

@media (min-width: 960px) {

  .pagina-colonne .blog-lato { position: static; }   /* a side column taller than the screen must not stick, or its end is never seen */

  .pagina-colonne .lato-numeri { position: sticky; top: 24px; }

}



/* ===================================================================== BLOG, ARTICLE, SEARCH, 404 */

.griglia-blog { display: grid; gap: 70px; }

@media (min-width: 960px) { .griglia-blog { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.titolo-articolo a, .risultato h2 a { color: var(--mb-antracite); text-decoration: none; }

.titolo-articolo a:hover, .risultato h2 a:hover { text-decoration: underline; }

.articolo-scheda .titolo-articolo { font-size: var(--t-t1); line-height: 1.2; }

.articolo-scheda .data { margin-top: 20px; }

.articolo-scheda .articolo-foto { display: block; margin-top: 10px; }

.articolo-scheda .articolo-foto img { width: 100%; }

.articolo-scheda .estratto { margin-top: 40px; }

.articolo-scheda .continua { margin-top: 40px; }

.testa-archivio { margin-bottom: 70px; }

.testa-archivio .attacco { margin-top: 20px; }

.pagine { margin-top: 70px; }

.pagine .nav-links { display: flex; gap: 8px; flex-wrap: wrap; }

.pagine .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 10px; color: var(--mb-grigio); }

.pagine .current { color: var(--mb-antracite); font-weight: 600; }



/* 2026-10-19 (narrower than the other pages): the article sits in the blog's two columns, text as wide as its column

   (about 90 characters on the computer); until then one centred column of 646 px (review 2026-10-12) */

.articolo-corpo { min-width: 0; }

.articolo .data { margin-top: 20px; }

.articolo .articolo-foto { margin-top: 40px; }

.articolo .articolo-foto img { width: 100%; }

.corpo-articolo { margin-top: 40px; }

.corpo-articolo > * + * { margin-top: 20px; }

.corpo-articolo h2, .corpo-articolo h3 { margin-top: 40px; }

.corpo-articolo blockquote { padding-left: 20px; border-left: 2px solid var(--mb-bordeaux); font: italic 400 var(--t-attacco)/1.45 var(--mb-display); }

/* 2026-10-19: videos hosted on the site (articles from Laura's texts of 15/10); the quoted source in small grey */

.corpo-articolo .wp-block-video video { display: block; width: 100%; height: auto; background: var(--mb-antracite); }

.corpo-articolo .wp-block-video figcaption, .corpo-articolo .mb-fonte { margin-top: 8px; color: var(--mb-tenue); font-size: var(--t-piccolo); line-height: 1.4; }

.articolo-libro { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 24px; align-items: center; margin-top: 40px; padding: 24px; background: var(--mb-crema-deep); }

@media (min-width: 640px) { .articolo-libro { grid-template-columns: 120px minmax(0, 1fr); } }

.articolo-libro img { width: 100%; }

.articolo-libro > div > * + * { margin-top: 8px; }

.articolo-libro .btn { margin-top: 8px; }

.articolo-libro-titolo { font: 400 var(--t-t3)/1.2 var(--mb-display); }

.articolo-libro .consegna { color: var(--mb-tenue); }

.aiuto { margin-top: 40px; padding: 20px 24px; background: var(--mb-crema-deep); }

.vicini { display: flex; justify-content: space-between; gap: 20px; margin-top: 40px; }

.vicini a { display: inline-flex; align-items: center; min-height: 44px; padding: 5px 10px; color: var(--mb-grigio); font: 600 var(--t-testo)/1.62 var(--mb-testo); letter-spacing: 1.5px; text-transform: uppercase; text-decoration: none; }

.vicini a:hover { color: var(--mb-antracite); }

.vicino-dopo { margin-left: auto; }

.autore { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 30px; margin-top: 40px; padding-block: 20px; border-block: 1px solid var(--mb-crema-deep); }

.autore-segno { width: 96px; height: 96px; background: var(--mb-crema-deep); }

.autore-foto { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; object-position: top; }

.autore-nome { margin-bottom: 10px; font: 600 var(--t-attacco)/1.4 var(--mb-testo); letter-spacing: 1.5px; text-transform: uppercase; }

.commenti { margin-top: 40px; }

.comment-reply-title, .commenti-titolo { margin-top: 40px; font: 600 var(--t-attacco)/1.4 var(--mb-testo); letter-spacing: 1.5px; text-transform: uppercase; }

.comment-form > * + *, .comment-reply-title + .comment-form { margin-top: 20px; }

.comment-form label { display: block; margin-bottom: 10px; font: 600 var(--t-piccolo)/1.6 var(--mb-testo); letter-spacing: .1em; text-transform: uppercase; }

.comment-form .comment-form-cookies-consent { display: flex; gap: 10px; align-items: center; }

.comment-form .comment-form-cookies-consent label { margin: 0; }

.comment-form .comment-form-cookies-consent input { width: 20px; height: 20px; }

.commenti-lista { padding: 0; list-style: none; }

.commenti-lista .comment { margin-top: 20px; }



.titolo-cerca { font-size: var(--t-t3); line-height: 1.35; }

.risultato { margin-top: 60px; }

.risultato:first-of-type { margin-top: 40px; }

.risultato .data { margin-top: 20px; }

.risultato .estratto { max-width: 646px; margin-top: 40px; }



.non-trovata { text-align: center; }

.non-trovata h1 { font-size: var(--t-grande); font-weight: 700; line-height: 1.1; }

.non-trovata .grande { margin-top: 20px; font-size: var(--t-attacco); line-height: 1.5; }

.ricerca { position: relative; width: 240px; max-width: 100%; margin: 70px auto 0; color: rgba(28, 26, 23, .72); }

.ricerca svg { position: absolute; left: 18px; top: 15px; }

.ricerca input { width: 100%; height: 50px; padding: 0 18px 0 48px; border: 0; border-radius: var(--raggio-piccolo); background: rgba(28, 26, 23, .04); color: var(--mb-antracite); font: 400 var(--t-testo) var(--mb-testo); }

.ricerca input::placeholder { color: rgba(28, 26, 23, .72); }

.cerca .ricerca { margin: 40px 0 0; }



/* ===================================================================== CD LIBRI: list and book page as in the original (its own carrello.css + the original's type) */

.cd-libri__titolo a { color: var(--mb-antracite); text-decoration: underline; }

.cd-libri__libro p, .cd-libro__testo > p { margin-block: 20px; }

.cd-libri__titolo { font-weight: 300; }

.cd-bottone { line-height: 1.2; }

.cd-compra__titolo { font-weight: 300; }

.mbc .cd-foglio :focus-visible, .mbc .cd-compra :focus-visible { outline: 2px solid var(--mb-bordeaux); outline-offset: 2px; }



/* the book's page in blocks (cd-libri/libro.php, 2026-10-12) */

.cd-libro.libro-blocchi { display: block; }

.libro-acquisto .cd-compra { margin: 0; }

.libro-testata { max-width: 820px; margin-inline: auto; text-align: center; }

.libro-testata > * + * { margin-top: 20px; }

.libro-titolo { font-size: var(--t-grande); line-height: 1; letter-spacing: -.015em; text-wrap: balance; }

.libro-riassunto { max-width: 640px; margin-inline: auto; font: italic 400 var(--t-attacco)/1.45 var(--mb-display); color: var(--mb-antracite); }

.libro-subito > * + * { margin-top: 16px; }

.libro-subito .consegna { display: block; margin-top: 4px; }   /* own line: on the phone it wrapped around the price */

.libro-subito .pulsanti { justify-content: center; align-items: center; column-gap: 24px; }

.libro-altri { display: inline-flex; align-items: center; min-height: 44px; padding: 0; border: 0; background: none; color: var(--mb-bordeaux); font: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; cursor: pointer; }   /* a button that looks like the link it was */

.libro-altri:hover { text-decoration-thickness: 2px; }

.libro-acquisto { margin-top: 60px; }

.libro-acquisto .copertina img { max-width: 440px; margin-inline: auto; }

.libro-incipit .incipit { max-width: 640px; margin-inline: auto; }

.libro-incipit .incipit > * + * { margin-top: 20px; }

.libro-incipit .occhiello, .libro-incipit h2 { text-align: center; }

.incipit-testo { margin-top: 40px; font: italic 400 var(--t-attacco)/1.6 var(--mb-display); }

.incipit-testo p + p, .incipit-resto p { margin-top: 18px; }

.incipit-testo > p:first-child::first-letter { float: left; margin: 6px 10px 0 0; font: 400 76px/.8 var(--mb-display); color: var(--mb-bordeaux); }

.incipit-resto summary { display: inline-flex; align-items: center; min-height: 48px; margin-top: 24px; color: var(--mb-bordeaux); font: 600 var(--t-piccolo)/1.2 var(--mb-testo); letter-spacing: .14em; text-transform: uppercase; cursor: pointer; list-style: none; }

.incipit-resto summary::-webkit-details-marker { display: none; }

.incipit-resto summary::after { content: ""; width: 8px; height: 8px; margin-left: 10px; border: solid currentColor; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg) translateY(-3px); }

.incipit-resto[open] summary { order: 2; }

.incipit-resto[open] summary::after { transform: rotate(-135deg) translateY(-2px); }

.incipit-resto .chiudi, .incipit-resto[open] .apri { display: none; }

.incipit-resto[open] .chiudi { display: inline; }

.incipit-resto[open] { display: flex; flex-direction: column; }

.libro-descrizione { margin-inline: auto; }

.incipit-compra { max-width: 520px; margin: 50px auto 0 !important; }

.incipit-compra .cd-compra__titolo { text-align: center; }



/* buy box: the two formats one above the other, with their icon (cd-libri/compra.php) */

.compra-scelte { display: grid; gap: 12px; }

.compra-scelta { display: flex; align-items: center; gap: 16px; width: 100%; min-height: 72px; padding: 16px 20px; border: 1px solid var(--mb-antracite); border-radius: var(--raggio-piccolo); background: var(--mb-crema); color: var(--mb-antracite); font: inherit; text-align: left; cursor: pointer; transition: background-color .15s, color .15s, border-color .15s; }

.compra-scelta:hover { background: var(--mb-bordeaux); border-color: var(--mb-bordeaux); color: var(--mb-crema); }

.compra-scelta .icona { flex: none; width: 30px; height: 30px; }

.compra-testo { display: flex; flex: 1; flex-direction: column; gap: 4px; }

.compra-nome { font: 600 var(--t-piccolo)/1.2 var(--mb-testo); letter-spacing: .12em; text-transform: uppercase; }

.compra-nota { font-size: var(--t-testo); line-height: 1.35; opacity: .85; }

/* review 2026-10-12: prices in Karla with lining figures (Cormorant's old-style "1" read as "ı" in 16,68 €) */

.compra-prezzo { flex: none; font: 600 var(--t-attacco)/1 var(--mb-testo); font-variant-numeric: lining-nums tabular-nums; }

.mbc .cd-totale dd, .mbc .cd-compra__prezzo { font-family: var(--mb-testo); font-weight: 600; font-size: var(--t-attacco); font-variant-numeric: lining-nums tabular-nums; }

.mbc :is(.cd-campo small, .cd-opzione small, .cd-spunta, .cd-dono, .cd-errore, .cd-riepilogo) { font-size: var(--t-testo); }

.mbc :is(.cd-campo legend, .cd-campo > span, .cd-totale dt, .cd-stato, .cd-bottone, .cd-piede, .cd-foglio__indietro, .cd-foglio__passo) { font-size: var(--t-piccolo); }

.mbc .cd-domanda label { font-size: var(--t-attacco); }

.mbc .cd-opzione { font-size: var(--t-testo); }

.mbc .cd-campo > span em { font-size: var(--t-piccolo); }

.mbc .cd-compra__titolo { font-size: var(--t-t2); }

.mbc .cd-contatti__invia { font-size: var(--t-piccolo); }

.mbc .cd-contatti label { font: 600 var(--t-testo)/1.4 var(--mb-testo); letter-spacing: 0; text-transform: none; }   /* review 2026-10-19: labels in sentence case */

#cancel-comment-reply-link { font-size: var(--t-piccolo); }



/* where the money goes: the bordeaux band on the book's page, the box on the home */

.sezione-bordeaux :is(h1, h2, h3) { color: var(--mb-crema); }

.ricavato-blocco { max-width: 780px; margin-inline: auto; text-align: center; }

.ricavato-blocco > * + * { margin-top: 24px; }

.ricavato-titolo { font-size: var(--t-t1); line-height: 1.2; text-wrap: balance; }

.ricavato { padding: 18px 22px; background: var(--mb-crema-deep); }

.ricavato > * + * { margin-top: 8px; }

.ricavato-frase { font: 600 var(--t-testo)/1.5 var(--mb-testo); }



/* the home's bordeaux band, centred */

.fascia-centro { text-align: center; }

.fascia-centro .filetto::after { left: 50%; transform: translateX(-50%); }

.fascia-centro .attacco { max-width: 760px; margin-inline: auto; }



/* associations */

/* The association's page in blocks (2026-10-12, design pass after the facts): help first, in a dark box with numbers you can

   tap; what it does as cards; how to support it in a beige box; contacts as label and value. Classes come from the page content

   (strumenti/associazioni.php, version 2). */

.testo :is(.mb-aiuto-numeri, .mb-servizi, .mb-sostieni-modi, .mb-recapiti) { padding: 0; list-style: none; }   /* on every page, not only the association's */

.mb-aiuto { margin-top: 40px; padding: 28px 24px; background: var(--mb-antracite); color: var(--mb-crema); }

.mb-aiuto > * + * { margin-top: 20px; }

.mb-aiuto h2 { color: var(--mb-crema); }

.mb-aiuto-numeri { display: grid; gap: 16px; }   /* review 2026-10-19: space between the numbers, no rules */

.mb-aiuto-numeri li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }

.mb-aiuto-numeri span { flex: 1 1 220px; color: var(--mb-beige); }

.mb-aiuto-numeri a { display: inline-flex; align-items: center; justify-content: center; min-width: 140px; min-height: 48px; padding: 0 20px; border-radius: 999px;

  background: var(--mb-crema); color: var(--mb-antracite); font: 600 var(--t-attacco)/1 var(--mb-testo); font-variant-numeric: lining-nums tabular-nums; text-decoration: none; }

.mb-aiuto-numeri a:hover { background: var(--mb-beige); }

@media (max-width: 639px) { .mb-aiuto-numeri a { width: 100%; } }   /* on the phone the numbers are full-width buttons, easy to hit with a thumb */

.mb-aiuto :focus-visible { outline-color: var(--mb-crema); }

.mb-servizi { display: grid; gap: 16px; }

@media (min-width: 640px) { .mb-servizi { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.mb-servizi li { padding: 20px; background: var(--mb-crema-deep); }

.mb-servizi strong { display: block; margin-bottom: 8px; font: 400 var(--t-t3)/1.2 var(--mb-display); }

.mb-sostieni { margin-top: 56px; padding: 28px 24px; background: var(--mb-crema-deep); }

.mb-sostieni > * + * { margin-top: 20px; }

.mb-sostieni-modi { display: grid; gap: 20px; }

.mb-sostieni-modi span, .mb-recapiti span { display: block; margin-bottom: 4px; font: 600 var(--t-testo)/1.4 var(--mb-testo); }   /* review 2026-10-19: labels in sentence case */

.mb-codice { display: inline-block; font: 600 var(--t-attacco)/1.4 var(--mb-testo); letter-spacing: .06em; font-variant-numeric: lining-nums tabular-nums; }

.mb-recapiti { display: grid; gap: 20px; }

@media (min-width: 640px) { .mb-recapiti { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.associazione-scheda { padding: 28px; background: var(--mb-crema-deep); }

.associazione-scheda > * + * { margin-top: 12px; }

.associazione-scheda h3 a { color: var(--mb-antracite); }



/* the classic blog (template-parts/elenco.php) */

.evidenza { display: grid; gap: 30px; }

.evidenza { padding-bottom: 50px; margin-bottom: 40px; border-bottom: 1px solid var(--mb-crema-deep); }

.evidenza-foto img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }

.evidenza-testo > * + * { margin-top: 20px; }

.evidenza-testo .estratto { max-width: 646px; }

.evidenza-titolo { font-size: var(--t-t1); line-height: 1.1; text-wrap: balance; }

.evidenza-titolo a, .riga-titolo a { color: var(--mb-antracite); text-decoration: none; }

.evidenza-titolo a:hover, .riga-titolo a:hover { color: var(--mb-bordeaux); }

.occhiello a { color: inherit; text-decoration: none; }

.blog-due { display: grid; gap: 60px; }

@media (min-width: 960px) { .blog-due { grid-template-columns: minmax(0, 1fr) 320px; gap: 70px; align-items: start; } }

.blog-elenco-titolo { padding-bottom: 14px; border-bottom: 1px solid var(--mb-crema-deep); }

.riga-articolo { display: grid; gap: 20px; padding-block: 32px; border-bottom: 1px solid var(--mb-crema-deep); }

@media (min-width: 640px) { .riga-articolo { grid-template-columns: 220px minmax(0, 1fr); gap: 30px; align-items: start; } }

.riga-foto img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }

.riga-testo > * + * { margin-top: 10px; }

.riga-titolo { font-size: var(--t-t3); line-height: 1.2; }

.blog-elenco .pagine { margin-top: 40px; }

.blog-lato > * + * { margin-top: 30px; }

@media (min-width: 960px) { .blog-lato { position: sticky; top: 120px; } }

.lato-blocco { padding: 28px; background: var(--mb-crema-deep); }

.lato-blocco > * + * { margin-top: 14px; }

.lato-autrice { text-align: center; }

.lato-foto { width: 120px; height: 120px; margin-inline: auto; border-radius: 50%; object-fit: cover; }

.lato-nome { font-size: var(--t-t3); }

.blog-lato h2.meta { font: 400 var(--t-t3)/1.2 var(--mb-display); text-transform: none; color: var(--mb-antracite); }   /* review 2026-10-19: real headings, not small caps */

.lato-lista { margin: 0; padding: 0; list-style: none; }

.lato-lista li { padding-block: 6px; }

.lato-lista a { color: var(--mb-antracite); text-decoration: none; }

.lato-lista a:hover, .lato-lista a[aria-current] { color: var(--mb-bordeaux); text-decoration: underline; }

.lato-tag { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }

.lato-tag a { display: inline-flex; min-height: 36px; align-items: center; padding: 0 14px; border: 1px solid var(--mb-antracite); border-radius: 999px; color: var(--mb-antracite); font-size: var(--t-piccolo); text-decoration: none; }



/* the footer: newsletter, every page in three columns, the mark and the signature */

.piede { padding-block: 70px 40px; }

.piede.sezione-bordeaux { background: var(--mb-antracite); }   /* review 2026-10-12: brand kit, antracite footer; bordeaux only as accent */

.piede-riga { padding-bottom: 50px; margin-bottom: 50px; border-bottom: 1px solid rgba(201, 183, 156, .32); }

.lettera { max-width: 560px; margin-inline: auto; text-align: center; }

.lettera > * + *, .iscrizione > * + * { margin-top: 14px; }

.lettera-titolo { font-size: var(--t-t2); }

.lettera-riga, .lettera-privacy { color: var(--mb-beige); }

.lettera-privacy { font-size: var(--t-piccolo); }

.pillola-campo { display: flex; gap: 8px; padding: 6px; border: 1px solid rgba(247, 244, 238, .35); border-radius: 999px; background: rgba(247, 244, 238, .06); }

.pillola-campo input { flex: 1; min-width: 0; min-height: 44px; padding: 0 16px; border: 0; border-radius: 999px; background: var(--mb-crema); color: var(--mb-antracite); font: 400 var(--t-testo) var(--mb-testo); }

.pillola-campo .btn { flex: none; background: var(--mb-crema); border-color: var(--mb-crema); color: var(--mb-bordeaux); }

.pillola-campo .btn:hover { background: var(--mb-antracite); border-color: var(--mb-antracite); color: var(--mb-crema); }

.lettera-esito { color: var(--mb-crema); font-weight: 600; }

.mappa { display: grid; gap: 40px; text-align: center; }

@media (min-width: 640px) { .mappa { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.mappa-titolo { font: 600 var(--t-piccolo)/1.2 var(--mb-testo); letter-spacing: .14em; text-transform: uppercase; color: var(--mb-beige); }

.mappa ul { margin: 16px 0 0; padding: 0; list-style: none; }

.mappa li + li { margin-top: 10px; }

.sezione-bordeaux .mappa a { color: var(--mb-crema); text-decoration: none; }

.sezione-bordeaux .mappa a:hover, .sezione-bordeaux .mappa a[aria-current] { text-decoration: underline; }

.piede-firma { display: flex; flex-direction: column; align-items: center; gap: 20px; text-align: center; }

.piede-marchio { color: var(--mb-crema); }

.piede-firma .firma { margin: 0; font: italic 400 var(--t-t3)/1.4 var(--mb-display); color: var(--mb-crema); }



/* ===================================================================== CD Cookie, CD Accessibilità (our plugins) */

.mbc .cd-cookie { --cd-ck-sfondo: var(--mb-crema); --cd-ck-testo: var(--mb-antracite); --cd-ck-bordo: var(--mb-antracite); --cd-ck-accento: var(--mb-bordeaux); font-family: var(--mb-testo); }

.mbc .cd-cookie__titolo { font: 400 var(--t-t2)/1.15 var(--mb-display); }

.mbc .cd-cookie__btn { border-radius: 999px; }

.mbc .cd-a11y { --cd-a11y-scuro: var(--mb-antracite); --cd-a11y-chiaro: var(--mb-crema); --cd-a11y-accento: var(--mb-bordeaux); font-family: var(--mb-testo);

  left: 8px; bottom: 8px; transition: transform .25s ease-out, opacity .25s ease-out; }

/* review 2026-10-12: the round button covered titles and text. Smaller (44 px, our minimum), and while reading downwards it slides

   out (tema.js adds .a11y-via); it comes back scrolling up, at the top, at the end, on keyboard focus and while its panel is open. */

.mbc .cd-a11y__apri { width: 44px; height: 44px; }

.mbc .cd-a11y__apri svg { width: 22px; height: 22px; }

html.a11y-via .mbc .cd-a11y:not(:focus-within):not(:has(.cd-a11y__pannello:not([hidden]))) { transform: translateY(80px); opacity: 0; pointer-events: none; }

/* cd-accessibilita 1.0 (2026-10-28): with the legible font or the wider spacing the name in the header no longer fits on one line at

   320 px and pushed the page sideways; it wraps there instead. */

html:is(.cd-a11y-font, .cd-a11y-spazi) .marchio { min-width: 0; }

html:is(.cd-a11y-font, .cd-a11y-spazi) .marchio span { white-space: normal; overflow-wrap: anywhere; }



/* High contrast (CD Accessibilità): the muted texts become full antracite or crema, every link underlined */

html.cd-a11y-contrasto { --mb-tenue: var(--mb-antracite); --mb-grigio: var(--mb-antracite); --mb-enfasi: var(--mb-antracite); --mb-beige: var(--mb-crema); }

html.cd-a11y-contrasto .piede .firma { color: var(--mb-crema); }

html.cd-a11y-contrasto a { text-decoration-line: underline; }



/* Bigger text (CD Accessibilità, 2026-10-14): our type scale grows by 20 % and so does the rem of the plugins (cart, cookie).

   It replaces the plugin's page zoom, which made the cart sheet taller than the phone screen and lost its ×. */

html.cd-a11y-testo { font-size: 120%; --t-piccolo: 16.3px; --t-testo: 20.4px; --t-attacco: 25.4px; --t-t3: 31.9px; --t-t2: 31.9px; --t-t1: 39.8px; --t-grande: clamp(55px, 9.6vw, 115px); }

@media (min-width: 960px) { html.cd-a11y-testo { --t-t2: 39.8px; --t-t1: 49.8px; } }



/* ===================================================================== MOTION (correzione 3)

   tema.js hides only blocks below the first screen, and only when it runs and «riduci movimento» is off: without JavaScript,

   or with reduced motion, every text is visible from the start. */

@media (prefers-reduced-motion: no-preference) {

  .appare.nascosta { opacity: 0; transform: translateY(30px); }

  .appare.nascosta.vista { opacity: 1; transform: none; transition: opacity .7s ease-out, transform .7s ease-out; }

  /* «Animazioni ridotte» of cd-accessibilita 1.0 (class cd-a11y-fermo): every block visible from the start, as with the system setting */

  html.cd-a11y-fermo .appare.nascosta { opacity: 1; transform: none; transition: none; }

}

@media (prefers-reduced-motion: reduce) {

  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }

}



/* ===================================================================== CORNERS AND THE PAGES IN BLOCKS (2026-10-12)

   Every box gets --raggio; the plugins' boxes too (CD Libri: buy box, cart sheet, its fields; CD Contatti: fields). */

:is(.mb-aiuto, .mb-servizi li, .mb-sostieni, .ricavato, .articolo-libro, .lato-blocco, .associazione-scheda, .aiuto, .mb-invito, .mb-contatti-modulo, .mb-contatti-lato, .voci .voce, .dal-blog .scheda-voce) { border-radius: var(--raggio); }

.mbc .cd-compra { border-radius: var(--raggio); }

@media (min-width: 640px) { .mbc .cd-foglio { border-radius: var(--raggio); } }

.mbc :is(.cd-campo input, .cd-campo select, .cd-campo textarea, .cd-opzione, .cd-quantita, .cd-errore, .cd-dono) { border-radius: var(--raggio-piccolo); }

.mbc .cd-contatti :is(input, select, textarea) { border-radius: var(--raggio-piccolo); }



.mb-aiuto { margin-top: 32px; }



/* Contatti: the form in a beige box across the column (white fields); its notes go to the side column (review 2026-10-19) */

.mb-contatti { display: grid; gap: 24px; }

.mb-contatti-modulo { padding: 28px 24px; background: var(--mb-crema-deep); }

.mb-contatti-modulo :is(input, select, textarea) { background: #fff; }

.mb-contatti-lato { padding: 28px 24px; background: var(--mb-crema); }

.mb-contatti-lato > * + * { margin-top: 20px; }

.mb-contatti-lato span { display: block; margin-bottom: 4px; font: 600 var(--t-testo)/1.4 var(--mb-testo); }

.mb-contatti-aiuto span { color: var(--mb-bordeaux); }



/* La voce dei lettori: the way to the book in a box; the readers' voices as cards with a big quote mark */

.mb-invito { padding: 28px 24px; background: var(--mb-crema); }

.mb-invito > * + * { margin-top: 20px; }

.voci .voce { position: relative; padding: 48px 24px 24px; background: var(--mb-crema-deep); }

.voci .voce::before { content: "“"; position: absolute; top: 4px; left: 20px; color: var(--mb-bordeaux); font: 400 72px/1 var(--mb-display); }

.voci .voce blockquote { margin: 0; }

.voci .voce blockquote p + p { margin-top: 12px; }



/* Legal pages (Privacy, Cookie): ready for the generated text, long lists and tables stay readable */

.testo table { width: 100%; border-collapse: collapse; font-size: var(--t-piccolo); }

.testo th, .testo td { padding: 10px 12px; border-bottom: 1px solid var(--mb-crema-deep); text-align: left; vertical-align: top; }

.testo th { font-weight: 600; }

.testo .wp-block-table { overflow-x: auto; }

.testo li + li { margin-top: 6px; }



/* ===================================================================== PHONE USABILITY (2026-10-14)

   Buy box: on the phone the icon in its own column squeezed name and note into ~115 px (four lines for «Spedizione 4,68 € in Italia,

   o ritiro gratis»). Now icon, name and price on one line, the note below across the whole box. */

@media (max-width: 639px) {

  .compra-scelta { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "icona nome prezzo" "nota nota nota"; align-items: center; gap: 8px 12px; padding: 16px; }

  .compra-testo { display: contents; }

  .compra-scelta .icona { grid-area: icona; width: 26px; height: 26px; }

  .compra-nome { grid-area: nome; }

  .compra-nota { grid-area: nota; }

  .compra-prezzo { grid-area: prezzo; }



  /* Newsletter: field and button one under the other, each the full width and 48 px high */

  .pillola-campo { flex-direction: column; padding: 0; border: 0; background: none; }

  .pillola-campo input, .pillola-campo .btn { width: 100%; min-height: 48px; }



  /* Footer map: «Il sito» and «Altro» side by side, «Leggere» (long titles) under them across the width: half the scrolling */

  .mappa { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 16px; }

  .mappa > :nth-child(2) { grid-column: 1 / -1; order: 3; }

  .mappa li + li { margin-top: 4px; }

  .mappa a { display: inline-block; padding-block: 8px; }   /* 44 px high: easy to hit with a thumb */

}

/* Nothing under 13.6 px: the © line and the cart's step label were 11.3 px */

.piede-note small, .mbc .cd-foglio__passo { font-size: var(--t-piccolo); }



/* 2026-10-19: «Il filo rosso» (CD Libri): the question at the end of an article, and the published messages on «La voce dei lettori» */

.filo { margin-top: 40px; padding: 28px 24px; background: var(--mb-crema-deep); border-top: 3px solid var(--mb-bordeaux); border-radius: var(--raggio); }

.filo > * + * { margin-top: 16px; }

.filo-occhiello { color: var(--mb-bordeaux); font: 600 var(--t-piccolo)/1.4 var(--mb-testo); letter-spacing: 1.5px; text-transform: uppercase; }

.filo .filo-domanda { margin-top: 8px; font: 400 var(--t-t3)/1.25 var(--mb-display); }

.filo-modulo > * + * { margin-top: 20px; }

.filo-campo label, .filo-scelta legend { display: block; margin-bottom: 8px; font-weight: 600; }

.filo-campo textarea { width: 100%; background: #fff; border-radius: var(--raggio-piccolo); }

.filo-scelta { margin-inline: 0; padding: 0; border: 0; }

.filo-scelta label, .filo-consenso label { display: flex; gap: 12px; align-items: flex-start; min-height: 44px; padding: 10px 0; cursor: pointer; }

.filo-scelta input, .filo-consenso input { flex: none; width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--mb-bordeaux); }

.filo-scelta label { font-weight: 400; }

.filo-consenso label { font-weight: 400; font-size: var(--t-piccolo); line-height: 1.5; }

.filo-errore { margin-top: 8px; color: var(--mb-bordeaux); font-weight: 600; }

.filo-errori { padding: 16px 20px; background: #fff; border-left: 3px solid var(--mb-bordeaux); }

.filo-errori ul { margin: 8px 0 0; padding-left: 20px; }

.filo-grazie { padding: 16px 20px; background: #fff; border-radius: var(--raggio-piccolo); }

.filo-grazie p + p { margin-top: 8px; }

.filo-esca { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.filo-rimando { margin-top: 16px; }

.filo-voci-attacco { max-width: 646px; margin-top: 16px; font: italic 400 var(--t-attacco)/1.45 var(--mb-display); }

.filo-gruppo { margin-top: 40px; }

.filo-gruppo h3 { font: 400 var(--t-t3)/1.25 var(--mb-display); }

.filo-gruppo h3 a { color: inherit; }

.filo-gruppo-domanda { margin-top: 8px; color: var(--mb-tenue); font-style: italic; }

/* full-width section of «La voce dei lettori» (page.php): as many cards per row as fit, like the voices of the book */

.filo-voci .filo-maglie { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; margin: 20px 0 0; padding: 0; list-style: none; }

.filo-voci .filo-maglie > li { margin: 0; }

.filo-voci .filo-maglie > li::marker { content: none; }

.filo-maglie li { position: relative; padding: 48px 24px 24px; background: var(--mb-crema-deep); border-radius: var(--raggio); }

.sezione-beige .filo-maglie li { background: var(--mb-crema); }

.filo-maglie li::before { content: "“"; position: absolute; top: 4px; left: 20px; color: var(--mb-bordeaux); font: 400 72px/1 var(--mb-display); }

.filo-maglie blockquote { margin: 0; }

.filo-maglie blockquote p { font: italic 400 var(--t-attacco)/1.45 var(--mb-display); }

.filo-firma { margin-top: 12px; color: var(--mb-tenue); font-size: var(--t-piccolo); }

:root{--mb-bordeaux:#59483f;--mb-antracite:#59483f;--mb-grigio:#655d55}body{margin:0;background:#f7f4ee}.appare{opacity:1!important;transform:none!important}.filetto{width:50px;height:1px;background:#59483f;margin:20px 0}a{color:#59483f}.testata a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}.filoni .scheda img{width:100%;height:240px;object-fit:cover}.filoni .attacco{color:#655d55;font-weight:400}html{scroll-behavior:smooth}section[id]{scroll-margin-top:24px}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Vapore discreto sopra la ciotolina; rispetta la preferenza di movimento ridotto. */
.home-foto-vapore { position:relative; isolation:isolate; }
.home-foto-vapore .home-vapore { position:absolute; left:57.5%; top:25%; width:19%; height:16%; margin:0; overflow:visible; pointer-events:none; z-index:1; }
.home-vapore path { fill:none; stroke:#fff8ed; stroke-width:2.8; stroke-linecap:round; filter:blur(1.1px); opacity:0; transform-origin:50% 100%; animation:mb-vapore 6s ease-in-out infinite; }
.home-vapore path:nth-child(2) { animation-delay:-2s; stroke-width:2.1; }
.home-vapore path:nth-child(3) { animation-delay:-4s; stroke-width:2.4; }
@keyframes mb-vapore { 0% { opacity:0; transform:translate(0,7px) scaleX(.85); } 25% { opacity:.36; } 65% { opacity:.22; } 100% { opacity:0; transform:translate(3px,-13px) scaleX(1.15); } }
@media (prefers-reduced-motion:reduce) { .home-vapore { display:none; } }

/* Toni piu chiari limitati alla sezione del libro. */
#il-libro { background:#fcfaf6; }
#il-libro h2, #il-libro h3 { color:#705d52; }
#il-libro p { color:#71675f; }
#il-libro a, #il-libro em { color:#79574b; }
#il-libro .filetto { background:#e8e0d6; }
#il-libro .filetto::after { background:#cbbca7; }
#il-libro .copertina img { filter:drop-shadow(0 12px 15px rgba(90,73,56,.09)); }

/* Le schede mantengono il soggetto intero e un formato comune. */
#di-cosa-scrivo .scheda > a > img { aspect-ratio:3/2; height:auto; width:100%; object-fit:contain; background:#fff4df; }
.invito-scritti { padding:28px 0 0; border-top:1px solid #e8e0d6; }
.invito-scritti > * + * { margin-top:16px; }
.ricordo-copertina { grid-template-columns:minmax(0,1fr); } .ricordo-copertina > * { min-width:0; } @media (min-width:960px) { .ricordo-copertina { grid-template-columns:repeat(2,minmax(0,1fr)); } }
/* La tua voce, 7 novembre 2026 */
.voce-griglia{display:grid;gap:32px;align-items:center}
.voce-immagine{margin:0}.voce-immagine img{width:100%;height:auto;border-radius:var(--raggio,12px)}
.voce-invito{max-width:560px}.voce-invito>*+*{margin-top:20px}
.testata a.voce-menu{font-weight:600}
@media(min-width:960px){.voce-griglia{grid-template-columns:1.1fr 1fr;gap:48px}}
.voce-lettura{max-width:780px;margin-inline:auto}.voce-lettura> *+*{margin-top:24px}
.voce-form{padding:28px;background:#fcfaf6;border:1px solid var(--mb-crema-deep);border-radius:12px}
.voce-campo{margin-bottom:24px}.voce-campo label{display:block;margin-bottom:8px;font-weight:600}
.voce-form select{display:block;width:100%;min-height:48px;max-width:100%;padding:10px;border:1px solid var(--mb-antracite);border-radius:8px;background:#fff;color:var(--mb-antracite);font:inherit}
.voce-form textarea{min-height:200px;resize:vertical}.voce-form small{display:block;margin-top:8px}
.voce-scelta{display:flex;gap:12px;align-items:flex-start;margin-bottom:24px}.voce-scelta input{margin-top:7px;flex:none;width:18px;height:18px}
.voce-esito{padding:20px;border:1px solid var(--mb-bordeaux);border-radius:8px;background:#fff}
.voce-trappola{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
@media(max-width:480px){.voce-form{padding:20px}.voce-form .btn{width:100%}}
