/* ============================================
   BAHRAIN INTELLIGENCE — TERMINAL DARK DESIGN SYSTEM
   A Vanderbilt Terminal Property · Independent Intelligence
   ============================================ */

/* RESET */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  /* TERMINAL DARK BASE */
  --bg-primary: #080b0f;
  --bg-secondary: #0d1117;
  --bg-card: #111820;
  --bg-hover: #1a2332;
  --bg-panel: #161b22;

  /* SCAFFOLD COMPATIBILITY (salmon → dark) */
  --salmon: #080b0f;
  --salmon-dark: #0d1117;
  --salmon-deep: #161b22;
  --salmon-border: #21262d;
  --salmon-hover: #1a2332;

  /* TYPOGRAPHY */
  --font-display: 'DM Serif Display', Georgia, serif;
  --font-body: 'IBM Plex Sans', 'Helvetica Neue', sans-serif;
  --font-ui: 'IBM Plex Mono', 'Consolas', monospace;
  --font-mono: 'IBM Plex Mono', 'Consolas', monospace;

  /* NEUTRALS (inverted for dark) */
  --ink: #e6edf3;
  --ink-80: #c9d1d9;
  --ink-60: #8b949e;
  --ink-40: #6e7681;
  --ink-25: #484f58;
  --ink-15: #30363d;
  --white: #ffffff;

  /* PRIMARY ACCENT — terminal green */
  --accent: #00ff41;
  --accent-dark: #00cc33;
  --accent-mid: #33ff66;
  --accent-light: #66ff88;
  --accent-pale: rgba(0, 255, 65, 0.08);

  /* SECONDARY ACCENT — amber */
  --accent2: #ffb000;
  --accent2-dark: #cc8c00;
  --accent2-light: #ffc233;

  /* SECTION ACCENTS */
  --section-military: #ff3333;
  --section-geopolitics: #58a6ff;
  --section-iran-watch: #ffb000;
  --section-strait-of-hormuz: #00d4ff;
  --section-us-bahrain: #3fb950;
  --section-economy: #d2a8ff;
  --section-internal-affairs: #f78166;
  --section-analysis: #79c0ff;
  --section-intelligence-briefs: #ff3333;
  --section-data: #8b949e;

  /* THREAT LEVELS */
  --threat-critical: #ff0000;
  --threat-high: #ff4500;
  --threat-elevated: #ffb000;
  --threat-low: #2ecc71;

  /* SEMANTIC */
  --positive: #3fb950;
  --negative: #f85149;
  --warning: #d29922;
}

html {
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body {
  background: var(--bg-primary);
  color: var(--ink);
  font-family: var(--font-body);
  line-height: 1.6;
}
a { color: var(--ink-80); text-decoration: none; transition: color 0.15s; }
a:hover { color: var(--accent); }
img { max-width: 100%; display: block; }
ul, ol { list-style: none; }

/* ============================================
   LAYOUT
   ============================================ */
.container { max-width: 1280px; margin: 0 auto; padding: 0 24px; }
.container-narrow { max-width: 740px; margin: 0 auto; padding: 0 24px; }
.container-article { max-width: 680px; margin: 0 auto; padding: 0 24px; }

/* ============================================
   SHARED COMPONENTS
   ============================================ */

/* Section Tags */
.section-tag {
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--accent);
}
.section-tag--military { color: var(--section-military); }
.section-tag--geopolitics { color: var(--section-geopolitics); }
.section-tag--iran-watch { color: var(--section-iran-watch); }
.section-tag--strait-of-hormuz { color: var(--section-strait-of-hormuz); }
.section-tag--us-bahrain { color: var(--section-us-bahrain); }
.section-tag--economy { color: var(--section-economy); }
.section-tag--internal-affairs { color: var(--section-internal-affairs); }
.section-tag--analysis { color: var(--section-analysis); }
.section-tag--intelligence-briefs { color: var(--section-intelligence-briefs); }
.section-tag--data { color: var(--section-data); }

/* Badges */
.badge {
  font-family: var(--font-ui);
  font-size: 9px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 2px 7px;
  border-radius: 2px;
  display: inline-block;
  line-height: 1.4;
}
.badge--l1 { background: var(--ink-40); color: var(--white); }
.badge--l2 { background: var(--accent); color: var(--bg-primary); }
.badge--premium { background: var(--accent2); color: var(--bg-primary); }

