/* Frontier Rank — Warm Institutional Intelligence
   Shared visual contract for marketing, research, resource, and proof pages. */
:root {
  color-scheme: dark;
  --editorial-serif: "Iowan Old Style", Baskerville, "Times New Roman", serif;
  --ink: #05080d;
  --ink-2: #090d12;
  --panel: #11161d;
  --panel-soft: #181d24;
  --paper: #f2efe8;
  --paper-muted: #d7d0c4;
  --stone: #c7b79f;
  --text: #f2efe8;
  --muted: #a9afb8;
  --dim: #737a84;
  --blue: #c2c5c9;
  --blue-2: #9399a1;
  --green: #9eb9a8;
  --amber: #c7b79f;
  --line: rgba(242, 239, 232, .12);
  --line-strong: rgba(199, 183, 159, .34);
  --cta: #d8d6d0;
  --cta-hover: #efede7;
  --cta-border: #f2efe8;
  --radius: 6px;
}

body {
  background: var(--ink);
  color: var(--text);
}

/* One shell, one navigation language. */
.site-nav {
  border-bottom-color: var(--line);
  background: rgba(5, 8, 13, .92);
  box-shadow: 0 12px 34px rgba(0, 0, 0, .12);
}
.brand-wordmark {
  color: var(--paper);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .11em;
}
.brand-gap { width: .405em; }
.brand-wordmark .lift-3 { --lift: -5px; }
.brand:hover .brand-wordmark .lift-3 { --lift: -6px; }
.brand-wordmark .brand-letter::after {
  content: none !important;
  display: none !important;
}
.brand::after {
  content: none !important;
  display: none !important;
}
.brand::after,
.brand-letter.n::after,
.brand-letter.k::after,
.brand-letter.a::after {
  background: linear-gradient(90deg, transparent, var(--stone));
  box-shadow: none;
}
.brand-letter.k { color: var(--paper); text-shadow: none; }
.nav-links a { color: var(--muted); }
.nav-links a::after { background: var(--stone); }
.nav-links a:hover,
.nav-links a[aria-current="page"] { color: var(--paper); }

/* Primary actions use brushed silver: visible, quiet, and material. */
.button {
  border-color: var(--cta-border);
  border-radius: var(--radius);
  background: var(--cta);
  box-shadow: none;
  color: #101318;
}
.button:hover {
  border-color: #fff;
  background: var(--cta-hover);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .3);
  color: #05080d;
}
.button.secondary {
  border-color: rgba(242, 239, 232, .22);
  background: transparent;
  color: var(--paper-muted);
}
.button.secondary:hover { border-color: rgba(242, 239, 232, .42); background: rgba(242,239,232,.04); }
:where(a, button, input, select, textarea, summary):focus-visible {
  outline-color: #d8d6d0;
  box-shadow: 0 0 0 5px rgba(216,214,208,.14);
}

h1, h2, h3 { color: var(--paper); text-wrap: balance; }
h1 { letter-spacing: -.045em; font-weight: 690; }
h2 { letter-spacing: -.035em; font-weight: 670; }
h3 { letter-spacing: -.018em; }

/* Editorial type carries the story. Product UI, cards, forms, and data stay sans. */
.page-hero h1,
.resource-hero h1,
.research-hero h1,
.proof-hero h1,
.section-head h2,
.resource-heading h2,
.article-heading h2,
.research-standard h2,
.feature-story h2,
.feature-resource h2,
.cta-panel h2 {
  font-family: var(--editorial-serif);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -.04em;
}

.page-hero h1,
.resource-hero h1,
.research-hero h1,
.proof-hero h1 {
  max-width: 14ch;
  font-size: clamp(56px, 6.2vw, 92px);
  line-height: .94;
}

.section-head h2,
.resource-heading h2,
.article-heading h2,
.research-standard h2,
.feature-story h2,
.feature-resource h2,
.cta-panel h2 {
  font-size: clamp(38px, 4.1vw, 64px);
}
.eyebrow,
.method-card .index,
.profile-top span,
.profile-card dt,
.step .step-id,
th,
.accent { color: var(--stone); }
.eyebrow,
.method-card .index,
.resource-card .index,
.step .step-id { display: none; }
.lede { color: var(--paper-muted); }
.section-copy,
.method-card p,
.info-card p,
.profile-card dd,
.step p { color: var(--muted); }

