/* ============================================================
   Conventity — Shared Styles
   ============================================================
   This file holds tokens (light/dark), global typography, layout
   primitives, topbar, hero, ecosystem, footer, modals, mobile
   drawer, AND the shared .cvg-overlay shell (used by all platform
   pages in /platforms/*.html).
   
   Per-platform CSS (overlay-specific) lives inside each
   platforms/<name>.html so it can grow independently.
   ============================================================ */

:root {
  /* Brand */
  --brand-ink: #0E2148;
  --logo-outer: #0E2148;
  --logo-inner: #2A6FDB;
  --brand-blue: #2A6FDB;
  --brand-sky: #6FA8E6;
  --brand-gold: #C8A24B;
  --brand-teal: #4A8A8A;

  /* Platform palette (vivid in light, glowy in dark) */
  --pf-convexus: #6366F1;   /* indigo */
  --pf-conventus: #004990;  /* NATO blue */
  --pf-consultus: #0BB8C4;  /* vivid cyan-teal */
  --pf-connectus: #16A34A;  /* green */
  --pf-convergens: #8B3DD6;   /* vivid violet — convergence */
  --pf-connovus: #D97757;   /* Claude orange — Conventlab */

  /* Light theme surfaces */
  --bg: #F5F2EC;
  --bg-soft: #EDE7DA;
  --paper: #FFFFFF;
  --paper-2: #FAF7F1;
  --ink: #0E2148;
  --ink-2: #1F2D55;
  --muted: #5A6486;
  --line: #E5DFD2;
  --line-2: #D6CFBE;
  --chip: #ECE6D6;
  --hero-grad-1: #DDE7FB;
  --hero-grad-2: #F6EFE0;
  --globe-bg: radial-gradient(70% 70% at 50% 50%, #DDEAFB 0%, #F2EAD6 70%, transparent 100%);
}

html[data-theme="dark"] {
  /* Palantir / Helsing-grade graphite + navy */
  --bg: #05070D;
  --bg-soft: #0A0E18;
  --paper: #0E131F;
  --paper-2: #0A0E18;
  --ink: #E8ECF5;
  --ink-2: #C8CFDD;
  --muted: #6F7A92;
  --line: #161C2A;
  --line-2: #232A3D;
  --chip: #121724;
  --hero-grad-1: #0A1224;
  --hero-grad-2: #05070D;
  --globe-bg: radial-gradient(70% 70% at 50% 50%, #0F1A33 0%, #05070D 70%, transparent 100%);
  /* Cyan accent for dark mode */
  --brand-blue: #3DA5FF;
  --brand-sky: #5BC0FF;
  --logo-outer: #E8ECF5;
  --logo-inner: #5BC0FF;
  --pf-connovus: #E0926E;   /* Claude orange (brightened for dark) */
  --pf-conventus: #4B92DB;  /* NATO blue (brightened for dark) */
  --pf-consultus: #22D3DB;  /* cyan-teal (brightened for dark) */
  --pf-convergens: #A876F0; /* violet (brightened for dark) */
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; overflow-x: clip; max-width: 100%; }
body {
  font-family: 'Manrope', system-ui, sans-serif;
  background: var(--bg);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "ss01","ss02";
  transition: background-color .35s ease, color .35s ease;
}
a { color: inherit; text-decoration: none; }
.serif { font-family: 'Instrument Serif', serif; font-weight: 400; font-style: italic; letter-spacing: -0.01em; }
.mono { font-family: 'JetBrains Mono', monospace; }

/* Layout */
.container { max-width: 1320px; margin: 0 auto; padding: 0 32px; }

/* ============== TOP BAR ============== */
.topbar {
  position: sticky; top: 0; z-index: 50;
  backdrop-filter: blur(14px);
  background: color-mix(in srgb, var(--bg) 75%, transparent);
  border-bottom: 1px solid var(--line);
}
.topbar-inner {
  display: flex; align-items: center; justify-content: flex-start;
  padding: 18px 0;
}
.brand { display: flex; align-items: center; gap: 14px; }
.brand-mark { width: 38px; height: 38px; }
.brand-name {
  font-weight: 700; letter-spacing: 0.22em; font-size: 20px;
  background: linear-gradient(110deg, #7FA8E8 0%, #9BBCEC 34%, #A9C7E0 60%, #C9B3E6 100%);
  background-size: 200% auto;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: hlShine 8s linear infinite;
}
.brand-sub {
  font-size: 9px; letter-spacing: 0.32em; color: var(--muted);
  margin-top: 2px; text-transform: uppercase;
}
nav.primary { display: flex; gap: 30px; align-items: center; }
nav.primary a {
  font-size: 14px; font-weight: 500; color: var(--ink-2);
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 0;
  border-bottom: 2px solid transparent;
  transition: all .2s ease;
}
nav.primary a:hover { color: var(--brand-blue); border-bottom-color: var(--brand-blue); }
.nav-actions { display: flex; align-items: center; gap: 14px; margin-left: 22px; }
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 11px 20px; border-radius: 999px;
  font-weight: 600; font-size: 14px;
  border: 1px solid transparent;
  cursor: pointer; transition: all .2s ease;
  font-family: inherit;
}
.btn-primary { background: var(--brand-ink); color: #fff; }
.btn-primary:hover { background: var(--brand-blue); transform: translateY(-1px); }
html[data-theme="dark"] .btn-primary { background: var(--brand-blue); }
html[data-theme="dark"] .btn-primary:hover { background: #4787E8; }
.btn-ghost { background: transparent; color: var(--ink); border-color: var(--line-2); }
.btn-ghost:hover { background: var(--paper); }
.btn-link { background: transparent; color: var(--ink); padding: 11px 0; }
.btn-link:hover { color: var(--brand-blue); }

.theme-toggle {
  width: 38px; height: 38px; border-radius: 50%;
  border: 1px solid var(--line-2);
  background: var(--paper);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all .2s ease;
}
.theme-toggle:hover { transform: rotate(20deg); border-color: var(--brand-blue); }
.theme-toggle svg { width: 18px; height: 18px; color: var(--ink); }
.icon-sun { display: none; }
html[data-theme="dark"] .icon-sun { display: block; }
html[data-theme="dark"] .icon-moon { display: none; }

/* ============== HERO ============== */
.hero {
  position: relative; overflow: hidden;
  padding: 64px 0 88px;
}
.hero-bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(50% 70% at 18% 8%, color-mix(in srgb, var(--brand-sky) 22%, transparent) 0%, transparent 60%),
    radial-gradient(40% 60% at 92% 30%, color-mix(in srgb, var(--brand-gold) 14%, transparent) 0%, transparent 60%);
  pointer-events: none;
}
html[data-theme="dark"] .hero-bg {
  background:
    radial-gradient(45% 60% at 18% 8%, color-mix(in srgb, var(--brand-blue) 18%, transparent) 0%, transparent 65%),
    radial-gradient(40% 60% at 90% 30%, color-mix(in srgb, #00C2FF 10%, transparent) 0%, transparent 65%);
}

/* Operational grid overlay on hero (dark only) */
html[data-theme="dark"] .hero::before {
  content: ""; position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(61,165,255,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(61,165,255,0.04) 1px, transparent 1px);
  background-size: 80px 80px;
  pointer-events: none;
  mask-image: radial-gradient(80% 60% at 50% 40%, black 0%, transparent 80%);
  -webkit-mask-image: radial-gradient(80% 60% at 50% 40%, black 0%, transparent 80%);
}
.hero-grid {
  position: relative;
  display: grid; grid-template-columns: 1.05fr 1fr;
  gap: 60px; align-items: center;
}
.hero-globe-wrap {
  position: relative;
  display: flex; align-items: center; justify-content: center;
  aspect-ratio: 1/1;
  max-width: 560px;
  margin: 0 auto;
  width: 100%;
}
#globeCanvas {
  width: 100%; height: 100%; display: block;
}

/* ============== GLOBE HOTSPOTS ============== */
.globe-hotspots {
  position: absolute; inset: 0;
  pointer-events: none;
  /* matches canvas geometry: nodes at radius NR=250 on a 560 canvas → 44.64% from center */
  --orbit: 44.64%;
}
.globe-hotspot {
  position: absolute;
  top: 50%; left: 50%;
  width: 64px; height: 64px;
  margin: -32px 0 0 -32px;
  transform: translate(calc(cos(var(--ang)) * var(--orbit) * (560 / 64)),
                       calc(sin(var(--ang)) * var(--orbit) * (560 / 64)));
  /* The compositional shortcut: convert % of canvas to px via cos/sin × NR=250px on 560 stage.
     Use direct trig in px from CSS — see fallback below if cos()/sin() unsupported. */
  border: 0; background: transparent; padding: 0;
  border-radius: 50%; cursor: pointer;
  pointer-events: auto;
  outline: none;
  transition: transform .25s cubic-bezier(.2,.7,.2,1);
}
/* Fallback positions (used because cos()/sin() with non-angle multipliers is finicky) */
.globe-hotspots .globe-hotspot[data-pf="convexus"]   { left: 50.00%; top:  5.36%; transform: translate(-50%, -50%); }
.globe-hotspots .globe-hotspot[data-pf="conventus"]  { left: 88.66%; top: 27.68%; transform: translate(-50%, -50%); }
.globe-hotspots .globe-hotspot[data-pf="consultus"]  { left: 88.66%; top: 72.32%; transform: translate(-50%, -50%); }
.globe-hotspots .globe-hotspot[data-pf="connectus"]  { left: 50.00%; top: 94.64%; transform: translate(-50%, -50%); }
.globe-hotspots .globe-hotspot[data-pf="convergens"] { left: 11.34%; top: 72.32%; transform: translate(-50%, -50%); }
.globe-hotspots .globe-hotspot[data-pf="conventlab"] { left: 11.34%; top: 27.68%; transform: translate(-50%, -50%); }
.globe-hotspot::before {
  content: ""; position: absolute; inset: 0;
  border-radius: 50%;
  border: 1.5px solid transparent;
  transition: all .25s ease;
}
.globe-hotspot:hover::before,
.globe-hotspot:focus-visible::before,
.globe-hotspot.is-active::before {
  inset: -8px;
  border-color: color-mix(in srgb, var(--c) 70%, transparent);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--c) 25%, transparent),
    0 0 24px -4px color-mix(in srgb, var(--c) 55%, transparent);
}
.hs-pulse {
  position: absolute; inset: 14px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--c) 18%, transparent);
  opacity: 0;
  animation: hsPulse 2.4s ease-out infinite;
}
.globe-hotspot:hover .hs-pulse,
.globe-hotspot.is-active .hs-pulse { opacity: 1; }
@keyframes hsPulse {
  0%   { transform: scale(0.7); opacity: 0.6; }
  100% { transform: scale(2.2); opacity: 0; }
}

/* Floating tooltip card */
.globe-tooltip {
  position: absolute;
  top: 50%; left: 50%;
  width: 260px;
  padding: 16px 18px 14px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow:
    0 24px 60px -28px color-mix(in srgb, var(--c, var(--brand-ink)) 50%, transparent),
    0 12px 30px -16px rgba(14,33,72,0.2);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(var(--tx, -50%), var(--ty, -120%)) scale(0.96);
  transform-origin: var(--tox, 50%) var(--toy, 100%);
  transition: opacity .18s ease, transform .22s cubic-bezier(.2,.7,.2,1), visibility 0s linear .2s;
  z-index: 12;
}
.globe-tooltip.is-shown {
  opacity: 1; visibility: visible;
  transform: translate(var(--tx, -50%), var(--ty, -120%)) scale(1);
  transition: opacity .18s ease, transform .22s cubic-bezier(.2,.7,.2,1), visibility 0s;
}
.globe-tooltip::before {
  content: ""; position: absolute;
  width: 3px; top: 14px; bottom: 14px; left: 0;
  background: var(--c, var(--brand-blue));
  border-radius: 3px 0 0 3px;
}
.gt-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 8px;
}
.gt-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.16em;
  color: var(--muted); font-weight: 600;
}
.gt-status {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.16em; font-weight: 700;
  color: var(--c, var(--brand-blue));
}
.gt-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--c, var(--brand-blue));
  box-shadow: 0 0 8px var(--c, var(--brand-blue));
  animation: oprBlink 1.6s infinite;
}
.gt-name {
  font-family: 'Manrope', sans-serif;
  font-size: 18px; font-weight: 700; letter-spacing: -0.01em;
  color: var(--ink); margin: 0 0 2px;
}
.gt-tag {
  font-family: 'Instrument Serif', serif; font-style: italic;
  font-size: 13px; color: var(--c, var(--brand-blue));
  margin-bottom: 8px; line-height: 1.3;
}
.gt-desc {
  font-size: 12.5px; line-height: 1.5; color: var(--muted);
  margin: 0 0 12px;
}
.gt-foot {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 10px;
  border-top: 1px dashed var(--line-2);
}
.gt-cta {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10.5px; letter-spacing: 0.12em; font-weight: 700;
  color: var(--c, var(--brand-blue));
  text-transform: uppercase;
}
@media (hover: none) {
  .globe-tooltip { width: 220px; }
}
@media (max-width: 540px) {
  .globe-tooltip { width: 200px; padding: 12px 14px; }
  .gt-name { font-size: 16px; }
  .gt-desc { font-size: 11.5px; }
}
@media (max-width: 1080px) {
  .hero-grid { grid-template-columns: 1fr !important; text-align: center; }
  .hero-globe-wrap { max-width: 460px; }
}
.eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 7px 14px 7px 8px; border-radius: 999px;
  background: var(--paper); border: 1px solid var(--line);
  font-size: 12px; font-weight: 600;
  color: var(--ink-2); letter-spacing: 0.04em;
}
.eyebrow-dot {
  width: 22px; height: 22px; border-radius: 50%;
  background: linear-gradient(135deg, var(--brand-blue), var(--pf-convexus));
  display: inline-flex; align-items: center; justify-content: center;
  color: white; font-size: 11px;
}
h1.hero-title {
  font-family: 'Manrope', sans-serif;
  font-weight: 700;
  font-size: clamp(30px, 3vw, 50px);
  line-height: 1.05;
  letter-spacing: -0.025em;
  margin: 22px 0 0;
  color: var(--ink);
  white-space: nowrap;
}
h1.hero-title em {
  font-family: 'Instrument Serif', serif;
  font-style: italic; font-weight: 400;
  background: linear-gradient(110deg, var(--brand-blue) 0%, var(--pf-convexus) 40%, var(--pf-conventus) 70%, #D97757 100%);
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  font-size: 1.04em;
  letter-spacing: -0.02em;
}
.brand-sub {
  background: linear-gradient(110deg, var(--brand-blue) 0%, var(--pf-convexus) 45%, var(--pf-conventus) 75%, #D97757 100%);
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  font-weight: 700;
}
.hero-lead {
  font-size: 18px; line-height: 1.55; color: var(--muted);
  max-width: 520px; margin: 26px 0 36px;
}
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hero-pillars {
  display: flex; gap: 26px; flex-wrap: wrap;
  margin-top: 36px; padding-top: 28px;
  border-top: 1px dashed var(--line-2);
}
.pillar { display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 500; color: var(--ink-2); }
.pillar-ico {
  width: 32px; height: 32px; border-radius: 8px;
  background: var(--paper); border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
  color: var(--brand-blue);
}
.pillar-ico svg { width: 16px; height: 16px; }

/* Hero kicker (mono) + six-platform legend (Variation A) */
.hero-kicker {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; font-weight: 500; letter-spacing: 0.14em;
  color: var(--ink-2); text-transform: uppercase;
}
.hk-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--pf-connectus);
  animation: hkpulse 2.4s infinite;
}
@keyframes hkpulse {
  0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--pf-connectus) 55%, transparent); }
  70% { box-shadow: 0 0 0 8px transparent; }
  100% { box-shadow: 0 0 0 0 transparent; }
}
.hero-title .ht-line { color: var(--ink); }
.hero-legend {
  margin-top: 30px; padding-top: 34px;
  border-top: 1px dashed var(--line-2);
  text-align: center;
}
.hl-title {
  font-family: 'Manrope', sans-serif;
  font-weight: 800; letter-spacing: -0.03em;
  font-size: clamp(30px, 4vw, 52px); line-height: 1.0;
  margin: 0 0 26px;
}
.hl-title span {
  font-family: 'Instrument Serif', serif;
  font-style: italic; font-weight: 400; letter-spacing: -0.01em;
  background: linear-gradient(110deg,
    var(--pf-conventus) 0%, var(--pf-convexus) 26%, var(--pf-connectus) 48%,
    var(--pf-connovus) 68%, var(--pf-consultus) 84%, var(--pf-convergens) 100%);
  background-size: 200% auto;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: hlShine 7s linear infinite;
}
@keyframes hlShine { to { background-position: 200% center; } }
.hl-chips {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: 12px;
}
.pf-chip {
  display: inline-flex; align-items: center; gap: 9px;
  font-size: 14px; font-weight: 700; color: var(--ink-2);
  white-space: nowrap; font-family: inherit; cursor: pointer;
  padding: 11px 20px 11px 16px; border-radius: 100px;
  background: var(--paper);
  border: 1px solid color-mix(in srgb, var(--c) 32%, var(--line));
  box-shadow: 0 1px 0 color-mix(in srgb, var(--c) 8%, transparent);
  transition: transform .22s cubic-bezier(.2,.8,.2,1), box-shadow .22s ease, border-color .22s ease, color .22s ease, background .22s ease;
  position: relative; overflow: hidden;
  animation: hlChipIn .5s cubic-bezier(.2,.8,.2,1) both;
}
.pf-chip:nth-child(1){animation-delay:.05s} .pf-chip:nth-child(2){animation-delay:.11s}
.pf-chip:nth-child(3){animation-delay:.17s} .pf-chip:nth-child(4){animation-delay:.23s}
.pf-chip:nth-child(5){animation-delay:.29s} .pf-chip:nth-child(6){animation-delay:.35s}
@keyframes hlChipIn { from { opacity: 0; transform: translateY(14px) scale(.94); } to { opacity: 1; transform: none; } }
.pf-chip .dot {
  width: 9px; height: 9px; border-radius: 50%; flex: none;
  background: var(--c);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--c) 18%, transparent), 0 0 10px color-mix(in srgb, var(--c) 50%, transparent);
  transition: box-shadow .22s ease;
}
.pf-chip:hover {
  transform: translateY(-4px) scale(1.04);
  color: #fff;
  background: var(--c);
  border-color: var(--c);
  box-shadow: 0 16px 30px -12px color-mix(in srgb, var(--c) 72%, transparent),
              0 0 0 1px color-mix(in srgb, var(--c) 40%, transparent);
}
.pf-chip:hover .dot { background: #fff; box-shadow: 0 0 0 4px rgba(255,255,255,0.28); }
.pf-chip:active { transform: translateY(-1px) scale(1.0); }
@media (max-width: 720px) { .hl-chips { gap: 9px; } .pf-chip { font-size: 13px; padding: 9px 15px 9px 13px; } }

/* Globe / network visual */
.hero-visual {
  position: relative; aspect-ratio: 1/1;
  display: flex; align-items: center; justify-content: center;
}
.globe-stage {
  position: absolute; inset: 0;
  border-radius: 32px;
  background:
    radial-gradient(60% 60% at 50% 50%, #0E2148 0%, #050A1C 70%, #02050F 100%);
  overflow: hidden;
  box-shadow:
    inset 0 0 80px rgba(61,165,255,0.18),
    0 30px 80px -40px rgba(14,33,72,0.4);
}
.globe-stage::before {
  content: ""; position: absolute; inset: 0;
  background-image:
    radial-gradient(1px 1px at 12% 18%, rgba(255,255,255,0.6), transparent),
    radial-gradient(1px 1px at 80% 12%, rgba(255,255,255,0.5), transparent),
    radial-gradient(1.5px 1.5px at 32% 78%, rgba(255,255,255,0.7), transparent),
    radial-gradient(1px 1px at 70% 88%, rgba(255,255,255,0.5), transparent),
    radial-gradient(1px 1px at 55% 6%, rgba(255,255,255,0.6), transparent),
    radial-gradient(1.2px 1.2px at 92% 60%, rgba(255,255,255,0.5), transparent),
    radial-gradient(1px 1px at 6% 60%, rgba(255,255,255,0.55), transparent),
    radial-gradient(1px 1px at 22% 42%, rgba(120,180,255,0.6), transparent),
    radial-gradient(1px 1px at 88% 38%, rgba(120,180,255,0.6), transparent),
    radial-gradient(0.8px 0.8px at 40% 22%, rgba(255,255,255,0.4), transparent),
    radial-gradient(0.8px 0.8px at 60% 72%, rgba(255,255,255,0.4), transparent),
    radial-gradient(0.8px 0.8px at 18% 88%, rgba(255,255,255,0.4), transparent);
  pointer-events: none;
}
.globe-svg { width: 100%; height: 100%; position: relative; z-index: 1; }
.hero-stat {
  position: absolute;
  background: var(--paper);
  border: 1px solid var(--line);
  padding: 12px 16px; border-radius: 14px;
  box-shadow: 0 12px 30px -16px rgba(14,33,72,0.18);
  z-index: 3;
}
.hero-stat .label {
  font-size: 9px; letter-spacing: 0.16em; font-weight: 700;
  color: var(--muted); text-transform: uppercase;
}
.hero-stat .value {
  font-size: 22px; font-weight: 700; color: var(--ink);
  letter-spacing: -0.02em; margin-top: 2px;
}
.hero-stat .delta { font-size: 11px; color: var(--pf-connectus); margin-top: 1px; font-weight: 600; }
.stat-tl { top: 6%; left: -4%; }
.stat-tr { top: 14%; right: -4%; }
.stat-bl { bottom: 10%; left: -2%; }
.stat-br { bottom: 18%; right: -6%; }

/* ============== TRUST STRIP ============== */
.trust {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--paper-2);
  padding: 28px 0;
}
.trust-inner { display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; }
.trust-label {
  font-size: 15px; letter-spacing: 0.16em;
  text-transform: uppercase; font-weight: 800; flex-shrink: 0;
  background: linear-gradient(110deg, var(--brand-blue) 0%, var(--pf-convexus) 38%, var(--pf-conventus) 66%, var(--pf-connovus) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  flex-shrink: 0;
}
.trust-logos {
  display: flex; align-items: center; gap: 18px 30px; flex-wrap: wrap; justify-content: center;
  font-weight: 700; letter-spacing: 0.06em; font-size: 13px;
}
.trust-logos > div { display: flex; align-items: center; gap: 9px; color: var(--c, var(--ink-2)); white-space: nowrap; }

/* ============== SECTION ============== */
.section { padding: 110px 0; }
.section-head { text-align: center; max-width: 760px; margin: 0 auto 56px; }
.section-eyebrow {
  font-size: 11px; letter-spacing: 0.26em; color: var(--brand-blue);
  text-transform: uppercase; font-weight: 700;
}
.section-title {
  font-size: clamp(36px, 4vw, 56px);
  font-weight: 700; letter-spacing: -0.025em;
  line-height: 1.05; color: var(--ink);
  margin: 14px 0 16px;
}
.section-title.section-title-hero { line-height: 1.12; }
.section-title.section-title-hero em {
  font-family: 'Manrope', sans-serif;
  font-style: normal; font-weight: 700;
  font-size: clamp(48px, 5.4vw, 76px);
  letter-spacing: -0.03em;
  background: linear-gradient(110deg, var(--brand-blue) 0%, var(--pf-convexus) 35%, var(--pf-conventus) 65%, #D97757 100%);
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  display: inline-block;
  line-height: 1.12;
  padding-bottom: 0.06em;
}
.section-eyebrow-after {
  margin-top: 24px;
  color: var(--ink-2) !important;
  letter-spacing: 0.04em !important;
  text-transform: none !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  white-space: nowrap;
}
.section-title em {
  font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400;
  color: var(--brand-blue);
}
.section-sub { color: var(--muted); font-size: 17px; line-height: 1.55; max-width: 620px; margin: 0 auto; }

/* ============== ECOSYSTEM 6-GRID ============== */
.platforms {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.platform-card {
  position: relative;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 28px 26px 26px;
  transition: all .25s ease;
  overflow: hidden;
  cursor: pointer;
}
.platform-card::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--c, var(--brand-blue));
  opacity: 0; transition: opacity .25s ease;
}
.platform-card:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--c) 60%, var(--line)); box-shadow: 0 26px 50px -28px color-mix(in srgb, var(--c) 50%, transparent); }
.platform-card:hover::before { opacity: 1; }
.platform-card .num {
  position: absolute; top: 24px; right: 26px;
  font-family: 'JetBrains Mono'; font-size: 12px; letter-spacing: 0.06em;
  color: var(--muted);
}
.platform-head { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.platform-ico {
  width: 50px; height: 50px; border-radius: 14px;
  background: color-mix(in srgb, var(--c) 14%, var(--paper));
  border: 1px solid color-mix(in srgb, var(--c) 25%, var(--line));
  color: var(--c); flex: none;
  display: flex; align-items: center; justify-content: center;
}
html[data-theme="dark"] .platform-ico { background: color-mix(in srgb, var(--c) 18%, var(--paper-2)); }
.platform-ico svg { width: 24px; height: 24px; }
.platform-name {
  font-size: 21px; font-weight: 700; letter-spacing: -0.02em;
  color: var(--c);
}
.platform-tag {
  font-size: 14px; font-weight: 700; color: var(--ink); margin-bottom: 11px; letter-spacing: -0.01em;
}
.platform-desc {
  font-size: 14.5px; line-height: 1.62; color: var(--ink-2);
  margin-bottom: 16px;
}
.platform-kw { display: flex; flex-wrap: nowrap; gap: 5px; margin-bottom: 20px; overflow: hidden; }
.platform-kw span {
  font-size: 10.5px; font-weight: 600; color: var(--ink-2); white-space: nowrap; flex: none;
  padding: 4px 8px; border-radius: 100px;
  background: color-mix(in srgb, var(--c) 9%, var(--paper-2));
  border: 1px solid color-mix(in srgb, var(--c) 20%, var(--line));
}
.platform-link {
  font-size: 13px; font-weight: 600; color: var(--c);
  display: inline-flex; align-items: center; gap: 6px;
  border-top: 1px solid var(--line);
  padding-top: 16px; width: 100%;
}
.platform-link svg { width: 14px; height: 14px; transition: transform .2s ease; }
.platform-card:hover .platform-link svg { transform: translateX(4px); }

.platforms > .platform-card:nth-child(1) { --c: var(--pf-convexus); }
.platforms > .platform-card:nth-child(2) { --c: var(--pf-conventus); }
.platforms > .platform-card:nth-child(3) { --c: var(--pf-consultus); }
.platforms > .platform-card:nth-child(4) { --c: var(--pf-connectus); }
.platforms > .platform-card:nth-child(5) { --c: var(--pf-convergens); }
.platforms > .platform-card:nth-child(6) { --c: var(--pf-connovus); }

/* ============== CONVENTLAB · interactive lab card (06) ============== */
.conventlab-card { display: flex; flex-direction: column; }

/* + lab mark — replaces the static icon, acts as the reveal trigger */
.cl-mark {
  position: relative;
  width: 56px; height: 56px; border-radius: 16px; padding: 0;
  background: color-mix(in srgb, var(--c) 14%, var(--paper));
  border: 1px solid color-mix(in srgb, var(--c) 28%, var(--line));
  color: var(--c); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 22px;
  transition: background .28s ease, border-color .28s ease, box-shadow .28s ease;
}
html[data-theme="dark"] .cl-mark { background: color-mix(in srgb, var(--c) 18%, var(--paper-2)); }
.cl-mark:hover { box-shadow: 0 12px 26px -12px color-mix(in srgb, var(--c) 75%, transparent); }
.cl-mark:focus-visible { outline: 2px solid var(--c); outline-offset: 3px; }
.cl-mark-grid {
  position: absolute; inset: 9px; border-radius: 9px; pointer-events: none;
  background-image:
    linear-gradient(color-mix(in srgb, var(--c) 30%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--c) 30%, transparent) 1px, transparent 1px);
  background-size: 8px 8px; opacity: .55;
  -webkit-mask: radial-gradient(circle at center, #000 35%, transparent 72%);
          mask: radial-gradient(circle at center, #000 35%, transparent 72%);
  transition: opacity .3s ease;
}
.cl-mark-plus { position: relative; z-index: 2; display: flex; transition: transform .42s cubic-bezier(.34,1.56,.64,1); }
.cl-mark-plus svg { width: 24px; height: 24px; }
.cl-mark-ping {
  position: absolute; inset: -1px; border-radius: 16px; pointer-events: none;
  border: 1.5px solid var(--c); opacity: 0;
  animation: clPing 2.9s ease-out infinite;
}
@keyframes clPing {
  0% { transform: scale(1); opacity: .55; }
  70% { opacity: 0; }
  100% { transform: scale(1.34); opacity: 0; }
}
/* open state — plus becomes × and tile fills */
.conventlab-card.cl-open .cl-mark { background: var(--c); color: #fff; border-color: var(--c); }
.conventlab-card.cl-open .cl-mark-plus { transform: rotate(135deg); }
.conventlab-card.cl-open .cl-mark-ping { animation: none; opacity: 0; }
.conventlab-card.cl-open .cl-mark-grid { opacity: 0; }

/* labs — collapsed by default, revealed on .cl-open */
.cl-labs {
  display: flex; flex-direction: column; gap: 8px;
  max-height: 0; opacity: 0; margin-bottom: 0; overflow: hidden;
  transition: max-height .46s cubic-bezier(.4,0,.2,1), opacity .34s ease, margin-bottom .46s ease;
}
.conventlab-card.cl-open .cl-labs { max-height: 460px; opacity: 1; margin-bottom: 20px; }

.cl-lab {
  display: flex; align-items: center; gap: 12px; width: 100%;
  padding: 10px 12px; border-radius: 13px; cursor: pointer; text-align: left;
  background: color-mix(in srgb, var(--lc) 7%, var(--paper-2));
  border: 1px solid color-mix(in srgb, var(--lc) 20%, var(--line));
  color: var(--ink);
  transform: translateY(8px); opacity: 0;
  transition: transform .2s ease, opacity .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease;
}
html[data-theme="dark"] .cl-lab { background: color-mix(in srgb, var(--lc) 12%, var(--paper-2)); }
.conventlab-card.cl-open .cl-lab { transform: translateY(0); opacity: 1; }
.conventlab-card.cl-open .cl-lab:nth-child(1) { transition-delay: .06s; }
.conventlab-card.cl-open .cl-lab:nth-child(2) { transition-delay: .12s; }
.conventlab-card.cl-open .cl-lab:nth-child(3) { transition-delay: .18s; }
.conventlab-card.cl-open .cl-lab:nth-child(4) { transition-delay: .24s; }
.conventlab-card.cl-open .cl-lab:nth-child(5) { transition-delay: .30s; }
.cl-lab:hover {
  background: color-mix(in srgb, var(--lc) 14%, var(--paper));
  border-color: color-mix(in srgb, var(--lc) 55%, var(--line));
  box-shadow: 0 8px 18px -12px color-mix(in srgb, var(--lc) 80%, transparent);
}
.cl-lab:focus-visible { outline: 2px solid var(--lc); outline-offset: 2px; }
.cl-lab-ic {
  flex: 0 0 auto; width: 34px; height: 34px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--lc) 16%, var(--paper));
  border: 1px solid color-mix(in srgb, var(--lc) 30%, var(--line));
  color: var(--lc);
}
.cl-lab-ic svg { width: 18px; height: 18px; }
.cl-lab-tx { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1; }
.cl-lab-nm { font-size: 13.5px; font-weight: 700; letter-spacing: -0.01em; color: var(--ink); }
.cl-lab-ds { font-family: 'JetBrains Mono', monospace; font-size: 10.5px; letter-spacing: 0.02em; color: var(--muted); }
.cl-lab-ar { flex: 0 0 auto; color: var(--lc); display: flex; transform: translateX(-2px); opacity: .55; transition: transform .2s ease, opacity .2s ease; }
.cl-lab-ar svg { width: 15px; height: 15px; }
.cl-lab:hover .cl-lab-ar { transform: translateX(2px); opacity: 1; }

/* ============== FEATURED PLATFORMS ============== */
.featured {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 18px; margin-top: 64px;
}
.feature-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 28px;
  position: relative; overflow: hidden;
  display: flex; flex-direction: column;
  min-height: 380px;
}
.feature-card.dark-card {
  background: linear-gradient(160deg, #0E2148 0%, #1A2D5E 100%);
  color: #fff;
  border-color: transparent;
}
.feature-card.dark-card .feature-eyebrow,
.feature-card.dark-card .feature-title,
.feature-card.dark-card .feature-list li { color: #fff; }
.feature-card.dark-card .feature-sub { color: rgba(255,255,255,0.7); }
.feature-eyebrow {
  font-size: 11px; letter-spacing: 0.22em; font-weight: 700;
  color: var(--c, var(--brand-blue)); text-transform: uppercase;
  margin-bottom: 12px;
}
.feature-title {
  font-size: 24px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.15;
  color: var(--ink); margin-bottom: 6px;
}
.feature-sub {
  font-size: 14px; color: var(--muted); margin-bottom: 18px;
  font-weight: 500;
}
.feature-visual {
  flex: 1; display: flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--c) 8%, var(--paper-2));
  border-radius: 16px;
  padding: 18px; margin-bottom: 18px;
  border: 1px solid color-mix(in srgb, var(--c) 18%, var(--line));
}
.feature-card.dark-card .feature-visual {
  background: rgba(255,255,255,0.04);
  border-color: rgba(255,255,255,0.08);
}
.feature-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.feature-list li {
  font-size: 13px; color: var(--ink-2); display: flex; align-items: center; gap: 8px;
}
.feature-list li::before {
  content: ""; width: 14px; height: 14px; border-radius: 50%;
  background: color-mix(in srgb, var(--c) 18%, var(--paper));
  border: 1.5px solid var(--c);
  flex-shrink: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232A6FDB' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-size: 9px; background-position: center; background-repeat: no-repeat;
}
.feature-card .feature-list li { --bullet-c: var(--c); }
.feature-card.first { --c: var(--pf-convexus); }
.feature-card.second { --c: var(--pf-conventus); }
.feature-card.third { --c: var(--pf-convergens); }
.feature-card.fourth { --c: var(--pf-connovus); }