/* Threat Badges */
.threat-badge {
  font-family: var(--font-ui);
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 2px 8px;
  border-radius: 2px;
  display: inline-block;
}
.threat-badge--critical { background: var(--threat-critical); color: var(--white); animation: pulse-red 2s infinite; }
.threat-badge--high { background: var(--threat-high); color: var(--white); }
.threat-badge--elevated { background: var(--threat-elevated); color: var(--bg-primary); }
.threat-badge--low { background: var(--threat-low); color: var(--bg-primary); }

@keyframes pulse-red {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.7; }
}

/* Hormuz Badges */
.hormuz-badge {
  font-family: var(--font-ui);
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 2px 8px;
  border-radius: 2px;
  display: inline-block;
}
.hormuz-badge--restricted { background: var(--threat-critical); color: var(--white); }
.hormuz-badge--degraded { background: var(--threat-high); color: var(--white); }
.hormuz-badge--open { background: var(--threat-low); color: var(--bg-primary); }
.hormuz-badge--active { background: var(--threat-elevated); color: var(--bg-primary); }
.hormuz-value--alert { color: var(--threat-critical); font-family: var(--font-ui); font-size: 12px; font-weight: 700; }

/* Thin Rule */
.rule { border: none; border-top: 1px solid var(--ink-15); margin: 32px 0; }

/* Trends */
.trend { font-family: var(--font-ui); font-size: 12px; font-weight: 600; }
.trend--up { color: var(--positive); }
.trend--down { color: var(--negative); }

/* Updated Tag */
.updated-tag {
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 600;
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Timestamp */
.timestamp {
  font-family: var(--font-ui);
  font-size: 11px;
  color: var(--ink-40);
}

/* Pull Quote */
.pull-quote {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.4rem;
  line-height: 1.45;
  color: var(--ink-80);
  border-left: 3px solid var(--accent);
  padding: 16px 0 16px 24px;
  margin: 32px 0;
}

/* Data Callout */
.data-callout {
  border-left: 3px solid var(--accent);
  padding: 16px 20px;
  margin: 24px 0;
  background: var(--bg-card);
}
.data-callout__number {
  font-family: var(--font-display);
  font-size: 2rem;
  font-weight: 700;
  color: var(--accent);
  line-height: 1.1;
}
.data-callout__label {
  font-family: var(--font-ui);
  font-size: 12px;
  color: var(--ink-60);
  margin-top: 4px;
}

/* Buttons */
.btn {
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 600;
  padding: 8px 20px;
  border: none;
  border-radius: 2px;
  cursor: pointer;
  display: inline-block;
  text-align: center;
  transition: background 0.2s;
  text-decoration: none;
}
.btn--primary { background: var(--accent); color: var(--bg-primary); }
.btn--primary:hover { background: var(--accent-dark); color: var(--bg-primary); }
.btn--secondary { background: transparent; color: var(--accent); border: 1px solid var(--accent); }
.btn--secondary:hover { background: var(--accent); color: var(--bg-primary); }
.btn--accent2 { background: var(--accent2); color: var(--bg-primary); }
.btn--accent2:hover { background: var(--accent2-dark); color: var(--bg-primary); }
.btn--dark { background: var(--ink-15); color: var(--ink); }
.btn--dark:hover { background: var(--ink-25); }

/* Section Header */
.section-header {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--ink);
  padding-bottom: 12px;
  border-bottom: 1px solid var(--ink-15);
  margin-bottom: 20px;
  margin-top: 36px;
}
.section-header:first-child { margin-top: 0; }

/* Section Label */
.section-label {
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ink-40);
  text-align: center;
  margin-bottom: 24px;
}

/* Skip Link */
.skip-link {
  position: absolute;
  left: -9999px;
  z-index: 999;
  padding: 8px 16px;
  background: var(--accent);
  color: var(--bg-primary);
  font-family: var(--font-ui);
}
.skip-link:focus { left: 8px; top: 8px; }

/* ============================================
   BREAKING NEWS TICKER
   ============================================ */
