/* v4. Template articoli (Blog Post) ed elenco /blog nella veste delle pagine nuove.
   Articolo a una colonna, larga come oggi; indice in alto. Caricato solo su queste pagine (script di pagina DsyHeadBlog + embed in fondo), quindi i selettori partono dalla
   struttura del template senza classi nuove sugli elementi. Variabili da dsy-core. Testi e CMS non cambiano:
   gli stili inline delle tabelle e quelli dei widget (<style> dentro docsy-widget e docsy-calc-*) si battono
   con !important o con la specificità. Nessuna animazione al caricamento: vincolo LCP. */

/* ═══ Font di riserva tarato su Poppins (Arial locale con le metriche corrette): finché Poppins non arriva il testo
   occupa le stesse righe, quindi il cambio di font non sposta titolo e immagine. Nessun font da scaricare ═══ */
@font-face{font-family:"Poppins Fallback";src:local("Arial"),local("ArialMT");size-adjust:112.16%;ascent-override:93.62%;descent-override:31.21%;line-gap-override:8.92%}
body > section.section.grow{font-family:Poppins,"Poppins Fallback",Arial,sans-serif}
body > section.section.grow :is(h1,h2,h3,h4,p,li,a,div,span,input){font-family:inherit}

/* ═══ Pagina ═══ */
body > section.section.grow{display:block;min-width:0;padding:56px 0 96px;background:var(--white);color:var(--text-body)}
body > section.section.grow > .container{display:block;text-align:left;width:auto;max-width:1056px;margin:0 auto;padding:0 16px;box-sizing:border-box}
/* il template mette i contenitori in flex centrato: i figli prenderebbero la larghezza del contenuto (le tabelle allargano la pagina) */
body > section.section.grow > .container > :where(*){min-width:0;max-width:100%;box-sizing:border-box}

