/* Version 3 — Manifest: trade-document look. Paper and ink with one vermilion signal,
   condensed uppercase headlines, square corners and ruled lines. Overhead harvest band,
   commodities as ruled rows, quote as an ink band, light globe. */
:root[data-variant="manifest"] {
  --chaff-50: #faf8f3;
  --chaff-100: #f1ede4;
  --chaff-200: #e8e3d8;
  --chaff-300: #d6d0c1;
  --chaff-400: #b5ae9d;
  --loam-950: #000000;
  --loam-900: #0f0f0e;
  --loam-800: #151514;
  --loam-700: #2a2926;
  --loam-600: #4a4843;
  --loam-500: #615e56;
  --barley-200: #f7dcd2;
  --barley-300: #ff8f6b;
  --barley-400: #d23c18;
  --barley-500: #b53112;
  --barley-700: #a62e10;
  --accent-ink: #ffffff;
  --accent-hover: #b53112;
  --ink: #151514;
  --line: rgb(21 21 20 / 0.16);
  --line-strong: rgb(21 21 20 / 0.42);

  --font-display: "IBM Plex Sans Condensed", "Arial Narrow", ui-sans-serif, sans-serif;
  --font-text: "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;
  --fs-base: 1rem;
  --fs-2xl: clamp(2.25rem, 1.4rem + 3.2vw, 4.25rem);
  --r-sm: 0;
  --r-md: 0;
  --r-lg: 0;
  --shadow-ring: 0 0 0 1px var(--ink);
  --shadow-lift: 0 0 0 1px var(--ink);

  --globe-dark: 0;
  --globe-diffuse: 1.2;
  --globe-map-brightness: 9;
  --globe-map-base: 0;
  --globe-base: 0.97 0.96 0.93;
  --globe-marker: 0.84 0.24 0.09;
  --globe-glow: 0.93 0.91 0.86;
}

:root[data-variant="manifest"] body { line-height: 1.55; }
:root[data-variant="manifest"] h1,
:root[data-variant="manifest"] h2 { font-weight: 700; text-transform: uppercase; letter-spacing: -0.005em; line-height: 0.95; }
:root[data-variant="manifest"] h3 { font-weight: 600; letter-spacing: 0; }
:root[data-variant="manifest"] .eyebrow { color: var(--text); letter-spacing: 0.08em; }
:root[data-variant="manifest"] .eyebrow::before { width: 0.55rem; height: 0.55rem; border-radius: 0; background: var(--barley-400); }

:root[data-variant="manifest"] .btn,
:root[data-variant="manifest"] .chip,
:root[data-variant="manifest"] .badge,
:root[data-variant="manifest"] .crop-tag,
:root[data-variant="manifest"] .globe-label,
:root[data-variant="manifest"] .region-btn,
:root[data-variant="manifest"] .index-icon { border-radius: 0; }
:root[data-variant="manifest"] .btn {
  font-family: var(--font-mono);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  --btn-ring: var(--ink);
}
:root[data-variant="manifest"] .btn-primary { --btn-ring: transparent; }
:root[data-variant="manifest"] .btn-dark { --btn-bg: var(--ink); }

/* Header */
:root[data-variant="manifest"] .site-header.is-scrolled,
:root[data-variant="manifest"] .site-header.is-open { box-shadow: 0 1px 0 var(--ink); }
:root[data-variant="manifest"] .site-header .brand-mark rect { fill: var(--ink); }
:root[data-variant="manifest"] .site-header .brand-mark path:first-of-type { stroke: var(--barley-300); }
:root[data-variant="manifest"] .nav-link { font-family: var(--font-mono); font-size: 0.8125rem; text-transform: uppercase; letter-spacing: 0.06em; }
:root[data-variant="manifest"] .nav-link::after { background: var(--barley-400); }

