/* Advice posts: the few things only a post needs. Everything else (hero, .prose, cards, strip,
   closing band) is in site.css. Framed look, 26 Sep 2026. */
.post { display: grid; justify-items: center; }
.post__cover { width: 100%; max-width: 1000px; }
.post__cover img { aspect-ratio: 16 / 9; object-fit: cover; }
.post__body { width: 100%; margin-top: clamp(40px, 5vw, 64px); }
.post__body > :first-child { margin-top: 0; }
.post__body em:first-child { color: var(--slate); }

/* /blog: the newest guide, large. Photo left, words right; stacked on a phone (10 Oct 2026). */
.post-feature { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 32px clamp(40px, 5vw, 88px); align-items: center; color: inherit; }
.post-feature .frame img { aspect-ratio: 4 / 3; transition: transform .8s cubic-bezier(.2, .7, .2, 1); }
.post-feature:hover .frame img { transform: scale(1.03); }
.post-feature__title { margin-top: 16px; max-width: 14em; transition: color .2s ease; }
.post-feature:hover .post-feature__title { color: var(--brass-text); }
.post-feature .photo-card__meta { margin-top: 24px; color: var(--slate); }
.post-feature__lead { margin-top: 12px; }
.post-feature .arrow-link { margin-top: 24px; }
.advice-hero__img { object-position: 50% 60%; }
@media (max-width: 900px) { .post-feature { grid-template-columns: minmax(0, 1fr); } }