/* ============================================================
   PHASE 3 — Homepage editorial design (index.html only; body.home-editorial)
   Regional-newspaper look: masthead, thin rules, article-first hierarchy,
   restrained color (red reserved for true alerts). Data pipeline unchanged.
   ============================================================ */

/* --- Masthead + shell tweaks scoped to homepage --- */
.home-editorial .site-header {
  padding: 20px 0 12px;
}
.home-editorial .brand-name {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 2.1rem;
  letter-spacing: -0.01em;
}
.home-editorial .site-nav .nav-inner {
  border-top: 1px solid var(--surface-border, #e2ded4);
  border-bottom: 1px solid var(--surface-border, #e2ded4);
}
.home-editorial .site-nav .nav-link {
  letter-spacing: 0.01em;
}
/* Hide the JS-hydrated ticker on the editorial home; real alerts use .alert-strip */
.home-editorial .ticker-bar { display: none; }

/* --- Genuine alert strip (red ONLY for real alerts) --- */
.alert-strip {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--red, #b91c1c);
  color: #fff;
  padding: 10px 16px;
  border-radius: 3px;
  margin: 0 0 24px;
  font-size: 0.95rem;
  line-height: 1.35;
}
.alert-dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: #fff; flex: 0 0 auto;
  animation: rrd-pulse 1.4s ease-in-out infinite;
}
@keyframes rrd-pulse { 0%,100% { opacity: 1; } 50% { opacity: .35; } }
.alert-label {
  font-weight: 800; text-transform: uppercase; letter-spacing: .08em;
  font-size: .78rem; flex: 0 0 auto;
}
.alert-text { font-weight: 600; }

/* --- Lead package: 2/3 lead + 1/3 secondary rail --- */
.lead-package {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 28px 32px;
  margin: 0 0 28px;
}
.lead-story { min-width: 0; }
.lead-media {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: linear-gradient(135deg,#16314b,#1f4462 40%,#4b1d1d);
  border-radius: 2px;
  margin: 0 0 14px;
}
.lead-media .media-img {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.lead-copy .ed-kicker { color: var(--ink-mid, #374151); }
.ed-headline {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(1.7rem, 3.2vw, 2.55rem);
  line-height: 1.12;
  margin: 6px 0 10px;
  letter-spacing: -0.01em;
}
.ed-headline a { color: var(--ink, #0f1419); text-decoration: none; }
.ed-headline a:hover { text-decoration: underline; text-underline-offset: 3px; }
.ed-dek {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.06rem;
  line-height: 1.45;
  color: var(--ink-mid, #374151);
  margin: 0 0 10px;
  max-width: 68ch;
}
.lead-copy .meta { font-size: .82rem; color: var(--ink-soft, #6b7280); }

/* --- Secondary rail --- */
.secondary-rail {
  border-top: 2px solid var(--ink, #0f1419);
  padding-top: 4px;
  min-width: 0;
}
.rail-item {
  padding: 14px 0;
  border-bottom: 1px solid var(--surface-border, #e2ded4);
}
.rail-item:first-child { padding-top: 8px; }
.rail-title {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.08rem;
  line-height: 1.25;
  margin: 4px 0 6px;
}
.rail-title a { color: var(--ink, #0f1419); text-decoration: none; }
.rail-title a:hover { text-decoration: underline; }
.ed-kicker {
  font-size: .72rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .07em;
  color: var(--ink-soft, #6b7280);
}
.ed-time { font-size: .8rem; }

/* --- Weather utility strip --- */
.weather-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
  border: 1px solid var(--surface-border, #e2ded4);
  background: var(--surface-alt, #f6f4ef);
  padding: 12px 16px;
  margin: 0 0 30px;
  border-radius: 2px;
}
.weather-strip .weather-snapshot { flex: 1 1 auto; min-width: 260px; }
.ws-main { display: flex; align-items: baseline; gap: 10px; }
.ws-temp { font-family: Georgia, serif; font-size: 1.7rem; font-weight: 700; }
.ws-cond { font-size: 1rem; color: var(--ink-mid, #374151); }

/* --- Section modules (thin-rule editorial) --- */
.ed-sections { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px 32px; margin: 0 0 34px; }
.ed-section { min-width: 0; }
.ed-head {
  display: flex; align-items: baseline; justify-content: space-between;
  border-bottom: 2px solid var(--ink, #0f1419);
  padding: 0 0 6px; margin: 0 0 10px;
}
.ed-section-title {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.28rem;
  line-height: 1.1;
  margin: 0;
}
.ed-section .see-all { font-size: .8rem; color: var(--ink-mid, #374151); }
.ed-rows > .ed-row {
  padding: 10px 0;
  border-bottom: 1px solid var(--surface-border, #e6e2d8);
}
.ed-row:first-child { padding-top: 2px; }
.ed-row-title {
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1rem;
  line-height: 1.28;
  margin: 3px 0 5px;
}
.ed-row-title a { color: var(--ink, #0f1419); text-decoration: none; }
.ed-row-title a:hover { text-decoration: underline; }
.ed-rows .meta { font-size: .78rem; color: var(--ink-soft, #6b7280); }

/* --- Latest stream (chronological, numbered) --- */
.latest-stream { margin: 0 0 34px; }
.latest-rows > .latest-row {
  display: flex; gap: 16px; align-items: baseline;
  padding: 12px 0;
  border-bottom: 1px solid var(--surface-border, #e6e2d8);
}
.latest-num {
  font-family: Georgia, serif;
  color: var(--red, #b91c1c);
  font-size: .9rem; font-weight: 700;
  min-width: 26px;
}
.latest-row h3 { font-family: Georgia, serif; font-size: 1.12rem; line-height: 1.25; margin: 0 0 3px; }
.latest-row h3 a { color: var(--ink, #0f1419); text-decoration: none; }
.latest-row h3 a:hover { text-decoration: underline; }

/* --- Events mini-module --- */
.ed-event { padding: 10px 0; border-bottom: 1px solid var(--surface-border, #e6e2d8); }
.ed-event h4 { font-family: Georgia, serif; font-size: 1rem; margin: 3px 0 4px; }

/* --- Newsletter CTA band --- */
.newsletter-band {
  display: flex; align-items: center; justify-content: space-between;
  gap: 18px; flex-wrap: wrap;
  border: 1px solid var(--surface-border, #e2ded4);
  border-left: 4px solid var(--ink, #0f1419);
  padding: 18px 22px;
  margin: 0 0 8px;
  background: var(--surface-alt, #faf8f4);
}
.newsletter-band h2 { font-family: Georgia, serif; font-size: 1.4rem; margin: 0 0 4px; }
.newsletter-band p { margin: 0; color: var(--ink-mid, #374151); max-width: 62ch; }

/* --- Editorial card/button fine-tuning --- */
.home-editorial .data-note {
  border: 1px dashed var(--surface-border, #d8d3c6);
  padding: 12px;
  color: var(--ink-soft, #6b7280);
}

/* ============================================================
   RESPONSIVE — tablet + mobile (no horizontal overflow; single column)
   ============================================================ */
/* Page-level overflow guard + border-box for the editorial home */
.home-editorial, .home-editorial * { box-sizing: border-box; }
.home-editorial { overflow-x: hidden; }
.ed-sections, .lead-package, .ed-rows, .latest-rows { min-width: 0; }
.ed-sections > .ed-section, .lead-package > * { min-width: 0; }
.ed-headline, .ed-dek, .rail-title, .ed-row-title, .latest-row h3, .alert-text, .ed-event h4, .ed-event p { overflow-wrap: anywhere; }
.alert-strip { flex-wrap: wrap; }

@media (max-width: 1024px) {
  .lead-package { grid-template-columns: 1fr; gap: 20px; }
  .secondary-rail { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 20px; border-top: 0; padding-top: 0; }
  .secondary-rail .rail-item { border-top: 2px solid var(--ink,#0f1419); border-bottom: 0; }
  .ed-sections { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-editorial .header-actions { gap: 8px; }
}
@media (max-width: 760px) {
  .home-editorial .header-inner { flex-wrap: wrap; gap: 10px 16px; }
  .home-editorial .brand { flex: 1 1 auto; min-width: 0; }
  .home-editorial .brand-name { font-size: 1.5rem; }
  .home-editorial .brand-tag { white-space: normal; }
  .home-editorial .header-actions { margin-left: auto; }
  .lead-package { gap: 16px; }
  .ed-sections { grid-template-columns: minmax(0, 1fr); }
  .secondary-rail { display: block; }
  .secondary-rail .rail-item { border-top: 1px solid var(--surface-border, #e2ded4); border-bottom: 0; }
  .weather-strip, .newsletter-band { padding: 14px 16px; }
}
@media (max-width: 480px) {
  .weather-strip, .newsletter-band { padding: 12px; }
  .ws-temp { font-size: 1.4rem; }
  .ed-headline { font-size: 1.55rem; }
  .latest-row { gap: 10px; }
  .latest-num { min-width: 20px; }
}
/* Ensure the shared nav never causes page-level horizontal overflow; hide its scrollbar so it reads clean on mobile */
.site-nav .nav-inner { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.site-nav .nav-inner::-webkit-scrollbar { display: none; }