/* Hero: document header, full-width headline, overhead band, code table */
:root[data-variant="manifest"] .hero { min-height: 0; display: block; }
:root[data-variant="manifest"] .hero-media { display: none; }
:root[data-variant="manifest"] .hero-main {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--sp-5);
  padding-top: calc(var(--header-h) + var(--sp-5));
}
:root[data-variant="manifest"] .hero-main::before {
  content: "Overview — International food commodity trading — 2026";
  grid-column: 1 / -1;
  padding: var(--sp-3) 0;
  border-top: 2px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
:root[data-variant="manifest"] .hero-copy {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--sp-5);
  padding: var(--sp-7) 0 var(--sp-6);
}
:root[data-variant="manifest"] .hero-copy > * { grid-column: 1 / -1; }
:root[data-variant="manifest"] .hero .eyebrow { display: none; }
:root[data-variant="manifest"] .hero-title {
  font-size: clamp(3rem, 0.8rem + 8.6vw, 9.5rem);
  line-height: 0.88;
  letter-spacing: -0.01em;
}
:root[data-variant="manifest"] .hero-title em { color: var(--barley-400); }
:root[data-variant="manifest"] .hero-lede { grid-column: 1 / span 6; margin-top: var(--sp-6); max-width: 52ch; color: var(--loam-700); font-size: 1.125rem; }
:root[data-variant="manifest"] .hero-actions { grid-column: 8 / -1; align-self: end; justify-content: flex-end; margin-top: var(--sp-6); }
:root[data-variant="manifest"] .hero-actions .btn:not(.btn-primary) { background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; }
:root[data-variant="manifest"] .hero-gallery { display: block; grid-column: 1 / -1; position: relative; }
:root[data-variant="manifest"] .hg-aerial {
  display: block;
  width: 100%;
  aspect-ratio: 21 / 7;
  object-fit: cover;
  object-position: 50% 40%;
  filter: saturate(0.85) contrast(1.05);
}
:root[data-variant="manifest"] .hero-gallery::after {
  content: "Fig. 1 — Harvest, from above";
  position: absolute;
  left: 0;
  bottom: 0;
  padding: var(--sp-2) var(--sp-3);
  background: var(--chaff-100);
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  letter-spacing: 0.04em;
}
:root[data-variant="manifest"] .hero-index { padding-bottom: 0; }
:root[data-variant="manifest"] .index-panel {
  padding: 0;
  background: none;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  border-bottom: 2px solid var(--ink);
}
:root[data-variant="manifest"] .index-panel li + li { border-inline-start: 1px solid var(--ink); }
:root[data-variant="manifest"] .index-link { border-radius: 0; padding: var(--sp-5) var(--sp-4); }
:root[data-variant="manifest"] .index-icon { display: none; }
:root[data-variant="manifest"] .index-code {
  display: block;
  grid-row: span 2;
  align-self: start;
  font-family: var(--font-mono);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--barley-400);
}
:root[data-variant="manifest"] .index-name { font-family: var(--font-display); font-size: 1.125rem; text-transform: uppercase; }
@media (hover: hover) and (pointer: fine) {
  :root[data-variant="manifest"] .index-link:hover { background: var(--chaff-200); }
}
@media (max-width: 64rem) {
  :root[data-variant="manifest"] .index-panel li:nth-child(3) { border-inline-start: 0; }
  :root[data-variant="manifest"] .index-panel li:nth-child(n + 3) { border-top: 1px solid var(--ink); }
}
@media (max-width: 52rem) {
  :root[data-variant="manifest"] .hero-lede,
  :root[data-variant="manifest"] .hero-actions { grid-column: 1 / -1; justify-content: flex-start; }
  :root[data-variant="manifest"] .hg-aerial { aspect-ratio: 16 / 9; }
}
@media (max-width: 34rem) {
  :root[data-variant="manifest"] .index-panel li + li { border-inline-start: 0; border-top: 1px solid var(--ink); }
}

