/* Hide the SSR pre-rendered content once the stylesheet loads.
   SEO crawlers that don't load CSS still see the HTML for indexing. */
.seo-prerender { display: none !important; }

:root {
  --bg: #ffffff;
  --surface: #ffffff;
  --surface-soft: #fbfdff;
  --surface-tint: #ffffff;
  --border: rgba(18, 42, 96, 0.1);
  --border-strong: #c8d8f2;
  --text: #16243c;
  --text-soft: #51617e;
  --text-muted: #7d8ba4;
  --accent: #365f9f;
  --accent-soft: rgba(54, 95, 159, 0.12);
  --accent-strong: #132a60;
  --success: rgba(47, 109, 84, 0.14);
  --success-text: #2f6d54;
  --negative: rgba(170, 75, 66, 0.12);
  --negative-text: #aa4b42;
  --navy: #132a60;
  --navy-soft: #1d3f86;
  --footer: #112956;
  --footer-border: rgba(255, 255, 255, 0.18);
  --shadow-soft: 0 18px 38px rgba(9, 24, 48, 0.08);
  --shadow-card: 0 10px 24px rgba(9, 24, 48, 0.06);
  --shadow-hover: 0 18px 34px rgba(9, 24, 48, 0.1);
  --radius-lg: 18px;
  --radius-md: 14px;
  --radius-sm: 10px;
  --surface-raised: color-mix(in srgb, var(--surface) 96%, var(--bg) 4%);
  --surface-muted: color-mix(in srgb, var(--surface-soft) 84%, var(--bg) 16%);
  --surface-interactive: color-mix(in srgb, var(--accent) 6%, var(--surface));
  --border-subtle: color-mix(in srgb, var(--border) 90%, transparent);
  --border-panel: color-mix(in srgb, var(--border-strong) 28%, var(--border));
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-height: 100vh;
  font-family: "Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif;
  color: var(--text);
  background-color: var(--bg);
  background-image: linear-gradient(180deg, var(--bg) 0%, var(--bg) 100%);
}

a {
  color: inherit;
  text-decoration: none;
}

a:focus-visible,
button:focus-visible,
input:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

button,
input,
select {
  font: inherit;
}

button {
  cursor: pointer;
}

img {
  display: block;
  max-width: 100%;
}

.insights-app {
  min-height: 0;
}

.insights-app::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(color-mix(in srgb, var(--navy) 4%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--navy) 4%, transparent) 1px, transparent 1px);
  background-size: 36px 36px;
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.22), transparent 60%);
  opacity: 0.05;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 28px;
  padding: 18px 38px 16px;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  backdrop-filter: blur(22px);
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.04);
}

.brandmark {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 4px 0;
  text-decoration: none;
}

.brand-wordmark {
  display: inline-flex;
  align-items: baseline;
  gap: 0;
}

.brand-wordmark__ledger {
  color: var(--navy);
}

.brand-wordmark__touch {
  color: var(--accent);
}

.brandmark__seal {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.02em;
  width: 38px;
  height: 38px;
  border-radius: 14px;
  background: linear-gradient(145deg, var(--footer), color-mix(in srgb, var(--footer) 74%, var(--navy) 26%));
  font-size: 0.86rem;
  font-weight: 800;
  letter-spacing: 0;
  box-shadow: 0 16px 34px color-mix(in srgb, var(--footer) 20%, transparent);
}

.brandmark__seal-letter--ledger {
  color: color-mix(in srgb, white 86%, var(--surface) 14%);
}

.brandmark__seal-letter--touch {
  color: color-mix(in srgb, var(--accent) 84%, white 16%);
}

.brandmark__copy {
  display: grid;
  gap: 2px;
}

.brandmark__title {
  font-size: 1.08rem;
  font-weight: 800;
  letter-spacing: -0.04em;
}

.brandmark__subtitle {
  color: var(--text-soft);
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.primary-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  gap: 34px;
  min-width: 0;
}

.primary-nav a {
  position: relative;
  padding: 6px 0;
  color: var(--text-soft);
  font-size: 0.96rem;
  font-weight: 600;
}

.primary-nav a.is-active {
  color: var(--accent);
}

.primary-nav a.is-active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -11px;
  height: 3px;
  border-radius: 999px;
  background: var(--accent);
}

.topbar__actions {
  display: flex;
  align-items: center;
  gap: 14px;
  justify-self: end;
}

.searchbox {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  width: 312px;
  padding: 0 18px;
  height: 48px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.searchbox__icon,
[data-icon] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  color: var(--text-soft);
}

.searchbox input {
  width: 100%;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--text);
  font-size: 0.92rem;
}

.searchbox input::placeholder {
  color: var(--text-muted);
}

.icon-button,
.theme-switch,
.avatar-button {
  border: 0;
  background: transparent;
}

.icon-button {
  width: 44px;
  height: 44px;
  border-radius: 50%;
}

.icon-button:hover {
  background: rgba(32, 72, 198, 0.06);
}

.theme-switch {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  min-width: 44px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  color: var(--navy);
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.theme-switch:hover {
  border-color: color-mix(in srgb, var(--navy) 22%, var(--border-strong));
  box-shadow: var(--shadow-card);
}

.theme-switch span[data-icon] {
  width: 15px;
  height: 15px;
}

.avatar-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface) 92%, white) 0%, color-mix(in srgb, var(--surface-soft) 80%, white) 100%);
}

.avatar-button__face {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 36%, #ffd7bc 0 24%, transparent 24.5%),
    radial-gradient(circle at 50% 83%, #1a3d8f 0 37%, transparent 37.5%),
    radial-gradient(circle at 50% 22%, #18263f 0 19%, transparent 19.5%),
    linear-gradient(180deg, #f8d7bb 0%, #ffd7bc 100%);
  box-shadow: inset 0 -8px 0 rgba(255, 255, 255, 0.15);
}

.theme-panel {
  position: fixed;
  top: 74px;
  right: 40px;
  z-index: 30;
  width: 320px;
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface) 96%, transparent);
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(24px);
}

.theme-panel__label {
  margin: 0 0 12px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.theme-panel__options {
  display: grid;
  gap: 10px;
}

.theme-swatch {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: 12px;
  padding: 12px;
  border: 1px solid transparent;
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface-soft) 70%, transparent);
}

.theme-swatch.is-active {
  border-color: color-mix(in srgb, var(--navy) 28%, var(--border-strong));
  background: color-mix(in srgb, var(--navy) 8%, var(--surface));
}

.theme-swatch__preview {
  display: grid;
  gap: 8px;
  justify-items: start;
}

.theme-swatch__dots {
  display: flex;
  gap: 6px;
}

.theme-swatch__dots span {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}

.theme-swatch__mode {
  display: inline-flex;
  min-height: 20px;
  align-items: center;
  padding: 0 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  color: var(--text-soft);
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.theme-swatch__meta {
  display: grid;
  gap: 4px;
}

.theme-swatch__name {
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--text);
}

.theme-swatch__description {
  color: var(--text-soft);
  font-size: 0.72rem;
  line-height: 1.5;
}

.page-wrap {
  padding: 30px 28px 40px;
}

.page-grid {
  display: grid;
  grid-template-columns: 286px minmax(0, 1fr);
  gap: 54px;
  align-items: start;
}

.left-rail {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
  padding-top: 6px;
}

.rail-heading {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 46px;
}

.rail-heading__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(180deg, var(--accent) 0%, var(--navy) 100%);
  color: #fff;
}

.rail-heading__title {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--navy);
}

.rail-heading__meta,
.rail-link,
.sidebar-copy,
.metric-card__label,
.analyst-card__role,
.feature-meta,
.story-card__eyebrow,
.detail-kicker,
.report-breadcrumb,
.detail-meta__label,
.related-card__meta,
.download-note,
.footer-label,
.footer-bottom {
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.rail-heading__meta,
.rail-link,
.sidebar-copy,
.metric-card__label,
.analyst-card__role,
.story-card__eyebrow,
.detail-kicker,
.report-breadcrumb,
.detail-meta__label,
.related-card__meta,
.download-note,
.footer-label,
.footer-bottom {
  font-size: 0.7rem;
  font-weight: 700;
}

.rail-heading__meta,
.sidebar-copy,
.story-card__summary,
.quote-block__credit,
.detail-paragraph,
.footer-copy,
.footer-links a,
.footer-bottom,
.support-links a,
.download-note,
.detail-body,
.hero-subtitle,
.market-copy {
  color: var(--text-soft);
}

.category-nav {
  display: grid;
  gap: 14px;
}

.category-button {
  display: grid;
  grid-template-columns: 18px 1fr;
  align-items: center;
  gap: 16px;
  width: 100%;
  padding: 16px 18px;
  border: 1px solid transparent;
  border-radius: 14px;
  background: transparent;
  color: var(--navy);
  text-align: left;
}

.category-button__icon {
  width: 18px;
  height: 18px;
  color: var(--text-soft);
}

.category-button__icon svg {
  width: 18px;
  height: 18px;
  stroke-width: 1.7;
}

.category-button__label {
  font-size: 0.96rem;
  font-weight: 600;
  letter-spacing: 0;
}

.category-button.is-active {
  border-color: var(--border);
  background: var(--surface);
  box-shadow: var(--shadow-card);
  color: var(--accent);
}

.category-divider {
  height: 1px;
  margin: 34px 0 36px;
  background: var(--border-strong);
}

.brand-finish-card {
  display: grid;
  gap: 12px;
  margin-bottom: 22px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
}

.brand-finish__eyebrow {
  margin: 0 0 4px;
  color: var(--text-muted);
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.brand-finish__title {
  margin: 0;
  color: var(--navy);
  font-size: 0.82rem;
  line-height: 1.4;
  letter-spacing: -0.01em;
}

.brand-finish__top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
}

.brand-finish__active {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface-soft) 65%, transparent);
}

.brand-finish__active-copy {
  color: var(--navy);
  font-size: 0.74rem;
  font-weight: 700;
}

.brand-finish__quick {
  display: grid;
  gap: 8px;
}

.brand-theme {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface-soft) 72%, transparent);
  text-align: left;
}

.brand-theme.is-active {
  border-color: color-mix(in srgb, var(--navy) 30%, var(--border-strong));
  background: color-mix(in srgb, var(--navy) 8%, var(--surface));
}

.brand-theme--compact {
  width: 100%;
  justify-content: flex-start;
}

.brand-theme__dots {
  display: flex;
  gap: 5px;
}

.brand-theme__dots span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.brand-theme__name {
  color: var(--navy);
  font-size: 0.72rem;
  font-weight: 700;
}

.brand-finish__button {
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  background: transparent;
  color: var(--navy);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.report-download {
  display: inline-flex;
  justify-content: center;
  width: 100%;
  padding: 17px 20px;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--navy) 0%, color-mix(in srgb, var(--navy) 78%, var(--accent)) 100%);
  color: #fff;
  font-size: 0.92rem;
  font-weight: 800;
  box-shadow: 0 18px 42px color-mix(in srgb, var(--navy) 22%, transparent);
}

.support-links {
  display: grid;
  gap: 20px;
  margin-top: 40px;
}

.support-links a {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 0.78rem;
  font-weight: 700;
}

.support-links a span:first-child {
  width: 18px;
  height: 18px;
}

.content-stage {
  min-width: 0;
}

.landing-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 334px;
  gap: 38px;
  align-items: start;
}

.landing-copy {
  min-width: 0;
}

.hero-kicker {
  margin: 0 0 10px;
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.hero-title {
  margin: 0;
  font-size: clamp(2.95rem, 5.2vw, 4.05rem);
  line-height: 0.95;
  letter-spacing: -0.065em;
  color: var(--navy);
}

.hero-subtitle {
  max-width: 28ch;
  margin: 18px 0 0;
  font-size: 0.98rem;
  line-height: 1.68;
}

.hero-meta-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 18px;
}

.hero-meta-pill {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-strong);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.hero-meta-copy {
  color: var(--text-soft);
  font-size: 0.86rem;
  font-weight: 600;
}

.hero-chip-row {
  display: flex;
  justify-content: flex-start;
  gap: 16px;
  margin-top: 18px;
}

.desk-ticker {
  overflow: hidden;
  margin-top: 22px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  box-shadow: var(--shadow-soft);
}

.desk-ticker__track {
  display: flex;
  align-items: center;
  gap: 10px;
  width: max-content;
  animation: deskTicker 24s linear infinite;
}

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

.desk-ticker__item {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
}

.desk-ticker__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent);
}

.desk-ticker__label {
  color: var(--text-soft);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.desk-ticker__value {
  color: var(--navy);
  font-size: 0.84rem;
  font-weight: 700;
}

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

.hero-chip {
  display: inline-flex;
  align-items: center;
  min-height: 56px;
  padding: 14px 18px;
  border-radius: 16px;
  background: var(--surface-soft);
  color: var(--navy);
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  transition:
    transform 160ms ease,
    box-shadow 160ms ease,
    background-color 160ms ease;
}

.hero-chip:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-card);
}

.hero-chip--live {
  background: color-mix(in srgb, var(--navy) 88%, white);
  color: #f7fbff;
}

.landing-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 334px;
  gap: 38px;
  margin-top: 34px;
  align-items: start;
}

.feature-card {
  display: grid;
  gap: 0;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  box-shadow: var(--shadow-soft);
  transition:
    transform 180ms ease,
    box-shadow 180ms ease;
}

.feature-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 46px rgba(15, 23, 42, 0.12);
}

.feature-card__media {
  position: relative;
  height: 320px;
  background: #0b1735;
}

.feature-card__art,
.story-card__art,
.related-card__art {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
}

.feature-card__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(6, 18, 50, 0.14) 0%, rgba(6, 18, 50, 0.44) 58%, rgba(6, 18, 50, 0.72) 100%),
    linear-gradient(120deg, rgba(0, 0, 0, 0.18), transparent 50%);
}

.feature-card__body {
  padding: 18px 20px 20px;
}

.feature-badges {
  position: absolute;
  left: 18px;
  bottom: 18px;
  z-index: 1;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.feature-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.feature-badge--navy {
  background: rgba(10, 28, 78, 0.88);
  color: #fff;
}

.feature-badge--green {
  background: rgba(124, 214, 110, 0.75);
  color: #d7ffd2;
}

.feature-title {
  max-width: 18ch;
  margin: 0;
  font-size: clamp(1.6rem, 2.4vw, 2.2rem);
  line-height: 1.15;
  letter-spacing: -0.04em;
  color: var(--navy);
}

.feature-summary {
  margin: 10px 0 0;
  color: var(--text-soft);
  font-size: 0.92rem;
  line-height: 1.65;
}

.feature-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--text-soft);
}

.feature-meta__dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--text-muted);
}

.landing-rail {
  display: grid;
  gap: 24px;
}

.rail-panel {
  border: 1px solid var(--border);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  box-shadow: var(--shadow-card);
}

.panel-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 18px;
}

.panel-heading h3,
.detail-panel h3,
.article-section-title,
.detail-related h3 {
  margin: 0;
  font-size: 0.96rem;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--navy);
}

.panel-heading__icon {
  width: 20px;
  height: 20px;
  color: var(--text-soft);
}

.value-panel {
  padding: 24px 22px;
}

.value-list {
  display: grid;
  gap: 8px;
}

.value-item {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  min-height: 42px;
  align-items: center;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
}

.value-item span {
  color: var(--text-soft);
  font-size: 0.78rem;
  font-weight: 600;
}

.value-item strong {
  color: var(--navy);
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.value-actions {
  display: grid;
  gap: 8px;
}

.value-actions a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-left: 3px solid var(--accent);
  border-radius: 12px;
  background: var(--surface-soft);
  color: var(--navy);
  font-size: 0.78rem;
  line-height: 1.45;
  font-weight: 600;
  transition: transform 160ms ease, background-color 160ms ease;
}

.value-actions a::after {
  content: '\2192';
  flex-shrink: 0;
  margin-left: 8px;
  color: var(--accent);
}

.value-actions a:hover {
  transform: translateX(2px);
  background: color-mix(in srgb, var(--accent) 6%, var(--surface-soft));
}

.story-card__title,
.related-card__title,
.detail-title,
.article-lead h2,
.article-section h2,
.quote-block,
.analyst-card__name {
  color: var(--navy);
}

.analyst-card {
  display: grid;
  grid-template-columns: 58px 1fr;
  align-items: center;
  gap: 14px;
  padding: 18px;
  border-radius: 16px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  transition:
    transform 160ms ease,
    box-shadow 160ms ease;
}

.analyst-card:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-card);
}

.analyst-card__avatar {
  width: 58px;
  height: 58px;
  border-radius: 16px;
  background-size: cover;
  background-position: center;
}

.analyst-card__name {
  margin: 0;
  font-size: 0.94rem;
  line-height: 1.2;
  font-weight: 700;
}

.analyst-card__role {
  margin-top: 7px;
  color: var(--text-soft);
}

.story-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 34px;
  margin-top: 38px;
}

.story-card {
  display: grid;
  gap: 16px;
  transition: transform 160ms ease;
}

.story-card:hover {
  transform: translateY(-2px);
}

.story-card--compact {
  align-content: start;
}

.story-card__media {
  position: relative;
  height: 292px;
  border-radius: 18px;
  overflow: hidden;
  background: linear-gradient(145deg, var(--navy), color-mix(in srgb, var(--navy) 72%, white 28%));
}

.story-card__media--compact {
  height: 220px;
}

.story-card__chip {
  position: absolute;
  top: 18px;
  right: 18px;
  z-index: 1;
  min-height: 34px;
  padding: 0 16px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--text-soft);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.story-card__eyebrow {
  margin: 0;
  color: var(--navy);
}

.story-card__title {
  margin: 0;
  font-size: 0.98rem;
  line-height: 1.35;
  font-weight: 700;
}

.story-card__summary {
  margin: 0;
  font-size: 0.96rem;
  line-height: 1.6;
}

.section-shell {
  margin-top: 52px;
}

.section-shell--stacked {
  margin-top: 64px;
}

.section-header {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 18px;
  margin-bottom: 24px;
}

.section-header__eyebrow {
  margin: 0 0 8px;
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.section-header__title,
.section-cluster__title {
  margin: 0;
  color: var(--navy);
  font-size: 1.08rem;
  line-height: 1.45;
  font-weight: 700;
  letter-spacing: -0.03em;
}

.section-link {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 18px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--navy);
  font-size: 0.82rem;
  font-weight: 700;
  transition:
    border-color 160ms ease,
    box-shadow 160ms ease,
    transform 160ms ease;
}

.section-link:hover {
  transform: translateY(-1px);
  border-color: var(--border-strong);
  box-shadow: var(--shadow-card);
}

.latest-grid,
.lane-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.section-cluster-list {
  display: grid;
  gap: 34px;
}

.section-cluster {
  padding: 26px;
  border: 1px solid var(--border);
  border-radius: 22px;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  box-shadow: var(--shadow-card);
}

.section-cluster__header {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: end;
  margin-bottom: 20px;
}

.detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 332px;
  gap: 42px;
  align-items: start;
}

.detail-main {
  min-width: 0;
}

.detail-header {
  max-width: 680px;
}

.report-breadcrumb {
  margin-bottom: 18px;
  color: var(--text-muted);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.report-breadcrumb a,
.report-breadcrumb span {
  transition: transform 180ms ease, color 180ms ease, opacity 180ms ease;
}

.report-breadcrumb a:hover {
  color: var(--navy);
  transform: translateX(1px);
}

.detail-title {
  margin: 0;
  max-width: 16ch;
  font-size: clamp(1.9rem, 3.5vw, 2.9rem);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.055em;
}

.detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  margin-top: 28px;
}

.detail-meta__item {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  padding-right: 26px;
  margin-right: 26px;
  border-right: 1px solid var(--border);
}

.detail-meta__item:last-child {
  border-right: 0;
  padding-right: 0;
  margin-right: 0;
}

.detail-meta__item--text {
  grid-template-columns: 1fr;
}

.detail-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: var(--navy);
  color: #fff;
}

.detail-meta__value {
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--navy);
  line-height: 1.4;
}

.detail-side {
  display: grid;
  gap: 16px;
}

.detail-related {
  position: sticky;
  top: 102px;
  align-content: start;
}

.detail-panel,
.indicator-card,
.related-card,
.download-card,
.quote-block,
.chart-card {
  border-radius: 16px;
  background: var(--surface);
  box-shadow: var(--shadow-card);
}

.detail-panel {
  padding: 24px 24px 26px;
}

.detail-panel h3 {
  margin: 0 0 14px;
}

.detail-facts {
  display: grid;
  gap: 8px;
}

.detail-fact {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  min-height: 40px;
  padding: 0 10px;
  border-radius: 11px;
  border: 1px solid var(--border);
  background: var(--surface-soft);
}

.detail-fact span {
  color: var(--text-soft);
  font-size: 0.76rem;
  font-weight: 600;
}

.detail-fact strong {
  color: var(--navy);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.source-links {
  display: grid;
  gap: 8px;
}

.source-links a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--surface-soft);
  color: var(--navy);
  font-size: 0.76rem;
  line-height: 1.4;
  font-weight: 600;
}

.value-actions--tight a {
  min-height: 42px;
  font-size: 0.76rem;
}

.related-list {
  display: grid;
  gap: 12px;
}

.market-label {
  margin: 0 0 10px;
  padding-top: 16px;
  margin-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--text-muted);
}

.detail-hero-image {
  width: 100%;
  border-radius: 16px;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  margin-top: 28px;
}


.detail-hero-image--interactive {
  cursor: zoom-in;
  transition: transform 0.24s ease, box-shadow 0.24s ease;
}

.detail-hero-image--interactive:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 40px rgba(16, 36, 95, 0.12);
}

.detail-author-initials {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: var(--navy);
  color: #fff;
  font-size: 0.88rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}

@keyframes fadeSlideUp {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

.article-body {
  margin-top: 34px;
  animation: fadeSlideUp 0.5s cubic-bezier(0.22,1,0.36,1) 0.15s both;
}

.article-lead {
  max-width: 680px;
  animation: fadeSlideUp 0.45s cubic-bezier(0.22,1,0.36,1) 0.05s both;
}

.article-lead p,
.article-section p,
.article-body > p {
  margin: 0 0 1.5em;
  font-size: 1rem;
  line-height: 1.75;
  color: var(--text);
}

.article-lead p:last-child,
.article-section p:last-child,
.article-body > p:last-child {
  margin-bottom: 0;
}

.article-lead p {
  font-size: 1.1rem;
}

.article-section {
  max-width: 680px;
  margin-top: 38px;
}

.article-section--context {
  margin-top: 0;
  padding: 18px 22px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--accent) 6%, var(--surface-soft));
  border: 1px solid var(--border);
  margin-bottom: 28px;
}