.breaking-ticker {
  background: #1a0000;
  border-bottom: 1px solid rgba(255, 0, 0, 0.3);
  padding: 6px 0;
  overflow: hidden;
  display: flex;
  align-items: center;
}
.breaking-ticker__badge {
  background: var(--threat-critical);
  color: var(--white);
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  padding: 3px 12px;
  margin-left: 16px;
  white-space: nowrap;
  animation: pulse-red 1.5s infinite;
  flex-shrink: 0;
}
.breaking-ticker__track {
  display: flex;
  gap: 24px;
  animation: ticker-scroll 60s linear infinite;
  width: max-content;
  margin-left: 16px;
}
.breaking-ticker__item {
  font-family: var(--font-ui);
  font-size: 12px;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.breaking-ticker__category {
  color: var(--threat-critical);
  font-weight: 700;
  font-size: 10px;
  letter-spacing: 0.05em;
}
.breaking-ticker__headline { color: var(--ink-80); }
.breaking-ticker__time { color: var(--ink-40); font-size: 10px; }
.breaking-ticker__sep { color: var(--ink-25); }

.breaking-ticker:hover .breaking-ticker__track {
  animation-play-state: paused;
}

/* ============================================
   MASTHEAD
   ============================================ */
.masthead {
  background: var(--bg-secondary);
  border-bottom: 1px solid var(--ink-15);
  padding: 9px 0;
  font-family: var(--font-ui);
  font-size: 11px;
}
.masthead .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.masthead__left {
  color: var(--ink-40);
  font-weight: 400;
  letter-spacing: 0.02em;
}
.masthead__right {
  display: flex;
  gap: 18px;
  align-items: center;
}
.masthead__right a {
  color: var(--ink-40);
  font-size: 11px;
}
.masthead__right a:hover { color: var(--ink); }

/* ============================================
   BRAND AREA
   ============================================ */
.brand {
  text-align: center;
  padding: 30px 0 22px;
  background: var(--bg-primary);
  border-bottom: 1px solid var(--ink-15);
}
.brand__name {
  font-family: var(--font-display);
  font-size: 3rem;
  font-weight: 400;
  color: var(--ink);
  letter-spacing: 0.02em;
  line-height: 1.1;
}
.brand__tagline {
  font-family: var(--font-body);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--accent);
  margin-top: 6px;
}
.brand__subtitle {
  font-family: var(--font-ui);
  font-size: 9.5px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--ink-40);
  margin-top: 8px;
}

/* ============================================
   NAVIGATION
   ============================================ */
.nav {
  background: var(--bg-secondary);
  border-top: 1px solid var(--ink-15);
  border-bottom: 1px solid var(--ink-15);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.nav::-webkit-scrollbar { display: none; }
.nav__list {
  display: flex;
  justify-content: center;
  min-width: max-content;
}
.nav__item {
  font-family: var(--font-ui);
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: 0.03em;
  padding: 12px 14px;
  color: var(--ink-60);
  white-space: nowrap;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: color 0.15s;
}
.nav__item:hover { color: var(--ink); }
.nav__item--active { color: var(--accent); font-weight: 600; }
.nav__item--active::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 14px;
  right: 14px;
  height: 2px;
  background: var(--accent);
}
.nav__badge {
  font-size: 8px;
  background: var(--accent);
  color: var(--bg-primary);
  padding: 1px 4px;
  border-radius: 2px;
  font-weight: 700;
}

/* ============================================
   KPI TICKER
   ============================================ */
.ticker {
  background: var(--bg-card);
  border-bottom: 1px solid var(--ink-15);
  padding: 10px 0;
  overflow: hidden;
}
.ticker__track {
  display: flex;
  gap: 32px;
  animation: ticker-scroll 45s linear infinite;
  width: max-content;
}
.ticker__item {
  font-family: var(--font-ui);
  font-size: 12px;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.ticker__label { color: var(--ink-40); }
.ticker__value {
  color: var(--ink);
  font-weight: 600;
  font-size: 13px;
}
.ticker__change--up { color: var(--positive); font-weight: 500; }
.ticker__change--down { color: var(--negative); font-weight: 500; }
.ticker__sep { color: var(--ink-25); margin: 0 4px; }

@keyframes ticker-scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ============================================
   FOOTER
   ============================================ */
.footer {
  background: var(--bg-secondary);
  color: var(--ink-60);
  padding: 48px 0 0;
  margin-top: 48px;
  border-top: 1px solid var(--ink-15);
}
.footer__grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 32px;
  padding-bottom: 40px;
  border-bottom: 1px solid var(--ink-15);
}
.footer__col-title {
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--accent);
  margin-bottom: 16px;
}
.footer__link {
  display: block;
  font-family: var(--font-ui);
  font-size: 12.5px;
  color: var(--ink-40);
  padding: 4px 0;
  transition: color 0.15s;
}
.footer__link:hover { color: var(--ink); }
.footer__bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 0;
  font-family: var(--font-ui);
  font-size: 11px;
  color: var(--ink-40);
}
.footer__disclaimer {
  max-width: 500px;
  text-align: right;
  font-size: 10px;
  color: var(--ink-60);
  line-height: 1.4;
}