/* Company */
:root[data-variant="manifest"] .section { border-top: 2px solid var(--ink); }
:root[data-variant="manifest"] #company { border-top: 0; }
:root[data-variant="manifest"] .facts { border-top: 2px solid var(--ink); }
:root[data-variant="manifest"] .fact + .fact { border-inline-start-color: var(--ink); }
:root[data-variant="manifest"] .fact dd { font-family: var(--font-display); font-size: 1.25rem; font-weight: 500; }
:root[data-variant="manifest"] .photo-frame::after { box-shadow: inset 0 0 0 1px var(--ink); }

/* Commodities as ruled rows */
:root[data-variant="manifest"] .commodities { background: var(--chaff-100); }
:root[data-variant="manifest"] .crop-grid { display: block; border-top: 2px solid var(--ink); }
:root[data-variant="manifest"] .crop {
  grid-template-columns: minmax(0, 18rem) minmax(0, 1fr);
  grid-template-rows: none;
  gap: var(--sp-6);
  padding: var(--sp-6) 0;
  background: none;
  border-radius: 0;
  box-shadow: none;
  border-bottom: 1px solid var(--ink);
  overflow: visible;
}
:root[data-variant="manifest"] .crop-media { height: auto; aspect-ratio: 4 / 3; }
:root[data-variant="manifest"] .crop-body {
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto auto 1fr;
  column-gap: var(--sp-6);
  padding: 0;
}
:root[data-variant="manifest"] .crop-body > h3 { grid-column: 1; font-size: var(--fs-xl); text-transform: uppercase; font-weight: 700; line-height: 1; }
:root[data-variant="manifest"] .crop-body > p,
:root[data-variant="manifest"] .crop-body > .chips { grid-column: 1; }
:root[data-variant="manifest"] .crop-foot {
  grid-column: 2;
  grid-row: 1 / span 3;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
  border-top: 0;
  padding-top: 0;
}
:root[data-variant="manifest"] .crop-tag { background: var(--ink); color: var(--chaff-50); }
:root[data-variant="manifest"] .chip { background: transparent; box-shadow: inset 0 0 0 1px var(--ink); font-family: var(--font-mono); font-size: 0.8125rem; }
@media (hover: hover) and (pointer: fine) {
  :root[data-variant="manifest"] .crop:hover { box-shadow: none; }
  :root[data-variant="manifest"] .chip:hover { background: var(--ink); color: var(--chaff-50); box-shadow: inset 0 0 0 1px var(--ink); }
  :root[data-variant="manifest"] .chip:hover .icon { color: var(--chaff-50); }
}
@media (max-width: 60rem) {
  :root[data-variant="manifest"] .crop-body { grid-template-columns: 1fr; }
  :root[data-variant="manifest"] .crop-foot { grid-column: 1; grid-row: auto; align-items: stretch; margin-top: var(--sp-3); }
}
@media (max-width: 40rem) {
  :root[data-variant="manifest"] .crop { grid-template-columns: 1fr; gap: var(--sp-4); }
}

/* Quote as an ink band */
:root[data-variant="manifest"] .panorama { height: auto; background: var(--ink); padding-block: clamp(3rem, 2rem + 5vw, 6rem); }
:root[data-variant="manifest"] .panorama-media { display: none; }
:root[data-variant="manifest"] .panorama-copy { padding-bottom: 0; }
:root[data-variant="manifest"] .panorama-copy blockquote { max-width: 20ch; font-size: clamp(2.25rem, 1rem + 4.5vw, 5rem); text-transform: uppercase; font-weight: 700; line-height: 0.92; }
:root[data-variant="manifest"] .panorama-copy .mono { color: var(--barley-300); }