/* ═══ Articolo: intestazione ═══ */
/* embed statici della testata (percorso, data, riga «Calcolatori»): niente margini né scroll dello stile .w-embed del template */
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-embed:has(> :is(.blg-crumb,.blg-meta)){max-width:none;margin:0;overflow:visible}
.blg-crumb ol{display:flex;align-items:center;min-width:0;margin:0 0 14px;padding:0;list-style:none;font-size:14px;line-height:24px;color:var(--text-muted)}
.blg-crumb li{flex:none;margin:0;padding:0}
.blg-crumb li + li{flex:0 1 auto;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.blg-crumb li + li::before{content:"›";margin:0 8px;color:var(--text-muted)}
.blg-crumb a{color:var(--docsy-blue);font-weight:500;text-decoration:none}
.blg-crumb a:hover{text-decoration:underline;text-underline-offset:3px}
.blg-meta{margin:0 0 28px}
.blg-date{margin:0;font-size:15px;line-height:24px;color:var(--text-muted)}
.blg-date:not(.is-set){visibility:hidden}
.blogheadingtitle{max-width:900px;margin:0 0 16px !important;font-family:Poppins,"Poppins Fallback",Arial,sans-serif !important;font-size:46px !important;line-height:1.17 !important;font-weight:700 !important;letter-spacing:-0.03em;color:var(--docsy-blue) !important;text-align:left !important}
.blogheadingtitle + .main-image,
body > section.section.grow .main-image{display:block;width:100% !important;max-width:none;height:clamp(220px,30vw,360px) !important;object-fit:cover;border-radius:var(--radius-card);margin:0 0 48px !important}

/* ═══ Articolo: indice «Guida all'articolo» in alto (embed del template, stili inline battuti con body #toc).
   Aperto da 1100px; sotto è chiuso e si apre dal titolo (bottone dallo script): altezza costante, il primo paragrafo resta sopra la piega ═══ */
body #toc{border:0;border-radius:var(--radius-highlight);padding:24px 24px 20px;margin:0 0 40px;background:var(--white);box-shadow:var(--dz-ring),var(--dz-e1);box-sizing:border-box}
body #toc h3{margin:0 0 14px;font-size:17px;line-height:1.3;font-weight:600;letter-spacing:.01em;color:var(--docsy-blue);text-transform:none}
body #toc ul{border-left:1px solid var(--blue-wash-20)}
body #toc li{margin:0}
body #toc li.is-h3{padding-left:14px}
body #toc a{display:block;padding:7px 0 7px 16px;margin-left:-1px;border-left:2px solid transparent;font-size:14.5px;line-height:1.4;font-weight:400;color:var(--text-body);transform:none !important;transition:color .2s,border-color .2s}
body #toc a:hover{color:var(--docsy-blue)}
body #toc li.is-h2 a::before,
body #toc li.is-h3 a::before{color:var(--docsy-blue);font-weight:600}

body > section.section.grow > .container:has(> .blogheadingtitle) > .w-embed:has(> script:only-child){margin:0;overflow:visible}

/* ═══ Articolo: testo ═══ */
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext{max-width:none;margin:0;font-size:17px;line-height:1.75;color:var(--text-body)}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext > *:first-child{margin-top:0}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext :is(p,ul,ol){margin:0 0 20px}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext :is(ul,ol){padding-left:24px}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext li{margin:0 0 8px}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext li::marker{color:var(--docsy-blue)}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext li > :is(ul,ol){margin:8px 0 0}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext h2{margin:56px 0 18px;font-size:30px;line-height:1.25;font-weight:600;letter-spacing:-0.02em;color:var(--docsy-blue);scroll-margin-top:104px}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext h3{margin:40px 0 14px;font-size:22px;line-height:1.35;font-weight:600;letter-spacing:-0.01em;color:var(--docsy-blue);scroll-margin-top:104px}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext h4{margin:32px 0 12px;font-size:18px;line-height:1.4;font-weight:600;color:var(--text-nav)}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext :is(h2,h3,h4) strong{font-weight:inherit;color:inherit}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext strong{font-weight:600;color:var(--docsy-blue)}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext a{color:var(--docsy-blue);font-weight:500;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;overflow-wrap:anywhere}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext a:hover{text-decoration-thickness:2px}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext a strong{color:inherit}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext blockquote{margin:28px 0;padding:20px 24px;border:0;border-left:3px solid var(--docsy-gold);border-radius:0 var(--radius-faq) var(--radius-faq) 0;background:var(--blue-wash);font-size:17px;line-height:1.7;color:var(--text-body)}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext figure{margin:32px 0}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext figure img{border-radius:var(--radius-highlight)}

/* ═══ Tabelle (embed nel testo): scorrono dentro il loro riquadro, mai la pagina ═══ */
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext .w-embed:has(> table),
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext .w-embed:has(> :is(div,figure) > table){max-width:100%;margin:28px 0;overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--radius-highlight);box-shadow:var(--dz-ring),var(--dz-e1);background:var(--white)}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext .w-embed table{width:100% !important;min-width:560px;margin:0 !important;border-collapse:separate !important;border-spacing:0;background:var(--white);border-radius:0;box-shadow:none;font-size:15px !important;line-height:1.55}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext .w-embed table :is(td,th){padding:13px 16px !important;border:0 !important;border-bottom:1px solid var(--blue-wash-10) !important;background:var(--white) !important;color:var(--text-body) !important;font-size:inherit !important;font-weight:400 !important;text-align:left !important;vertical-align:top !important}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext .w-embed table tbody tr:nth-child(even) :is(td,th){background:var(--surface-whisper) !important}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext .w-embed table tr:hover{background:transparent}
/* intestazione: la thead se c'è, altrimenti la prima riga (gli embed del blog la fanno con td) */
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext .w-embed table thead :is(td,th),
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext .w-embed table:not(:has(thead)) tr:first-child > :is(td,th){background:var(--docsy-blue) !important;color:var(--white) !important;font-weight:600 !important;font-size:14px !important;border-bottom:0 !important;vertical-align:bottom !important}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext .w-embed table tbody tr:last-child > *{border-bottom:0 !important}
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext .w-embed table strong{color:inherit}