.article-section--context p {
  font-size: 0.92rem;
  font-style: italic;
  color: var(--text-soft);
}

.article-section--context h2 {
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 8px;
}

.article-section--summary {
  margin-top: 0;
  padding: 18px 22px;
  border-radius: 16px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface-soft) 72%, white);
}

.article-section--summary h2 {
  margin-bottom: 10px;
}

.article-section--summary p {
  color: var(--text-soft);
  font-size: 0.94rem;
}

.article-section h2 {
  margin: 0 0 16px;
  font-size: 1.15rem;
  font-weight: 600;
  letter-spacing: -0.04em;
  color: var(--text);
}

.quote-block {
  max-width: 540px;
  margin: 34px 0 0;
  padding: 20px 24px;
  border-left: 3px solid var(--accent);
  font-size: 1.06rem;
  line-height: 1.5;
  font-style: italic;
}

.quote-block__credit {
  display: block;
  margin-top: 16px;
  color: var(--text-soft);
  font-size: 12px;
  font-style: normal;
  font-variant: small-caps;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.article-section-title {
  margin: 58px 0 18px;
  color: var(--text);
  font-weight: 600;
  font-size: 1.15rem;
}

.article-markdown {
  max-width: 720px;
}

.article-markdown > *:first-child {
  margin-top: 0;
}

.article-markdown p,
.article-markdown ul,
.article-markdown ol,
.article-markdown blockquote,
.article-markdown pre,
.article-markdown figure {
  margin: 0 0 1.4rem;
}

.article-markdown h2,
.article-markdown h3,
.article-markdown h4 {
  margin: 2.4rem 0 1rem;
  color: var(--text);
  font-weight: 700;
  letter-spacing: -0.03em;
}

.article-markdown h2 {
  font-size: 1.35rem;
}

.article-markdown h3 {
  font-size: 1.15rem;
}

.article-markdown .article-subheading {
  margin: 2.4rem 0 1rem;
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.03em;
  color: var(--text);
}

.article-markdown ul,
.article-markdown ol {
  padding-left: 1.25rem;
  color: var(--text);
  line-height: 1.8;
}

.article-markdown li + li {
  margin-top: 0.45rem;
}

.article-markdown a {
  color: var(--accent-strong);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.16em;
}

.article-markdown strong {
  color: var(--navy);
}

.article-markdown em {
  color: var(--text-soft);
}

.article-markdown hr {
  margin: 2rem 0;
  border: 0;
  border-top: 1px solid var(--border);
}

.article-markdown blockquote {
  max-width: 640px;
  padding: 18px 22px;
  border-left: 3px solid var(--accent);
  background: color-mix(in srgb, var(--surface-soft) 68%, white);
  color: var(--text-soft);
  font-style: italic;
}

.article-markdown blockquote p:last-child {
  margin-bottom: 0;
}

.article-figure {
  margin: 1.75rem 0;
}

.article-figure__image {
  width: 100%;
  border-radius: 18px;
  display: block;
}

.article-figure__caption {
  margin-top: 0.7rem;
  color: var(--text-muted);
  font-size: 0.8rem;
  text-align: center;
}

/* Code blocks */
.article-code {
  position: relative;
  margin: 24px 0;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface-soft) 90%, var(--bg));
}

.article-code__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 16px;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface-soft) 60%, var(--bg));
}

.article-code__copy {
  cursor: pointer;
  border: none;
  background: none;
  color: var(--accent);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transition: color 0.15s;
}

.article-code__copy:hover {
  color: var(--accent-strong);
}

.article-code pre {
  margin: 0;
  padding: 16px;
  overflow-x: auto;
  font-family: 'JetBrains Mono', 'Fira Code', 'SF Mono', Menlo, Consolas, monospace;
  font-size: 0.82rem;
  line-height: 1.7;
  tab-size: 2;
  color: var(--text);
}

.article-code code {
  font-family: inherit;
}

/* Inline code */
.article-body code:not(.article-code code),
.article-lead code:not(.article-code code),
.article-section code:not(.article-code code) {
  padding: 2px 6px;
  border-radius: 6px;
  font-size: 0.88em;
  font-family: 'JetBrains Mono', 'Fira Code', monospace;
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
  color: var(--accent-strong);
}

/* Syntax token colors */
.tok-keyword { color: #8b5cf6; font-weight: 600; }
.tok-string { color: #059669; }
.tok-number { color: #d97706; }
.tok-comment { color: var(--text-muted); font-style: italic; }
.tok-function { color: #2563eb; }
.tok-operator { color: #dc2626; }
.tok-type { color: #0891b2; }
.tok-property { color: #7c3aed; }

[data-theme="ledger-noir"] .tok-keyword,
[data-theme="afterhours-ink"] .tok-keyword { color: #c084fc; }
[data-theme="ledger-noir"] .tok-string,
[data-theme="afterhours-ink"] .tok-string { color: #6ee7b7; }
[data-theme="ledger-noir"] .tok-number,
[data-theme="afterhours-ink"] .tok-number { color: #fbbf24; }
[data-theme="ledger-noir"] .tok-function,
[data-theme="afterhours-ink"] .tok-function { color: #93c5fd; }
[data-theme="ledger-noir"] .tok-type,
[data-theme="afterhours-ink"] .tok-type { color: #67e8f9; }

.chart-card {
  width: min(100%, 560px);
  padding: 18px 20px 20px;
  border: 1px solid var(--border);
}

.chart-card--interactive {
  cursor: zoom-in;
  transition: border-color 0.24s ease, box-shadow 0.24s ease, transform 0.24s ease;
}

.chart-card--interactive:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent) 42%, var(--border));
  box-shadow: 0 20px 40px rgba(16, 36, 95, 0.08);
}

.chart-card svg {
  height: 260px;
}

.chart-caption {
  margin: 0 0 16px;
  font-size: 0.76rem;
  font-weight: 800;
  color: var(--navy);
  letter-spacing: 0.08em;
}

.chart-subcaption {
  display: block;
  margin-top: 6px;
  font-size: 0.72rem;
  color: var(--text-soft);
  letter-spacing: normal;
  text-transform: none;
}

.research-disclaimer {
  max-width: 680px;
  margin-top: 38px;
  padding: 20px 22px;
  border: 1px solid var(--border);
  border-left: 3px solid var(--accent);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface-soft) 78%, transparent);
}

.research-disclaimer h3 {
  margin: 0 0 10px;
  color: var(--navy);
  font-size: 0.76rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.research-disclaimer h3::before {
  content: 'DISCLOSURE';
  display: block;
  margin-bottom: 6px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--accent);
}

.research-disclaimer p {
  margin: 0;
  color: var(--text-soft);
  font-size: 0.84rem;
  line-height: 1.65;
}

.research-disclaimer p + p {
  margin-top: 8px;
}

.related-card {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  overflow: hidden;
  transition:
    transform 160ms ease,
    box-shadow 160ms ease;
}

.related-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-soft);
}

.related-card__media {
  position: relative;
  height: 108px;
  background: var(--footer);
}

.related-card__body {
  padding: 0 4px 4px;
}

.related-card__title {
  margin: 0;
  font-size: 0.85rem;
  line-height: 1.45;
  font-weight: 700;
}

.related-card__meta {
  margin-top: 8px;
  color: var(--text-soft);
}

.download-card {
  display: grid;
  justify-items: center;
  gap: 10px;
  padding: 22px 18px 18px;
  background: var(--surface-soft);
}

.download-card__button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 204px;
  min-height: 48px;
  padding: 0 20px;
  border: 1px solid var(--navy);
  border-radius: 12px;
  background: transparent;
  color: var(--navy);
  font-size: 0.82rem;
  font-weight: 800;
  transition:
    transform 160ms ease,
    background-color 160ms ease,
    color 160ms ease;
}

.download-card__button:hover {
  transform: translateY(-1px);
  background: var(--navy);
  color: #fff;
}

.page-footer {
  margin-top: 32px;
  border-top: 1px solid var(--border);
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface) 40%, transparent) 0%, color-mix(in srgb, var(--surface) 74%, transparent) 100%);
  color: var(--text);
}

.page-footer__inner {
  padding: 42px 42px 22px;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr 1.1fr;
  gap: 34px;
}

.footer-brand {
  font-size: 1.55rem;
  font-weight: 800;
  letter-spacing: -0.05em;
  color: var(--navy);
}

.footer-copy {
  max-width: 34ch;
  margin-top: 20px;
  font-size: 0.92rem;
  line-height: 1.8;
  color: var(--text-soft);
}

.footer-socials {
  display: flex;
  gap: 12px;
  margin-top: 20px;
}

.footer-socials a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 32px;
  height: 36px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid var(--border);
  color: var(--navy);
  background: var(--surface);
  font-size: 0.74rem;
  font-weight: 600;
}

.footer-socials a [data-icon],
.footer-socials a svg {
  width: 20px;
  height: 20px;
}

.footer-label {
  margin: 0 0 18px;
  color: var(--text-muted);
}

.footer-links {
  display: grid;
  gap: 12px;
}

.footer-links a {
  font-size: 0.86rem;
  color: var(--text-soft);
}

.footer-newsletter {
  display: grid;
  gap: 14px;
}

.footer-newsletter__copy {
  font-size: 0.86rem;
  line-height: 1.7;
  color: var(--text-soft);
}

.footer-newsletter__form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  background: var(--surface);
}

.footer-newsletter__form input {
  min-height: 42px;
  padding: 0 14px;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--navy);
}

.footer-newsletter__form input::placeholder {
  color: var(--text-muted);
}

.footer-newsletter__form button {
  min-height: 44px;
  min-width: 72px;
  border: 0;
  background: var(--navy);
  color: #fff;
  font-weight: 800;
}

.footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 34px;
  padding-top: 18px;
  border-top: 1px solid var(--border);
  color: var(--text-soft);
}

.footer-bottom a {
  color: var(--text-soft);
}

.footer-bottom__links {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}

.empty-state {
  padding: 28px;
  border-radius: 18px;
  background: var(--surface);
  box-shadow: var(--shadow-card);
  color: var(--text-soft);
  font-size: 0.94rem;
  line-height: 1.7;
}

@media (max-width: 1220px) {
  .topbar {
    grid-template-columns: 1fr;
    justify-items: start;
    gap: 18px;
  }

  .topbar__actions {
    width: 100%;
    flex-wrap: wrap;
  }

  .searchbox {
    width: min(100%, 360px);
  }

  .page-grid,
  .landing-main,
  .landing-hero,
  .detail-layout,
  .footer-grid {
    grid-template-columns: 1fr;
  }

  .left-rail {
    position: static;
  }

  .story-grid {
    grid-template-columns: 1fr;
  }

  .latest-grid,
  .lane-grid {
    grid-template-columns: 1fr;
  }

  .detail-related {
    position: static;
  }
}

@media (max-width: 840px) {
  .topbar,
  .page-wrap,
  .page-footer__inner {
    padding-left: 18px;
    padding-right: 18px;
  }

  .topbar {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding-top: 14px;
    padding-bottom: 14px;
  }

  .primary-nav {
    width: 100%;
    grid-column: 1 / -1;
    gap: 16px;
    overflow-x: auto;
    padding-bottom: 2px;
    justify-content: flex-start;
  }

  .topbar__actions {
    width: auto;
    justify-content: flex-end;
    gap: 10px;
  }

  .topbar__actions .searchbox,
  .topbar__actions .icon-button {
    display: none;
  }

  .searchbox {
    width: 100%;
  }

  .page-grid {
    gap: 28px;
  }

  .landing-hero,
  .landing-main {
    gap: 24px;
  }

  .section-header,
  .section-cluster__header {
    flex-direction: column;
    align-items: start;
  }

  .hero-meta-row {
    flex-wrap: wrap;
  }

  .theme-switch {
    min-width: 0;
    padding-inline: 12px;
  }

  .theme-switch span:last-child {
    display: none;
  }

  .avatar-button {
    width: 42px;
    min-width: 42px;
    height: 42px;
  }

  .hero-subtitle {
    max-width: 100%;
  }

  .hero-chip-row {
    flex-wrap: wrap;
  }

  .hero-title,
  .detail-title {
    font-size: 2.95rem;
  }

  .feature-card {
    border-radius: 16px;
  }

  .feature-card__media {
    height: 248px;
  }

  .feature-title {
    font-size: 1.55rem;
    max-width: 100%;
  }

  .detail-meta {
    display: grid;
    gap: 16px;
  }

  .detail-meta__item {
    margin: 0;
    padding: 0;
    border-right: 0;
  }

  .quote-block,
  .chart-card {
    width: 100%;
  }

  .brand-finish-card,
  .category-divider,
  .report-download,
  .support-links {
    display: none;
  }

  .left-rail {
    gap: 18px;
  }

  .footer-bottom {
    flex-direction: column;
  }
}

@media (max-width: 480px) {
  .topbar,
  .page-wrap,
  .page-footer__inner {
    padding-left: 14px;
    padding-right: 14px;
  }

  .hero-title,
  .detail-title {
    font-size: clamp(1.8rem, 7vw, 2.6rem);
  }

  .feature-title {
    font-size: 1.35rem;
  }

  .feature-card__media {
    height: 200px;
  }

  .primary-nav {
    gap: 12px;
    font-size: 0.82rem;
  }

  .topbar__brand {
    font-size: 1.15rem;
  }
}

/* ═══════════════════════════════════════════════════
   PREMIUM ANIMATIONS & INTERACTIONS
   ═══════════════════════════════════════════════════ */

/* ─── Scroll-triggered reveal animations ─── */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal.revealed {
  opacity: 1;
  transform: translateY(0);
}

.reveal-delay-1 { transition-delay: 0.08s; }
.reveal-delay-2 { transition-delay: 0.16s; }
.reveal-delay-3 { transition-delay: 0.24s; }
.reveal-delay-4 { transition-delay: 0.32s; }

.reveal-scale {
  opacity: 0;
  transform: scale(0.95);
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1), transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-scale.revealed {
  opacity: 1;
  transform: scale(1);
}

.reveal-left {
  opacity: 0;
  transform: translateX(-30px);
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1), transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-left.revealed {
  opacity: 1;
  transform: translateX(0);
}

.reveal-right {
  opacity: 0;
  transform: translateX(30px);
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1), transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-right.revealed {
  opacity: 1;
  transform: translateX(0);
}

/* ─── Card hover micro-interactions ─── */
.story-card {
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease;
}

.story-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 24px 48px rgba(19, 42, 96, 0.12);
}

.story-card__media {
  overflow: hidden;
}

.story-card__art {
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.story-card:hover .story-card__art {
  transform: scale(1.05);
}

.feature-card {
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s ease;
}

.feature-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 32px 64px rgba(19, 42, 96, 0.14);
}

.feature-card__art {
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.feature-card:hover .feature-card__art {
  transform: scale(1.04);
}

/* ─── Related card hover ─── */
.related-card {
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease, border-color 0.3s ease;
}

.related-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 32px rgba(19, 42, 96, 0.1);
  border-color: var(--accent);
}

/* ─── Button interactions ─── */
.report-download,
.category-button,
.action-card {
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease, background-color 0.25s ease;
}

.report-download:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(19, 42, 96, 0.18);
}

.report-download:active {
  transform: translateY(0) scale(0.98);
}

.category-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(19, 42, 96, 0.08);
}

/* ─── Action cards with arrow animation ─── */
.action-card {
  position: relative;
  overflow: hidden;
}

.action-card::after {
  content: '→';
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%) translateX(-4px);
  opacity: 0;
  transition: opacity 0.3s ease, transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  font-weight: 700;
  color: var(--accent);
}

.action-card:hover::after {
  opacity: 1;
  transform: translateY(-50%) translateX(0);
}

.action-card:hover {
  padding-right: 40px;
  background-color: var(--accent-soft);
}

/* ─── Hero image parallax-lite on scroll ─── */
.detail-hero-image {
  transition: transform 0.1s linear;
  will-change: transform;
}

/* ─── Smooth page transitions ─── */
.page-transition-enter {
  opacity: 0;
  transform: translateY(12px);
}

.page-transition-active {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1), transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

/* ─── Reading progress bar ─── */
.reading-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--navy), var(--accent));
  z-index: 9999;
  transition: width 0.1s linear;
  border-radius: 0 2px 2px 0;
}

/* ─── Topbar scroll effect ─── */
.topbar {
  transition: background-color 0.3s ease, box-shadow 0.3s ease, padding 0.3s ease;
}

.topbar--scrolled {
  box-shadow: 0 4px 20px rgba(19, 42, 96, 0.08);
}

/* ─── Chart bar animation ─── */
.chart-bar {
  transform-origin: bottom;
  animation: chartGrow 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes chartGrow {
  from {
    transform: scaleY(0);
    opacity: 0;
  }
  to {
    transform: scaleY(1);
    opacity: 1;
  }
}

.chart-bar:nth-child(1) { animation-delay: 0.1s; }
.chart-bar:nth-child(2) { animation-delay: 0.2s; }
.chart-bar:nth-child(3) { animation-delay: 0.3s; }
.chart-bar:nth-child(4) { animation-delay: 0.4s; }
.chart-bar:nth-child(5) { animation-delay: 0.5s; }

/* ─── Chip/tag pulse on hover ─── */
.story-card__chip,
.hero-chip,
.detail-chip {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.story-card__chip:hover,
.hero-chip:hover,
.detail-chip:hover {
  transform: scale(1.05);
  box-shadow: 0 4px 12px rgba(19, 42, 96, 0.12);
}

/* ─── Blockquote entrance ─── */
.quote-block {
  opacity: 0;
  transform: translateX(-16px);
  transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.quote-block.revealed {
  opacity: 1;
  transform: translateX(0);
}

/* ─── Smooth image loading ─── */
.story-card__art,
.feature-card__art,
.related-card__art,
.detail-hero-image {
  opacity: 0;
  transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.story-card__art[style*="background-image"],
.feature-card__art[style*="background-image"],
.related-card__art[style*="background-image"] {
  opacity: 1;
}

.detail-hero-image.loaded {
  opacity: 1;
}

/* ─── Skeleton loading shimmer ─── */
@keyframes shimmer {
  0% { background-position: -800px 0; }
  100% { background-position: 800px 0; }
}

.skeleton {
  background: linear-gradient(90deg, var(--surface-soft) 25%, var(--border) 50%, var(--surface-soft) 75%);
  background-size: 800px 100%;
  animation: shimmer 1.5s infinite linear;
  border-radius: var(--radius-sm);
}

/* ─── Tooltip ─── */
[data-tooltip] {
  position: relative;
}

[data-tooltip]::before {
  content: attr(data-tooltip);
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  padding: 6px 12px;
  border-radius: 8px;
  background: var(--navy);
  color: white;
  font-size: 0.72rem;
  font-weight: 600;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
  z-index: 100;
}

[data-tooltip]:hover::before {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* ─── Engagement bar ─── */
.engagement-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 18px;
  margin: 20px 0 28px;
  border-radius: var(--radius-sm);
  background: var(--surface-soft);
  border: 1px solid var(--border);
}

.engagement-bar__reading {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--text-soft);
  font-size: 0.82rem;
  font-weight: 600;
}

.engagement-bar__icon svg {
  width: 16px;
  height: 16px;
}

.engagement-bar__actions {
  display: flex;
  gap: 6px;
}

.engagement-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text-soft);
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.engagement-btn svg {
  width: 14px;
  height: 14px;
}

.engagement-btn:hover {
  background: var(--accent-soft);
  border-color: var(--accent);
  color: var(--accent-strong);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}

.engagement-btn:active {
  transform: translateY(0) scale(0.97);
  transition-duration: 0.08s;
}

.engagement-btn--active {
  background: var(--accent-soft) !important;
  border-color: var(--accent) !important;
  color: var(--accent-strong) !important;
}

body.blog-lightbox-open {
  overflow: hidden;
}

.blog-lightbox {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: grid;
  place-items: center;
  padding: 20px;
}

.blog-lightbox__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 14, 31, 0.76);
  backdrop-filter: blur(10px);
}

.blog-lightbox__dialog {
  position: relative;
  z-index: 1;
  width: min(1100px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  overflow: auto;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--border) 65%, white);
  background: color-mix(in srgb, var(--surface) 92%, white);
  box-shadow: 0 36px 80px rgba(7, 14, 31, 0.34);
}

.blog-lightbox__content {
  padding: 20px;
}

.blog-lightbox__close {
  position: sticky;
  top: 16px;
  left: calc(100% - 56px);
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin: 16px 16px 0 auto;
  border: 1px solid color-mix(in srgb, var(--border) 70%, white);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--navy);
  cursor: pointer;
}

.blog-lightbox__close svg {
  width: 18px;
  height: 18px;
}

.blog-lightbox__image,
.blog-lightbox__chart svg {
  display: block;
  width: 100%;
  height: auto;
}

.blog-lightbox__image {
  border-radius: 18px;
  object-fit: contain;
  max-height: calc(100vh - 140px);
}

.blog-lightbox__caption {
  margin: 0 0 18px;
  color: var(--text-soft);
  font-size: 0.84rem;
  font-weight: 700;
}

.blog-lightbox__chart-wrap {
  padding: 4px;
}

.blog-lightbox__chart {
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--border) 72%, white);
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface-soft) 92%, white), color-mix(in srgb, var(--surface) 94%, white));
  padding: 18px;
}

@media (prefers-reduced-motion: reduce) {
  .desk-ticker__track {
    animation: none;
  }
}

/* ─── Key takeaways box ─── */
.takeaways-box {
  margin: 32px 0;
  padding: 24px;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, var(--accent-soft), color-mix(in srgb, var(--accent-soft) 40%, var(--surface)));
  border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent);
}

.takeaways-box__header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
}

.takeaways-box__header h3 {
  margin: 0;
  font-size: 0.88rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--accent-strong);
}

.takeaways-box__icon svg {
  width: 18px;
  height: 18px;
  color: var(--accent);
}

.takeaways-box__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 10px;
}