/* ============================================
   HOMEPAGE — HERO
   ============================================ */
.home-hero {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 0;
  padding: 28px 0 0;
}
.home-hero__main {
  padding-right: 32px;
  border-right: 1px solid var(--ink-15);
}
.home-hero__headline {
  font-family: var(--font-display);
  font-size: 2.4rem;
  line-height: 1.15;
  margin: 8px 0 12px;
}
.home-hero__headline a { color: var(--ink); }
.home-hero__headline a:hover { color: var(--accent); }
.home-hero__standfirst {
  font-family: var(--font-body);
  font-size: 1.1rem;
  color: var(--ink-80);
  line-height: 1.5;
  margin-bottom: 12px;
}
.home-hero__meta {
  display: flex;
  gap: 16px;
  margin-bottom: 24px;
}

.home-hero__sidebar {
  padding-left: 24px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* Secondary Stories */
.secondary-story {
  padding: 16px 0;
  border-top: 1px solid var(--ink-15);
}
.secondary-story__headline {
  font-family: var(--font-display);
  font-size: 1.15rem;
  margin: 4px 0;
}
.secondary-story__headline a { color: var(--ink); }
.secondary-story__headline a:hover { color: var(--accent); }
.secondary-story__excerpt {
  font-size: 0.9rem;
  color: var(--ink-60);
  line-height: 1.4;
}

/* Article Stream */
.article-stream { padding: 8px 0; }
.stream-item {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 16px 0;
  border-bottom: 1px solid var(--ink-15);
  gap: 24px;
}
.stream-item__headline {
  font-family: var(--font-display);
  font-size: 1.1rem;
  margin: 4px 0;
}
.stream-item__headline a { color: var(--ink); }
.stream-item__headline a:hover { color: var(--accent); }
.stream-item__excerpt {
  font-size: 0.85rem;
  color: var(--ink-60);
  line-height: 1.4;
}

/* Top Stories Grid */
.top-stories { padding: 8px 0 32px; }
.top-stories__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.top-stories__item {
  padding: 20px;
  background: var(--bg-card);
  border: 1px solid var(--ink-15);
  border-radius: 2px;
  transition: border-color 0.2s;
}
.top-stories__item:hover { border-color: var(--accent); }
.top-stories__item-headline {
  font-family: var(--font-display);
  font-size: 1.05rem;
  margin: 6px 0;
}
.top-stories__item-headline a { color: var(--ink); }
.top-stories__item-headline a:hover { color: var(--accent); }
.top-stories__item-desc {
  font-size: 0.85rem;
  color: var(--ink-60);
  line-height: 1.4;
}

/* Featured Card */
.featured-card {
  padding: 24px;
  background: var(--bg-card);
  border: 1px solid var(--ink-15);
  border-left: 3px solid var(--accent);
  margin-bottom: 24px;
}
.featured-card__headline {
  font-family: var(--font-display);
  font-size: 1.6rem;
  margin: 8px 0;
}
.featured-card__headline a { color: var(--ink); }
.featured-card__headline a:hover { color: var(--accent); }
.featured-card__excerpt {
  color: var(--ink-80);
  line-height: 1.5;
}

/* ============================================
   ARTICLE LAYOUT
   ============================================ */
.article-precontent {
  background: var(--bg-secondary);
  padding: 12px 0;
  border-bottom: 1px solid var(--ink-15);
}
.article-precontent__breadcrumb {
  font-family: var(--font-ui);
  font-size: 11px;
  color: var(--ink-40);
}
.article-precontent__breadcrumb a { color: var(--ink-40); }
.article-precontent__breadcrumb a:hover { color: var(--accent); }
.article-precontent__breadcrumb span { margin: 0 4px; }

.article-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 32px;
  padding: 28px 0;
}
.article-layout__sidebar {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.article-header { margin-bottom: 24px; }
.article-header__headline {
  font-family: var(--font-display);
  font-size: 2.2rem;
  line-height: 1.15;
  margin: 8px 0 12px;
  color: var(--ink);
}
.article-header__standfirst {
  font-family: var(--font-body);
  font-size: 1.15rem;
  color: var(--ink-80);
  line-height: 1.5;
  margin-bottom: 12px;
}
.article-header__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  font-family: var(--font-ui);
  font-size: 11px;
  color: var(--ink-40);
}

