/* BR Times — Home (hero, secondary, section grids, rail) (portado 1:1 do bundle BR Times Design System) */

/* ── Hero / Secondary sections ────────────────────── */
.brt-hero, .brt-secondary { display:grid; grid-template-columns: 715fr 445fr; gap: 32px; margin: 64px auto 0; align-items: stretch; }
.brt-hero__main, .brt-secondary__main { display: flex; flex-direction: column; }
.brt-hero__main .brt-card, .brt-secondary__main .brt-card { flex: 1; display: flex; flex-direction: column; }
.brt-hero__main .brt-card__body, .brt-secondary__main .brt-card__body { flex: 1; }
/* The hero card uses margin-top:auto to push date to the bottom — the chip row
 * sits right above it, so we don't need extra spacing tweaks. */
.brt-hero__main .brt-card__tags,
.brt-secondary__main .brt-card__tags { margin-top: auto; padding-top: 8px; }
.brt-hero__main .brt-meta,
.brt-secondary__main .brt-meta { margin-top: 8px; padding-top: 0; }
.brt-hero__side, .brt-secondary__side { display:flex; flex-direction:column; gap: 16px; justify-content: space-between; }
.brt-secondary__side { gap: 0; }

/* Hero main: larger title so content height matches side column (2 feature + ad) */
.brt-hero__main .brt-card__title--xl { font-size: 40px; line-height: 48px; letter-spacing: -0.015em; }
.brt-hero__main .brt-dek { font-size: 16px; line-height: 24px; }

/* Secondary main: slightly larger title */
.brt-secondary__main .brt-card__title--xl { font-size: 28px; line-height: 36px; }

/* ── Section grids ────────────────────────────────── */
.brt-section { margin: 64px auto; }
.brt-section__grid { display:grid; grid-template-columns: 860fr 300fr; gap: 32px; align-items: start; }
.brt-grid-2 { display:grid; grid-template-columns: 1fr 1fr; gap: 48px 32px; }
.brt-grid-3 { display:grid; grid-template-columns: 1fr 1fr 1fr; gap: 0; }
.brt-grid-3 .brt-card--text { padding: 20px 24px; border-top: 0; border-left: 1px solid var(--border); transition: background-color .25s ease; border-radius: 6px; }
.brt-grid-3 .brt-card--text:hover { background-color: var(--surface); }
.brt-grid-3 .brt-card--text:nth-child(3n+1) { border-left: 0; }
.brt-grid-3 .brt-card--text:nth-child(n+4) { border-top: 1px solid var(--border); }

.brt-rail { display:flex; flex-direction:column; gap: 24px; align-self: stretch; }
.brt-rail__stack { display:flex; flex-direction:column; flex: 1; }
.brt-rail__stack .brt-card--text { flex: 1; justify-content: center; }