.takeaways-box__item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 14px;
  font-size: 0.95rem;
  line-height: 1.6;
  border-radius: 10px;
  background: var(--surface);
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--text);
  border: 1px solid var(--border);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.takeaways-box__item:hover {
  transform: translateX(4px);
  box-shadow: 0 4px 12px rgba(19, 42, 96, 0.06);
}

.takeaways-box__number {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: var(--navy);
  color: white;
  font-size: 0.72rem;
  font-weight: 800;
  flex-shrink: 0;
}

/* ─── Article reactions ─── */
.article-reactions {
  margin: 36px 0 24px;
  padding: 20px 24px;
  border-radius: var(--radius-md);
  background: var(--surface-soft);
  border: 1px solid var(--border);
  text-align: center;
}

.article-reactions__prompt {
  margin: 0 0 14px;
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--text);
}

.article-reactions__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}

.reaction-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 8px 16px;
  border-radius: 24px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text-soft);
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.reaction-btn:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
  transform: scale(1.05);
}

.reaction-btn--active {
  border-color: var(--accent) !important;
  background: var(--accent-soft) !important;
  color: var(--accent-strong) !important;
  box-shadow: 0 2px 8px rgba(54, 95, 159, 0.15);
}

/* ─── Respect reduced motion ─── */
@media (prefers-reduced-motion: reduce) {
  .reveal,
  .reveal-scale,
  .reveal-left,
  .reveal-right,
  .quote-block,
  .story-card,
  .feature-card,
  .related-card,
  .report-download,
  .category-button,
  .action-card,
  .chart-bar,
  .detail-hero-image,
  .story-card__art,
  .feature-card__art {
    transition: none !important;
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* =========================================================================
   HOMEPAGE — Magazine editorial layout (/blog)
   ========================================================================= */

.hp {
  max-width: 1220px;
  margin: 0 auto;
  padding: 0 24px 80px;
}

/* Masthead */
.hp-masthead {
  padding: 48px 0 32px;
  text-align: center;
  border-bottom: 2px solid var(--text);
  animation: fadeSlideUp 0.55s cubic-bezier(0.22,1,0.36,1) both;
}

.hp-masthead__inner {
  max-width: 680px;
  margin: 0 auto;
}

.hp-masthead__title {
  margin: 0;
  font-size: clamp(2.4rem, 4vw, 3.2rem);
  font-weight: 800;
  letter-spacing: -0.06em;
  line-height: 1;
  color: var(--text);
}

.hp-masthead__title a {
  text-decoration: none;
  color: inherit;
}

.hp-masthead__wordmark {
  display: inline-flex;
  align-items: baseline;
  gap: 0;
}

.hp-masthead__accent {
  display: block;
  font-weight: 400;
  font-style: italic;
  color: var(--accent);
  font-size: 0.7em;
  letter-spacing: -0.02em;
  margin-top: 4px;
}

.hp-masthead__tagline {
  margin-top: 14px;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--text-soft);
}

.hp-masthead__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 18px;
  flex-wrap: wrap;
}

.hp-masthead__nav-link {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--text-soft);
  transition: color 0.18s ease;
}

.hp-masthead__nav-link:hover {
  color: var(--accent-strong);
}

.hp-masthead__nav-dot {
  color: var(--text-muted);
  font-size: 0.7rem;
  user-select: none;
}

/* =========================================================================
   BLOG COMMENTS
   ========================================================================= */

.blog-comments {
  margin-top: 40px;
  padding-top: 32px;
  border-top: 2px solid var(--text);
}

.blog-comments__title {
  font-size: 1.1rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--text);
  margin: 0 0 20px;
}

.blog-comments__form {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 28px;
}

.blog-comments__input {
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid var(--border-strong);
  border-radius: 2px;
  background: var(--surface);
  font-size: 0.86rem;
  color: var(--text);
  font-family: inherit;
}

.blog-comments__input::placeholder {
  color: var(--text-muted);
}

.blog-comments__input--name {
  max-width: 280px;
}

.blog-comments__textarea {
  resize: vertical;
  min-height: 72px;
}

.blog-comments__submit {
  align-self: flex-start;
  min-height: 44px;
  padding: 10px 24px;
  border: 0;
  border-radius: 2px;
  background: var(--navy);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
}

.blog-comments__submit:hover {
  opacity: 0.88;
}

.blog-comments__meta {
  display: grid;
  gap: 6px;
}

.blog-comments__hint,
.blog-comments__status {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.5;
}

.blog-comments__hint {
  color: var(--text-muted);
}

.blog-comments__status {
  min-height: 1.2em;
  color: var(--text-soft);
}

.blog-comments__status--success {
  color: var(--success-text);
}

.blog-comments__status--error {
  color: var(--negative-text);
}

.blog-comments__submit:disabled {
  opacity: 0.55;
  cursor: wait;
}

.blog-comments__list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.blog-comments__empty,
.blog-comments__loading {
  font-size: 0.86rem;
  color: var(--text-muted);
  text-align: center;
  padding: 20px 0;
}

.blog-comment {
  padding: 16px 0;
  border-bottom: 1px solid var(--border);
  animation: fadeSlideUp 0.4s cubic-bezier(0.22,1,0.36,1) both;
}

.blog-comment:last-child {
  border-bottom: 0;
}

.blog-comment__header {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 6px;
}

.blog-comment__name {
  font-size: 0.86rem;
  font-weight: 700;
  color: var(--text);
}

.blog-comment__date {
  font-size: 0.72rem;
  color: var(--text-muted);
}

.blog-comment__body {
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.6;
  color: var(--text-soft);
}

/* Load more */
.hp-load-more {
  margin-top: 28px;
  text-align: center;
}

.hp-load-more__btn {
  display: inline-block;
  padding: 12px 32px;
  border: 1px solid var(--border-strong);
  border-radius: 2px;
  background: transparent;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--text-soft);
  cursor: pointer;
  letter-spacing: 0.06em;
  transition: border-color 0.2s, color 0.2s;
}

.hp-load-more__btn:hover {
  border-color: var(--accent);
  color: var(--accent);
}

/* Category ribbon */
.hp-ribbon {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0;
  padding: 18px 0;
  border-bottom: 1px solid var(--border);
}

.hp-ribbon__item {
  padding: 6px 16px;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-soft);
  transition: color 0.2s;
}

.hp-ribbon__item:hover {
  color: var(--accent);
}

.hp-ribbon__dot {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--text-muted);
  flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════════
   HP-HERO: Featured story block on category pages
   ═══════════════════════════════════════════════════════════════ */