/* Content Body */
.content-body {
  font-family: var(--font-body);
  font-size: 1.05rem;
  line-height: 1.7;
  color: var(--ink-80);
}
.content-body h1 { font-family: var(--font-display); font-size: 2rem; color: var(--ink); margin: 36px 0 16px; }
.content-body h2 { font-family: var(--font-display); font-size: 1.5rem; color: var(--ink); margin: 32px 0 12px; padding-bottom: 8px; border-bottom: 1px solid var(--ink-15); }
.content-body h3 { font-family: var(--font-display); font-size: 1.2rem; color: var(--ink); margin: 24px 0 8px; }
.content-body h4 { font-family: var(--font-ui); font-size: 0.95rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--accent); margin: 20px 0 8px; }
.content-body p { margin-bottom: 16px; }
.content-body ul, .content-body ol { margin: 16px 0; padding-left: 24px; }
.content-body ul { list-style: disc; }
.content-body ol { list-style: decimal; }
.content-body li { margin-bottom: 8px; }
.content-body blockquote {
  border-left: 3px solid var(--accent);
  padding: 12px 20px;
  margin: 24px 0;
  background: var(--bg-card);
  color: var(--ink-80);
  font-style: italic;
}
.content-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
  font-family: var(--font-ui);
  font-size: 0.9rem;
}
.content-body th {
  background: var(--bg-card);
  color: var(--accent);
  text-align: left;
  padding: 10px 12px;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.05em;
  border-bottom: 2px solid var(--ink-15);
}
.content-body td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--ink-15);
  color: var(--ink-80);
}
.content-body tr:hover { background: var(--bg-hover); }
.content-body code {
  font-family: var(--font-mono);
  font-size: 0.9em;
  background: var(--bg-card);
  padding: 2px 6px;
  border-radius: 2px;
  color: var(--accent);
}
.content-body pre {
  background: var(--bg-card);
  border: 1px solid var(--ink-15);
  padding: 16px;
  overflow-x: auto;
  margin: 24px 0;
  border-radius: 2px;
}
.content-body pre code { background: none; padding: 0; }
.content-body strong { color: var(--ink); font-weight: 600; }
.content-body hr { border: none; border-top: 1px solid var(--ink-15); margin: 32px 0; }

/* Article Tags */
.article-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0; }
.article-tag {
  font-family: var(--font-ui);
  font-size: 11px;
  color: var(--ink-60);
  background: var(--bg-card);
  border: 1px solid var(--ink-15);
  padding: 4px 10px;
  border-radius: 2px;
}

/* Related Articles */
.related-articles { margin: 32px 0; }
.related-articles__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.related-card {
  padding: 16px;
  background: var(--bg-card);
  border: 1px solid var(--ink-15);
  border-radius: 2px;
}
.related-card h4 { font-family: var(--font-display); font-size: 1rem; margin: 6px 0; }
.related-card h4 a { color: var(--ink); }
.related-card h4 a:hover { color: var(--accent); }

/* ============================================
   SECTION INDEX
   ============================================ */
.section-index-header {
  background: var(--bg-secondary);
  padding: 32px 0;
  border-bottom: 1px solid var(--ink-15);
}
.section-index-header__name {
  font-family: var(--font-display);
  font-size: 2.5rem;
  color: var(--ink);
}
.section-index-header__desc {
  font-family: var(--font-body);
  font-size: 1.1rem;
  color: var(--ink-60);
  margin-top: 8px;
  max-width: 640px;
}
.section-index-header__rule {
  height: 3px;
  width: 60px;
  margin-top: 16px;
}
.section-index-header__meta {
  display: flex;
  gap: 16px;
  margin-top: 12px;
  font-family: var(--font-ui);
  font-size: 12px;
  color: var(--ink-40);
}
.section-index-header__rss {
  color: var(--accent) !important;
  font-weight: 600;
}

