/* Grade House Journal — article cards (also used on the article list and
 * under each article). */

.gh.journal .journal__top { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 24px 48px; margin-bottom: clamp(36px, 4.5vw, 64px); }
.gh.journal .journal__top .head { margin-bottom: 0; }

.gh .jgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(28px, 3vw, 44px) clamp(20px, 2.5vw, 36px); }
.gh .jcard { display: grid; grid-template-rows: auto 1fr; gap: 18px; min-width: 0; }
.gh .jcard__media { position: relative; display: block; overflow: hidden; aspect-ratio: 16 / 10; background: var(--gh-paper-2); border-radius: 0; }
.gh .jcard__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--gh-ease); }
.gh .jcard:hover .jcard__media img { transform: scale(1.03); }
.gh .jcard__blank { position: absolute; inset: 0; background-color: var(--gh-paper); background-image: var(--gh-grid); }
.gh .jcard__body { display: grid; align-content: start; gap: 10px; }
.gh .jcard__meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; line-height: 1.4; color: var(--gh-muted); text-transform: none; letter-spacing: 0; }
.gh .jcard__meta span { color: var(--gh-blue); font-weight: 600; }
.gh .jcard__title { font: 600 21px/1.22 var(--gh-head); color: var(--gh-ink); letter-spacing: -.02em; text-wrap: balance; }
.gh .jcard__title a { text-decoration: none; color: inherit; transition: color .2s; }
.gh .jcard__title a:hover, .gh .jcard__title a:focus-visible { color: var(--gh-blue); }
.gh .jcard__excerpt { font-size: 15px; line-height: 1.6; color: var(--gh-muted); }

/* list layout: image left, text right */
.gh .jgrid--list { grid-template-columns: 1fr; gap: 0; }
.gh .jgrid--list .jcard { grid-template-columns: minmax(180px, 280px) minmax(0, 1fr); grid-template-rows: none; gap: clamp(20px, 3vw, 40px); align-items: center; padding: 28px 0; border-top: 1px solid var(--gh-line); }
.gh .jgrid--list .jcard:last-child { border-bottom: 1px solid var(--gh-line); }

.gh.tone-ink .jcard__title { color: #fff; }
.gh.tone-ink .jcard__excerpt, .gh.tone-ink .jcard__meta { color: #A9ACB2; }
.gh.tone-ink .jcard__meta span { color: var(--gh-card); }

@media (max-width: 1024px) {
	.gh .jgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.gh .jgrid--list { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
	.gh .jgrid { grid-template-columns: 1fr; }
	.gh .jgrid--list .jcard { grid-template-columns: 1fr; gap: 16px; }
	.gh .jcard__title { font-size: 22px; }
	.gh.journal .journal__more, .gh.journal .journal__more .btn { width: 100%; }
}