/* ─── AL Blog — one feature + two small (sketch 006 · C) ─── */
.al-blog__grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 24px; }
.al-post { display: flex; flex-direction: column; text-decoration: none; border-radius: var(--r-xl); overflow: hidden; background: #fff; box-shadow: 0 1px 2px rgba(23,23,26,.05), 0 12px 34px rgba(23,23,26,.09); transition: transform .25s ease, box-shadow .25s ease; }
.al-post:hover { transform: translateY(-6px); box-shadow: 0 2px 4px rgba(23,23,26,.06), 0 26px 56px rgba(23,23,26,.15); }
.al-post__media { aspect-ratio: 16/9; overflow: hidden; }
.al-post__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s cubic-bezier(.22,1,.36,1); }
.al-post:hover .al-post__media img { transform: scale(1.05); }
.al-post__body { padding: 26px 28px 28px; display: flex; flex-direction: column; flex: 1; }
.al-post__cat { font-family: var(--font-display); font-size: 11.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--red); margin-bottom: 10px; }
.al-post h3 { font-size: 25px; line-height: 1.28; margin: 0 0 14px; }
.al-post__more { margin-top: auto; display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-display); font-weight: 700; font-size: 14.5px; color: var(--ink); }
.al-post__more svg { width: 15px; height: 15px; stroke: var(--red); transition: transform .22s ease; }
.al-post:hover .al-post__more svg { transform: translateX(5px); }

/* Equal rows so the side column fills the feature card's full height instead of leaving a gap
   under the last item. The images stretch with the row, so more posts do not mean shorter cards. */
.al-blog__side { display: grid; gap: 16px; grid-auto-rows: 1fr; }
.al-spost { display: grid; grid-template-columns: 112px 1fr; gap: 16px; align-items: center; text-decoration: none; background: #fff; border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--shadow-1); transition: transform .22s ease, box-shadow .22s ease; }
.al-spost:hover { transform: translateY(-4px); box-shadow: 0 2px 4px rgba(23,23,26,.06), 0 20px 44px rgba(23,23,26,.13); }
.al-spost img { width: 112px; height: 100%; min-height: 104px; object-fit: cover; }
.al-spost h3 { font-size: 16px; line-height: 1.3; margin: 0; padding-right: 16px; }
.al-spost .al-post__cat { margin: 0 0 5px; }
@media (max-width: 1000px) {
	.al-blog__grid { grid-template-columns: 1fr; }
	/* Stacked, there is no feature height to match — let each card size to its own content. */
	.al-blog__side { grid-auto-rows: auto; }
}