/* Per-lane tokens */
.hp-hero                              { --lc:#8a8070; --lc-soft:rgba(138,128,112,.06); }
.hp-hero[data-lane="global-markets"]  { --lc:#C2421E; --lc-soft:rgba(194,66,30,.06);  }
.hp-hero[data-lane="tech-equities"]   { --lc:#7ca01a; --lc-soft:rgba(124,160,26,.07); }
.hp-hero[data-lane="fixed-income"]    { --lc:#4a7ab0; --lc-soft:rgba(74,122,176,.06); }
.hp-hero[data-lane="crypto-assets"]   { --lc:#6e66d4; --lc-soft:rgba(110,102,212,.06);}
.hp-hero[data-lane="esg-investing"]   { --lc:#3a9e65; --lc-soft:rgba(58,158,101,.06); }

.hp-hero {
  display: grid;
  grid-template-columns: 1.65fr 1fr;
  gap: 0;
  margin-top: 0;
  border: 1px solid var(--ed-rule-soft, #C6BDA1);
  border-top: 4px solid var(--lc);
  border-radius: 0;
  overflow: hidden;
  background: none;
  transition: border-top-color 0.2s;
}

/* Lane colour tokens — hp-lead */
.hp-lead                               { --lc:#8a8070; --lc-soft:rgba(138,128,112,.07); }
.hp-lead[data-lane="global-markets"]   { --lc:#C2421E; --lc-soft:rgba(194,66,30,.07);  }
.hp-lead[data-lane="tech-equities"]    { --lc:#7ca01a; --lc-soft:rgba(124,160,26,.07); }
.hp-lead[data-lane="fixed-income"]     { --lc:#4a7ab0; --lc-soft:rgba(74,122,176,.07); }
.hp-lead[data-lane="crypto-assets"]    { --lc:#6e66d4; --lc-soft:rgba(110,102,212,.07);}
.hp-lead[data-lane="esg-investing"]    { --lc:#3a9e65; --lc-soft:rgba(58,158,101,.07); }

.hp-lead {
  display: flex;
  flex-direction: column;
  background: var(--surface-raised);
  transition: transform 0.24s cubic-bezier(.22,1,.36,1), box-shadow 0.24s ease;
}

.hp-lead:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(9,24,48,.1);
}

.hp-lead__body {
  padding: 28px 32px 32px;
  border-top: 3px solid var(--lc, var(--accent));
  background: linear-gradient(160deg, var(--lc-soft) 0%, transparent 50%);
}

.hp-lead__lane {
  display: inline-block;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 12px;
}

.hp-lead__title {
  margin: 0;
  font-size: clamp(1.6rem, 2.4vw, 2.2rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.12;
  color: var(--text);
}

.hp-lead__excerpt {
  margin: 14px 0 0;
  font-size: 0.92rem;
  line-height: 1.6;
  color: var(--text-soft);
  max-width: 52ch;
}

.hp-lead__meta {
  margin-top: 18px;
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--text-muted);
  letter-spacing: 0.04em;
}

/* Sidebar stories */
.hp-sidebar-stories {
  display: flex;
  flex-direction: column;
  align-self: stretch;
  background: var(--surface);
}

/* Lane colour tokens — hp-sidebar-story */
.hp-sidebar-story                               { --lc:#8a8070; --lc-soft:rgba(138,128,112,.06); }
.hp-sidebar-story[data-lane="global-markets"]   { --lc:#C2421E; --lc-soft:rgba(194,66,30,.06);  }
.hp-sidebar-story[data-lane="tech-equities"]    { --lc:#7ca01a; --lc-soft:rgba(124,160,26,.06); }
.hp-sidebar-story[data-lane="fixed-income"]     { --lc:#4a7ab0; --lc-soft:rgba(74,122,176,.06); }
.hp-sidebar-story[data-lane="crypto-assets"]    { --lc:#6e66d4; --lc-soft:rgba(110,102,212,.06);}
.hp-sidebar-story[data-lane="esg-investing"]    { --lc:#3a9e65; --lc-soft:rgba(58,158,101,.06); }

.hp-sidebar-story {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 20px 22px;
  background: var(--surface-raised);
  border-top: 3px solid var(--lc);
  border-bottom: 1px solid var(--border-panel);
  background-image: linear-gradient(135deg, var(--lc-soft) 0%, transparent 40%);
  transition: transform 0.2s cubic-bezier(.22,1,.36,1), box-shadow 0.2s ease;
}

.hp-sidebar-story:first-child {
  border-top: 3px solid var(--lc);
}

.hp-sidebar-story:hover {
  transform: translateX(3px);
  box-shadow: 0 4px 16px rgba(9,24,48,.08);
}

.hp-sidebar-story__body {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.hp-sidebar-story__lane {
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 6px;
}

.hp-sidebar-story__title {
  margin: 0;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--text);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.hp-sidebar-story__meta {
  margin-top: 8px;
  font-size: 0.66rem;
  font-weight: 600;
  color: var(--text-muted);
}

/* ═══════════════════════════════════════════════════════════════
   HP-SECTION: Intelligence Desk Lanes
   ═══════════════════════════════════════════════════════════════ */

/* Lane colour tokens */
.hp-section                              { --lc:#8a8070; --lc-soft:rgba(138,128,112,.05); }
.hp-section[data-lane="global-markets"]  { --lc:#C2421E; --lc-soft:rgba(194,66,30,.05);  }
.hp-section[data-lane="tech-equities"]   { --lc:#7ca01a; --lc-soft:rgba(124,160,26,.05); }
.hp-section[data-lane="fixed-income"]    { --lc:#4a7ab0; --lc-soft:rgba(74,122,176,.05); }
.hp-section[data-lane="crypto-assets"]   { --lc:#6e66d4; --lc-soft:rgba(110,102,212,.05);}
.hp-section[data-lane="esg-investing"]   { --lc:#3a9e65; --lc-soft:rgba(58,158,101,.05); }

.hp-section {
  position: relative;
  margin-top: 48px;
  padding: 28px 0 40px;
  border-top: none;
}

/* Full-width lane rule + soft tint strip at top */
.hp-section::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--lc);
  opacity: 0.7;
  border-radius: 0;
}

/* Subtle tint zone behind the whole section */
.hp-section::after {
  content: '';
  position: absolute;
  top: 0; left: -40px; right: -40px; bottom: 0;
  background: linear-gradient(180deg, var(--lc-soft) 0%, transparent 30%);
  pointer-events: none;
  z-index: 0;
}

.hp-section__header {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
  gap: 16px;
}

.hp-section__title {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 1.08rem;
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--text);
}

/* Solid colour bar left of title — the lane identity marker */
.hp-section__title::before {
  content: '';
  display: block;
  width: 4px;
  height: 1.1em;
  background: var(--lc);
  border-radius: 2px;
  flex-shrink: 0;
}

.hp-section__title a {
  color: inherit;
  text-decoration: none;
  transition: color 0.18s;
}

.hp-section__title a:hover {
  color: var(--lc, var(--accent));
}

.hp-section__more {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 16px;
  border: 1px solid var(--border-panel);
  border-radius: 99px;
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--text-soft);
  letter-spacing: 0.04em;
  text-decoration: none;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
  flex-shrink: 0;
}

.hp-section__more:hover {
  background: var(--lc, var(--accent));
  color: white;
  border-color: var(--lc, var(--accent));
}

.hp-section__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

/* Cards */
@keyframes cardReveal {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

.hp-card {
  display: flex;
  flex-direction: column;
  transition: transform 0.28s cubic-bezier(0.22,1,0.36,1), box-shadow 0.28s ease;
  animation: cardReveal 0.5s cubic-bezier(0.22,1,0.36,1) both;
}

.hp-card:nth-child(1) { animation-delay: 0s; }
.hp-card:nth-child(2) { animation-delay: 0.06s; }
.hp-card:nth-child(3) { animation-delay: 0.12s; }
.hp-card:nth-child(4) { animation-delay: 0.18s; }
.hp-card:nth-child(5) { animation-delay: 0.24s; }
.hp-card:nth-child(6) { animation-delay: 0.3s; }
.hp-card:nth-child(n+7) { animation-delay: 0.36s; }

/* ═══════════════════════════════════════════════════════════════
   HP-CARD: Financial Intelligence Card System
   ═══════════════════════════════════════════════════════════════ */

/* Lane colour tokens */
.hp-card                               { --lc:#8a8070; --lc-soft:rgba(138,128,112,.09); --lc-bright:rgba(138,128,112,.14); --lc-text:#5a5448; }
.hp-card[data-lane="global-markets"]   { --lc:#C2421E; --lc-soft:rgba(194,66,30,.09);  --lc-bright:rgba(194,66,30,.13);  --lc-text:#a83418; }
.hp-card[data-lane="tech-equities"]    { --lc:#7ca01a; --lc-soft:rgba(124,160,26,.09); --lc-bright:rgba(124,160,26,.13); --lc-text:#5d7a13; }
.hp-card[data-lane="fixed-income"]     { --lc:#4a7ab0; --lc-soft:rgba(74,122,176,.09); --lc-bright:rgba(74,122,176,.13); --lc-text:#3a6396; }
.hp-card[data-lane="crypto-assets"]    { --lc:#6e66d4; --lc-soft:rgba(110,102,212,.09);--lc-bright:rgba(110,102,212,.13);--lc-text:#5550b8; }
.hp-card[data-lane="esg-investing"]    { --lc:#3a9e65; --lc-soft:rgba(58,158,101,.09); --lc-bright:rgba(58,158,101,.13); --lc-text:#2d7d50; }

/* Card shell */
.hp-card {
  position: relative;
  overflow: hidden;
  padding: 0;
  background: var(--surface-raised);
  border: 1px solid var(--border-panel);
  border-top: 3px solid var(--lc);
  border-left: none;
  border-radius: var(--radius-md);
  box-shadow: 0 1px 3px rgba(9,24,48,.04), 0 4px 16px rgba(9,24,48,.07);
  transition: transform 0.24s cubic-bezier(.22,1,.36,1), box-shadow 0.24s ease, border-top-width 0.15s;
}

/* Diagonal lane-tint wash */
.hp-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(148deg, var(--lc-soft) 0%, transparent 50%);
  pointer-events: none;
  z-index: 0;
}

/* Soft corner glow */
.hp-card::after {
  content: '';
  position: absolute;
  bottom: -10px;
  right: -10px;
  width: 120px;
  height: 100px;
  background: radial-gradient(ellipse at center, color-mix(in srgb, var(--lc) 12%, transparent) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}

.hp-card:hover {
  transform: translateY(-5px);
  border-top-width: 4px;
  box-shadow: 0 8px 32px rgba(9,24,48,.12), 0 0 0 1px color-mix(in srgb, var(--lc) 22%, transparent);
}

/* Lane dispatch badge */
.hp-card__lane-label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px 3px 8px;
  background: var(--lc-bright);
  border: 1px solid color-mix(in srgb, var(--lc) 32%, transparent);
  color: var(--lc-text);
  border-radius: 3px;
  font-size: 0.57rem;
  font-weight: 800;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.hp-card__lane-label::before {
  content: '';
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--lc);
  flex-shrink: 0;
}

/* Lazy-render off-screen cards for performance */
.hp-card:nth-child(n+5) {
  content-visibility: auto;
  contain-intrinsic-size: auto 320px;
}

.hp-card__body {
  position: relative;
  z-index: 1;
  flex: 1;
  padding: 18px 20px 20px;
}

.hp-card__title {
  margin: 0;
  font-size: 0.97rem;
  font-weight: 700;
  line-height: 1.28;
  letter-spacing: -0.02em;
  color: var(--text);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.hp-card--feature .hp-card__title {
  font-size: 1.05rem;
}

.hp-card__excerpt {
  margin: 8px 0 0;
  font-size: 0.86rem;
  line-height: 1.57;
  color: var(--text-soft);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.hp-card__meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
  font-size: 0.64rem;
  font-weight: 600;
  color: var(--text-muted);
  letter-spacing: 0.02em;
}

/* CTA */
.hp-cta {
  margin-top: 64px;
  padding: 48px 40px;
  text-align: center;
  border: 1px solid var(--border);
  border-radius: 2px;
  background: color-mix(in srgb, var(--navy) 3%, var(--surface));
}

.hp-cta__title {
  margin: 0;
  font-size: 1.4rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--text);
}

.hp-cta__copy {
  margin: 12px auto 0;
  max-width: 48ch;
  font-size: 0.88rem;
  line-height: 1.6;
  color: var(--text-soft);
}

.hp-cta__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin-top: 24px;
  padding: 12px 32px;
  border-radius: 2px;
  background: var(--navy);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  transition: opacity 0.2s;
}

.hp-cta__button:hover {
  opacity: 0.88;
}

/* HP responsive */
@media (max-width: 900px) {
  .hp-hero {
    grid-template-columns: 1fr;
  }

  .hp-section__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }

  .hp-ribbon {
    flex-wrap: wrap;
    gap: 4px;
  }
}

@media (max-width: 560px) {
  .hp-section__grid {
    grid-template-columns: 1fr;
  }

  .hp-masthead__title {
    font-size: 2rem;
  }

  .hp-sidebar-story {
    grid-template-columns: 80px 1fr;
    gap: 12px;
    padding: 14px 16px;
  }
}

/* =========================================================================
   CATEGORY PAGE HEADER
   ========================================================================= */

/* ═══════════════════════════════════════════════════════════════
   CAT-HERO: Full-bleed category hero (replaces inline-styled div)
   ═══════════════════════════════════════════════════════════════ */

.cat-hero {
  --ch-color: #8a8070;
  position: relative;
  padding: 56px 40px 52px;
  overflow: hidden;
  background: var(--ed-ink, #0A0A09);
  color: var(--ed-paper, #FAF6ED);
}

/* Per-lane accent colour */
.cat-hero[data-lane="global-markets"] { --ch-color: #C2421E; }
.cat-hero[data-lane="tech-equities"]  { --ch-color: #CADF3A; }
.cat-hero[data-lane="fixed-income"]   { --ch-color: #7aa3d4; }
.cat-hero[data-lane="crypto-assets"]  { --ch-color: #a49df0; }
.cat-hero[data-lane="esg-investing"]  { --ch-color: #6ec98f; }

/* Radial glow behind title */
.cat-hero::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -5%;
  width: 700px;
  height: 600px;
  background: radial-gradient(ellipse, color-mix(in srgb, var(--ch-color) 20%, transparent) 0%, transparent 60%);
  pointer-events: none;
}

/* Subtle grid texture overlay */
.cat-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.022) 1px, transparent 1px);
  background-size: 44px 44px;
  pointer-events: none;
}

/* Bright accent line at top */
.cat-hero {
  border-top: 4px solid var(--ch-color);
}

.cat-hero__back {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ch-color);
  text-decoration: none;
  opacity: 0.85;
  margin-bottom: 24px;
  transition: opacity .15s, gap .15s;
}

.cat-hero__back:hover {
  opacity: 1;
  gap: 12px;
}

.cat-hero__body {
  position: relative;
  z-index: 1;
}

.cat-hero__label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--ch-color);
  margin-bottom: 16px;
}

.cat-hero__label::before {
  content: '';
  display: block;
  width: 28px;
  height: 2px;
  background: var(--ch-color);
  flex-shrink: 0;
}

.cat-hero__title {
  margin: 0;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 90, "opsz" 72;
  font-weight: 700;
  font-size: clamp(46px, 6.5vw, 92px);
  line-height: .92;
  letter-spacing: -.042em;
  color: var(--ed-paper, #FAF6ED);
}

.cat-hero__desc {
  margin: 20px 0 0;
  font-family: 'Instrument Serif', Georgia, serif;
  font-style: italic;
  font-size: 18px;
  line-height: 1.52;
  color: color-mix(in srgb, var(--ed-paper) 72%, transparent);
  max-width: 54ch;
}

.cat-hero__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

.cat-hero__stat {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 14px;
  background: rgba(255,255,255,.065);
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 2px;
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--ed-paper) 78%, transparent);
  backdrop-filter: blur(4px);
}

.cat-hero__stat::before {
  content: '';
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--ch-color);
  flex-shrink: 0;
}

/* Mobile cat-hero */
@media (max-width: 680px) {
  .cat-hero {
    padding: 40px 20px 36px;
  }
  .cat-hero__title {
    font-size: clamp(36px, 10vw, 56px);
  }
  .cat-hero__desc {
    font-size: 16px;
  }
}

.cat-header {
  padding: 36px 0 0;
  border-bottom: 1px solid var(--border);
  text-align: center;
}

.cat-header__back {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--accent);
  text-decoration: none;
}

.cat-header__back:hover {
  text-decoration: underline;
}

.cat-header__title {
  margin: 16px 0 0;
  font-size: clamp(2rem, 3.4vw, 2.6rem);
  font-weight: 800;
  letter-spacing: -0.05em;
  line-height: 1.05;
  color: var(--text);
}

.cat-header__desc {
  margin: 10px 0 0;
  font-size: 0.88rem;
  line-height: 1.6;
  color: var(--text-soft);
  max-width: 60ch;
  margin-left: auto;
  margin-right: auto;
}

.hp-ribbon__item--active {
  color: var(--accent) !important;
  font-weight: 800;
}

/* =========================================================================
   ARTICLE PAGE LAYOUT
   ========================================================================= */

.art-layout {
  padding: 0 0 40px;
}

.art-main {
  min-width: 0;
}

.art-content-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 48px;
  align-items: start;
  margin-top: 28px;
}

.art-content-main {
  min-width: 0;
}

.art-header {
  padding: 32px 0 24px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 28px;
}

.art-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 16px;
}

.art-breadcrumb a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 4px;
  color: var(--text-muted);
  text-decoration: none;
}

.art-breadcrumb a:hover {
  color: var(--accent);
}

/* Article lane accent rule — replaces hero image */
.art-lane-rule {
  width: 100%;
  height: 3px;
  background: var(--accent);
  margin-top: 24px;
  border-radius: 1px;
}
.art-lane-rule[data-lane="global-markets"] { background: #D24A26; }
.art-lane-rule[data-lane="tech-equities"]  { background: #7fc47e; }
.art-lane-rule[data-lane="fixed-income"]   { background: #7aa3d4; }
.art-lane-rule[data-lane="crypto-assets"]  { background: #a49df0; }
.art-lane-rule[data-lane="esg-investing"]  { background: #6ec98f; }

/* Cover viz editorial typography block */
.ed-home .ed-cover-viz__editorial {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  height: 100%;
  padding: 28px;
  gap: 10px;
}
.ed-home .ed-cover-viz__lane {
  font-family: 'Space Mono', monospace;
  font-size: 9px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ed-lime);
  opacity: .9;
}
.ed-home .ed-cover-viz__headline {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: clamp(22px, 2.4vw, 32px);
  line-height: 1.1;
  color: var(--ed-paper);
  letter-spacing: -.01em;
}
.ed-home .ed-cover-viz__meta {
  font-family: 'Space Mono', monospace;
  font-size: 9px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--ed-paper) 60%, transparent);
}

.art-title {
  margin: 0;
  font-size: clamp(1.8rem, 3vw, 2.4rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.12;
  color: var(--text);
}

.art-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  font-size: 0.76rem;
  color: var(--text-muted);
}

.art-meta__author {
  font-weight: 700;
  color: var(--text-soft);
}

.art-meta__sep {
  color: var(--border-strong);
}

/* Article sidebar */
.art-sidebar {
  position: sticky;
  top: 92px;
  display: grid;
  gap: 14px;
  margin-top: 0;
  align-self: start;
  max-height: calc(100vh - 108px);
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}

.art-sidebar::-webkit-scrollbar {
  width: 8px;
}

.art-sidebar::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--border-strong) 66%, transparent);
  border-radius: 999px;
}

.art-panel {
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: color-mix(in srgb, var(--surface) 94%, white 6%);
  box-shadow: 0 18px 40px rgba(12, 26, 56, 0.06);
}

.art-panel--impact {
  background:
    radial-gradient(circle at top right, color-mix(in srgb, var(--accent) 14%, transparent), transparent 42%),
    color-mix(in srgb, var(--surface) 92%, white 8%);
  border-color: color-mix(in srgb, var(--accent) 20%, var(--border));
}

.art-panel__eyebrow {
  margin: 0 0 12px;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.art-panel__title {
  margin: 0 0 12px;
  color: var(--navy);
  font-size: 0.92rem;
  line-height: 1.25;
  letter-spacing: -0.02em;
}

.art-impact__head,
.art-pulse__head,
.art-scenario__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
}

.art-impact__title,
.art-pulse__title,
.art-scenario__title,
.art-conversion__title {
  margin: 0;
  color: var(--navy);
  font-size: 1rem;
  line-height: 1.2;
  letter-spacing: -0.03em;
}

.art-impact__copy,
.art-conversion__copy,
.art-scenario__assist {
  margin: 8px 0 0;
  color: var(--text-soft);
  font-size: 0.82rem;
  line-height: 1.55;
}

.art-impact__allocation {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 68px;
  height: 44px;
  padding: 0 14px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--navy) 7%, var(--surface));
  color: var(--navy);
  font-size: 0.96rem;
  font-weight: 800;
}

.art-impact__stats,
.art-pulse__metrics,
.art-scenario__outputs {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.art-impact__stats,
.art-pulse__metrics,
.art-scenario__outputs {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.art-impact__stat,
.art-pulse__metric,
.art-scenario__output {
  display: grid;
  gap: 4px;
  padding: 12px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface-soft) 88%, white 12%);
  border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
}

.art-impact__stat span,
.art-pulse__metric span,
.art-scenario__output span {
  color: var(--text-muted);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.art-impact__stat strong,
.art-pulse__metric strong,
.art-scenario__output strong {
  color: var(--navy);
  font-size: 0.88rem;
  font-weight: 800;
}

.art-impact__recommendation {
  margin: 14px 0 0;
  color: var(--text);
  font-size: 0.84rem;
  line-height: 1.55;
}

.art-impact__holdings {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.art-impact__holding,
.art-impact__connect {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 44px;
  padding: 0 12px;
  border-radius: 14px;
  text-decoration: none;
  border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
  background: color-mix(in srgb, var(--surface) 86%, white 14%);
  color: var(--navy);
  font-size: 0.8rem;
  font-weight: 700;
  transition: transform 160ms ease, border-color 160ms ease, background-color 160ms ease;
}

.art-impact__holding:hover,
.art-impact__connect:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent) 34%, var(--border));
  background: color-mix(in srgb, var(--accent) 7%, var(--surface));
}

.art-pulse__badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: color-mix(in srgb, var(--surface-soft) 88%, white 12%);
}

.art-pulse__badge--up,
.art-pulse__metric-value--up {
  color: #0f8a56;
}

.art-pulse__badge--down,
.art-pulse__metric-value--down {
  color: #cc4c4c;
}

.art-pulse__metric-value--neutral {
  color: var(--navy);
}

.art-pulse__spark {
  width: 100%;
  height: 52px;
  margin-top: 12px;
  color: var(--accent);
}

.art-pulse__spark-grid {
  stroke: color-mix(in srgb, var(--border) 88%, transparent);
  stroke-width: 1;
}

.art-scenario__value {
  color: var(--navy);
  font-size: 0.94rem;
  font-weight: 800;
}

.art-scenario__slider {
  width: 100%;
  min-height: 44px;
  margin-top: 14px;
  accent-color: var(--accent);
}

.art-sidebar-toc {
  display: grid;
  gap: 6px;
}

.art-sidebar-toc__link {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0 12px;
  border-radius: 12px;
  color: var(--text-soft);
  text-decoration: none;
  font-size: 0.8rem;
  font-weight: 700;
  transition: background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.art-sidebar-toc__link:hover,
.art-sidebar-toc__link.is-active {
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
  color: var(--navy);
  transform: translateX(2px);
}

.art-clusters {
  display: grid;
  gap: 10px;
}

.art-cluster {
  display: grid;
  gap: 5px;
  padding: 12px 13px;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--border) 84%, transparent);
  background: color-mix(in srgb, var(--surface) 86%, white 14%);
  text-decoration: none;
  transition: transform 160ms ease, border-color 160ms ease, background-color 160ms ease;
}

.art-cluster:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent) 32%, var(--border));
  background: color-mix(in srgb, var(--accent) 6%, var(--surface));
}

.art-cluster strong {
  color: var(--navy);
  font-size: 0.82rem;
  font-weight: 800;
}

.art-cluster span {
  color: var(--text-soft);
  font-size: 0.76rem;
  line-height: 1.45;
}

.art-panel__sources {
  display: grid;
  gap: 8px;
}

.art-source {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px;
  border-radius: 14px;
  background: var(--surface-soft);
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text-soft);
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
}

.art-source:hover {
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
  color: var(--accent);
}

.art-related {
  display: grid;
  gap: 12px;
}

.art-related__lane {
  display: block;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom: 3px;
  color: var(--accent);
}
.art-related__item[data-lane="global-markets"] .art-related__lane { color: #C2421E; }
.art-related__item[data-lane="tech-equities"]  .art-related__lane { color: #6b9200; }
.art-related__item[data-lane="fixed-income"]   .art-related__lane { color: #4a7ab0; }
.art-related__item[data-lane="crypto-assets"]  .art-related__lane { color: #6e66d4; }
.art-related__item[data-lane="esg-investing"]  .art-related__lane { color: #3a9e65; }

.art-related__item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  text-decoration: none;
  align-items: start;
  border-left: 3px solid var(--accent);
  padding-left: 12px;
  transition: border-color 0.15s;
}
.art-related__item[data-lane="global-markets"] { border-left-color: #C2421E; }
.art-related__item[data-lane="tech-equities"]  { border-left-color: #9DC515; }
.art-related__item[data-lane="fixed-income"]   { border-left-color: #7aa3d4; }
.art-related__item[data-lane="crypto-assets"]  { border-left-color: #a49df0; }
.art-related__item[data-lane="esg-investing"]  { border-left-color: #6ec98f; }

.art-related__item:hover .art-related__title {
  color: var(--accent);
}

.art-related__reason {
  display: inline-flex;
  margin-bottom: 6px;
  color: var(--text-muted);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.art-related__title {
  margin: 0;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--text);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color 0.15s;
}

.art-related__meta {
  font-size: 0.66rem;
  font-weight: 600;
  color: var(--text-muted);
  margin-top: 4px;
}

.art-signals,
.art-conversion__actions {
  display: grid;
  gap: 10px;
}

.art-newsletter-compact {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.art-newsletter-compact__input {
  width: 100%;
  min-height: 46px;
  padding: 0 14px;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 92%, white 8%);
  color: var(--text);
}

.art-newsletter-compact__button {
  min-height: 44px;
  border: 0;
  border-radius: 14px;
  background: var(--navy);
  color: white;
  font-weight: 700;
  cursor: pointer;
}

.art-newsletter-compact__button:hover {
  background: color-mix(in srgb, var(--navy) 88%, black 12%);
}

.art-signal-btn,
.art-conversion__primary,
.art-conversion__secondary {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  padding: 0 14px;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--border) 84%, transparent);
  background: color-mix(in srgb, var(--surface) 86%, white 14%);
  color: var(--navy);
  font-size: 0.8rem;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: transform 160ms ease, border-color 160ms ease, background-color 160ms ease, color 160ms ease;
}

.art-signal-btn:hover,
.art-conversion__primary:hover,
.art-conversion__secondary:hover,
.art-signal-btn--active {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent) 34%, var(--border));
  background: color-mix(in srgb, var(--accent) 7%, var(--surface));
  color: var(--navy);
}

.art-signal-btn svg,
.art-conversion__primary svg,
.art-conversion__secondary svg {
  width: 16px;
  height: 16px;
}

.art-conversion__primary {
  background: var(--navy);
  color: #fff;
  border-color: color-mix(in srgb, var(--navy) 68%, var(--border));
}

.art-conversion__primary:hover {
  color: #fff;
  background: color-mix(in srgb, var(--navy) 88%, black 12%);
}

.art-panel--sources-lite {
  padding-top: 16px;
}

/* =========================================================================
   BLOG NEWSLETTER + FOOTER
   ========================================================================= */

.blog-newsletter {
  margin-top: 64px;
  padding: 48px 0;
  border-top: 2px solid var(--text);
  border-bottom: 1px solid var(--border);
  text-align: center;
}

.blog-newsletter__title {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--text);
}

.blog-newsletter__copy {
  margin: 10px auto 0;
  max-width: 44ch;
  font-size: 0.88rem;
  line-height: 1.6;
  color: var(--text-soft);
}

.blog-newsletter__form {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 24px;
  max-width: 440px;
  margin-left: auto;
  margin-right: auto;
}

.blog-newsletter__input {
  flex: 1;
  min-width: 0;
  padding: 12px 18px;
  border: 1px solid var(--border-strong);
  border-radius: 2px;
  background: var(--surface);
  font-size: 1rem;
  color: var(--text);
}

.blog-newsletter__input::placeholder {
  color: var(--text-muted);
}

.blog-newsletter__btn {
  padding: 12px 28px;
  border: 0;
  border-radius: 2px;
  background: var(--navy);
  color: #fff;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
}

.blog-newsletter__btn:hover {
  opacity: 0.88;
}

.blog-footer {
  padding: 48px 0 32px;
}

.blog-footer__inner {
  max-width: 1220px;
  margin: 0 auto;
}

.blog-footer__grid {
  display: grid;
  grid-template-columns: 1.5fr repeat(3, 1fr);
  gap: 40px;
}

.blog-footer__logo {
  font-size: 1.1rem;
  font-weight: 800;
  letter-spacing: -0.04em;
  color: var(--text);
  text-decoration: none;
}

.blog-footer__desc {
  margin: 10px 0 0;
  font-size: 0.82rem;
  line-height: 1.6;
  color: var(--text-soft);
  max-width: 32ch;
}

.blog-footer__heading {
  margin: 0 0 14px;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.blog-footer__links {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.blog-footer__links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text-soft);
  text-decoration: none;
}

.blog-footer__links a:hover {
  color: var(--accent);
}

.blog-footer__bottom {
  margin-top: 36px;
  padding-top: 20px;
  border-top: 1px solid var(--border);
  font-size: 0.72rem;
  color: var(--text-muted);
}

/* Responsive article layout */
@media (max-width: 900px) {
  .art-content-layout {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .art-sidebar {
    position: static;
    max-height: none;
    overflow: visible;
  }

  .blog-footer__grid {
    grid-template-columns: 1fr 1fr;
    gap: 28px;
  }

  .art-impact__stats,
  .art-pulse__metrics,
  .art-scenario__outputs {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .blog-footer__grid {
    grid-template-columns: 1fr;
  }

  .blog-newsletter__form {
    flex-direction: column;
  }
}

/* =========================================================================
   TYPOGRAPHY & SPACING REFINEMENTS — tighter, more editorial
   ========================================================================= */

/* Reduce oversized hero title on landing/category pages */
.hero-title {
  font-size: clamp(2.2rem, 3.8vw, 3rem);
  letter-spacing: -0.05em;
}

/* Tighten topbar */
.topbar {
  padding: 12px 28px;
  gap: 20px;
}

.brandmark__title {
  font-size: 0.96rem;
}

.primary-nav {
  gap: 24px;
}

.primary-nav a {
  font-size: 0.84rem;
}

/* Reduce left sidebar width and visual weight */
.page-grid {
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 36px;
}

.left-rail {
  padding-top: 2px;
}

.rail-heading {
  gap: 10px;
  margin-bottom: 28px;
}

.rail-heading__icon {
  width: 28px;
  height: 28px;
  font-size: 0.7rem;
}

.rail-heading__title {
  font-size: 0.82rem;
}

.category-button {
  padding: 10px 12px;
  gap: 12px;
}

.category-button__label {
  font-size: 0.82rem;
}

.category-divider {
  margin: 20px 0 22px;
}

/* Tighter story cards */
.story-card__title {
  font-size: 0.92rem;
  line-height: 1.28;
}

.feature-title {
  font-size: clamp(1.3rem, 2vw, 1.8rem);
  letter-spacing: -0.03em;
}

/* Reduce right-rail panel bloat */
.landing-rail {
  gap: 20px;
}

.rail-panel {
  padding: 16px;
}

.panel-heading h3 {
  font-size: 0.72rem;
  letter-spacing: 0.16em;
}

.value-item span:first-child {
  font-size: 0.68rem;
}

.value-item strong {
  font-size: 0.78rem;
}

/* Searchbox refinement */
.searchbox {
  width: 240px;
  height: 40px;
  padding: 0 14px;
  border-radius: 8px;
}

.searchbox input {
  font-size: 0.82rem;
}

/* =========================================================================
   PRINT STYLES — clean article printing
   ========================================================================= */

@media print {
  .topbar, .left-rail, .art-sidebar, .hp-ribbon, .hp-cta,
  .blog-newsletter, .blog-footer, .engagement-bar, .article-reactions,
  .article-engagement, .article-themes, .mid-article-cta,
  .asset-cards-inline, .mobile-takeaways-box, .cat-header__back,
  .hp-section__more, .searchbox, .theme-switch, .avatar-button,
  .icon-button { display: none !important; }

  .hp, .art-layout { max-width: 100%; padding: 0; }
  .art-layout { grid-template-columns: 1fr; }
  .art-title { font-size: 1.8rem; }
  .article-body { font-size: 11pt; line-height: 1.7; }
  .detail-hero-image { max-height: 300px; object-fit: cover; }
  .research-disclaimer { border: 1px solid #ccc; page-break-inside: avoid; }
  .takeaways-box { border: 1px solid #ccc; page-break-inside: avoid; }
  .chart-card { page-break-inside: avoid; }
  a { color: inherit; text-decoration: none; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 0.8em; color: #666; }
}

/* =========================================================================
   TABLE OF CONTENTS — auto-generated from article headings
   ========================================================================= */

.art-toc {
  margin: 0 0 28px;
  padding: 18px 20px;
  border: 1px solid var(--border);
  border-radius: 2px;
  background: var(--surface-soft);
}

.art-toc__title {
  margin: 0 0 12px;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.art-toc__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.art-toc__list li {
  font-size: 0.82rem;
  line-height: 1.4;
}

.art-toc__list a {
  color: var(--text-soft);
  text-decoration: none;
  font-weight: 600;
  transition: color 0.15s;
}

.art-toc__list a:hover {
  color: var(--accent);
}

/* P4-5: Engagement actions */
.article-engagement {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 24px 0;
}

.engagement-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: var(--radius-sm, 14px);
  border: 1px solid var(--border);
  background: var(--surface);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text-soft);
  cursor: pointer;
  text-decoration: none;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.engagement-btn:hover {
  border-color: var(--accent);
  box-shadow: 0 2px 8px rgba(19, 42, 96, 0.06);
}

.engagement-btn--primary {
  background: var(--accent);
  color: white;
  border-color: var(--accent);
}

.engagement-btn--primary:hover {
  opacity: 0.92;
}

.engagement-btn svg {
  width: 16px;
  height: 16px;
}

/* TTS player play/pause button SVG */
#tts-play-pause svg {
  width: 18px;
  height: 18px;
}

#tts-player button[title="Stop"] svg {
  width: 14px;
  height: 14px;
}

/* P4-6: Theme chips */
.article-themes {
  margin: 20px 0;
}

.article-themes__label {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--text-muted);
  margin-bottom: 10px;
}

.article-themes__list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.theme-chip {
  display: inline-block;
  padding: 6px 14px;
  border-radius: 20px;
  border: 1px solid var(--border);
  background: var(--surface-soft);
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text-soft);
  text-decoration: none;
  text-transform: capitalize;
  transition: border-color 0.2s, background 0.2s;
}

.theme-chip:hover {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, var(--surface));
  color: var(--text);
}

/* P4-2: Inline asset cards */
.asset-cards-inline {
  margin: 32px 0;
  padding: 20px 24px;
  border-radius: var(--radius-md, 18px);
  border: 1px solid var(--border);
  background: var(--surface-soft);
}

.asset-cards-inline__label {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--text-muted);
  margin-bottom: 14px;
}

.asset-cards-inline__grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.asset-card-inline {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--surface);
  text-decoration: none;
  transition: box-shadow 0.2s, border-color 0.2s;
}

.asset-card-inline:hover {
  border-color: var(--accent);
  box-shadow: 0 4px 12px rgba(19, 42, 96, 0.08);
}

.asset-card-inline__symbol {
  font-size: 0.88rem;
  font-weight: 800;
  color: var(--text);
  font-family: 'JetBrains Mono', monospace;
}

.asset-card-inline__cta {
  font-size: 0.75rem;
  color: var(--accent);
  font-weight: 600;
}

/* Mid-article CTA */
.mid-article-cta {
  margin: 36px 0;
  padding: 20px 24px;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  text-align: center;
}

.mid-article-cta__text {
  font-size: 0.9rem;
  color: var(--text-soft);
  margin-bottom: 12px;
}

.mid-article-cta__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  height: 44px;
  padding: 0 28px;
  border-radius: var(--radius-sm, 14px);
  background: var(--accent);
  color: white;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: opacity 0.2s;
}

.mid-article-cta__button:hover {
  opacity: 0.9;
}

/* Sidebar key takeaways */
.sidebar-takeaways {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.sidebar-takeaways li {
  position: relative;
  padding-left: 20px;
  font-size: 0.94rem;
  line-height: 1.65;
  color: var(--text);
}

.sidebar-takeaways li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 9px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent);
  opacity: 0.85;
}

/* Mobile key takeaways — shown above article on mobile, hidden on desktop */
.mobile-takeaways-box {
  display: none;
  border-radius: var(--radius-md, 18px);
  border: 1px solid var(--border);
  background: var(--surface-soft);
  padding: 18px 20px;
  margin-bottom: 24px;
}

@media (max-width: 1024px) {
  .mobile-takeaways-box {
    display: block;
  }
}

/* =========================================================================
   BLOG SURFACE CONSISTENCY
   ========================================================================= */

[data-theme="ledger-noir"],
[data-theme="afterhours-ink"] {
  --surface-raised: color-mix(in srgb, var(--surface) 94%, var(--bg) 6%);
  --surface-muted: color-mix(in srgb, var(--surface-soft) 86%, var(--bg) 14%);
  --shadow-card: 0 12px 28px rgba(0, 0, 0, 0.24);
  --shadow-soft: 0 18px 36px rgba(0, 0, 0, 0.3);
  --shadow-hover: 0 20px 40px rgba(0, 0, 0, 0.36);
}

.feature-card,
.art-panel,
.rail-panel,
.detail-panel,
.indicator-card,
.related-card,
.download-card,
.chart-card,
.asset-cards-inline,
.article-section--summary,
.mobile-takeaways-box,
.art-toc {
  border-radius: var(--radius-md);
  border: 1px solid var(--border-panel);
  background: var(--surface-raised);
  box-shadow: var(--shadow-card);
}

.art-panel--impact {
  border-color: color-mix(in srgb, var(--accent) 20%, var(--border));
  box-shadow: var(--shadow-soft);
}

.article-section--context {
  border-radius: var(--radius-md);
  border: 1px solid color-mix(in srgb, var(--accent) 16%, var(--border));
  background: color-mix(in srgb, var(--accent) 5%, var(--surface-muted));
}

.feature-card:hover,
.related-card:hover,
.download-card:hover,
.chart-card--interactive:hover,
.asset-card-inline:hover,
.engagement-btn:hover {
  box-shadow: var(--shadow-hover);
}

.story-card__media,
.feature-card__media,
.related-card__img {
  border-radius: var(--radius-md);
  border: 1px solid var(--border-subtle);
  background-color: var(--surface-muted);
}

.engagement-btn,
.theme-chip,
.asset-card-inline,
.art-impact__allocation,
.art-impact__stat,
.art-pulse__metric,
.art-scenario__output,
.art-impact__holding,
.art-impact__connect,
.art-sidebar-toc__link,
.art-cluster,
.art-source,
.art-newsletter-compact__input,
.art-newsletter-compact__button,
.art-signal-btn,
.art-conversion__primary,
.art-conversion__secondary,
.blog-comments__input,
.blog-comments__submit,
.mid-article-cta__button,
.blog-inline-action,
.tts-player,
.tts-player__toggle,
.tts-player__stop {
  border-radius: var(--radius-sm);
}

.engagement-btn,
.theme-chip,
.asset-card-inline,
.art-impact__stat,
.art-pulse__metric,
.art-scenario__output,
.art-impact__holding,
.art-impact__connect,
.art-cluster,
.art-source,
.art-newsletter-compact__input,
.blog-comments__input,
.tts-player,
.tts-player__stop {
  border-color: var(--border-panel);
  background: var(--surface-muted);
}

.theme-chip:hover,
.asset-card-inline:hover,
.art-impact__holding:hover,
.art-impact__connect:hover,
.art-sidebar-toc__link:hover,
.art-sidebar-toc__link.is-active,
.art-cluster:hover,
.art-source:hover,
.art-signal-btn:hover,
.art-conversion__secondary:hover,
.art-signal-btn--active {
  background: var(--surface-interactive);
}

.art-sidebar-toc__link,
.art-source,
.theme-chip,
.asset-card-inline,
.engagement-btn,
.art-signal-btn,
.art-conversion__secondary {
  transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease, color 160ms ease;
}

.art-related__item {
  padding: 10px 0;
}

.art-newsletter-compact__button,
.blog-comments__submit,
.mid-article-cta__button,
.tts-player__toggle {
  border: 1px solid color-mix(in srgb, var(--navy) 68%, var(--border));
  background: var(--navy);
  color: #fff;
}

.art-newsletter-compact__button:hover,
.blog-comments__submit:hover,
.mid-article-cta__button:hover,
.tts-player__toggle:hover {
  background: color-mix(in srgb, var(--navy) 88%, black 12%);
}

.tts-player {
  display: none;
  width: 100%;
  margin-top: 12px;
  padding: 14px 16px;
  box-shadow: none;
}

.tts-player__row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.tts-player__toggle {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border: 0;
}

.tts-player__meta {
  flex: 1;
  min-width: 0;
}

.tts-player__track {
  position: relative;
  height: 6px;
  overflow: hidden;
  cursor: pointer;
  border-radius: 999px;
  background: var(--border-strong);
}

.tts-player__fill {
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: var(--navy);
  transition: width 0.3s linear;
}

.tts-player__times {
  display: flex;
  justify-content: space-between;
  margin-top: 4px;
}

.tts-player__time {
  font-size: 11px;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}

.tts-player__stop {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border-panel);
  color: var(--text-muted);
  cursor: pointer;
}

.blog-inline-action {
  border: 0;
  padding: 0;
  background: none;
  color: var(--accent);
  font: inherit;
  font-weight: 700;
  text-decoration: underline;
  cursor: pointer;
}

/* Mobile-first polish pass */
html,
body,
.insights-app {
  max-width: 100%;
  overflow-x: hidden;
}

@media (max-width: 760px) {
  body {
    -webkit-text-size-adjust: 100%;
  }

  .insights-app::before {
    background-size: 28px 28px;
    opacity: 0.035;
  }

  .topbar {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 10px !important;
    padding: max(10px, env(safe-area-inset-top)) 14px 10px !important;
    overflow: hidden;
  }

  .brandmark {
    min-width: 0;
    min-height: 44px;
    gap: 10px;
    padding: 4px 0;
  }

  .brandmark__seal {
    width: 34px !important;
    height: 34px !important;
    border-radius: 10px !important;
    flex: 0 0 auto;
  }

  .brandmark__copy {
    min-width: 0;
  }

  .brandmark__title,
  .brand-wordmark {
    font-size: 0.94rem !important;
  }

  .brandmark__subtitle {
    display: none !important;
  }

  .topbar__actions {
    gap: 8px !important;
    justify-self: end;
  }

  .theme-switch {
    min-height: 44px;
    min-width: 44px;
    padding: 0 10px !important;
  }

  .theme-switch span:not([data-icon]) {
    display: none !important;
  }

  .avatar-button {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
  }

  .primary-nav {
    grid-column: 1 / -1;
    width: calc(100% + 28px) !important;
    margin: 0 -14px;
    padding: 4px 14px 0;
    gap: 8px !important;
    overflow-x: auto;
    justify-content: flex-start !important;
    scrollbar-width: none;
  }

  .primary-nav::-webkit-scrollbar {
    display: none;
  }

  .primary-nav a {
    flex: 0 0 auto;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    padding: 0 12px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--surface);
    font-size: 0.78rem !important;
  }

  .primary-nav a.is-active::after {
    display: none;
  }

  .theme-panel {
    left: 12px !important;
    right: 12px !important;
    top: 72px !important;
    width: auto !important;
    max-height: calc(100dvh - 88px);
    overflow: auto;
  }

  .page-wrap {
    padding: 18px 14px 32px !important;
  }

  .page-grid,
  .landing-hero,
  .landing-main,
  .detail-layout,
  .art-content-layout,
  .cat-layout {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .reveal-scale {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .left-rail,
  .detail-related,
  .art-sidebar {
    position: static !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .rail-heading,
  .brand-finish-card,
  .category-divider,
  .support-links {
    display: none !important;
  }

  .category-nav {
    display: flex !important;
    gap: 8px !important;
    overflow-x: auto;
    margin: 0 -14px;
    padding: 0 14px 4px;
    scrollbar-width: none;
  }

  .category-nav::-webkit-scrollbar {
    display: none;
  }

  .category-button {
    flex: 0 0 auto;
    width: auto !important;
    min-height: 42px;
    grid-template-columns: 16px auto !important;
    padding: 0 12px !important;
    border-color: var(--border) !important;
    background: var(--surface);
  }

  .hero-title,
  .detail-title,
  .art-title {
    max-width: 100% !important;
    font-size: clamp(1.9rem, 9vw, 2.45rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.035em !important;
  }

  .hero-subtitle,
  .feature-summary,
  .story-card__summary,
  .article-lead p,
  .article-section p,
  .article-body > p,
  .article-markdown {
    font-size: 1rem !important;
    line-height: 1.68 !important;
  }

  .hero-meta-row,
  .detail-meta,
  .art-meta,
  .section-header,
  .section-cluster__header,
  .hp-section__header {
    align-items: flex-start !important;
    flex-wrap: wrap;
    gap: 10px !important;
  }

  .hero-chip-row {
    width: calc(100% + 28px);
    margin-left: -14px;
    margin-right: -14px;
    padding-left: 14px;
    padding-right: 14px;
    overflow-x: auto;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    scrollbar-width: none;
  }

  .hero-chip-row::-webkit-scrollbar {
    display: none;
  }

  .hero-chip,
  .hp-ribbon__item {
    flex: 0 0 auto;
    min-height: 46px !important;
    padding: 0 14px !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.08em !important;
  }

  .hp-ribbon {
    width: 100% !important;
    margin: 0 !important;
    padding: 12px 0 !important;
    overflow: visible !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }

  .hp-ribbon__dot {
    display: none !important;
  }

  .hp-ribbon__item {
    flex: 1 1 calc(50% - 4px) !important;
    justify-content: center;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--surface);
    text-align: center;
  }

  .hp-section__more {
    min-height: 44px !important;
    padding: 10px 0 !important;
  }

  .feature-card__media,
  .story-card__media {
    min-height: 0;
  }

  .feature-card__media {
    height: auto !important;
    aspect-ratio: 16 / 10;
  }

  .story-grid,
  .latest-grid,
  .lane-grid,
  .hp-section__grid {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }

  .section-shell,
  .section-shell--stacked,
  .hp-section,
  .hp-cta,
  .blog-newsletter {
    margin-top: 28px !important;
  }

  .section-cluster,
  .feature-card__body,
  .detail-panel,
  .art-panel,
  .article-section--context,
  .article-section--summary,
  .mobile-takeaways-box,
  .asset-cards-inline,
  .hp-lead__body,
  .hp-cta {
    padding: 16px !important;
  }

  .hp-hero {
    margin-top: 22px !important;
    border-radius: var(--radius-md) !important;
  }

  .hp-sidebar-story {
    grid-template-columns: 72px minmax(0, 1fr) !important;
    gap: 12px !important;
    padding: 14px !important;
  }

  .hp-sidebar-story__title,
  .hp-card__title,
  .story-card__title,
  .art-related__title {
    -webkit-line-clamp: unset !important;
  }

  .art-header {
    padding: 18px 0 14px !important;
    margin-bottom: 18px !important;
  }

  .art-breadcrumb,
  .report-breadcrumb {
    gap: 6px !important;
    font-size: 0.64rem !important;
    letter-spacing: 0.08em !important;
    flex-wrap: wrap;
  }

  .art-impact__head,
  .art-pulse__head,
  .art-scenario__head,
  .art-impact__stats,
  .art-pulse__metrics,
  .art-scenario__outputs,
  .blog-newsletter__form,
  .blog-footer__grid {
    grid-template-columns: 1fr !important;
  }

  .art-impact__allocation {
    justify-self: start;
    min-height: 40px;
  }

  .art-related__item {
    padding-left: 10px !important;
  }

  .article-engagement,
  .article-themes__list,
  .asset-cards-inline__grid {
    gap: 8px !important;
  }

  .engagement-bar {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    padding: 12px !important;
  }

  .engagement-bar__actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100%;
  }

  .engagement-btn,
  .reaction-btn,
  .asset-card-inline,
  .art-signal-btn,
  .art-conversion__primary,
  .art-conversion__secondary,
  .blog-newsletter__btn,
  .blog-newsletter__input,
  .blog-comments__submit,
  .mid-article-cta__button {
    width: 100%;
    min-height: 44px;
    justify-content: center;
  }

  .engagement-bar__actions .engagement-btn {
    width: auto;
  }

  .blog-comments__input,
  .blog-comments__textarea,
  .footer-newsletter__form input,
  .blog-newsletter__input {
    font-size: 16px !important;
  }

  .blog-comments__textarea {
    min-height: 112px;
  }

  .blog-comments__submit {
    align-self: stretch;
  }

  .footer-newsletter__form button,
  .blog-footer__links a {
    min-height: 44px;
  }

  .quote-block,
  .article-markdown blockquote,
  .chart-card {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  .blog-newsletter {
    padding: 26px 0 !important;
  }

  .blog-footer {
    padding: 34px 0 26px !important;
  }
}

@media (max-width: 420px) {
  .hp-sidebar-story {
    grid-template-columns: 1fr !important;
  }

  .hp-sidebar-story__img {
    width: 100%;
    aspect-ratio: 16 / 9;
  }

  .detail-meta__item {
    grid-template-columns: 42px minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  .detail-avatar,
  .detail-author-initials {
    width: 42px !important;
    height: 42px !important;
  }
}

@media (max-width: 767px) {
  .art-sidebar {
    display: none !important;
  }

  .art-content-layout {
    gap: 16px !important;
    margin-top: 18px !important;
  }

  .mobile-takeaways-box {
    margin-bottom: 18px !important;
  }
}

/* ==========================================================================
   EDITORIAL MAGAZINE HOMEPAGE — v2 rich magazine design (2026-04-24)
   All classes prefixed with ed-. Scoped under .ed-home wrapper.
   ========================================================================== */

/* ---------- Override existing chrome when editorial home is active ---------- */
.insights-app.ed-home-active { min-height: 100vh; background: var(--ed-paper); }
.insights-app.ed-home-active .topbar { display: none !important; }
.insights-app.ed-home-active .insights-app::before { display: none; }

/* ---------- Editorial CSS Custom Properties ---------- */
.ed-home {
  --ed-paper: #EDE4CE;
  --ed-paper-2: #E2D7BA;
  --ed-paper-3: #F4ECD6;
  --ed-ink: #0A0A09;
  --ed-ink-2: #27251F;
  --ed-mute: #736E5F;
  --ed-rule: #1A1814;
  --ed-rule-soft: #C6BDA1;
  --ed-lime: #DBFF2E;
  --ed-terra: #C2421E;
  --ed-terra-deep: #8C2A12;
  --ed-forest: #0F3A26;
  --ed-forest-2: #1A5137;
  --ed-plum: #3A1C2B;
  --ed-ox: #5C1A18;
  --ed-ochre: #B8893A;
  --ed-gold: #C9A24C;
  --ed-card: #F4ECD6;
  --ed-card-2: #E8DFC2;
  --ed-radius: 0px;
}

/* ---------- Editorial font helper classes ---------- */
.ed-home .ed-serif {
  font-family: 'Instrument Serif', Georgia, serif;
  letter-spacing: -.005em;
}
.ed-home .ed-mono {
  font-family: 'Space Mono', 'Courier New', monospace;
  font-feature-settings: "tnum";
}

/* ---------- Editorial selection colour ---------- */
.ed-home ::selection {
  background: var(--ed-lime);
  color: var(--ed-ink);
}

/* Ornamental hairline frame utility */
.ed-home .ed-hairline-frame { position: relative; }
.ed-home .ed-hairline-frame::before {
  content: "";
  position: absolute;
  inset: 8px;
  border: 1px solid var(--ed-rule);
  pointer-events: none;
  opacity: .35;
}

/* Fleurons / ornaments */
.ed-home .ed-fleuron {
  display: inline-block;
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  color: var(--ed-terra);
  line-height: 1;
}
.ed-home .ed-fleuron::before { content: "\2766"; }
.ed-home .ed-fleuron.cross::before { content: "\2722"; }
.ed-home .ed-fleuron.star::before { content: "\2726"; }
.ed-home .ed-fleuron.pilc::before { content: "\00B6"; }

/* Divider with ornament */
.ed-home .ed-orn-divider {
  display: flex;
  align-items: center;
  gap: 14px;
  color: var(--ed-mute);
  margin: 0;
}
.ed-home .ed-orn-divider::before,
.ed-home .ed-orn-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--ed-rule-soft), transparent);
}
.ed-home .ed-orn-divider span {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  color: var(--ed-terra);
  font-size: 18px;
  letter-spacing: .2em;
}

/* ---------- Editorial base ---------- */
.ed-home {
  margin: 0;
  padding: 0;
  background:
    radial-gradient(1400px 900px at 85% -5%, rgba(194,66,30,.05), transparent 55%),
    radial-gradient(1200px 800px at -5% 50%, rgba(15,58,38,.05), transparent 55%),
    radial-gradient(1000px 700px at 60% 110%, rgba(201,162,76,.08), transparent 60%),
    var(--ed-paper);
  color: var(--ed-ink);
  font-family: 'Bricolage Grotesque', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-variation-settings: "wdth" 100, "opsz" 24;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  font-size: 15px;
  line-height: 1.45;
  position: relative;
}

/* Paper grain — multi-layered for richness */
.ed-home::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  opacity: .28;
  mix-blend-mode: multiply;
  background-image:
    radial-gradient(circle at 0.5px 0.5px, rgba(10,10,9,.4) 0.5px, transparent 0),
    radial-gradient(circle at 1.5px 2.5px, rgba(92,26,24,.18) 0.4px, transparent 0);
  background-size: 3px 3px, 5px 5px;
}
.ed-home::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 2;
  background:
    radial-gradient(1200px 700px at 80% -10%, rgba(10,10,9,.14), transparent 60%),
    radial-gradient(900px 600px at -10% 110%, rgba(10,10,9,.10), transparent 60%),
    linear-gradient(180deg, rgba(92,26,24,.03), transparent 20%, transparent 80%, rgba(10,10,9,.05));
  mix-blend-mode: multiply;
}

/* ---------- Editorial scrollbar ---------- */
.ed-home ::-webkit-scrollbar { height: 8px; width: 8px; }
.ed-home ::-webkit-scrollbar-track { background: var(--ed-paper); }
.ed-home ::-webkit-scrollbar-thumb { background: var(--ed-rule); }

/* ---------- Animations (global — not scoped) ---------- */
@keyframes ed-mar {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@keyframes mar {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@keyframes ed-blink {
  50% { opacity: .25; }
}
@keyframes blink {
  50% { opacity: .25; }
}

/* ==========================================================================
   TOP ORNAMENTAL STRIP
   ========================================================================== */
.ed-home .ed-top-strip {
  background: var(--ed-ink);
  color: var(--ed-paper);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 20px;
  font-family: 'Space Mono', monospace;
  font-size: 9.5px;
  letter-spacing: .24em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--ed-rule);
}
.ed-home .ed-top-strip .ornaments {
  display: flex;
  gap: 10px;
  color: var(--ed-gold);
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  letter-spacing: .05em;
}
.ed-home .ed-top-strip .ornaments span { opacity: .75; }

/* ==========================================================================
   MASTHEAD BAR
   ========================================================================== */
.ed-home .ed-masthead {
  border-bottom: 1px solid var(--ed-rule);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
  position: relative;
  z-index: 10;
  background: var(--ed-paper);
}
.ed-home .ed-masthead::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 4px;
  pointer-events: none;
  background: repeating-linear-gradient(90deg, var(--ed-rule) 0 6px, transparent 6px 14px);
  opacity: .4;
}
.ed-home .ed-masthead .cell {
  padding: 14px 20px;
  border-right: 1px solid var(--ed-rule);
  display: flex;
  gap: 18px;
  align-items: center;
}
.ed-home .ed-masthead .cell:last-child { border-right: 0; }
.ed-home .ed-masthead .cell.right { justify-content: flex-end; gap: 18px; }
.ed-home .ed-masthead .cell.center {
  justify-content: center;
  border-right: 1px solid var(--ed-rule);
  padding: 0 20px;
  gap: 14px;
  flex-wrap: wrap;
}
.ed-home .ed-masthead .logo {
  font-family: 'Instrument Serif', serif;
  font-size: 26px;
  letter-spacing: -.015em;
  text-transform: none;
  font-style: italic;
  color: var(--ed-ink);
  display: inline-flex;
  align-items: baseline;
  gap: 2px;
}
.ed-home .ed-masthead .logo::before {
  content: "\2726";
  font-size: 12px;
  color: var(--ed-terra);
  margin-right: 6px;
  vertical-align: .2em;
}
.ed-home .ed-masthead .dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  background: var(--ed-terra);
  border-radius: 99px;
  margin-right: 4px;
  animation: ed-blink 2s infinite;
}
.ed-home .ed-masthead a { color: inherit; text-decoration: none; }
.ed-home .ed-masthead .cell.center a { position: relative; }
.ed-home .ed-masthead .cell.center a:hover { color: var(--ed-terra); }
.ed-home .ed-masthead .subscribe {
  background: var(--ed-ink);
  color: var(--ed-paper);
  padding: 6px 12px;
  display: inline-flex;
  gap: 8px;
  align-items: center;
}

/* ==========================================================================
   TICKER MARQUEE
   ========================================================================== */
.ed-home .ed-ticker {
  border-bottom: 1px solid var(--ed-rule);
  background: var(--ed-ink);
  color: var(--ed-paper);
  overflow: hidden;
  position: relative;
}
.ed-home .ed-ticker .inner {
  display: flex;
  gap: 40px;
  padding: 9px 0;
  white-space: nowrap;
  animation: ed-mar 60s linear infinite;
  width: max-content;
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .04em;
}
.ed-home .ed-ticker span .u { color: var(--ed-lime); }
.ed-home .ed-ticker span .d { color: var(--ed-terra); }

/* ==========================================================================
   SCROLL PROGRESS + FOLIO + CURSOR LABEL
   ========================================================================== */
.ed-home .ed-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  background: var(--ed-terra);
  z-index: 200;
  width: var(--p, 0%);
  transition: width .15s;
}
.ed-home .ed-folio {
  position: fixed;
  bottom: 18px;
  right: 20px;
  z-index: 120;
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ed-ink);
  background: var(--ed-paper);
  border: 1px solid var(--ed-rule);
  padding: 6px 12px;
  display: flex;
  gap: 12px;
  align-items: center;
  pointer-events: none;
}
.ed-home .ed-folio .live {
  width: 6px;
  height: 6px;
  background: var(--ed-terra);
  border-radius: 99px;
  animation: ed-blink 2s infinite;
}
.ed-home .ed-cursor-label {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 150;
  pointer-events: none;
  background: var(--ed-ink);
  color: var(--ed-lime);
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding: 5px 10px;
  transform: translate(20px, 20px);
  opacity: 0;
  transition: opacity .2s;
  white-space: nowrap;
}
.ed-home .ed-cursor-label.show { opacity: 1; }

/* ==========================================================================
   REGISTRATION / CROP MARKS
   ========================================================================== */
.ed-home .ed-reg {
  position: absolute;
  width: 18px;
  height: 18px;
  pointer-events: none;
  opacity: .55;
}
.ed-home .ed-reg::before,
.ed-home .ed-reg::after {
  content: "";
  position: absolute;
  background: var(--ed-ink);
}
.ed-home .ed-reg::before {
  left: 50%;
  top: 0;
  bottom: 0;
  width: 1px;
  transform: translateX(-50%);
}
.ed-home .ed-reg::after {
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  transform: translateY(-50%);
}
.ed-home .ed-reg.tl { top: 12px; left: 12px; }
.ed-home .ed-reg.tr { top: 12px; right: 12px; }
.ed-home .ed-reg.bl { bottom: 12px; left: 12px; }
.ed-home .ed-reg.br { bottom: 12px; right: 12px; }

/* ==========================================================================
   HERO / COVER
   ========================================================================== */
.ed-home .ed-hero {
  position: relative;
  padding: 36px 40px 72px;
  min-height: 96vh;
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 64px;
  border-bottom: 1px solid var(--ed-rule);
  overflow: hidden;
}
.ed-home .ed-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(620px 560px at var(--ed-mx, 30%) var(--ed-my, 40%), rgba(219,255,46,.22), transparent 62%),
    radial-gradient(900px 600px at 95% 15%, rgba(194,66,30,.06), transparent 60%),
    radial-gradient(700px 500px at 5% 90%, rgba(15,58,38,.08), transparent 60%);
  pointer-events: none;
  z-index: 0;
}
.ed-home .ed-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background-image: repeating-linear-gradient(0deg, transparent 0 119px, rgba(10,10,9,.04) 119px 120px);
}

/* Hero left — faux magazine cover */
.ed-home .ed-hero-left {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.ed-home .ed-cover-card {
  position: relative;
  background:
    radial-gradient(1200px 500px at 50% -20%, rgba(219,255,46,.38), transparent 55%),
    linear-gradient(160deg, var(--ed-paper-3) 0%, var(--ed-paper-2) 60%, var(--ed-card-2) 100%);
  border: 1px solid var(--ed-rule);
  min-height: 780px;
  padding: 28px 30px;
  display: flex;
  flex-direction: column;
  gap: 28px;
  box-shadow:
    16px 16px 0 var(--ed-ink),
    16px 16px 0 1px var(--ed-ink),
    inset 0 0 0 1px rgba(245,236,213,.35),
    inset 0 0 120px rgba(92,26,24,.04);
  overflow: hidden;
}
.ed-home .ed-cover-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(900px 400px at 50% 0%, rgba(219,255,46,.42), transparent 62%),
    radial-gradient(500px 400px at 90% 90%, rgba(194,66,30,.10), transparent 60%),
    linear-gradient(180deg, transparent 0%, rgba(10,10,9,.05) 100%);
  pointer-events: none;
  z-index: 0;
}
/* Decorative inner frame */
.ed-home .ed-cover-card::after {
  content: "";
  position: absolute;
  inset: 14px;
  border: 1px solid var(--ed-rule);
  pointer-events: none;
  opacity: .28;
  z-index: 1;
}
.ed-home .ed-cover-top {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
}
.ed-home .ed-cover-top .nameplate {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: 54px;
  line-height: 1;
  letter-spacing: -.022em;
  text-shadow: 0 1px 0 rgba(255,255,255,.25);
}
.ed-home .ed-cover-top .nameplate sup {
  font-size: 13px;
  color: var(--ed-terra);
  margin-left: 4px;
  font-style: normal;
  font-family: 'Space Mono', monospace;
  letter-spacing: .14em;
  text-transform: uppercase;
  vertical-align: super;
  top: -.7em;
}
.ed-home .ed-cover-top .meta {
  text-align: right;
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ed-ink-2);
  line-height: 1.5;
}
.ed-home .ed-cover-top .meta b {
  color: var(--ed-terra);
  font-weight: 400;
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: 13px;
  letter-spacing: 0;
  text-transform: none;
}

