/* Doliarium: i blocchi di scrittura dei modelli (In evidenza nel testo, Avviso ai lettori),
   la nota e l'annuncio degli articoli di prova.
   Solo token (variabili) per colori, caratteri, spazi e misure; l'unica eccezione è l'annuncio di
   prova, che imita un annuncio di terzi e quindi non prende la grafica del sito. */

/* In evidenza nel testo, concetto: una frase del testo, grande, tra un filo spesso e uno sottile.
   Si riconosce anche senza colore: filo spesso sopra, corsivo grande, filo sottile sotto. */
.evidenza--concetto { margin: 2.5em 0; padding: 1.25rem 0 1.5rem; border-top: 3px solid var(--color-accent); border-bottom: 1px solid var(--color-brass); }
.evidenza--concetto .evidenza__testo { font-family: var(--font-display); font-style: italic; font-weight: 500; font-size: 1.875rem; line-height: 1.15; color: var(--color-accent); text-wrap: balance; }
@media (min-width: 768px) { .evidenza--concetto .evidenza__testo { font-size: 2.375rem; } }

/* In evidenza nel testo, citazione: prende il disegno delle citazioni del sito (.citazione). */
.evidenza--citazione blockquote { margin: 0; }

/* Avviso ai lettori degli articoli promozionali: una riga discreta, tra due fili sottili, con la «i». */
.avviso-promo { display: flex; gap: .625rem; align-items: flex-start; padding: .75rem 0; border-top: 1px solid color-mix(in oklab, var(--color-brass) 70%, transparent); border-bottom: 1px solid color-mix(in oklab, var(--color-brass) 70%, transparent); color: var(--color-text-muted); }
.avviso-promo::before { content: "i"; flex: none; width: 1.25rem; height: 1.25rem; margin-top: .15rem; border: 1px solid currentColor; border-radius: 50%; display: grid; place-items: center; font-family: var(--font-body); font-style: normal; font-weight: 600; font-size: .75rem; line-height: 1; color: var(--color-brass-text); }
.avviso-promo__testo { font-size: 1rem; line-height: 1.45; font-style: italic; }
.avviso-promo__testo a { color: inherit; }
.avviso-promo--cima { margin: 0 0 2em; }
.avviso-promo--fondo { margin: 2.5em 0 0; }

/* Nota di prova: un riquadro tratteggiato con l'etichetta in maiuscolo, fuori dal testo dell'articolo. */
.nota-prova { margin: 0 0 2.25em; padding: 1rem 1.25rem 1.125rem; border: 2px dashed var(--color-text); background: var(--color-paper); color: var(--color-text); }
.nota-prova__etichetta { font-family: var(--font-body); font-size: .8125rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; margin-bottom: .375rem; }
.nota-prova__testo { font-family: var(--font-body); font-size: 1.0625rem; line-height: 1.5; font-style: normal; }

/* La firma degli articoli di prova: niente ritratto, il nome occupa tutta la riga. */
.autore--prova { grid-template-columns: minmax(0, 1fr); }
.autore--prova .autore__bio { grid-column: 1 / -1; }
@media (min-width: 600px) { .autore--prova { grid-template-columns: minmax(0, 1fr); } .autore--prova .autore__bio { grid-column: 1 / -1; } }

/* L'annuncio di prova: un rettangolo da 300 × 250 nello stile dei comuni annunci di terzi. */
.annuncio-prova { position: relative; width: 300px; max-width: 100%; min-height: 250px; margin-inline: auto; display: grid; grid-template-rows: 120px 1fr; background: #fff; border: 1px solid #dadce0; color: #202124; text-align: left; font-family: Arial, Helvetica, sans-serif; font-style: normal; overflow: hidden; }
.annuncio-prova__angolo { position: absolute; top: 0; right: 0; z-index: 1; display: flex; align-items: center; gap: 2px; padding: 1px 2px 1px 6px; background: rgba(255, 255, 255, .92); font-size: 11px; line-height: 15px; color: #5f6368; }
.annuncio-prova__icona { width: 15px; height: 15px; display: grid; place-items: center; font-size: 11px; line-height: 1; color: #1a73e8; }
.annuncio-prova__icona:first-of-type { border: 1px solid currentColor; border-radius: 50%; width: 13px; height: 13px; font-size: 9px; font-weight: 700; font-family: Georgia, serif; }
.annuncio-prova__immagine svg { display: block; width: 100%; height: 120px; }
.annuncio-prova__testi { display: grid; align-content: start; gap: 4px; padding: 10px 12px 12px; }
.annuncio-prova__titolo { font-size: 16px; line-height: 1.25; font-weight: 700; color: #202124; }
.annuncio-prova__testo { font-size: 13px; line-height: 1.35; color: #3c4043; }
.annuncio-prova__piede { margin-top: 6px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.annuncio-prova__dominio { font-size: 12px; color: #5f6368; }
.annuncio-prova__bottone { display: inline-grid; place-items: center; min-width: 64px; height: 30px; padding: 0 14px; border-radius: 15px; background: #1a73e8; color: #fff; font-size: 13px; font-weight: 700; }

@media print {
  .nota-prova, .annuncio-prova { display: none; }
  .avviso-promo { padding: 1mm 0; }
  .evidenza--concetto { break-inside: avoid; }
}