/* ilMioAcquario — articoli blog/guide: copertina, prosa, TOC, h2 numerati, blocco 'E adesso?' Modulo CSS caricato condizionalmente da baseof.html (vedi commento nel ). Generato dallo split di main.css per minimizzare le risorse per pagina. */ /* ---------- Blocco "E adesso?" a fine guida ---------- */ .e-adesso { margin-top: 34px; padding-top: 28px; border-top: 1px solid var(--bordo); } .e-adesso h2 { font-family: 'Lora', serif; font-weight: 600; font-size: 28px; margin: 0 0 12px; } .e-adesso > p { color: var(--ink-soft); font-size: 16px; margin: 0 0 20px; max-width: 62ch; } .e-adesso__azioni { display: flex; flex-wrap: wrap; gap: 12px; } /* ---------- Articoli: copertina e contenuto ---------- */ .foto-cover { margin: 0 0 28px; } .foto-cover img { width: 100%; aspect-ratio: 16/8; object-fit: cover; border-radius: 16px; box-shadow: 0 10px 30px rgb(10 40 50 / 0.14); } .foto-cover figcaption { font-size: 12px; color: var(--ink-soft); padding: 8px 4px 0; line-height: 1.5; } .foto-cover figcaption a { text-decoration: underline; } .prosa--articolo > p:first-of-type { font-size: 18px; line-height: 1.7; color: var(--ink); } .prosa--articolo h2 { scroll-margin-top: 84px; } .prosa--articolo ul { padding-left: 1.1em; } .prosa--articolo li { margin: 6px 0; } .prosa--articolo blockquote { margin: 24px 0; padding: 18px 22px; border: 0; background: var(--verde-chiaro); border-radius: 14px; font-size: 16px; color: var(--ink); } .prosa--articolo blockquote p { margin: 8px 0 0; } .prosa--articolo blockquote p:first-child { margin-top: 0; } .prosa--articolo blockquote strong:first-child { color: var(--verde-testo); } /* Titoli di sezione numerati nelle guide */ .prosa--articolo .h2-num { display: flex; align-items: baseline; gap: 16px; border-top: 1px solid var(--bordo); padding-top: 28px; margin: 36px 0 14px; font-family: 'Lora', serif; font-weight: 600; font-size: 28px; scroll-margin-top: 84px; } .prosa--articolo .h2-num__n { flex: 0 0 auto; font-family: 'Manrope', sans-serif; font-size: 13px; font-weight: 800; color: var(--verde-testo); letter-spacing: 0.06em; position: relative; top: 2px; } /* Indice "In questa guida" (TOC) */ .toc { margin-bottom: 20px; } .toc__eyebrow { display: block; color: var(--verde-testo); font-size: 12px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; padding: 4px 12px 12px; } .toc__voce { display: flex; gap: 12px; align-items: baseline; padding: 8px 12px; border-radius: 8px; font-size: 15px; font-weight: 600; line-height: 1.3; } .toc__voce:hover { background: var(--verde-chiaro); color: var(--verde-testo); } .toc__num { flex: 0 0 auto; color: var(--verde-testo); font-size: 12px; font-weight: 800; min-width: 15px; }