.ed-home .ed-cover-center {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex: 1;
  justify-content: center;
}
.ed-home .ed-issue-badge {
  display: inline-flex;
  align-items: baseline;
  gap: 10px;
  align-self: flex-start;
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .2em;
  text-transform: uppercase;
  background: var(--ed-ink);
  color: var(--ed-lime);
  padding: 7px 14px;
  box-shadow: 3px 3px 0 var(--ed-terra);
}
.ed-home .ed-issue-badge .big {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: .05em;
  color: var(--ed-paper);
}
.ed-home .ed-cover-headline {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 88, "opsz" 96;
  font-weight: 700;
  font-size: clamp(36px, 3.4vw, 58px);
  line-height: .94;
  letter-spacing: -.032em;
  margin: 0 0 8px;
  text-transform: uppercase;
}
.ed-home .ed-cover-headline .ln { display: block; white-space: nowrap; }
.ed-home .ed-cover-headline em {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-weight: 400;
  color: var(--ed-terra);
  text-transform: none;
  letter-spacing: -.01em;
  background: linear-gradient(180deg, var(--ed-terra), var(--ed-terra-deep));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.ed-home .ed-cover-headline .hl {
  background: var(--ed-lime);
  padding: 0 .06em;
  display: inline-block;
  transform: rotate(-1.2deg);
  box-shadow: 2px 2px 0 var(--ed-ink);
}
.ed-home .ed-cover-deck {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: 20px;
  line-height: 1.32;
  color: var(--ed-ink-2);
  max-width: 36ch;
  margin-top: 4px;
  position: relative;
  padding-left: 18px;
  border-left: 2px solid var(--ed-terra);
}
.ed-home .ed-cover-deck b { color: var(--ed-ink); font-weight: 400; }

.ed-home .ed-cover-bottom {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 20px;
  padding-top: 22px;
  border-top: 1px solid var(--ed-rule);
}
.ed-home .ed-cover-bottom::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -1px;
  height: 5px;
  background: repeating-linear-gradient(90deg, var(--ed-rule) 0 3px, transparent 3px 8px);
  opacity: .25;
}
.ed-home .ed-cover-contents {
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
  line-height: 1.6;
  color: var(--ed-ink-2);
}
.ed-home .ed-cover-contents b { color: var(--ed-ink); font-weight: 700; }
.ed-home .ed-cover-contents .row { display: flex; gap: 12px; align-items: baseline; }
.ed-home .ed-cover-contents .row .pg {
  color: var(--ed-terra);
  font-weight: 700;
  min-width: 34px;
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: 13px;
  letter-spacing: 0;
}
.ed-home .ed-cover-contents .row .dt {
  color: var(--ed-mute);
  font-size: 9px;
  margin-left: auto;
}

