/* =========================================================
   COMET SOUND — UPDATES
   Pagina del singolo articolo (single.php). L'ELENCO non sta qui:
   la pagina Updates e' la "pagina degli articoli" di WordPress, quindi
   la rende home.php, che ha gia' le sue .cs-post-card in components.css.
   Solo classi nuove: non ridefinisce nulla di esistente.
   ========================================================= */

.cs-post__meta {
    margin: 0.6rem 0 0;
    color: var(--cs-muted-deep);
    font-size: 0.85rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.cs-post__body h2,
.cs-post__body h3 {
    letter-spacing: -0.01em;
}

.cs-post__body p,
.cs-post__body li {
    color: var(--cs-muted);
    line-height: 1.75;
}

.cs-post__body strong {
    color: var(--cs-text);
}

.cs-post__body ul,
.cs-post__body ol {
    padding-left: 1.2rem;
}

/* ---------- elenco degli articoli (pagina Updates) ----------
   Le schede erano righe di testo senza contenitore: con una sola voce
   l'elenco sembrava un errore di impaginazione. Stesso linguaggio delle altre
   schede del sito (bordo, raggio, pannello), e titolo riportato a misura da
   elenco invece che da titolo di pagina. */
.cs-post-list {
    gap: clamp(0.9rem, 1.6vw, 1.25rem);
}

.cs-post-card {
    padding: clamp(1.5rem, 2.6vw, 2rem) clamp(1.4rem, 2.4vw, 1.9rem);
    border: 1px solid var(--cs-border);
    border-radius: var(--radius);
    background:
        linear-gradient(160deg, var(--cs-glass), transparent 62%),
        var(--cs-panel);
}

.cs-post-card__title {
    margin-bottom: 0.7rem;
    font-size: clamp(1.25rem, 2.2vw, 1.75rem);
    line-height: 1.22;
}

.cs-post-card__excerpt {
    max-width: 68ch;
}

/* fra intestazione della pagina e prima scheda c'erano circa 144px di vuoto
   (fondo dell'hero piu' testa della sezione): qui si dimezza */
.blog .cs-page-section--tight {
    padding-block-start: clamp(1.25rem, 2.5vw, 2rem);
}

/* ---------- fondo della pagina articolo ----------
   .home-cta vive in home.css, che qui non viene caricato: senza queste regole
   il blocco finale resta allineato a sinistra e incollato al testo. */
.single .cs-post__body {
    padding-bottom: clamp(1.5rem, 4vw, 3rem);
}

.single .home-cta {
    display: grid;
    justify-items: center;
    gap: 1.25rem;
    padding-block: clamp(3.5rem, 8vw, 6rem);
    text-align: center;
}

.single .home-cta__title {
    margin: 0;
    max-width: 22ch;
    font-size: clamp(1.8rem, 4vw, 3rem);
    line-height: 1.12;
    letter-spacing: -0.01em;
}

.single .home-cta__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: center;
}