.post{ display:grid; gap:.8rem; }
.post h3{ margin:0; font-size:1.1rem; }
.post .meta{ font-size:.9rem; color:var(--muted); }
.post .excerpt{ color:var(--muted); }

article.prose{ max-width:75ch; margin:0 auto; }
/* Adatta la tipografia degli articoli al Text Size del sistema entro limiti sicuri */
article.prose{ font-size:clamp(0.95rem, 1rem + (1cqi - 1cqi), 1.05rem); line-height:1.65; }
article.prose h1{ font-size:clamp(1.7rem, 1.6vw + 1rem, 2.4rem); line-height:1.25; margin:.75rem 0 .5rem; }
article.prose h2{ font-size:clamp(1.35rem, 1.3vw + .95rem, 1.9rem); line-height:1.3; margin:1.2rem 0 .6rem; }
article.prose h3{ font-size:clamp(1.18rem, 1vw + .9rem, 1.5rem); line-height:1.35; margin:1rem 0 .5rem; }
article.prose h4{ font-size:clamp(1.06rem, .8vw + .86rem, 1.25rem); line-height:1.4; margin:.8rem 0 .4rem; }
article.prose p{ color:var(--muted); }
article.prose small, article.prose .meta, article.prose figcaption{ font-size:.925em; }
article.prose .kicker{ font-size:.95em; }
article.prose li{ margin:.25em 0; }
article.prose blockquote{ border-left:3px solid var(--border); padding-left:.9rem; color:var(--text); background:var(--bg-soft); border-radius:8px; }

/* iOS Safari: supporta formati dinamici con tokens opzionali senza rompere altri browser */
@supports (font: -apple-system-body) {
  article.prose{ font: -apple-system-body; line-height: 1.65; }
  article.prose h1{ font: -apple-system-title2; }
  article.prose h2{ font: -apple-system-title3; }
  article.prose h3{ font: -apple-system-headline; }
  article.prose h4{ font: -apple-system-subheadline; }
  article.prose .kicker{ font: -apple-system-subheadline; }
  article.prose .meta, article.prose figcaption, article.prose small{ font: -apple-system-footnote; }
  article.prose blockquote{ font: -apple-system-callout; }
}
article.prose pre{ background:var(--bg-soft); padding:1rem; border-radius:12px; overflow:auto; border:1px solid var(--border); }
article.prose code{ font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; font-size:.95em; }
/* Ridimensiona i tag nel contesto dell'articolo in modo proporzionale */
article.prose .tag{ font-size:.85em; }
/* Evita elementi fissi nello scorrimento dell'articolo: solo l'header sito resta sticky */
article.prose header,
article.prose h1,
article.prose .kicker,
article.prose .meta{
  position: static !important;
  top: auto !important;
}
/* Miniature nella lista del blog */
.post-thumb {
  margin: .6rem 0 .6rem;
}
.post-thumb img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12px;
  border: 1px solid var(--border);
  /* Se vuoi un’altezza uniforme a griglia, sblocca le due righe sotto: */
  /* aspect-ratio: 16 / 9; */
  /* object-fit: cover; */
}

/* Migliora lo spacing quando c'è la miniatura */
.post h3 {
  margin-bottom: .4rem;
}
.post .meta {
  margin-top: .2rem;
}

/* Prev/Next & Related */
.post-nav{ display:flex; gap:1rem; flex-wrap:wrap; justify-content:space-between; margin:1.5rem 0; }
.post-nav a{ display:inline-flex; align-items:center; gap:.5rem; border:1px solid var(--border); border-radius:10px; padding:.6rem .8rem; text-decoration:none; }
.related-grid{ display:grid; gap:1rem; grid-template-columns:repeat(12,1fr); margin-top:1rem; }
.related-grid .post{ grid-column:span 12; }
@media (min-width:720px){ .related-grid .post{ grid-column:span 6; } }
@media (min-width:1000px){ .related-grid .post{ grid-column:span 4; } }

/* Archive nav */
#archive-nav{ border:1px solid var(--border); background:var(--card); border-radius:12px; padding:1rem; margin:1rem auto; max-width:760px; }
.archive-year{ margin:.25rem 0; }
.archive-months{ list-style:none; display:flex; flex-wrap:wrap; gap:.4rem .6rem; padding:0; margin:.5rem 0 0; }
.archive-months a{ display:inline-block; padding:.25rem .6rem; border:1px solid var(--border); border-radius:999px; text-decoration:none; }

/* Search form layout (mobile) */
@media (max-width:560px){
  form.search{ display:grid !important; grid-template-columns: 3fr 1fr; gap:.5rem; }
  form.search input[type="search"]{ width:100%; font-size:16px; }
  form.search .btn{ width:100%; padding:.55rem .6rem !important; }
}

/* Share bar */
.share-bar{ display:block; text-align:center; padding:.8rem 1rem; border:1px solid var(--border); border-radius:12px; background:var(--bg-soft); margin:1rem 0; }
.share-list{ list-style:none; display:inline-flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:.6rem; margin:0 auto; padding:0; }
.share-btn, .share-copy{ display:inline-flex; align-items:center; justify-content:center; gap:.4rem; height:40px; width:40px; padding:0; border:1px solid var(--border); border-radius:12px; background:var(--bg); color:var(--text); text-decoration:none; -webkit-tap-highlight-color: transparent; line-height:1; }
.share-btn:hover, .share-copy:hover{ background:var(--bg-soft); }
.share-btn svg{ pointer-events:none; display:block; }
.share-copy{ font-size:.95rem; font-weight:700; }

@media (max-width: 560px){
  .share-bar{ padding:.8rem; border-radius:14px; }
  .share-list{ gap:.5rem; }
  .share-btn, .share-copy{ height:44px; width:44px; border-radius:14px; }
}

/* Toast */
.toast{ position:fixed; left:50%; bottom:24px; transform:translateX(-50%) translateY(20px); background:rgba(20,20,25,.95); color:#fff; padding:.6rem .9rem; border-radius:10px; opacity:0; transition:transform .2s ease, opacity .2s ease; z-index:9999; }
.toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }

/* Audio articolo */
.audio-article{ border:1px solid var(--border); background:var(--card); border-radius:12px; padding:.8rem 1rem; margin:1rem 0; }
.aa-row{ display:flex; align-items:center; gap:.8rem; flex-wrap:wrap; }
.aa-btn{ border:1px solid var(--border); background:var(--bg); border-radius:999px; height:36px; padding:0 1rem; cursor:pointer; }
.aa-btn.aa-primary{ background:linear-gradient(135deg, var(--accent-1), var(--accent-2)); color:#fff; border:0; }
.aa-time{ margin-left:auto; font-variant-numeric: tabular-nums; }

/* Crediti foto sotto l'immagine (solo dove presente figcaption.figure-credit) */
article.prose .figure-credit{
  display:block;
  margin-top:.3rem;
  color:var(--muted);
  font-size:.75em;
}
