/* Seaside News templates: header, footer, story cards, article and archive pages. */
.snx-header, .snx-footer, .snx-article, .snx-archive, .snx-grid { --snx-sans: "Archivo", Arial, sans-serif; --snx-serif: "Gelasio", Georgia, serif; --snx-mono: "IBM Plex Mono", monospace; --snx-red: var(--sn-red, #c92d38); --snx-navy: var(--sn-navy, #071a2b); }
.snx-eyebrow { font: 10px/1.5 var(--snx-mono); letter-spacing: 1.4px; text-transform: uppercase; margin: 0; }

/* Header */
.snx-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 28px 18px; background: #fff; color: var(--sn-text, #152737); border-top: 4px solid var(--snx-red); border-bottom: 1px solid var(--sn-line-light, #d8dce0); font: 10px/1.5 var(--snx-mono); letter-spacing: 1px; }
.snx-header a { color: inherit; text-decoration: none; }
.snx-header__logo { font: 900 23px/1 var(--snx-sans); letter-spacing: -2px; }
.snx-header__logo span { color: var(--snx-red); padding-left: 6px; }
.snx-header__link:hover { color: var(--snx-red); }

/* Footer */
.snx-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 32px 28px; background: #fff; color: var(--sn-text, #152737); border-top: 1px solid var(--sn-line-light, #d8dce0); }
.snx-footer__brand { font: 900 26px/1.1 var(--snx-sans); letter-spacing: -1px; color: inherit; text-decoration: none; }
.snx-footer__brand span { color: var(--snx-red); }
.snx-footer__meta { font: 9px var(--snx-mono); letter-spacing: .5px; color: var(--sn-muted, #8499ae); }

/* Story grid and cards */
.snx-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.snx-grid--three .snx-card--lead { grid-column: auto; grid-row: auto; }
.snx-card { min-width: 0; }
.snx-card--lead { grid-column: span 2; grid-row: span 2; }
.snx-card__link { display: flex; flex-direction: column; color: inherit; text-decoration: none; }
.snx-card__art { position: relative; height: 210px; overflow: hidden; background: #123c53; }
.snx-card--lead .snx-card__art { height: 410px; }
.snx-card__img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.snx-card__link:hover .snx-card__img { transform: scale(1.04); }
.snx-card__badge { position: absolute; right: 12px; bottom: 12px; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; font: 22px/1 var(--snx-sans); background: var(--sn-badge-bg, #c12b36); color: var(--sn-badge-fg, #fff); }
.snx-card__caption { font: 9px/1.6 var(--snx-mono); letter-spacing: .7px; color: #647683; margin: 9px 0 0; }
.snx-card__eyebrow { font: 10px/1.5 var(--snx-mono); letter-spacing: 1.4px; text-transform: uppercase; color: var(--sn-card-eyebrow, #ad2530); margin: 18px 0 0; }
.snx-card__title { font: 700 23px/1.1 var(--snx-sans); letter-spacing: -.7px; margin: 9px 0 10px; color: var(--sn-card-title, #152737); }
.snx-card--lead .snx-card__title { font-size: 40px; letter-spacing: -1.6px; max-width: 620px; }
.snx-card__excerpt { font: 15px/1.6 var(--snx-serif); max-width: 560px; margin: 0 0 14px; color: var(--sn-card-text, #526371); }
.snx-card__meta { font: 10px var(--snx-mono); letter-spacing: .5px; text-transform: uppercase; color: var(--sn-card-meta, #657580); margin: 0; }
.snx-empty { font: 15px/1.6 var(--snx-serif); color: #526371; }

/* Article and archive hero */
.snx-hero { padding: 34px max(28px, calc((100vw - 1250px) / 2)) 58px; background: var(--snx-navy); color: #eff5fa; border-bottom: 3px solid var(--snx-red); }
.snx-hero__brand { display: inline-block; font: 900 24px/1 var(--snx-sans); letter-spacing: -1px; margin: 0 0 48px; color: inherit; text-decoration: none; }
.snx-hero__kicker { color: #f17882; margin: 0 0 20px; }
.snx-hero__title { font: 800 clamp(38px, 5.3vw, 76px)/1.05 var(--snx-sans); letter-spacing: -2.5px; max-width: 1050px; margin: 0 0 24px; color: inherit; }
.snx-hero__deck { font: 22px/1.6 var(--snx-serif); max-width: 850px; margin: 0; color: #afc2d0; }
.snx-hero__byline { font: 10px/1.7 var(--snx-mono); letter-spacing: 1px; text-transform: uppercase; margin: 30px 0 0; color: #bac7d2; }

/* Article layout */
.snx-layout { display: grid; grid-template-columns: 220px minmax(0, 830px); gap: 65px; max-width: 1250px; margin: 50px auto 70px; padding: 0 28px; }
.snx-sidebar { align-self: start; position: sticky; top: 30px; padding-top: 20px; border-top: 2px solid var(--snx-red); color: #546776; }
.snx-sidebar__eyebrow { color: #b92531; }
.snx-sidebar__nav { margin-top: 15px; }
.snx-sidebar__nav a { display: block; font: 14px/1.5 var(--snx-sans); margin-bottom: 16px; color: inherit; text-decoration: none; }
.snx-sidebar__nav a:hover { color: #b92531; }
.snx-sidebar__note { font: 14px/1.6 var(--snx-serif); margin: 15px 0 0; }
.snx-sidebar__return { display: block; border-top: 1px solid #d4dde3; padding-top: 20px; margin-top: 30px; font: 10px/1.6 var(--snx-mono); color: inherit; text-decoration: none; }
.snx-main { min-width: 0; }
.snx-figure { margin: 0 0 35px; }
.snx-figure__img { display: block; width: 100%; height: auto; }
.snx-figure__caption { font: 10px/1.6 var(--snx-mono); color: #647683; margin-top: 8px; }
.snx-prose { color: #324856; }
.snx-prose p { font: 20px/1.85 var(--snx-serif); color: #324856; margin: 0 0 25px; }
.snx-prose h2 { font: 700 29px/1.2 var(--snx-sans); letter-spacing: -.7px; color: #10283a; margin: 40px 0 16px; scroll-margin-top: 30px; }
.snx-prose h3 { font: 700 23px/1.2 var(--snx-sans); color: #10283a; margin: 30px 0 12px; }
.snx-prose a { color: #a82431; text-decoration: underline; }
.snx-prose ul, .snx-prose ol { font: 17px/1.7 var(--snx-serif); color: #324856; margin: 0 0 25px; padding-left: 22px; }
.snx-prose li { margin: 6px 0; }
.snx-prose p.has-small-font-size { font: 12px/1.7 var(--snx-sans); color: #627788; }
.snx-prose img { max-width: 100%; height: auto; }

/* Related and listings */
.snx-related { padding: 48px max(28px, calc((100vw - 1194px) / 2)) 65px; background: #f2f4f5; border-top: 1px solid #d8e0e5; }
.snx-related__eyebrow { color: #b92531; }
.snx-related__title { font: 800 36px/1.1 var(--snx-sans); letter-spacing: -1px; margin: 16px 0 28px; color: #152737; }
.snx-grid--three { gap: 25px; }
.snx-listing { padding: 50px 28px 60px; background: #fff; }
.snx-pager { display: flex; flex-wrap: wrap; gap: 12px; padding-top: 30px; font: 11px var(--snx-mono); letter-spacing: 1px; }
.snx-pager a, .snx-pager span { padding: 10px 14px; border: 1px solid #cdd3d8; border-radius: 2px; color: #a9232e; text-decoration: none; }
.snx-pager .current { background: #b82430; border-color: #b82430; color: #fff; }

@media (max-width: 1024px) {
	.snx-layout { grid-template-columns: 1fr; gap: 25px; }
	.snx-sidebar { position: static; }
	.snx-sidebar__nav { display: flex; flex-wrap: wrap; gap: 0 20px; }
	.snx-sidebar__return { display: none; }
	.snx-hero { padding: 25px 25px 40px; }
	.snx-hero__brand { margin-bottom: 30px; }
}
@media (max-width: 767px) {
	.snx-header { padding: 12px 16px 14px; gap: 10px; }
	.snx-header__tagline, .snx-footer__tagline { display: none; }
	.snx-footer { flex-wrap: wrap; padding: 25px 16px; }
	.snx-grid { grid-template-columns: 1fr 1fr; gap: 20px; }
	.snx-card--lead { grid-row: auto; }
	.snx-card__art { height: 160px; }
	.snx-card--lead .snx-card__art { height: 270px; }
	.snx-card__title { font-size: 20px; }
	.snx-card--lead .snx-card__title { font-size: 30px; }
	.snx-card__excerpt { font-size: 14px; }
	.snx-grid--three { grid-template-columns: 1fr; }
	.snx-hero { padding: 25px 18px 35px; }
	.snx-hero__title { letter-spacing: -1.5px; }
	.snx-hero__deck { font-size: 19px; }
	.snx-layout { margin: 30px auto 45px; padding: 0 18px; }
	.snx-prose p { font-size: 18px; }
	.snx-prose h2 { font-size: 25px; }
	.snx-related, .snx-listing { padding: 35px 16px; }
}
