/* ==========================================================================
   Pages, posts, 404
   ========================================================================== */

.dc-page { padding-top: 32px; padding-bottom: 16px; }
.dc-page__head { margin-bottom: 20px; }
.dc-page__title { font-size: clamp(28px, 3.6vw, 42px); font-weight: 800; letter-spacing: -.02em; }
.dc-page__body { margin-inline: 0; }

.dc-posts { display: grid; gap: 22px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.dc-post-card { border: var(--card-border); border-radius: var(--r-lg); box-shadow: var(--card-shadow); overflow: hidden; }
.dc-post-card__link { display: grid; gap: 6px; color: var(--ink); text-decoration: none; padding-bottom: 16px; }
.dc-post-card__img img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.dc-post-card__title { padding: 10px 16px 0; font-size: 17px; font-weight: 700; }
.dc-post-card__date { padding: 0 16px; font-size: 13px; color: var(--g600); }

.dc-article { max-width: 780px; margin: 0 auto; }
.dc-article__date { font-size: 13px; color: var(--g600); margin-bottom: 6px; }
.dc-article__img { margin-bottom: 24px; }
.dc-article__img img { border-radius: var(--r-lg); }

.dc-404 { text-align: center; padding-block: 64px; display: grid; gap: 16px; justify-items: center; }
.dc-404 .dc-search { width: min(100%, 480px); }
.dc-search--page .dc-search__input { background: var(--white); color: var(--ink); border-color: var(--g300); }
.dc-search--page .dc-search__btn { color: var(--ink); }
.dc-404__btns { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }