/* Light re-skin override (2026-07 refresh) — research articles + legal pages.
 * Loaded AFTER theme.css and each article's inline <style>; overrides the
 * dark tokens with the light consumer system (docs/refresh/BRAND_MESSAGING.md §3)
 * and styles the standard nav/footer markup swapped into the articles.
 * Self-contained pages (homepage, /military, research index) do not use this file. */

:root {
  --color-bg: #FBFAF7;
  --color-bg-elevated: #F4F1EB;
  --color-bg-card: #FFFFFF;
  --color-border: #E7E2D9;
  --color-border-subtle: #E7E2D9;
  --color-text: #1B1712;
  --color-text-secondary: #6E675E;
  --color-text-tertiary: #8A8378;
  --color-accent: #E97451;
  --color-accent-dim: #B0552F;
  --color-accent-glow: rgba(233, 116, 81, 0.18);

  /* Serif retired 2026-07 (brand law: Inter everywhere, ALTRONED wordmarks only).
   * Headings declared with var(--font-serif) now render Inter. */
  --font-serif: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* Inter headings need the system's tighter tracking + real weight
 * (the old serif was weight 400 by design). */
h1, h2, h3 { letter-spacing: -.015em; }
.article-header h1 { font-weight: 660; }
h2 { font-weight: 650; }

/* The old fixed dark nav is gone; first section no longer needs clearance. */
.article-header { padding-top: 56px; }

/* ---- Standard light nav (markup swapped into each article) ---- */
/* position:static overrides the old dark design's position:fixed still in the
 * inline styles — every other page's bar is in-flow, and a fixed bar would
 * cover content once the links row makes it two rows tall on mobile. */
.rl-nav { border-bottom: 1px solid #E7E2D9; background: #FBFAF7; position: static; }
.rl-nav-inner {
  max-width: 1120px; margin: 0 auto; padding: 18px 32px;
  display: flex; align-items: center; justify-content: space-between; gap: 28px;
}
/* margin-right:auto keeps links + pill clustered right now that the pill
 * sits outside .rl-links (needed so links can drop to their own row on mobile). */
.rl-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: #1B1712; margin-right: auto; }
.rl-brand img { width: 26px; height: 23px; display: block; object-fit: contain; }
.rl-wordmark { font-family: var(--font-logo); font-size: 19px; letter-spacing: .05em; color: #1B1712; }
.rl-links { display: flex; align-items: center; gap: 28px; font-size: 14.5px; }
.rl-links a { color: #4A443C; text-decoration: none; font-weight: 500; transition: color .2s ease; }
.rl-links a:hover { color: #1B1712; }
.rl-links a[aria-current="page"] { color: #1B1712; }
.rl-pill {
  display: inline-block; background: #E97451; color: #16130F !important;
  font-weight: 600; border-radius: 999px; text-decoration: none;
  font-size: 14px; padding: 9px 18px;
  transition: transform .2s ease, box-shadow .2s ease;
}
.rl-pill:hover { transform: translateY(-1px); box-shadow: 0 4px 20px rgba(233, 116, 81, .3); }

/* ---- Standard compact footer ---- */
.rl-footer { background: #FBFAF7; border-top: 1px solid #E7E2D9; }
.rl-footer-inner {
  max-width: 1120px; margin: 0 auto; padding: 34px 32px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
}
.rl-wordmark-sm { font-family: var(--font-logo); font-size: 14px; letter-spacing: .05em; color: #1B1712; }
.rl-brand .rl-sm { width: 20px; height: 18px; }
.rl-footer-links { font-size: 13px; color: #6E675E; display: flex; gap: 22px; flex-wrap: wrap; }
.rl-footer-links a { color: inherit; text-decoration: none; transition: color .2s ease; }
.rl-footer-links a:hover { color: #1B1712; }

a:focus-visible { outline: 2px solid #E97451; outline-offset: 3px; border-radius: 4px; }

@media (max-width: 880px) {
  /* Header: links drop to a full-width second row; the Search text link
   * hides (the Start-searching pill above is the same destination). */
  .rl-nav-inner { flex-wrap: wrap; gap: 14px 12px; }
  .rl-nav-inner .rl-brand img { width: 21px; height: 19px; }
  .rl-nav-inner .rl-wordmark { font-size: 13px; }
  .rl-pill { font-size: 13px; padding: 8px 14px; }
  .rl-links { flex-basis: 100%; order: 3; flex-wrap: wrap; gap: 8px 18px; }
  .rl-search { display: none; }
  /* Footer: brand stacks above the links; links in two tidy columns (4 + 3). */
  .rl-footer-inner { flex-direction: column; align-items: flex-start; gap: 20px; }
  .rl-footer-links { display: grid; grid-auto-flow: column; grid-template-rows: repeat(4, auto); gap: 12px 48px; justify-content: start; text-align: left; }
}
@media (max-width: 560px) {
  .rl-nav-inner, .rl-footer-inner { padding-left: 22px; padding-right: 22px; }
}

/* Legal pages (/privacy, /terms, /eula): old fixed-nav clearance no longer needed. */
main.content { padding-top: 56px; }