.ed-home .ed-barcode { display: flex; flex-direction: column; gap: 4px; align-items: flex-end; }
.ed-home .ed-barcode .bars { display: flex; gap: 1.5px; align-items: flex-end; height: 36px; }
.ed-home .ed-barcode .bars span { background: var(--ed-ink); display: inline-block; }
.ed-home .ed-barcode .price {
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.ed-home .ed-barcode .price b {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: 20px;
  letter-spacing: -.01em;
  color: var(--ed-terra);
  vertical-align: -.05em;
}

/* Giant mega-numeral watermark INSIDE cover */
.ed-home .ed-cover-mega {
  position: absolute;
  right: -8%;
  bottom: -15%;
  z-index: 1;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 800;
  font-variation-settings: "wdth" 75, "opsz" 96;
  font-size: min(60vh, 36vw);
  line-height: .78;
  letter-spacing: -.06em;
  color: var(--ed-ink);
  opacity: .035;
  pointer-events: none;
}

.ed-home .ed-hero-meta {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 24px;
  padding: 22px 0 0;
  border-top: 1px solid var(--ed-rule);
}
.ed-home .ed-hero-meta .k {
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ed-mute);
}
.ed-home .ed-hero-meta .v {
  font-family: 'Instrument Serif', serif;
  font-size: 22px;
  margin-top: 4px;
  line-height: 1.1;
}

/* Hero right */
.ed-home .ed-hero-right {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 22px;
  justify-content: space-between;
  padding-top: 40px;
}
.ed-home .ed-hero-right .toc {
  display: flex;
  flex-direction: column;
  gap: 2px;
  border-top: 1px solid var(--ed-rule);
  padding-top: 16px;
  position: relative;
}
.ed-home .ed-hero-right .toc::before {
  content: "Contents \00B7  N\00B0 04";
  position: absolute;
  top: -8px;
  left: 0;
  background: var(--ed-paper);
  padding: 0 10px 0 0;
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--ed-terra);
}
.ed-home .ed-hero-right .toc .row {
  display: grid;
  grid-template-columns: 42px 1fr 50px;
  gap: 14px;
  padding: 10px 0;
  border-bottom: 1px solid var(--ed-rule-soft);
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ed-ink-2);
  align-items: center;
  cursor: pointer;
  transition: padding-left .3s;
}
.ed-home .ed-hero-right .toc .row:hover {
  padding-left: 10px;
  color: var(--ed-ink);
  background: linear-gradient(90deg, rgba(194,66,30,.05), transparent);
}
.ed-home .ed-hero-right .toc .row .pg {
  color: var(--ed-terra);
  font-weight: 700;
  font-family: 'Instrument Serif', serif;
  font-size: 15px;
  font-style: italic;
  letter-spacing: 0;
}
.ed-home .ed-hero-right .toc .row .t {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: 17px;
  letter-spacing: -.01em;
  text-transform: none;
  color: var(--ed-ink);
  line-height: 1.2;
}
.ed-home .ed-hero-right .toc .row .m {
  text-align: right;
  color: var(--ed-mute);
}

/* Pullquote */
.ed-home .ed-pullquote {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: clamp(36px, 3.2vw, 52px);
  line-height: 1.02;
  letter-spacing: -.018em;
  color: var(--ed-ink);
  position: relative;
}
.ed-home .ed-pullquote .mark {
  position: absolute;
  left: -.4em;
  top: -.3em;
  font-size: 2em;
  color: var(--ed-terra);
  line-height: 1;
  font-family: 'Instrument Serif', serif;
  opacity: .9;
}
.ed-home .ed-pullquote em {
  font-style: italic;
  background: linear-gradient(transparent 60%, var(--ed-lime) 60%, var(--ed-lime) 94%, transparent 94%);
  padding: 0 .1em;
  box-shadow: 0 2px 0 var(--ed-ink);
}
.ed-home .ed-byline {
  display: flex;
  gap: 14px;
  align-items: center;
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ed-ink-2);
}
.ed-home .ed-byline .avatar {
  width: 42px;
  height: 42px;
  border-radius: 99px;
  background: radial-gradient(circle at 30% 30%, #E8603A, var(--ed-terra) 60%, var(--ed-terra-deep));
  color: var(--ed-paper);
  display: grid;
  place-items: center;
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: 22px;
  box-shadow: 0 4px 12px rgba(92,26,24,.3), inset 0 -4px 8px rgba(92,26,24,.4);
}

/* Vertical running text */
.ed-home .ed-vert {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%) rotate(-90deg);
  transform-origin: left center;
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .4em;
  text-transform: uppercase;
  color: var(--ed-mute);
  white-space: nowrap;
  z-index: 3;
}

/* Corner stamps */
.ed-home .ed-stamp {
  position: absolute;
  width: 130px;
  height: 130px;
  border: 1.5px solid var(--ed-ink);
  border-radius: 99px;
  display: grid;
  place-items: center;
  text-align: center;
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
  line-height: 1.2;
  color: var(--ed-ink);
  background: var(--ed-lime);
  transform: rotate(-14deg);
}
.ed-home .ed-stamp.tl { top: 80px; left: 44%; }
.ed-home .ed-stamp.br {
  bottom: 40px;
  right: 48px;
  background: transparent;
  color: var(--ed-ink);
}
.ed-home .ed-stamp strong {
  display: block;
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: 28px;
  letter-spacing: -.01em;
  font-weight: 400;
  margin: 4px 0;
  text-transform: none;
}

/* ==========================================================================
   GIANT WORD MARQUEE
   ========================================================================== */
.ed-home .ed-wordmar {
  border-top: 1px solid var(--ed-rule);
  border-bottom: 1px solid var(--ed-rule);
  overflow: hidden;
  background:
    radial-gradient(600px 200px at 50% 50%, rgba(194,66,30,.06), transparent 60%),
    var(--ed-paper);
  padding: 18px 0;
  position: relative;
}
.ed-home .ed-wordmar::before,
.ed-home .ed-wordmar::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 120px;
  z-index: 2;
  pointer-events: none;
}
.ed-home .ed-wordmar::before {
  left: 0;
  background: linear-gradient(90deg, var(--ed-paper), transparent);
}
.ed-home .ed-wordmar::after {
  right: 0;
  background: linear-gradient(270deg, var(--ed-paper), transparent);
}
.ed-home .ed-wordmar .inner {
  display: flex;
  gap: 48px;
  white-space: nowrap;
  animation: mar 40s linear infinite;
  width: max-content;
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: 80px;
  line-height: 1;
  letter-spacing: -.025em;
}
.ed-home .ed-wordmar .inner span {
  display: inline-flex;
  gap: 48px;
  align-items: center;
}
.ed-home .ed-wordmar .inner .bullet {
  width: 14px;
  height: 14px;
  background: var(--ed-terra);
  border-radius: 99px;
  display: inline-block;
  vertical-align: middle;
  box-shadow: 0 0 0 3px var(--ed-paper), 0 0 0 4px var(--ed-terra);
}
.ed-home .ed-wordmar .inner em { font-style: italic; color: var(--ed-terra); }
.ed-home .ed-wordmar .inner .hl { background: var(--ed-lime); padding: 0 .15em; box-shadow: 3px 3px 0 var(--ed-ink); }

/* ==========================================================================
   COVER STORY SECTION
   ========================================================================== */
.ed-home .ed-cover {
  padding: 88px 40px 100px;
  border-bottom: 1px solid var(--ed-rule);
  position: relative;
  background:
    radial-gradient(900px 600px at 90% 10%, rgba(194,66,30,.05), transparent 60%),
    radial-gradient(700px 500px at 5% 90%, rgba(15,58,38,.04), transparent 60%);
}
.ed-home .ed-cover::before {
  content: "";
  position: absolute;
  top: 24px;
  left: 40px;
  right: 40px;
  height: 1px;
  background: var(--ed-rule);
  opacity: .25;
}
.ed-home .ed-cover::after {
  content: "\2722";
  position: absolute;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  color: var(--ed-terra);
  font-family: 'Instrument Serif', serif;
  font-size: 18px;
  background: var(--ed-paper);
  padding: 0 14px;
}
.ed-home .ed-cover-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: end;
}
.ed-home .ed-cover-kicker {
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ed-terra);
  display: flex;
  gap: 14px;
  align-items: center;
}
.ed-home .ed-cover-kicker::before {
  content: "";
  width: 44px;
  height: 1px;
  background: var(--ed-terra);
}
.ed-home .ed-cover-kicker::after {
  content: "\2726";
  color: var(--ed-terra);
  font-family: 'Instrument Serif', serif;
  font-size: 14px;
  letter-spacing: 0;
}
.ed-home .ed-cover-title {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95, "opsz" 96;
  font-weight: 500;
  font-size: clamp(72px, 7.2vw, 128px);
  line-height: 1.02;
  letter-spacing: -.035em;
  margin: 16px 0 96px;
  text-wrap: balance;
  padding-bottom: .1em;
}
.ed-home .ed-cover-title em {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-weight: 400;
  letter-spacing: -.01em;
  background: linear-gradient(180deg, var(--ed-terra), var(--ed-terra-deep));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.ed-home .ed-cover-title .hl {
  background: var(--ed-lime);
  padding: 0 .05em;
  display: inline-block;
  transform: rotate(-1deg);
  box-shadow: 3px 3px 0 var(--ed-ink);
}
.ed-home .ed-cover-lede {
  font-family: 'Instrument Serif', serif;
  font-size: 25px;
  line-height: 1.4;
  color: var(--ed-ink-2);
  max-width: 44ch;
  margin-top: 60px;
  clear: both;
  column-count: 1;
}
.ed-home .ed-cover-lede::first-letter {
  font-size: 4.2em;
  float: left;
  line-height: .82;
  margin: 0.08em 0.1em 0 0;
  color: var(--ed-terra);
  font-style: italic;
  font-weight: 400;
  text-shadow: 3px 3px 0 rgba(10,10,9,.08);
}
.ed-home .ed-cover-meta {
  display: flex;
  gap: 28px;
  margin-top: 28px;
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ed-mute);
  align-items: center;
  flex-wrap: wrap;
}
.ed-home .ed-cover-meta .read {
  display: inline-flex;
  gap: 12px;
  align-items: center;
  color: var(--ed-ink);
  border: 1px solid var(--ed-ink);
  padding: 12px 22px;
  border-radius: 99px;
  text-transform: uppercase;
  cursor: pointer;
  text-decoration: none;
  background: var(--ed-paper);
  position: relative;
  transition: all .3s;
}
.ed-home .ed-cover-meta .read::before {
  content: "";
  position: absolute;
  inset: -4px;
  border: 1px solid var(--ed-rule-soft);
  border-radius: 99px;
  opacity: .5;
}
.ed-home .ed-cover-meta .read:hover {
  background: var(--ed-ink);
  color: var(--ed-paper);
}
.ed-home .ed-cover-meta .read .arr {
  display: inline-block;
  transition: transform .4s;
}
.ed-home .ed-cover-meta .read:hover .arr { transform: translateX(6px); }