/* ═══ Box del calcolatore dentro il testo (docsy-calc-macro / docsy-calc-micro) ═══ */
body > section.section.grow > .container:has(> .blogheadingtitle) docsy-calc-macro,
body > section.section.grow > .container:has(> .blogheadingtitle) docsy-calc-micro{display:block}
body > section.section.grow > .container:has(> .blogheadingtitle) .docsy-calc-container{max-width:none !important;margin:32px 0 !important;padding:28px 28px 26px !important;border:0 !important;border-radius:var(--radius-card) !important;background:color-mix(in srgb,var(--docsy-blue) 5%,var(--white)) !important;box-shadow:inset 0 0 0 1px var(--blue-wash-10) !important}
body > section.section.grow > .container:has(> .blogheadingtitle) .docsy-calc-kicker{display:inline-flex !important;align-items:center;gap:8px !important;margin:0 0 14px !important;padding:7px 15px 7px 13px;border-radius:var(--radius-pill);background:rgba(255,255,255,.92);box-shadow:inset 0 0 0 1px rgba(48,91,171,.10),0 1px 2px rgba(16,36,80,.05);font-size:13.5px !important;line-height:1.25 !important;font-weight:500 !important;letter-spacing:.01em !important;text-transform:none !important;color:var(--docsy-blue) !important}
body > section.section.grow > .container:has(> .blogheadingtitle) .docsy-calc-kicker::before{content:"" !important;width:7px !important;height:7px !important;border-radius:50% !important;background:var(--docsy-gold) !important;box-shadow:0 0 0 3px rgba(255,178,36,.20) !important;flex:none}
body > section.section.grow > .container:has(> .blogheadingtitle) .docsy-calc-title{margin:0 0 10px !important;font-size:24px !important;line-height:1.3 !important;font-weight:600 !important;letter-spacing:-0.01em;color:var(--docsy-blue) !important}
body > section.section.grow > .container:has(> .blogheadingtitle) .docsy-calc-title .highlight{color:inherit !important;background:none !important;white-space:normal !important}
body > section.section.grow > .container:has(> .blogheadingtitle) .docsy-calc-description{margin:0 0 20px !important;font-size:16px !important;line-height:1.6 !important;color:var(--text-body) !important}
body > section.section.grow > .container:has(> .blogheadingtitle) .docsy-calc-button{display:inline-flex !important;align-items:center;justify-content:center;min-height:48px;padding:14px 22px !important;border-radius:var(--radius-pill) !important;background:var(--docsy-blue) !important;color:var(--white) !important;font-size:16px !important;line-height:1 !important;font-weight:600 !important;text-decoration:none !important;box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 1px 2px rgba(16,36,80,.18),0 10px 24px -10px rgba(48,91,171,.55) !important;transform:none !important;transition:opacity .2s !important;box-sizing:border-box}
body > section.section.grow > .container:has(> .blogheadingtitle) .docsy-calc-button:hover{opacity:.9;background:var(--docsy-blue) !important}
body > section.section.grow > .container:has(> .blogheadingtitle) .docsy-calc-note{margin-left:16px !important;font-size:14px !important;color:var(--text-muted) !important}

/* ═══ Fascia finale (docsy-widget): la fascia blu delle pagine nuove ═══ */
body > section.section.grow > .w-embed:has(docsy-widget){max-width:1056px;margin:88px auto 0;padding:0 16px;box-sizing:border-box}
.docsy-widget-container{max-width:none !important;margin:0 !important;padding:64px 72px !important;border-radius:var(--radius-card) !important;background:var(--docsy-blue) !important;box-shadow:inset 0 1px 0 rgba(255,255,255,.10) !important;text-align:left}
.docsy-widget-title{max-width:720px;margin:0 0 16px !important;font-size:34px !important;line-height:1.2 !important;font-weight:600 !important;letter-spacing:-0.02em;color:var(--white) !important}
.docsy-widget-title .highlight{color:var(--docsy-gold) !important}
.docsy-widget-description{max-width:640px;margin:0 0 32px !important;font-size:17px !important;line-height:1.6 !important;color:rgba(255,255,255,.86) !important}
.docsy-cta-button{display:inline-flex !important;align-items:center;justify-content:center;min-height:48px;padding:15px 24px !important;border-radius:var(--radius-pill) !important;background:var(--white) !important;color:var(--docsy-blue) !important;font-size:18px !important;line-height:1 !important;font-weight:600 !important;text-decoration:none !important;box-shadow:0 1px 2px rgba(8,20,50,.25),0 12px 28px -12px rgba(8,20,50,.55) !important;transform:none !important;transition:opacity .2s !important;box-sizing:border-box}
.docsy-cta-button:hover{opacity:.9;background:var(--white) !important}

