/* Shared value page: alternating article rows (text / 371px picture) on a dark-wine blurred gradient. */
.c-shared :where(h1, h2, p) { margin: 0; }
.c-shared { position: relative; isolation: isolate; overflow: hidden; display: grid; justify-items: center; gap: 60px; padding: 150px 20px 100px; color: #fff; background: #0b0809 url("../img/shared/page-bg.webp") center top / 100% 100% no-repeat; }
.c-shared__list { display: grid; gap: 151px; width: min(995px, 100%); }
.c-shared-post { display: flex; align-items: center; justify-content: center; gap: 88px; padding-block: 40px; }
.c-shared-post:nth-child(even) { flex-direction: row-reverse; }
.c-shared-post__body { display: flex; flex-direction: column; align-items: flex-start; gap: 35px; width: 536px; min-width: 0; }
.c-shared-post__date { font: 500 12px/20px var(--font-ui); }
.c-shared-post__title { font: 500 44px/50px var(--font-display); }
.c-shared-post__title a { color: inherit; text-decoration: none; }
.c-shared-post__excerpt { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; font: 400 17px/1.386 var(--font-ui); }
.c-shared-post__more { padding: 6px 24px; font: 500 14px/20px var(--font-ui); }
.c-shared-post__image { flex: none; width: 371px; height: 371px; overflow: hidden; border-radius: 24px; }
.c-shared-post__image img { display: block; width: 100%; height: 100%; object-fit: cover; }

.c-pager { display: flex; gap: 18px; padding-inline: 10px; }
.c-pager__page { display: grid; place-items: center; box-sizing: border-box; width: 44px; height: 44px; border: 1px solid #fff; border-radius: 100px; color: #fff; font: 400 17px/1.386 var(--font-ui); text-decoration: none; }
.c-pager__page.is-current { background: rgba(255, 255, 255, .7); color: var(--c-crimson); font-weight: 700; }
.c-pager__page:hover { background: rgba(255, 255, 255, .3); }

@media (max-width: 1023px) {
  .c-shared { padding-top: 130px; }
  .c-shared__list { gap: 56px; }
  .c-shared-post, .c-shared-post:nth-child(even) { flex-direction: column-reverse; align-items: stretch; gap: 24px; padding-block: 0; }
  .c-shared-post__body { width: 100%; gap: 20px; }
  .c-shared-post__title { font-size: 30px; line-height: 36px; }
  .c-shared-post__image { width: 100%; height: auto; aspect-ratio: 1; }
}