/* Markets: paper, ruled region table, light globe */
:root[data-variant="manifest"] .markets {
  --bg: var(--chaff-100);
  --surface: var(--chaff-50);
  --text: var(--ink);
  --text-muted: var(--loam-600);
  --text-subtle: var(--loam-500);
  --line: rgb(21 21 20 / 0.16);
  --line-strong: var(--ink);
  --accent-text: var(--barley-700);
  --focus: var(--ink);
}
:root[data-variant="manifest"] .markets::before { display: none; }
:root[data-variant="manifest"] .markets .btn:hover { --btn-ring: var(--ink); background: var(--ink); color: var(--chaff-50); }
:root[data-variant="manifest"] .region-list { gap: 0 var(--sp-5); border-top: 2px solid var(--ink); }
:root[data-variant="manifest"] .region-btn {
  background: none;
  box-shadow: none;
  border-bottom: 1px solid var(--ink);
  color: var(--ink);
  padding-inline: var(--sp-2);
}
:root[data-variant="manifest"] .region-dot { border-radius: 0; }
:root[data-variant="manifest"] .region-btn[aria-pressed="true"] { background: var(--ink); color: var(--chaff-50); box-shadow: none; }
:root[data-variant="manifest"] .region-btn[aria-pressed="true"] .region-dot { background: var(--barley-300); box-shadow: none; }
:root[data-variant="manifest"] .region-btn[aria-pressed="true"] .region-meta { color: var(--chaff-300); }
@media (hover: hover) and (pointer: fine) {
  :root[data-variant="manifest"] .region-btn:hover { background: var(--chaff-200); color: var(--ink); box-shadow: none; }
  :root[data-variant="manifest"] .region-btn[aria-pressed="true"]:hover { background: var(--loam-700); color: var(--chaff-50); box-shadow: none; }
}
:root[data-variant="manifest"] .region-detail { background: var(--chaff-50); box-shadow: none; border: 1px solid var(--ink); border-left: 4px solid var(--barley-400); }
:root[data-variant="manifest"] .region-detail h3 { text-transform: uppercase; font-weight: 700; }
:root[data-variant="manifest"] .region-dest .icon { color: var(--barley-400); }
:root[data-variant="manifest"] .globe-stage::before { background: radial-gradient(circle at 38% 34%, #fbfaf6 0%, #ebe6db 75%); box-shadow: none; }
:root[data-variant="manifest"] .globe-label { background: var(--ink); color: var(--chaff-50); box-shadow: none; }

/* Process */
:root[data-variant="manifest"] .step { padding-top: var(--sp-5); border-top: 2px solid var(--ink); }
:root[data-variant="manifest"] .step::before { display: none; }
:root[data-variant="manifest"] .step-marker { position: static; margin-bottom: var(--sp-5); width: 2.5rem; height: 2.5rem; border-radius: 0; color: #fff; }
:root[data-variant="manifest"] .step h3 { font-size: 1.5rem; text-transform: uppercase; font-weight: 700; }
@media (max-width: 52rem) {
  :root[data-variant="manifest"] .step { padding-inline-start: 0; }
}

/* Contact */
:root[data-variant="manifest"] .contact { background: var(--chaff-200); }
:root[data-variant="manifest"] .form-card { box-shadow: none; border: 1px solid var(--ink); }
:root[data-variant="manifest"] .form-card .h3 { text-transform: uppercase; font-weight: 700; }
:root[data-variant="manifest"] .notice { background: var(--barley-200); border-left: 4px solid var(--barley-400); }
:root[data-variant="manifest"] .notice .icon { color: var(--barley-700); }
:root[data-variant="manifest"] .badge { background: var(--barley-400); color: #fff; }
:root[data-variant="manifest"] .input { border-color: var(--ink); background: var(--chaff-50); }
:root[data-variant="manifest"] .field label { font-family: var(--font-mono); font-size: var(--fs-label); font-weight: 500; text-transform: uppercase; letter-spacing: 0.06em; }
:root[data-variant="manifest"] .summary { background: var(--chaff-100); }

/* Footer */
:root[data-variant="manifest"] .site-footer { background: var(--ink); }
:root[data-variant="manifest"] .site-footer .brand-mark rect { fill: var(--chaff-50); }
:root[data-variant="manifest"] .site-footer .brand-mark path:first-of-type { stroke: var(--barley-400); }