/* ═══ Card degli articoli: «Continua la lettura» e /blog ═══ */
body > section.section.grow .collection-list{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin:0;padding:0}
body > section.section.grow .collection-list > .w-dyn-item{display:flex;min-width:0;margin:0;padding:0;width:auto}
body > section.section.grow .article-card-link{display:flex !important;flex-direction:column;gap:0 !important;min-height:0 !important;width:100%;height:auto;margin:0 !important;padding:12px 12px 24px !important;border-radius:var(--radius-card) !important;background:var(--white) !important;box-shadow:inset 0 0 0 1px rgba(48,91,171,.08),0 1px 1px rgba(16,36,80,.03),0 2px 6px -1px rgba(16,36,80,.05),0 14px 32px -14px rgba(16,36,80,.12) !important;text-align:left !important;text-decoration:none;color:inherit;transform:none;transition:transform var(--transition-std),box-shadow var(--transition-std) !important;box-sizing:border-box}
body > section.section.grow .article-card-link:hover{transform:translateY(-4px) !important;box-shadow:inset 0 0 0 1px rgba(48,91,171,.12),0 2px 4px rgba(16,36,80,.05),0 22px 40px -16px rgba(16,36,80,.20) !important}
body > section.section.grow .article-card-link:focus-visible{outline:2px solid var(--docsy-blue);outline-offset:3px}
body > section.section.grow .article-card-link .thumb-image{display:block;width:100% !important;max-width:none;height:auto !important;aspect-ratio:16/10;object-fit:cover;margin:0 !important;border-radius:16px !important}
body > section.section.grow .article-card-link .post-title{height:auto !important;min-height:0 !important;margin:18px 10px 8px !important;padding:0 !important;font-size:17px !important;line-height:1.35 !important;font-weight:600 !important;letter-spacing:-0.005em;color:var(--docsy-blue) !important;text-align:left !important}
body > section.section.grow .article-card-link .post-text{height:auto !important;min-height:0 !important;margin:0 10px !important;padding:0 !important;font-size:14.5px !important;line-height:1.55 !important;font-weight:400 !important;color:var(--text-body) !important;text-align:left !important;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}

/* «Continua la lettura» in fondo all'articolo */
body > section.section.grow > .container:has(.moreblogarticles){margin-top:96px}
.moreblogarticles{margin:0 0 28px !important;font-size:30px !important;line-height:1.25 !important;font-weight:600 !important;letter-spacing:-0.02em;color:var(--docsy-blue) !important;text-align:left !important}