/* Cover visual — duotone photograph */
.ed-home .ed-cover-viz {
  position: relative;
  aspect-ratio: 4/5;
  width: 100%;
  background: var(--ed-ink);
  overflow: hidden;
  box-shadow:
    30px 30px 0 var(--ed-lime),
    30px 30px 0 1px var(--ed-ink),
    0 0 0 1px var(--ed-ink);
}
.ed-home .ed-cover-viz::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 3;
  box-shadow: inset 0 0 80px rgba(10,10,9,.5);
}
.ed-home .ed-cover-viz::after {
  content: "";
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(237,228,206,.15);
  pointer-events: none;
  z-index: 3;
}
.ed-home .ed-cover-viz svg,
.ed-home .ed-cover-viz img {
  width: 100%;
  height: 100%;
  display: block;
  filter: contrast(1.1);
  object-fit: cover;
}
.ed-home .ed-cover-viz .caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 14px 18px;
  background: color-mix(in srgb, var(--ed-ink) 85%, transparent);
  color: var(--ed-paper);
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  display: flex;
  justify-content: space-between;
  gap: 16px;
}
.ed-home .ed-cover-viz .price {
  position: absolute;
  top: 18px;
  right: 18px;
  background: var(--ed-lime);
  color: var(--ed-ink);
  padding: 6px 10px;
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.ed-home .ed-cover-viz .rotate-tag {
  position: absolute;
  top: 36px;
  left: -26px;
  transform: rotate(-24deg);
  background: var(--ed-terra);
  color: var(--ed-paper);
  padding: 8px 18px;
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .2em;
  text-transform: uppercase;
}

/* ==========================================================================
   THE INDEX — asymmetric masonry grid
   ========================================================================== */
.ed-home .ed-index-head {
  padding: 96px 40px 28px;
  border-bottom: 1px solid var(--ed-rule);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 20px;
  align-items: end;
  position: relative;
}
.ed-home .ed-index-head::before {
  content: "\2766";
  position: absolute;
  top: 32px;
  left: 50%;
  transform: translateX(-50%);
  color: var(--ed-terra);
  font-family: 'Instrument Serif', serif;
  font-size: 22px;
  font-style: italic;
}
.ed-home .ed-index-head h2 {
  margin: 0;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 85, "opsz" 96;
  font-weight: 700;
  font-size: clamp(80px, 11vw, 200px);
  line-height: .82;
  letter-spacing: -.045em;
  text-transform: uppercase;
}
.ed-home .ed-index-head h2 em {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-weight: 400;
  text-transform: none;
  background: linear-gradient(180deg, var(--ed-terra), var(--ed-terra-deep) 80%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.ed-home .ed-index-head .nav {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
  max-width: 520px;
}
.ed-home .ed-index-head .nav button {
  padding: 8px 14px;
  border: 1px solid var(--ed-rule);
  background: transparent;
  cursor: pointer;
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--ed-ink-2);
  border-radius: 99px;
  transition: all .25s;
}
.ed-home .ed-index-head .nav button:hover {
  background: var(--ed-ink);
  color: var(--ed-paper);
}
.ed-home .ed-index-head .nav button.on {
  background: var(--ed-ink);
  color: var(--ed-lime);
  box-shadow: 3px 3px 0 var(--ed-terra);
}

.ed-home .ed-index {
  padding: 48px 40px;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 40px 28px;
  border-bottom: 1px solid var(--ed-rule);
  position: relative;
}

/* ---------- Article card base ---------- */
.ed-home .ed-a {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 14px;
  cursor: pointer;
  align-self: start;
}
.ed-home .ed-a .num {
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--ed-mute);
  display: flex;
  gap: 10px;
  align-items: center;
}
.ed-home .ed-a .num::before {
  content: "";
  width: 22px;
  height: 1px;
  background: var(--ed-terra);
}
.ed-home .ed-a .cat {
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ed-terra);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.ed-home .ed-a .cat::before {
  content: "\2726";
  color: var(--ed-terra);
  font-family: 'Instrument Serif', serif;
  font-size: 12px;
  letter-spacing: 0;
}
.ed-home .ed-a .t {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95, "opsz" 36;
  font-weight: 500;
  letter-spacing: -.02em;
  line-height: 1.02;
  margin: 0;
  text-wrap: balance;
}
.ed-home .ed-a .t em {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-weight: 400;
  letter-spacing: -.01em;
  color: var(--ed-terra);
}
.ed-home .ed-a .num,
.ed-home .ed-a .cat,
.ed-home .ed-a .t,
.ed-home .ed-a .d,
.ed-home .ed-a .f {
  position: relative;
  z-index: 1;
}
.ed-home .ed-a .d {
  color: var(--ed-ink-2);
  font-size: 14.5px;
  line-height: 1.55;
  max-width: 52ch;
}
.ed-home .ed-a .f {
  display: flex;
  gap: 14px;
  align-items: center;
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--ed-mute);
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid var(--ed-rule-soft);
}
.ed-home .ed-a .f .sep {
  width: 4px;
  height: 4px;
  background: var(--ed-terra);
  border-radius: 99px;
  opacity: .7;
}
/* Card tiles: background + full border + lane-accent top + lane colour tokens */
.ed-home .ed-a                             { --lc:var(--ed-rule); --lc-soft:rgba(10,10,9,.04); }
.ed-home .ed-a[data-lane="global-markets"] { --lc:#C2421E; --lc-soft:rgba(194,66,30,.06);   border-top-color: #C2421E; }
.ed-home .ed-a[data-lane="tech-equities"]  { --lc:#7ca01a; --lc-soft:rgba(124,160,26,.07);  border-top-color: var(--ed-lime); }
.ed-home .ed-a[data-lane="fixed-income"]   { --lc:#4a7ab0; --lc-soft:rgba(74,122,176,.06);  border-top-color: #7aa3d4; }
.ed-home .ed-a[data-lane="crypto-assets"]  { --lc:#6e66d4; --lc-soft:rgba(110,102,212,.06); border-top-color: #a49df0; }
.ed-home .ed-a[data-lane="esg-investing"]  { --lc:#3a9e65; --lc-soft:rgba(58,158,101,.06);  border-top-color: #6ec98f; }

.ed-home .ed-a {
  background: var(--ed-card, #F4ECD6);
  /* Subtle horizontal register lines — financial ledger feel */
  background-image:
    repeating-linear-gradient(
      180deg,
      transparent 0px,
      transparent 27px,
      color-mix(in srgb, var(--ed-rule) 5%, transparent) 27px,
      color-mix(in srgb, var(--ed-rule) 5%, transparent) 28px
    );
  /* Lane tint wash */
  background-blend-mode: multiply;
  border: 1px solid var(--ed-rule-soft, #C6BDA1);
  border-top: 4px solid var(--lc);
  transition: transform .25s, box-shadow .25s;
}
.ed-home .ed-a::after {
  /* Lane glow wash in corner */
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 60%;
  height: 50%;
  background: radial-gradient(ellipse at 100% 100%, color-mix(in srgb, var(--lc) 10%, transparent), transparent 70%);
  pointer-events: none;
  z-index: 0;
}
.ed-home .ed-a:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 28px rgba(10,10,9,.12);
  border-top-width: 6px;
}

/* FEATURE — A1 (8 columns) */
.ed-home .ed-a.A1 { grid-column: span 8; gap: 20px; min-height: 280px; padding: 28px 24px 28px; }
.ed-home .ed-a.A1 .t { font-size: clamp(44px, 4.8vw, 76px); line-height: .95; }
.ed-home .ed-a.A1 .d { font-size: 17px; max-width: 60ch; }
/* A1 overrides the generic ::after glow with a large decorative watermark */
.ed-home .ed-a.A1::after {
  content: none; /* remove glow — use explicit watermark below */
}
.ed-home .ed-a.A1 {
  background-image:
    repeating-linear-gradient(180deg, transparent 0px, transparent 27px, color-mix(in srgb, var(--ed-rule) 5%, transparent) 27px, color-mix(in srgb, var(--ed-rule) 5%, transparent) 28px);
}
.ed-home .ed-a.A1 .num::after {
  content: "A\00B701";
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .2em;
  color: var(--ed-mute);
  margin-left: 12px;
}

/* A2 — sidebar (4 columns) */
.ed-home .ed-a.A2 { grid-column: span 4; gap: 14px; padding: 20px 20px 24px; }
.ed-home .ed-a.A2 .t { font-size: 26px; line-height: 1.05; }
.ed-home .ed-a.A2 .d { font-size: 14px; }

/* Row 2 */
.ed-home .ed-a.B1 { grid-column: span 3; padding: 18px 18px 20px; }
.ed-home .ed-a.B1 .t { font-size: 22px; line-height: 1.08; }

.ed-home .ed-a.B2 { grid-column: span 5; padding: 18px 18px 20px; }
.ed-home .ed-a.B2 .t { font-size: 32px; line-height: 1; }
.ed-home .ed-a.B2 .d { font-size: 15px; }

.ed-home .ed-a.B3 { grid-column: span 4; padding: 18px 18px 20px; }
.ed-home .ed-a.B3 .t { font-size: 26px; line-height: 1.02; }
.ed-home .ed-a.B3 .d { font-size: 14px; }

/* Row 3 — bigquote + two pieces */
.ed-home .ed-bigquote {
  grid-column: span 6;
  padding: 44px 36px;
  display: flex;
  flex-direction: column;
  gap: 22px;
  justify-content: center;
  border-top: 1px solid var(--ed-rule);
  border-bottom: 1px solid var(--ed-rule);
  position: relative;
  background:
    radial-gradient(600px 400px at 0% 0%, rgba(219,255,46,.18), transparent 60%),
    radial-gradient(500px 400px at 100% 100%, rgba(194,66,30,.06), transparent 60%);
}
.ed-home .ed-bigquote::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 16px;
  bottom: 16px;
  right: 16px;
  border: 1px solid var(--ed-rule-soft);
  pointer-events: none;
  opacity: .45;
}
.ed-home .ed-bigquote::after {
  content: "\274B";
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  color: var(--ed-terra);
  font-family: 'Instrument Serif', serif;
  font-size: 22px;
  background: var(--ed-paper);
  padding: 0 14px;
}
.ed-home .ed-bigquote q {
  display: block;
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: clamp(38px, 3.8vw, 60px);
  line-height: 1.04;
  letter-spacing: -.018em;
  quotes: none;
  color: var(--ed-ink);
  position: relative;
  z-index: 1;
}
.ed-home .ed-bigquote q::before {
  content: "\201C";
  color: var(--ed-terra);
  font-size: 1.2em;
  vertical-align: -.1em;
  margin-right: .05em;
}
.ed-home .ed-bigquote q::after {
  content: "\201D";
  color: var(--ed-terra);
  font-size: 1.2em;
  vertical-align: -.1em;
  margin-left: .05em;
}
.ed-home .ed-bigquote q em {
  background: var(--ed-lime);
  font-style: italic;
  padding: 0 .1em;
  box-shadow: 2px 2px 0 var(--ed-ink);
}
.ed-home .ed-bigquote .who {
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ed-mute);
  display: flex;
  gap: 12px;
  align-items: center;
}
.ed-home .ed-bigquote .who::before {
  content: "";
  width: 36px;
  height: 1px;
  background: var(--ed-mute);
}

.ed-home .ed-a.C1 { grid-column: span 3; padding: 18px 18px 20px; }
.ed-home .ed-a.C1 .t { font-size: 22px; line-height: 1.08; }

.ed-home .ed-a.C2 { grid-column: span 3; padding: 18px 18px 20px; }
.ed-home .ed-a.C2 .t { font-size: 22px; line-height: 1.08; }

/* Row 4 — three equals */
.ed-home .ed-a.D1,
.ed-home .ed-a.D2,
.ed-home .ed-a.D3 { grid-column: span 4; padding: 18px 18px 20px; }
.ed-home .ed-a.D1 .t,
.ed-home .ed-a.D2 .t,
.ed-home .ed-a.D3 .t { font-size: 26px; line-height: 1.04; }

/* ==========================================================================
   HORIZONTAL FIELD NOTES SHELF
   ========================================================================== */
.ed-home .ed-shelf-head {
  padding: 80px 40px 30px;
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 20px;
  position: relative;
}
.ed-home .ed-shelf-head::before {
  content: "\274B";
  position: absolute;
  top: 32px;
  left: 50%;
  transform: translateX(-50%);
  color: var(--ed-terra);
  font-family: 'Instrument Serif', serif;
  font-size: 20px;
  font-style: italic;
}
.ed-home .ed-shelf-head .l { display: flex; gap: 18px; align-items: baseline; }
.ed-home .ed-shelf-head h3 {
  margin: 0;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 90, "opsz" 60;
  font-weight: 600;
  font-size: 64px;
  letter-spacing: -.035em;
  line-height: .9;
}
.ed-home .ed-shelf-head h3 em {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-weight: 400;
  background: linear-gradient(180deg, var(--ed-terra), var(--ed-terra-deep));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.ed-home .ed-shelf-head .count {
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--ed-mute);
}
.ed-home .ed-shelf-head .arrows { display: flex; gap: 6px; }
.ed-home .ed-shelf-head .arrows button {
  width: 44px;
  height: 44px;
  border: 1px solid var(--ed-rule);
  background: transparent;
  cursor: pointer;
  display: grid;
  place-items: center;
  border-radius: 99px;
  transition: all .2s;
}
.ed-home .ed-shelf-head .arrows button:hover {
  background: var(--ed-ink);
  color: var(--ed-paper);
  box-shadow: 3px 3px 0 var(--ed-terra);
}

.ed-home .ed-shelf {
  display: flex;
  gap: 20px;
  padding: 0 40px 80px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  border-bottom: 1px solid var(--ed-rule);
  scrollbar-width: thin;
}
.ed-home .ed-shelf::-webkit-scrollbar { height: 4px; }

/* Note cards */
.ed-home .ed-note {
  flex: 0 0 380px;
  scroll-snap-align: start;
  background:
    radial-gradient(400px 300px at 100% 0%, rgba(194,66,30,.05), transparent 60%),
    var(--ed-card);
  border: 1px solid var(--ed-rule);
  padding: 26px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 360px;
  position: relative;
  transition: transform .4s, box-shadow .4s;
  box-shadow: 4px 4px 0 rgba(10,10,9,.08);
}
.ed-home .ed-note::before {
  content: "";
  position: absolute;
  inset: 10px;
  border: 1px solid var(--ed-rule-soft);
  pointer-events: none;
  opacity: .35;
}
.ed-home .ed-note:nth-child(2n) {
  background: linear-gradient(160deg, var(--ed-ink) 0%, #17130D 100%);
  color: var(--ed-paper);
  border-color: var(--ed-ink);
}
.ed-home .ed-note:nth-child(2n) .k,
.ed-home .ed-note:nth-child(2n) .f {
  color: color-mix(in srgb, var(--ed-paper) 70%, transparent);
}
.ed-home .ed-note:nth-child(2n) .f {
  border-color: color-mix(in srgb, var(--ed-paper) 20%, transparent);
}
.ed-home .ed-note:nth-child(2n)::before {
  border-color: rgba(237,228,206,.18);
}
.ed-home .ed-note:nth-child(3n) {
  background: linear-gradient(160deg, var(--ed-lime) 0%, #BDDF22 100%);
  border-color: var(--ed-ink);
}
.ed-home .ed-note:hover {
  transform: translateY(-6px);
  box-shadow: 8px 10px 0 rgba(10,10,9,.12);
}
.ed-home .ed-note .k {
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--ed-mute);
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  position: relative;
  z-index: 1;
}
.ed-home .ed-note .k span:first-child {
  color: var(--ed-terra);
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: 14px;
  letter-spacing: 0;
  text-transform: none;
}
.ed-home .ed-note:nth-child(2n) .k span:first-child {
  color: var(--ed-lime);
}
.ed-home .ed-note .h {
  font-family: 'Instrument Serif', serif;
  font-size: 30px;
  line-height: 1.05;
  letter-spacing: -.018em;
  margin: 8px 0;
  position: relative;
  z-index: 1;
}
.ed-home .ed-note .p {
  font-size: 14.5px;
  line-height: 1.55;
  position: relative;
  z-index: 1;
}
.ed-home .ed-note .f {
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid var(--ed-rule-soft);
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--ed-mute);
  display: flex;
  justify-content: space-between;
  position: relative;
  z-index: 1;
}
.ed-home .ed-note .seal {
  position: absolute;
  top: -10px;
  right: -10px;
  width: 56px;
  height: 56px;
  border-radius: 99px;
  background: radial-gradient(circle at 30% 30%, #E8603A, var(--ed-terra) 60%, var(--ed-terra-deep));
  color: var(--ed-paper);
  display: grid;
  place-items: center;
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: 22px;
  transform: rotate(10deg);
  box-shadow: 0 4px 12px rgba(92,26,24,.35), inset 0 -6px 10px rgba(92,26,24,.4);
  z-index: 2;
}

/* ==========================================================================
   DATA SPREAD
   ========================================================================== */
.ed-home .ed-spread {
  padding: 120px 40px;
  border-bottom: 1px solid var(--ed-rule);
  background: radial-gradient(1000px 600px at 50% 0%, #1A1812, var(--ed-ink) 70%);
  color: var(--ed-paper);
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 72px;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.ed-home .ed-spread::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(800px 400px at 100% 0%, rgba(219,255,46,.16), transparent 60%),
    radial-gradient(600px 500px at 0% 100%, rgba(194,66,30,.18), transparent 60%),
    radial-gradient(900px 700px at 50% 50%, rgba(201,162,76,.05), transparent 60%);
  pointer-events: none;
}
.ed-home .ed-spread::after {
  content: "";
  position: absolute;
  inset: 24px;
  border: 1px solid rgba(237,228,206,.08);
  pointer-events: none;
  z-index: 1;
}
.ed-home .ed-spread > * { position: relative; z-index: 2; }
.ed-home .ed-spread .kicker {
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ed-lime);
  display: flex;
  gap: 14px;
  align-items: center;
  margin-bottom: 20px;
}
.ed-home .ed-spread .kicker::before {
  content: "";
  width: 32px;
  height: 1px;
  background: var(--ed-lime);
}
.ed-home .ed-spread h2 {
  margin: 0;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 92, "opsz" 96;
  font-weight: 600;
  font-size: 84px;
  line-height: .94;
  letter-spacing: -.035em;
}
.ed-home .ed-spread h2 em {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-weight: 400;
  color: var(--ed-lime);
}
.ed-home .ed-spread p {
  color: color-mix(in srgb, var(--ed-paper) 75%, transparent);
  font-size: 17px;
  line-height: 1.55;
  max-width: 52ch;
  margin: 22px 0;
}
.ed-home .ed-spread .metrics {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 1px;
  background: color-mix(in srgb, var(--ed-paper) 18%, transparent);
  border: 1px solid color-mix(in srgb, var(--ed-paper) 20%, transparent);
  box-shadow: 6px 6px 0 rgba(219,255,46,.15);
}
.ed-home .ed-spread .metric {
  padding: 24px;
  background: linear-gradient(180deg, #17130D, var(--ed-ink));
  position: relative;
  transition: background .3s;
}
.ed-home .ed-spread .metric:hover {
  background: linear-gradient(180deg, #221D14, #17130D);
}
.ed-home .ed-spread .metric .k {
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--ed-paper) 60%, transparent);
  display: flex;
  align-items: center;
  gap: 8px;
}
.ed-home .ed-spread .metric .k::before {
  content: "\2726";
  color: var(--ed-gold);
  font-family: 'Instrument Serif', serif;
  font-size: 10px;
  letter-spacing: 0;
}
.ed-home .ed-spread .metric .v {
  font-family: 'Instrument Serif', serif;
  font-size: 46px;
  font-style: italic;
  line-height: 1.02;
  margin-top: 10px;
  letter-spacing: -.015em;
}
.ed-home .ed-spread .metric .v.hl {
  color: var(--ed-lime);
  font-style: normal;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 500;
  text-shadow: 0 0 30px rgba(219,255,46,.35);
}
.ed-home .ed-spread .metric .v.tr { color: #E8603A; }
.ed-home .ed-spread-viz { position: relative; height: 520px; }

/* ==========================================================================
   CONTRIBUTORS
   ========================================================================== */
.ed-home .ed-contribs {
  padding: 96px 40px;
  border-bottom: 1px solid var(--ed-rule);
  position: relative;
}
.ed-home .ed-contribs::before {
  content: "\2722";
  position: absolute;
  top: 30px;
  left: 50%;
  transform: translateX(-50%);
  color: var(--ed-terra);
  font-family: 'Instrument Serif', serif;
  font-size: 18px;
}
.ed-home .ed-contribs-top {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: end;
  margin-bottom: 40px;
}
.ed-home .ed-contribs-top h2 {
  margin: 0;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  font-variation-settings: "wdth" 85, "opsz" 96;
  font-size: clamp(64px, 8vw, 132px);
  line-height: .85;
  letter-spacing: -.04em;
  text-transform: uppercase;
}
.ed-home .ed-contribs-top h2 em {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-weight: 400;
  text-transform: none;
  background: linear-gradient(180deg, var(--ed-terra), var(--ed-terra-deep));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.ed-home .ed-contribs-top p {
  font-family: 'Instrument Serif', serif;
  font-size: 24px;
  line-height: 1.42;
  max-width: 50ch;
  color: var(--ed-ink-2);
  margin: 0;
  padding-left: 20px;
  border-left: 2px solid var(--ed-terra);
  font-style: italic;
}
.ed-home .ed-people {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px 20px;
}
.ed-home .ed-person {
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: relative;
  transition: transform .4s;
}
.ed-home .ed-person:hover { transform: translateY(-4px); }
.ed-home .ed-person .p-img {
  aspect-ratio: 4/5;
  overflow: hidden;
  position: relative;
  background: var(--ed-ink);
  box-shadow: 0 10px 30px rgba(10,10,9,.18), inset 0 0 0 1px rgba(237,228,206,.1);
}
.ed-home .ed-person .p-img::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 -60px 60px -30px rgba(10,10,9,.5), inset 0 0 0 4px rgba(237,228,206,.06);
}
.ed-home .ed-person .p-img svg,
.ed-home .ed-person .p-img img {
  width: 100%;
  height: 100%;
  display: block;
  filter: contrast(1.08) saturate(.95);
  object-fit: cover;
}
.ed-home .ed-person .p-img .num {
  position: absolute;
  top: 12px;
  left: 12px;
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  color: var(--ed-paper);
  letter-spacing: .18em;
  opacity: .85;
  z-index: 2;
  background: rgba(10,10,9,.35);
  padding: 4px 8px;
  backdrop-filter: blur(4px);
}
.ed-home .ed-person h4 {
  margin: 4px 0 0;
  font-family: 'Instrument Serif', serif;
  font-size: 22px;
  font-style: italic;
  font-weight: 400;
  line-height: 1.1;
}
.ed-home .ed-person .role {
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ed-mute);
  display: flex;
  align-items: center;
  gap: 8px;
}
.ed-home .ed-person .role::before {
  content: "";
  width: 14px;
  height: 1px;
  background: var(--ed-terra);
}

/* ==========================================================================
   SUBSCRIBE MARQUEE
   ========================================================================== */
.ed-home .ed-sub {
  position: relative;
  border-bottom: 1px solid var(--ed-rule);
  background: linear-gradient(90deg, var(--ed-lime), #C8EA1E 50%, var(--ed-lime));
  color: var(--ed-ink);
  overflow: hidden;
  box-shadow: inset 0 2px 0 rgba(10,10,9,.08), inset 0 -2px 0 rgba(10,10,9,.08);
}
.ed-home .ed-sub::before,
.ed-home .ed-sub::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 80px;
  z-index: 2;
  pointer-events: none;
}
.ed-home .ed-sub::before {
  left: 0;
  background: linear-gradient(90deg, rgba(219,255,46,.9), transparent);
}
.ed-home .ed-sub::after {
  right: 0;
  background: linear-gradient(270deg, rgba(219,255,46,.9), transparent);
}
.ed-home .ed-sub-mar {
  display: flex;
  gap: 48px;
  white-space: nowrap;
  animation: ed-mar 30s linear infinite;
  width: max-content;
  padding: 28px 0;
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-size: clamp(80px, 10vw, 160px);
  line-height: 1;
  letter-spacing: -.035em;
}
.ed-home .ed-sub-mar .dot {
  width: 22px;
  height: 22px;
  background: var(--ed-terra);
  border-radius: 99px;
  display: inline-block;
  margin: 0 28px;
  box-shadow: 0 0 0 6px rgba(219,255,46,.5);
}

/* ==========================================================================
   SUBSCRIBE FORM
   ========================================================================== */
.ed-home .ed-sub-form {
  padding: 96px 40px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 72px;
  align-items: end;
  background: radial-gradient(1000px 600px at 50% 0%, #1A1812, var(--ed-ink) 70%);
  color: var(--ed-paper);
  border-bottom: 1px solid var(--ed-rule);
  position: relative;
  overflow: hidden;
}
.ed-home .ed-sub-form::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(800px 500px at 100% 100%, rgba(219,255,46,.10), transparent 60%),
    radial-gradient(600px 400px at 0% 0%, rgba(194,66,30,.10), transparent 60%);
}
.ed-home .ed-sub-form::after {
  content: "";
  position: absolute;
  inset: 24px;
  border: 1px solid rgba(237,228,206,.08);
  pointer-events: none;
}
.ed-home .ed-sub-form > * { position: relative; z-index: 1; }
.ed-home .ed-sub-form h3 {
  margin: 0;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95, "opsz" 96;
  font-weight: 500;
  font-size: 72px;
  line-height: .92;
  letter-spacing: -.035em;
}
.ed-home .ed-sub-form h3 em {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-weight: 400;
  color: var(--ed-lime);
  text-shadow: 0 0 40px rgba(219,255,46,.25);
}
.ed-home .ed-sub-form p {
  color: color-mix(in srgb, var(--ed-paper) 70%, transparent);
  margin: 18px 0 0;
  max-width: 46ch;
  line-height: 1.5;
}
.ed-home .ed-sub-form form {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 420px;
}
.ed-home .ed-sub-form .row {
  display: flex;
  gap: 10px;
  background: color-mix(in srgb, var(--ed-paper) 8%, transparent);
  padding: 6px;
  border: 1px solid color-mix(in srgb, var(--ed-paper) 20%, transparent);
}
.ed-home .ed-sub-form input {
  flex: 1;
  background: transparent;
  border: 0;
  padding: 14px 18px;
  color: var(--ed-paper);
  font-family: inherit;
  font-size: 15px;
  outline: none;
}
.ed-home .ed-sub-form input::placeholder {
  color: color-mix(in srgb, var(--ed-paper) 40%, transparent);
}
.ed-home .ed-sub-form button {
  background: var(--ed-lime);
  color: var(--ed-ink);
  border: 0;
  padding: 14px 22px;
  font-family: 'Space Mono', monospace;
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  cursor: pointer;
}
.ed-home .ed-sub-form .chips { display: flex; gap: 8px; flex-wrap: wrap; }
.ed-home .ed-sub-form .chip {
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding: 6px 10px;
  border: 1px solid color-mix(in srgb, var(--ed-paper) 30%, transparent);
  border-radius: 99px;
  color: color-mix(in srgb, var(--ed-paper) 80%, transparent);
  cursor: pointer;
}
.ed-home .ed-sub-form .chip.on {
  background: var(--ed-lime);
  color: var(--ed-ink);
  border-color: var(--ed-lime);
}

/* ==========================================================================
   COLOPHON / FOOTER
   ========================================================================== */
.ed-home .ed-colophon-wrap {
  padding: 60px 40px 30px;
  background: var(--ed-paper);
}
.ed-home .ed-colophon {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr 1fr;
  gap: 40px;
  padding-bottom: 40px;
  border-bottom: 1px solid var(--ed-rule);
}
.ed-home .ed-colophon h5 {
  margin: 0 0 12px;
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--ed-mute);
  font-weight: 400;
}
.ed-home .ed-colophon ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ed-home .ed-colophon a {
  color: var(--ed-ink);
  text-decoration: none;
  font-size: 14px;
}
.ed-home .ed-colophon a:hover { text-decoration: line-through; }
.ed-home .ed-foot-big {
  font-family: 'Instrument Serif', serif;
  font-size: clamp(130px, 17vw, 280px);
  line-height: .8;
  letter-spacing: -.045em;
  font-style: italic;
  background: linear-gradient(180deg, var(--ed-ink) 0%, var(--ed-terra-deep) 70%, var(--ed-terra) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  margin: 40px 0 14px;
  position: relative;
}
.ed-home .ed-foot-big::after {
  content: "\2726";
  position: absolute;
  right: 0;
  top: 0;
  font-style: italic;
  font-size: 32px;
  color: var(--ed-terra);
  background: none;
  -webkit-text-fill-color: var(--ed-terra);
}
.ed-home .ed-foot-low {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ed-mute);
  padding-top: 20px;
  border-top: 1px solid var(--ed-rule);
}

/* ---------- Utility classes ---------- */
.ed-home .ed-hl-lime { background: var(--ed-lime); padding: 0 .06em; }
.ed-home .ed-hl-terra { background: var(--ed-terra); color: var(--ed-paper); padding: 0 .06em; }

/* ==========================================================================
   RESPONSIVE — Tablet (max-width: 960px)
   ========================================================================== */
@media (max-width: 960px) {
  .ed-home .ed-hero { grid-template-columns: 1fr; min-height: auto; }
  .ed-home .ed-cover-row { grid-template-columns: 1fr; }
  .ed-home .ed-spread { grid-template-columns: 1fr; }
  .ed-home .ed-sub-form { grid-template-columns: 1fr; }
  .ed-home .ed-contribs-top { grid-template-columns: 1fr; }
  .ed-home .ed-people { grid-template-columns: repeat(2, 1fr); }
  .ed-home .ed-index { grid-template-columns: repeat(6, 1fr); }
  .ed-home .ed-a.A1,
  .ed-home .ed-a.A2,
  .ed-home .ed-a.B1,
  .ed-home .ed-a.B2,
  .ed-home .ed-a.B3,
  .ed-home .ed-a.C1,
  .ed-home .ed-a.C2,
  .ed-home .ed-a.D1,
  .ed-home .ed-a.D2,
  .ed-home .ed-a.D3,
  .ed-home .ed-bigquote { grid-column: span 6; }
  .ed-home .ed-masthead { grid-template-columns: 1fr; }
  .ed-home .ed-masthead .cell.center { border-right: 0; border-bottom: 1px solid var(--ed-rule); }
  .ed-home .ed-cover-card { min-height: 520px; }
  .ed-home .ed-spread h2 { font-size: 56px; }
  .ed-home .ed-sub-form h3 { font-size: 48px; }
  .ed-home .ed-sub-form form { min-width: auto; }
  .ed-home .ed-colophon { grid-template-columns: 1fr 1fr; }
  .ed-home .ed-index-head { grid-template-columns: 1fr; }
  .ed-home .ed-index-head .nav { justify-content: flex-start; max-width: none; }
  .ed-home .ed-hero-meta { grid-template-columns: 1fr 1fr; }
  .ed-home .ed-shelf-head h3 { font-size: 42px; }
  .ed-home .ed-note { flex: 0 0 300px; }
  .ed-home .ed-cover-viz { box-shadow: 20px 20px 0 var(--ed-lime); }
  .ed-home .ed-stamp { display: none; }
  .ed-home .ed-vert { display: none; }
  .ed-home .ed-reg { display: none; }
}

/* ==========================================================================
   RESPONSIVE — Mobile (max-width: 640px)
   ========================================================================== */
@media (max-width: 640px) {
  .ed-home .ed-hero { padding: 20px 16px 40px; gap: 32px; }
  .ed-home .ed-cover-card {
    min-height: 400px;
    padding: 18px 16px;
    box-shadow: 8px 8px 0 var(--ed-ink), 8px 8px 0 1px var(--ed-ink);
  }
  .ed-home .ed-cover-top .nameplate { font-size: 32px; }
  .ed-home .ed-cover-headline { font-size: clamp(28px, 7vw, 40px); }
  .ed-home .ed-cover-deck { font-size: 16px; }
  .ed-home .ed-hero-meta { grid-template-columns: 1fr; gap: 16px; }
  .ed-home .ed-hero-right { padding-top: 20px; }
  .ed-home .ed-pullquote { font-size: clamp(28px, 7vw, 40px); }

  .ed-home .ed-index { padding: 24px 16px; grid-template-columns: 1fr; gap: 32px 0; }
  .ed-home .ed-a.A1,
  .ed-home .ed-a.A2,
  .ed-home .ed-a.B1,
  .ed-home .ed-a.B2,
  .ed-home .ed-a.B3,
  .ed-home .ed-a.C1,
  .ed-home .ed-a.C2,
  .ed-home .ed-a.D1,
  .ed-home .ed-a.D2,
  .ed-home .ed-a.D3,
  .ed-home .ed-bigquote { grid-column: span 1; }
  .ed-home .ed-a.A1 .t { font-size: clamp(32px, 8vw, 44px); }
  .ed-home .ed-index-head { padding: 40px 16px 16px; }
  .ed-home .ed-index-head h2 { font-size: clamp(48px, 14vw, 80px); }

  .ed-home .ed-cover { padding: 40px 16px 48px; }
  .ed-home .ed-cover-title { font-size: clamp(40px, 10vw, 72px); margin: 16px 0 48px; }
  .ed-home .ed-cover-lede { font-size: 20px; margin-top: 32px; }
  .ed-home .ed-cover-viz { box-shadow: 12px 12px 0 var(--ed-lime); }

  .ed-home .ed-wordmar .inner { font-size: 42px; }

  .ed-home .ed-shelf-head { padding: 40px 16px 16px; flex-direction: column; align-items: flex-start; }
  .ed-home .ed-shelf-head h3 { font-size: 32px; }
  .ed-home .ed-shelf { padding: 0 16px 48px; gap: 14px; }
  .ed-home .ed-note { flex: 0 0 280px; min-height: 280px; padding: 18px; }

  .ed-home .ed-spread { padding: 60px 16px; gap: 40px; }
  .ed-home .ed-spread h2 { font-size: 40px; }
  .ed-home .ed-spread .metrics { grid-template-columns: 1fr; }
  .ed-home .ed-spread .metric .v { font-size: 32px; }
  .ed-home .ed-spread-viz { height: 320px; }

  .ed-home .ed-contribs { padding: 48px 16px; }
  .ed-home .ed-people { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .ed-home .ed-person h4 { font-size: 18px; }

  .ed-home .ed-sub-form { padding: 48px 16px; gap: 32px; }
  .ed-home .ed-sub-form h3 { font-size: 32px; }

  .ed-home .ed-colophon-wrap { padding: 40px 16px 20px; }
  .ed-home .ed-colophon { grid-template-columns: 1fr; gap: 24px; }
  .ed-home .ed-foot-big { font-size: clamp(72px, 20vw, 140px); }
  .ed-home .ed-foot-low { flex-direction: column; gap: 8px; }

  .ed-home .ed-folio { display: none; }
  .ed-home .ed-masthead .cell { padding: 10px 16px; gap: 12px; }
  .ed-home .ed-ticker .inner { font-size: 10px; }
}

/* ========================================================================== */
/* END EDITORIAL MAGAZINE HOMEPAGE CSS                                        */
/* ========================================================================== */

/* ========================================================================== */
/* EDITORIAL OVERRIDES: ARTICLE & LANDING PAGES ON PAPER BACKGROUND           */
/* ========================================================================== */

/* When the editorial wrapper is active, set theme vars to match the paper palette */
.insights-app.ed-home-active {
  --bg: var(--ed-paper, #EDE4CE);
  --surface: var(--ed-card, #F4ECD6);
  --surface-soft: var(--ed-paper-2, #E2D7BA);
  --surface-tint: rgba(255, 251, 246, 0.94);
  --border: var(--ed-rule-soft, #C6BDA1);
  --border-strong: var(--ed-rule, #1A1814);
  --text: var(--ed-ink, #0A0A09);
  --text-soft: var(--ed-ink-2, #27251F);
  --text-muted: var(--ed-mute, #736E5F);
  --accent: var(--ed-terra, #C2421E);
  --accent-strong: var(--ed-forest, #0F3A26);
  --navy: var(--ed-ink, #0A0A09);
  --footer: var(--ed-ink, #0A0A09);
}

/* Article layout inside editorial wrapper */
.ed-home .art-layout {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 40px;
}

.ed-home .art-header {
  padding-top: 48px;
  border-bottom: 1px solid var(--ed-rule-soft, #C6BDA1);
  padding-bottom: 28px;
  margin-bottom: 32px;
}

.ed-home .art-breadcrumb a {
  color: var(--ed-mute, #736E5F);
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.ed-home .art-title {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95, "opsz" 96;
  font-weight: 600;
  letter-spacing: -.03em;
  line-height: .96;
  color: var(--ed-ink, #0A0A09);
}

.ed-home .art-meta {
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--ed-mute, #736E5F);
}

.ed-home .art-meta__author {
  color: var(--ed-ink, #0A0A09);
}

/* Article body typography */
.ed-home .article-markdown,
.ed-home .article-body,
.ed-home .article-section p,
.ed-home .article-section--markdown {
  font-family: 'Instrument Serif', Georgia, serif;
  font-size: 19px;
  line-height: 1.65;
  color: var(--ed-ink-2, #27251F);
}

.ed-home .article-markdown h2,
.ed-home .article-markdown h3,
.ed-home .article-markdown h4,
.ed-home .article-section h2 {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 95, "opsz" 48;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--ed-ink, #0A0A09);
}

/* ── ARTICLE SIDEBAR — Editorial Panel System ─────────────────── */

/* Base panel reset */
.ed-home .art-panel {
  background: var(--ed-card, #F4ECD6);
  border: 1px solid var(--ed-rule-soft, #C6BDA1);
  border-top: 3px solid var(--ed-rule, #2A2720);
  border-radius: 0;
  padding: 18px 18px 20px;
}

/* TOC — minimal, letterpress feel */
.ed-home .art-panel--toc {
  background: transparent;
  border: none;
  border-left: 3px solid var(--ed-ink, #0A0A09);
  border-top: none;
  padding: 0 0 0 16px;
}
.ed-home .art-panel--toc .art-panel__eyebrow {
  border-bottom: 1px solid var(--ed-rule-soft, #C6BDA1);
  padding-bottom: 8px;
  margin-bottom: 14px;
}
.ed-home .art-sidebar-toc__link {
  background: transparent;
  border-radius: 0;
  border-left: 2px solid transparent;
  padding: 6px 0;
  min-height: 36px;
  font-size: 0.78rem;
  line-height: 1.4;
  transition: color .15s, border-color .15s, padding-left .15s;
}
.ed-home .art-sidebar-toc__link:hover,
.ed-home .art-sidebar-toc__link.is-active {
  background: transparent;
  color: var(--ed-terra, #C2421E);
  border-left-color: var(--ed-terra, #C2421E);
  padding-left: 10px;
  transform: none;
}

/* Market snapshot — data terminal style */
.ed-home .art-panel--pulse {
  border-top-color: #4a7ab0;
}

/* Related insights — no box, items provide own structure */
.ed-home .art-panel--related {
  background: transparent;
  border: none;
  border-top: none;
  padding: 0;
}
.ed-home .art-panel--related .art-panel__eyebrow {
  border-bottom: 2px solid var(--ed-rule, #2A2720);
  padding-bottom: 8px;
  margin-bottom: 16px;
  font-size: 0.62rem;
}

/* Portfolio impact */
.ed-home .art-panel--impact {
  border-top-color: #6e66d4;
}

/* Scenario widget */
.ed-home .art-panel--scenario {
  border-top-color: #7ca01a;
}

/* Signal controls — minimal */
.ed-home .art-panel--signals {
  background: transparent;
  border-color: var(--ed-rule-soft, #C6BDA1);
  border-top: 1px solid var(--ed-rule-soft, #C6BDA1);
}

/* Conversion CTA — dark contrast block */
.ed-home .art-panel--conversion {
  background: var(--ed-ink, #0A0A09);
  border: none;
  border-left: 4px solid var(--ed-terra, #C2421E);
  color: var(--ed-paper, #FAF6ED);
}
.ed-home .art-panel--conversion .art-panel__eyebrow {
  color: var(--ed-terra, #C2421E);
}
.ed-home .art-panel--conversion .art-conversion__title {
  color: var(--ed-paper, #FAF6ED);
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 90, "opsz" 24;
  font-size: 1.05rem;
  line-height: 1.2;
}
.ed-home .art-panel--conversion .art-conversion__copy {
  color: color-mix(in srgb, var(--ed-paper) 65%, transparent);
}
.ed-home .art-panel--conversion .art-conversion__primary {
  background: var(--ed-terra, #C2421E);
  border-color: var(--ed-terra, #C2421E);
  color: var(--ed-paper, #FAF6ED);
}
.ed-home .art-panel--conversion .art-conversion__primary:hover {
  background: color-mix(in srgb, var(--ed-terra) 85%, black);
  border-color: transparent;
}
.ed-home .art-panel--conversion .art-conversion__secondary {
  border-color: color-mix(in srgb, var(--ed-paper) 25%, transparent);
  color: color-mix(in srgb, var(--ed-paper) 80%, transparent);
  background: transparent;
}
.ed-home .art-panel--conversion .art-conversion__secondary:hover {
  background: rgba(255,255,255,.08);
  border-color: color-mix(in srgb, var(--ed-paper) 40%, transparent);
}

/* Newsletter — dark with lime accent */
.ed-home .art-panel--newsletter-compact {
  background: color-mix(in srgb, var(--ed-ink) 92%, var(--ed-paper));
  border: none;
  border-left: 4px solid var(--ed-lime, #CADF3A);
  color: var(--ed-paper, #FAF6ED);
}
.ed-home .art-panel--newsletter-compact .art-panel__eyebrow {
  color: var(--ed-lime, #CADF3A);
}
.ed-home .art-panel--newsletter-compact .art-conversion__title {
  color: var(--ed-paper, #FAF6ED);
}
.ed-home .art-panel--newsletter-compact .art-conversion__copy {
  color: color-mix(in srgb, var(--ed-paper) 65%, transparent);
}
.ed-home .art-newsletter-compact__input {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.2);
  color: var(--ed-paper);
}
.ed-home .art-newsletter-compact__input::placeholder {
  color: rgba(250,246,237,.45);
}
.ed-home .art-newsletter-compact__button {
  background: var(--ed-lime, #CADF3A);
  color: var(--ed-ink, #0A0A09);
  border-color: var(--ed-lime);
  font-weight: 800;
}

/* Sources panel */
.ed-home .art-panel--sources-lite {
  border-top-color: var(--ed-rule-soft, #C6BDA1);
  background: transparent;
}

.ed-home .art-panel__eyebrow {
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--ed-mute, #736E5F);
}

/* Related items */
.ed-home .art-related__title {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-style: normal;
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--ed-ink, #0A0A09);
  font-size: 0.86rem;
  line-height: 1.32;
}

/* Engagement bar */
.ed-home .engagement-bar {
  background: var(--ed-card, #F4ECD6);
  border: 1px solid var(--ed-rule-soft, #C6BDA1);
  border-radius: 0;
}

.ed-home .engagement-btn {
  border-color: var(--ed-rule-soft, #C6BDA1);
  color: var(--ed-ink-2, #27251F);
  border-radius: 0;
}

/* Takeaways box */
.ed-home .takeaways-box,
.ed-home .mobile-takeaways-box {
  background: var(--ed-card, #F4ECD6);
  border: 1px solid var(--ed-rule-soft, #C6BDA1);
  border-radius: 0;
}

/* Chart cards */
.ed-home .chart-card {
  background: var(--ed-card, #F4ECD6);
  border: 1px solid var(--ed-rule-soft, #C6BDA1);
  border-radius: 0;
}

/* Research disclaimer */
.ed-home .research-disclaimer {
  background: var(--ed-card, #F4ECD6);
  border: 1px solid var(--ed-rule-soft, #C6BDA1);
  border-radius: 0;
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .04em;
  color: var(--ed-mute, #736E5F);
}

/* Comments section */
.ed-home .blog-comments__input,
.ed-home .blog-comments__textarea {
  background: var(--ed-card, #F4ECD6);
  border: 1px solid var(--ed-rule-soft, #C6BDA1);
  border-radius: 0;
  font-family: 'Instrument Serif', Georgia, serif;
  color: var(--ed-ink, #0A0A09);
}

.ed-home .blog-comments__submit {
  background: var(--ed-ink, #0A0A09);
  color: var(--ed-paper, #EDE4CE);
  border-radius: 0;
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
}

/* Mid-article CTA */
.ed-home .mid-article-cta {
  background: var(--ed-ink, #0A0A09);
  color: var(--ed-paper, #EDE4CE);
  border-radius: 0;
}

.ed-home .mid-article-cta__button {
  background: var(--ed-lime, #DBFF2E);
  color: var(--ed-ink, #0A0A09);
  border-radius: 0;
  font-family: 'Space Mono', monospace;
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
}

/* Landing page — hp-section cards on editorial bg */
.ed-home .hp-card__body {
  background: var(--ed-card, #F4ECD6);
}
/* hp-lead__body keeps base gradient (--lc-soft over ed-card bg) */

.ed-home .hp-lead__title,
.ed-home .hp-card__title {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 600;
  letter-spacing: -.02em;
  color: var(--ed-ink, #0A0A09);
}

.ed-home .hp-lead__excerpt,
.ed-home .hp-card__excerpt {
  font-style: normal;
  font-size: 0.9rem;
  line-height: 1.62;
  color: var(--ed-ink-2, #27251F);
}

.ed-home .hp-lead__lane,
.ed-home .hp-card__meta,
.ed-home .hp-lead__meta {
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ed-mute, #736E5F);
}

.ed-home .hp-section__title {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-variation-settings: "wdth" 90, "opsz" 60;
  font-weight: 600;
  letter-spacing: -.03em;
  color: var(--ed-ink, #0A0A09);
}

.ed-home .hp-section__title a {
  color: inherit;
  text-decoration: none;
}

.ed-home .hp-section__more {
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ed-terra, #C2421E);
}

/* Landing page — sidebar stories: editorial cream shell, lane colour from --lc */
.ed-home .hp-sidebar-story {
  background: var(--ed-card, #F4ECD6);
  border: 1px solid var(--ed-rule-soft, #C6BDA1);
  border-top: 3px solid var(--lc);
  border-radius: 0;
  background-image: linear-gradient(135deg, var(--lc-soft) 0%, transparent 40%);
  box-shadow: 0 1px 4px rgba(10,8,4,.04);
}
.ed-home .hp-sidebar-story:hover {
  transform: translateX(0);
  box-shadow: 0 4px 16px rgba(10,8,4,.1);
}

.ed-home .hp-sidebar-story__title {
  font-weight: 700;
  font-style: normal;
  color: var(--ed-ink, #0A0A09);
  line-height: 1.35;
}

.ed-home .hp-sidebar-story__lane,
.ed-home .hp-sidebar-story__meta {
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ed-mute, #736E5F);
}

/* Load more button */
.ed-home .hp-load-more__btn {
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  border: 1px solid var(--ed-rule, #1A1814);
  background: transparent;
  color: var(--ed-ink, #0A0A09);
  border-radius: 0;
  padding: 14px 28px;
}

.ed-home .hp-load-more__btn:hover {
  background: var(--ed-ink, #0A0A09);
  color: var(--ed-paper, #EDE4CE);
}

/* Hero section inside ed-home */
.ed-home .hp-hero {
  border: 1px solid var(--ed-rule-soft, #C6BDA1);
  border-radius: 0;
  overflow: hidden;
}

.ed-home .hp-lead {
  border-radius: 0;
  background: var(--ed-card, #F4ECD6);
}
.ed-home .hp-lead:hover {
  transform: none;
  box-shadow: 0 6px 24px rgba(10,8,4,.12);
}

/* Editorial home: cards inherit --lc vars, editorial shell colours */
.ed-home .hp-card {
  border-radius: 0;
  border-top: 3px solid var(--lc);
  border-right: 1px solid var(--ed-rule-soft, #C6BDA1);
  border-bottom: 1px solid var(--ed-rule-soft, #C6BDA1);
  border-left: 1px solid var(--ed-rule-soft, #C6BDA1);
  background: var(--ed-card, #F4ECD6);
  box-shadow: 0 1px 4px rgba(10,8,4,.04), 0 4px 16px rgba(10,8,4,.06);
}
.ed-home .hp-card:hover {
  box-shadow: 0 6px 24px rgba(10,8,4,.12), 0 0 0 1px color-mix(in srgb, var(--lc) 30%, transparent);
}
.ed-home .hp-card::before {
  background: linear-gradient(148deg, color-mix(in srgb, var(--lc) 8%, transparent) 0%, transparent 50%);
}

/* Section borders */
.ed-home .hp-section {
  border-bottom: 1px solid var(--ed-rule-soft, #C6BDA1);
  padding-bottom: 40px;
}

@media (max-width: 960px) {
  .ed-home .art-layout {
    padding: 0 20px;
  }
}

@media (max-width: 640px) {
  .ed-home .art-layout {
    padding: 0 16px;
  }
  .ed-home .art-title {
    font-size: clamp(1.6rem, 7vw, 2.2rem);
  }
  .ed-home .article-markdown,
  .ed-home .article-body,
  .ed-home .article-section p {
    font-size: 17px;
  }
}