/* Marketing heroes use one recognisable architectural world. */
body:not(.article-page) .page-hero,
.resource-hero,
.research-hero,
.proof-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(5,8,13,.96) 0%, rgba(5,8,13,.82) 48%, rgba(5,8,13,.48) 100%),
    linear-gradient(180deg, rgba(5,8,13,.04), rgba(5,8,13,.72)),
    url('/brand/frontier-rank-assets/site/architectural-hero-preview.jpg') center 44% / cover no-repeat;
  border-bottom-color: var(--line);
}
body:not(.article-page) .page-hero::after,
.resource-hero::after,
.research-hero::after,
.proof-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(rgba(242,239,232,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(242,239,232,.025) 1px, transparent 1px);
  background-size: 52px 52px;
  pointer-events: none;
}
.hero-meta,
.live-stamp,
.resource-note { border-color: var(--line-strong); }

/* Graphite is the default working surface; paper is an intentional reading mode. */
.section,
.resource-section,
.research-section { background: var(--ink); border-bottom-color: var(--line); }
.section:nth-of-type(even),
.resource-section:nth-of-type(even),
.research-section:nth-of-type(even) { background: var(--ink-2); }
.proof-strip,
.resource-tabs { background: rgba(9, 13, 18, .96); border-color: var(--line); }
.proof-cell,
.method-card,
.info-card,
.profile-card,
.resource-card,
.mini-card,
.comparison-card,
.truth-card,
.panel {
  border-color: var(--line);
  border-radius: 0;
  background: rgba(242, 239, 232, .018);
  box-shadow: none;
}
.method-card:hover,
.info-card:hover,
.resource-card:hover,
.mini-card:hover {
  border-color: var(--line-strong);
  background: rgba(199, 183, 159, .045);
}
.answer-box {
  border-color: var(--line);
  border-left-color: var(--stone);
  background: linear-gradient(90deg, rgba(199,183,159,.08), transparent 72%);
}
.answer-box b { color: var(--stone); }
.answer-box p { color: var(--paper-muted); }
.callout,
.outcome-model,
.feature-resource,
.cta-panel {
  border-color: var(--line-strong);
  border-radius: var(--radius);
  background: linear-gradient(135deg, rgba(199,183,159,.075), rgba(17,22,29,.82));
}
.outcome-total span,
.resource-card .index,
.wire-type { color: var(--stone); }
.resource-card .text-link,
.wire-source,
.source-list a { color: #c2c5c9; }
.resource-meta,
.story-meta { color: #a9afb8; }
.resource-tab { border-radius: var(--radius); }
.resource-tab:hover,
.resource-tab.current {
  border-color: var(--line-strong);
  background: rgba(199,183,159,.08);
  color: var(--paper);
}
.feature-art {
  border-color: var(--line);
  background: linear-gradient(rgba(199,183,159,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(199,183,159,.06) 1px,transparent 1px);
  background-size: 42px 42px;
}
.feature-art::before { background: linear-gradient(90deg,transparent,var(--stone),var(--paper)); box-shadow: 0 -62px 0 rgba(199,183,159,.24),0 -124px 0 rgba(199,183,159,.12); }

/* Research graphics follow the same material system—never the legacy neon blue. */
.research-principle { border-left-color: var(--stone); }
.research-back,
.article-card .read-link { color: #c2c5c9; }
.topic-link:hover,
.topic-link[aria-current="page"] {
  border-color: var(--line-strong);
  background: rgba(199,183,159,.07);
}
.feature-story { border-color: var(--line); background: linear-gradient(135deg,rgba(199,183,159,.07),rgba(242,239,232,.012)); }
.feature-viz {
  border-color: var(--line);
  background: linear-gradient(rgba(199,183,159,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(199,183,159,.055) 1px,transparent 1px);
  background-size: 42px 42px;
}
.feature-viz::before { border-color: rgba(199,183,159,.28); }
.signal-line { background: linear-gradient(90deg,transparent,#8f969f 35%,#d8d6d0); }
.signal-dot { border-color: #d8d6d0; box-shadow: 0 0 24px rgba(216,214,208,.22); }
.article-card:hover { background: rgba(199,183,159,.05); }
.standard-item b { color: var(--stone); }

/* Evidence and product data stay precise, quiet, and monochrome. */
.data-table-wrap,
.panel { border-color: var(--line); border-radius: var(--radius); }
table { background: var(--panel); }
.data-table-wrap tbody tr:hover { background: rgba(199,183,159,.05); }
.status-pill { border-color: rgba(199,183,159,.36); color: var(--stone); }
.status-pill.live,
.source-state.live,
.delta { border-color: rgba(158,185,168,.35); color: var(--green); }
.chart-grid line { stroke: rgba(242,239,232,.1); }
.chart-line { stroke: var(--stone); }
.chart-point { fill: var(--ink); stroke: var(--stone); }
.metric-shift .arrow { color: var(--stone); }

/* Articles: an off-white editorial sheet inside the same dark institution. */
.article-page .page-hero {
  background: var(--paper);
  color: #17191c;
  border-bottom-color: rgba(23,25,28,.14);
}
.article-page .page-hero h1,
.article-page .page-hero .hero-meta b { color: #17191c; }
.article-page .page-hero .lede { color: #5e6268; }
.article-page .page-hero .eyebrow { color: #6f604d; }
.article-page .proof-strip { background: #e6e0d6; }
.article-page main > .section {
  --text: #17191c;
  --muted: #5e6268;
  --dim: #777a7e;
  --line: rgba(23,25,28,.14);
  --line-strong: rgba(111,96,77,.3);
  --blue: #6f604d;
  background: var(--paper);
}
.article-page main > .section:nth-of-type(even) { background: #ebe6dd; }
.article-page main > .section .eyebrow,
.article-page main > .section .step-id,
.article-page main > .section th,
.article-page main > .section .source-list a,
.article-page main > .section a { color: #6f604d; }
.article-page main > .section .answer-box { border-left-color: #8b755c; }
.article-page main > .section .answer-box b { color: #6f604d; }
.article-page main > .section .callout { border-color: rgba(111,96,77,.28); background: linear-gradient(135deg,#e6ded1,#faf8f3); }
.article-toc a:hover,
.article-toc a.active { border-left-color: #8b755c; background: #eee8de; }

.site-footer { background: var(--ink); border-color: var(--line); }

/* Editorial pages use rhythm, hierarchy, and prose instead of dashboard grammar. */
.editorial-page .proof-strip { display: none; }

.editorial-page .page-hero-grid,
.editorial-page .resource-hero-grid {
  grid-template-columns: minmax(0, 1fr) minmax(260px, .42fr);
  gap: clamp(48px, 8vw, 120px);
}

.editorial-page .hero-meta,
.editorial-page .resource-note {
  align-self: end;
  padding: 0 0 4px 28px;
  border: 0;
  border-left: 1px solid var(--line-strong);
  background: transparent;
  color: var(--paper-muted);
  line-height: 1.65;
}

.editorial-page .editorial-opening {
  max-width: 950px;
  margin: 0 0 clamp(68px, 9vw, 118px);
}

.editorial-page .editorial-opening p {
  margin: 0;
  color: var(--paper-muted);
  font-family: var(--editorial-serif);
  font-size: clamp(27px, 3vw, 42px);
  line-height: 1.28;
  letter-spacing: -.025em;
}

.editorial-page .answer-box {
  max-width: 950px;
  margin: 0 0 clamp(68px, 9vw, 118px);
  padding: 0;
  border: 0;
  background: transparent;
}

.editorial-page .answer-box b { display: none; }
.editorial-page .answer-box p {
  margin: 0;
  color: var(--paper-muted);
  font-family: var(--editorial-serif);
  font-size: clamp(27px, 3vw, 42px);
  line-height: 1.28;
  letter-spacing: -.025em;
}

.editorial-page .section-head,
.editorial-page .resource-heading {
  grid-template-columns: minmax(0, .9fr) minmax(300px, .55fr);
  gap: clamp(36px, 7vw, 100px);
  padding-top: 30px;
  border-top: 1px solid var(--line);
}

.editorial-page .method-grid,
.editorial-page .card-grid,
.editorial-page .resource-grid,
.editorial-page .mini-grid {
  display: block;
  border-top: 1px solid var(--line);
}

.editorial-page .method-card,
.editorial-page .info-card,
.editorial-page .resource-card,
.editorial-page .mini-card {
  display: grid;
  grid-template-columns: minmax(230px, .58fr) minmax(0, 1fr) auto;
  gap: clamp(28px, 5vw, 72px);
  min-height: 0;
  margin: 0;
  padding: 32px 0;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
}

.editorial-page .method-card:hover,
.editorial-page .info-card:hover,
.editorial-page .resource-card:hover,
.editorial-page .mini-card:hover {
  background: transparent;
}

.editorial-page .method-card .index,
.editorial-page .resource-card .index,
.editorial-page .step-id,
.editorial-page .feature-art { display: none; }

.editorial-page .method-card h3,
.editorial-page .info-card h3,
.editorial-page .resource-card h3,
.editorial-page .mini-card h3 {
  margin: 0;
  font-family: var(--editorial-serif);
  font-size: clamp(28px, 2.5vw, 38px);
  font-weight: 400;
  line-height: 1.05;
}

.editorial-page .method-card p,
.editorial-page .info-card p,
.editorial-page .resource-card p,
.editorial-page .mini-card p,
.editorial-page .resource-card .text-link {
  margin: 0;
  align-self: start;
}

.editorial-page .steps { border-top: 1px solid var(--line); }
.editorial-page .step {
  grid-template-columns: minmax(230px, .58fr) minmax(0, 1fr);
  gap: clamp(28px, 5vw, 72px);
  padding: 32px 0;
  border: 0;
  border-bottom: 1px solid var(--line);
}

.audit-page .callout {
  display: block;
  padding: 34px 0 34px 30px;
  border: 0;
  border-left: 1px solid var(--line-strong);
  background: transparent;
}

.resource-page .feature-resource {
  display: block;
  padding: clamp(44px, 7vw, 86px) 0;
  border: 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: transparent;
}

.resource-page .feature-resource-copy { max-width: 880px; }
.resource-page .resource-meta { text-transform: none; letter-spacing: 0; }
.resource-page .wire-item { grid-template-columns: 130px minmax(0, 1fr); gap: 36px; }
.resource-page .wire-takeaway {
  grid-column: 2;
  max-width: 760px;
  padding-left: 0;
  border-left: 0;
}
.resource-page .wire-takeaway b {
  text-transform: none;
  letter-spacing: 0;
}

@media (max-width: 700px) {
  body:not(.article-page) .page-hero,
  .resource-hero,
  .research-hero,
  .proof-hero {
    background-position: center, center, 61% center;
  }
  .resource-tabs { background: var(--ink-2); }

  .page-hero h1,
  .resource-hero h1,
  .research-hero h1,
  .proof-hero h1 {
    max-width: 11ch;
    font-size: clamp(48px, 13.5vw, 64px);
  }

  .section-head h2,
  .resource-heading h2,
  .article-heading h2,
  .research-standard h2,
  .feature-story h2,
  .feature-resource h2,
  .cta-panel h2 {
    font-size: clamp(34px, 10vw, 48px);
  }

  .editorial-page .page-hero-grid,
  .editorial-page .resource-hero-grid,
  .editorial-page .section-head,
  .editorial-page .resource-heading,
  .editorial-page .method-card,
  .editorial-page .info-card,
  .editorial-page .resource-card,
  .editorial-page .mini-card,
  .editorial-page .step,
  .resource-page .wire-item {
    grid-template-columns: 1fr;
  }

  .editorial-page .hero-meta,
  .editorial-page .resource-note {
    padding: 24px 0 0;
    border-left: 0;
    border-top: 1px solid var(--line-strong);
  }

  .editorial-page .method-card,
  .editorial-page .info-card,
  .editorial-page .resource-card,
  .editorial-page .mini-card,
  .editorial-page .step { gap: 14px; }

  .resource-page .wire-takeaway { grid-column: 1; }
}