/* ═══ Elenco /blog ═══ */
body > section.section.grow > .container:has(> .filters) > h1{margin:0 0 28px !important;font-family:var(--font-display);font-size:52px !important;line-height:1.16 !important;font-weight:700 !important;letter-spacing:-0.03em;color:var(--docsy-blue) !important;text-align:left !important}
body > section.section.grow .filters{max-width:520px;margin:0 0 48px !important;padding:0}
body > section.section.grow .filters form{margin:0}
body > section.section.grow .filters .text-field{height:52px !important;margin:0 !important;padding:0 20px 0 50px !important;border:0 !important;border-radius:var(--radius-pill) !important;background:var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23305bab' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 20px 50% !important;box-shadow:inset 0 0 0 1px var(--border-input),0 1px 2px rgba(16,36,80,.05) !important;font-family:var(--font-body);font-size:16px !important;color:var(--text-nav) !important}
body > section.section.grow .filters .text-field::placeholder{color:var(--text-muted)}
body > section.section.grow .filters .text-field:focus{outline:0;box-shadow:inset 0 0 0 2px var(--docsy-blue),0 0 0 4px var(--blue-wash-10) !important}


/* ═══ Tablet ═══ */
@media (max-width:991px){
  body > section.section.grow{padding:44px 0 80px}
  .blogheadingtitle{font-size:38px !important}
  body > section.section.grow > .container:has(> .filters) > h1{font-size:44px !important;line-height:1.18 !important}
  body > section.section.grow .collection-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
  .docsy-widget-container{padding:48px 40px !important}
}

/* ═══ Mobile ═══ */
@media (max-width:767px){
  body > section.section.grow{padding:32px 0 64px}
  body > section.section.grow > .container{padding:0 16px}
  .blogheadingtitle{font-size:30px !important;line-height:1.2 !important;letter-spacing:-0.02em;margin-bottom:24px !important}
  body > section.section.grow .main-image{height:auto !important;aspect-ratio:16/9;margin-bottom:32px !important;border-radius:var(--radius-highlight)}
  body #toc{padding:20px 18px 14px;margin-bottom:32px}
  body #toc a{font-size:14.5px}
  body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext{font-size:16px;line-height:1.72}
  body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext h2{margin:44px 0 14px;font-size:24px;line-height:1.28;scroll-margin-top:88px}
  body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext h3{margin:32px 0 12px;font-size:19.5px;scroll-margin-top:88px}
  body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext h4{font-size:17px}
  body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext .w-embed table{min-width:520px;font-size:14px !important}
  body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext .w-embed table :is(td,th){padding:11px 13px !important}
  body > section.section.grow > .container:has(> .blogheadingtitle) .docsy-calc-container{padding:24px 20px 22px !important}
  body > section.section.grow > .container:has(> .blogheadingtitle) .docsy-calc-title{font-size:21px !important}
  body > section.section.grow > .container:has(> .blogheadingtitle) .docsy-calc-button{width:100%}
  body > section.section.grow > .container:has(> .blogheadingtitle) .docsy-calc-note{display:block;margin:12px 0 0 !important;text-align:center}
  body > section.section.grow > .w-embed:has(docsy-widget){margin-top:64px;padding:0 16px}
  .docsy-widget-container{padding:40px 24px !important;border-radius:var(--radius-highlight) !important}
  .docsy-widget-title{font-size:27px !important;line-height:1.22 !important}
  .docsy-widget-description{font-size:16px !important;margin-bottom:26px !important}
  .docsy-cta-button{width:100%;font-size:17px !important}
  body > section.section.grow > .container:has(.moreblogarticles){margin-top:72px}
  .moreblogarticles{font-size:24px !important}
  body > section.section.grow .collection-list{grid-template-columns:minmax(0,1fr);gap:20px}
  body > section.section.grow > .container:has(> .filters) > h1{font-size:34px !important;line-height:1.2 !important;letter-spacing:-0.02em;margin-bottom:22px !important}
  body > section.section.grow .filters{margin-bottom:32px !important}
}
@media (max-width:479px){
  .blogheadingtitle{font-size:28px !important}
  body > section.section.grow > .container:has(> .filters) > h1{font-size:30px !important}
}


/* ═══ Box del calcolatore: altezza riservata finché lo script di sito non lo disegna ═══ */
body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext :is(docsy-calc-micro,docsy-calc-macro):not(:has(.docsy-calc-container)){min-height:286px;margin:32px 0}

/* ═══ Data nelle card degli articoli ═══ */
body > section.section.grow .article-card-link .w-embed:has(> .blg-card-date){order:3;max-width:none;margin:auto 10px 0;padding-top:14px;overflow:visible}
.blg-card-date{margin:0;font-size:13px;line-height:20px;color:var(--text-muted)}
/* senza data valida (campo non collegato) la riga non c'è */
body > section.section.grow .article-card-link .w-embed:has(> .blg-card-date:not(.is-set)){display:none}

/* ═══ /blog: i due calcolatori sopra l'elenco ═══ */
body > section.section.grow > .container > .w-embed:has(> .blg-calcs){max-width:none;margin:0 0 40px;overflow:visible}
.blg-calcs-lb{margin:0 0 12px;font-size:13.5px;line-height:1.25;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted)}
.blg-calcs-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:760px}
.blg-calcs-card{display:flex;align-items:center;gap:14px;min-height:72px;padding:14px 20px;border-radius:var(--radius-highlight);background:color-mix(in srgb,var(--docsy-blue) 5%,var(--white));box-shadow:inset 0 0 0 1px var(--blue-wash-10);color:var(--docsy-blue);font-size:16.5px;line-height:1.3;font-weight:600;text-decoration:none;transition:box-shadow var(--transition-std),transform var(--transition-std);box-sizing:border-box}
.blg-calcs-card:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px var(--blue-wash-20),0 12px 24px -14px rgba(16,36,80,.25)}
.blg-calcs-card:focus-visible{outline:2px solid var(--docsy-blue);outline-offset:3px}
.blg-calcs-card img{flex:none;width:40px;height:40px;padding:7px;border-radius:50%;background:var(--white);box-shadow:inset 0 0 0 1px var(--blue-wash-10);box-sizing:border-box}

