/* Structural fixes only — NO color overrides.
   Original HTML design colors preserved.
   Boss order 2026-10-16: restore original, don't redesign. */

/* Header layout */
.site-header-inner { display: flex !important; align-items: center !important; gap: 16px !important; max-width: 1400px !important; margin: 0 auto !important; padding: 12px 20px !important; }

/* Tabs — pills not squares */
.grade-tab { border-radius: 999px !important; padding: 10px 26px !important; cursor: pointer !important; }
.grade-tabs { display: flex !important; gap: 10px !important; flex-wrap: wrap !important; margin: 20px 0 !important; }

/* Tab panels */
/* tab-panel display handled by hidden attribute */
/* tab-panel active handled by JS */

/* Mobile nav */
@media (max-width: 768px) {
  .site-nav { display: none !important; }
  .hamburger, .mobile-menu-btn, .menu-toggle { display: block !important; }
}
/* Force update 202610162233 */

/* ARTICLE LIGHT-MODE FIXES (Boss 2026-10-16) — dark text on light backgrounds */
.article-hero-title, .wire-title, h1.article-title { color: #0C111D !important; }
.article-dek, .wire-dek { color: #4A5163 !important; }
.summary-box, .tldr-box { background: #FFFFFF !important; border: 1px solid #E6E9F2 !important; }
.summary-box p, .summary-box li, .tldr-box p, .tldr-box li { color: #0C111D !important; }
.lens-tab { color: #0C111D !important; }
.lens-content { color: #4A5163 !important; }
.consensus-box { background: #FFFFFF !important; }
.consensus-box p { color: #0C111D !important; }

/* Lens tabs — prevent cutoff */
.lens-tabs { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; overflow-x: auto !important; }
.lens-tab { white-space: nowrap !important; flex-shrink: 0 !important; }

/* ===== Canonical footer (redesign 2026-10-21) =====
   One footer on every page: brand + Publication / Editorial standards /
   Business & advertising / Legal & privacy / Languages, follow row inside
   the brand column. Neutralizes the legacy 4-col grid on .footer-inner so
   the grid lives on the wrapper itself, identical on both page generations. */
.site-footer .footer-inner { display: grid; grid-template-columns: 1fr; gap: var(--sp-8); }
@media (min-width: 768px) { .site-footer .footer-inner { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1200px) { .site-footer .footer-inner { grid-template-columns: 1.7fr repeat(5, 1fr); } }
.site-footer .footer-col-title { font-family: var(--font-sans); font-size: var(--text-xs); font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-tertiary); margin: 0 0 var(--sp-3); }
.site-footer .footer-brand p { color: var(--text-secondary); font-size: var(--text-sm); margin-top: var(--sp-3); max-width: 32ch; }
.site-footer .footer-slogan { color: var(--text-primary); font-weight: 600; }
.site-footer .footer-brand .footer-col-title { margin-top: var(--sp-6); }
.site-footer .footer-brand .footer-col-title:first-child { margin-top: 0; }
.site-footer .copyright { text-align: center; color: var(--text-tertiary); font-size: var(--text-xs); letter-spacing: 0.04em; border-top: 1px solid var(--border); margin: var(--sp-8) auto 0; padding: var(--sp-6) var(--sp-4) var(--sp-8); max-width: var(--measure-wide); }