.section-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 32px;
  padding: 28px 0;
}
.section-layout__sidebar {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* ============================================
   SIDEBAR WIDGETS
   ============================================ */
.sidebar-widget {
  background: var(--bg-card);
  border: 1px solid var(--ink-15);
  padding: 20px;
  border-radius: 2px;
}
.sidebar-widget__title {
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--accent);
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--ink-15);
}

/* Threat Meter */
.threat-meter__gauge { margin-bottom: 12px; }
.threat-meter__bar {
  width: 100%;
  height: 8px;
  background: var(--ink-15);
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 6px;
}
.threat-meter__fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.5s;
}
.threat-meter__fill--critical { background: var(--threat-critical); }
.threat-meter__fill--high { background: var(--threat-high); }
.threat-meter__fill--elevated { background: var(--threat-elevated); }
.threat-meter__fill--low { background: var(--threat-low); }
.threat-meter__level {
  font-family: var(--font-ui);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.05em;
}
.threat-meter__level--critical { color: var(--threat-critical); }
.threat-meter__level--high { color: var(--threat-high); }
.threat-meter__level--elevated { color: var(--threat-elevated); }
.threat-meter__level--low { color: var(--threat-low); }
.threat-meter__summary {
  font-family: var(--font-ui);
  font-size: 12px;
  color: var(--ink-60);
  line-height: 1.4;
  margin: 8px 0;
}
.threat-meter__updated {
  font-family: var(--font-ui);
  font-size: 10px;
  color: var(--ink-40);
  margin-bottom: 12px;
}
.threat-meter__components { margin-top: 12px; }
.threat-component {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 0;
  font-family: var(--font-ui);
  font-size: 12px;
  color: var(--ink-60);
}
.threat-meter__link {
  display: block;
  margin-top: 12px;
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 600;
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Hormuz Widget */
.hormuz-widget__status { margin-bottom: 12px; }
.hormuz-widget__details { margin-bottom: 8px; }
.hormuz-detail {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 0;
  font-family: var(--font-ui);
  font-size: 12px;
  color: var(--ink-60);
}
.hormuz-widget__notes {
  font-family: var(--font-ui);
  font-size: 11px;
  color: var(--ink-40);
  line-height: 1.4;
  margin: 8px 0;
}
.hormuz-widget__link {
  display: block;
  margin-top: 8px;
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 600;
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* SITREP Widget */
.sitrep-widget__card { margin-top: 4px; }
.sitrep-widget__badge {
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 700;
  background: var(--threat-critical);
  color: var(--white);
  padding: 2px 8px;
  letter-spacing: 0.1em;
  margin-right: 8px;
}
.sitrep-widget__date {
  font-family: var(--font-ui);
  font-size: 11px;
  color: var(--ink-40);
}
.sitrep-widget__excerpt {
  font-family: var(--font-ui);
  font-size: 12px;
  color: var(--ink-60);
  line-height: 1.4;
  margin: 8px 0;
}
.sitrep-widget__link {
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 600;
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.sitrep-widget__empty {
  font-family: var(--font-ui);
  font-size: 12px;
  color: var(--ink-40);
}

/* ============================================
   SITREP LAYOUT
   ============================================ */
.sitrep-header {
  background: var(--bg-secondary);
  padding: 40px 0;
  border-bottom: 3px solid var(--threat-critical);
  text-align: center;
}
.sitrep-header__classification {
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.2em;
  color: var(--accent);
  margin-bottom: 8px;
}
.sitrep-header__title {
  font-family: var(--font-ui);
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--ink);
  letter-spacing: 0.08em;
}
.sitrep-header__date {
  font-family: var(--font-ui);
  font-size: 1.2rem;
  color: var(--ink-60);
  margin: 8px 0 12px;
}
.sitrep-header__attribution {
  font-family: var(--font-ui);
  font-size: 10px;
  letter-spacing: 0.15em;
  color: var(--ink-40);
  margin-top: 12px;
}

.sitrep-layout {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 32px;
  padding: 28px 0;
}
.sitrep-layout__sidebar {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.sitrep-content h2 {
  font-family: var(--font-ui);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--accent);
  border-bottom: 2px solid var(--accent);
}
.sitrep-nav {
  display: flex;
  justify-content: space-between;
  margin-top: 32px;
  font-family: var(--font-ui);
  font-size: 12px;
}
.sitrep-nav a { color: var(--accent); }

/* ============================================
   INTEL BOX SHORTCODE
   ============================================ */
.intel-box {
  border-radius: 2px;
  margin: 24px 0;
  overflow: hidden;
}
.intel-box__header {
  padding: 8px 16px;
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  display: flex;
  gap: 12px;
  align-items: center;
}
.intel-box__content {
  padding: 16px;
  font-family: var(--font-ui);
  font-size: 0.9rem;
  line-height: 1.5;
}
.intel-box--critical { border: 1px solid var(--threat-critical); }
.intel-box--critical .intel-box__header { background: var(--threat-critical); color: var(--white); }
.intel-box--critical .intel-box__content { background: rgba(255,0,0,0.05); color: var(--ink-80); }
.intel-box--high { border: 1px solid var(--threat-high); }
.intel-box--high .intel-box__header { background: var(--threat-high); color: var(--white); }
.intel-box--high .intel-box__content { background: rgba(255,69,0,0.05); color: var(--ink-80); }
.intel-box--elevated { border: 1px solid var(--threat-elevated); }
.intel-box--elevated .intel-box__header { background: var(--threat-elevated); color: var(--bg-primary); }
.intel-box--elevated .intel-box__content { background: rgba(255,176,0,0.05); color: var(--ink-80); }
.intel-box--low { border: 1px solid var(--threat-low); }
.intel-box--low .intel-box__header { background: var(--threat-low); color: var(--bg-primary); }
.intel-box--low .intel-box__content { background: rgba(46,204,113,0.05); color: var(--ink-80); }

/* ============================================
   DASHBOARD
   ============================================ */
.dashboard-wrapper {
  width: 100%;
  height: calc(100vh - 200px);
  min-height: 600px;
}
.dashboard-frame {
  width: 100%;
  height: 100%;
  border: none;
}

/* ============================================
   AD UNITS
   ============================================ */
.ad-unit {
  text-align: center;
  margin: 24px 0;
  padding: 8px 0;
}
.ad-label {
  display: block;
  font-family: var(--font-ui);
  font-size: 9px;
  color: var(--ink-25);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 4px;
}
.ad-leaderboard { max-width: 728px; margin-left: auto; margin-right: auto; }

/* ============================================
   COOKIE CONSENT (scaffold compatible)
   ============================================ */
.cc-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.7);
  z-index: 9998;
}
.cc-overlay--active { display: block; }
.cc-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--bg-card);
  border-top: 1px solid var(--ink-15);
  z-index: 9999;
  padding: 20px;
}
.cc-banner__body {
  max-width: 1280px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 24px;
}
.cc-banner__text {
  flex: 1;
  font-family: var(--font-ui);
  font-size: 13px;
  color: var(--ink-80);
}
.cc-banner__text strong { color: var(--ink); }
.cc-banner__text p { margin-top: 4px; font-size: 12px; color: var(--ink-60); }
.cc-banner__text a { color: var(--accent); text-decoration: underline; }
.cc-banner__actions { display: flex; gap: 8px; flex-shrink: 0; }
.cc-btn {
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 600;
  padding: 8px 16px;
  border: none;
  border-radius: 2px;
  cursor: pointer;
  white-space: nowrap;
}
.cc-btn--accept { background: var(--accent); color: var(--bg-primary); }
.cc-btn--accept:hover { background: var(--accent-dark); }
.cc-btn--reject { background: var(--ink-15); color: var(--ink-80); }
.cc-btn--reject:hover { background: var(--ink-25); }
.cc-btn--manage { background: transparent; color: var(--ink-60); border: 1px solid var(--ink-25); }
.cc-btn--manage:hover { color: var(--ink); border-color: var(--ink-40); }
.cc-btn--save { background: var(--accent2); color: var(--bg-primary); }