@media (max-width:767px){
  .blg-crumb ol{font-size:13px;margin-bottom:10px}
  .blg-meta{margin-bottom:22px}
  .blg-date{font-size:14px}
  body > section.section.grow > .container:has(> .blogheadingtitle) > .w-richtext :is(docsy-calc-micro,docsy-calc-macro):not(:has(.docsy-calc-container)){min-height:388px}
  .blg-calcs-row{grid-template-columns:minmax(0,1fr);gap:12px}
  .blg-calcs-card{min-height:64px;font-size:16px}
}



/* tabelle che scorrono: dissolvenza sul bordo destro finché c'è altro da vedere (classi dallo script) */
.blg-tbl{position:relative;margin:28px 0}
.blg-tbl > .w-embed{margin:0 !important}
.blg-tbl::after{content:"";position:absolute;top:0;right:0;bottom:0;width:44px;border-radius:0 var(--radius-highlight) var(--radius-highlight) 0;background:linear-gradient(to right,rgba(255,255,255,0),rgba(255,255,255,.92) 70%),linear-gradient(to right,rgba(16,36,80,0),rgba(16,36,80,.10));pointer-events:none;opacity:0;transition:opacity .2s}
.blg-tbl.has-more::after{opacity:1}

/* ═══ Indice sotto i 1100px: chiuso, si apre dal titolo ═══ */
@media (max-width:1099px){
  body #toc{padding:0}
  body #toc h3{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0;padding:16px 20px;font-size:16px;line-height:1.25;cursor:pointer;-webkit-user-select:none;user-select:none}
  body #toc h3::after{content:"";flex:none;width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .25s}
  body #toc.is-open h3::after{transform:translateY(2px) rotate(-135deg)}
  body #toc h3:focus-visible{outline:2px solid var(--docsy-blue);outline-offset:-2px;border-radius:var(--radius-highlight)}
  body #toc ul{display:none;margin:0 20px 16px}
  body #toc.is-open ul{display:block}
}

/* ═══ Primo schermo da mobile: sopra la piega c'è sempre un elemento della pagina più grande del testo del banner dei
   cookie, così l'LCP non finisce sul banner. Margini più stretti; immagine alta 240px: dove il primo paragrafo è lungo
   resta lui il più grande (LCP sul testo), dove è corto vince l'immagine ═══ */
@media (max-width:767px){
  body > section.section.grow{padding-top:20px}
  .blg-crumb ol{margin-bottom:6px}
  .blogheadingtitle{margin-bottom:10px !important}
  .blg-meta{margin-bottom:16px}
  body > section.section.grow .main-image{aspect-ratio:auto;height:240px !important;max-height:none !important;min-height:0 !important;margin-bottom:18px !important}
  body #toc{margin-bottom:20px}
}