/* Experimentation timeline (CONVENTLAB) */
.exp-visual { width: 100%; display: flex; flex-direction: column; gap: 10px; }
.exp-track {
  display: grid; grid-template-columns: 84px 1fr 64px; align-items: center; gap: 12px;
  font-size: 11px;
}
.exp-track .exp-name { font-weight: 700; color: var(--ink); font-size: 12px; letter-spacing: -0.01em; }
.exp-track .exp-bar {
  height: 7px; border-radius: 999px;
  background: color-mix(in srgb, var(--pf-connovus) 10%, var(--paper-2));
  position: relative; overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--pf-connovus) 22%, var(--line));
}
.exp-track .exp-bar > span {
  position: absolute; top: 0; left: 0; bottom: 0;
  background: linear-gradient(90deg, var(--pf-connovus), #FFB1BC);
  border-radius: 999px;
}
.exp-track .exp-state { font-family: 'JetBrains Mono'; font-size: 10px; font-weight: 600; letter-spacing: 0.08em; text-align: right; }
.exp-track .exp-state.live { color: var(--pf-connectus); }
.exp-track .exp-state.pilot { color: var(--pf-convergens); }
.exp-track .exp-state.design { color: var(--muted); }

/* AI matchmaking visual */
.ai-visual { width: 100%; }
.ai-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ai-people { display: flex; flex-direction: column; gap: 8px; }
.avatar {
  width: 38px; height: 38px; border-radius: 50%;
  background: linear-gradient(135deg, var(--brand-sky), var(--brand-blue));
  border: 2px solid var(--paper);
}
.avatar.a2 { background: linear-gradient(135deg, var(--pf-conventus), #FFB28C); }
.avatar.a3 { background: linear-gradient(135deg, var(--pf-convergens), #FFD9A0); }
.avatar.a4 { background: linear-gradient(135deg, var(--pf-connectus), #B8F2C9); }
.ai-core {
  width: 110px; height: 110px; border-radius: 50%;
  background: conic-gradient(from 0deg, var(--pf-convexus), var(--brand-blue), var(--pf-conventus), var(--pf-convexus));
  display: flex; align-items: center; justify-content: center;
  position: relative;
  box-shadow: 0 0 0 8px color-mix(in srgb, var(--pf-convexus) 10%, transparent);
}
.ai-core::before {
  content: ""; position: absolute; inset: 6px; border-radius: 50%;
  background: var(--paper);
}
.ai-core span {
  position: relative; z-index: 1; font-weight: 800; font-size: 13px;
  letter-spacing: 0.1em; color: var(--ink);
}

/* Agenda mockup */
.agenda { width: 100%; font-size: 12px; }
.agenda-head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 6px 10px; background: rgba(255,255,255,0.06);
  border-radius: 8px; margin-bottom: 10px;
  color: rgba(255,255,255,0.85);
}
.agenda-row {
  display: flex; gap: 10px; padding: 7px 10px; align-items: center;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.85);
}
.agenda-row .time { font-family: 'JetBrains Mono'; color: var(--pf-conventus); font-size: 11px; font-weight: 600; min-width: 90px; }
.agenda-row.now { background: rgba(225,29,116,0.12); border-radius: 8px; }
.agenda-pill {
  display: inline-block; padding: 2px 7px; border-radius: 999px;
  background: rgba(225,29,116,0.18); color: #FF9CC8;
  font-size: 9px; font-weight: 700; letter-spacing: 0.1em;
}

/* Security visual */
.sec-visual { width: 100%; display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; align-items: center; }
.sec-node {
  background: color-mix(in srgb, var(--pf-convergens) 10%, var(--paper));
  border: 1px solid color-mix(in srgb, var(--pf-convergens) 30%, var(--line));
  padding: 8px 10px; border-radius: 10px;
  font-size: 10px; font-weight: 700; color: var(--ink);
  text-align: center; letter-spacing: 0.04em;
}
.sec-core {
  width: 64px; height: 64px; border-radius: 50%;
  background: linear-gradient(135deg, var(--pf-convergens), #FCD34D);
  display: flex; align-items: center; justify-content: center;
  color: #fff; box-shadow: 0 0 0 6px color-mix(in srgb, var(--pf-convergens) 16%, transparent);
}
.sec-core svg { width: 26px; height: 26px; }
.sec-stack { display: flex; flex-direction: column; gap: 8px; }

/* ============== OPERATIONAL ROOMS ============== */
.opr-section {
  position: relative; overflow: hidden;
  background:
    radial-gradient(45% 60% at 18% 15%, color-mix(in srgb, var(--pf-conventus) 14%, transparent) 0%, transparent 60%),
    radial-gradient(40% 60% at 85% 30%, color-mix(in srgb, var(--pf-connectus) 10%, transparent) 0%, transparent 60%),
    radial-gradient(30% 50% at 60% 90%, color-mix(in srgb, var(--pf-convergens) 10%, transparent) 0%, transparent 60%);
}
.opr-section-head { text-align: center; max-width: 820px; margin: 0 auto 56px; }
.opr-eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 6px 14px; border-radius: 999px;
  background: var(--paper); border: 1px solid var(--line);
  font-size: 11px; letter-spacing: 0.18em; font-weight: 700;
  color: var(--ink-2); text-transform: uppercase;
}
.opr-eyebrow .pf-dot { display: inline-flex; gap: 4px; }
.opr-eyebrow .pf-dot i {
  width: 7px; height: 7px; border-radius: 50%; display: inline-block;
}
.opr-section-head h2 {
  font-size: clamp(40px, 4.6vw, 64px);
  font-weight: 700; letter-spacing: -0.03em; line-height: 1.0;
  margin: 18px 0 14px;
  background: linear-gradient(110deg, var(--pf-conventus) 0%, var(--brand-blue) 50%, var(--pf-convergens) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.opr-section-head .opr-sub {
  font-size: 17px; line-height: 1.55; color: var(--muted); max-width: 640px; margin: 0 auto;
}

/* Main mockup row */
.opr-stage-row {
  display: grid; grid-template-columns: 1.35fr 1fr; gap: 22px;
  margin-bottom: 64px;
}

/* Mockup card - the "Operational Room" */
.opr-mockup {
  position: relative;
  background: linear-gradient(160deg, #0A1024 0%, #0E1A3A 100%);
  border: 1px solid color-mix(in srgb, var(--brand-blue) 30%, #1E2A55);
  border-radius: 22px;
  overflow: hidden;
  color: #fff;
  box-shadow:
    0 30px 80px -30px rgba(14,33,72,0.45),
    inset 0 0 80px rgba(61,165,255,0.06);
}
.opr-banner {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 18px;
  background: linear-gradient(90deg,
    color-mix(in srgb, var(--pf-conventus) 35%, transparent),
    color-mix(in srgb, var(--pf-convergens) 25%, transparent));
  border-bottom: 1px solid rgba(255,255,255,0.08);
  font-size: 10px; letter-spacing: 0.22em; font-weight: 700; text-transform: uppercase;
}
.opr-banner .lvl {
  display: inline-flex; align-items: center; gap: 8px;
  color: #fff;
}
.opr-banner .lvl .dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--pf-convergens);
  box-shadow: 0 0 8px var(--pf-convergens);
  animation: oprBlink 1.6s infinite;
}
@keyframes oprBlink { 0%,100%{opacity:1} 50%{opacity:0.3} }
.opr-banner .meta { color: rgba(255,255,255,0.7); font-weight: 600; }

.opr-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 22px 14px;
  gap: 18px;
}
.opr-head-l {
  display: flex; align-items: center; gap: 12px;
}
.opr-head-l .badge {
  width: 38px; height: 38px; border-radius: 10px;
  background: color-mix(in srgb, var(--pf-conventus) 18%, transparent);
  border: 1px solid color-mix(in srgb, var(--pf-conventus) 45%, transparent);
  color: var(--pf-conventus);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.opr-head-l .badge svg { width: 18px; height: 18px; }
.opr-head-l .title { font-family: 'Manrope'; font-weight: 700; font-size: 15px; letter-spacing: -0.01em; }
.opr-head-l .ctx { font-size: 11px; color: rgba(255,255,255,0.55); letter-spacing: 0.06em; margin-top: 1px; }
.opr-head-r {
  display: flex; align-items: center; gap: 16px; font-size: 11px; color: rgba(255,255,255,0.65); font-weight: 600;
  letter-spacing: 0.04em;
}
.opr-head-r .item { display: flex; align-items: center; gap: 6px; }
.opr-head-r .item svg { width: 13px; height: 13px; color: rgba(255,255,255,0.5); }
.opr-head-r .live-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--pf-connectus);
  box-shadow: 0 0 6px var(--pf-connectus);
}

/* Stage: speaker tile + constellation around */
.opr-stage {
  display: grid; grid-template-columns: 1.4fr 1fr;
  gap: 14px; padding: 0 22px 14px;
}
.opr-speaker {
  position: relative; aspect-ratio: 16/10;
  border-radius: 14px; overflow: hidden;
  background:
    linear-gradient(155deg, #1F3A7A 0%, #0E2148 100%);
  display: flex; align-items: flex-end; justify-content: flex-start;
  padding: 14px;
  border: 1px solid rgba(91,192,255,0.25);
}
.opr-speaker::before {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(circle at 35% 40%, color-mix(in srgb, var(--brand-sky) 35%, transparent) 0%, transparent 50%),
    radial-gradient(circle at 70% 30%, color-mix(in srgb, var(--pf-conventus) 22%, transparent) 0%, transparent 55%);
  opacity: 0.7;
}
.opr-speaker::after {
  content: ""; position: absolute; inset: 18px;
  border: 1.5px solid var(--pf-connectus);
  border-radius: 10px;
  box-shadow: 0 0 24px color-mix(in srgb, var(--pf-connectus) 45%, transparent);
  animation: oprPulse 2.4s ease-in-out infinite;
  pointer-events: none;
}
@keyframes oprPulse {
  0%,100% { box-shadow: 0 0 16px color-mix(in srgb, var(--pf-connectus) 30%, transparent); opacity: 0.6; }
  50%     { box-shadow: 0 0 28px color-mix(in srgb, var(--pf-connectus) 60%, transparent); opacity: 1; }
}
.opr-speaker .avatar-big {
  width: 64px; height: 64px; border-radius: 50%;
  background: linear-gradient(135deg, #6FA8E6, #2A6FDB);
  border: 3px solid rgba(255,255,255,0.15);
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 800; letter-spacing: 0.04em; font-size: 22px;
  position: relative; z-index: 1;
  flex-shrink: 0;
}
.opr-speaker .speaker-info {
  position: relative; z-index: 1; margin-left: 14px;
}
.opr-speaker .speaker-info .name { font-weight: 700; font-size: 14px; }
.opr-speaker .speaker-info .role { font-size: 11px; color: rgba(255,255,255,0.7); margin-top: 2px; letter-spacing: 0.04em; }
.opr-speaker .speaking-pill {
  position: absolute; top: 14px; left: 14px; z-index: 2;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 9px 5px 8px; border-radius: 999px;
  background: rgba(0,0,0,0.45); backdrop-filter: blur(6px);
  font-size: 9px; letter-spacing: 0.16em; font-weight: 700; text-transform: uppercase;
  border: 1px solid rgba(255,255,255,0.12);
}
.opr-speaker .speaking-pill .bars { display: inline-flex; gap: 2px; }
.opr-speaker .speaking-pill .bars span {
  width: 2px; height: 8px; background: var(--pf-connectus); border-radius: 1px;
  animation: oprBars 0.7s ease-in-out infinite;
}
.opr-speaker .speaking-pill .bars span:nth-child(2) { animation-delay: 0.15s; }
.opr-speaker .speaking-pill .bars span:nth-child(3) { animation-delay: 0.3s; }
@keyframes oprBars { 0%,100%{transform:scaleY(0.4)} 50%{transform:scaleY(1)} }

/* Constellation: 5 small participant tiles */
.opr-constellation {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.opr-tile {
  aspect-ratio: 16/10;
  border-radius: 10px; padding: 10px;
  background: linear-gradient(160deg, var(--bg-c, #143064) 0%, #0A1024 100%);
  border: 1px solid rgba(255,255,255,0.08);
  position: relative; overflow: hidden;
  display: flex; align-items: flex-end; gap: 8px;
  font-size: 10px;
}
.opr-tile.muted::before {
  content: ""; position: absolute; top: 8px; right: 8px;
  width: 16px; height: 16px; border-radius: 50%;
  background: rgba(244, 63, 94, 0.15);
  border: 1px solid rgba(244, 63, 94, 0.5);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FB7185' stroke-width='2.4' stroke-linecap='round'%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3Cpath d='M9 9v3a3 3 0 0 0 5 2.12M15 9.34V4a3 3 0 0 0-5.7-1.34'/%3E%3C/svg%3E");
  background-size: 8px; background-position: center; background-repeat: no-repeat;
}
.opr-tile .avatar-sm {
  width: 28px; height: 28px; border-radius: 50%;
  background: linear-gradient(135deg, var(--av-1, #F472B6), var(--av-2, #DB2777));
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 700; font-size: 11px; flex-shrink: 0;
  border: 2px solid rgba(255,255,255,0.1);
}
.opr-tile .meta {
  display: flex; flex-direction: column; gap: 2px; min-width: 0;
}
.opr-tile .meta .nm { color: #fff; font-weight: 600; font-size: 10.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.opr-tile .meta .rl { color: rgba(255,255,255,0.55); font-size: 9px; letter-spacing: 0.08em; text-transform: uppercase; }

.opr-tile.t1 { --bg-c: #2D1B4E; --av-1:#A78BFA; --av-2:#7C3AED; }
.opr-tile.t2 { --bg-c: #0E3B3D; --av-1:#5EEAD4; --av-2:#0F766E; }
.opr-tile.t3 { --bg-c: #4A2C1F; --av-1:#FBA74D; --av-2:#D97757; }
.opr-tile.t4 { --bg-c: #1F3A2E; --av-1:#86EFAC; --av-2:#16A34A; }

/* Controls bar */
.opr-controls {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 22px;
  border-top: 1px solid rgba(255,255,255,0.08);
  background: rgba(0,0,0,0.18);
}
.opr-controls .ctl-group { display: inline-flex; gap: 8px; }
.opr-ctl {
  width: 36px; height: 36px; border-radius: 10px;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.08);
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,0.85); cursor: pointer;
  transition: background .15s ease;
}
.opr-ctl:hover { background: rgba(255,255,255,0.12); }
.opr-ctl svg { width: 15px; height: 15px; }
.opr-ctl.leave { background: var(--pf-conventus); border-color: transparent; color: #fff; padding: 0 14px; width: auto; gap: 6px; font-size: 11px; font-weight: 700; letter-spacing: 0.06em; }
.opr-ctl.rec { background: rgba(244,63,94,0.18); border-color: rgba(244,63,94,0.45); color: #FB7185; }
.opr-ctl.rec::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: #FB7185; margin-right: 4px;
  animation: oprBlink 1.4s infinite;
}

/* Side panel (AI Intelligence) */
.opr-side {
  display: grid; grid-template-rows: repeat(3, auto);
  gap: 14px;
}
.opr-side-card {
  background: var(--paper);
  border: 1px solid var(--line); border-radius: 16px;
  padding: 18px 18px 16px;
  position: relative; overflow: hidden;
}
.opr-side-card .opr-h {
  display: flex; align-items: center; gap: 10px; margin-bottom: 10px;
}
.opr-side-card .opr-h .ico {
  width: 28px; height: 28px; border-radius: 8px;
  background: color-mix(in srgb, var(--cc, var(--brand-blue)) 14%, var(--paper));
  border: 1px solid color-mix(in srgb, var(--cc) 25%, var(--line));
  color: var(--cc); display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.opr-side-card .opr-h .ico svg { width: 13px; height: 13px; }
.opr-side-card .opr-h .lbl {
  font-size: 10px; letter-spacing: 0.18em; font-weight: 700;
  color: var(--cc); text-transform: uppercase;
}
.opr-side-card .opr-h .live {
  margin-left: auto;
  font-size: 9px; letter-spacing: 0.12em; font-weight: 700;
  color: var(--pf-connectus);
  display: inline-flex; align-items: center; gap: 5px;
}
.opr-side-card .opr-h .live::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--pf-connectus); animation: oprBlink 1.6s infinite;
}
.opr-side-card.ai { --cc: var(--pf-convexus); }
.opr-side-card.governance { --cc: var(--pf-convergens); }
.opr-side-card.network { --cc: var(--pf-conventus); }

.opr-side-card h4 {
  font-size: 15px; font-weight: 700; color: var(--ink); margin: 0 0 8px;
  letter-spacing: -0.01em;
}
.opr-bullet {
  display: flex; gap: 8px; align-items: flex-start;
  font-size: 12.5px; color: var(--ink-2); line-height: 1.5;
  padding: 5px 0;
}
.opr-bullet::before {
  content: ""; width: 4px; height: 4px; border-radius: 50%;
  background: var(--cc, var(--brand-blue)); margin-top: 8px; flex-shrink: 0;
}
.opr-action {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 0;
  font-size: 12.5px;
  border-bottom: 1px dashed var(--line);
}
.opr-action:last-child { border-bottom: 0; }
.opr-action .check {
  width: 14px; height: 14px; border-radius: 4px;
  border: 1.5px solid var(--cc); background: transparent; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.opr-action.done .check {
  background: var(--cc);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-size: 8px; background-position: center; background-repeat: no-repeat;
}
.opr-action.done .txt { text-decoration: line-through; color: var(--muted); }
.opr-action .txt { color: var(--ink-2); flex: 1; }
.opr-action .who {
  font-size: 10px; color: var(--muted); font-weight: 600; letter-spacing: 0.04em;
}

.opr-suggest {
  display: flex; align-items: center; gap: 10px;
  padding: 10px;
  background: color-mix(in srgb, var(--pf-conventus) 6%, var(--paper-2));
  border: 1px solid color-mix(in srgb, var(--pf-conventus) 20%, var(--line));
  border-radius: 10px;
  margin-top: 6px;
}
.opr-suggest .av {
  width: 30px; height: 30px; border-radius: 50%; flex-shrink: 0;
  background: linear-gradient(135deg, #FBA74D, #D97757);
}
.opr-suggest .info { flex: 1; min-width: 0; }
.opr-suggest .info .n { font-size: 12px; font-weight: 700; color: var(--ink); }
.opr-suggest .info .r { font-size: 10.5px; color: var(--muted); margin-top: 1px; }
.opr-suggest .invite {
  font-size: 10px; font-weight: 700; color: var(--pf-conventus);
  border: 1px solid color-mix(in srgb, var(--pf-conventus) 40%, transparent);
  padding: 4px 8px; border-radius: 6px; letter-spacing: 0.06em;
}

/* Pillars (capability strip below the mockup) */
.opr-pillars {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 72px;
}
.opr-pillar {
  position: relative;
  background: var(--paper); border: 1px solid var(--line);
  border-radius: 18px;
  padding: 24px 22px;
  transition: transform .25s ease, border-color .25s ease;
}
.opr-pillar:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--cc) 50%, var(--line)); }
.opr-pillar .ic {
  width: 44px; height: 44px; border-radius: 12px;
  background: color-mix(in srgb, var(--cc) 14%, var(--paper-2));
  border: 1px solid color-mix(in srgb, var(--cc) 25%, var(--line));
  color: var(--cc);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 16px;
}
.opr-pillar .ic svg { width: 20px; height: 20px; }
.opr-pillar h4 { font-size: 16px; font-weight: 700; color: var(--ink); margin: 0 0 6px; letter-spacing: -0.01em; }
.opr-pillar p { font-size: 13px; color: var(--muted); line-height: 1.55; margin: 0; }
.opr-pillar.p1 { --cc: var(--pf-convexus); }
.opr-pillar.p2 { --cc: var(--pf-conventus); }
.opr-pillar.p3 { --cc: var(--pf-convergens); }
.opr-pillar.p4 { --cc: var(--pf-connectus); }

/* Room types grid */
.opr-rooms-head {
  display: flex; align-items: flex-end; justify-content: space-between;
  margin-bottom: 24px; gap: 24px; flex-wrap: wrap;
}
.opr-rooms-head h3 {
  font-size: clamp(28px, 3vw, 40px); font-weight: 700; letter-spacing: -0.025em;
  margin: 0; color: var(--ink); line-height: 1.1;
}
.opr-rooms-head h3 em { font-family: 'Instrument Serif'; font-style: italic; font-weight: 400; color: var(--brand-blue); }
.opr-rooms-head .sub { color: var(--muted); font-size: 14px; max-width: 360px; }

.opr-rooms {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
.opr-room {
  position: relative;
  background: var(--paper); border: 1px solid var(--line);
  border-radius: 16px;
  padding: 20px 18px 18px;
  transition: all .2s ease;
  display: flex; flex-direction: column;
  cursor: pointer;
}
.opr-room::before {
  content: ""; position: absolute; top: -1px; left: 14px; right: 14px; height: 2px;
  background: var(--c); opacity: 0; transition: opacity .2s ease;
}
.opr-room:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--c) 55%, var(--line)); }
.opr-room:hover::before { opacity: 1; }
.opr-room .top {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 16px;
}
.opr-room .top .ic {
  width: 36px; height: 36px; border-radius: 10px;
  background: color-mix(in srgb, var(--c) 14%, var(--paper-2));
  color: var(--c);
  border: 1px solid color-mix(in srgb, var(--c) 22%, var(--line));
  display: flex; align-items: center; justify-content: center;
}
.opr-room .top .ic svg { width: 16px; height: 16px; }
.opr-room .top .live {
  font-size: 9.5px; letter-spacing: 0.14em; font-weight: 700;
  color: var(--c);
  display: inline-flex; align-items: center; gap: 5px;
}
.opr-room .top .live::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%;
  background: var(--c);
}
.opr-room .nm { font-size: 14px; font-weight: 700; color: var(--ink); letter-spacing: -0.01em; line-height: 1.2; }
.opr-room .ds { font-size: 12px; color: var(--muted); line-height: 1.5; margin-top: 6px; min-height: 36px; }
.opr-room .ft {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 14px; padding-top: 12px;
  border-top: 1px solid var(--line);
  font-size: 11px; color: var(--muted); font-weight: 600;
}
.opr-room .ft .avs { display: inline-flex; }
.opr-room .ft .avs .a {
  width: 18px; height: 18px; border-radius: 50%;
  border: 2px solid var(--paper);
  margin-left: -5px;
  background: linear-gradient(135deg, var(--av1, #6FA8E6), var(--av2, #2A6FDB));
}
.opr-room .ft .avs .a:first-child { margin-left: 0; }

.opr-room.r1 { --c: var(--pf-conventus); }
.opr-room.r2 { --c: var(--pf-convexus); }
.opr-room.r3 { --c: var(--pf-consultus); }
.opr-room.r4 { --c: var(--pf-convergens); }
.opr-room.r5 { --c: var(--pf-connectus); }
.opr-room.r6 { --c: var(--pf-connovus); }
.opr-room.r7 { --c: var(--brand-blue); }
.opr-room.r8 { --c: #6FA8E6; }

/* Platform vision / mission cards (simplified ecosystem grid) */
.opr-rooms-head.vm-head-center { justify-content: center; text-align: center; margin-top: 96px; margin-bottom: 40px; }
.opr-rooms-head.vm-head-center h3 {
  font-size: clamp(34px, 4.4vw, 60px); line-height: 1.02; letter-spacing: -0.03em;
  background: linear-gradient(110deg,
    var(--pf-conventus) 0%, var(--pf-convexus) 30%, var(--pf-connectus) 55%,
    var(--pf-connovus) 78%, var(--pf-convergens) 100%);
  background-size: 200% auto;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: hlShine 7s linear infinite;
}
.opr-rooms-head.vm-head-center h3 em {
  font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400;
  -webkit-text-fill-color: transparent;
}
.opr-rooms.pf-vm-grid { grid-template-columns: repeat(3, 1fr); gap: 18px; }
.pf-vm {
  position: relative; background: var(--paper); border: 1px solid var(--line);
  border-radius: 18px; padding: 24px 22px 20px; cursor: pointer; overflow: hidden;
  display: flex; flex-direction: column;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), border-color .3s ease, box-shadow .3s ease;
}
.pf-vm::after {
  content:""; position:absolute; right:-44px; top:-44px; width:150px; height:150px; border-radius:50%;
  background: radial-gradient(circle, color-mix(in srgb,var(--c) 22%,transparent), transparent 70%);
  opacity:0; transition:opacity .35s ease; pointer-events:none;
}
.pf-vm:hover { transform: translateY(-6px); border-color: color-mix(in srgb,var(--c) 50%,var(--line));
  box-shadow: 0 30px 52px -30px color-mix(in srgb,var(--c) 62%,transparent); }
.pf-vm:hover::after { opacity:1; }
.pf-vm-bar { position:absolute; left:0; right:0; top:0; height:3px;
  background: linear-gradient(90deg, var(--c), color-mix(in srgb,var(--c) 25%, transparent));
  transform: scaleX(0); transform-origin:left; transition: transform .45s cubic-bezier(.2,.8,.2,1); }
.pf-vm:hover .pf-vm-bar { transform: scaleX(1); }
.pf-vm-top { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:16px; }
.pf-vm-ic { width:46px; height:46px; border-radius:13px; display:grid; place-items:center; flex:none;
  color:var(--c); background: color-mix(in srgb,var(--c) 13%, var(--paper-2));
  border:1px solid color-mix(in srgb,var(--c) 24%, transparent);
  transition: transform .3s cubic-bezier(.2,.8,.2,1), background .3s ease; }
.pf-vm-ic svg { width:23px; height:23px; }
.pf-vm:hover .pf-vm-ic { transform: scale(1.08) rotate(-3deg); background: color-mix(in srgb,var(--c) 20%, var(--paper-2)); }
.pf-vm-no { font-family:'JetBrains Mono',monospace; font-size:22px; font-weight:700; letter-spacing:-0.02em;
  color: color-mix(in srgb,var(--c) 38%, var(--line)); line-height:1; }
.pf-vm-nm { font-size:19px; font-weight:800; letter-spacing:-0.015em; color:var(--ink); }
.pf-vm-tag { font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--c); margin-top:5px; }
.pf-vm-promise { font-size:21px; line-height:1.18; font-weight:700; letter-spacing:-0.02em; color:var(--ink);
  margin:16px 0 0; text-wrap:balance; }
.pf-vm-promise em { font-family:'Instrument Serif',serif; font-style:italic; font-weight:400; color:var(--c); }
.pf-vm-chips { display:flex; flex-wrap:wrap; gap:6px; margin:14px 0 18px; }
.pf-vm-chips span { font-size:11px; font-weight:600; color:var(--ink-2); padding:4px 10px; border-radius:100px;
  background: color-mix(in srgb,var(--c) 8%, var(--paper-2)); border:1px solid color-mix(in srgb,var(--c) 18%,var(--line)); }
.pf-vm-sol { display:flex; gap:9px; font-size:12.5px; line-height:1.5; color:var(--muted);
  padding-top:15px; border-top:1px dashed var(--line-2); margin-top:auto; }
.pf-vm-sol-k { font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--c); padding-top:2px; flex:none; }
.pf-vm-go { display:inline-flex; align-items:center; gap:6px; margin-top:16px;
  font-size:12px; font-weight:700; letter-spacing:.02em; color:var(--c); }
.pf-vm-go svg { width:14px; height:14px; transition: transform .25s ease; }
.pf-vm:hover .pf-vm-go svg { transform: translateX(4px); }
@media (max-width:980px){ .opr-rooms.pf-vm-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:640px){ .opr-rooms.pf-vm-grid { grid-template-columns:1fr; } }

/* Ecosystem shared-direction strip (3 cards, not per-platform) */
.eco-dir-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; max-width:1140px; margin:0 auto; }
.eco-dir { position:relative; background:var(--paper); border:1px solid var(--line); border-radius:20px; padding:38px 30px 34px; overflow:hidden; text-align:center;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.eco-dir::before { content:""; position:absolute; left:0; right:0; top:0; height:3px; background:linear-gradient(90deg,transparent,var(--c),transparent); opacity:.75; }
.eco-dir:hover { transform:translateY(-5px); border-color:color-mix(in srgb,var(--c) 45%,var(--line)); box-shadow:0 28px 50px -30px color-mix(in srgb,var(--c) 55%,transparent); }
.eco-dir-ic { width:58px; height:58px; border-radius:16px; display:grid; place-items:center; color:var(--c);
  background:color-mix(in srgb,var(--c) 13%,var(--paper-2)); border:1px solid color-mix(in srgb,var(--c) 24%,transparent); margin:0 auto 20px;
  transition:transform .3s cubic-bezier(.2,.8,.2,1); }
.eco-dir:hover .eco-dir-ic { transform:scale(1.1) rotate(-4deg); }
.eco-dir-ic svg { width:28px; height:28px; }
.eco-dir-k { font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:var(--c); margin-bottom:16px; font-weight:700; }
.eco-dir-tx { font-family:'Manrope',sans-serif; font-size:clamp(19px,1.6vw,23px); line-height:1.4; font-weight:600; letter-spacing:-0.02em; color:var(--ink); margin:0; text-wrap:balance; }
.eco-dir-tx em { font-family:'Instrument Serif',serif; font-style:italic; font-weight:400; color:var(--c); letter-spacing:-0.01em; }
@media(max-width:860px){ .eco-dir-grid{ grid-template-columns:1fr; max-width:480px; } }

/* ============== ECOSYSTEM CONVERGENCE ANIMATION ============== */
.eco-conv-band {
  margin: 0 32px 30px; max-width: 1320px; margin-left: auto; margin-right: auto;
  border-radius: 32px; padding: 44px 40px 48px; overflow: hidden; position: relative;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 26px; min-height: 0;
  background: radial-gradient(120% 110% at 50% 0%, #1a2c4f 0%, #0E2148 52%, #081230 100%);
  border: 1px solid rgba(255,255,255,0.09);
}
.eco-conv-band::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(40% 50% at 18% 12%, rgba(99,102,241,0.18), transparent 60%),
    radial-gradient(40% 50% at 84% 18%, rgba(34,211,219,0.14), transparent 60%),
    radial-gradient(50% 60% at 70% 95%, rgba(168,118,240,0.14), transparent 60%);
  z-index: 1;
}
/* world / global-network backdrop behind the animation */
.eco-worldbg { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.eco-worldbg > svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.eco-worldbg .veil { position: absolute; inset: 0;
  background: radial-gradient(52% 64% at 50% 47%, rgba(8,18,48,0.42) 0%, rgba(8,18,48,0.12) 56%, rgba(8,18,48,0) 84%); }
.wb-arc { fill: none; stroke-dasharray: 4 9; animation: ecoMarch 2.6s linear infinite; }
.wb-ico { color: #7FB3F0; animation: wbBlink 3s ease-in-out infinite; }
.wb-ico svg { overflow: visible; }
.wb-ping { transform-box: fill-box; transform-origin: center; animation: ecoPulse 3.6s ease-out infinite; }
@keyframes wbBlink { 0%,100%{ opacity:.7 } 50%{ opacity:1 } }
.eco-conv-head { text-align: center; position: relative; z-index: 3; margin-bottom: 0; }
.eco-conv-eyebrow {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: 'JetBrains Mono', monospace; font-size: 11px; letter-spacing: 0.2em;
  text-transform: uppercase; color: #9DB6E0; margin-bottom: 16px;
}
.eco-conv-eyebrow .d { width: 7px; height: 7px; border-radius: 50%; background: #5BC0FF; box-shadow: 0 0 10px #5BC0FF; animation: ecoBlink 2s infinite; }
@keyframes ecoBlink { 0%,100%{opacity:1} 50%{opacity:.25} }
.eco-conv-head h2 { font-size: clamp(28px, 3.8vw, 48px); font-weight: 700; letter-spacing: -0.03em; line-height: 1.05; color: #fff; margin: 0; }
.eco-conv-head h2 em { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; color: #7FB3F0; }
.eco-conv-sub { color: #9DB6E0; font-size: 15px; line-height: 1.55; margin: 16px auto 0; max-width: 520px; position: relative; z-index: 2; }
.eco-stage {
  display: none;
  position: absolute; inset: 0; z-index: 1;
  width: 100%; max-width: none; margin: 0;
  align-items: center; justify-content: center;
  pointer-events: none; opacity: 0.42;
  -webkit-mask-image: radial-gradient(ellipse 70% 78% at 50% 50%, #000 42%, transparent 82%);
  mask-image: radial-gradient(ellipse 70% 78% at 50% 50%, #000 42%, transparent 82%);
}
.eco-stage svg { width: 100%; height: 100%; max-width: 1100px; display: block; overflow: visible; object-fit: cover; }
/* ===== World-time digital strip (seven-segment LCD) ===== */
.top-clocks{ display:flex; align-items:center; justify-content:center; gap:18px 22px; flex-wrap:wrap; padding:9px 26px; background:#1A2440; border-bottom:1px solid #2C3A5C; }
.top-clocks .tc-k{ font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:800; letter-spacing:.14em; color:#6B7894; }
.top-clocks .eco-clock{ display:flex; align-items:center; gap:13px; background:none; border:0; padding:0; }
.top-clocks .ck-loc{ font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; letter-spacing:.1em; color:#7FB2EC; }
.top-clocks .ck-seg{ position:relative; display:inline-flex; align-items:center; }
.top-clocks .ck-ghost{ font-family:'DSEG7 Classic','JetBrains Mono',monospace; font-size:14px; letter-spacing:1px; color:rgba(120,200,160,.10); pointer-events:none; user-select:none; white-space:nowrap; }
.top-clocks .ck-t{ position:absolute; inset:0; font-family:'DSEG7 Classic','JetBrains Mono',monospace; font-size:14px; letter-spacing:1px; font-weight:400; white-space:nowrap;
  background:linear-gradient(90deg,#22C55E,#16D8C3 32%,#22C7F0 58%,#4DA8FF 82%,#22C55E 100%); background-size:200% 100%;
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
  animation:ckFlow 9s linear infinite; }
@keyframes ckFlow{ to{ background-position:-200% 0; } }
.top-clocks .ck-mer{ display:inline-flex; flex-direction:column; line-height:1; font-family:'JetBrains Mono',monospace; font-size:7px; font-weight:800; letter-spacing:.06em; gap:2px; }
.top-clocks .ck-mer i{ font-style:normal; color:rgba(120,160,200,.26); transition:color .25s ease; }
.top-clocks .ck-mer i.on{ color:#4DDB8A; }
#ecoClocks.is-24h .ck-mer{ display:none; }
.tc-fmt{ display:inline-flex; border:1px solid #3A476A; border-radius:7px; overflow:hidden; background:#243152; cursor:pointer; padding:0; }
.tc-fmt .seg{ font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:800; letter-spacing:.08em; padding:3px 8px; color:#6F7A92; transition:background .2s ease,color .2s ease; }
.tc-fmt:hover{ border-color:#39456A; }
#ecoClocks.is-24h .tc-fmt .h24, #ecoClocks.is-12h .tc-fmt .h12{ background:#1E2C4A; color:#9CD0FF; }
@media (prefers-reduced-motion: reduce){ .top-clocks .ck-t{ animation:none; } }
@media (max-width:640px){ .top-clocks{ gap:11px 14px; } .top-clocks .tc-k{ display:none; } }
/* merged CTA heading + actions over the animation */
.eco-conv-title { font-size: clamp(27px, 3.6vw, 46px); font-weight: 700; letter-spacing: -0.03em; line-height: 1.05; color: #fff; margin: 14px 0 0; text-wrap: balance; }
.eco-conv-title em { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; color: #7FB3F0; }
.eco-cta-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 24px; position: relative; z-index: 2; }
.eco-cta-actions .btn-primary { background: #fff; color: var(--brand-ink); }
.eco-cta-actions .btn-primary:hover { background: #7FB3F0; color: #fff; }
.eco-ghost-btn { display: inline-flex; align-items: center; gap: 8px; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer;
  padding: 11px 20px; border-radius: 10px; background: transparent; color: #fff; border: 1px solid rgba(255,255,255,0.3); transition: background .15s ease; }
.eco-ghost-btn:hover { background: rgba(255,255,255,0.1); }
.eco-feats { display: flex; flex-wrap: nowrap; justify-content: center; gap: 10px; margin: 22px auto 0; max-width: 920px; position: relative; z-index: 2; }
.eco-feat { display: inline-flex; align-items: center; gap: 9px; font-size: 13.5px; font-weight: 600; color: #DCE7F8;
  padding: 9px 16px; border-radius: 100px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); transition: border-color .2s ease, background .2s ease; }
.eco-feat:hover { background: rgba(255,255,255,0.09); border-color: rgba(143,201,255,0.4); }
.eco-feat .ic { display: inline-flex; color: #7FB3F0; }
.eco-feat .ic svg { width: 16px; height: 16px; }
.eco-stats { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; max-width: 820px;
  margin: 0 auto; padding-top: 0; border-top: 0; justify-content: center;
  position: relative; z-index: 2; }
.eco-stat { text-align: center; }
.eco-stat .v { font-family: 'Manrope', sans-serif; font-weight: 700; font-size: clamp(22px, 2.4vw, 30px);
  letter-spacing: -0.02em; color: #fff; font-variant-numeric: tabular-nums; line-height: 1.05; }
.eco-stat .v em { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; color: #7FB3F0; }
.eco-stat .k { font-family: 'JetBrains Mono', monospace; font-size: 9px; letter-spacing: 0.16em;
  text-transform: uppercase; color: #8FA8CE; margin-top: 7px; }
@media (max-width: 680px){ .eco-stats { grid-template-columns: repeat(3, 1fr); gap: 20px 12px; } }
.eco-ring-a { transform-origin: 500px 260px; animation: ecoSpin 64s linear infinite; }
.eco-ring-b { transform-origin: 500px 260px; animation: ecoSpin 46s linear infinite reverse; }
@keyframes ecoSpin { to { transform: rotate(360deg); } }
.eco-spoke { animation: ecoMarch 1.5s linear infinite; }
@keyframes ecoMarch { to { stroke-dashoffset: -18; } }
.eco-core-glow { animation: ecoCore 3.2s ease-in-out infinite; transform-origin: 500px 260px; }
@keyframes ecoCore { 0%,100%{opacity:.45; transform:scale(1)} 50%{opacity:.85; transform:scale(1.1)} }
.eco-halo { animation: ecoHalo 2.8s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
@keyframes ecoHalo { 0%,100%{opacity:.5; transform:scale(1)} 50%{opacity:1; transform:scale(1.35)} }
.eco-orbit { transform-origin: 500px 260px; animation: ecoSpin 24s linear infinite; }
.eco-core-ring { transform-origin: 500px 260px; animation: ecoSpin 16s linear infinite reverse; }
.eco-sweep { transform-origin: 500px 260px; animation: ecoSpin 6.5s linear infinite; }
.eco-hud { transform-origin: 500px 260px; animation: ecoSpin 80s linear infinite; }
.eco-pulse { transform-box: fill-box; transform-origin: center; animation: ecoPulse 3.6s ease-out infinite; }
@keyframes ecoPulse { 0%{ transform:scale(1); opacity:.55 } 85%{ opacity:0 } 100%{ transform:scale(3.6); opacity:0 } }
.eco-lab { font-family: 'JetBrains Mono', monospace; font-size: 19px; font-weight: 700; letter-spacing: 0.02em; fill: #DCE7F8; }
.eco-spark { animation: ecoSpark 2.6s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
@keyframes ecoSpark { 0%,100%{opacity:1; transform:scale(1)} 45%{opacity:.6; transform:scale(.86)} }
.eco-ico-spin { transform-box: fill-box; transform-origin: center; animation: ecoSpin 15s linear infinite; }
@media (prefers-reduced-motion: reduce){
  .eco-ring-a,.eco-ring-b,.eco-spoke,.eco-core-glow,.eco-halo,.eco-conv-eyebrow .d,.eco-orbit,.eco-core-ring,.eco-spark,.eco-sweep,.eco-hud,.eco-pulse,.eco-ico-spin,.wb-arc,.wb-ping,.wb-ico{ animation:none !important; }
  .eco-flow{ display:none; }
}
@media (max-width: 600px){ .eco-conv-band { margin: 0 16px 24px; padding: 40px 22px 30px; border-radius: 24px; } .eco-lab { font-size: 22px; } }

/* ============== MEGA NAV ============== */
nav.primary { display: flex; gap: 6px; align-items: center; margin-left: auto; }
.nav-item { position: relative; }
.nav-trigger {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 14px; font-weight: 500; color: var(--ink-2);
  padding: 9px 14px; border-radius: 8px;
  cursor: pointer; background: transparent; border: 0;
  font-family: inherit;
  transition: background .15s ease, color .15s ease;
}
.nav-trigger:hover, .nav-item.open > .nav-trigger {
  background: var(--paper); color: var(--ink);
}
.nav-trigger svg { width: 11px; height: 11px; opacity: 0.55; transition: transform .2s ease; }
.nav-item.open > .nav-trigger svg { transform: rotate(180deg); }

.mega-menu {
  position: absolute; top: calc(100% + 10px); left: 50%;
  transform: translateX(-50%) translateY(8px);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 22px;
  box-shadow: 0 30px 80px -30px rgba(14,33,72,0.35);
  opacity: 0; pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
  z-index: 90;
}
.nav-item.open > .mega-menu {
  opacity: 1; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.mega-menu::before {
  content: ""; position: absolute; top: -7px; left: 50%; transform: translateX(-50%) rotate(45deg);
  width: 12px; height: 12px;
  background: var(--paper); border-left: 1px solid var(--line); border-top: 1px solid var(--line);
}

/* Platform mega menu */
.mm-platform { width: 720px; }
.mm-platform-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mm-mod {
  display: flex; gap: 12px; align-items: flex-start;
  padding: 12px; border-radius: 12px;
  cursor: pointer; text-align: left;
  transition: background .15s ease;
  border: 1px solid transparent;
  background: transparent;
  font-family: inherit;
  text-decoration: none; color: inherit;
  width: 100%;
}
.mm-mod:hover { background: var(--paper-2); border-color: var(--line); }
.mm-mod .mod-ic {
  width: 36px; height: 36px; border-radius: 10px;
  background: color-mix(in srgb, var(--c) 14%, var(--paper-2));
  border: 1px solid color-mix(in srgb, var(--c) 25%, var(--line));
  color: var(--c);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.mm-mod .mod-ic svg { width: 16px; height: 16px; }
.mm-mod .mod-text { flex: 1; min-width: 0; }
.mm-mod .mod-row { display: flex; align-items: center; gap: 8px; }
.mm-mod .mod-name { font-size: 13px; font-weight: 700; letter-spacing: 0.05em; color: var(--ink); }
.mm-mod .mod-chip {
  font-size: 9px; letter-spacing: 0.1em; font-weight: 700;
  padding: 2px 6px; border-radius: 4px;
  background: color-mix(in srgb, var(--c) 14%, var(--paper));
  color: var(--c);
  border: 1px solid color-mix(in srgb, var(--c) 25%, var(--line));
}
.mm-mod .mod-desc { font-size: 12px; color: var(--muted); line-height: 1.45; margin-top: 2px; }
.mm-mod.m1 { --c: var(--pf-conventus); }
.mm-mod.m2 { --c: var(--pf-convexus); }
.mm-mod.m3 { --c: var(--pf-connectus); }
.mm-mod.m4 { --c: var(--pf-convergens); }
.mm-mod.m5 { --c: var(--pf-consultus); }
.mm-mod.m6 { --c: var(--pf-connovus); }

.mm-foot {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 14px; padding-top: 14px;
  border-top: 1px solid var(--line);
  font-size: 12px;
}
.mm-foot a {
  color: var(--brand-blue); font-weight: 700; font-size: 12px;
  display: inline-flex; align-items: center; gap: 6px;
}

/* Solutions mega menu */
.mm-solutions { width: 680px; }
.mm-sol-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.mm-sol {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 10px;
  transition: background .15s ease;
  cursor: pointer; color: var(--ink-2);
}
.mm-sol:hover { background: var(--paper-2); color: var(--ink); }
.mm-sol .sol-ic {
  width: 28px; height: 28px; border-radius: 7px;
  background: var(--paper-2); border: 1px solid var(--line);
  color: var(--brand-blue);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.mm-sol:hover .sol-ic { background: color-mix(in srgb, var(--brand-blue) 14%, var(--paper)); }
.mm-sol .sol-ic svg { width: 14px; height: 14px; }
.mm-sol .sol-name { font-size: 13px; font-weight: 600; }

/* Ecosystem / Resources / About — simpler dropdown */
.mm-list { width: 280px; }
.mm-list a, .mm-list button {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 8px;
  font-size: 13.5px; font-weight: 500; color: var(--ink-2);
  background: transparent; border: 0; cursor: pointer;
  font-family: inherit;
  width: 100%; text-align: left;
  transition: background .15s ease, color .15s ease;
}
.mm-list a:hover, .mm-list button:hover { background: var(--paper-2); color: var(--ink); }
.mm-list svg { width: 14px; height: 14px; color: var(--muted); }
.mm-list .mm-list-head {
  font-size: 10px; letter-spacing: 0.18em; font-weight: 700;
  color: var(--muted); text-transform: uppercase;
  padding: 4px 12px 8px;
}

/* Operational mode toggle (small switch) */
.op-mode {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 6px 10px 6px 6px; border-radius: 999px;
  border: 1px solid var(--line-2); background: var(--paper);
  cursor: pointer; font-family: inherit;
  transition: all .2s ease;
}
.op-mode:hover { border-color: var(--brand-blue); }
.op-mode .dot {
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--paper-2); position: relative;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--line-2);
  transition: all .25s ease;
}
.op-mode .dot::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--muted); transition: all .25s ease;
}
.op-mode .lbl {
  font-size: 10.5px; letter-spacing: 0.16em; font-weight: 700;
  color: var(--ink-2); text-transform: uppercase;
}
html[data-mode="operational"] .op-mode {
  border-color: var(--pf-convergens);
  background: color-mix(in srgb, var(--pf-convergens) 10%, var(--paper));
}
html[data-mode="operational"] .op-mode .dot {
  background: color-mix(in srgb, var(--pf-convergens) 20%, var(--paper));
  border-color: var(--pf-convergens);
}
html[data-mode="operational"] .op-mode .dot::before {
  background: var(--pf-convergens);
  box-shadow: 0 0 6px var(--pf-convergens);
}
html[data-mode="operational"] .op-mode .lbl {
  color: var(--pf-convergens);
}

/* Settings dropdown (consolidated topbar controls) */
.settings { position: relative; }
.settings-btn { width: 38px; height: 38px; border-radius: 10px; border: 1px solid var(--line); background: var(--paper); color: var(--ink-2); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
.settings-btn:hover, .settings.open .settings-btn { background: var(--paper-2); border-color: var(--line-2); color: var(--ink); }
.settings-btn svg { width: 18px; height: 18px; }
.settings-pop { position: absolute; top: calc(100% + 10px); right: 0; width: 250px; background: var(--paper); border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 24px 50px -22px rgba(15,33,72,0.35); padding: 14px; opacity: 0; pointer-events: none; transform: translateY(-6px); transition: opacity .18s ease, transform .18s ease; z-index: 95; }
.settings.open .settings-pop { opacity: 1; pointer-events: auto; transform: translateY(0); }
.settings-pop h6 { font-family: 'JetBrains Mono', monospace; font-size: 9.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); margin: 16px 0 9px; font-weight: 600; }
.settings-pop h6:first-child { margin-top: 0; }
.settings-pop .theme-seg { width: 100%; }
.settings-pop .op-mode { width: 100%; justify-content: flex-start; }
.set-langs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.set-langs button { display: flex; align-items: center; justify-content: space-between; gap: 8px; font: inherit; font-size: 13px; font-weight: 600; color: var(--ink-2); background: var(--paper-2); border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; cursor: pointer; transition: all .15s; }
.set-langs button:hover { border-color: var(--brand-blue); color: var(--ink); }
.set-langs button.on { background: color-mix(in srgb, var(--brand-blue) 12%, var(--paper)); border-color: var(--brand-blue); color: var(--brand-blue); }
.set-langs button .code { font-family: 'JetBrains Mono', monospace; font-size: 10px; opacity: .7; }
.set-toggle { display: flex; align-items: center; justify-content: space-between; font-size: 13px; font-weight: 600; color: var(--ink-2); cursor: pointer; }
.set-toggle input { width: 16px; height: 16px; cursor: pointer; accent-color: var(--brand-blue); }
html[data-theme="dark"] .settings-btn { background: var(--paper); color: var(--ink); border-color: var(--line-2); }
html[data-theme="dark"] .settings-pop { box-shadow: 0 24px 50px -22px rgba(0,0,0,0.8); }
html.motion-off [class^="eco-"], html.motion-off [class*=" eco-"], html.motion-off .wb-arc, html.motion-off .hs-pulse, html.motion-off .hk-dot { animation: none !important; }

/* Operational mode global overlay (subtle tactical grid + status pill) */
html[data-mode="operational"] body::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 2;
  background-image:
    linear-gradient(rgba(245,158,11,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(245,158,11,0.04) 1px, transparent 1px);
  background-size: 80px 80px;
  mask-image: radial-gradient(circle at center, black 0%, transparent 75%);
  -webkit-mask-image: radial-gradient(circle at center, black 0%, transparent 75%);
}
html[data-mode="operational"] body::after {
  content: "OPERATIONAL · SECURE SESSION · AUDIT ON";
  position: fixed; left: 50%; bottom: 16px; transform: translateX(-50%);
  font-size: 10px; letter-spacing: 0.24em; font-weight: 700;
  padding: 7px 14px; border-radius: 999px;
  background: rgba(245,158,11,0.12);
  color: var(--pf-convergens);
  border: 1px solid color-mix(in srgb, var(--pf-convergens) 35%, transparent);
  z-index: 10;
  backdrop-filter: blur(8px);
}

/* Hamburger button */
.hamburger {
  display: none; width: 38px; height: 38px;
  border-radius: 50%; border: 1px solid var(--line-2);
  background: var(--paper); color: var(--ink);
  align-items: center; justify-content: center;
  cursor: pointer; font-family: inherit;
}
.hamburger svg { width: 18px; height: 18px; }
.mobile-drawer {
  position: fixed; inset: 0; z-index: 200;
  background: rgba(5,12,28,0.55); backdrop-filter: blur(8px);
  display: none; opacity: 0; transition: opacity .25s ease;
}
.mobile-drawer.open { display: block; opacity: 1; }
.mobile-drawer-inner {
  position: absolute; top: 0; right: 0; bottom: 0;
  width: min(360px, 100%);
  background: var(--paper); border-left: 1px solid var(--line);
  padding: 22px 20px;
  transform: translateX(100%); transition: transform .3s cubic-bezier(.3,.9,.3,1.1);
  overflow-y: auto;
}
.mobile-drawer.open .mobile-drawer-inner { transform: translateX(0); }
.md-close {
  position: absolute; top: 14px; right: 14px;
  width: 32px; height: 32px; border-radius: 50%;
  border: 1px solid var(--line); background: var(--paper-2);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--ink-2);
}
.md-section { margin-top: 22px; }
.md-section h5 {
  font-size: 10px; letter-spacing: 0.22em; font-weight: 700;
  color: var(--muted); text-transform: uppercase;
  margin: 0 0 10px;
}
.md-section a, .md-section button {
  display: flex; align-items: center; gap: 10px;
  padding: 11px 10px; border-radius: 10px;
  font-size: 14px; font-weight: 600; color: var(--ink);
  background: transparent; border: 0; cursor: pointer;
  font-family: inherit;
  width: 100%; text-align: left;
}
.md-section a:hover, .md-section button:hover { background: var(--paper-2); }

/* ============== WORKSPACE OVERLAY ============== */
.workspace {
  position: fixed; inset: 0; z-index: 500;
  background: var(--bg);
  display: none; opacity: 0;
  transition: opacity .35s ease;
  overflow-y: auto;
}
.workspace.open { display: block; opacity: 1; }
.workspace .ws-bar {
  position: sticky; top: 0; z-index: 5;
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 28px;
  background: color-mix(in srgb, var(--bg) 80%, transparent);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
}
.ws-crumbs {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; color: var(--muted); font-weight: 600; letter-spacing: 0.05em;
}
.ws-crumbs .step {
  padding: 5px 11px; border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--paper);
  color: var(--ink-2); cursor: pointer;
  transition: all .15s ease; font-family: inherit; font-weight: 600; font-size: 12px;
}
.ws-crumbs .step.active { background: var(--pf-conventus); color: #fff; border-color: var(--pf-conventus); }
.ws-crumbs .step.done { color: var(--pf-conventus); }
.ws-crumbs .sep { color: var(--muted); }

.ws-close {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 12px; border-radius: 999px;
  border: 1px solid var(--line); background: var(--paper);
  cursor: pointer; font-family: inherit; font-size: 12px; font-weight: 600;
  color: var(--ink-2);
}
.ws-close:hover { color: var(--ink); border-color: var(--line-2); }
.ws-close svg { width: 13px; height: 13px; }

.ws-stage { padding: 28px; }
.ws-step { display: none; animation: wsIn .35s ease both; }
.ws-step.active { display: block; }
@keyframes wsIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

.ws-h1 {
  font-size: clamp(28px, 3vw, 40px); font-weight: 700; letter-spacing: -0.025em;
  margin: 0 0 6px; color: var(--ink);
}
.ws-h1 em { font-family: 'Instrument Serif'; font-style: italic; font-weight: 400; color: var(--pf-conventus); }
.ws-sub { color: var(--muted); font-size: 15px; margin-bottom: 28px; }

/* Dashboard step */
.ws-stats {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 28px;
}
.ws-stat {
  background: var(--paper); border: 1px solid var(--line);
  border-radius: 14px; padding: 18px 20px;
}
.ws-stat .ln { font-size: 11px; letter-spacing: 0.16em; color: var(--muted); text-transform: uppercase; font-weight: 700; }
.ws-stat .vn { font-size: 28px; font-weight: 700; color: var(--ink); margin-top: 4px; letter-spacing: -0.02em; }
.ws-stat .dl { font-size: 11px; color: var(--pf-connectus); margin-top: 2px; font-weight: 600; }

.ws-board {
  display: grid; grid-template-columns: 2fr 1fr; gap: 18px;
}
.ws-card {
  background: var(--paper); border: 1px solid var(--line);
  border-radius: 16px; padding: 20px;
}
.ws-card h4 {
  font-size: 14px; font-weight: 700; color: var(--ink); margin: 0 0 14px;
  letter-spacing: 0.04em; text-transform: uppercase;
}
.ws-event-row {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 0; border-bottom: 1px solid var(--line);
  font-size: 13px;
}
.ws-event-row:last-child { border-bottom: 0; }
.ws-event-row .when {
  font-family: 'JetBrains Mono'; font-size: 11px; color: var(--brand-blue);
  font-weight: 600; min-width: 84px;
}
.ws-event-row .what { color: var(--ink-2); flex: 1; }
.ws-event-row .what strong { color: var(--ink); font-weight: 700; display: block; }
.ws-event-row .what .ct { font-size: 11px; color: var(--muted); margin-top: 2px; letter-spacing: 0.05em; }
.ws-event-row .open-room {
  font-size: 11px; font-weight: 700; padding: 6px 12px;
  border-radius: 7px; background: var(--pf-conventus); color: #fff;
  border: 0; cursor: pointer; letter-spacing: 0.06em; font-family: inherit;
}

/* Rooms step */
.ws-rooms-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;
}
.ws-room-card {
  background: var(--paper); border: 1px solid var(--line);
  border-radius: 16px; padding: 20px;
  cursor: pointer; transition: all .2s ease;
  display: flex; flex-direction: column;
}
.ws-room-card:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--c) 50%, var(--line)); box-shadow: 0 18px 40px -22px color-mix(in srgb, var(--c) 45%, transparent); }
.ws-room-card .top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.ws-room-card .ic {
  width: 38px; height: 38px; border-radius: 10px;
  background: color-mix(in srgb, var(--c) 14%, var(--paper-2));
  border: 1px solid color-mix(in srgb, var(--c) 25%, var(--line));
  color: var(--c);
  display: flex; align-items: center; justify-content: center;
}
.ws-room-card .ic svg { width: 17px; height: 17px; }
.ws-room-card .live {
  font-size: 9.5px; letter-spacing: 0.14em; font-weight: 700; color: var(--c);
  display: inline-flex; align-items: center; gap: 5px;
}
.ws-room-card .live::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--c); }
.ws-room-card .nm { font-size: 15px; font-weight: 700; color: var(--ink); letter-spacing: -0.01em; margin-bottom: 4px; }
.ws-room-card .ds { font-size: 12.5px; color: var(--muted); line-height: 1.5; }
.ws-room-card .btn-row {
  display: flex; gap: 8px; margin-top: 18px;
  padding-top: 14px; border-top: 1px solid var(--line);
}
.ws-room-card .btn-row button {
  flex: 1; padding: 9px 10px; border-radius: 8px;
  font-size: 11.5px; font-weight: 700; letter-spacing: 0.04em;
  cursor: pointer; font-family: inherit;
  border: 1px solid var(--line); background: var(--paper-2); color: var(--ink-2);
  transition: all .15s ease;
}
.ws-room-card .btn-row button.primary {
  background: var(--c); color: #fff; border-color: transparent;
}
.ws-room-card .btn-row button.primary:hover { filter: brightness(1.1); }
.ws-room-card .btn-row button.ghost:hover { background: var(--paper); border-color: var(--line-2); }

.ws-room-card.r1 { --c: var(--pf-conventus); }
.ws-room-card.r2 { --c: var(--pf-convexus); }
.ws-room-card.r3 { --c: var(--pf-consultus); }
.ws-room-card.r4 { --c: var(--pf-convergens); }
.ws-room-card.r5 { --c: var(--pf-connectus); }
.ws-room-card.r6 { --c: var(--pf-connovus); }

/* Live room step - imports the existing opr mockup layout */
.ws-live-wrap {
  display: grid; grid-template-columns: 1.35fr 1fr; gap: 18px;
  align-items: start;
}

@media (max-width: 1080px) {
  nav.primary { display: none; }
  .hamburger { display: inline-flex; }
  .ws-stats { grid-template-columns: repeat(2, 1fr); }
  .ws-board { grid-template-columns: 1fr; }
  .ws-rooms-grid { grid-template-columns: repeat(2, 1fr); }
  .ws-live-wrap { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .ws-stats { grid-template-columns: 1fr 1fr; }
  .ws-rooms-grid { grid-template-columns: 1fr; }
  .ws-stage { padding: 18px; }
  .workspace .ws-bar { padding: 12px 16px; }
  .ws-crumbs { font-size: 11px; }
  .ws-crumbs .step { padding: 4px 8px; font-size: 11px; }
}

@media (max-width: 1080px) {
  .opr-stage-row { grid-template-columns: 1fr; }
  .opr-pillars { grid-template-columns: repeat(2, 1fr); }
  .opr-rooms { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .opr-stage { grid-template-columns: 1fr; }
  .opr-constellation { grid-template-columns: 1fr 1fr 1fr 1fr; }
  .opr-pillars, .opr-rooms { grid-template-columns: 1fr; }
  .opr-head-r .item.hide-sm { display: none; }
  .opr-controls .ctl-group { display: none; }
  .opr-controls .ctl-group.keep { display: inline-flex; }
}

/* ============== STATS STRIP ============== */
.stats {
  margin: 0 32px;
  background: linear-gradient(135deg, var(--paper) 0%, var(--paper-2) 100%);
  border: 1px solid var(--line); border-radius: 28px;
  padding: 36px 48px;
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 30px;
  max-width: 1320px; margin: 0 auto;
}
.stat { display: flex; flex-direction: column; gap: 4px; }
.stat-num {
  font-size: 36px; font-weight: 700; letter-spacing: -0.03em; color: var(--ink);
  font-family: 'Manrope';
}
.stat-num em { font-family: 'Instrument Serif'; font-style: italic; font-weight: 400; color: var(--brand-blue); }
.stat-lbl { font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.stat-ico {
  width: 30px; height: 30px; border-radius: 8px;
  background: color-mix(in srgb, var(--brand-blue) 12%, var(--paper));
  color: var(--brand-blue);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 8px;
}
.stat-ico svg { width: 16px; height: 16px; }

/* ============== MISSION SOLUTIONS ============== */
.solutions {
  display: grid; grid-template-columns: 1.1fr 1fr 1fr 1fr;
  gap: 16px;
}
.sol-intro {
  background: linear-gradient(160deg, var(--brand-ink) 0%, #1F3A7A 50%, var(--brand-blue) 130%);
  color: #fff; padding: 36px 32px;
  border-radius: 24px;
  display: flex; flex-direction: column; justify-content: space-between;
  position: relative; overflow: hidden;
}
.sol-intro::after {
  content: ""; position: absolute; right: -40px; bottom: -40px;
  width: 220px; height: 220px; border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--brand-sky) 30%, transparent), transparent 70%);
}
.sol-intro h3 {
  font-size: 32px; line-height: 1.05; font-weight: 700; letter-spacing: -0.025em; margin: 0;
}
.sol-intro h3 em { font-family: 'Instrument Serif'; font-style: italic; font-weight: 400; color: var(--brand-sky); }
.sol-intro p { color: rgba(255,255,255,0.75); font-size: 14px; line-height: 1.55; margin: 18px 0 24px; }
.sol-cta { font-size: 13px; font-weight: 700; color: var(--brand-sky); display: inline-flex; gap: 6px; align-items: center; letter-spacing: 0.04em;}
.sol-card {
  background: var(--paper); border: 1px solid var(--line); border-radius: 24px;
  padding: 0; overflow: hidden; position: relative;
  display: flex; flex-direction: column;
}
.sol-img {
  height: 160px;
  background-size: cover; background-position: center;
  position: relative;
}
.sol-img::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,0.45) 100%);
}
.sol-img .sol-ico {
  position: absolute; bottom: 12px; left: 12px;
  width: 36px; height: 36px; border-radius: 50%;
  background: rgba(255,255,255,0.94); color: var(--brand-ink);
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(4px);
}
.sol-img .sol-ico svg { width: 16px; height: 16px; }
.sol-body { padding: 20px 22px 24px; }
.sol-name { font-size: 16px; font-weight: 700; color: var(--ink); letter-spacing: -0.01em; }
.sol-desc { font-size: 13px; color: var(--muted); line-height: 1.5; margin-top: 6px; }

.sol-img.s1 { background-image: linear-gradient(135deg, rgba(14,33,72,0.6), rgba(42,111,219,0.3)), url("https://images.unsplash.com/photo-1577563908411-5077b6dc7624?w=600&q=80"); background-color: #1a2a55; }
.sol-img.s2 { background-image: linear-gradient(135deg, rgba(225,29,116,0.4), rgba(14,33,72,0.6)), url("https://images.unsplash.com/photo-1521791136064-7986c2920216?w=600&q=80"); background-color: #6b1e3e; }
.sol-img.s3 { background-image: linear-gradient(135deg, rgba(14,138,138,0.45), rgba(14,33,72,0.55)), url("https://images.unsplash.com/photo-1581091226825-a6a2a5aee158?w=600&q=80"); background-color: #1f4a4a; }

/* ============== CTA BANNER ============== */
.cta-band {
  margin: 0 32px; max-width: 1320px;
  margin-left: auto; margin-right: auto;
  background: linear-gradient(110deg, var(--brand-ink) 0%, #14275A 50%, #2A6FDB 130%);
  border-radius: 32px;
  padding: 56px 60px;
  color: #fff; position: relative; overflow: hidden;
}
.cta-band::before {
  content: ""; position: absolute; right: -80px; top: -80px;
  width: 360px; height: 360px; border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--brand-gold) 40%, transparent), transparent 70%);
}
.cta-band::after {
  content: ""; position: absolute; left: 40%; bottom: -120px;
  width: 300px; height: 300px; border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--pf-conventus) 30%, transparent), transparent 70%);
}
.cta-inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1.1fr 1fr; gap: 60px; align-items: center; }
.cta-band h3 { font-size: 44px; line-height: 1.05; font-weight: 700; letter-spacing: -0.025em; margin: 0; }
.cta-band h3 em { font-family: 'Instrument Serif'; font-style: italic; font-weight: 400; color: var(--brand-sky); }
.cta-band p { color: rgba(255,255,255,0.78); font-size: 16px; line-height: 1.55; margin: 18px 0 28px; max-width: 480px; }
.cta-buttons { display: flex; gap: 12px; flex-wrap: wrap; }
.cta-band .btn-primary { background: #fff; color: var(--brand-ink); }
.cta-band .btn-primary:hover { background: var(--brand-sky); color: #fff; }
.cta-band .btn-ghost { color: #fff; border-color: rgba(255,255,255,0.3); }
.cta-band .btn-ghost:hover { background: rgba(255,255,255,0.1); }

.cta-features { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.cta-feat {
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1);
  border-radius: 16px; padding: 18px;
  backdrop-filter: blur(6px);
}
.cta-feat .ico {
  width: 32px; height: 32px; border-radius: 8px;
  background: rgba(255,255,255,0.12); color: var(--brand-sky);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 10px;
}
.cta-feat .ico svg { width: 16px; height: 16px; }
.cta-feat h4 { font-size: 14px; font-weight: 700; margin: 0 0 4px; }
.cta-feat p { font-size: 12px; color: rgba(255,255,255,0.7); margin: 0; line-height: 1.5; }

/* ============== FOOTER ============== */
footer {
  margin-top: 120px;
  background: var(--paper-2);
  border-top: 1px solid var(--line);
  padding: 64px 0 28px;
}
.footer-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr 1fr; gap: 40px; }
.footer-brand { max-width: 320px; }
.footer-brand p { font-size: 13px; color: var(--muted); line-height: 1.6; margin: 20px 0 0; }
.footer-col h5 {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; font-weight: 700;
  color: var(--ink); margin: 0 0 18px;
}
.footer-col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.footer-col ul a { font-size: 13px; color: var(--muted); transition: color .2s ease; }
.footer-col ul a:hover { color: var(--brand-blue); }

.footer-bottom {
  margin-top: 56px; padding-top: 24px;
  border-top: 1px solid var(--line);
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px;
}
.footer-bottom .copy { font-size: 12px; color: var(--muted); }
.footer-bottom .links { display: flex; gap: 24px; }
.footer-bottom .links a { font-size: 12px; color: var(--muted); }
.lang-pick {
  display: inline-flex; align-items: center; gap: 6px;
  border: 1px solid var(--line); padding: 6px 12px; border-radius: 999px;
  font-size: 12px; color: var(--muted);
}

/* ============== UTIL ============== */

/* ============== MODAL ============== */
.modal-backdrop {
  position: fixed; inset: 0; z-index: 999;
  background: rgba(5,12,28,0.6);
  backdrop-filter: blur(10px);
  display: none; align-items: center; justify-content: center;
  padding: 20px;
  opacity: 0; transition: opacity .25s ease;
}
.modal-backdrop.open { display: flex; opacity: 1; }
.modal {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 20px;
  width: 100%; max-width: 520px;
  padding: 36px;
  position: relative;
  box-shadow: 0 40px 100px -20px rgba(14,33,72,0.4);
  transform: translateY(20px) scale(0.96);
  transition: transform .3s cubic-bezier(.2,.9,.3,1.2);
}
.modal-backdrop.open .modal { transform: translateY(0) scale(1); }
.modal-close {
  position: absolute; top: 16px; right: 16px;
  width: 34px; height: 34px; border-radius: 50%;
  background: var(--paper-2); border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--ink-2);
}
.modal-close:hover { background: var(--line); }
.modal-eyebrow {
  font-size: 11px; letter-spacing: 0.22em; font-weight: 700;
  color: var(--brand-blue); text-transform: uppercase; margin-bottom: 8px;
}
.modal h3 {
  font-size: 28px; font-weight: 700; letter-spacing: -0.02em;
  margin: 0 0 6px; color: var(--ink); line-height: 1.1;
}
.modal h3 em { font-family: 'Instrument Serif'; font-style: italic; font-weight: 400; color: var(--brand-blue); }
.modal-sub { font-size: 14px; color: var(--muted); margin-bottom: 22px; line-height: 1.55; }
.modal form { display: grid; gap: 12px; }
.modal-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.modal label {
  display: flex; flex-direction: column; gap: 6px;
  font-size: 12px; color: var(--ink-2); font-weight: 600; letter-spacing: 0.04em;
}
.modal input, .modal textarea, .modal select {
  font-family: inherit; font-size: 14px;
  padding: 11px 13px; border: 1px solid var(--line-2); border-radius: 10px;
  background: var(--paper-2); color: var(--ink);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.modal input:focus, .modal textarea:focus, .modal select:focus {
  outline: none; border-color: var(--brand-blue);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-blue) 16%, transparent);
}
.modal textarea { resize: vertical; min-height: 88px; font-family: inherit; }
.modal .btn-submit {
  margin-top: 6px;
  padding: 13px 18px;
  background: var(--brand-ink); color: #fff;
  border: 0; border-radius: 10px; cursor: pointer;
  font-weight: 700; font-size: 14px;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  transition: background .2s ease, transform .15s ease;
}
html[data-theme="dark"] .modal .btn-submit { background: var(--brand-blue); color: #fff; }
.modal .btn-submit:hover { background: var(--brand-blue); transform: translateY(-1px); }
.modal-success {
  text-align: center; padding: 30px 8px 6px;
}
.modal-success-ico {
  width: 64px; height: 64px; border-radius: 50%;
  background: color-mix(in srgb, var(--pf-connectus) 16%, var(--paper));
  color: var(--pf-connectus);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 18px;
  border: 1px solid color-mix(in srgb, var(--pf-connectus) 30%, var(--line));
}
.modal-success h3 { margin-bottom: 8px; }

/* ============== RESPONSIVE ============== */
/* Tablet landscape and below */
@media (max-width: 1200px) {
  .container { padding: 0 28px; }
  .section { padding: 90px 0; }
  .stats { grid-template-columns: repeat(6, 1fr); padding: 32px 36px; }
  .cta-band { padding: 48px 44px; }
}

/* Tablet portrait */
@media (max-width: 1080px) {
  .container { padding: 0 28px; }
  .section { padding: 80px 0; }

  /* Hero */
  .hero { padding: 48px 0 72px; }
  .hero-grid { grid-template-columns: 1fr !important; text-align: center; gap: 40px; }
  .hero-copy { display: flex; flex-direction: column; align-items: center; }
  .hero-lead { margin-left: auto; margin-right: auto; }
  .hero-actions { justify-content: center; }
  .hero-pillars { justify-content: center; }
  h1.hero-title { white-space: normal; }
  .hero-globe-wrap { max-width: 460px; order: -1; }

  /* Nav */
  nav.primary { gap: 18px; }
  nav.primary a { font-size: 13px; }

  /* Grids */
  .platforms { grid-template-columns: repeat(2, 1fr); }
  .featured { grid-template-columns: 1fr; }
  .solutions { grid-template-columns: 1fr 1fr; }
  .stats { grid-template-columns: repeat(3, 1fr); gap: 24px; }
  .cta-inner { grid-template-columns: 1fr; gap: 36px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 36px; }

  /* Section title */
  .section-title.section-title-hero em { font-size: clamp(40px, 6.5vw, 64px); }
  .section-eyebrow-after { white-space: normal !important; }
}

/* Small tablet / large mobile */
@media (max-width: 860px) {
  .container { padding: 0 22px; }
  .section { padding: 70px 0; }
  .section-head { margin-bottom: 44px; }

  /* Topbar */
  .topbar-inner { padding: 14px 0; }
  nav.primary { display: none; }
  .nav-actions { gap: 10px; }
  .brand-mark { width: 32px; height: 32px; }
  .brand-name { font-size: 18px; letter-spacing: 0.18em; }
  .brand-sub { font-size: 8px; }
  .btn-link { display: none; }

  /* Trust */
  .trust { padding: 22px 0; }
  .trust-inner { gap: 18px; justify-content: center; }
  .trust-label { margin-right: 0; text-align: center; flex-basis: 100%; }
  .trust-logos { gap: 14px 24px; font-size: 12px; justify-content: center; flex-wrap: wrap; }

  /* Stats */
  .stats { grid-template-columns: repeat(2, 1fr); padding: 28px 24px; margin: 0 22px; gap: 22px 18px; }
  .stat-num { font-size: 30px; }

  /* CTA band */
  .cta-band { margin: 0 22px; padding: 40px 32px; border-radius: 24px; }
  .cta-band h3 { font-size: 32px; }
  .cta-features { grid-template-columns: 1fr; }

  /* Featured cards */
  .feature-card { min-height: auto; padding: 24px; }

  /* Platform cards */
  .platform-card { padding: 22px 20px; }

  /* Footer */
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; max-width: none; }
  .footer-bottom { flex-direction: column; align-items: flex-start; gap: 14px; }

  /* Modal */
  .modal { padding: 28px 22px; max-width: 100%; }
  .modal h3 { font-size: 24px; }
  .modal-row { grid-template-columns: 1fr; }

  /* Solutions */
  .sol-intro h3 { font-size: 26px; }

  /* AI matchmaking visual */
  .ai-core { width: 90px; height: 90px; }
  .ai-core span { font-size: 11px; }

  /* Security visual */
  .sec-visual { grid-template-columns: 1fr; gap: 14px; }
  .sec-core { margin: 0 auto; }
  .sec-stack { flex-direction: row; flex-wrap: wrap; justify-content: center; }

  /* Security node text smaller */
  .sec-node { font-size: 9px; padding: 6px 8px; }
}

/* Mobile */
@media (max-width: 640px) {
  .container { padding: 0 18px; }
  .section { padding: 60px 0; }

  /* Hero */
  .hero { padding: 36px 0 56px; }
  h1.hero-title { font-size: clamp(28px, 7vw, 40px); }
  .hero-lead { font-size: 15px; margin: 20px 0 28px; }
  .hero-actions { width: 100%; flex-direction: column; }
  .hero-actions .btn { width: 100%; justify-content: center; }
  .hero-pillars { gap: 14px 18px; padding-top: 22px; }
  .pillar { font-size: 12px; gap: 8px; }
  .hero-globe-wrap { max-width: 320px; }

  /* Trust */
  .trust-logos { gap: 18px; font-size: 11px; }
  .trust-logos > div { gap: 8px; }
  .trust-logos > div span { font-size: 10px; letter-spacing: 0.08em; }
  .trust-logos > div > svg { width: 18px; height: 18px; }

  /* Section heads */
  .section-title { font-size: clamp(28px, 7vw, 40px); }
  .section-title.section-title-hero em { font-size: clamp(34px, 9vw, 52px); }
  .section-eyebrow-after { font-size: 13px !important; line-height: 1.4; }
  .section-sub { font-size: 15px; }

  /* Grids */
  .platforms, .solutions, .stats { grid-template-columns: 1fr; }
  .stats { padding: 24px 22px; margin: 0 18px; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }

  /* CTA */
  .cta-band { margin: 0 18px; padding: 32px 24px; }
  .cta-band h3 { font-size: 26px; }
  .cta-band p { font-size: 14px; }

  /* Feature card visuals smaller */
  .feature-card { padding: 22px 18px; }
  .feature-visual { padding: 14px; }
  .feature-title { font-size: 20px; }

  /* Footer bottom */
  .footer-bottom .links { flex-wrap: wrap; gap: 14px; }

  /* Modal */
  .modal { padding: 24px 18px; border-radius: 16px; }
  .modal h3 { font-size: 22px; }
  .modal-sub { font-size: 13px; }
  .modal input, .modal textarea, .modal select { font-size: 14px; }

  /* CTA features text */
  .cta-feat { padding: 16px 14px; }

  /* Sol intro */
  .sol-intro { padding: 26px 22px; }
  .sol-intro h3 { font-size: 22px; }

  /* Topbar Request Demo on phones — keep visible, compact */
  .nav-actions .btn-primary { padding: 9px 14px; font-size: 13px; }
}

/* Very small phones */
@media (max-width: 380px) {
  .container { padding: 0 14px; }
  .brand-sub { display: none; }
  .nav-actions .btn-primary { padding: 8px 12px; font-size: 12px; }
  .theme-toggle { width: 34px; height: 34px; }
}

/* ============================================================
   CONVERGENS — Clickable cards + Detail Overlay
   ============================================================ */

/* Clickable affordances on the platform/feature cards */
.platform-card-link { cursor: pointer; }
.platform-card-link:focus-visible {
  outline: 2px solid var(--pf-convergens); outline-offset: 3px;
}
.feature-card-link { cursor: pointer; position: relative; }
.feature-card-link:focus-visible {
  outline: 2px solid var(--pf-convergens); outline-offset: 3px;
}
.feature-cta {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 14px; font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--pf-convergens); font-weight: 600;
  transition: gap .2s ease;
}
.feature-card-link:hover .feature-cta { gap: 12px; }

/* ============== OVERLAY SHELL ============== */
.cvg-overlay {
  position: fixed; inset: 0; z-index: 600;
  display: none; opacity: 0;
  background: var(--bg);
  transition: opacity .35s ease;
  overflow-y: auto;
}
.cvg-overlay.open { display: block; opacity: 1; }
.cvg-overlay .cvg-bar {
  position: sticky; top: 0; z-index: 5;
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 28px;
  background: color-mix(in srgb, var(--bg) 80%, transparent);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line);
}
.cvg-bar .cvg-crumbs {
  display: flex; align-items: center; gap: 10px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.14em; color: var(--muted);
}
.cvg-bar .cvg-crumbs .badge {
  color: var(--pf-convergens); font-weight: 700; letter-spacing: 0.18em;
  padding: 4px 9px; border-radius: 4px;
  background: color-mix(in srgb, var(--pf-convergens) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--pf-convergens) 28%, transparent);
}
.cvg-bar .cvg-crumbs .sep { opacity: .4; }
.cvg-bar .cvg-tabs {
  display: flex; gap: 4px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.12em;
}
.cvg-bar .cvg-tabs a {
  padding: 7px 11px; border-radius: 6px;
  color: var(--muted); cursor: pointer; text-transform: uppercase;
  transition: background .15s ease, color .15s ease;
}
.cvg-bar .cvg-tabs a:hover { background: var(--paper-2); color: var(--ink); }
.cvg-bar .cvg-tabs a.active { color: var(--pf-convergens); background: color-mix(in srgb, var(--pf-convergens) 8%, transparent); }
.cvg-close {
  width: 38px; height: 38px; border-radius: 8px;
  border: 1px solid var(--line); background: var(--paper);
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--ink); cursor: pointer;
  transition: background .15s ease, transform .15s ease;
}
.cvg-close:hover { background: var(--paper-2); transform: rotate(90deg); }
.cvg-close svg { width: 16px; height: 16px; }

/* Container */
.cvg-wrap { max-width: 1360px; margin: 0 auto; padding: 36px 32px 80px; }

/* ============== HERO ============== */
.cvg-hero {
  position: relative;
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 56px 56px 48px;
  background:
    radial-gradient(50% 80% at 80% 20%, color-mix(in srgb, var(--pf-convergens) 18%, transparent) 0%, transparent 70%),
    radial-gradient(40% 70% at 12% 90%, color-mix(in srgb, var(--brand-blue) 12%, transparent) 0%, transparent 70%),
    var(--paper);
  overflow: hidden;
}
.cvg-hero::before {
  content: ""; position: absolute; inset: 0;
  background-image:
    linear-gradient(to right, color-mix(in srgb, var(--pf-convergens) 8%, transparent) 1px, transparent 1px),
    linear-gradient(to bottom, color-mix(in srgb, var(--pf-convergens) 8%, transparent) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(70% 70% at 50% 30%, #000 30%, transparent 90%);
  pointer-events: none; opacity: .8;
}
.cvg-hero-grid {
  position: relative; display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 48px; align-items: center;
}
.cvg-hero-eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--pf-convergens); font-weight: 700;
}
.cvg-hero-eyebrow .ic {
  width: 22px; height: 22px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--pf-convergens) 14%, transparent);
  color: var(--pf-convergens);
}
.cvg-hero-eyebrow .ic svg { width: 12px; height: 12px; }
.cvg-hero h1 {
  font-family: 'Instrument Serif', serif; font-style: italic;
  font-size: clamp(40px, 5.4vw, 76px);
  line-height: 1.02; letter-spacing: -0.02em;
  margin: 18px 0 18px; color: var(--ink); font-weight: 400;
}
.cvg-hero h1 em { font-style: normal; color: var(--pf-convergens); }
.cvg-hero-lead {
  font-size: 17px; line-height: 1.6; color: var(--ink-2);
  max-width: 560px; margin: 0 0 28px;
}
.cvg-hero-meta {
  display: flex; flex-wrap: wrap; gap: 8px;
  font-family: 'JetBrains Mono', monospace; font-size: 11px;
}
.cvg-hero-meta .pill {
  padding: 6px 10px; border-radius: 999px;
  background: var(--paper-2); border: 1px solid var(--line);
  color: var(--ink-2); letter-spacing: 0.08em;
}
.cvg-hero-meta .pill.on {
  background: color-mix(in srgb, var(--pf-convergens) 10%, var(--paper-2));
  border-color: color-mix(in srgb, var(--pf-convergens) 30%, var(--line));
  color: var(--pf-convergens);
}

/* Hero diagram (right side) */
.cvg-hero-viz {
  position: relative; aspect-ratio: 1 / 1; max-width: 460px;
  margin-left: auto;
}
.cvg-hero-viz svg { width: 100%; height: 100%; display: block; }

/* CONVENTITY core logo inside platform hero diagrams */
.cvg-core-logo { pointer-events: none; }
.cvg-core-logo path { transition: stroke .35s ease; }

/* CONVENTLAB · interactive hero diagram */
.cl-orbit { transform-box: fill-box; transform-origin: center; animation: clSpin 46s linear infinite; }
.cl-orbit.rev { animation: clSpin 34s linear infinite reverse; }
@keyframes clSpin { to { transform: rotate(360deg); } }
.cl-links { animation: clDash 1.6s linear infinite; }
@keyframes clDash { to { stroke-dashoffset: -20; } }
.cl-core-glow { transform-box: fill-box; transform-origin: center; animation: clCoreGlow 3.6s ease-in-out infinite; }
@keyframes clCoreGlow { 0%, 100% { opacity: .6; transform: scale(1); } 50% { opacity: 1; transform: scale(1.1); } }
.cl-vnode { cursor: pointer; }
.cl-vnode:focus { outline: none; }
.cl-vnode .ring { transition: r .2s ease, stroke-width .2s ease, fill .2s ease; }
.cl-vnode text {
  font-family: 'JetBrains Mono', monospace; font-size: 11px; font-weight: 700;
  letter-spacing: 1px; fill: var(--muted); pointer-events: none;
  transition: fill .2s ease;
}
.cl-vnode .pulse { transform-box: fill-box; transform-origin: center; opacity: 0; animation: clNodePulse 2.8s ease-out infinite; }
@keyframes clNodePulse { 0% { opacity: .6; transform: scale(1); } 70% { opacity: 0; } 100% { opacity: 0; transform: scale(2.6); } }
.cl-vnode:hover .ring, .cl-vnode:focus-visible .ring { r: 12; fill: var(--pf-connovus); stroke-width: 2.8; }
.cl-vnode:hover text, .cl-vnode:focus-visible text { fill: var(--ink); }
@media (prefers-reduced-motion: reduce) {
  .cl-orbit, .cl-links, .cl-core-glow, .cl-vnode .pulse { animation: none; }
}

/* ============== CONVENTUS · interactive protocol/event hero ============== */
.cn-orbit { transform-box: fill-box; transform-origin: center; animation: clSpin 50s linear infinite; }
.cn-orbit.rev { animation: clSpin 36s linear infinite reverse; }
.cn-links { animation: clDash 1.7s linear infinite; }
.cn-core-glow { transform-box: fill-box; transform-origin: center; animation: clCoreGlow 3.8s ease-in-out infinite; }
.cn-node { cursor: pointer; }
.cn-node:focus { outline: none; }
.cn-node .chip {
  fill: var(--paper); stroke: var(--pf-conventus); stroke-width: 2.2;
  transition: fill .2s ease, r .2s ease, stroke-width .2s ease;
}
.cn-node .ic { color: var(--pf-conventus); transition: color .2s ease; pointer-events: none; }
.cn-node .ic svg { display: block; }
.cn-node text {
  font-family: 'JetBrains Mono', monospace; font-size: 10.5px; font-weight: 700;
  letter-spacing: .08em; fill: var(--muted); pointer-events: none;
  transition: fill .2s ease;
}
.cn-node .pulse {
  fill: none; stroke: var(--pf-conventus); stroke-width: 1.5;
  transform-box: fill-box; transform-origin: center; opacity: 0;
  animation: cnNodePulse 3s ease-out infinite;
}
@keyframes cnNodePulse { 0% { opacity: .5; transform: scale(.7); } 70% { opacity: 0; } 100% { opacity: 0; transform: scale(1.25); } }
.cn-node:hover .chip, .cn-node:focus-visible .chip { fill: var(--pf-conventus); stroke-width: 2.6; }
.cn-node:hover .ic, .cn-node:focus-visible .ic { color: #fff; }
.cn-node:hover text, .cn-node:focus-visible text { fill: var(--ink); }
@media (prefers-reduced-motion: reduce) {
  .cn-orbit, .cn-links, .cn-core-glow, .cn-node .pulse { animation: none; }
}

/* ============== CONNECTUS · purpose-locked network ============== */
.ct-orbit { transform-box:fill-box; transform-origin:center; animation: clSpin 48s linear infinite; }
.ct-orbit.rev { animation: clSpin 34s linear infinite reverse; }
.ct-links { animation: clDash 1.7s linear infinite; }
.ct-core-glow { transform-box:fill-box; transform-origin:center; animation: clCoreGlow 3.8s ease-in-out infinite; }
.ct-node { cursor:pointer; }
.ct-node:focus { outline:none; }
.ct-node .ring { transition:r .2s ease, fill .2s ease, stroke-width .2s ease; }
.ct-node text { font-family:'JetBrains Mono',monospace; font-size:10.5px; font-weight:700; letter-spacing:.08em; fill:var(--muted); pointer-events:none; transition:fill .2s ease; }
.ct-node .pulse { transform-box:fill-box; transform-origin:center; opacity:0; animation:cnNodePulse 2.9s ease-out infinite; }
.ct-node:hover .ring, .ct-node:focus-visible .ring { r:12; fill:var(--pf-connectus); stroke-width:2.8; }
.ct-node:hover text, .ct-node:focus-visible text { fill:var(--ink); }
.ct-pdot { fill:var(--pf-connectus); }

/* profile cards */
.ct-people { display:grid; grid-template-columns:repeat(auto-fill, minmax(280px,1fr)); gap:14px; }
.ct-person { border:1px solid var(--line); border-radius:15px; background:var(--paper); padding:16px; display:flex; flex-direction:column; gap:0; transition:border-color .15s ease, box-shadow .15s ease; }
.ct-person:hover { border-color:color-mix(in srgb,var(--pf-connectus) 40%,var(--line)); box-shadow:0 10px 24px -16px color-mix(in srgb,var(--pf-connectus) 80%,transparent); }
.ct-person .top { display:flex; gap:12px; align-items:flex-start; }
.ct-ava { width:46px; height:46px; border-radius:13px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:15px; color:#fff; }
.ct-person .who { flex:1; min-width:0; }
.ct-person .nm { font-size:15px; font-weight:800; letter-spacing:-.01em; color:var(--ink); }
.ct-person .rl { font-size:12.5px; color:var(--ink-2); margin-top:1px; }
.ct-person .org { font-size:11.5px; color:var(--muted); margin-top:2px; }
.ct-src { font-family:'JetBrains Mono',monospace; font-size:8.5px; font-weight:700; letter-spacing:.05em; padding:2px 7px; border-radius:999px; color:var(--pf-connectus); background:color-mix(in srgb,var(--pf-connectus) 13%,transparent); white-space:nowrap; align-self:flex-start; }
.ct-prov { display:flex; flex-wrap:wrap; gap:6px; margin:12px 0; padding:9px 0; border-top:1px dashed var(--line); border-bottom:1px dashed var(--line); }
.ct-prov .pb { display:inline-flex; align-items:center; gap:5px; font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; color:var(--ink-2); }
.ct-prov .pb svg { width:13px; height:13px; color:var(--pf-connectus); stroke-width:1.9; }
.ct-tags { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:13px; }
.ct-tag { font-size:11px; font-weight:600; padding:3px 9px; border-radius:999px; background:var(--paper-2); border:1px solid var(--line); color:var(--ink-2); }
.ct-person .ft { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; }
.ct-vis { font-size:11px; color:var(--muted); display:inline-flex; align-items:center; gap:5px; }
.ct-vis svg { width:13px; height:13px; stroke-width:1.9; }
.ct-connect { font:inherit; font-size:12px; font-weight:700; padding:7px 14px; border-radius:9px; border:1px solid var(--pf-connectus); background:transparent; color:var(--pf-connectus); cursor:pointer; transition:background .15s ease, color .15s ease; }
.ct-connect:hover { background:color-mix(in srgb,var(--pf-connectus) 10%,transparent); }
.ct-connect.on { background:var(--pf-connectus); color:#fff; }

/* feed (algorithm-free) */
.ct-feed { display:flex; flex-direction:column; gap:10px; }
.ct-post { border:1px solid var(--line); border-radius:13px; background:var(--paper); padding:13px 15px; }
.ct-post .ph { display:flex; align-items:center; gap:10px; }
.ct-post .pa { width:32px; height:32px; border-radius:9px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:11px; color:#fff; }
.ct-post .pi { flex:1; min-width:0; }
.ct-post .pn { font-size:13px; font-weight:700; color:var(--ink); }
.ct-post .pm { font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--muted); }
.ct-post .pt { font-size:13px; line-height:1.5; color:var(--ink-2); margin:9px 0 0; }
.ct-why { display:inline-flex; align-items:center; gap:6px; margin-top:10px; font-size:10.5px; color:var(--muted); background:var(--paper-2); border:1px solid var(--line); border-radius:999px; padding:3px 10px; }
.ct-why b { color:var(--pf-connectus); font-weight:700; }
.ct-side-card { border:1px solid var(--line); border-radius:14px; background:var(--paper); padding:15px; margin-bottom:14px; }
.ct-side-card h5 { margin:0 0 10px; font-size:13px; font-weight:800; color:var(--ink); }
.ct-grp { display:flex; flex-direction:column; gap:7px; }
.ct-grp button { display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%; text-align:left; font:inherit; font-size:12.5px; font-weight:600; color:var(--ink); padding:8px 11px; border:1px solid var(--line); border-radius:10px; background:var(--paper); cursor:pointer; transition:border-color .14s ease, background .14s ease; }
.ct-grp button:hover { border-color:color-mix(in srgb,var(--pf-connectus) 45%,var(--line)); }
.ct-grp button.joined { background:color-mix(in srgb,var(--pf-connectus) 10%,var(--paper)); border-color:color-mix(in srgb,var(--pf-connectus) 40%,var(--line)); }
.ct-grp .cnt { font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--muted); }
.ct-grp button.joined .cnt { color:var(--pf-connectus); }

/* discovery + matching */
.ct-search { display:flex; align-items:center; gap:9px; padding:11px 15px; border:1px solid var(--line); border-radius:12px; background:var(--paper); margin-bottom:12px; }
.ct-search svg { width:17px; height:17px; color:var(--muted); stroke-width:2; flex:0 0 auto; }
.ct-search input { flex:1; border:0; background:transparent; outline:none; font:inherit; font-size:14px; color:var(--ink); }
.ct-fchips { display:flex; gap:7px; flex-wrap:wrap; margin-bottom:14px; }
.ct-fchip { font-size:12px; font-weight:700; padding:6px 13px; border-radius:999px; border:1px solid var(--line); background:var(--paper); color:var(--ink-2); cursor:pointer; }
.ct-fchip.active { background:var(--pf-connectus); color:#fff; border-color:transparent; }
.ct-matches { display:flex; flex-direction:column; gap:10px; }
.ct-match { display:flex; gap:13px; align-items:center; border:1px solid var(--line); border-left:3px solid var(--pf-connectus); border-radius:13px; background:var(--paper); padding:13px 15px; }
.ct-match .pa { width:42px; height:42px; border-radius:12px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:14px; color:#fff; }
.ct-match .mi { flex:1; min-width:0; }
.ct-match .mn { font-size:14px; font-weight:800; color:var(--ink); }
.ct-match .mr { font-size:12px; color:var(--ink-2); margin-top:2px; }
.ct-match .mr b { color:var(--pf-connectus); font-weight:700; }
.ct-match .acts { display:flex; gap:7px; flex:0 0 auto; }
.ct-match .acts .dismiss { font:inherit; font-size:12px; font-weight:700; padding:7px 12px; border-radius:9px; border:1px solid var(--line); background:transparent; color:var(--muted); cursor:pointer; }
.ct-empty { font-size:13px; color:var(--muted); padding:18px 4px; text-align:center; }

/* principles · built vs refused */
.ct-principles { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.ct-prin { border:1px solid var(--line); border-radius:16px; padding:18px; background:var(--paper); }
.ct-prin.built { background:color-mix(in srgb,var(--pf-connectus) 6%,var(--paper)); border-color:color-mix(in srgb,var(--pf-connectus) 26%,var(--line)); }
.ct-prin h4 { margin:0 0 13px; font-size:14px; font-weight:800; display:flex; align-items:center; gap:8px; }
.ct-prin h4 .ic { width:24px; height:24px; border-radius:7px; display:flex; align-items:center; justify-content:center; }
.ct-prin h4 .ic svg { width:15px; height:15px; stroke-width:2.4; }
.ct-prin.built h4 .ic { background:color-mix(in srgb,var(--pf-connectus) 16%,transparent); color:var(--pf-connectus); }
.ct-prin.refused h4 .ic { background:color-mix(in srgb,#E5484D 14%,transparent); color:#E5484D; }
.ct-prin ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; }
.ct-prin li { display:flex; align-items:flex-start; gap:9px; font-size:13px; line-height:1.4; color:var(--ink-2); }
.ct-prin li svg { width:15px; height:15px; flex:0 0 auto; margin-top:1px; stroke-width:2.4; }
.ct-prin.built li svg { color:var(--pf-connectus); }
.ct-prin.refused li svg { color:#E5484D; }
.ct-prin.refused li { text-decoration:line-through; text-decoration-color:color-mix(in srgb,#E5484D 50%,transparent); }

@media (max-width: 820px) { .ct-principles { grid-template-columns:1fr; } }

/* ============== CONVENTUS · Innovation Continuum timeline ============== */
.cn-tl { border: 1px solid var(--line); border-radius: 20px; background: var(--paper); overflow: hidden; position: relative; }
.cn-tl::before { content:""; position:absolute; inset:0 0 auto 0; height:160px; background: radial-gradient(120% 100% at 12% 0%, color-mix(in srgb, var(--pf-conventus) 13%, transparent), transparent 68%); pointer-events:none; }
.cn-tl-head { position:relative; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 22px; border-bottom:1px solid var(--line); flex-wrap:wrap; }
.cn-tl-brand { display:flex; align-items:center; gap:12px; }
.cn-tl-logo { width:38px; height:38px; flex:0 0 auto; }
.cn-tl-logo svg { width:100%; height:100%; display:block; }
.cn-tl-brand-tx { display:flex; flex-direction:column; line-height:1.18; }
.cn-tl-brand-tx .t { font-weight:800; font-size:17px; letter-spacing:-.01em; color:var(--ink); }
.cn-tl-brand-tx .s { font-size:12px; color:var(--muted); }
.cn-tl-filters { display:flex; gap:7px; flex-wrap:wrap; }
.cn-tl-filt { display:inline-flex; align-items:center; gap:7px; font-size:11.5px; font-weight:700; padding:6px 12px; border-radius:999px; border:1px solid var(--line); background:var(--paper); color:var(--ink-2); cursor:pointer; transition:opacity .15s ease, border-color .15s ease; }
.cn-tl-filt .d { width:8px; height:8px; border-radius:50%; background:var(--cc); flex:0 0 auto; }
.cn-tl-filt.off { opacity:.38; }
.cn-tl-filt:hover { border-color:var(--line-2); }

/* year-at-a-glance bar */
.cn-tl-year { position:relative; height:98px; border-bottom:1px solid var(--line); background:var(--paper-2); }
.cn-tl-track { position:absolute; left:36px; right:36px; top:0; bottom:0; }
.cn-tl-line { position:absolute; left:0; right:0; top:52%; height:3px; border-radius:3px; background:linear-gradient(90deg, color-mix(in srgb,var(--pf-conventus) 8%,transparent), var(--pf-conventus) 50%, color-mix(in srgb,var(--pf-conventus) 8%,transparent)); box-shadow:0 0 14px color-mix(in srgb,var(--pf-conventus) 45%,transparent); }
.cn-tl-mtick { position:absolute; top:calc(52% - 5px); width:1px; height:10px; background:var(--line-2); transform:translateX(-50%); }
.cn-tl-mlbl { position:absolute; top:calc(52% + 11px); font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; color:var(--muted); transform:translateX(-50%); letter-spacing:.04em; }
.cn-tl-dot { position:absolute; top:52%; transform:translate(-50%,-50%); width:13px; height:13px; border-radius:50%; background:var(--cc); border:2.5px solid var(--paper); cursor:pointer; box-shadow:0 1px 5px rgba(0,0,0,.22); transition:transform .15s ease, box-shadow .15s ease; z-index:2; }
html[data-theme="dark"] .cn-tl-dot { border-color:var(--paper-2); }
.cn-tl-dot:hover, .cn-tl-dot.active { transform:translate(-50%,-50%) scale(1.55); box-shadow:0 0 0 5px color-mix(in srgb, var(--cc) 24%, transparent); z-index:4; }
.cn-tl-now { position:absolute; top:16px; bottom:26px; width:2px; background:var(--brand-gold); transform:translateX(-50%); z-index:3; }
.cn-tl-now::before { content:""; position:absolute; top:-4px; left:50%; transform:translateX(-50%); width:9px; height:9px; border-radius:50%; background:var(--brand-gold); box-shadow:0 0 0 4px color-mix(in srgb,var(--brand-gold) 22%,transparent); }
.cn-tl-now::after { content:"TODAY"; position:absolute; top:-20px; left:50%; transform:translateX(-50%); font-family:'JetBrains Mono',monospace; font-size:8px; font-weight:700; letter-spacing:.12em; color:var(--brand-gold); white-space:nowrap; }

/* vertical continuum */
.cn-tl-stream { position:relative; padding:4px 0 18px; }
.cn-tl-qhead { display:flex; align-items:center; gap:12px; padding:18px 26px 8px; }
.cn-tl-qhead .q { font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:800; letter-spacing:.12em; color:var(--pf-conventus); }
html[data-theme="dark"] .cn-tl-qhead .q { color:var(--brand-sky); }
.cn-tl-qhead .ln { flex:1; height:1px; background:var(--line); }
.cn-tl-qhead .cnt { font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--muted); }
.cn-tl-row { display:grid; grid-template-columns:104px 34px 1fr; align-items:start; padding:6px 26px; position:relative; }
.cn-tl-date { text-align:right; padding:11px 14px 0 0; }
.cn-tl-date .dd { font-size:15px; font-weight:800; color:var(--ink); line-height:1; }
.cn-tl-date .mo { font-family:'JetBrains Mono',monospace; font-size:10px; color:var(--muted); margin-top:3px; letter-spacing:.03em; }
.cn-tl-node { position:relative; display:flex; justify-content:center; }
.cn-tl-node::before { content:""; position:absolute; top:14px; bottom:-12px; left:50%; width:2px; background:var(--line); transform:translateX(-50%); }
.cn-tl-row.last .cn-tl-node::before { display:none; }
.cn-tl-node .dot { width:15px; height:15px; border-radius:50%; background:var(--paper); border:3px solid var(--cc); margin-top:11px; z-index:1; box-shadow:0 0 0 4px color-mix(in srgb,var(--cc) 15%,var(--paper)); }
.cn-tl-card { background:var(--paper); border:1px solid var(--line); border-left:3px solid var(--cc); border-radius:13px; padding:13px 15px; cursor:pointer; transition:box-shadow .16s ease, border-color .16s ease, transform .16s ease; }
.cn-tl-card:hover { box-shadow:0 12px 26px -16px color-mix(in srgb,var(--cc) 80%,transparent); transform:translateY(-1px); }
.cn-tl-card.open { box-shadow:0 14px 30px -16px color-mix(in srgb,var(--cc) 80%,transparent); }
.cn-tl-ctop { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.cn-tl-nm { font-size:15.5px; font-weight:800; letter-spacing:-.01em; color:var(--ink); }
.cn-tl-cat { display:inline-flex; align-items:center; gap:6px; font-family:'JetBrains Mono',monospace; font-size:9px; font-weight:700; letter-spacing:.05em; padding:3px 8px; border-radius:999px; text-transform:uppercase; white-space:nowrap; color:var(--cc); background:color-mix(in srgb,var(--cc) 14%,transparent); }
.cn-tl-meta { display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:6px; font-size:12px; color:var(--muted); }
.cn-tl-meta .it { display:inline-flex; align-items:center; gap:5px; }
.cn-tl-meta svg { width:13px; height:13px; stroke-width:1.9; }
.cn-tl-tbc { font-family:'JetBrains Mono',monospace; font-size:8.5px; font-weight:700; letter-spacing:.05em; padding:1px 6px; border-radius:4px; color:var(--muted); background:color-mix(in srgb,var(--muted) 16%,transparent); }
.cn-tl-desc { font-size:12.5px; line-height:1.5; color:var(--ink-2); margin-top:0; max-height:0; overflow:hidden; opacity:0; transition:max-height .3s ease, opacity .25s ease, margin-top .3s ease; }
.cn-tl-card.open .cn-tl-desc { max-height:160px; opacity:1; margin-top:10px; }
.cn-tl-acts { display:flex; gap:8px; margin-top:0; max-height:0; overflow:hidden; opacity:0; transition:max-height .3s ease, opacity .25s ease, margin-top .3s ease; }
.cn-tl-card.open .cn-tl-acts { max-height:60px; opacity:1; margin-top:11px; }
.cn-tl-track-btn { font:inherit; font-size:12px; font-weight:700; padding:6px 13px; border-radius:9px; border:1px solid var(--line); background:var(--paper); color:var(--ink); cursor:pointer; display:inline-flex; align-items:center; gap:6px; }
.cn-tl-track-btn svg { width:13px; height:13px; stroke-width:2.4; }
.cn-tl-track-btn.on { background:var(--pf-conventus); color:#fff; border-color:transparent; }
.cn-tl-today-row { display:flex; align-items:center; gap:11px; padding:8px 26px; }
.cn-tl-today-row .dot { width:11px; height:11px; border-radius:50%; background:var(--brand-gold); margin-left:118px; flex:0 0 auto; box-shadow:0 0 0 4px color-mix(in srgb,var(--brand-gold) 20%,var(--paper)); }
.cn-tl-today-row .lb { font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:800; letter-spacing:.1em; color:var(--brand-gold); }
.cn-tl-today-row .ln { flex:1; height:1px; background:color-mix(in srgb,var(--brand-gold) 35%,var(--line)); }

@media (max-width: 720px) {
  .cn-tl-row { grid-template-columns:60px 28px 1fr; padding:6px 16px; }
  .cn-tl-date .dd { font-size:13px; }
  .cn-tl-date { padding-right:8px; }
  .cn-tl-today-row .dot { margin-left:72px; }
}

/* ============== CONVENTLAB · Logic Chain TTX section ============== */
.cl-chain { display: grid; gap: 16px; margin-top: 4px; }
.cl-chain-rail { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.cl-node {
  display: flex; align-items: center; gap: 9px;
  padding: 9px 13px 9px 11px; border-radius: 12px; cursor: pointer;
  background: var(--paper-2); border: 1px solid var(--line); color: var(--ink);
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}
.cl-node:hover { border-color: color-mix(in srgb, var(--pf-connovus) 45%, var(--line)); transform: translateY(-1px); }
.cl-node:focus-visible { outline: 2px solid var(--pf-connovus); outline-offset: 2px; }
.cl-node-dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.cl-node-n { font-family: 'JetBrains Mono', monospace; font-size: 10px; font-weight: 700; color: var(--muted); letter-spacing: .04em; }
.cl-node-nm { font-size: 13px; font-weight: 700; letter-spacing: -0.01em; white-space: nowrap; }
.cl-node.active {
  background: color-mix(in srgb, var(--pf-connovus) 12%, var(--paper));
  border-color: var(--pf-connovus);
  box-shadow: 0 8px 20px -12px color-mix(in srgb, var(--pf-connovus) 80%, transparent);
}
html[data-theme="dark"] .cl-node.active { background: color-mix(in srgb, var(--pf-connovus) 22%, var(--paper-2)); }
.cl-node.active .cl-node-n { color: var(--pf-connovus); }
.cl-arrow { color: var(--muted); opacity: .5; flex: 0 0 auto; display: flex; }
.cl-arrow svg { width: 13px; height: 13px; }

.s-live { background: #16A34A; }
.s-pilot { background: #EAB308; }
.s-gap { background: #EF4444; }

/* detail panel */
.cl-chain-detail { border: 1px solid var(--line); border-radius: 16px; background: var(--paper); padding: 20px; }
.cl-detail-head { display: flex; align-items: baseline; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.cl-detail-n { font-family: 'JetBrains Mono', monospace; font-size: 13px; font-weight: 700; color: var(--pf-connovus); }
.cl-detail-nm { font-size: 22px; font-weight: 800; letter-spacing: -0.02em; color: var(--ink); }
.cl-detail-flow { font-family: 'JetBrains Mono', monospace; font-size: 10.5px; color: var(--muted); letter-spacing: .04em; margin-left: auto; }
.cl-lenses { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.cl-lens { border: 1px solid var(--line); border-radius: 13px; background: var(--paper-2); padding: 14px; }
.cl-lens-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 11px; }
.cl-lens-title { font-family: 'JetBrains Mono', monospace; font-size: 10.5px; font-weight: 700; letter-spacing: .08em; color: var(--ink); }
.cl-lens-chip { display: inline-flex; align-items: center; gap: 5px; font-family: 'JetBrains Mono', monospace; font-size: 9px; font-weight: 700; letter-spacing: .06em; padding: 2px 7px; border-radius: 999px; text-transform: uppercase; }
.cl-lens-chip .d { width: 6px; height: 6px; border-radius: 50%; }
.cl-lens-chip.live { color: #16A34A; background: color-mix(in srgb, #16A34A 14%, transparent); }
.cl-lens-chip.pilot { color: #B7860B; background: color-mix(in srgb, #EAB308 18%, transparent); }
.cl-lens-chip.gap { color: #DC2626; background: color-mix(in srgb, #EF4444 14%, transparent); }
.cl-kv { display: flex; flex-direction: column; gap: 1px; padding: 7px 0; border-top: 1px dashed var(--line); }
.cl-kv:first-of-type { border-top: none; padding-top: 0; }
.cl-kv-k { font-family: 'JetBrains Mono', monospace; font-size: 9.5px; font-weight: 700; letter-spacing: .04em; color: var(--muted); text-transform: uppercase; }
.cl-kv-v { font-size: 12.5px; line-height: 1.4; color: var(--ink); }
.cl-fm { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 14px; }
.cl-fm-card { border-radius: 12px; padding: 12px 14px; border: 1px solid var(--line); }
.cl-fm-card.fr { background: color-mix(in srgb, #EF4444 7%, var(--paper-2)); border-color: color-mix(in srgb, #EF4444 28%, var(--line)); }
.cl-fm-card.mi { background: color-mix(in srgb, #16A34A 7%, var(--paper-2)); border-color: color-mix(in srgb, #16A34A 28%, var(--line)); }
.cl-fm-k { display: flex; align-items: center; gap: 6px; font-family: 'JetBrains Mono', monospace; font-size: 9.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 5px; }
.cl-fm-card.fr .cl-fm-k { color: #DC2626; }
.cl-fm-card.mi .cl-fm-k { color: #16A34A; }
.cl-fm-k svg { width: 13px; height: 13px; }
.cl-fm-v { font-size: 12.5px; line-height: 1.45; color: var(--ink); }

/* heatmap */
.cl-heat-block { margin-top: 22px; }
.cl-heat-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.cl-heat-ttl { font-size: 15px; font-weight: 700; letter-spacing: -0.01em; color: var(--ink); }
.cl-heat-sub { font-family: 'JetBrains Mono', monospace; font-size: 10.5px; font-weight: 500; color: var(--muted); letter-spacing: .02em; }
.cl-heat-legend { display: flex; gap: 14px; }
.cl-heat-legend span { display: inline-flex; align-items: center; gap: 6px; font-family: 'JetBrains Mono', monospace; font-size: 10px; color: var(--muted); letter-spacing: .03em; }
.cl-heat-legend .lv { width: 11px; height: 11px; border-radius: 3px; }
.cl-heat-legend .lv.live { background: #16A34A; }
.cl-heat-legend .lv.pilot { background: #EAB308; }
.cl-heat-legend .lv.gap { background: #EF4444; }
.cl-heat { display: grid; grid-template-columns: 150px repeat(3, 1fr); gap: 5px; }
.cl-heat-hcell { font-family: 'JetBrains Mono', monospace; font-size: 9.5px; font-weight: 700; letter-spacing: .07em; color: var(--muted); text-transform: uppercase; padding: 4px 2px; align-self: center; }
.cl-heat-hcell.center { text-align: center; }
.cl-heat-rowlbl {
  display: flex; align-items: center; gap: 8px; padding: 0 4px;
  font-size: 12px; font-weight: 600; color: var(--ink); cursor: pointer;
}
.cl-heat-rowlbl .rn { font-family: 'JetBrains Mono', monospace; font-size: 9.5px; color: var(--muted); }
.cl-heat-rowlbl:hover { color: var(--pf-connovus); }
.cl-heat-cell {
  height: 34px; border-radius: 7px; cursor: pointer; position: relative;
  border: 1px solid transparent; transition: transform .14s ease, box-shadow .14s ease, outline-color .14s ease;
  outline: 2px solid transparent; outline-offset: 1px;
}
.cl-heat-cell:hover { transform: scale(1.04); box-shadow: 0 4px 12px -4px rgba(0,0,0,.25); z-index: 2; }
.cl-heat-cell.live { background: color-mix(in srgb, #16A34A 78%, var(--paper)); }
.cl-heat-cell.pilot { background: color-mix(in srgb, #EAB308 72%, var(--paper)); }
.cl-heat-cell.gap { background: color-mix(in srgb, #EF4444 74%, var(--paper)); }
.cl-heat-row.sel .cl-heat-cell { outline-color: var(--pf-connovus); }
.cl-heat-row.sel .cl-heat-rowlbl { color: var(--pf-connovus); }
.cl-heat-row { display: contents; }

@media (max-width: 720px) {
  .cl-lenses { grid-template-columns: 1fr; }
  .cl-fm { grid-template-columns: 1fr; }
  .cl-heat { grid-template-columns: 110px repeat(3, 1fr); }
}

/* ============== SECTION HEADERS ============== */
.cvg-section { margin-top: 64px; }
.cvg-section-head {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 24px; margin-bottom: 28px; padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}
.cvg-section-head .left { max-width: 720px; }
.cvg-section-head .num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; color: var(--pf-convergens); letter-spacing: 0.22em;
  font-weight: 700; margin-bottom: 8px;
}
.cvg-section-head h2 {
  font-family: 'Instrument Serif', serif; font-style: italic;
  font-size: clamp(28px, 3.2vw, 44px); margin: 0 0 8px;
  letter-spacing: -0.02em; font-weight: 400; color: var(--ink);
}
.cvg-section-head p { color: var(--muted); margin: 0; font-size: 15px; line-height: 1.55; }
.cvg-section-head .right {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.12em;
  color: var(--muted); text-align: right;
}

/* ============== POSITIONING (is / is not) ============== */
.cvg-posi {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 18px; margin-top: 26px;
}
.cvg-posi-card {
  border: 1px solid var(--line); border-radius: 16px;
  background: var(--paper); padding: 24px 26px;
}
.cvg-posi-card .lbl {
  font-family: 'JetBrains Mono', monospace; font-size: 11px;
  letter-spacing: 0.18em; font-weight: 700;
  margin-bottom: 14px; display: inline-flex; align-items: center; gap: 8px;
}
.cvg-posi-card.is .lbl { color: var(--pf-convergens); }
.cvg-posi-card.is-not .lbl { color: var(--muted); }
.cvg-posi-card ul {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 10px;
}
.cvg-posi-card li {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 14px; line-height: 1.5; color: var(--ink-2);
}
.cvg-posi-card li::before {
  content: ""; flex-shrink: 0; margin-top: 8px;
  width: 6px; height: 6px; border-radius: 50%;
}
.cvg-posi-card.is li::before { background: var(--pf-convergens); }
.cvg-posi-card.is-not li::before {
  background: transparent; border: 1px solid var(--muted);
  width: 7px; height: 7px; position: relative;
}
.cvg-posi-card.is-not li::after {
  content: ""; position: absolute; margin-left: -10px; margin-top: 11px;
  width: 8px; height: 1px; background: var(--muted); transform: rotate(45deg);
}

/* ============== CIMIC ANALYTICAL LAYERS ============== */
.cvg-layers {
  display: grid; grid-template-columns: repeat(5, 1fr);
  gap: 14px;
}
.cvg-layer {
  --c: var(--pf-convergens);
  position: relative; cursor: pointer;
  border: 0; background: transparent; padding: 0; margin: 0;
  border-radius: 14px; min-height: 296px;
  transition: transform .18s ease;
  text-align: left; font: inherit; color: inherit;
}
.cvg-layer:hover { transform: translateY(-3px); }
.cvg-layer .flip-inner {
  display: block; position: relative; width: 100%; height: 100%; min-height: 296px;
}
.cvg-layer .face {
  position: absolute; inset: 0;
  border: 1px solid var(--line); border-radius: 14px;
  background: var(--paper); padding: 20px 18px;
  display: flex; flex-direction: column; overflow: hidden;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  transition: opacity .34s ease, transform .42s cubic-bezier(.2,.7,.2,1), border-color .18s ease, box-shadow .18s ease;
  will-change: opacity, transform;
}
.cvg-layer .face.front { opacity: 1; transform: none; z-index: 2; }
.cvg-layer .face.back {
  opacity: 0; transform: translateY(12px) scale(.985); z-index: 1; pointer-events: none;
  border-color: color-mix(in srgb, var(--c) 45%, var(--line));
  background: linear-gradient(168deg, color-mix(in srgb, var(--c) 9%, var(--paper)), var(--paper));
}
.cvg-layer:hover .face.front,
.cvg-layer:focus-visible .face.front {
  opacity: 0; transform: translateY(-10px) scale(.99); pointer-events: none;
}
.cvg-layer:hover .face.back,
.cvg-layer:focus-visible .face.back {
  opacity: 1; transform: none; z-index: 3; pointer-events: auto;
}
.cvg-layer.active .face.front {
  border-color: var(--c);
  box-shadow: 0 0 0 1px var(--c), 0 14px 40px -20px color-mix(in srgb, var(--c) 60%, transparent);
}
.cvg-layer:hover .face.front { border-color: color-mix(in srgb, var(--c) 40%, var(--line)); }
/* back-face list */
.cvg-layer .bk-h { display: flex; align-items: baseline; gap: 8px; margin-bottom: 14px; }
.cvg-layer .bk-ix {
  font-family: 'JetBrains Mono', monospace; font-size: 9.5px; letter-spacing: 0.16em;
  font-weight: 700; color: var(--c);
}
.cvg-layer .bk-ttl { font-size: 13px; font-weight: 800; color: var(--ink); letter-spacing: -0.01em; }
.cvg-layer .bk-n {
  margin-left: auto; font-family: 'JetBrains Mono', monospace; font-size: 9px;
  letter-spacing: 0.08em; color: var(--muted); text-transform: uppercase;
}
.cvg-layer .bk-list {
  list-style: none; margin: 0; padding: 0; counter-reset: bk;
  display: flex; flex-direction: column; gap: 6px; align-content: start;
}
.cvg-layer .bk-list li {
  counter-increment: bk; position: relative; padding-left: 21px;
  font-size: 11px; line-height: 1.25; color: var(--ink-2); font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cvg-layer .bk-list li::before {
  content: counter(bk, decimal-leading-zero); position: absolute; left: 0; top: 0;
  font-family: 'JetBrains Mono', monospace; font-size: 9px; font-weight: 700; color: var(--c);
}
.cvg-layer .ix {
  font-family: 'JetBrains Mono', monospace; font-size: 10px;
  color: var(--muted); letter-spacing: 0.18em; font-weight: 600;
}
.cvg-layer h4 {
  font-size: 18px; font-weight: 700; letter-spacing: -0.01em;
  margin: 10px 0 6px; color: var(--ink);
}
.cvg-layer .tag {
  font-family: 'JetBrains Mono', monospace; font-size: 10px;
  letter-spacing: 0.12em; color: var(--c); text-transform: uppercase;
  font-weight: 700;
}
.cvg-layer .desc {
  font-size: 13px; line-height: 1.5; color: var(--ink-2);
  margin: 12px 0 14px;
}
.cvg-layer ul.sub {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 5px;
  font-size: 12px; color: var(--muted);
}
.cvg-layer ul.sub li {
  display: flex; align-items: center; gap: 7px;
}
.cvg-layer ul.sub li::before {
  content: ""; width: 4px; height: 4px; border-radius: 50%;
  background: var(--c); flex-shrink: 0;
}
.cvg-layer .more {
  margin-top: auto; padding-top: 12px; font-size: 11px; color: var(--muted);
  font-family: 'JetBrains Mono', monospace; letter-spacing: 0.08em;
  display: inline-flex; align-items: center; gap: 6px;
}
.cvg-layer .more::after {
  content: "↻ hover"; font-size: 8.5px; letter-spacing: 0.1em;
  color: var(--c); opacity: 0; transform: translateX(-3px);
  transition: opacity .2s ease, transform .2s ease;
}
.cvg-layer:hover .more::after { opacity: .9; transform: none; }
.cvg-layer.l1 { --c: #2A6FDB; }   /* Civil Environment */
.cvg-layer.l2 { --c: #1A7A99; }   /* Resilience */
.cvg-layer.l3 { --c: #B45309; }   /* Human Security */
.cvg-layer.l4 { --c: #6B21A8; }   /* Hybrid Threats */
.cvg-layer.l5 { --c: var(--brand-ink); }  /* CIMIC Analysis */

html[data-theme="dark"] .cvg-layer.l3 { --c: #F59E0B; }
html[data-theme="dark"] .cvg-layer.l4 { --c: #C084FC; }
html[data-theme="dark"] .cvg-layer.l5 { --c: var(--brand-sky); }

/* ============== MAP MODULE ============== */
.cvg-map-wrap {
  display: grid; grid-template-columns: 280px 1fr 320px;
  gap: 0; border: 1px solid var(--line); border-radius: 18px;
  overflow: hidden; background: var(--paper);
}
.cvg-map-side {
  background: var(--paper-2); border-right: 1px solid var(--line);
  padding: 22px 20px;
}
.cvg-map-side.right {
  border-right: 0; border-left: 1px solid var(--line);
}
.cvg-map-side h5 {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.2em; font-weight: 700;
  color: var(--muted); text-transform: uppercase;
  margin: 0 0 14px;
}
.cvg-map-side h5 + h5 { margin-top: 24px; }
.cvg-filter {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 10px; border-radius: 7px;
  font-size: 12px; color: var(--ink-2); margin-bottom: 4px;
  cursor: pointer; transition: background .15s ease;
}
.cvg-filter:hover { background: var(--paper); }
.cvg-filter .ll { display: flex; align-items: center; gap: 9px; }
.cvg-filter .ll i {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--fc, var(--pf-convergens));
  flex-shrink: 0;
}
.cvg-filter .sw {
  width: 26px; height: 14px; border-radius: 999px;
  background: var(--line-2); position: relative;
  transition: background .15s ease;
}
.cvg-filter .sw::after {
  content: ""; position: absolute; top: 2px; left: 2px;
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--paper);
  transition: transform .15s ease;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}
.cvg-filter.on .sw { background: var(--pf-convergens); }
.cvg-filter.on .sw::after { transform: translateX(12px); }

/* Map canvas */
.cvg-map {
  position: relative; min-height: 520px;
  background:
    radial-gradient(60% 80% at 50% 50%, color-mix(in srgb, var(--pf-convergens) 6%, transparent), transparent 80%),
    var(--paper);
  overflow: hidden;
}
.cvg-map-bg {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(to right, color-mix(in srgb, var(--pf-convergens) 10%, transparent) 1px, transparent 1px),
    linear-gradient(to bottom, color-mix(in srgb, var(--pf-convergens) 10%, transparent) 1px, transparent 1px);
  background-size: 40px 40px;
  opacity: 0.35;
}
.cvg-map svg.region { position: absolute; inset: 0; width: 100%; height: 100%; }
.cvg-map .region-shape {
  fill: color-mix(in srgb, var(--pf-convergens) 8%, transparent);
  stroke: color-mix(in srgb, var(--pf-convergens) 28%, transparent);
  stroke-width: 1;
}
.cvg-map .region-shape.hi {
  fill: color-mix(in srgb, var(--pf-convergens) 16%, transparent);
}
.cvg-pin {
  position: absolute; transform: translate(-50%, -50%);
  display: flex; align-items: center; gap: 6px;
  cursor: pointer; z-index: 2;
}
.cvg-pin .dot {
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--pc, var(--pf-convergens));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--pc, var(--pf-convergens)) 25%, transparent);
  position: relative;
}
.cvg-pin .dot::before {
  content: ""; position: absolute; inset: -8px; border-radius: 50%;
  border: 1px solid var(--pc, var(--pf-convergens));
  animation: cvgPulse 2.2s infinite ease-out;
  opacity: 0;
}
@keyframes cvgPulse {
  0% { transform: scale(.6); opacity: .9; }
  100% { transform: scale(2.4); opacity: 0; }
}
.cvg-pin .tag {
  font-family: 'JetBrains Mono', monospace; font-size: 9px;
  letter-spacing: 0.12em; color: var(--ink); font-weight: 700;
  background: var(--paper); padding: 3px 6px; border-radius: 4px;
  border: 1px solid var(--line);
  white-space: nowrap;
}
.cvg-map .legend {
  position: absolute; left: 16px; bottom: 16px;
  display: flex; gap: 8px; align-items: center;
  background: color-mix(in srgb, var(--paper) 85%, transparent);
  backdrop-filter: blur(8px);
  padding: 8px 12px; border-radius: 999px;
  border: 1px solid var(--line);
  font-family: 'JetBrains Mono', monospace; font-size: 10px;
  letter-spacing: 0.1em; color: var(--muted);
}
.cvg-map .legend .item { display: flex; align-items: center; gap: 5px; }
.cvg-map .legend i { width: 8px; height: 8px; border-radius: 50%; }
.cvg-map .map-tag {
  position: absolute; top: 16px; left: 16px;
  font-family: 'JetBrains Mono', monospace; font-size: 10px;
  letter-spacing: 0.14em; color: var(--muted);
  background: color-mix(in srgb, var(--paper) 80%, transparent);
  border: 1px solid var(--line); border-radius: 999px;
  padding: 6px 11px; backdrop-filter: blur(8px);
}
.cvg-map .map-meta {
  position: absolute; top: 16px; right: 16px;
  display: flex; gap: 6px;
}
.cvg-map .map-meta .b {
  font-family: 'JetBrains Mono', monospace; font-size: 10px;
  background: color-mix(in srgb, var(--paper) 85%, transparent);
  border: 1px solid var(--line); border-radius: 6px;
  padding: 5px 8px; color: var(--ink-2); cursor: pointer;
  backdrop-filter: blur(8px);
}
.cvg-map .map-meta .b.on {
  background: var(--ink); color: var(--paper); border-color: var(--ink);
}

/* Map right panel — selected event */
.cvg-event {
  font-size: 13px;
}
.cvg-event .sev {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 8px; border-radius: 4px;
  font-family: 'JetBrains Mono', monospace; font-size: 10px;
  font-weight: 700; letter-spacing: 0.14em;
  background: color-mix(in srgb, var(--c) 12%, transparent);
  color: var(--c, var(--pf-convergens));
  border: 1px solid color-mix(in srgb, var(--c) 32%, transparent);
  margin-bottom: 12px;
}
.cvg-event h6 {
  font-size: 17px; font-weight: 700; margin: 0 0 12px;
  letter-spacing: -0.01em; line-height: 1.3;
}
.cvg-event .grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 10px 14px; margin-bottom: 14px;
}
.cvg-event .grid .k {
  font-family: 'JetBrains Mono', monospace; font-size: 9px;
  letter-spacing: 0.14em; color: var(--muted); text-transform: uppercase;
  margin-bottom: 3px;
}
.cvg-event .grid .v {
  font-size: 12px; color: var(--ink-2); font-weight: 600;
}
.cvg-event .summary {
  font-size: 12px; line-height: 1.55; color: var(--ink-2);
  padding: 12px; border: 1px dashed var(--line); border-radius: 8px;
  background: var(--paper-2);
}
.cvg-event .summary .bluf-k {
  display: inline-block; font-family: 'JetBrains Mono', monospace;
  font-size: 8.5px; font-weight: 700; letter-spacing: 0.12em;
  color: var(--pf-convergens); margin-right: 7px; vertical-align: 1px;
}
.cvg-event .actions {
  display: flex; gap: 8px; margin-top: 14px;
}
.cvg-event .actions button {
  flex: 1; padding: 8px; border-radius: 7px;
  border: 1px solid var(--line); background: var(--paper);
  font-size: 11px; cursor: pointer;
  font-family: 'JetBrains Mono', monospace; letter-spacing: 0.1em;
  color: var(--ink-2);
  transition: background .15s ease;
}
.cvg-event .actions button:hover { background: var(--paper-2); }
.cvg-event .actions button.primary {
  background: var(--ink); color: var(--paper); border-color: var(--ink);
}

/* ============== INDICATOR LEGEND ============== */
.cvg-indicators {
  display: grid; grid-template-columns: repeat(5, 1fr);
  gap: 12px;
}
.cvg-ind {
  border: 1px solid var(--line); border-radius: 12px;
  padding: 16px 18px; background: var(--paper);
}
.cvg-ind .hd { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; }
.cvg-ind .hd i {
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--c);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--c) 22%, transparent);
}
.cvg-ind .hd .lvl {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.16em; font-weight: 700;
  color: var(--c); text-transform: uppercase;
}
.cvg-ind h5 {
  font-size: 14px; font-weight: 700; margin: 0 0 5px;
  letter-spacing: -0.01em;
}
.cvg-ind p { font-size: 12px; color: var(--muted); margin: 0; line-height: 1.5; }
.cvg-ind.green { --c: #16A34A; }
.cvg-ind.yellow { --c: #EAB308; }
.cvg-ind.orange { --c: #EA580C; }
.cvg-ind.red { --c: #DC2626; }
.cvg-ind.black { --c: #1F2937; }
html[data-theme="dark"] .cvg-ind.black { --c: #6B7280; }

/* ============== FRAMEWORKS ============== */
.cvg-frames {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.cvg-frame {
  border: 1px solid var(--line); border-radius: 14px;
  background: var(--paper); padding: 22px 22px;
}
.cvg-frame .hd {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 14px;
}
.cvg-frame .hd .nm {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.18em;
  color: var(--pf-convergens); font-weight: 700;
}
.cvg-frame .hd .ix {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; color: var(--muted);
}
.cvg-frame h4 {
  font-size: 17px; font-weight: 700; margin: 0 0 6px;
  letter-spacing: -0.01em;
}
.cvg-frame > p {
  font-size: 12px; color: var(--muted);
  margin: 0 0 14px; line-height: 1.5;
}
.cvg-frame .chips {
  display: flex; flex-wrap: wrap; gap: 6px;
}
.cvg-frame .chips span {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.1em;
  padding: 5px 9px; border-radius: 999px;
  background: var(--paper-2); border: 1px solid var(--line);
  color: var(--ink-2);
}

/* ============== AI BAND ============== */
.cvg-ai {
  margin-top: 64px;
  border: 1px solid var(--line); border-radius: 18px;
  padding: 36px 36px;
  background:
    radial-gradient(60% 80% at 20% 20%, color-mix(in srgb, var(--pf-convergens) 14%, transparent), transparent 70%),
    var(--paper);
  display: grid; grid-template-columns: 1.1fr 1fr;
  gap: 36px; align-items: center;
}
.cvg-ai .hd {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.18em;
  color: var(--pf-convergens); font-weight: 700;
}
.cvg-ai h3 {
  font-family: 'Instrument Serif', serif; font-style: italic;
  font-size: clamp(28px, 3.4vw, 44px);
  letter-spacing: -0.02em; margin: 14px 0 14px; font-weight: 400;
}
.cvg-ai p { color: var(--muted); margin: 0 0 18px; line-height: 1.6; font-size: 15px; }
.cvg-ai-list {
  list-style: none; padding: 0; margin: 0;
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px 18px;
  font-size: 13px; color: var(--ink-2);
}
.cvg-ai-list li {
  display: flex; align-items: flex-start; gap: 8px;
  line-height: 1.5;
}
.cvg-ai-list li::before {
  content: ""; flex-shrink: 0; margin-top: 7px;
  width: 4px; height: 4px; border-radius: 50%;
  background: var(--pf-convergens);
}
.cvg-ai-viz {
  background: var(--paper-2); border: 1px solid var(--line);
  border-radius: 14px; padding: 22px; position: relative; min-height: 320px;
}
.cvg-ai-viz .nodes { font-family: 'JetBrains Mono', monospace; font-size: 11px; }
.cvg-ai-viz .nd {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 12px; margin: 8px 0; border-radius: 8px;
  background: var(--paper); border: 1px solid var(--line);
}
.cvg-ai-viz .nd .ic {
  width: 22px; height: 22px; border-radius: 6px;
  background: color-mix(in srgb, var(--c, var(--pf-convergens)) 14%, transparent);
  color: var(--c, var(--pf-convergens));
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.cvg-ai-viz .nd .ic svg { width: 12px; height: 12px; }
.cvg-ai-viz .nd .tx { flex: 1; color: var(--ink-2); }
.cvg-ai-viz .nd .tx strong {
  color: var(--ink); display: block; font-size: 11.5px;
  font-weight: 700; letter-spacing: 0.04em;
}
.cvg-ai-viz .nd .ms {
  display: block; font-size: 10px; color: var(--muted);
  letter-spacing: 0.06em; margin-top: 2px; font-weight: 400;
}
.cvg-ai-viz .nd.n1 { --c: #2A6FDB; }
.cvg-ai-viz .nd.n2 { --c: #1A7A99; }
.cvg-ai-viz .nd.n3 { --c: #B45309; }
.cvg-ai-viz .nd.n4 { --c: #6B21A8; }

/* ============== CONNECTIONS TO OTHER MODULES ============== */
.cvg-connect {
  margin-top: 64px;
  border-top: 1px solid var(--line);
  padding-top: 36px;
}
.cvg-connect-grid {
  display: grid; grid-template-columns: repeat(5, 1fr);
  gap: 12px; margin-top: 24px;
}
.cvg-connect-cell {
  border: 1px solid var(--line); border-radius: 12px;
  padding: 18px; background: var(--paper);
  text-align: left;
}
.cvg-connect-cell .nm {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.18em;
  font-weight: 700; margin-bottom: 6px;
}
.cvg-connect-cell .lk {
  font-size: 12px; color: var(--muted); line-height: 1.5;
}
.cvg-connect-cell.c1 .nm { color: var(--pf-conventus); }
.cvg-connect-cell.c2 .nm { color: var(--pf-convexus); }
.cvg-connect-cell.c3 .nm { color: var(--pf-connectus); }
.cvg-connect-cell.c4 .nm { color: var(--pf-consultus); }
.cvg-connect-cell.c5 .nm { color: var(--pf-connovus); }

/* ============== CONVENTUS · SUBSCRIPTION PACKAGES BANNER ============== */
.cvg-pkg-banner {
  display: grid; grid-template-columns: 1.4fr 1fr; gap: 36px;
  padding: 36px;
  border: 1px solid color-mix(in srgb, var(--pf-conventus) 22%, var(--line));
  border-radius: 20px;
  background:
    radial-gradient(60% 100% at 100% 0%, color-mix(in srgb, var(--pf-conventus) 8%, transparent) 0%, transparent 60%),
    radial-gradient(80% 100% at 0% 100%, color-mix(in srgb, var(--brand-blue) 5%, transparent) 0%, transparent 60%),
    var(--paper);
  position: relative; overflow: hidden;
}
.cvg-pkg-banner::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, var(--pf-conventus), var(--brand-blue), transparent);
}
.cvg-pkg-title {
  font-family: 'Manrope', sans-serif;
  font-size: clamp(28px, 3vw, 38px); font-weight: 700;
  line-height: 1.05; letter-spacing: -0.025em;
  color: var(--ink); margin: 0 0 14px;
}
.cvg-pkg-title em {
  font-family: 'Instrument Serif', serif;
  font-style: italic; font-weight: 400;
  background: linear-gradient(110deg, var(--pf-conventus) 0%, var(--brand-blue) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.cvg-pkg-lead {
  font-size: 14.5px; color: var(--muted); line-height: 1.6;
  margin: 0 0 20px; max-width: 540px;
}
.cvg-pkg-tiers {
  display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px;
}
.pkg-chip {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.1em; font-weight: 600;
  padding: 5px 10px; border-radius: 6px;
  border: 1px solid; background: var(--paper);
}
.pkg-silver { color: #6F7A92; border-color: color-mix(in srgb, #6F7A92 35%, var(--line)); }
.pkg-blue   { color: var(--brand-blue); border-color: color-mix(in srgb, var(--brand-blue) 35%, var(--line)); }
.pkg-gold   { color: var(--brand-gold); border-color: color-mix(in srgb, var(--brand-gold) 45%, var(--line)); background: color-mix(in srgb, var(--brand-gold) 8%, var(--paper)); }
.pkg-teal   { color: var(--pf-consultus); border-color: color-mix(in srgb, var(--pf-consultus) 35%, var(--line)); }
.pkg-red    { color: var(--pf-connovus); border-color: color-mix(in srgb, var(--pf-connovus) 35%, var(--line)); }
.cvg-pkg-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.cvg-pkg-doc {
  border: 1px solid var(--line); border-radius: 14px;
  background: var(--paper-2);
  padding: 18px 20px;
  font-family: 'JetBrains Mono', monospace;
}
.cvg-pkg-doc-head {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 10px; letter-spacing: 0.16em; color: var(--muted); font-weight: 700;
  padding-bottom: 12px; margin-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.cvg-pkg-doc-row {
  display: flex; justify-content: space-between; padding: 6px 0;
  font-size: 12px;
}
.cvg-pkg-doc-row + .cvg-pkg-doc-row { border-top: 1px dashed var(--line-2); }
.cvg-pkg-doc-row span { color: var(--muted); }
.cvg-pkg-doc-row b { color: var(--ink); font-weight: 600; }
@media (max-width: 820px) {
  .cvg-pkg-banner { grid-template-columns: 1fr; padding: 24px; gap: 24px; }
}

/* ============== FOOTER CTA ============== */
.cvg-footer-cta {
  margin-top: 64px;
  border: 1px solid var(--line); border-radius: 20px;
  padding: 44px 44px; text-align: center;
  background:
    radial-gradient(60% 70% at 50% 0%, color-mix(in srgb, var(--pf-convergens) 14%, transparent), transparent 70%),
    var(--paper);
}
.cvg-footer-cta h3 {
  font-family: 'Instrument Serif', serif; font-style: italic;
  font-size: clamp(28px, 3.4vw, 42px);
  letter-spacing: -0.02em; margin: 0 0 12px; font-weight: 400;
}
.cvg-footer-cta p { color: var(--muted); max-width: 640px; margin: 0 auto 22px; line-height: 1.55; }
.cvg-footer-cta .row { display: inline-flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
.cvg-footer-cta .btn { font-family: inherit; }

/* Responsive */
@media (max-width: 1100px) {
  .cvg-layers { grid-template-columns: repeat(2, 1fr); }
  .cvg-indicators { grid-template-columns: repeat(3, 1fr); }
  .cvg-frames { grid-template-columns: 1fr; }
  .cvg-map-wrap { grid-template-columns: 1fr; }
  .cvg-map-side { border-right: 0; border-bottom: 1px solid var(--line); }
  .cvg-map-side.right { border-left: 0; border-top: 1px solid var(--line); }
  .cvg-hero-grid { grid-template-columns: 1fr; }
  .cvg-hero-viz { max-width: 320px; margin: 0; }
  .cvg-ai { grid-template-columns: 1fr; }
  .cvg-connect-grid { grid-template-columns: repeat(2, 1fr); }
  .cvg-posi { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .cvg-wrap { padding: 20px 16px 60px; }
  .cvg-hero { padding: 32px 24px; }
  .cvg-layers { grid-template-columns: 1fr; }
  .cvg-indicators { grid-template-columns: repeat(2, 1fr); }
  .cvg-bar .cvg-tabs { display: none; }
  .cvg-bar { padding: 12px 16px; }
  .cvg-ai, .cvg-footer-cta { padding: 28px 20px; }
}

/* ============== REGIONAL FOCUS / EASTERN FLANK ============== */
.cvg-region-wrap {
  display: grid; grid-template-columns: 1.4fr 1fr;
  gap: 18px; align-items: stretch;
}
.cvg-region-map {
  position: relative;
  border: 1px solid var(--line); border-radius: 18px;
  background: var(--paper);
  overflow: hidden;
  min-height: 460px;
  padding: 0;
}
.cvg-leaflet {
  position: absolute; inset: 0;
  background: var(--paper-2);
  z-index: 1;
}
.cvg-leaflet .leaflet-container {
  background: var(--paper-2);
  font-family: 'Manrope', sans-serif;
}
.cvg-leaflet .leaflet-control-attribution {
  background: color-mix(in srgb, var(--paper) 80%, transparent);
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.04em;
  color: var(--muted);
}
.cvg-leaflet .leaflet-control-attribution a { color: var(--ink-2); }
.cvg-leaflet .leaflet-control-zoom a {
  background: var(--paper); color: var(--ink);
  border-color: var(--line);
}
.cvg-leaflet .leaflet-control-zoom a:hover {
  background: var(--paper-2);
}
html[data-theme="dark"] .cvg-leaflet .leaflet-control-zoom a {
  background: var(--paper); color: var(--ink); border-color: var(--line-2);
}
.cvg-region-map .map-tag,
.cvg-region-map .legend-pill {
  z-index: 5;
  position: absolute;
  top: 16px;
  font-family: 'JetBrains Mono', monospace; font-size: 10px;
  letter-spacing: 0.14em;
  border-radius: 999px;
  padding: 6px 11px;
  backdrop-filter: blur(8px);
  font-weight: 700;
}
.cvg-region-map .map-tag {
  left: 16px;
  color: var(--muted);
  background: color-mix(in srgb, var(--paper) 85%, transparent);
  border: 1px solid var(--line);
  font-weight: 400;
}
.cvg-region-map .legend-pill {
  right: 16px;
  color: var(--pf-convergens);
  background: color-mix(in srgb, var(--pf-convergens) 12%, var(--paper));
  border: 1px solid color-mix(in srgb, var(--pf-convergens) 30%, transparent);
}

/* Mode toggle (Peace / Crisis / War) — top-right under legend pill */
.cvg-region-map .cvg-mode-toggle {
  position: absolute; top: 52px; right: 16px;
  z-index: 6;
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 3px 3px 10px;
  background: color-mix(in srgb, var(--paper) 92%, transparent);
  border: 1px solid var(--line);
  border-radius: 999px;
  backdrop-filter: blur(10px);
  font-family: 'JetBrains Mono', monospace;
}
.cvg-region-map .cvg-mode-toggle .lbl {
  font-size: 9px; letter-spacing: 0.18em; color: var(--muted); font-weight: 700;
  margin-right: 4px;
}
.cvg-region-map .cvg-mode-toggle button {
  appearance: none; border: 0; cursor: pointer;
  background: transparent; color: var(--muted);
  font-family: inherit;
  font-size: 10px; letter-spacing: 0.14em; font-weight: 700;
  padding: 5px 11px; border-radius: 999px;
  text-transform: uppercase;
  transition: all .15s ease;
}
.cvg-region-map .cvg-mode-toggle button:hover { color: var(--ink); }
.cvg-region-map .cvg-mode-toggle button.on[data-cvg-mode="peace"]  { background: #15803D; color: #fff; box-shadow: 0 0 0 1px rgba(22,163,74,.3), 0 0 12px rgba(22,163,74,.4); }
.cvg-region-map .cvg-mode-toggle button.on[data-cvg-mode="crisis"] { background: #C2410C; color: #fff; box-shadow: 0 0 0 1px rgba(234,88,12,.3), 0 0 12px rgba(234,88,12,.4); }
.cvg-region-map .cvg-mode-toggle button.on[data-cvg-mode="conflict"]{ background: #9F1239; color: #fff; box-shadow: 0 0 0 1px rgba(220,38,38,.3), 0 0 12px rgba(220,38,38,.5); animation: oprBlink 1.4s infinite; }

/* ─── Map controls cluster (zoom + fullscreen, bottom-right of map) ─── */
.cvg-map-ctl {
  position: absolute; bottom: 16px; right: 16px;
  z-index: 7;
  display: inline-flex; flex-direction: column; gap: 4px;
}
.cvg-mc-btn {
  appearance: none; cursor: pointer;
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--paper) 92%, transparent);
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink-2);
  backdrop-filter: blur(10px);
  transition: all .15s ease;
}
.cvg-mc-btn:hover { color: var(--ink); border-color: var(--ink-2); background: var(--paper); }
.cvg-mc-btn .ico-exit { display: none; }
.cvg-mc-btn.is-fs .ico-enter { display: none; }
.cvg-mc-btn.is-fs .ico-exit  { display: inline-block; }
.cvg-mc-btn[data-cvg-fs-target] { margin-top: 4px; }

/* Hide built-in leaflet zoom (we provide a custom cluster) */
.cvg-leaflet .leaflet-control-zoom { display: none !important; }
/* Hide built-in maplibre nav (we provide custom buttons) */
.cvg-worldmap .maplibregl-ctrl-top-right { display: none !important; }
/* Move attributions to bottom-left so they don't fight the cluster */
.cvg-leaflet .leaflet-control-attribution { left: 8px; right: auto !important; bottom: 4px; }
.cvg-worldmap .maplibregl-ctrl-bottom-right { display: none !important; }
.cvg-worldmap .maplibregl-ctrl-attrib { font-size: 9px; }

/* Fullscreen state: make the map host fill the viewport */
.cvg-region-map:fullscreen,
.cvg-worldmap:fullscreen {
  background: var(--paper);
  padding: 0; margin: 0;
  width: 100vw; height: 100vh;
  border-radius: 0;
}
.cvg-region-map:fullscreen .cvg-leaflet,
.cvg-worldmap:fullscreen .cvg-maplibre {
  width: 100% !important; height: 100% !important;
  border-radius: 0 !important;
}
/* Also support the prefixed variants on Safari */
.cvg-region-map:-webkit-full-screen,
.cvg-worldmap:-webkit-full-screen {
  background: var(--paper);
  width: 100vw; height: 100vh;
}
.cvg-region-map:-webkit-full-screen .cvg-leaflet,
.cvg-worldmap:-webkit-full-screen .cvg-maplibre {
  width: 100% !important; height: 100% !important;
}
/* Fullscreen fallback class (when Fullscreen API isn't allowed in iframe) */
.cvg-region-map.cvg-fs-fallback,
.cvg-worldmap.cvg-fs-fallback {
  position: fixed; inset: 0;
  width: 100vw; height: 100vh;
  z-index: 9999;
  background: var(--paper);
  border-radius: 0;
  margin: 0;
}
.cvg-region-map.cvg-fs-fallback .cvg-leaflet,
.cvg-worldmap.cvg-fs-fallback .cvg-maplibre {
  width: 100% !important; height: 100% !important;
  border-radius: 0 !important;
}
/* In fullscreen, lift cluster slightly so it doesn't sit on bottom UI */
.cvg-region-map:fullscreen .cvg-map-ctl,
.cvg-region-map.cvg-fs-fallback .cvg-map-ctl,
.cvg-worldmap:fullscreen .cvg-map-ctl,
.cvg-worldmap.cvg-fs-fallback .cvg-map-ctl {
  bottom: 24px; right: 24px;
}

/* Map-wide accent ring per mode */
.cvg-region-map[data-cvg-mode="crisis"] .cvg-leaflet { box-shadow: inset 0 0 0 2px color-mix(in srgb, #EA580C 40%, transparent); }
.cvg-region-map[data-cvg-mode="conflict"] .cvg-leaflet { box-shadow: inset 0 0 0 2px color-mix(in srgb, #DC2626 55%, transparent); }
.cvg-region-map[data-cvg-mode="conflict"] .legend-pill {
  background: color-mix(in srgb, #DC2626 18%, var(--paper));
  border-color: color-mix(in srgb, #DC2626 45%, transparent);
  color: #DC2626;
}
.cvg-region-map[data-cvg-mode="conflict"] .legend-pill::before {
  content: "▲ CONFLICT · "; font-weight: 700;
}
.cvg-region-map[data-cvg-mode="crisis"] .legend-pill {
  background: color-mix(in srgb, #EA580C 14%, var(--paper));
  border-color: color-mix(in srgb, #EA580C 38%, transparent);
  color: #C2410C;
}
.cvg-region-map[data-cvg-mode="crisis"] .legend-pill::before {
  content: "▲ CRISIS · "; font-weight: 700;
}
.cvg-map .map-tag,
.cvg-map .map-meta,
.cvg-map .legend {
  z-index: 5;
}

/* Leaflet country marker (Region map) */
.cvg-country-marker {
  display: flex !important; align-items: center; gap: 6px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9.5px; letter-spacing: 0.14em; font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
  background: transparent;
  border: none;
  outline: none;
}
.cvg-country-marker .m-dot {
  width: 10px; height: 10px; border-radius: 50%;
  box-shadow: 0 0 0 3px rgba(255,255,255,0.85), 0 1px 3px rgba(0,0,0,0.18);
  flex-shrink: 0;
}
.cvg-country-marker .m-tag {
  color: var(--ink);
  background: rgba(255,255,255,0.92);
  padding: 3px 6px; border-radius: 4px;
  border: 1px solid rgba(0,0,0,0.08);
  font-weight: 700;
  letter-spacing: 0.14em;
}
html[data-theme="dark"] .cvg-country-marker .m-tag {
  background: rgba(14,19,31,0.92); color: var(--ink);
  border-color: var(--line-2);
}
.cvg-country-marker.active .m-dot {
  box-shadow: 0 0 0 3px rgba(255,255,255,0.95), 0 0 0 6px color-mix(in srgb, var(--pf-convergens) 50%, transparent);
}
.cvg-country-marker.active .m-tag {
  background: var(--pf-convergens); color: white;
  border-color: var(--pf-convergens);
}

/* Leaflet OSINT event marker */
.cvg-event-marker {
  display: flex !important; align-items: center; gap: 5px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 8.5px; letter-spacing: 0.12em; font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
  background: transparent;
  border: none;
}
.cvg-event-marker .m-dot {
  position: relative;
  width: 11px; height: 11px; border-radius: 50%;
  background: var(--mc, #DC2626);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mc, #DC2626) 25%, transparent),
              0 0 0 4px rgba(255,255,255,0.6);
  flex-shrink: 0;
}
.cvg-event-marker .m-dot::before {
  content: ""; position: absolute; inset: -7px; border-radius: 50%;
  border: 1px solid var(--mc, #DC2626);
  animation: cvgPulse 2.2s infinite ease-out;
  opacity: 0;
}
.cvg-event-marker .m-tag {
  color: var(--ink);
  background: rgba(255,255,255,0.92);
  padding: 2px 5px; border-radius: 3px;
  border: 1px solid rgba(0,0,0,0.08);
}
html[data-theme="dark"] .cvg-event-marker .m-tag {
  background: rgba(14,19,31,0.92); color: var(--ink);
  border-color: var(--line-2);
}

/* Hide stylized SVG corridor lines (older code) when Leaflet present */
.cvg-region-map .corridor-line,
.cvg-region-map svg.corridor { display: none; }

/* ============== EASTERN FLANK · LIVE LAYERS (aircraft / radars / sensors) ============== */
.cvg-region-map .cvg-layers-toggle {
  position: absolute; left: 16px; bottom: 16px;
  z-index: 6;
  display: inline-flex; gap: 4px; padding: 3px;
  flex-wrap: wrap; max-width: calc(100% - 32px);
  background: color-mix(in srgb, var(--paper) 88%, transparent);
  border: 1px solid var(--line);
  border-radius: 18px; backdrop-filter: blur(10px);
}
.cvg-region-map .cvg-layers-toggle button {
  appearance: none; border: 0; cursor: pointer;
  background: transparent;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.12em; font-weight: 700;
  color: var(--muted); text-transform: uppercase;
  padding: 6px 11px; border-radius: 999px;
  display: inline-flex; align-items: center; gap: 6px;
  transition: all .15s ease;
}
.cvg-region-map .cvg-layers-toggle button .ic {
  width: 7px; height: 7px; border-radius: 50%;
  background: currentColor; opacity: 0.5;
  transition: opacity .15s ease, box-shadow .15s ease;
}
.cvg-region-map .cvg-layers-toggle button:hover { color: var(--ink); }
.cvg-region-map .cvg-layers-toggle button.on {
  background: var(--ink); color: var(--paper);
}
.cvg-region-map .cvg-layers-toggle button.on .ic {
  opacity: 1; box-shadow: 0 0 6px currentColor;
}
.cvg-region-map .cvg-layers-toggle button[data-cvg-layer="air"]    { --lc: #3DA5FF; }
.cvg-region-map .cvg-layers-toggle button[data-cvg-layer="radar"]  { --lc: #16A34A; }
.cvg-region-map .cvg-layers-toggle button[data-cvg-layer="sensor"] { --lc: #C8A24B; }
.cvg-region-map .cvg-layers-toggle button[data-cvg-layer="field"]  { --lc: #5B7DA8; }
.cvg-region-map .cvg-layers-toggle button[data-cvg-layer="shoot"]  { --lc: #E11D48; }
.cvg-region-map .cvg-layers-toggle button[data-cvg-layer="dc"]     { --lc: #8B5CF6; }
.cvg-region-map .cvg-layers-toggle button[data-cvg-layer="net"]    { --lc: #06B6D4; }
.cvg-region-map .cvg-layers-toggle button[data-cvg-layer="nai"]    { --lc: #1A7A99; }
.cvg-region-map .cvg-layers-toggle button[data-cvg-layer="sat"]    { --lc: #A78BFA; }
.cvg-region-map .cvg-layers-toggle button[data-cvg-layer="mil"]    { --lc: #F59E0B; }
.cvg-region-map .cvg-layers-toggle button.on[data-cvg-layer="air"]    { background: #1F6FBF; }
.cvg-region-map .cvg-layers-toggle button.on[data-cvg-layer="radar"]  { background: #15803D; }
.cvg-region-map .cvg-layers-toggle button.on[data-cvg-layer="sensor"] { background: #A4811E; }
.cvg-region-map .cvg-layers-toggle button.on[data-cvg-layer="field"]  { background: #3F5B82; }
.cvg-region-map .cvg-layers-toggle button.on[data-cvg-layer="shoot"]  { background: #9F1239; }
.cvg-region-map .cvg-layers-toggle button.on[data-cvg-layer="dc"]     { background: #6D28D9; }
.cvg-region-map .cvg-layers-toggle button.on[data-cvg-layer="net"]    { background: #0E7490; }
.cvg-region-map .cvg-layers-toggle button.on[data-cvg-layer="nai"]    { background: #0F5563; }
.cvg-region-map .cvg-layers-toggle button.on[data-cvg-layer="sat"]    { background: #6D28D9; }
.cvg-region-map .cvg-layers-toggle button.on[data-cvg-layer="mil"]    { background: #B45309; }
.cvg-region-map .cvg-layers-toggle button .ic { color: var(--lc); }
.cvg-region-map .cvg-layers-toggle button.on .ic { color: #fff; }

/* Live counter pill (top-left, under map-tag) */
.cvg-region-map .cvg-live-counter {
  position: absolute; left: 16px; top: 56px;
  z-index: 6;
  display: inline-flex; align-items: center; gap: 8px;
  flex-wrap: wrap; max-width: calc(100% - 32px); row-gap: 4px;
  background: color-mix(in srgb, var(--paper) 88%, transparent);
  border: 1px solid var(--line); border-radius: 8px;
  backdrop-filter: blur(10px);
  padding: 5px 10px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.1em; color: var(--ink-2);
}
.cvg-region-map .cvg-live-counter .item {
  display: inline-flex; align-items: center; gap: 5px;
}
.cvg-region-map .cvg-live-counter .item i {
  width: 6px; height: 6px; border-radius: 50%;
  display: inline-block;
}
.cvg-region-map .cvg-live-counter .item.air i    { background:#3DA5FF; box-shadow:0 0 6px #3DA5FF; }
.cvg-region-map .cvg-live-counter .item.radar i  { background:#16A34A; box-shadow:0 0 6px #16A34A; animation: oprBlink 1.6s infinite; }
.cvg-region-map .cvg-live-counter .item.sensor i { background:#C8A24B; box-shadow:0 0 6px #C8A24B; }
.cvg-region-map .cvg-live-counter .item.field i  { background:#5B7DA8; box-shadow:0 0 6px #5B7DA8; }
.cvg-region-map .cvg-live-counter .item.shoot i  { background:#E11D48; box-shadow:0 0 6px #E11D48; animation: oprBlink 1.6s infinite; }
.cvg-region-map .cvg-live-counter .item.dc i     { background:#8B5CF6; box-shadow:0 0 6px #8B5CF6; }
.cvg-region-map .cvg-live-counter .item.net i    { background:#06B6D4; box-shadow:0 0 6px #06B6D4; }
.cvg-region-map .cvg-live-counter .item.sat i    { background:#A78BFA; box-shadow:0 0 6px #A78BFA; animation: oprBlink 2.2s infinite; }
.cvg-region-map .cvg-live-counter .item.mil i    { background:#F59E0B; box-shadow:0 0 6px #F59E0B; animation: oprBlink 1.8s infinite; }
.cvg-region-map .cvg-live-counter .sep {
  width: 1px; height: 10px; background: var(--line-2);
}
.cvg-region-map .cvg-live-counter b { color: var(--ink); font-weight: 700; }

/* === AIRCRAFT marker === */
.cvg-air-marker {
  width: 22px !important; height: 22px !important;
  pointer-events: auto !important;
  display: flex !important; align-items: center; justify-content: center;
  /* The whole marker is rotated by JS via inline transform; the heading is set via a CSS var on the inner chevron. */
}
.cvg-air-marker .ac {
  width: 18px; height: 18px;
  display: flex; align-items: center; justify-content: center;
  transform: rotate(var(--hd, 0deg));
  filter: drop-shadow(0 0 4px rgba(61,165,255,0.65));
  transition: transform .9s linear;
}
.cvg-air-marker .ac svg { width: 100%; height: 100%; display: block; }
.cvg-air-marker .ac svg path.body { fill:#3DA5FF; stroke:#0E2148; stroke-width:0.7; }
html[data-theme="dark"] .cvg-air-marker .ac svg path.body { stroke:#0a1224; }
.cvg-air-marker .ac::after {
  /* contrail */
  content: ""; position: absolute;
  width: 1px; height: 18px;
  background: linear-gradient(to bottom, rgba(61,165,255,0.55), transparent);
  bottom: 100%;
  pointer-events: none;
}
.cvg-air-tip {
  background: var(--ink); color: var(--paper);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.06em;
  padding: 6px 9px; border-radius: 6px;
  border: 0;
  box-shadow: 0 8px 18px -10px rgba(0,0,0,0.4);
}
.cvg-air-tip b { color: #5BC0FF; }
.cvg-air-tip .row { display: flex; gap: 10px; }
.cvg-air-tip .row span { color: rgba(255,255,255,0.55); }
.leaflet-tooltip.cvg-air-tip::before { display: none; }

/* === RADAR station === */
.cvg-radar-marker {
  width: 44px !important; height: 44px !important;
  pointer-events: auto !important;
  display: flex !important; align-items: center; justify-content: center;
}
.cvg-radar-marker .ring {
  position: absolute;
  width: 44px; height: 44px; border-radius: 50%;
  border: 1px solid #16A34A;
  opacity: 0.35;
  animation: cvgRadarRing 3.2s ease-out infinite;
}
.cvg-radar-marker .ring.r2 { animation-delay: 1.1s; }
.cvg-radar-marker .ring.r3 { animation-delay: 2.2s; }
@keyframes cvgRadarRing {
  0%   { transform: scale(0.2); opacity: 0.7; }
  100% { transform: scale(1.3); opacity: 0; }
}
.cvg-radar-marker .sweep {
  position: absolute;
  width: 44px; height: 44px;
  border-radius: 50%;
  background: conic-gradient(from 0deg,
    rgba(22,163,74,0.55) 0deg,
    rgba(22,163,74,0.15) 22deg,
    transparent 60deg 360deg);
  mask: radial-gradient(circle, transparent 1px, black 2px 22px, transparent 22px);
  -webkit-mask: radial-gradient(circle, transparent 1px, black 2px 22px, transparent 22px);
  animation: cvgRadarSweep 3.6s linear infinite;
}
@keyframes cvgRadarSweep { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
.cvg-radar-marker .core {
  position: absolute;
  width: 10px; height: 10px; border-radius: 50%;
  background: #16A34A;
  box-shadow: 0 0 0 2px var(--paper), 0 0 10px #16A34A;
  z-index: 2;
}
html[data-theme="dark"] .cvg-radar-marker .core { box-shadow: 0 0 0 2px #0E131F, 0 0 10px #16A34A; }
.cvg-radar-tip {
  background: #064E2D; color: #BBF7D0;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.06em;
  padding: 7px 10px; border-radius: 6px;
  border: 1px solid rgba(34,197,94,0.4);
}
.cvg-radar-tip b { color:#86EFAC; }
.cvg-radar-tip .row { display:flex; gap:10px; }
.cvg-radar-tip .row span { color: rgba(187,247,208,0.55); }

/* === SENSOR markers (maritime / border / sigint) === */
.cvg-sensor-marker {
  width: 24px !important; height: 24px !important;
  pointer-events: auto !important;
  display: flex !important; align-items: center; justify-content: center;
}
.cvg-sensor-marker .glow {
  position: absolute;
  width: 24px; height: 24px; border-radius: 50%;
  border: 1px solid var(--sc, #C8A24B);
  opacity: 0.35;
  animation: cvgSensorPulse 2.6s ease-out infinite;
}
@keyframes cvgSensorPulse {
  0%   { transform: scale(0.4); opacity: 0.75; }
  100% { transform: scale(1.4); opacity: 0; }
}
.cvg-sensor-marker .core {
  position: absolute;
  width: 14px; height: 14px;
  background: var(--paper);
  border: 1.5px solid var(--sc, #C8A24B);
  display: flex; align-items: center; justify-content: center;
}
.cvg-sensor-marker.k-mar .core { border-radius: 50%; }
.cvg-sensor-marker.k-bdr .core { transform: rotate(45deg); border-radius: 2px; }
.cvg-sensor-marker.k-sig .core { clip-path: polygon(50% 0, 100% 100%, 0 100%); border:0; background: var(--sc, #C8A24B); width:12px; height:12px; }
.cvg-sensor-marker .core::after {
  content: ""; width: 4px; height: 4px; border-radius: 50%;
  background: var(--sc, #C8A24B);
}
.cvg-sensor-marker.k-sig .core::after { display: none; }
.cvg-sensor-tip {
  background: #43330B; color: #FDE68A;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.06em;
  padding: 6px 9px; border-radius: 6px;
  border: 1px solid rgba(202,138,4,0.4);
}
.cvg-sensor-tip b { color: #FCD34D; }
.cvg-sensor-tip .row span { color: rgba(253,230,138,0.6); }

/* === AIRFIELD marker (military + key civil airfields) === */
.cvg-field-marker {
  width: 28px !important; height: 28px !important;
  pointer-events: auto !important;
  display: flex !important; align-items: center; justify-content: center;
}
.cvg-field-marker .ring {
  position: absolute; inset: 0;
  border-radius: 50%;
  border: 1.5px solid var(--fc, #5B7DA8);
  background: color-mix(in srgb, var(--fc, #5B7DA8) 14%, var(--paper) 86%);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--fc, #5B7DA8) 16%, transparent);
}
.cvg-field-marker .cross {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  transform: rotate(var(--rwy, 35deg));
}
.cvg-field-marker .cross::before,
.cvg-field-marker .cross::after {
  content: ""; position: absolute;
  background: var(--fc, #5B7DA8);
  border-radius: 1px;
}
.cvg-field-marker .cross::before { width: 18px; height: 2px; }
.cvg-field-marker .cross::after  { width: 12px; height: 2px; transform: rotate(58deg); }
.cvg-field-marker.k-opp .ring { border-style: dashed; }
.cvg-field-tip {
  background: #15233A; color: #B8C9E3;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.06em;
  padding: 7px 10px; border-radius: 6px;
  border: 1px solid rgba(91,125,168,0.45);
}
.cvg-field-tip b { color: #93B2DF; }
.cvg-field-tip .row { display:flex; gap:10px; }
.cvg-field-tip .row span { color: rgba(184,201,227,0.55); }
.cvg-field-tip .side {
  display:inline-block; padding:1px 6px; border-radius:3px;
  background: rgba(91,125,168,0.25); color:#B8C9E3;
  font-size:9px; letter-spacing:0.12em; margin-left:6px;
}
.cvg-field-tip .side.opp { background: rgba(225,29,72,0.25); color:#FCA5A5; }

/* === SHOOTER (air-defence / SAM / coastal launcher) === */
.cvg-shoot-marker {
  width: 32px !important; height: 32px !important;
  pointer-events: auto !important;
  display: flex !important; align-items: center; justify-content: center;
}
.cvg-shoot-marker .pulse {
  position: absolute; inset: 0; border-radius: 50%;
  border: 1px solid var(--sc, #E11D48);
  opacity: 0.45;
  animation: cvgShootPulse 2.8s ease-out infinite;
}
.cvg-shoot-marker .pulse.p2 { animation-delay: 0.9s; }
@keyframes cvgShootPulse {
  0%   { transform: scale(0.3); opacity: 0.75; }
  100% { transform: scale(1.25); opacity: 0; }
}
.cvg-shoot-marker .hex {
  position: absolute;
  width: 16px; height: 16px;
  background: var(--paper);
  border: 1.8px solid var(--sc, #E11D48);
  clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
  display: flex; align-items: center; justify-content: center;
  z-index: 2;
}
.cvg-shoot-marker .hex::after {
  content:""; width: 5px; height: 5px;
  background: var(--sc, #E11D48); border-radius: 50%;
}
.cvg-shoot-marker .arc {
  position: absolute;
  width: 32px; height: 32px;
  border: 1px solid var(--sc, #E11D48);
  border-radius: 50%;
  opacity: 0.35;
  clip-path: polygon(0 0, 100% 0, 100% 50%, 0 50%);
}
.cvg-shoot-tip {
  background: #3F0A1F; color: #FBCFE0;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.06em;
  padding: 7px 10px; border-radius: 6px;
  border: 1px solid rgba(225,29,72,0.45);
}
.cvg-shoot-tip b { color: #FCA5A5; }
.cvg-shoot-tip .row { display:flex; gap:10px; }
.cvg-shoot-tip .row span { color: rgba(251,207,224,0.55); }
.cvg-shoot-tip .side {
  display:inline-block; padding:1px 6px; border-radius:3px;
  background: rgba(91,125,168,0.25); color:#B8C9E3;
  font-size:9px; letter-spacing:0.12em; margin-left:6px;
}
.cvg-shoot-tip .side.opp { background: rgba(225,29,72,0.25); color:#FCA5A5; }

/* === DATA CENTER marker === */
.cvg-dc-marker {
  width: 24px !important; height: 24px !important;
  pointer-events: auto !important;
  display: flex !important; align-items: center; justify-content: center;
}
.cvg-dc-marker .box {
  position: absolute;
  width: 18px; height: 14px;
  background: var(--paper);
  border: 1.5px solid var(--dcc, #8B5CF6);
  border-radius: 2px;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--dcc, #8B5CF6) 14%, transparent);
  display: flex; flex-direction: column; gap: 2px;
  padding: 2px;
  align-items: stretch; justify-content: center;
}
.cvg-dc-marker .box::before,
.cvg-dc-marker .box::after {
  content:""; height:1.5px; background: var(--dcc, #8B5CF6); border-radius:1px;
}
.cvg-dc-marker .box::after { opacity:0.5; }
.cvg-dc-marker.k-hyper .box {
  background: var(--dcc, #8B5CF6);
}
.cvg-dc-marker.k-hyper .box::before,
.cvg-dc-marker.k-hyper .box::after { background: var(--paper); }
.cvg-dc-tip {
  background: #2C1B5C; color: #DDD1FF;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.06em;
  padding: 7px 10px; border-radius: 6px;
  border: 1px solid rgba(139,92,246,0.45);
}
.cvg-dc-tip b { color: #C4B5FD; }
.cvg-dc-tip .row { display:flex; gap:10px; }
.cvg-dc-tip .row span { color: rgba(221,209,255,0.55); }
.cvg-dc-tip .badge {
  display:inline-block; padding:1px 6px; border-radius:3px; margin-left:6px;
  background: rgba(139,92,246,0.30); color:#DDD1FF;
  font-size:9px; letter-spacing:0.12em;
}

/* === NETWORK NODE marker (IXPs / cable landings / backbone) === */
.cvg-net-marker {
  width: 22px !important; height: 22px !important;
  pointer-events: auto !important;
  display: flex !important; align-items: center; justify-content: center;
}
.cvg-net-marker .dia {
  position: absolute;
  width: 12px; height: 12px;
  background: var(--paper);
  border: 1.5px solid var(--nc, #06B6D4);
  transform: rotate(45deg);
  z-index: 2;
}
.cvg-net-marker .dia::after {
  content:""; position:absolute; inset:2px;
  background: var(--nc, #06B6D4);
}
.cvg-net-marker .ping {
  position: absolute; width: 22px; height: 22px; border-radius: 50%;
  border: 1px solid var(--nc, #06B6D4);
  opacity: 0.35;
  animation: cvgNetPulse 2.4s ease-out infinite;
}
@keyframes cvgNetPulse {
  0%   { transform: scale(0.3); opacity: 0.8; }
  100% { transform: scale(1.35); opacity: 0; }
}
.cvg-net-tip {
  background: #0B3A4A; color: #BAE6F6;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.06em;
  padding: 7px 10px; border-radius: 6px;
  border: 1px solid rgba(6,182,212,0.45);
}
.cvg-net-tip b { color: #67E8F9; }
.cvg-net-tip .row { display:flex; gap:10px; }
.cvg-net-tip .row span { color: rgba(186,230,246,0.55); }

/* === SATELLITE marker (mil + civ moving overhead) === */
.cvg-sat-marker {
  width: 36px !important; height: 36px !important;
  pointer-events: auto !important;
  display: flex !important; align-items: center; justify-content: center;
  transform: rotate(var(--sat-hd, 0deg));
}
.cvg-sat-marker .halo {
  position: absolute; inset: 4px; border-radius: 50%;
  border: 1px solid var(--sc, #A78BFA);
  opacity: 0.35;
  animation: cvgSatPulse 3.4s ease-out infinite;
}
@keyframes cvgSatPulse {
  0%   { transform: scale(0.4); opacity: 0.7; }
  100% { transform: scale(1.4); opacity: 0; }
}
.cvg-sat-marker svg.sat-svg {
  width: 28px; height: 28px;
  filter: drop-shadow(0 0 6px color-mix(in srgb, var(--sc, #A78BFA) 60%, transparent));
}
.cvg-sat-marker svg.sat-svg .panel { fill: var(--sc, #A78BFA); opacity: 0.85; }
.cvg-sat-marker svg.sat-svg .body  { fill: var(--paper); stroke: var(--sc, #A78BFA); stroke-width: 1.4; }
.cvg-sat-marker svg.sat-svg .core  { fill: var(--sc, #A78BFA); }
.cvg-sat-marker.k-mil .panel { fill-opacity: 1; }
.cvg-sat-marker.k-mil .body  { stroke-dasharray: 2 1.6; }

.cvg-sat-tip {
  background: #2A1B5C; color: #DDD1FF;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.06em;
  padding: 7px 10px; border-radius: 6px;
  border: 1px solid rgba(167,139,250,0.45);
}
.cvg-sat-tip b { color: #C4B5FD; }
.cvg-sat-tip .row { display:flex; gap:10px; }
.cvg-sat-tip .row span { color: rgba(221,209,255,0.55); }
.cvg-sat-tip .side {
  display:inline-block; padding:1px 6px; border-radius:3px; margin-left:6px;
  font-size:9px; letter-spacing:0.12em;
}
.cvg-sat-tip .side.civ { background: rgba(34,211,238,0.25); color:#A5F3FC; }
.cvg-sat-tip .side.mil { background: rgba(225,29,72,0.25); color:#FCA5A5; }

/* === MIL ACTIVITY · exercise zones + force-movement arrows === */
.leaflet-interactive.cvg-ex-rect-nato,
.leaflet-interactive.cvg-ex-rect-opp,
.leaflet-interactive.cvg-ex-engage {
  stroke-dasharray: 8 4;
}
.leaflet-interactive.cvg-ex-engage {
  stroke-dasharray: 2 3;
  animation: cvgEngagePulse 1.4s ease-in-out infinite;
}
@keyframes cvgEngagePulse {
  0%, 100% { stroke-opacity: 0.75; }
  50%      { stroke-opacity: 1; }
}
.cvg-ex-label {
  background: var(--ink); color: var(--paper);
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.14em; font-weight: 700;
  padding: 2px 7px; border-radius: 3px;
  border: 0;
  box-shadow: 0 4px 10px -4px rgba(0,0,0,0.5);
  text-transform: uppercase;
}
.cvg-ex-label.side-nato { background: #0E5C70; color: #fff; }
.cvg-ex-label.side-opp  { background: #9F1239; color: #fff; }
.cvg-ex-label.kind-engagement {
  background: #7F1D1D; color: #fff;
  animation: oprBlink 1.2s infinite;
}
.leaflet-tooltip.cvg-ex-label::before { display: none; }

/* Force movement arrow */
.cvg-mv-arrow-marker {
  width: 22px !important; height: 22px !important;
  display: flex !important; align-items: center; justify-content: center;
  pointer-events: none !important;
}
.cvg-mv-arrow-marker svg {
  width: 16px; height: 16px;
  transform: rotate(var(--mv-hd, 0deg));
  filter: drop-shadow(0 0 4px var(--mc, #F59E0B));
}
.cvg-mv-arrow-marker svg path { fill: var(--mc, #F59E0B); }

/* ─── Military Activity side panel card ─── */
.cvg-mil-frame { padding: 16px 18px; }
.cvg-mil-head {
  display: flex; align-items: center; justify-content: space-between;
  margin: 0 0 10px;
}
.cvg-mil-head h5 { margin: 0; }
.cvg-mil-head h5 .ix {
  color: var(--ink-2); font-weight: 400; letter-spacing: 0.16em; margin-left: 4px;
}
.cvg-mil-filter {
  display: inline-flex; padding: 2px; gap: 1px;
  background: var(--paper-2); border: 1px solid var(--line);
  border-radius: 999px;
  margin-bottom: 10px;
  max-width: 100%;
  flex-wrap: wrap;
}
.cvg-mil-filter button {
  appearance: none; border: 0; cursor: pointer; background: transparent;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.12em; font-weight: 700;
  color: var(--muted); text-transform: uppercase;
  padding: 4px 9px; border-radius: 999px;
  transition: all .15s ease;
}
.cvg-mil-filter button:hover { color: var(--ink); }
.cvg-mil-filter button.on {
  background: var(--ink); color: var(--paper);
}
.cvg-mil-list {
  display: flex; flex-direction: column; gap: 5px;
  max-height: 260px; overflow-y: auto;
  padding-right: 4px;
}
.cvg-mil-row {
  display: grid;
  grid-template-columns: 56px 1fr auto;
  align-items: center;
  gap: 8px;
  padding: 6px 9px;
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--paper);
  cursor: pointer;
  transition: all .15s ease;
}
.cvg-mil-row:hover { border-color: var(--pf-convergens); transform: translateX(2px); }
.cvg-mil-row .kind {
  font-family: 'JetBrains Mono', monospace;
  font-size: 8px; font-weight: 700; letter-spacing: 0.1em;
  text-align: center;
  padding: 3px 5px; border-radius: 3px;
  text-transform: uppercase;
}
.cvg-mil-row .kind.exercise   { background: rgba(245,158,11,0.18);  color: #B45309; }
.cvg-mil-row .kind.movement   { background: rgba(8,145,178,0.18);   color: #0E7490; }
.cvg-mil-row .kind.engagement { background: rgba(220,38,38,0.18);   color: #B91C1C; animation: oprBlink 1.5s infinite; }
.cvg-mil-row .kind.announce   { background: rgba(115,115,115,0.18); color: var(--ink-2); }
html[data-theme="dark"] .cvg-mil-row .kind.exercise   { background: rgba(245,158,11,0.22); color: #FCD34D; }
html[data-theme="dark"] .cvg-mil-row .kind.movement   { background: rgba(8,145,178,0.22);  color: #67E8F9; }
html[data-theme="dark"] .cvg-mil-row .kind.engagement { background: rgba(220,38,38,0.22);  color: #FCA5A5; }
html[data-theme="dark"] .cvg-mil-row .kind.announce   { background: rgba(115,115,115,0.22); color: var(--ink); }
.cvg-mil-row .body { display: flex; flex-direction: column; min-width: 0; }
.cvg-mil-row .body .ti {
  font-size: 12px; font-weight: 600; color: var(--ink); line-height: 1.25;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cvg-mil-row .body .me {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.04em; color: var(--muted);
  margin-top: 1px;
}
.cvg-mil-row .body .me b { color: var(--ink-2); }
.cvg-mil-row .side {
  width: 6px; align-self: stretch;
  border-radius: 2px;
}
.cvg-mil-row .side.blue { background: #0E7490; }
.cvg-mil-row .side.red  { background: #DC2626; }
.cvg-mil-foot {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 10px; padding-top: 10px;
  border-top: 1px dashed var(--line);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; color: var(--muted); letter-spacing: 0.1em;
}
.cvg-mil-foot b { color: var(--ink); }
.cvg-mil-legend { display: inline-flex; align-items: center; gap: 4px; }
.cvg-mil-legend i.mil-sw { width: 8px; height: 8px; display: inline-block; border-radius: 1px; }
.cvg-mil-legend i.mil-sw.blue { background: #0E7490; }
.cvg-mil-legend i.mil-sw.red  { background: #DC2626; }

/* ─── Basemap toggle (live satellite imagery) ─── */
.cvg-region-map .cvg-base-toggle {
  position: absolute; top: 92px; right: 16px;
  z-index: 6;
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 3px 3px 10px;
  background: color-mix(in srgb, var(--paper) 92%, transparent);
  border: 1px solid var(--line);
  border-radius: 999px;
  backdrop-filter: blur(10px);
  font-family: 'JetBrains Mono', monospace;
}
.cvg-region-map .cvg-base-toggle .lbl {
  font-size: 9px; letter-spacing: 0.18em; color: var(--muted); font-weight: 700;
  margin-right: 4px;
}
.cvg-region-map .cvg-base-toggle button {
  appearance: none; border: 0; cursor: pointer;
  background: transparent; color: var(--muted);
  font-family: inherit;
  font-size: 10px; letter-spacing: 0.14em; font-weight: 700;
  padding: 5px 11px; border-radius: 999px;
  text-transform: uppercase;
  transition: all .15s ease;
}
.cvg-region-map .cvg-base-toggle button:hover { color: var(--ink); }
.cvg-region-map .cvg-base-toggle button.on {
  background: var(--ink); color: var(--paper);
  box-shadow: 0 0 0 1px rgba(20,20,20,.3);
}
.cvg-region-map .cvg-base-toggle button.on[data-cvg-base="sat"] {
  background: #6D28D9; color: #fff;
  box-shadow: 0 0 0 1px rgba(109,40,217,.35), 0 0 10px rgba(167,139,250,.4);
}
.cvg-base-imagery-date {
  position: absolute; top: 128px; right: 16px;
  z-index: 6;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.14em; color: var(--muted);
  background: color-mix(in srgb, var(--paper) 88%, transparent);
  border: 1px solid var(--line);
  padding: 3px 8px; border-radius: 4px;
  pointer-events: none;
  opacity: 0; transition: opacity .25s ease;
  backdrop-filter: blur(8px);
}
.cvg-base-imagery-date.show { opacity: 1; }

/* Monitored (non-corridor) country marker */
.cvg-country-marker.mon .m-dot {
  outline: 2px dashed rgba(225,29,72,0.55);
  outline-offset: 2px;
}
.cvg-country-marker.mon .m-tag {
  background: color-mix(in srgb, #E11D48 14%, var(--paper));
  color: var(--ink);
  border: 1px dashed rgba(225,29,72,0.55) !important;
}
/* Combat (blue force in active combat) country marker */
.cvg-country-marker.combat .m-dot {
  animation: oprBlink 1.4s infinite;
  outline: 2px solid var(--pf-convergens);
  outline-offset: 2px;
}
.cvg-country-marker.combat .m-tag {
  background: color-mix(in srgb, var(--pf-convergens) 18%, var(--paper));
  color: var(--ink);
  border: 1px solid color-mix(in srgb, var(--pf-convergens) 60%, var(--line)) !important;
}

/* ─── NAI / TAI list panel ─── */
.cvg-nai-frame { padding: 16px 18px; }
.cvg-nai-head {
  display: flex; align-items: center; justify-content: space-between;
  margin: 0 0 10px;
}
.cvg-nai-head h5 { margin: 0; }
.cvg-nai-head h5 .ix {
  color: var(--ink-2); font-weight: 400; letter-spacing: 0.16em; margin-left: 4px;
}
.cvg-nai-list {
  display: flex; flex-direction: column; gap: 6px;
  max-height: 240px; overflow-y: auto;
  padding-right: 4px;
}
.cvg-nai-row {
  display: grid; grid-template-columns: 56px 1fr auto; align-items: center;
  gap: 10px;
  padding: 7px 9px;
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--paper);
  cursor: pointer;
  transition: all .15s ease;
}
.cvg-nai-row:hover { border-color: var(--pf-convergens); transform: translateX(2px); }
.cvg-nai-row .code {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; font-weight: 700; letter-spacing: 0.1em;
  padding: 3px 6px; border-radius: 3px;
  text-align: center;
  background: color-mix(in srgb, var(--pf-convergens) 14%, var(--paper));
  color: var(--pf-convergens);
  border: 1px solid color-mix(in srgb, var(--pf-convergens) 30%, transparent);
}
.cvg-nai-row.kind-tai .code {
  background: color-mix(in srgb, #DC2626 14%, var(--paper));
  color: #DC2626;
  border-color: color-mix(in srgb, #DC2626 35%, transparent);
}
.cvg-nai-row .nm {
  font-size: 12px; font-weight: 600; color: var(--ink); line-height: 1.25;
}
.cvg-nai-row .nm .crit {
  display: block; font-weight: 400; font-size: 10px; color: var(--muted);
  margin-top: 1px; letter-spacing: 0.02em;
}
.cvg-nai-row .act {
  display: inline-flex; align-items: center; gap: 4px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; color: var(--muted);
}
.cvg-nai-row .act b {
  color: var(--ink); font-weight: 700;
  padding: 1px 5px; border-radius: 3px;
  background: var(--paper-2);
}
.cvg-nai-row.hot .act b {
  background: color-mix(in srgb, #DC2626 18%, var(--paper));
  color: #DC2626;
  animation: oprBlink 1.4s infinite;
}
.cvg-nai-foot {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 10px; padding-top: 10px;
  border-top: 1px dashed var(--line);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; color: var(--muted); letter-spacing: 0.1em;
}
.cvg-nai-foot b { color: var(--ink); }
.cvg-nai-foot .ghost {
  appearance: none; border: 1px solid var(--line); cursor: pointer;
  background: transparent; color: var(--ink-2);
  font-family: inherit; font-size: 10px; letter-spacing: 0.1em;
  padding: 4px 9px; border-radius: 999px;
  transition: all .15s ease;
}
.cvg-nai-foot .ghost:hover { border-color: var(--pf-convergens); color: var(--pf-convergens); }

/* Leaflet rectangle styling per kind via path-options classes */
.cvg-nai-rect path,
.leaflet-interactive.cvg-nai-rect {
  stroke-dasharray: 6 5;
}
.cvg-region-map[data-cvg-mode="conflict"] .leaflet-interactive.cvg-tai-rect {
  animation: cvgWarPulse 1.6s ease-in-out infinite;
}
@keyframes cvgWarPulse {
  0%, 100% { stroke-opacity: 0.7; }
  50%      { stroke-opacity: 1; }
}

/* ─── Live Intel Feed strip ─── */
.cvg-feed {
  margin-top: 18px;
  border: 1px solid var(--line); border-radius: 14px;
  background: var(--paper);
  overflow: hidden;
}
.cvg-feed-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px;
  background: linear-gradient(180deg, var(--paper-2), var(--paper));
  border-bottom: 1px solid var(--line);
  gap: 14px;
  flex-wrap: wrap;
}
.cvg-feed-h-l {
  display: inline-flex; align-items: center; gap: 14px;
}
.cvg-feed-title {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.18em; font-weight: 700;
  color: var(--ink); text-transform: uppercase;
  display: inline-flex; align-items: center; gap: 8px;
}
.cvg-feed-title em {
  font-style: normal;
  font-weight: 400; color: var(--muted); letter-spacing: 0.12em;
  font-size: 10px; margin-left: 4px;
}
.cvg-feed-clock {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; color: var(--muted); letter-spacing: 0.16em;
  padding: 3px 8px; border-radius: 4px;
  background: var(--paper-2); border: 1px solid var(--line);
}
.cvg-feed-h-r {
  display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.cvg-feed-filter {
  display: inline-flex; padding: 2px; gap: 1px;
  background: var(--paper-2); border: 1px solid var(--line);
  border-radius: 999px;
}
.cvg-feed-filter button {
  appearance: none; border: 0; cursor: pointer; background: transparent;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.12em; font-weight: 700;
  color: var(--muted); text-transform: uppercase;
  padding: 4px 9px; border-radius: 999px;
  transition: all .15s ease;
}
.cvg-feed-filter button:hover { color: var(--ink); }
.cvg-feed-filter button.on {
  background: var(--ink); color: var(--paper);
}
.cvg-feed-pause {
  appearance: none; border: 1px solid var(--line); cursor: pointer;
  background: var(--paper-2);
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.12em; font-weight: 700;
  color: var(--ink-2);
  padding: 5px 10px; border-radius: 999px;
  display: inline-flex; align-items: center; gap: 5px;
  transition: all .15s ease;
}
.cvg-feed-pause:hover { color: var(--ink); border-color: var(--ink-2); }
.cvg-feed-pause.paused {
  background: color-mix(in srgb, #EAB308 18%, var(--paper));
  border-color: color-mix(in srgb, #EAB308 50%, var(--line));
  color: #A16207;
}

.cvg-feed-stream {
  max-height: 260px; overflow-y: auto;
  scrollbar-width: thin;
}
.cvg-feed-row {
  display: grid;
  grid-template-columns: 64px 80px 1fr 110px 58px;
  align-items: start;
  gap: 12px;
  padding: 8px 14px;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 60%, transparent);
  font-size: 12px; line-height: 1.4;
  animation: cvgFeedIn .35s ease-out;
}
@keyframes cvgFeedIn {
  from { opacity: 0; transform: translateY(-6px); background: color-mix(in srgb, var(--pf-convergens) 7%, var(--paper)); }
  to   { opacity: 1; transform: translateY(0); background: transparent; }
}
.cvg-feed-row.fusion {
  background: linear-gradient(90deg,
    color-mix(in srgb, #DC2626 10%, var(--paper)) 0%,
    color-mix(in srgb, #DC2626 4%, var(--paper)) 60%,
    var(--paper) 100%);
  border-left: 3px solid #DC2626;
}
.cvg-feed-row.fusion .head {
  font-weight: 700; color: #DC2626;
}
.cvg-feed-row .ts {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; color: var(--muted); letter-spacing: 0.06em;
}
.cvg-feed-row .src {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; font-weight: 700; letter-spacing: 0.1em;
  padding: 2px 6px; border-radius: 3px; text-align: center;
  height: 16px; line-height: 12px;
  align-self: start;
}
.cvg-feed-row .head {
  display: flex; flex-direction: column; gap: 1px;
}
.cvg-feed-row .head .h1 {
  font-size: 12px; color: var(--ink); font-weight: 500;
}
.cvg-feed-row .head .h2 {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; color: var(--muted); letter-spacing: 0.06em;
}
.cvg-feed-row .nai-hit {
  display:inline-block; margin-left: 6px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; font-weight: 700; letter-spacing: 0.1em;
  padding: 1px 5px; border-radius: 3px;
  background: color-mix(in srgb, var(--pf-convergens) 18%, var(--paper));
  color: var(--pf-convergens);
}
.cvg-feed-row .nai-hit.tai {
  background: color-mix(in srgb, #DC2626 18%, var(--paper));
  color: #DC2626;
}
.cvg-feed-row .loc {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; color: var(--ink-2); letter-spacing: 0.04em;
}
.cvg-feed-row .grade {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; font-weight: 700;
  text-align: center;
  padding: 2px 6px; border-radius: 4px;
}
/* Admiralty bands */
.cvg-feed-row .grade.g-A,
.cvg-feed-row .grade.g-1 { background: #DCFCE7; color: #15803D; }
.cvg-feed-row .grade.g-B,
.cvg-feed-row .grade.g-2 { background: #ECFCCB; color: #3F6212; }
.cvg-feed-row .grade.g-C,
.cvg-feed-row .grade.g-3 { background: #FEF3C7; color: #A16207; }
.cvg-feed-row .grade.g-D,
.cvg-feed-row .grade.g-4 { background: #FFEDD5; color: #C2410C; }
.cvg-feed-row .grade.g-E,
.cvg-feed-row .grade.g-5 { background: #FEE2E2; color: #B91C1C; }
.cvg-feed-row .grade.g-F,
.cvg-feed-row .grade.g-6 { background: #FECACA; color: #7F1D1D; }
html[data-theme="dark"] .cvg-feed-row .grade.g-A,
html[data-theme="dark"] .cvg-feed-row .grade.g-1 { background: #052e16; color: #86EFAC; }
html[data-theme="dark"] .cvg-feed-row .grade.g-B,
html[data-theme="dark"] .cvg-feed-row .grade.g-2 { background: #1a2e05; color: #BEF264; }
html[data-theme="dark"] .cvg-feed-row .grade.g-C,
html[data-theme="dark"] .cvg-feed-row .grade.g-3 { background: #422006; color: #FCD34D; }
html[data-theme="dark"] .cvg-feed-row .grade.g-D,
html[data-theme="dark"] .cvg-feed-row .grade.g-4 { background: #431407; color: #FDBA74; }
html[data-theme="dark"] .cvg-feed-row .grade.g-E,
html[data-theme="dark"] .cvg-feed-row .grade.g-5 { background: #450a0a; color: #FCA5A5; }
html[data-theme="dark"] .cvg-feed-row .grade.g-F,
html[data-theme="dark"] .cvg-feed-row .grade.g-6 { background: #501010; color: #FCA5A5; }

/* Source pill colors */
.src-pill, .cvg-feed-row .src {
  display: inline-block;
}
.src-acled,   .src.s-acled   { background:#7F1D1D; color:#FCA5A5; }
.src-gdelt,   .src.s-gdelt   { background:#1E3A8A; color:#93C5FD; }
.src-opensky, .src.s-opensky { background:#155E75; color:#67E8F9; }
.src-ais,     .src.s-ais     { background:#0E7490; color:#A5F3FC; }
.src-sat,     .src.s-sat     { background:#365314; color:#BEF264; }
.src-soc,     .src.s-soc     { background:#5B21B6; color:#DDD6FE; }
.src-tg,      .src.s-tg      { background:#1E40AF; color:#BFDBFE; }
.src-radar,   .src.s-radar   { background:#14532D; color:#86EFAC; }
.src-sigint,  .src.s-sigint  { background:#831843; color:#FBCFE0; }
.src-fusion,  .src.s-fusion  { background:#7F1D1D; color:#fff; }

.cvg-feed-foot {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 14px;
  background: var(--paper-2);
  border-top: 1px solid var(--line);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.06em; color: var(--muted);
  flex-wrap: wrap; gap: 10px;
}
.cvg-feed-foot-l { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.cvg-feed-foot-r b { color: var(--ink); }
.cvg-feed-foot .src-pill {
  font-size: 9px; padding: 2px 6px; border-radius: 3px; letter-spacing: 0.1em; font-weight: 700;
}

@media (max-width: 800px) {
  .cvg-feed-row { grid-template-columns: 56px 70px 1fr 58px; }
  .cvg-feed-row .loc { display: none; }
}

/* On-map NAI label tooltip */
.cvg-nai-label {
  background: var(--ink); color: var(--paper);
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.14em; font-weight: 700;
  padding: 2px 6px; border-radius: 3px;
  border: 0;
  box-shadow: 0 4px 10px -4px rgba(0,0,0,0.5);
}
.cvg-nai-label.kind-tai { background: #9F1239; color: #fff; }
.leaflet-tooltip.cvg-nai-label::before { display: none; }

/* ─── Intel Pack button (section header) ─── */
.cvg-intel-pack-btn {
  appearance: none; cursor: pointer;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.14em; font-weight: 700;
  padding: 7px 11px 7px 9px; margin-top: 10px;
  border-radius: 999px;
  background: var(--ink); color: var(--paper); border: 1px solid var(--ink);
  display: inline-flex; align-items: center; gap: 6px;
  transition: all .15s ease;
}
.cvg-intel-pack-btn:hover { background: var(--pf-convergens); border-color: var(--pf-convergens); }
.cvg-intel-pack-btn svg { flex-shrink: 0; }

/* ─── Cascade prediction frame ─── */
.cvg-cascade-frame { padding: 16px 18px; }
.cvg-cas-head {
  display: flex; align-items: center; justify-content: space-between;
  margin: 0 0 10px;
}
.cvg-cas-head h5 { margin: 0; }
.cvg-cas-head h5 .ix {
  color: var(--ink-2); font-weight: 400; letter-spacing: 0.16em; margin-left: 4px;
}
.cvg-cas-trigger {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px;
  background: color-mix(in srgb, var(--pf-convergens) 6%, var(--paper));
  border: 1px solid color-mix(in srgb, var(--pf-convergens) 25%, var(--line));
  border-radius: 8px;
}
.cvg-cas-trigger .lbl {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.14em; font-weight: 700;
  color: var(--muted); text-transform: uppercase;
}
.cvg-cas-trigger .val {
  font-size: 12px; font-weight: 600; color: var(--ink);
}
.cvg-cascade-frame.active .cvg-cas-trigger {
  background: color-mix(in srgb, #DC2626 8%, var(--paper));
  border-color: color-mix(in srgb, #DC2626 40%, var(--line));
}
.cvg-cascade-frame.active .cvg-cas-trigger .lbl { color: #B91C1C; }
.cvg-cas-tree {
  margin: 10px 0 0;
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 4px 12px;
  font-size: 11px;
  position: relative;
  min-height: 60px;
}
.cvg-cas-tree:empty::after {
  content: "Pick a scenario or wait for a fusion event."; grid-column: 1 / -1;
  color: var(--muted); font-size: 11px; padding: 8px 0;
}
.cvg-cas-tree .lvl {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; font-weight: 700; letter-spacing: 0.1em;
  text-transform: uppercase;
  padding-top: 4px;
}
.cvg-cas-tree .lvl.l2 { color: #C2410C; }
.cvg-cas-tree .lvl.l3 { color: #B91C1C; }
.cvg-cas-tree .effects {
  display: flex; flex-direction: column; gap: 4px;
}
.cvg-cas-tree .eff {
  display: flex; align-items: flex-start; gap: 6px;
  padding: 5px 8px;
  background: var(--paper-2);
  border-left: 2px solid #EAB308;
  border-radius: 4px;
  font-size: 11px; line-height: 1.35;
  color: var(--ink-2);
  animation: cvgFeedIn .35s ease-out;
}
.cvg-cas-tree .effects .eff .blr {
  font-family: 'JetBrains Mono', monospace;
  font-size: 8px; font-weight: 700; letter-spacing: 0.1em;
  color: var(--muted); padding-top: 1px;
}
.cvg-cas-tree .l2 + .effects .eff { border-left-color: #EA580C; }
.cvg-cas-tree .l3 + .effects .eff { border-left-color: #DC2626; }
.cvg-cas-foot { margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--line); }
.cvg-cas-scenarios {
  display: flex; flex-wrap: wrap; gap: 4px;
}
.cvg-cas-scenarios button {
  appearance: none; cursor: pointer; border: 1px solid var(--line);
  background: var(--paper);
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.1em; font-weight: 700;
  color: var(--ink-2); text-transform: uppercase;
  padding: 4px 9px; border-radius: 999px;
  transition: all .15s ease;
}
.cvg-cas-scenarios button:hover { border-color: var(--pf-convergens); color: var(--pf-convergens); }
.cvg-cas-scenarios button.on {
  background: var(--ink); color: var(--paper); border-color: var(--ink);
}

/* ─── Pattern of Life frame ─── */
.cvg-pol-frame { padding: 16px 18px; }
.cvg-pol-head {
  display: flex; align-items: center; justify-content: space-between;
  margin: 0 0 10px;
}
.cvg-pol-head h5 { margin: 0; }
.cvg-pol-head h5 .ix {
  color: var(--ink-2); font-weight: 400; letter-spacing: 0.16em; margin-left: 4px;
}
.cvg-pol-list { display: flex; flex-direction: column; gap: 6px; }
.cvg-pol-row {
  display: grid;
  grid-template-columns: 1fr 90px 64px;
  align-items: center;
  gap: 10px;
  padding: 7px 9px;
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--paper);
  cursor: pointer;
  transition: all .15s ease;
}
.cvg-pol-row:hover { border-color: var(--pf-convergens); transform: translateX(2px); }
.cvg-pol-row .meta {
  font-size: 12px; font-weight: 600; color: var(--ink); line-height: 1.2;
}
.cvg-pol-row .meta .ty {
  display: block; font-family: 'JetBrains Mono', monospace;
  font-weight: 400; font-size: 9px; letter-spacing: 0.12em;
  color: var(--muted); margin-top: 2px;
}
.cvg-pol-spark {
  display: inline-flex; gap: 2px; align-items: flex-end; height: 22px;
}
.cvg-pol-spark .b {
  width: 5px; background: var(--pf-convergens);
  border-radius: 1px; opacity: 0.55;
}
.cvg-pol-spark .b.over { background: #DC2626; opacity: 1; box-shadow: 0 0 6px rgba(220,38,38,0.4); }
.cvg-pol-row .delta {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; font-weight: 700;
  text-align: right;
  padding: 2px 7px; border-radius: 4px;
}
.cvg-pol-row .delta.up   { background: rgba(220,38,38,0.12); color: #B91C1C; }
.cvg-pol-row .delta.down { background: rgba(22,163,74,0.12); color: #166534; }
.cvg-pol-row .delta.flat { background: var(--paper-2); color: var(--muted); }
.cvg-pol-foot {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 10px; padding-top: 10px;
  border-top: 1px dashed var(--line);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; color: var(--muted); letter-spacing: 0.1em;
}
.cvg-pol-foot b { color: var(--ink); }
.cvg-pol-legend { display: inline-flex; align-items: center; gap: 4px; }
.cvg-pol-legend i.pol-bar { width: 8px; height: 8px; display: inline-block; background: var(--pf-convergens); opacity: 0.55; border-radius: 1px; }
.cvg-pol-legend i.pol-bar.over { background: #DC2626; opacity: 1; }

/* ─── Tasking frame ─── */
.cvg-task-frame { padding: 16px 18px; }
.cvg-task-head {
  display: flex; align-items: center; justify-content: space-between;
  margin: 0 0 10px;
}
.cvg-task-head h5 { margin: 0; }
.cvg-task-head h5 .ix {
  color: var(--ink-2); font-weight: 400; letter-spacing: 0.16em; margin-left: 4px;
}
.cvg-task-list { display: flex; flex-direction: column; gap: 6px; }
.cvg-task-row {
  display: grid;
  grid-template-columns: 50px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 8px 9px;
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--paper);
}
.cvg-task-row .code {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; font-weight: 700; letter-spacing: 0.08em;
  text-align: center;
  padding: 3px 6px; border-radius: 3px;
  background: var(--paper-2); color: var(--ink-2);
}
.cvg-task-row .body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cvg-task-row .body .ti {
  font-size: 12px; font-weight: 600; color: var(--ink);
  line-height: 1.25; overflow: hidden; text-overflow: ellipsis;
}
.cvg-task-row .body .ti .nai-ref {
  display: inline-block; font-family: 'JetBrains Mono', monospace;
  font-size: 9px; font-weight: 700; letter-spacing: 0.08em;
  padding: 0 4px; border-radius: 2px;
  background: color-mix(in srgb, var(--pf-convergens) 18%, var(--paper));
  color: var(--pf-convergens);
  margin-right: 4px;
}
.cvg-task-row .body .ti .nai-ref.tai {
  background: color-mix(in srgb, #DC2626 18%, var(--paper));
  color: #DC2626;
}
.cvg-task-row .body .meta {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.08em; color: var(--muted);
  text-transform: uppercase;
}
.cvg-task-row .body .meta b { color: var(--ink-2); }
.cvg-task-row .prio {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; font-weight: 700;
  padding: 2px 6px; border-radius: 3px;
  text-align: center;
}
.cvg-task-row .prio.p1 { background: #FEE2E2; color: #B91C1C; }
.cvg-task-row .prio.p2 { background: #FEF3C7; color: #A16207; }
.cvg-task-row .prio.p3 { background: #DCFCE7; color: #166534; }
html[data-theme="dark"] .cvg-task-row .prio.p1 { background: #450a0a; color: #FCA5A5; }
html[data-theme="dark"] .cvg-task-row .prio.p2 { background: #422006; color: #FCD34D; }
html[data-theme="dark"] .cvg-task-row .prio.p3 { background: #052e16; color: #86EFAC; }
.cvg-task-foot {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 10px; padding-top: 10px;
  border-top: 1px dashed var(--line);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; color: var(--muted); letter-spacing: 0.1em;
}
.cvg-task-foot b { color: var(--ink); }
.cvg-task-foot .ghost {
  appearance: none; border: 1px solid var(--line); cursor: pointer;
  background: transparent; color: var(--ink-2);
  font-family: inherit; font-size: 10px; letter-spacing: 0.1em;
  padding: 4px 9px; border-radius: 999px;
  transition: all .15s ease;
}
.cvg-task-foot .ghost:hover { border-color: var(--pf-convergens); color: var(--pf-convergens); }

.cvg-region-side {
  display: flex; flex-direction: column; gap: 12px;
}
.cvg-region-frame {
  border: 1px solid var(--line); border-radius: 14px;
  background: var(--paper); padding: 18px 20px;
}
.cvg-region-frame h5 {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.18em; font-weight: 700;
  color: var(--muted); text-transform: uppercase;
  margin: 0 0 12px;
}
.cvg-region-frame .framings {
  display: flex; flex-direction: column; gap: 8px;
}
.cvg-region-frame .framings .row {
  display: flex; align-items: center; gap: 10px;
  font-size: 13px; color: var(--ink-2); line-height: 1.45;
}
.cvg-region-frame .framings .row::before {
  content: ""; flex-shrink: 0;
  width: 18px; height: 1px;
  background: var(--pf-convergens);
  margin-top: 1px;
}
.cvg-region-frame .stats {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px;
}
.cvg-region-frame .stats .v {
  font-family: 'Instrument Serif', serif; font-style: italic;
  font-size: 26px; color: var(--ink); font-weight: 400;
  letter-spacing: -0.02em;
}
.cvg-region-frame .stats .k {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.14em;
  color: var(--muted); text-transform: uppercase;
  margin-top: 3px;
}
.cvg-region-countries {
  display: grid; grid-template-columns: repeat(6, 1fr);
  gap: 10px; margin-top: 16px;
}
.cvg-region-countries.blue7 { grid-template-columns: repeat(7, 1fr); }
.cvg-region-countries.mon3  { grid-template-columns: repeat(3, 1fr); }
.cvg-region-row-head {
  display: flex; align-items: baseline; justify-content: space-between;
  margin-top: 22px; margin-bottom: 8px;
  padding-bottom: 6px;
  border-bottom: 1px dashed var(--line);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase;
}
.cvg-region-row-head .lbl { color: var(--ink-2); font-weight: 700; }
.cvg-region-row-head .meta { color: var(--muted); }
.cvg-region-row-head.monitored .lbl::before {
  content: ""; display: inline-block; vertical-align: middle;
  width: 8px; height: 8px; border-radius: 2px; margin-right: 8px;
  background: #E11D48; box-shadow: 0 0 0 2px rgba(225,29,72,0.18);
}
.cvg-region-countries.monitored {
  grid-template-columns: repeat(4, 1fr); margin-top: 6px;
}
.cvg-country-card {
  border: 1px solid var(--line); border-radius: 12px;
  background: var(--paper); padding: 14px 14px;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.cvg-country-card:hover, .cvg-country-card.active {
  transform: translateY(-2px);
  border-color: var(--pf-convergens);
  box-shadow: 0 14px 30px -22px color-mix(in srgb, var(--pf-convergens) 50%, transparent);
}
.cvg-country-card .row {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 8px;
}
.cvg-country-card .iso {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.18em;
  color: var(--pf-convergens); font-weight: 700;
}
.cvg-country-card .st {
  width: 8px; height: 8px; border-radius: 50%;
}
.cvg-country-card.s-green .st { background: #16A34A; box-shadow: 0 0 0 3px rgba(22,163,74,.18); }
.cvg-country-card.s-yellow .st { background: #EAB308; box-shadow: 0 0 0 3px rgba(234,179,8,.20); }
.cvg-country-card.s-orange .st { background: #EA580C; box-shadow: 0 0 0 3px rgba(234,88,12,.20); }
.cvg-country-card.s-red .st { background: #DC2626; box-shadow: 0 0 0 3px rgba(220,38,38,.20); }
.cvg-country-card.mon {
  background: color-mix(in srgb, #E11D48 4%, var(--paper));
  border-color: color-mix(in srgb, #E11D48 35%, var(--line));
  border-style: dashed;
}
.cvg-country-card.mon .iso { color: #E11D48; }
.cvg-country-card.mon:hover,
.cvg-country-card.mon.active {
  border-color: #E11D48;
  box-shadow: 0 14px 30px -22px rgba(225,29,72,0.5);
}
.cvg-country-card.combat {
  background: color-mix(in srgb, var(--pf-convergens) 6%, var(--paper));
  border-color: color-mix(in srgb, var(--pf-convergens) 45%, var(--line));
}
.cvg-country-card.combat .iso { color: var(--pf-convergens); }
.cvg-country-card .combat-badge {
  display: inline-block;
  font-family: 'JetBrains Mono', monospace;
  font-size: 8px; letter-spacing: 0.14em; font-weight: 700;
  padding: 1px 5px; margin-left: 4px; vertical-align: 2px;
  border-radius: 3px;
  background: #DC2626; color: white;
  animation: oprBlink 1.6s infinite;
}
.cvg-country-card .nm {
  font-size: 14px; font-weight: 700; letter-spacing: -0.01em;
  margin-bottom: 4px;
}
.cvg-country-card .rl {
  font-size: 11px; color: var(--muted); line-height: 1.4;
}
@media (max-width: 1100px) {
  .cvg-region-wrap { grid-template-columns: 1fr; }
  .cvg-region-countries { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 600px) {
  .cvg-region-countries { grid-template-columns: repeat(2, 1fr); }
}

/* Theme segmented control (Light / Dark / System) */
.theme-seg {
  display: inline-flex; align-items: center;
  padding: 2px; gap: 2px;
  border-radius: 999px;
  background: var(--paper-2);
  border: 1px solid var(--line);
}
.theme-seg button {
  appearance: none; border: 0;
  background: transparent; cursor: pointer;
  width: 28px; height: 26px;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--muted);
  border-radius: 999px;
  transition: background .15s ease, color .15s ease;
  padding: 0;
}
.theme-seg button:hover { color: var(--ink); }
.theme-seg button svg { width: 14px; height: 14px; }
.theme-seg button.on {
  background: var(--paper); color: var(--ink);
  box-shadow: 0 1px 2px rgba(0,0,0,0.08), inset 0 0 0 1px var(--line);
}
html[data-theme="dark"] .theme-seg button.on {
  background: var(--paper-2); color: var(--ink);
  box-shadow: inset 0 0 0 1px var(--line-2);
}

/* AI live badge */
.cvg-ai-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9.5px; letter-spacing: 0.18em;
  font-weight: 700; color: var(--pf-convergens);
  padding: 3px 8px; border-radius: 999px;
  background: color-mix(in srgb, var(--pf-convergens) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--pf-convergens) 28%, transparent);
  text-transform: uppercase;
}
.cvg-ai-badge .live-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--pf-convergens);
  box-shadow: 0 0 0 0 var(--pf-convergens);
  animation: cvgLive 1.8s infinite ease-out;
}
@keyframes cvgLive {
  0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--pf-convergens) 70%, transparent); }
  100% { box-shadow: 0 0 0 8px transparent; }
}
.cvg-section-head .left .badge-row {
  display: flex; align-items: center; gap: 10px; margin-bottom: 8px;
  flex-wrap: wrap;
}
.cvg-section-head .num { margin-bottom: 0 !important; }

/* AI prompt console */
.cvg-prompt {
  margin-top: 22px;
  border: 1px solid var(--line); border-radius: 14px;
  background: var(--paper);
  overflow: hidden;
}
.cvg-prompt-head {
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap;
  background: color-mix(in srgb, var(--pf-convergens) 4%, var(--paper));
}
.cvg-prompt-head .ttl {
  display: flex; align-items: center; gap: 10px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.16em; font-weight: 700;
  color: var(--pf-convergens);
}
.cvg-prompt-suggest {
  display: flex; flex-wrap: wrap; gap: 6px;
}
.cvg-prompt-suggest button {
  appearance: none; cursor: pointer;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10.5px; letter-spacing: 0.06em;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--paper);
  color: var(--ink-2);
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.cvg-prompt-suggest button:hover {
  background: color-mix(in srgb, var(--pf-convergens) 8%, var(--paper));
  border-color: color-mix(in srgb, var(--pf-convergens) 30%, var(--line));
  color: var(--pf-convergens);
}
.cvg-prompt-input {
  display: flex; align-items: stretch; padding: 14px 18px; gap: 10px;
}
.cvg-prompt-input textarea {
  flex: 1; resize: none;
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 14px;
  font: 400 14px/1.45 'Manrope', sans-serif;
  color: var(--ink);
  min-height: 44px; max-height: 120px;
  outline: none;
  transition: border-color .15s ease;
}
.cvg-prompt-input textarea:focus {
  border-color: var(--pf-convergens);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--pf-convergens) 14%, transparent);
}
.cvg-prompt-send {
  appearance: none; cursor: pointer;
  background: var(--pf-convergens); color: white;
  border: 0; border-radius: 10px;
  padding: 0 18px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; letter-spacing: 0.14em; font-weight: 700;
  display: inline-flex; align-items: center; gap: 8px;
  transition: filter .15s ease, transform .12s ease;
}
.cvg-prompt-send:hover { filter: brightness(1.08); }
.cvg-prompt-send:active { transform: translateY(1px); }
.cvg-prompt-send:disabled { opacity: .5; cursor: not-allowed; }
.cvg-prompt-send svg { width: 12px; height: 12px; }
.cvg-prompt-out {
  border-top: 1px solid var(--line);
  padding: 16px 18px;
  min-height: 60px;
  font-size: 14px; line-height: 1.6;
  color: var(--ink-2);
  white-space: pre-wrap;
  background: var(--paper-2);
  font-family: 'Manrope', sans-serif;
}
.cvg-prompt-out:empty::before {
  content: "› Ask Convergens AI — e.g. “Top cross‑border cascade risks today.”";
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px; letter-spacing: 0.04em;
  color: var(--muted);
}
.cvg-prompt-out.loading {
  color: var(--pf-convergens);
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px; letter-spacing: 0.1em;
}
.cvg-prompt-out.loading::after {
  content: "█"; animation: cvgBlink 1s steps(2) infinite;
  margin-left: 4px;
}
@keyframes cvgBlink { 50% { opacity: 0; } }

/* Hero AI stamp */
.cvg-hero-ai {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin: -4px 0 24px;
}
.cvg-hero-stamp {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10.5px; letter-spacing: 0.14em;
  color: var(--muted); font-weight: 600;
}

/* AI sub-badge inline next to section numbers */
.cvg-ai-sub {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9.5px; letter-spacing: 0.16em;
  color: var(--muted); font-weight: 600;
}
.cvg-ai-sub .d {
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--pf-convergens);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--pf-convergens) 25%, transparent);
}

/* ============== WORLD OSINT MAP (MapLibre) ============== */
.cvg-worldmap-wrap {
  display: grid; grid-template-columns: 280px 1fr 320px;
  gap: 0; border: 1px solid var(--line); border-radius: 18px;
  overflow: hidden; background: var(--paper);
}
.cvg-worldmap {
  position: relative; min-height: 560px;
  background: var(--paper-2);
  overflow: hidden;
}
.cvg-maplibre {
  position: absolute; inset: 0;
  z-index: 1;
  background: var(--paper-2);
}
.cvg-maplibre .maplibregl-canvas { outline: none; }
.cvg-maplibre .maplibregl-ctrl-attrib {
  background: color-mix(in srgb, var(--paper) 80%, transparent) !important;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.04em;
  color: var(--muted) !important;
}
.cvg-maplibre .maplibregl-ctrl-attrib a { color: var(--ink-2) !important; }
.cvg-maplibre .maplibregl-ctrl button {
  background: var(--paper) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
html[data-theme="dark"] .cvg-maplibre .maplibregl-ctrl-attrib {
  background: color-mix(in srgb, var(--paper) 80%, transparent) !important;
  color: var(--muted) !important;
}
html[data-theme="dark"] .cvg-maplibre .maplibregl-ctrl-attrib a { color: var(--ink-2) !important; }
html[data-theme="dark"] .cvg-maplibre .maplibregl-ctrl button {
  background: var(--paper) !important;
  color: var(--ink) !important;
  border-color: var(--line-2) !important;
  filter: invert(0.9) hue-rotate(180deg);
}

/* World map toolbar (top) */
.cvg-worldmap .map-tag,
.cvg-worldmap .map-meta,
.cvg-worldmap .legend { z-index: 5; }

/* 2D / 3D segmented toggle (lives in section head right) */
.cvg-mode-toggle {
  display: inline-flex; padding: 3px; gap: 3px;
  border-radius: 999px;
  background: var(--paper-2); border: 1px solid var(--line);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10.5px; letter-spacing: 0.14em; font-weight: 700;
}
.cvg-mode-toggle button {
  appearance: none; border: 0;
  background: transparent; cursor: pointer;
  padding: 6px 14px; min-width: 44px;
  color: var(--muted);
  border-radius: 999px;
  transition: background .15s ease, color .15s ease;
}
.cvg-mode-toggle button:hover { color: var(--ink); }
.cvg-mode-toggle button.on {
  background: var(--pf-convergens); color: white;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--pf-convergens) 60%, transparent);
}

/* Layer filter data-source attribution */
.cvg-flt-meta {
  font-family: 'JetBrains Mono', monospace;
  font-size: 8.5px; letter-spacing: 0.08em;
  color: var(--muted);
  padding: 0 10px 8px 28px;
  margin-top: -3px;
  line-height: 1.45;
}
.cvg-worldmap-filters h5:not(:first-child) { margin-top: 18px; }
.cvg-worldmap-filters .cvg-ai-mini {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.12em; font-weight: 700;
  color: var(--pf-convergens);
  padding: 3px 7px; border-radius: 999px;
  background: color-mix(in srgb, var(--pf-convergens) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--pf-convergens) 22%, transparent);
  margin-left: 6px;
}
.cvg-worldmap-filters .cvg-ai-mini .d {
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--pf-convergens);
  animation: cvgLive 1.8s infinite ease-out;
}

/* Section‐head responsive */
.cvg-section-head { flex-wrap: wrap; }
.cvg-section-head .right.has-control {
  display: flex; align-items: center; gap: 12px;
  font-family: 'JetBrains Mono', monospace; font-size: 10px;
  letter-spacing: 0.12em; color: var(--muted);
}

/* Country detail card in Regional Focus */
.cvg-country-detail {
  border: 1px solid var(--pf-convergens);
  border-radius: 14px; padding: 18px 20px;
  background: color-mix(in srgb, var(--pf-convergens) 8%, var(--paper));
  display: none;
}
.cvg-country-detail.open { display: block; animation: cvgFadeIn .35s ease both; }
@keyframes cvgFadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.cvg-country-detail .head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 12px;
}
.cvg-country-detail .head .iso {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.18em; font-weight: 700;
  color: var(--pf-convergens);
  padding: 3px 8px; border-radius: 4px;
  background: color-mix(in srgb, var(--pf-convergens) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--pf-convergens) 25%, transparent);
}
.cvg-country-detail h4 {
  font-size: 18px; font-weight: 700; letter-spacing: -0.01em;
  margin: 0 0 4px;
}
.cvg-country-detail .role {
  font-size: 12px; color: var(--muted); margin-bottom: 12px;
}
.cvg-country-detail .rows {
  display: flex; flex-direction: column; gap: 6px;
  font-size: 12.5px;
}
.cvg-country-detail .rows .r {
  display: flex; align-items: center; justify-content: space-between;
  padding: 7px 10px; border-radius: 8px;
  background: var(--paper);
  border: 1px solid var(--line);
}
.cvg-country-detail .rows .r .k {
  display: inline-flex; align-items: center; gap: 7px;
  color: var(--ink-2);
}
.cvg-country-detail .rows .r .k i {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--c, var(--pf-convergens));
}
.cvg-country-detail .rows .r .v {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.12em; font-weight: 700;
  color: var(--c, var(--pf-convergens));
  text-transform: uppercase;
}
.cvg-country-detail .actions {
  display: flex; gap: 8px; margin-top: 14px;
}
.cvg-country-detail .actions button {
  flex: 1; padding: 8px 10px;
  border: 1px solid var(--line); background: var(--paper);
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.1em;
  color: var(--ink-2); cursor: pointer; border-radius: 8px;
  transition: background .15s ease, color .15s ease;
}
.cvg-country-detail .actions button:hover { background: var(--paper-2); }
.cvg-country-detail .actions button.primary {
  background: var(--pf-convergens); color: white; border-color: var(--pf-convergens);
}

/* Responsive tweaks for the new world map */
@media (max-width: 1100px) {
  .cvg-worldmap-wrap { grid-template-columns: 1fr; }
  .cvg-worldmap-wrap .cvg-map-side { border-right: 0; border-bottom: 1px solid var(--line); }
  .cvg-worldmap-wrap .cvg-map-side.right { border-left: 0; border-top: 1px solid var(--line); }
  .cvg-worldmap { min-height: 460px; }
}
@media (max-width: 700px) {
  .cvg-worldmap { min-height: 360px; }
  .cvg-mode-toggle button { padding: 6px 10px; min-width: auto; }
  .cvg-flt-meta { display: none; }
}


/* ============== LANGUAGE PICKER ============== */
.lang-toggle {
  position: relative;
  width: 38px; height: 38px;
  border-radius: 50%;
  border: 1px solid var(--line);
  background: var(--paper);
  color: var(--ink);
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
}
.lang-toggle:hover { background: var(--paper-2); border-color: var(--line-2); }
.lang-toggle svg { width: 18px; height: 18px; }
.lang-toggle .lang-code {
  position: absolute; bottom: -4px; right: -4px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 8.5px; letter-spacing: 0.04em; font-weight: 700;
  background: var(--ink); color: var(--paper);
  padding: 2px 4px; border-radius: 3px;
  pointer-events: none;
}
.lang-pop {
  position: absolute; right: 0; top: calc(100% + 8px);
  width: 320px;
  background: var(--paper); border: 1px solid var(--line); border-radius: 14px;
  box-shadow: 0 24px 50px -22px rgba(0,0,0,0.25);
  padding: 12px;
  opacity: 0; pointer-events: none;
  transform: translateY(8px);
  transition: opacity .18s ease, transform .18s ease;
  z-index: 90;
}
.lang-toggle.open .lang-pop {
  opacity: 1; pointer-events: auto; transform: translateY(0);
}
.lang-pop h6 {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.18em; font-weight: 700;
  color: var(--muted); text-transform: uppercase;
  margin: 6px 4px 8px;
}
.lang-pop .row { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.lang-pop .row.three { grid-template-columns: 1fr 1fr 1fr; }
.lang-pop button {
  appearance: none; cursor: pointer;
  background: transparent; border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  font-family: 'Manrope', sans-serif;
  font-size: 12.5px; color: var(--ink-2);
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  text-align: left;
  transition: background .15s ease, border-color .15s ease;
}
.lang-pop button:hover { background: var(--paper-2); }
.lang-pop button.on {
  background: color-mix(in srgb, var(--brand-blue) 8%, var(--paper));
  border-color: var(--brand-blue);
  color: var(--ink);
}
.lang-pop button .code {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9.5px; letter-spacing: 0.1em;
  color: var(--muted); font-weight: 700;
}
.lang-pop .ai-note {
  font-size: 10.5px; color: var(--muted);
  padding: 4px 6px 0;
  line-height: 1.45;
}
.lang-pop .ai-note .pill {
  display: inline-block;
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; letter-spacing: 0.12em; font-weight: 700;
  color: var(--brand-blue);
  background: color-mix(in srgb, var(--brand-blue) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--brand-blue) 28%, transparent);
  padding: 2px 6px; border-radius: 999px;
  margin-right: 6px;
}
.lang-pop details summary {
  list-style: none; cursor: pointer;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10.5px; letter-spacing: 0.12em; font-weight: 700;
  color: var(--muted); text-transform: uppercase;
  padding: 8px 4px;
  display: flex; align-items: center; gap: 6px;
  user-select: none;
}
.lang-pop details summary::-webkit-details-marker { display: none; }
.lang-pop details summary::before {
  content: "▸"; transition: transform .15s ease;
}
.lang-pop details[open] summary::before { transform: rotate(90deg); }
.lang-pop details .row { margin-top: 4px; }

/* Dark mode contrast — keep buttons readable */
html[data-theme="dark"] .btn-link { color: var(--ink-2); }
html[data-theme="dark"] .btn-link:hover { color: var(--ink); }
html[data-theme="dark"] .btn-ghost { color: var(--ink); }
html[data-theme="dark"] .lang-toggle { background: var(--paper); color: var(--ink); border-color: var(--line-2); }
html[data-theme="dark"] .lang-pop { box-shadow: 0 24px 50px -22px rgba(0,0,0,0.8); }
html[data-theme="dark"] .lang-pop button.on { background: color-mix(in srgb, var(--brand-blue) 18%, var(--paper)); }