.cc-panel {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: var(--bg-card);
  border: 1px solid var(--ink-15);
  border-radius: 4px;
  z-index: 10000;
  width: 90%;
  max-width: 500px;
  max-height: 80vh;
  overflow-y: auto;
}
.cc-panel__inner { padding: 24px; }
.cc-panel__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.cc-panel__header h3 { font-family: var(--font-ui); font-size: 16px; color: var(--ink); }
.cc-panel__close {
  background: none;
  border: none;
  color: var(--ink-40);
  font-size: 24px;
  cursor: pointer;
}
.cc-panel__intro {
  font-family: var(--font-ui);
  font-size: 13px;
  color: var(--ink-60);
  margin-bottom: 16px;
  line-height: 1.4;
}
.cc-category { margin-bottom: 16px; padding-bottom: 16px; border-bottom: 1px solid var(--ink-15); }
.cc-category__header { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.cc-category__info strong { font-family: var(--font-ui); font-size: 14px; color: var(--ink); display: block; }
.cc-category__desc { font-family: var(--font-ui); font-size: 12px; color: var(--ink-60); display: block; margin-top: 4px; }
.cc-toggle { position: relative; display: inline-flex; align-items: center; gap: 8px; cursor: pointer; flex-shrink: 0; }
.cc-toggle input { position: absolute; opacity: 0; width: 0; height: 0; }
.cc-toggle__slider {
  width: 40px;
  height: 22px;
  background: var(--ink-25);
  border-radius: 11px;
  position: relative;
  transition: background 0.2s;
}
.cc-toggle__slider::after {
  content: '';
  position: absolute;
  width: 18px;
  height: 18px;
  background: var(--white);
  border-radius: 50%;
  top: 2px;
  left: 2px;
  transition: transform 0.2s;
}
.cc-toggle input:checked + .cc-toggle__slider { background: var(--accent); }
.cc-toggle input:checked + .cc-toggle__slider::after { transform: translateX(18px); }
.cc-toggle--locked { opacity: 0.6; cursor: default; }
.cc-toggle__label { font-family: var(--font-ui); font-size: 11px; color: var(--ink-40); }
.cc-panel__footer { display: flex; gap: 8px; justify-content: flex-end; margin-top: 16px; }

/* ============================================
   PRINT STYLES
   ============================================ */
@media print {
  .masthead, .nav, .ticker, .breaking-ticker, .footer, .cc-banner, .cc-panel,
  .ad-unit, .sidebar-widget, .threat-meter, .hormuz-widget, .sitrep-widget { display: none !important; }
  body { background: white; color: black; }
  .container { max-width: 100%; }
  .article-layout { display: block; }
  .article-layout__sidebar { display: none; }
}

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width: 1024px) {
  .home-hero { grid-template-columns: 1fr; }
  .home-hero__main { padding-right: 0; border-right: none; margin-bottom: 32px; }
  .home-hero__sidebar { padding-left: 0; }
  .article-layout { grid-template-columns: 1fr; }
  .article-layout__sidebar { order: 1; }
  .section-layout { grid-template-columns: 1fr; }
  .section-layout__sidebar { order: 1; }
  .sitrep-layout { grid-template-columns: 1fr; }
  .sitrep-layout__sidebar { order: 1; }
  .top-stories__grid { grid-template-columns: repeat(2, 1fr); }
  .footer__grid { grid-template-columns: repeat(3, 1fr); }
  .related-articles__grid { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
  .brand__name { font-size: 2rem; }
  .brand__tagline { font-size: 1rem; }
  .home-hero__headline { font-size: 1.8rem; }
  .article-header__headline { font-size: 1.8rem; }
  .sitrep-header__title { font-size: 1.8rem; }
  .top-stories__grid { grid-template-columns: 1fr; }
  .footer__grid { grid-template-columns: repeat(2, 1fr); }
  .footer__bottom { flex-direction: column; gap: 12px; text-align: center; }
  .footer__disclaimer { text-align: center; max-width: 100%; }
  .cc-banner__body { flex-direction: column; }
  .cc-banner__actions { width: 100%; }
  .cc-btn { flex: 1; }
  .masthead .container { flex-direction: column; gap: 4px; }
  .ad-leaderboard { display: none; }
}

@media (max-width: 480px) {
  .container { padding: 0 16px; }
  .brand__name { font-size: 1.5rem; }
  .nav__item { padding: 10px 10px; font-size: 10px; }
}