/* ==========================================================================
   Dog Blog – Übersicht und Beiträge
   ========================================================================== */
.blog-section { padding-block: var(--s-6); }
.tgrid { display: grid; gap: var(--s-5) var(--grid-gap); grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); }
@media (min-width: 56em) { .tgrid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.tcard { display: flex; flex-direction: column; }
.tcard .tc-media { display: block; aspect-ratio: 4 / 3; border-radius: var(--r-img); overflow: hidden; background: var(--c-sand); margin-bottom: var(--s-2); }
.tcard .tc-media picture, .tcard .tc-media img { width: 100%; height: 100%; object-fit: cover; }
.tcard--noimg { padding: var(--s-3); background: var(--c-paper); border-radius: var(--r-img); border-top: 4px solid var(--c-ochre); }
.section--sand .tcard--noimg { background: var(--c-paper); }
.tcard h3 { font-size: 1.15rem; margin-bottom: 0.4rem; }
.tcard h3 a { color: inherit; text-decoration: none; }
.tcard h3 a:hover { text-decoration: underline; text-decoration-thickness: 1px; }
.tcard p { font-size: 1rem; margin-bottom: var(--s-1); }
.tcard .more { margin-top: auto; font-size: 1rem; }
.post-meta { font-size: var(--fs-small); color: var(--c-muted); margin-bottom: 0.35rem; }
.js .is-limited .is-more:not(.is-shown) { display: none; }
.more-row { margin-top: var(--s-5); text-align: center; }

.post { padding-block: var(--s-4) var(--s-6); }
.post-head, .post-body, .post-nav { max-width: 44rem; }
.post-head { margin-bottom: var(--s-4); }
.post-head h1 { font-size: clamp(2rem, 1.5rem + 2vw, 3rem); }
.post-note { margin-top: var(--s-3); padding: var(--s-2) var(--s-3); background: var(--c-sand); border-left: 4px solid var(--c-ochre); font-size: 1rem; }
.post-body h2 { font-size: var(--fs-h3); margin-top: var(--s-5); }
.post-fig { margin: var(--s-4) 0; }
.post-fig img { border-radius: var(--r-img); width: auto; max-width: 100%; height: auto; }
.post-nav { margin-top: var(--s-6); padding-top: var(--s-4); border-top: 1px solid var(--c-sand-deep); display: grid; gap: var(--s-2); justify-items: start; }