/* ═══════════════════════════════════════════
   WARD pSEO — Master Stylesheet
   getward.ai · v2.0
   ═══════════════════════════════════════════ */

:root {
  --wd-forest:      #1e3a2f;
  --wd-forest-mid:  #2d5543;
  --wd-forest-hi:   #3d7a5c;
  --wd-forest-pale: #e8f0eb;
  --wd-forest-dim:  rgba(30,58,47,0.08);
  --wd-forest-glow: rgba(30,58,47,0.04);

  --wd-amber:       #c47c2b;
  --wd-amber-pale:  #faf0e0;
  --wd-amber-dim:   rgba(196,124,43,0.12);

  --wd-cream:       #faf8f3;
  --wd-cream-2:     #f3f0e8;
  --wd-cream-3:     #e8e4d8;
  --wd-ink:         #1a1a14;
  --wd-stone:       #9a9585;
  --wd-stone-mid:   #6b6659;
  --wd-stone-dark:  #3d3a32;
  --wd-white:       #ffffff;
  --wd-success:     #22c55e;
  --wd-danger:      #ef4444;

  --wd-border:      rgba(26,26,20,0.10);
  --wd-border-md:   rgba(26,26,20,0.18);
  --wd-border-lg:   rgba(26,26,20,0.28);

  --wd-font-display: 'Fraunces', Georgia, serif;
  --wd-font-body:    'DM Sans', system-ui, sans-serif;
  --wd-font-data:    'DM Mono', 'Courier New', monospace;

  --wd-r-sm: 6px;
  --wd-r-md: 10px;
  --wd-r-lg: 14px;
  --wd-r-xl: 20px;
  --wd-r-pill: 100px;

  --wd-shadow-sm:   0 1px 3px rgba(26,26,20,0.04);
  --wd-shadow-md:   0 4px 16px rgba(26,26,20,0.06);
  --wd-shadow-lg:   0 8px 32px rgba(26,26,20,0.08);
  --wd-shadow-glow: 0 0 60px rgba(30,58,47,0.08);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; overflow-x: clip; }

body {
  background: var(--wd-cream);
  color: var(--wd-ink);
  font-family: var(--wd-font-body);
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ── LAYOUT ── */
.page { max-width: 1140px; margin: 0 auto; padding: 0 40px; }
@media(max-width:700px) { .page { padding: 0 20px; } }

/* ── GRAIN ── */
.grain {
  position: fixed; inset: 0; pointer-events: none; z-index: 0;
  opacity: 0.35;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  background-size: 256px 256px;
}

/* ── NAV ── */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 2000;
  background: rgba(250,248,243,0.88);
  backdrop-filter: blur(20px) saturate(1.2);
  -webkit-backdrop-filter: blur(20px) saturate(1.2);
  border-bottom: 1px solid var(--wd-border);
  transition: box-shadow 0.3s;
}
nav.scrolled { box-shadow: 0 1px 8px rgba(26,26,20,0.06); }
.nav-inner {
  max-width: 1140px; margin: 0 auto; padding: 0 40px;
  height: 56px; display: flex; align-items: center; justify-content: space-between;
}
.nav-logo {
  display: flex; align-items: center; gap: 10px;
  text-decoration: none;
}
.nav-mark {
  width: 28px; height: 28px; border-radius: 7px;
  background: var(--wd-forest);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; box-shadow: 0 2px 8px rgba(30,58,47,0.2);
}
.nav-mark svg { width: 14px; height: 14px; }
.nav-wordmark {
  font-family: var(--wd-font-display);
  font-size: 17px; font-weight: 700;
  color: var(--wd-ink); letter-spacing: -0.02em;
}
.nav-links {
  display: flex; gap: 8px; list-style: none; align-items: center;
}
.nav-links a {
  font-family: var(--wd-font-data);
  font-size: 11px; font-weight: 500; letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--wd-stone-mid); text-decoration: none;
  transition: color 0.2s;
}
.nav-links a:hover { color: var(--wd-ink); }
.nav-cta {
  font-family: var(--wd-font-data) !important;
  padding: 8px 18px; border-radius: var(--wd-r-pill);
  background: var(--wd-forest); color: var(--wd-white) !important;
  transition: all 0.25s;
  margin-left: 4px;
}
.nav-cta:hover { background: var(--wd-forest-mid); transform: translateY(-1px); }
.nav-mobile-toggle {
  display: none; background: none; border: none;
  color: var(--wd-ink); cursor: pointer; padding: 8px;
}
@media(max-width:768px) {
  .nav-links { display: none; }
  .nav-mobile-toggle { display: block; }
  .nav-inner { padding: 0 20px; }
}

/* ── BUTTONS ── */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--wd-font-body);
  font-size: 14px; font-weight: 500;
  text-decoration: none;
  padding: 12px 24px; border-radius: var(--wd-r-md);
  transition: all 0.25s ease;
  cursor: pointer; border: none;
}
.btn-forest {
  background: var(--wd-forest); color: var(--wd-white);
  box-shadow: 0 2px 12px rgba(30,58,47,0.2);
}
.btn-forest:hover {
  background: var(--wd-forest-mid);
  box-shadow: 0 4px 20px rgba(30,58,47,0.25);
  transform: translateY(-1px);
}
.btn-outline {
  background: transparent; color: var(--wd-ink);
  border: 1.5px solid var(--wd-border-md);
}
.btn-outline:hover { border-color: var(--wd-forest); color: var(--wd-forest); }
.btn-ghost {
  background: transparent; color: var(--wd-stone-mid);
  padding: 12px 16px;
}
.btn-ghost:hover { color: var(--wd-forest); }

/* ── HERO ── */
.hero {
  position: relative; z-index: 1; overflow: hidden;
}
.hero-glow, .hero-glow-2 {
  position: absolute; border-radius: 50%; pointer-events: none; z-index: 0;
}
.hero-glow {
  top: -200px; right: -100px; width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(30,58,47,0.06) 0%, transparent 60%);
}
.hero-glow-2 {
  bottom: -150px; left: -80px; width: 400px; height: 400px;
  background: radial-gradient(circle, rgba(196,124,43,0.04) 0%, transparent 60%);
}
.hero-content { position: relative; z-index: 1; }

.hero-eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--wd-forest-pale); border: 1px solid rgba(30,58,47,0.18);
  border-radius: var(--wd-r-pill); padding: 5px 14px 5px 8px;
  margin-bottom: 32px; animation: fadeUp 0.6s ease both;
}
.hero-eyebrow-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--wd-forest-hi); animation: pulse 2.5s infinite;
}
@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(0.85); }
}
.hero-eyebrow-text {
  font-family: var(--wd-font-data);
  font-size: 11px; letter-spacing: 0.06em;
  color: var(--wd-forest); font-weight: 500;
}

h1.hero-title {
  font-family: var(--wd-font-display);
  font-size: clamp(42px, 7vw, 80px);
  font-weight: 900; line-height: 0.96;
  letter-spacing: -0.04em; color: var(--wd-ink);
  margin-bottom: 24px; animation: fadeUp 0.6s ease 0.1s both;
}
h1.hero-title .green { color: var(--wd-forest); }
h1.hero-title em { font-style: italic; font-weight: 400; color: var(--wd-stone-mid); }

.hero-sub {
  font-size: 17px; font-weight: 300;
  color: var(--wd-stone-mid); max-width: 600px;
  line-height: 1.65; margin: 0 auto 36px;
  animation: fadeUp 0.6s ease 0.2s both;
}

/* ── HERO VERTICAL STATS ── */
.hero-trust {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin-bottom: 28px;
  animation: fadeUp 0.6s ease 0.25s both;
}
.hero-trust .trust-bar-label {
  font-family: var(--wd-font-data);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--wd-stone);
}
.hero-trust .trust-name {
  font-family: var(--wd-font-body);
  font-size: 14px;
  font-weight: 600;
  color: var(--wd-ink);
  letter-spacing: -0.01em;
  white-space: nowrap;
}
@media (max-width: 480px) {
  .hero-trust {
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }
}

.hero-actions {
  display: flex; gap: 12px; align-items: center; justify-content: center; flex-wrap: wrap;
  animation: fadeUp 0.6s ease 0.3s both;
}

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

/* ── TRUST BAR ── */
.trust-bar {
  background: var(--wd-white);
  border-top: 1px solid var(--wd-border);
  padding: 18px 0;
  position: relative; z-index: 1;
}
.trust-bar-inner {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}
.trust-bar-label {
  font-family: var(--wd-font-data);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--wd-stone);
  white-space: nowrap;
}
.trust-bar-names {
  display: flex;
  align-items: center;
  gap: 12px;
}
.trust-name {
  font-family: var(--wd-font-body);
  font-size: 14px;
  font-weight: 600;
  color: var(--wd-ink);
  letter-spacing: -0.01em;
  white-space: nowrap;
}
.trust-name-dot {
  width: 3px; height: 3px;
  border-radius: 50%;
  background: var(--wd-stone);
  flex-shrink: 0;
}
.trust-bar-divider {
  width: 1px;
  height: 24px;
  background: var(--wd-border-md);
  flex-shrink: 0;
}
.trust-bar-context {
  font-family: var(--wd-font-body);
  font-size: 12.5px;
  color: var(--wd-stone-mid);
  line-height: 1.5;
}
@media (max-width: 768px) {
  .trust-bar-inner { flex-direction: column; align-items: flex-start; gap: 12px; }
  .trust-bar-divider { width: 100%; height: 1px; }
}

/* ── TICKER ── */
.ticker-strip {
  border-top: 1px solid var(--wd-border);
  border-bottom: 1px solid var(--wd-border);
  background: var(--wd-white);
  padding: 14px 0; overflow: hidden;
  position: relative; z-index: 1;
}
.ticker-track {
  display: flex; gap: 48px;
  animation: tickerScroll 40s linear infinite;
  width: max-content;
}
@keyframes tickerScroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.ticker-item {
  display: flex; align-items: center; gap: 8px; white-space: nowrap;
  font-family: var(--wd-font-data);
  font-size: 11px; letter-spacing: 0.04em; color: var(--wd-stone);
}
.ticker-item .val { font-weight: 500; color: var(--wd-ink); }
.ticker-item .up { color: var(--wd-success); }
.ticker-item .dn { color: var(--wd-danger); }
.ticker-item .sep {
  width: 3px; height: 3px; border-radius: 50%;
  background: var(--wd-cream-3); flex-shrink: 0;
}

/* ── SECTIONS ── */
section {
  padding: 72px 0;
  position: relative; z-index: 1;
}
section + section { border-top: 1px solid var(--wd-border); }
section.bg-white { background: var(--wd-white); }

.section-label {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--wd-stone); margin-bottom: 16px;
}
.section-n {
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--wd-cream-2); border: 1px solid var(--wd-border-md);
  display: flex; align-items: center; justify-content: center;
  font-size: 9px; font-weight: 600; color: var(--wd-stone-mid); flex-shrink: 0;
}
h2.section-heading {
  font-family: var(--wd-font-display);
  font-size: clamp(30px, 4.5vw, 48px);
  font-weight: 800; letter-spacing: -0.035em;
  line-height: 1.0; color: var(--wd-ink); margin-bottom: 14px;
}
.section-desc {
  font-size: 15px; font-weight: 300;
  color: var(--wd-stone-mid); max-width: 520px;
  line-height: 1.65; margin-bottom: 36px;
}

/* ── INSIGHT CARDS ── */
.insight-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
}
@media(max-width:900px) { .insight-grid { grid-template-columns: repeat(2, 1fr); } }
@media(max-width:600px) { .insight-grid { grid-template-columns: 1fr; } }

.insight-card {
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg);
  padding: 28px 24px; position: relative; overflow: hidden;
  transition: all 0.3s ease; text-decoration: none; color: inherit; display: block;
}
.insight-card:hover {
  border-color: var(--wd-border-md);
  box-shadow: var(--wd-shadow-md);
  transform: translateY(-2px);
}
.insight-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0;
  height: 3px; border-radius: 3px 3px 0 0;
}
.insight-card.card-forest::before { background: var(--wd-forest); }
.insight-card.card-amber::before { background: var(--wd-amber); }
.insight-card.card-success::before { background: var(--wd-success); }

.ic-icon {
  width: 36px; height: 36px; border-radius: 9px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 16px; flex-shrink: 0;
}
.ic-icon.forest { background: var(--wd-forest-pale); color: var(--wd-forest); }
.ic-icon.amber { background: var(--wd-amber-pale); color: var(--wd-amber); }

.ic-category {
  font-family: var(--wd-font-data);
  font-size: 9px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--wd-stone); margin-bottom: 8px;
}
.ic-title {
  font-family: var(--wd-font-display);
  font-size: 18px; font-weight: 700; letter-spacing: -0.02em;
  color: var(--wd-ink); margin-bottom: 8px; line-height: 1.2;
}
.ic-desc {
  font-size: 13px; color: var(--wd-stone-mid);
  line-height: 1.6; margin-bottom: 16px;
}
.ic-metric {
  display: flex; align-items: baseline; gap: 6px;
  padding-top: 14px; border-top: 1px solid var(--wd-border);
}
.ic-metric-val {
  font-family: var(--wd-font-display);
  font-size: 22px; font-weight: 800; color: var(--wd-ink); letter-spacing: -0.02em;
}
.ic-metric-label {
  font-family: var(--wd-font-data);
  font-size: 10px; color: var(--wd-stone); letter-spacing: 0.06em;
}

/* ── HOW IT WORKS ── */
.how-grid {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0;
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg);
  background: var(--wd-cream); overflow: hidden;
}
@media(max-width:800px) { .how-grid { grid-template-columns: 1fr; } }

.how-step {
  padding: 40px 32px;
  border-right: 1px solid var(--wd-border);
}
.how-step:last-child { border-right: none; }
@media(max-width:800px) {
  .how-step { border-right: none; border-bottom: 1px solid var(--wd-border); }
  .how-step:last-child { border-bottom: none; }
}
.how-step-n {
  font-family: var(--wd-font-display);
  font-size: 48px; font-weight: 300; color: var(--wd-forest-pale);
  letter-spacing: -0.04em; line-height: 1; margin-bottom: 20px;
}
.how-step-title {
  font-family: var(--wd-font-display);
  font-size: 20px; font-weight: 700; color: var(--wd-ink);
  letter-spacing: -0.02em; margin-bottom: 10px;
}
.how-step-desc {
  font-size: 14px; color: var(--wd-stone-mid); line-height: 1.65;
}
.how-step-tag {
  display: inline-flex; align-items: center; gap: 4px;
  margin-top: 16px;
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.08em;
  color: var(--wd-forest); font-weight: 500;
  padding: 4px 10px; border-radius: var(--wd-r-pill);
  background: var(--wd-forest-pale);
}

/* ── COMPARISON CARDS ── */
.compare-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
}
@media(max-width:700px) { .compare-grid { grid-template-columns: 1fr; } }

.compare-card { border-radius: var(--wd-r-lg); padding: 32px; }
.compare-card.old {
  background: var(--wd-cream-2); border: 1px solid var(--wd-border);
}
.compare-card.new {
  background: var(--wd-forest); color: var(--wd-white);
  border: 1px solid var(--wd-forest); box-shadow: var(--wd-shadow-glow);
}
.compare-label {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase;
  margin-bottom: 16px;
}
.compare-card.old .compare-label { color: var(--wd-stone); }
.compare-card.new .compare-label { color: rgba(255,255,255,0.5); }
.compare-title {
  font-family: var(--wd-font-display);
  font-size: 22px; font-weight: 700; letter-spacing: -0.02em;
  margin-bottom: 16px; line-height: 1.15;
}
.compare-card.old .compare-title { color: var(--wd-stone-dark); }
.compare-list { list-style: none; }
.compare-list li {
  font-size: 14px; line-height: 1.6; padding: 8px 0;
  border-bottom: 1px solid rgba(0,0,0,0.06);
  display: flex; align-items: flex-start; gap: 8px;
}
.compare-card.new .compare-list li { border-bottom-color: rgba(255,255,255,0.1); color: rgba(255,255,255,0.85); }
.compare-card.old .compare-list li { color: var(--wd-stone-mid); }
.compare-list li:last-child { border-bottom: none; }
.compare-list li .icon { flex-shrink: 0; font-size: 13px; margin-top: 3px; }

/* ── KPI GRID ── */
.kpi-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px;
}
@media(max-width:900px) { .kpi-grid { grid-template-columns: repeat(2, 1fr); } }
@media(max-width:500px) { .kpi-grid { grid-template-columns: 1fr; } }

.kpi-card {
  background: var(--wd-white); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md); padding: 20px;
  transition: all 0.25s; text-decoration: none; color: inherit; display: block;
}
.kpi-card:hover { border-color: var(--wd-forest); box-shadow: var(--wd-shadow-sm); }
.kpi-abbr {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--wd-forest); font-weight: 500; margin-bottom: 6px;
}
.kpi-name {
  font-family: var(--wd-font-display);
  font-size: 15px; font-weight: 700; color: var(--wd-ink);
  letter-spacing: -0.01em; margin-bottom: 6px; line-height: 1.2;
}
.kpi-def {
  font-size: 12px; color: var(--wd-stone-mid); line-height: 1.55;
}

/* ── BREADCRUMBS ── */
.breadcrumbs {
  padding: 80px 0 16px; position: relative; z-index: 1;
}
.breadcrumbs ol {
  list-style: none; display: flex; align-items: center; gap: 6px;
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.06em; color: var(--wd-stone);
}
.breadcrumbs a { color: var(--wd-stone); text-decoration: none; }
.breadcrumbs a:hover { color: var(--wd-forest); }
.breadcrumbs .sep { color: var(--wd-cream-3); }

/* ── DETAIL PAGE ── */
.detail-hero { padding: 24px 0 80px; position: relative; z-index: 1; overflow: hidden; }
.detail-hero .hero-eyebrow { animation: none; }
.detail-hero h1 {
  font-family: var(--wd-font-display);
  font-size: clamp(36px, 5vw, 56px);
  font-weight: 900; letter-spacing: -0.04em;
  line-height: 1.0; color: var(--wd-ink); margin-bottom: 16px;
}
.detail-hero .hero-sub { animation: none; margin-bottom: 24px; margin-left: 0; margin-right: auto; }
.detail-hero .hero-actions { justify-content: flex-start; }
.hero-stat-callout {
  display: flex; flex-direction: column; gap: 4px;
  border-left: 3px solid var(--wd-forest); padding: 12px 16px;
  margin-bottom: 28px; background: rgba(59,77,63,0.06); border-radius: 0 6px 6px 0;
  max-width: 500px;
}
.hero-stat-text {
  font-size: 15px; font-weight: 500; line-height: 1.5;
  color: var(--wd-slate);
}
.hero-stat-source {
  font-size: 12px; font-weight: 400; color: var(--wd-stone-mid);
  letter-spacing: 0.02em;
}
.detail-hero .page { position: relative; z-index: 1; }

/* ── Detail Hero Split Layout ── */
.detail-hero-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}
.detail-hero-text { min-width: 0; }
.detail-hero-image {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(26,26,20,0.12), 0 2px 8px rgba(26,26,20,0.06);
}
.detail-hero-image img {
  width: 100%;
  height: 360px;
  object-fit: cover;
  display: block;
  border-radius: 12px;
}
.detail-hero-kpis {
  position: absolute;
  bottom: 12px; left: 12px; right: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.detail-hero-kpi {
  background: rgba(30,58,47,0.88);
  color: var(--wd-white);
  font-family: var(--wd-font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.02em;
  padding: 5px 10px;
  border-radius: 6px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
@media (max-width: 900px) {
  .detail-hero-split {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .detail-hero-image { max-width: 520px; }
  .detail-hero-image img { height: 280px; }
}
@media (max-width: 500px) {
  .detail-hero-image img { height: 220px; }
  .detail-hero-kpi { font-size: 10px; padding: 4px 8px; }
}
.detail-hero-canvas {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  pointer-events: none; z-index: 0;
}
.detail-hero .hero-glow, .detail-hero .hero-glow-2 {
  position: absolute; border-radius: 50%; pointer-events: none; z-index: 0;
}
.detail-hero .hero-glow {
  top: -200px; right: -100px; width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(30,58,47,0.06) 0%, transparent 60%);
}
.detail-hero .hero-glow-2 {
  bottom: -150px; left: -80px; width: 400px; height: 400px;
  background: radial-gradient(circle, rgba(196,124,43,0.04) 0%, transparent 60%);
}
.detail-content { padding-bottom: 60px; }
.detail-content h2 {
  font-family: var(--wd-font-display);
  font-size: 24px; font-weight: 700; letter-spacing: -0.02em;
  color: var(--wd-ink); margin: 48px 0 12px;
}
.detail-content p {
  font-size: 15px; color: var(--wd-stone-dark);
  line-height: 1.7; max-width: 640px; margin-bottom: 16px;
}
.detail-content ul {
  list-style: none; max-width: 640px; margin-bottom: 24px;
}
.detail-content ul li {
  font-size: 14px; color: var(--wd-stone-dark); line-height: 1.6;
  padding: 8px 0 8px 20px; border-bottom: 1px solid var(--wd-border);
  position: relative;
}
.detail-content ul li::before {
  content: ''; position: absolute; left: 0; top: 15px;
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--wd-forest-pale); border: 1.5px solid var(--wd-forest);
}

/* ── WARD DEMO BUBBLE ── */
.ward-demo {
  background: var(--wd-white); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg); overflow: hidden;
  box-shadow: var(--wd-shadow-md);
}
.ward-demo-header {
  display: flex; align-items: center; gap: 12px;
  padding: 16px 24px; border-bottom: 1px solid var(--wd-border);
  background: var(--wd-cream);
}
.wd-avatar {
  width: 28px; height: 28px; border-radius: 7px;
  background: var(--wd-forest);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.wd-avatar svg { width: 14px; height: 14px; }
.wd-header-text {
  font-family: var(--wd-font-data);
  font-size: 11px; letter-spacing: 0.06em; color: var(--wd-forest); font-weight: 500;
}
.wd-header-time {
  font-family: var(--wd-font-data);
  font-size: 10px; color: var(--wd-stone); margin-left: auto;
}
.ward-demo-body { padding: 24px; }
.ward-demo-body p {
  font-size: 14px; color: var(--wd-ink); line-height: 1.65; margin-bottom: 16px;
}
.ward-demo-body p strong { font-weight: 600; }
.ward-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.wchip {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.05em;
  padding: 4px 12px; border-radius: var(--wd-r-pill);
  background: var(--wd-cream-2); border: 1px solid var(--wd-border);
  color: var(--wd-stone-mid);
}
.wchip.green { background: rgba(34,197,94,0.08); border-color: rgba(34,197,94,0.2); color: #16a34a; }
.wchip.amber { background: var(--wd-amber-dim); border-color: rgba(196,124,43,0.2); color: var(--wd-amber); }

/* ── Persona-Rotating Morning Brief ── */
.brief-carousel {
  position: relative;
  max-width: 700px;
}
.brief-card {
  opacity: 0;
  position: absolute; top: 0; left: 0; right: 0;
  pointer-events: none;
  transition: opacity 0.6s ease;
}
.brief-card.active {
  opacity: 1;
  position: relative;
  pointer-events: auto;
}
.brief-persona-icon {
  width: 28px; height: 28px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.brief-personas {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin-top: 20px;
}
.brief-persona-btn {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--wd-font-data);
  font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase;
  font-weight: 500;
  padding: 6px 14px; border-radius: var(--wd-r-pill);
  border: 1px solid var(--wd-border-md);
  background: transparent; color: var(--wd-stone-mid);
  cursor: pointer; transition: all 0.25s;
}
.brief-persona-btn:hover {
  border-color: var(--wd-forest); color: var(--wd-forest);
}
.brief-persona-btn.active {
  background: var(--wd-forest); color: var(--wd-white);
  border-color: var(--wd-forest);
}
.brief-persona-btn svg { flex-shrink: 0; }

/* ── FAQ ── */
.faq-list { max-width: 700px; }
.faq-item { border-bottom: 1px solid var(--wd-border); }
.faq-q {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; padding: 20px 0;
  background: transparent; border: none;
  font-family: var(--wd-font-body);
  font-size: 15px; font-weight: 500;
  color: var(--wd-ink); text-align: left; cursor: pointer;
}
.faq-q:hover { color: var(--wd-forest); }
.faq-q .chevron {
  width: 20px; height: 20px; flex-shrink: 0;
  transition: transform 0.3s; color: var(--wd-stone);
}
.faq-item.open .faq-q .chevron { transform: rotate(180deg); }
.faq-a { max-height: 0; overflow: hidden; transition: max-height 0.35s ease; }
.faq-item.open .faq-a { max-height: 300px; padding-bottom: 20px; }
.faq-a p { font-size: 14px; color: var(--wd-stone-mid); line-height: 1.65; }

/* ── CTA ── */
.cta-section {
  background: var(--wd-forest); padding: 80px 0; text-align: center;
  position: relative; overflow: hidden;
}
.cta-section::before {
  content: ''; position: absolute; inset: 0;
  background-image: radial-gradient(rgba(255,255,255,0.04) 1px, transparent 1px);
  background-size: 20px 20px; pointer-events: none;
}
.cta-section h2 {
  font-family: var(--wd-font-display);
  font-size: clamp(32px, 5vw, 52px);
  font-weight: 900; letter-spacing: -0.04em;
  color: var(--wd-white); line-height: 1.0;
  margin-bottom: 16px; position: relative;
}
.cta-section .cta-sub {
  font-size: 16px; color: rgba(255,255,255,0.55);
  font-weight: 300; margin-bottom: 32px; position: relative;
}
.cta-actions {
  display: flex; gap: 12px; justify-content: center; flex-wrap: wrap;
  position: relative;
}
.btn-white {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--wd-white); color: var(--wd-forest);
  font-family: var(--wd-font-body);
  font-size: 14px; font-weight: 600;
  padding: 14px 28px; border-radius: var(--wd-r-md);
  text-decoration: none; border: none; cursor: pointer;
  transition: all 0.25s; box-shadow: 0 2px 12px rgba(0,0,0,0.15);
}
.btn-white:hover { transform: translateY(-2px); box-shadow: 0 4px 24px rgba(0,0,0,0.2); }
.btn-white-outline {
  display: inline-flex; align-items: center; gap: 8px;
  background: transparent; color: rgba(255,255,255,0.7);
  font-family: var(--wd-font-body);
  font-size: 14px; font-weight: 500;
  padding: 14px 28px; border-radius: var(--wd-r-md);
  text-decoration: none; border: 1px solid rgba(255,255,255,0.2);
  cursor: pointer; transition: all 0.25s;
}
.btn-white-outline:hover { border-color: rgba(255,255,255,0.5); color: var(--wd-white); }

/* ── LEAD FORM ── */
.form-section { padding: 80px 0; }
.form-container {
  background: var(--wd-white); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-xl); max-width: 100%;
  overflow: hidden; box-shadow: var(--wd-shadow-md);
}
.form-header { padding: 32px 32px 24px; border-bottom: 1px solid var(--wd-border); }
.lead-form { padding: 32px; }

.form-step { display: none; }
.form-step.active { display: block; }

.step-label {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.08em;
  color: var(--wd-stone); margin-bottom: 20px;
}
.step-bar {
  flex: 1; height: 3px; background: var(--wd-cream-2);
  border-radius: 2px; overflow: hidden;
}
.step-fill { display: block; height: 100%; background: var(--wd-forest); border-radius: 2px; transition: width 0.3s; }

.step-title {
  font-family: var(--wd-font-display);
  font-size: 20px; font-weight: 700; letter-spacing: -0.02em;
  color: var(--wd-ink); margin-bottom: 20px;
}

.checkbox-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
  margin-bottom: 24px;
}
@media(max-width:500px) { .checkbox-grid { grid-template-columns: 1fr; } }

.ck {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 14px; border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md); cursor: pointer;
  font-size: 13px; color: var(--wd-ink);
  transition: all 0.2s;
}
.ck:hover { border-color: var(--wd-forest); }
.ck input { display: none; }
.ck-box {
  width: 18px; height: 18px; border: 1.5px solid var(--wd-border-md);
  border-radius: 4px; flex-shrink: 0; position: relative;
  transition: all 0.2s;
}
.ck input:checked ~ .ck-box {
  background: var(--wd-forest); border-color: var(--wd-forest);
}
.ck input:checked ~ .ck-box::after {
  content: ''; position: absolute; left: 5px; top: 2px;
  width: 5px; height: 9px; border: solid var(--wd-white);
  border-width: 0 2px 2px 0; transform: rotate(45deg);
}

.field-group {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
  margin-bottom: 16px;
}
@media(max-width:500px) { .field-group { grid-template-columns: 1fr; } }

.field { display: flex; flex-direction: column; gap: 4px; }
.field-label {
  font-size: 12px; font-weight: 500; color: var(--wd-ink);
}
.field-input {
  padding: 10px 14px; border: 1px solid var(--wd-border-md);
  border-radius: var(--wd-r-md); font-family: var(--wd-font-body);
  font-size: 14px; color: var(--wd-ink);
  background: var(--wd-cream); transition: border-color 0.2s;
  -webkit-appearance: none;
}
.field-input:focus {
  outline: none; border-color: var(--wd-forest);
  box-shadow: 0 0 0 3px rgba(30,58,47,0.08);
}
select.field-input { cursor: pointer; }

.form-nav {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 24px;
}

.form-success { text-align: center; padding: 48px 32px; }
.success-icon { margin-bottom: 16px; }
.success-title {
  font-family: var(--wd-font-display);
  font-size: 24px; font-weight: 700; color: var(--wd-ink);
  margin-bottom: 8px;
}
.success-desc {
  font-size: 14px; color: var(--wd-stone-mid);
  line-height: 1.65; margin-bottom: 24px;
}

/* ── VERTICAL TABS ── */
.vert-tabs {
  display: flex; gap: 0;
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg);
  overflow: hidden; background: var(--wd-white);
}
@media(max-width:800px) { .vert-tabs { flex-direction: column; } }
.vert-tab-nav {
  min-width: 220px; border-right: 1px solid var(--wd-border);
  background: var(--wd-cream-2); padding: 8px;
}
@media(max-width:800px) {
  .vert-tab-nav {
    border-right: none; border-bottom: 1px solid var(--wd-border);
    display: flex; overflow-x: auto; gap: 4px; min-width: 0;
  }
}
.vtab-btn {
  display: block; width: 100%; text-align: left;
  padding: 12px 16px; border: none; background: transparent;
  font-family: var(--wd-font-body); font-size: 13px; font-weight: 500;
  color: var(--wd-stone-mid); border-radius: var(--wd-r-md);
  cursor: pointer; transition: all 0.2s; white-space: nowrap;
}
.vtab-btn:hover { color: var(--wd-ink); background: var(--wd-cream-3); }
.vtab-btn.active {
  background: var(--wd-white); color: var(--wd-forest);
  box-shadow: var(--wd-shadow-sm); font-weight: 600;
}
.vert-tab-content { flex: 1; padding: 36px; }
.vtab-panel { display: none; }
.vtab-panel.active { display: block; }

/* ── FOOTER ── */
footer {
  border-top: 1px solid var(--wd-border);
  padding: 48px 0; position: relative; z-index: 1;
}
.footer-inner {
  max-width: 1140px; margin: 0 auto; padding: 0 40px;
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 16px;
}
.footer-left { display: flex; align-items: center; gap: 12px; }
.footer-mark { color: var(--wd-ink); }
.footer-wm {
  font-family: var(--wd-font-display);
  font-size: 17px; font-weight: 700; color: var(--wd-ink);
}
.footer-dot { width: 3px; height: 3px; border-radius: 50%; background: var(--wd-stone); }
.footer-domain {
  font-family: var(--wd-font-data);
  font-size: 11px; color: var(--wd-stone); letter-spacing: 0.04em;
}
.footer-links { display: flex; gap: 20px; list-style: none; }
.footer-links a {
  font-family: var(--wd-font-data);
  font-size: 11px; color: var(--wd-stone); text-decoration: none;
  letter-spacing: 0.04em; transition: color 0.2s;
}
.footer-links a:hover { color: var(--wd-forest); }
.footer-legal {
  width: 100%; text-align: center;
  margin-top: 16px; padding-top: 16px;
  border-top: 1px solid var(--wd-border);
}
.footer-legal a {
  font-family: var(--wd-font-data);
  font-size: 10px; color: var(--wd-stone); text-decoration: none;
  letter-spacing: 0.04em; transition: color 0.2s;
}
.footer-legal a:hover { color: var(--wd-forest); }
.footer-legal-dot {
  display: inline-block;
  width: 3px; height: 3px; border-radius: 50%;
  background: var(--wd-stone); margin: 0 10px;
  vertical-align: middle;
}
.footer-copy {
  width: 100%; text-align: center;
  font-size: 11px; color: var(--wd-stone);
  margin-top: 12px;
}

/* ── SCROLL REVEAL ── */
.reveal {
  opacity: 0; transform: translateY(20px);
  transition: all 0.7s cubic-bezier(0.16,1,0.3,1);
}
.reveal.visible { opacity: 1; transform: translateY(0); }

/* ── RESPONSIVE ── */
@media(max-width:700px) {
  .hero-actions { flex-direction: column; align-items: stretch; }
  .compare-grid { grid-template-columns: 1fr; }
  .footer-inner { flex-direction: column; align-items: flex-start; }
}

/* ═══════════════════════════════════════════
   MEGA MENU — v2.0 addition
   ═══════════════════════════════════════════ */
.nav-has-mega { position: static; }
.nav-link-btn, .nav-link-simple {
  font-family: var(--wd-font-data);
  font-size: 11px; font-weight: 500; letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--wd-stone-mid); text-decoration: none;
  background: none; border: none; cursor: pointer;
  display: inline-flex; align-items: center; gap: 5px;
  padding: 8px 12px; border-radius: var(--wd-r-sm);
  transition: color 0.2s, background 0.2s;
}
.nav-link-btn:hover, .nav-link-simple:hover {
  color: var(--wd-ink);
  background: var(--wd-forest-dim);
}
.nav-chev { transition: transform 0.25s; }
.nav-has-mega.open .nav-chev { transform: rotate(180deg); }
.nav-has-mega.open .nav-link-btn {
  color: var(--wd-forest);
  background: var(--wd-forest-pale);
}

/* Nav security pill */
.nav-security-pill {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: var(--wd-font-data);
  font-size: 9px; font-weight: 500; letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--wd-forest); background: var(--wd-forest-pale);
  border: 1px solid rgba(30,58,47,0.15);
  padding: 4px 10px; border-radius: var(--wd-r-pill);
  white-space: nowrap;
}
.nav-security-pill svg { flex-shrink: 0; }

/* Nav: Trust link with audience pill (IT / Procurement) */
.nav-link-gov { gap: 8px; }
.nav-link-aud {
  display: inline-flex; align-items: center;
  font-family: var(--wd-font-data);
  font-size: 8.5px; font-weight: 500; letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wd-forest); background: var(--wd-forest-pale);
  border: 1px solid rgba(30,58,47,0.15);
  padding: 2px 7px; border-radius: var(--wd-r-pill);
  white-space: nowrap;
}
.nav-link-simple.nav-link-gov:hover .nav-link-aud {
  background: rgba(30,58,47,0.14);
  border-color: rgba(30,58,47,0.22);
}
@media (max-width: 1100px) and (min-width: 769px) {
  .nav-link-aud { display: none; }
}

.mega {
  position: absolute; top: calc(100% + 8px); left: 50%;
  transform: translateX(-50%) translateY(4px);
  opacity: 0; visibility: hidden;
  pointer-events: none;
  transition: all 0.25s cubic-bezier(0.16,1,0.3,1);
  z-index: 2000;
}
.nav-has-mega.open .mega {
  opacity: 1; visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.mega-inner {
  display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.2fr) minmax(220px, 0.9fr);
  gap: 0;
  background: var(--wd-white);
  border: 1px solid var(--wd-border-md);
  border-radius: var(--wd-r-lg);
  box-shadow: 0 12px 48px rgba(26,26,20,0.12), 0 2px 8px rgba(26,26,20,0.06);
  width: calc(100vw - 48px); max-width: 1200px;
  overflow: hidden;
}
.mega-inner-compact { min-width: 600px; grid-template-columns: 1fr 1fr; }

.mega-col { padding: 20px 20px; border-right: 1px solid var(--wd-border); }
.mega-col:last-child { border-right: none; }
.mega-col-highlight {
  background: var(--wd-forest-pale);
  border-right: none;
}
.mega-col-label {
  font-family: var(--wd-font-data);
  font-size: 8px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--wd-stone); margin-bottom: 8px; font-weight: 500;
}

.mega-link {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 10px; margin: 1px -10px;
  border-radius: var(--wd-r-sm);
  text-decoration: none; color: var(--wd-ink);
  transition: background 0.15s;
}
.mega-link:hover { background: var(--wd-cream-2); }
.mega-link-icon {
  width: 22px; height: 22px; border-radius: 5px;
  background: var(--wd-forest); color: var(--wd-white);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--wd-font-data); font-size: 9px; font-weight: 600;
  flex-shrink: 0;
}
.mega-link-name {
  font-size: 11.5px; font-weight: 500; color: var(--wd-ink);
  white-space: nowrap;
}
.mega-link-meta {
  font-family: var(--wd-font-data);
  font-size: 9px; color: var(--wd-stone); letter-spacing: 0.04em;
  margin-left: auto; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis; max-width: 45%;
  text-align: right; flex-shrink: 1;
}
.mega-link-viewall {
  margin-top: 6px; padding-top: 8px;
  border-top: 1px solid var(--wd-border);
}
.mega-link-viewall .mega-link-name,
.mega-link-viewall {
  font-size: 10.5px; font-weight: 600; color: var(--wd-forest);
}

.mega-featured {
  background: var(--wd-white); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md); padding: 14px; margin-top: 4px;
}
.mega-featured-title {
  font-family: var(--wd-font-display);
  font-size: 14px; font-weight: 700; color: var(--wd-ink);
  letter-spacing: -0.02em; margin-bottom: 4px;
  line-height: 1.3;
}
.mega-featured-desc {
  font-size: 11px; color: var(--wd-stone-mid); line-height: 1.4;
  margin-bottom: 8px;
}
.mega-featured-link {
  font-family: var(--wd-font-data);
  font-size: 10px; color: var(--wd-forest); text-decoration: none;
  font-weight: 500; letter-spacing: 0.04em;
}
.mega-featured-link:hover { text-decoration: underline; }

/* Mega overlay */
.mega-overlay {
  position: fixed; inset: 0; z-index: 1500;
  background: rgba(26,26,20,0.08);
  opacity: 0; visibility: hidden;
  transition: all 0.2s;
}
.mega-overlay.active { opacity: 1; visibility: visible; }


/* ── SECURITY & TRUST BADGES ── */
.security-strip {
  background: var(--wd-forest);
  padding: 14px 0;
  position: relative; z-index: 1;
}
.security-strip-inner {
  display: flex; align-items: center; justify-content: center;
  gap: 32px; flex-wrap: wrap;
}
.security-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  white-space: nowrap;
}
.security-badge svg { flex-shrink: 0; color: rgba(255,255,255,0.5); }
.security-badge strong { color: rgba(255,255,255,0.95); font-weight: 600; }
.security-badge-divider {
  width: 1px; height: 16px;
  background: rgba(255,255,255,0.15);
  flex-shrink: 0;
}

.trust-badge-inline {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--wd-forest); font-weight: 500;
  padding: 5px 12px; border-radius: var(--wd-r-pill);
  background: var(--wd-forest-pale);
  border: 1px solid rgba(30,58,47,0.12);
  white-space: nowrap;
}
.trust-badge-inline svg { flex-shrink: 0; }

.security-section {
  background: var(--wd-forest);
  padding: 80px 0;
  position: relative; z-index: 1;
  color: var(--wd-white);
}
.security-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
  margin-top: 48px;
}
.security-card {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--wd-r-md); padding: 28px 24px;
  transition: background 0.2s;
}
.security-card:hover { background: rgba(255,255,255,0.1); }
.security-card-icon {
  width: 40px; height: 40px; border-radius: 10px;
  background: rgba(255,255,255,0.08);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 16px; color: rgba(255,255,255,0.7);
}
.security-card-title {
  font-family: var(--wd-font-display);
  font-size: 16px; font-weight: 700; color: var(--wd-white);
  letter-spacing: -0.01em; margin-bottom: 6px;
}
.security-card-desc {
  font-size: 13px; color: rgba(255,255,255,0.55); line-height: 1.6;
}
.security-card-badge {
  display: inline-flex; align-items: center; gap: 4px;
  margin-top: 12px;
  font-family: var(--wd-font-data);
  font-size: 9px; letter-spacing: 0.08em; text-transform: uppercase;
  color: rgba(255,255,255,0.4); font-weight: 500;
  padding: 3px 8px; border-radius: var(--wd-r-pill);
  background: rgba(255,255,255,0.06);
}
.security-section .section-label { color: rgba(255,255,255,0.4); }
.security-section .section-label .section-n {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.15);
  color: rgba(255,255,255,0.5);
}
.security-section .section-heading { color: var(--wd-white); }
.security-section .section-desc { color: rgba(255,255,255,0.55); }
@media(max-width:900px) { .security-grid { grid-template-columns: repeat(2, 1fr); } }
@media(max-width:500px) { .security-grid { grid-template-columns: 1fr; } }

/* ── HOMEPAGE TRUST GRAPHIC (animated shield + orbit + badges) ── */
.trust-graphic {
  position: relative;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  margin: 48px auto 8px;
  padding: 32px 16px 24px;
}
.trust-graphic-shield {
  position: relative; height: 160px; width: 200px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 24px;
}
.trust-graphic-shield svg {
  width: 90px; height: 110px;
  color: rgba(255,255,255,0.95);
  position: relative; z-index: 2;
}
.trust-graphic-shield svg path:last-child { stroke: #6ee7b7; }
.trust-graphic .trust-graphic-orbit {
  position: absolute; top: 50%; left: 50%;
  width: 180px; height: 180px;
  border: 1px solid rgba(255,255,255,0.18); border-radius: 50%;
  transform: translate(-50%,-50%);
  animation: wp-spin 9s linear infinite;
}
.trust-graphic .trust-graphic-orbit::before {
  content: ''; position: absolute; top: -3px; left: 50%;
  width: 6px; height: 6px; border-radius: 50%; background: #6ee7b7;
  transform: translateX(-50%);
  box-shadow: 0 0 10px rgba(110,231,183,0.7);
}
.trust-graphic .trust-graphic-orbit-2 {
  width: 230px; height: 230px;
  border-color: rgba(255,255,255,0.10);
  animation: wp-spin-rev 13s linear infinite;
}
.trust-graphic .trust-graphic-orbit-2::before {
  background: #c47c2b; box-shadow: 0 0 10px rgba(196,124,43,0.7);
}
.trust-graphic-badges {
  display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;
  max-width: 760px;
}
.trust-graphic-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px; border-radius: var(--wd-r-pill);
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.85);
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase;
  white-space: nowrap;
}
.trust-graphic-badge svg { color: #6ee7b7; flex-shrink: 0; }

.trust-cta {
  margin-top: 40px; text-align: center;
}
.btn-outline-light {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 12px 22px; border-radius: var(--wd-r-pill);
  border: 1px solid rgba(255,255,255,0.25);
  background: transparent;
  color: var(--wd-white);
  font-family: var(--wd-font-display);
  font-size: 14px; font-weight: 600; letter-spacing: -0.01em;
  text-decoration: none;
  transition: background 0.2s, border-color 0.2s;
}
.btn-outline-light:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.45);
}
@media(max-width:600px) {
  .trust-graphic-shield { height: 140px; width: 180px; }
  .trust-graphic-shield svg { width: 72px; height: 88px; }
  .trust-graphic .trust-graphic-orbit { width: 150px; height: 150px; }
  .trust-graphic .trust-graphic-orbit-2 { width: 190px; height: 190px; }
  .trust-graphic-badge { font-size: 9px; padding: 5px 10px; }
}

/* ── GOVERNANCE & CONTROL (Procurement / IT) ── */
.governance-section {
  background: var(--wd-cream-2);
  padding: 96px 0 88px;
  position: relative;
}
.gov-split {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 28px;
  align-items: stretch;
  margin-top: 48px;
}
@media(max-width:900px) { .gov-split { grid-template-columns: 1fr; gap: 20px; } }

/* Cedar policy "editor" card */
.gov-policy {
  background: #0f1714;
  border-radius: var(--wd-r-md);
  border: 1px solid rgba(255,255,255,0.06);
  box-shadow: var(--wd-shadow-lg);
  overflow: hidden;
  display: flex; flex-direction: column;
}
.gov-policy-header {
  display: flex; align-items: center; gap: 7px;
  padding: 12px 16px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  background: rgba(255,255,255,0.02);
}
.gov-policy-dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: rgba(255,255,255,0.14);
  flex-shrink: 0;
}
.gov-policy-dot:first-child { background: #ef4444; }
.gov-policy-dot:nth-child(2) { background: #f4be46; }
.gov-policy-dot:nth-child(3) { background: #6ee7b7; }
.gov-policy-title {
  margin-left: 8px;
  font-family: var(--wd-font-data);
  font-size: 11px; letter-spacing: 0.02em;
  color: rgba(255,255,255,0.55);
}
.gov-policy-tag {
  margin-left: auto;
  font-family: var(--wd-font-data);
  font-size: 9px; letter-spacing: 0.08em; text-transform: uppercase;
  color: rgba(110,231,183,0.85);
  border: 1px solid rgba(110,231,183,0.25);
  border-radius: var(--wd-r-pill); padding: 3px 9px;
  background: rgba(110,231,183,0.06);
  white-space: nowrap;
}
.gov-policy-body {
  margin: 0; padding: 22px 24px;
  font-family: var(--wd-font-data);
  font-size: 12.5px; line-height: 1.85;
  color: rgba(255,255,255,0.85);
  overflow-x: auto;
  flex: 1;
  white-space: pre;
}
.gov-policy-body code { font-family: inherit; }
.gov-cm { color: rgba(255,255,255,0.32); font-style: italic; }
.gov-kw { color: #e879c5; }
.gov-fn { color: #93c5fd; }
.gov-str { color: #6ee7b7; }
.gov-policy-foot {
  padding: 12px 24px;
  border-top: 1px solid rgba(255,255,255,0.06);
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase;
  color: rgba(255,255,255,0.4);
}

/* Capability list (right of policy) */
.gov-cap-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 10px;
}
.gov-cap {
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  padding: 18px 20px;
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 14px;
  align-items: start;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.gov-cap:hover { border-color: var(--wd-forest); box-shadow: var(--wd-shadow-sm); }
.gov-cap-icon {
  width: 28px; height: 28px;
  border-radius: 8px;
  background: var(--wd-forest-pale);
  color: var(--wd-forest);
  display: flex; align-items: center; justify-content: center;
}
.gov-cap-title {
  font-family: var(--wd-font-display);
  font-size: 14px; font-weight: 700;
  color: var(--wd-stone-dark);
  letter-spacing: -0.01em;
  margin-bottom: 4px;
}
.gov-cap-desc {
  font-size: 13px; color: var(--wd-stone-mid); line-height: 1.55;
}
.gov-cap-desc code {
  font-family: var(--wd-font-data); font-size: 11px;
  background: var(--wd-cream-3); padding: 1px 6px; border-radius: 4px;
  color: var(--wd-stone-dark);
}

/* Control row (4 cards along bottom) */
.gov-control-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-top: 28px;
}
@media(max-width:900px) { .gov-control-row { grid-template-columns: repeat(2, 1fr); } }
@media(max-width:500px) { .gov-control-row { grid-template-columns: 1fr; } }
.gov-control-card {
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  padding: 18px 18px 16px;
}
.gov-control-icon {
  width: 32px; height: 32px;
  border-radius: 8px;
  background: var(--wd-forest);
  color: var(--wd-white);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 12px;
}
.gov-control-title {
  font-family: var(--wd-font-display);
  font-size: 13px; font-weight: 700;
  color: var(--wd-stone-dark);
  letter-spacing: -0.01em;
  margin-bottom: 4px;
}
.gov-control-desc {
  font-size: 12px; color: var(--wd-stone-mid); line-height: 1.5;
}
.gov-control-meta {
  margin-top: 10px;
  font-family: var(--wd-font-data);
  font-size: 9px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--wd-stone);
}
.gov-cta {
  margin-top: 40px;
  display: flex; gap: 12px; justify-content: center; flex-wrap: wrap;
}

/* ── COMPACT TRUST PROMO ROW (light mode, drops into any section) ── */
.trust-promo {
  margin: 48px 0 8px;
  padding: 32px;
  background: linear-gradient(180deg, var(--wd-forest-pale) 0%, #fff 100%);
  border: 1px solid rgba(30,58,47,0.10);
  border-radius: var(--wd-r-lg);
}
.trust-promo-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 24px; flex-wrap: wrap; margin-bottom: 24px;
}
.trust-promo-eyebrow {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--wd-forest); font-weight: 600;
  padding: 4px 10px; border-radius: var(--wd-r-pill);
  background: rgba(30,58,47,0.08); margin-bottom: 10px;
}
.trust-promo-title {
  font-family: var(--wd-font-display);
  font-size: clamp(20px, 2.4vw, 26px); font-weight: 700;
  letter-spacing: -0.02em; color: var(--wd-ink);
  margin: 0 0 6px;
}
.trust-promo-desc {
  font-size: 14px; color: var(--wd-stone-mid); line-height: 1.55;
  max-width: 560px; margin: 0;
}
.trust-promo-badges {
  display: flex; flex-wrap: wrap; gap: 6px;
  align-self: flex-start;
}
.trust-promo-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 10px; border-radius: var(--wd-r-pill);
  background: #fff; border: 1px solid rgba(30,58,47,0.12);
  color: var(--wd-forest);
  font-family: var(--wd-font-data);
  font-size: 9px; letter-spacing: 0.06em; text-transform: uppercase;
  font-weight: 600;
}
.trust-promo-badge svg { color: var(--wd-forest); flex-shrink: 0; }
.trust-promo-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;
}
.trust-promo-card {
  background: #fff;
  border: 1px solid rgba(30,58,47,0.10);
  border-radius: var(--wd-r-md);
  padding: 20px 18px;
  transition: border-color 0.2s, transform 0.2s;
}
.trust-promo-card:hover {
  border-color: rgba(30,58,47,0.25);
  transform: translateY(-1px);
}
.trust-promo-icon {
  width: 32px; height: 32px; border-radius: 8px;
  background: rgba(30,58,47,0.08);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 12px; color: var(--wd-forest);
}
.trust-promo-name {
  font-family: var(--wd-font-display);
  font-size: 14px; font-weight: 700; color: var(--wd-ink);
  letter-spacing: -0.01em; margin-bottom: 4px;
}
.trust-promo-copy {
  font-size: 12px; color: var(--wd-stone-mid); line-height: 1.55;
}
@media(max-width:760px) {
  .trust-promo { padding: 24px 20px; }
  .trust-promo-grid { grid-template-columns: 1fr; }
}

/* Footer trust badges */
.footer-trust {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  padding-top: 16px; margin-top: 16px;
  border-top: 1px solid var(--wd-border);
  width: 100%;
}
.footer-trust-badge {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: var(--wd-font-data);
  font-size: 10px; color: var(--wd-stone); letter-spacing: 0.04em;
}
.footer-trust-badge svg { color: var(--wd-stone); flex-shrink: 0; }

@media(max-width:1120px) {
  .mega { position: fixed; top: 56px; left: 0; right: 0; transform: none; border-radius: 0; }
  .mega-inner { grid-template-columns: 1fr; min-width: 0; border-radius: 0; }
  .mega-inner-compact { grid-template-columns: 1fr; min-width: 0; }
  .mega-col { border-right: none; border-bottom: 1px solid var(--wd-border); }
  .mega-col:last-child { border-bottom: none; }
  .mega-col-highlight { display: none; }
  .nav-security-pill { display: none; }
  .security-strip-inner { gap: 16px; }
}

/* ═══════════════════════════════════════════
   HERO MOUSE CANVAS
   ═══════════════════════════════════════════ */
#hero-mouse-canvas {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  pointer-events: none; z-index: 0;
}

/* ═══════════════════════════════════════════
   DATA FLOW — WARD HUB MOUSE FOLLOW
   ═══════════════════════════════════════════ */
.df-ward-hub {
  transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  will-change: transform;
}

/* ═══════════════════════════════════════════
   HERO WITH AGENT CARDS — v3.0
   ═══════════════════════════════════════════ */
.hero {
  padding: 0;
}
.hero-flex {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: 140px 40px 48px;
  max-width: 960px; margin: 0 auto;
}
.hero-content { flex: 1; min-width: 0; }
@media(max-width:1000px) {
  .hero-flex { padding: 120px 40px 32px; }
}
@media(max-width:700px) {
  .hero-flex { padding: 120px 20px 32px; }
}

/* ── Hero Photo Stack (Scrapbook) ── */
.hero-photo-stack {
  position: absolute;
  top: -80px; left: -100px;
  width: 520px; height: 460px;
  z-index: 0;
  pointer-events: none;
}
.hero-photo {
  position: absolute;
  width: 480px; height: 340px;
  background: var(--wd-white);
  padding: 12px 12px 42px 12px;
  border-radius: 4px;
  box-shadow: 0 4px 20px rgba(26,26,20,0.14), 0 1px 4px rgba(26,26,20,0.06);
  opacity: 0;
  transition: all 0.6s cubic-bezier(0.16,1,0.3,1);
  transform-origin: center center;
  overflow: hidden;
}
.hero-photo img {
  width: 100%; height: 100%;
  object-fit: cover;
  border-radius: 3px;
  display: block;
}

/* Scattered stack positions — scrapbook feel */
.hero-photo[data-photo="growth"]       { transform: rotate(-7deg)  translate(0, 0);       z-index: 7; }
.hero-photo[data-photo="store-ops"]    { transform: rotate(5deg)   translate(24px, 18px);  z-index: 6; }
.hero-photo[data-photo="finance"]      { transform: rotate(-4deg)  translate(-16px, 10px); z-index: 5; }
.hero-photo[data-photo="inventory"]    { transform: rotate(8deg)   translate(14px, -8px);  z-index: 4; }
.hero-photo[data-photo="supply-chain"] { transform: rotate(-6deg)  translate(28px, 12px);  z-index: 3; }
.hero-photo[data-photo="labor"]        { transform: rotate(3deg)   translate(-12px, 20px); z-index: 2; }
.hero-photo[data-photo="margin"]       { transform: rotate(-9deg)  translate(20px, 6px);   z-index: 1; }

/* Inactive photos in the stack — faded, tucked behind */
.hero-photo.in-stack {
  opacity: 0.5;
  filter: saturate(0.35) brightness(0.92);
}

/* Active photo — comes forward */
.hero-photo.active {
  opacity: 1;
  filter: saturate(1) brightness(1);
  z-index: 10 !important;
  box-shadow: 0 10px 44px rgba(26,26,20,0.22), 0 4px 12px rgba(26,26,20,0.10);
}
.hero-photo[data-photo="growth"].active       { transform: rotate(-2deg)  translate(0, -8px)     scale(1.04); }
.hero-photo[data-photo="store-ops"].active    { transform: rotate(1deg)   translate(24px, 6px)   scale(1.04); }
.hero-photo[data-photo="finance"].active      { transform: rotate(-1deg)  translate(-16px, -2px) scale(1.04); }
.hero-photo[data-photo="inventory"].active    { transform: rotate(2deg)   translate(14px, -12px) scale(1.04); }
.hero-photo[data-photo="supply-chain"].active { transform: rotate(-1deg)  translate(28px, 2px)   scale(1.04); }
.hero-photo[data-photo="labor"].active        { transform: rotate(0deg)   translate(-12px, 8px)  scale(1.04); }
.hero-photo[data-photo="margin"].active       { transform: rotate(-2deg)  translate(20px, -4px)  scale(1.04); }

/* Photo leaving — subtle exit */
.hero-photo.photo-exit {
  opacity: 0.3;
  filter: saturate(0.25) brightness(0.88);
  transition: all 0.4s ease-in;
}

@media(max-width:1000px) {
  .hero-photo-stack { top: -50px; left: -60px; width: 420px; height: 360px; }
  .hero-photo { width: 380px; height: 270px; padding: 10px 10px 34px 10px; }
}
@media(max-width:700px) {
  .hero-photo-stack { top: -36px; left: -30px; width: 320px; height: 260px; }
  .hero-photo { width: 280px; height: 200px; padding: 8px 8px 28px 8px; }
}
@media(max-width:500px) {
  .hero-photo-stack { display: none; }
}

/* ── Agent Insight Card Carousel ── */
.agent-card-carousel {
  position: relative; width: 100%; height: 100%;
  z-index: 20;
}
.agent-insight-card {
  position: absolute;
  bottom: 0; right: 0;
  width: 340px;
  background: rgba(255,255,255,0.55);
  backdrop-filter: blur(16px) saturate(1.4);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  border: 1px solid rgba(255,255,255,0.45);
  border-radius: var(--wd-r-lg);
  box-shadow: 0 8px 32px rgba(26,26,20,0.10), inset 0 1px 0 rgba(255,255,255,0.6);
  padding: 20px;
  opacity: 0; transform: translateY(20px) scale(0.96);
  transition: all 0.5s cubic-bezier(0.16,1,0.3,1);
  pointer-events: none;
}
.agent-insight-card.active {
  opacity: 1; transform: translateY(0) scale(1);
  pointer-events: auto;
}
.agent-insight-card.exit {
  opacity: 0; transform: translateY(-16px) scale(0.97);
}

.aic-header {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 12px; padding-bottom: 10px;
  border-bottom: 1px solid rgba(26,26,20,0.10);
}
.aic-agent-dot {
  width: 8px; height: 8px; border-radius: 50%;
  animation: pulse 2s infinite;
  box-shadow: 0 0 6px currentColor;
}
.aic-agent-name {
  font-family: var(--wd-font-data);
  font-size: 11px; font-weight: 600; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--wd-ink);
}
.aic-time {
  font-family: var(--wd-font-data);
  font-size: 10px; color: var(--wd-stone-dark); margin-left: auto;
}
.aic-title {
  font-family: var(--wd-font-display);
  font-size: 16px; font-weight: 700; color: var(--wd-ink);
  letter-spacing: -0.02em; margin-bottom: 6px; line-height: 1.2;
}
.aic-desc {
  font-size: 12.5px; color: var(--wd-stone-dark); line-height: 1.55;
  margin-bottom: 12px;
}
.aic-metric {
  padding-top: 10px; border-top: 1px solid rgba(26,26,20,0.10);
  font-family: var(--wd-font-data);
  font-size: 12px; color: var(--wd-stone-dark); letter-spacing: 0.04em;
}
.aic-val {
  font-family: var(--wd-font-display);
  font-size: 15px; font-weight: 700; margin-right: 6px;
}
.aic-val.up { color: var(--wd-success); }
.aic-val.down { color: var(--wd-danger); }

/* ═══════════════════════════════════════════
   DATA FLOW VISUALIZATION
   ═══════════════════════════════════════════ */
.data-flow-viz {
  position: relative;
  display: flex; flex-direction: column; align-items: center;
  min-height: 320px; padding: 40px 0 0;
}

.df-sources {
  display: flex; flex-direction: column; gap: 12px;
  position: relative; z-index: 1;
  flex: 0 0 220px;
}
.df-source-node {
  background: var(--wd-white);
  border: 1px solid var(--wd-border-md);
  border-radius: var(--wd-r-md);
  padding: 14px 16px;
  display: flex; flex-direction: column; gap: 2px;
  transition: all 0.3s;
  box-shadow: var(--wd-shadow-sm);
}
.df-source-node:hover {
  border-color: var(--wd-forest);
  box-shadow: var(--wd-shadow-md);
  transform: translateX(4px);
}
.df-sources-right .df-source-node:hover {
  transform: translateX(-4px);
}
.df-sources-left .df-source-node {
  border-left: 3px solid var(--wd-forest);
}
.df-sources-right .df-source-node {
  border-right: 3px solid #0ea5e9;
}
.df-source-node[data-type="events"] {
  border-right-color: #f59e0b;
}
.df-source-node[data-type="demographic"] {
  border-right-color: #ec4899;
}
.df-source-node[data-type="custom"] {
  border-right-color: #8b5cf6;
}
.df-node-label {
  font-size: 13px; font-weight: 600; color: var(--wd-ink);
  line-height: 1.2; white-space: nowrap;
}
.df-node-sub {
  font-family: var(--wd-font-data);
  font-size: 10px; color: var(--wd-stone); letter-spacing: 0.03em;
  white-space: nowrap;
}

/* Ward Hub (center) */
.df-ward-hub {
  position: relative; z-index: 1;
  width: 120px; height: 120px;
  flex-shrink: 0;
}
.df-hub-inner {
  position: absolute; inset: 0;
  background: var(--wd-forest);
  border-radius: 50%;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  box-shadow: 0 4px 24px rgba(30,58,47,0.3);
  z-index: 2;
}
.df-hub-icon svg { width: 28px; height: 28px; }
.df-hub-name {
  font-family: var(--wd-font-display);
  font-size: 14px; font-weight: 700; color: var(--wd-white);
  margin-top: 4px;
}
.df-hub-sub {
  font-family: var(--wd-font-data);
  font-size: 8px; letter-spacing: 0.12em; text-transform: uppercase;
  color: rgba(255,255,255,0.5);
}
.df-hub-ring {
  position: absolute; inset: -16px;
  border: 1.5px solid rgba(30,58,47,0.12);
  border-radius: 50%;
  animation: hubPulse 3s ease-in-out infinite;
}
.df-hub-ring-2 {
  inset: -32px;
  animation-delay: 1.5s;
  border-color: rgba(30,58,47,0.06);
}
@keyframes hubPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.06); opacity: 0.5; }
}

.df-legend {
  display: flex; flex-wrap: wrap; gap: 16px 24px; justify-content: center;
  margin-top: 16px;
  font-family: var(--wd-font-data);
  font-size: 10px; color: var(--wd-stone); letter-spacing: 0.06em;
}
.df-legend-item { display: flex; align-items: center; gap: 6px; }
.df-legend-dot {
  width: 8px; height: 8px; border-radius: 50%;
}
.df-legend-arrow { font-size: 14px; }

@media(max-width:900px) {
  .data-flow-viz { min-height: auto; padding: 20px 0; }
}

/* ═══════════════════════════════════════════
   INTEGRATION DATA LAKE VISUALIZATION
   ═══════════════════════════════════════════ */
.int-lake-viz {
  position: relative;
  display: flex; align-items: center; justify-content: space-between;
  min-height: 380px; padding: 40px 0;
  gap: 24px;
}
#int-lake-canvas {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  pointer-events: none; z-index: 0;
}
.int-lake-sources {
  display: flex; flex-direction: column; gap: 10px;
  position: relative; z-index: 1;
  flex: 0 0 220px;
}
.int-lake-label {
  font-family: var(--wd-font-data);
  font-size: 9px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--wd-stone); margin-bottom: 4px; padding-left: 4px;
}
.int-lake-node {
  background: var(--wd-white);
  border: 1px solid var(--wd-border-md);
  border-radius: var(--wd-r-md);
  padding: 14px 16px;
  display: flex; align-items: center; gap: 10px;
  transition: all 0.3s;
  box-shadow: var(--wd-shadow-sm);
  text-decoration: none; color: inherit;
}

/* Primary integration — highlighted with forest accent */
.int-lake-node-active {
  border-left: 4px solid var(--wd-forest);
  background: var(--wd-forest-pale);
  box-shadow: var(--wd-shadow-md);
}
.int-lake-node-active .df-node-label {
  color: var(--wd-forest); font-weight: 700;
}
.int-lake-node-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--wd-forest);
  animation: pulse 2s infinite;
  flex-shrink: 0;
}

/* Category peers */
.int-lake-node-peer {
  border-left: 3px solid var(--wd-border-md);
  opacity: 0.7;
}
.int-lake-node-peer:hover {
  opacity: 1; border-left-color: var(--wd-forest);
  box-shadow: var(--wd-shadow-md); transform: translateX(4px);
}

/* Enrichment datasets */
.int-lake-node-enrich {
  border-right: 3px solid #0ea5e9;
}
.int-lake-node-enrich:hover {
  border-color: #0ea5e9;
  box-shadow: var(--wd-shadow-md); transform: translateX(-4px);
}

.int-lake-node-info { display: flex; flex-direction: column; gap: 2px; }

@media(max-width:900px) {
  .int-lake-viz { flex-direction: column; min-height: auto; gap: 32px; padding: 20px 0; }
  .int-lake-sources { flex-direction: row; flex-wrap: wrap; flex: none; justify-content: center; }
  .int-lake-node { flex: 0 0 auto; }
  .df-ward-hub { order: -1; }
  #int-lake-canvas { display: none; }
}

/* ── Integration Data Pills ── */
.int-data-pills {
  display: flex; flex-wrap: wrap; gap: 8px;
}
.int-data-pill {
  display: inline-flex; align-items: center;
  padding: 6px 14px;
  font-family: var(--wd-font-data);
  font-size: 11px; font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--wd-forest);
  background: var(--wd-forest-pale);
  border: 1px solid rgba(30,58,47,0.12);
  border-radius: var(--wd-r-pill);
  transition: all 0.2s;
}
.int-data-pill:hover {
  background: var(--wd-forest);
  color: var(--wd-white);
}

/* ── Flywheel Visualization ── */
.flywheel-viz {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
  padding: 40px 0;
}
.flywheel-ring {
  position: relative;
  width: 100%;
  max-width: 360px;
  margin: 0 auto;
  aspect-ratio: 1;
}
.flywheel-svg {
  width: 100%;
  height: 100%;
}
.flywheel-ring-animated {
  stroke-dashoffset: 942;
  transition: stroke-dashoffset 2s ease-out;
}
.flywheel-center {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 64px; height: 64px;
  background: var(--wd-forest);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  box-shadow: 0 4px 20px rgba(30,58,47,0.3);
}
.flywheel-center svg { width: 24px; height: 24px; }
.flywheel-center span {
  font-family: var(--wd-font-data);
  font-size: 8px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.8);
}
.flywheel-node {
  position: absolute;
  width: 48px; height: 48px;
  background: var(--wd-white);
  border: 2px solid var(--wd-border-md);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  cursor: pointer;
  transition: all 0.3s;
  box-shadow: var(--wd-shadow-sm);
}
.flywheel-node.active {
  border-color: var(--wd-forest);
  background: var(--wd-forest-pale);
  box-shadow: 0 0 0 4px rgba(30,58,47,0.1), var(--wd-shadow-md);
  transform: scale(1.12);
}
.flywheel-node-icon { color: var(--wd-forest); line-height: 1; }
.flywheel-node-label {
  font-family: var(--wd-font-data);
  font-size: 7px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wd-stone);
  white-space: nowrap;
}
/* Position nodes at compass points around the ring */
/* Ring radius=150 in 400-unit viewBox, so positions are at 37.5% from center */
.flywheel-node-1 { top: 0%; left: 50%; transform: translateX(-50%); }
.flywheel-node-2 { top: 50%; right: 0%; transform: translateY(-50%); }
.flywheel-node-3 { bottom: 0%; left: 50%; transform: translateX(-50%); }
.flywheel-node-4 { top: 50%; left: 0%; transform: translateY(-50%); }
.flywheel-node-1.active { transform: translateX(-50%) scale(1.12); }
.flywheel-node-2.active { transform: translateY(-50%) scale(1.12); }
.flywheel-node-3.active { transform: translateX(-50%) scale(1.12); }
.flywheel-node-4.active { transform: translateY(-50%) scale(1.12); }

.flywheel-steps { display: flex; flex-direction: column; gap: 8px; }
.flywheel-step {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 16px 20px;
  border-radius: var(--wd-r-md);
  border: 1px solid transparent;
  cursor: pointer;
  transition: all 0.3s;
}
.flywheel-step:hover { background: rgba(30,58,47,0.02); }
.flywheel-step.active {
  background: var(--wd-forest-pale);
  border-color: var(--wd-border-md);
  box-shadow: var(--wd-shadow-sm);
}
.flywheel-step-num {
  font-family: var(--wd-font-data);
  font-size: 11px;
  font-weight: 500;
  color: var(--wd-stone);
  padding-top: 2px;
  flex-shrink: 0;
}
.flywheel-step.active .flywheel-step-num { color: var(--wd-forest); }
.flywheel-step-title {
  font-family: var(--wd-font-display);
  font-size: 16px;
  font-weight: 700;
  color: var(--wd-ink);
  margin-bottom: 4px;
}
.flywheel-step-desc {
  font-size: 14px;
  color: var(--wd-stone-dark);
  line-height: 1.5;
}
@media (max-width: 800px) {
  .flywheel-viz { grid-template-columns: 1fr; gap: 32px; }
  .flywheel-ring { max-width: 280px; }
}
@media (max-width: 500px) {
  .flywheel-ring { max-width: 220px; }
  .flywheel-node { width: 40px; height: 40px; }
  .flywheel-step { padding: 12px 14px; gap: 12px; }
}

/* ═══════════════════════════════════════════
   AI AGENT GRID
   ═══════════════════════════════════════════ */
.agent-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
}
@media(max-width:900px) { .agent-grid { grid-template-columns: repeat(2, 1fr); } }
@media(max-width:600px) { .agent-grid { grid-template-columns: 1fr; } }

.agent-card {
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg);
  padding: 28px 24px;
  transition: all 0.3s ease;
}
.agent-card:hover {
  border-color: var(--wd-border-md);
  box-shadow: var(--wd-shadow-md);
  transform: translateY(-2px);
}
.agent-card-icon {
  width: 44px; height: 44px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 16px;
}
.agent-card-name {
  font-family: var(--wd-font-display);
  font-size: 17px; font-weight: 700; color: var(--wd-ink);
  letter-spacing: -0.02em; margin-bottom: 8px;
}
.agent-card-desc {
  font-size: 13px; color: var(--wd-stone-mid); line-height: 1.6;
}

/* ═══════════════════════════════════════════
   FLIPPABLE INSIGHT CARDS
   ═══════════════════════════════════════════ */
.insight-card-flip {
  perspective: 800px;
  height: 340px;
}
.insight-card-flip .flip-front,
.insight-card-flip .flip-back {
  position: absolute; inset: 0;
  backface-visibility: hidden;
  transition: transform 0.6s cubic-bezier(0.16,1,0.3,1);
  border-radius: var(--wd-r-lg);
}
.insight-card-flip .flip-front {
  transform: rotateY(0deg);
  display: flex; flex-direction: column;
}
.insight-card-flip .flip-back {
  transform: rotateY(180deg);
  background: var(--wd-forest);
  color: var(--wd-white);
  padding: 20px;
  overflow-y: auto;
}
.insight-card-flip.flipped .flip-front { transform: rotateY(-180deg); }
.insight-card-flip.flipped .flip-back { transform: rotateY(0deg); }

/* Front extras */
.ic-agent-badge {
  position: absolute; top: 12px; right: 12px;
  font-family: var(--wd-font-data);
  font-size: 9px; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 3px 8px; border-radius: var(--wd-r-pill);
  background: var(--wd-forest-pale); color: var(--wd-forest);
  font-weight: 500;
}
.flip-card-trigger {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: auto; padding: 8px 14px;
  font-family: var(--wd-font-data);
  font-size: 12px; font-weight: 700; letter-spacing: 0.06em;
  color: var(--wd-white); background: var(--wd-forest); border: none;
  border-radius: var(--wd-r-sm);
  cursor: pointer; transition: background 0.2s, transform 0.2s;
}
.flip-card-trigger:hover { background: var(--wd-forest-mid); transform: translateY(-1px); text-decoration: none; }

/* Back (action dispatch) */
.flip-back-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 14px; padding-bottom: 10px;
  border-bottom: 1px solid rgba(255,255,255,0.15);
}
.flip-back-title {
  font-family: var(--wd-font-display);
  font-size: 15px; font-weight: 700;
}
.flip-close {
  color: rgba(255,255,255,0.6); font-size: 20px;
  padding: 0 4px; line-height: 1;
  background: none; border-radius: 0;
}
.flip-close:hover { color: var(--wd-white); background: none; transform: none; }

.action-field { margin-bottom: 12px; }
.action-label {
  font-family: var(--wd-font-data);
  font-size: 9px; letter-spacing: 0.1em; text-transform: uppercase;
  color: rgba(255,255,255,0.5); margin-bottom: 6px; display: block;
}
.action-channels {
  display: flex; gap: 6px;
}
.action-ch {
  flex: 1; display: flex; align-items: center; gap: 5px;
  padding: 8px 10px;
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: var(--wd-r-sm);
  font-size: 11px; color: rgba(255,255,255,0.7);
  cursor: pointer; transition: all 0.2s;
}
.action-ch input { display: none; }
.action-ch-icon { display: flex; opacity: 0.6; }
.action-ch:has(input:checked) {
  background: rgba(255,255,255,0.15);
  border-color: rgba(255,255,255,0.5);
  color: var(--wd-white);
}
.action-ch:has(input:checked) .action-ch-icon { opacity: 1; }

.action-select {
  width: 100%; padding: 7px 10px;
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: var(--wd-r-sm);
  color: var(--wd-white); font-family: var(--wd-font-body);
  font-size: 12px; -webkit-appearance: none;
}
.action-select option { background: var(--wd-forest); color: var(--wd-white); }

.action-send {
  width: 100%; justify-content: center;
  margin-top: 8px; padding: 10px;
  font-size: 12px;
  background: var(--wd-white); color: var(--wd-forest);
}
.action-send:hover {
  background: var(--wd-cream); transform: none;
}

.action-confirm {
  display: flex; align-items: center; gap: 8px;
  justify-content: center;
  margin-top: 8px;
  font-family: var(--wd-font-data);
  font-size: 11px; color: rgba(255,255,255,0.7);
  opacity: 0; transform: translateY(8px);
  transition: all 0.3s ease;
}
.action-confirm.show {
  opacity: 1; transform: translateY(0);
}

/* ═══════════════════════════════════════════
   EXTERNAL DATA SOURCES
   ═══════════════════════════════════════════ */
.ext-data-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
  margin-bottom: 32px;
}
@media(max-width:900px) { .ext-data-grid { grid-template-columns: 1fr; } }

.ext-data-card {
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg);
  padding: 32px 24px;
  transition: all 0.3s ease;
}
.ext-data-card:hover {
  border-color: var(--wd-border-md);
  box-shadow: var(--wd-shadow-md);
  transform: translateY(-2px);
}
.ext-icon {
  width: 52px; height: 52px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 20px;
}
.ext-title {
  font-family: var(--wd-font-display);
  font-size: 20px; font-weight: 700; color: var(--wd-ink);
  letter-spacing: -0.02em; margin-bottom: 10px; line-height: 1.2;
}
.ext-desc {
  font-size: 13px; color: var(--wd-stone-mid); line-height: 1.65;
  margin-bottom: 16px;
}
.ext-use-cases {
  display: flex; flex-wrap: wrap; gap: 6px;
}
.ext-tag {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.05em;
  padding: 4px 10px; border-radius: var(--wd-r-pill);
  background: var(--wd-white); border: 1px solid var(--wd-border);
  color: var(--wd-stone-mid);
}

.ext-callout {
  display: flex; align-items: flex-start; gap: 16px;
  background: var(--wd-forest-pale);
  border: 1px solid rgba(30,58,47,0.15);
  border-radius: var(--wd-r-lg);
  padding: 24px;
}
.ext-callout-icon {
  flex-shrink: 0; color: var(--wd-forest);
  margin-top: 2px;
}
.ext-callout-text {
  font-size: 14px; color: var(--wd-forest);
  line-height: 1.65;
}
.ext-callout-text strong { font-weight: 700; }

/* ═══════════════════════════════════════════
   INDUSTRY KPI CARDS — Flippable by vertical
   ═══════════════════════════════════════════ */
.industry-kpi-tabs {
  display: flex; gap: 8px; flex-wrap: wrap; margin-top: 24px; margin-bottom: 16px;
}
.industry-kpi-tab {
  padding: 8px 18px; border-radius: var(--wd-r-pill);
  border: 1px solid var(--wd-border-md); background: transparent;
  font-family: var(--wd-font-data); font-size: 11px; font-weight: 500;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--wd-stone-mid); cursor: pointer; transition: all 0.25s;
}
.industry-kpi-tab:hover { border-color: var(--wd-forest); color: var(--wd-forest); }
.industry-kpi-tab.active {
  background: var(--wd-forest); color: var(--wd-white);
  border-color: var(--wd-forest);
}
.industry-kpi-panel { display: none; }
.industry-kpi-panel.active { display: block; }

.kpi-flip-card {
  perspective: 800px; height: 320px; cursor: pointer;
}
.kpi-flip-card .kf-front,
.kpi-flip-card .kf-back {
  position: absolute; inset: 0;
  backface-visibility: hidden;
  transition: transform 0.6s cubic-bezier(0.16,1,0.3,1);
  border-radius: var(--wd-r-lg);
}
.kpi-flip-card .kf-front {
  transform: rotateY(0deg);
  background: var(--wd-white); border: 1px solid var(--wd-border);
  padding: 24px; display: flex; flex-direction: column;
}
.kpi-flip-card .kf-front::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0;
  height: 3px; border-radius: 3px 3px 0 0; background: var(--wd-forest);
}
.kpi-flip-card .kf-back {
  transform: rotateY(180deg);
  background: var(--wd-forest); color: var(--wd-white);
  padding: 24px; overflow-y: auto;
}
.kpi-flip-card.flipped .kf-front { transform: rotateY(-180deg); }
.kpi-flip-card.flipped .kf-back { transform: rotateY(0deg); }

.kf-industry-badge {
  font-family: var(--wd-font-data); font-size: 9px;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--wd-stone); margin-bottom: 8px;
}
.kf-metric-big {
  font-family: var(--wd-font-display); font-size: 32px;
  font-weight: 800; color: var(--wd-ink); letter-spacing: -0.03em;
  margin-bottom: 4px;
}
.kf-metric-label {
  font-family: var(--wd-font-data); font-size: 10px;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--wd-stone); margin-bottom: 12px;
}
.kf-title {
  font-family: var(--wd-font-display); font-size: 16px;
  font-weight: 700; color: var(--wd-ink); margin-bottom: 6px; line-height: 1.2;
}
.kf-desc {
  font-size: 13px; color: var(--wd-stone-mid); line-height: 1.55;
  margin-bottom: auto;
}
.kf-flip-hint {
  font-family: var(--wd-font-data); font-size: 11px;
  font-weight: 700;
  color: var(--wd-white); background: var(--wd-forest);
  letter-spacing: 0.06em;
  margin-top: 12px; padding: 8px 12px;
  border-radius: var(--wd-r-sm);
  text-align: center;
  cursor: pointer;
  transition: background 0.2s;
}
.kf-flip-hint:hover { background: var(--wd-forest-mid); }
.kf-back-title {
  font-family: var(--wd-font-display); font-size: 16px;
  font-weight: 700; margin-bottom: 10px;
}
.kf-back-action {
  font-size: 13px; line-height: 1.65; color: rgba(255,255,255,0.85);
  margin-bottom: 14px;
}
.kf-back-result {
  display: flex; align-items: baseline; gap: 8px;
  padding: 12px; border-radius: var(--wd-r-md);
  background: rgba(255,255,255,0.1); margin-bottom: 10px;
}
.kf-back-result-val {
  font-family: var(--wd-font-display); font-size: 22px;
  font-weight: 800; color: var(--wd-white);
}
.kf-back-result-label {
  font-family: var(--wd-font-data); font-size: 10px;
  letter-spacing: 0.06em; color: rgba(255,255,255,0.6);
}
.kf-back-hint {
  font-family: var(--wd-font-data); font-size: 11px;
  font-weight: 700;
  color: var(--wd-forest); background: var(--wd-white);
  letter-spacing: 0.06em;
  margin-top: auto; padding: 8px 12px;
  border-radius: var(--wd-r-sm);
  text-align: center;
  cursor: pointer;
  transition: background 0.2s;
}
.kf-back-hint:hover { background: var(--wd-cream); color: var(--wd-forest); }

/* ── ICP value drivers grid ── */
.icp-value-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
}
@media(max-width:900px) { .icp-value-grid { grid-template-columns: repeat(2, 1fr); } }
@media(max-width:600px) { .icp-value-grid { grid-template-columns: 1fr; } }

/* ── Delegate button on KPI flip back ── */
.kf-delegate-btn {
  display: block; width: 100%;
  font-family: var(--wd-font-data); font-size: 12px; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--wd-forest); background: var(--wd-white);
  border: none; border-radius: var(--wd-r-sm);
  padding: 10px 16px; margin-bottom: 8px;
  cursor: pointer; transition: background 0.2s, transform 0.15s;
}
.kf-delegate-btn:hover { background: var(--wd-cream); transform: scale(1.02); }
.kf-delegate-btn.delegated {
  background: rgba(255,255,255,0.15); color: rgba(255,255,255,0.7);
  cursor: default; pointer-events: none;
}

/* ── Delegation list section ── */
.delegation-section { padding-top: 40px; }
.delegation-list {
  display: flex; flex-direction: column; gap: 10px;
}
.delegation-item {
  display: flex; align-items: flex-start; gap: 16px;
  background: var(--wd-white); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md); padding: 16px 20px;
  animation: dlg-in 0.35s cubic-bezier(0.16,1,0.3,1);
}
@keyframes dlg-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
.delegation-item-badge {
  font-family: var(--wd-font-data); font-size: 9px;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--wd-white); background: var(--wd-forest);
  padding: 4px 8px; border-radius: var(--wd-r-sm);
  white-space: nowrap; flex-shrink: 0; margin-top: 2px;
}
.delegation-item-body { flex: 1; min-width: 0; }
.delegation-item-kpi {
  font-family: var(--wd-font-display); font-size: 15px;
  font-weight: 700; color: var(--wd-ink); margin-bottom: 4px;
}
.delegation-item-action {
  font-size: 13px; color: var(--wd-stone-mid); line-height: 1.55;
}
.delegation-item-remove {
  background: none; border: none; cursor: pointer;
  color: var(--wd-stone); font-size: 16px; padding: 4px;
  transition: color 0.2s; flex-shrink: 0;
}
.delegation-item-remove:hover { color: var(--wd-ink); }

/* ═══════════════════════════════════════════
   AI ACCURACY REPORT
   ═══════════════════════════════════════════ */
.accuracy-report {
  background: var(--wd-white); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg); overflow: hidden;
  box-shadow: var(--wd-shadow-md); max-width: 100%;
}
.accuracy-report-header {
  display: flex; align-items: center; gap: 12px;
  padding: 20px 28px; border-bottom: 1px solid var(--wd-border);
  background: var(--wd-cream);
}
.accuracy-report-badge {
  padding: 4px 10px; border-radius: var(--wd-r-pill);
  background: rgba(34,197,94,0.1); border: 1px solid rgba(34,197,94,0.2);
  font-family: var(--wd-font-data); font-size: 10px;
  color: #16a34a; font-weight: 500; letter-spacing: 0.06em;
}
.accuracy-report-title {
  font-family: var(--wd-font-display); font-size: 15px;
  font-weight: 700; color: var(--wd-ink);
}
.accuracy-report-date {
  font-family: var(--wd-font-data); font-size: 10px;
  color: var(--wd-stone); margin-left: auto;
}
.accuracy-report-body { padding: 28px; }
.accuracy-metrics-row {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
  margin-bottom: 28px;
}
@media(max-width:700px) { .accuracy-metrics-row { grid-template-columns: repeat(2, 1fr); } }
.accuracy-metric-card {
  text-align: center; padding: 20px 12px;
  background: var(--wd-cream); border-radius: var(--wd-r-md);
  border: 1px solid var(--wd-border);
}
.accuracy-metric-val {
  font-family: var(--wd-font-display); font-size: 28px;
  font-weight: 800; color: var(--wd-forest); letter-spacing: -0.02em;
}
.accuracy-metric-label {
  font-family: var(--wd-font-data); font-size: 10px;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--wd-stone); margin-top: 4px;
}
.accuracy-metric-trend {
  font-family: var(--wd-font-data); font-size: 10px;
  margin-top: 6px;
}
.accuracy-metric-trend.up { color: var(--wd-success); }
.accuracy-timeline {
  border-top: 1px solid var(--wd-border); padding-top: 24px;
}
.accuracy-timeline-title {
  font-family: var(--wd-font-display); font-size: 16px;
  font-weight: 700; color: var(--wd-ink); margin-bottom: 16px;
}
.accuracy-bar-chart { display: flex; flex-direction: column; gap: 10px; }
.accuracy-bar-row {
  display: flex; align-items: center; gap: 12px;
}
.accuracy-bar-label {
  font-family: var(--wd-font-data); font-size: 11px;
  color: var(--wd-stone-mid); min-width: 80px; text-align: right;
}
.accuracy-bar-track {
  flex: 1; height: 24px; background: var(--wd-cream-2);
  border-radius: var(--wd-r-sm); overflow: hidden; position: relative;
}
.accuracy-bar-fill {
  height: 100%; border-radius: var(--wd-r-sm);
  background: var(--wd-forest); transition: width 1s ease;
  display: flex; align-items: center; justify-content: flex-end;
  padding-right: 8px;
}
.accuracy-bar-val {
  font-family: var(--wd-font-data); font-size: 10px;
  color: var(--wd-white); font-weight: 600;
}
.accuracy-learning-note {
  display: flex; align-items: flex-start; gap: 12px;
  background: var(--wd-forest-pale); border: 1px solid rgba(30,58,47,0.15);
  border-radius: var(--wd-r-md); padding: 16px 20px; margin-top: 24px;
}
.accuracy-learning-note svg { flex-shrink: 0; margin-top: 2px; }
.accuracy-learning-text {
  font-size: 13px; color: var(--wd-forest); line-height: 1.6;
}
.accuracy-learning-text strong { font-weight: 600; }

/* ═══════════════════════════════════════════
   NLQ CHAT WITH THUMBS UP/DOWN
   ═══════════════════════════════════════════ */
.nlq-chat-demo {
  background: var(--wd-white); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg); overflow: hidden;
  box-shadow: var(--wd-shadow-md); max-width: 720px;
}
.nlq-chat-header {
  display: flex; align-items: center; gap: 10px;
  padding: 14px 20px; border-bottom: 1px solid var(--wd-border);
  background: var(--wd-cream);
}
.nlq-chat-header-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--wd-success); animation: pulse 2s infinite;
}
.nlq-chat-header-text {
  font-family: var(--wd-font-data); font-size: 11px;
  letter-spacing: 0.06em; color: var(--wd-forest); font-weight: 500;
}
.nlq-chat-messages { padding: 20px; display: flex; flex-direction: column; gap: 16px; }
.nlq-msg {
  display: flex; gap: 10px; align-items: flex-start;
}
.nlq-msg.user { justify-content: flex-end; }
.nlq-msg-bubble {
  max-width: 80%; padding: 12px 16px;
  border-radius: var(--wd-r-md); font-size: 13px; line-height: 1.6;
}
.nlq-msg.user .nlq-msg-bubble {
  background: var(--wd-forest); color: var(--wd-white);
  border-bottom-right-radius: 4px;
}
.nlq-msg.ward .nlq-msg-bubble {
  background: var(--wd-cream); color: var(--wd-ink);
  border: 1px solid var(--wd-border);
  border-bottom-left-radius: 4px;
}
.nlq-msg-avatar {
  width: 28px; height: 28px; border-radius: 7px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.nlq-msg.ward .nlq-msg-avatar {
  background: var(--wd-forest);
}
.nlq-msg-feedback {
  display: flex; gap: 6px; margin-top: 8px;
}
.nlq-feedback-btn {
  display: flex; align-items: center; gap: 4px;
  padding: 4px 10px; border-radius: var(--wd-r-pill);
  border: 1px solid var(--wd-border); background: var(--wd-white);
  font-family: var(--wd-font-data); font-size: 10px;
  color: var(--wd-stone-mid); cursor: pointer; transition: all 0.2s;
}
.nlq-feedback-btn:hover { border-color: var(--wd-forest); color: var(--wd-forest); }
.nlq-feedback-btn.active-up {
  background: rgba(34,197,94,0.1); border-color: rgba(34,197,94,0.3);
  color: #16a34a;
}
.nlq-feedback-btn.active-down {
  background: rgba(239,68,68,0.1); border-color: rgba(239,68,68,0.3);
  color: #ef4444;
}
.nlq-feedback-label {
  font-family: var(--wd-font-data); font-size: 10px;
  color: var(--wd-stone); margin-top: 4px; letter-spacing: 0.04em;
}
.nlq-chat-input {
  display: flex; gap: 8px; padding: 14px 20px;
  border-top: 1px solid var(--wd-border); background: var(--wd-cream);
}
.nlq-input-field {
  flex: 1; padding: 10px 14px; border: 1px solid var(--wd-border-md);
  border-radius: var(--wd-r-md); font-family: var(--wd-font-body);
  font-size: 13px; background: var(--wd-white); color: var(--wd-ink);
}
.nlq-input-field:focus { outline: none; border-color: var(--wd-forest); }
.nlq-input-field::placeholder { color: var(--wd-stone); }
.nlq-send-btn {
  padding: 10px 18px; border-radius: var(--wd-r-md);
  background: var(--wd-forest); color: var(--wd-white);
  border: none; cursor: pointer; font-size: 13px; font-weight: 500;
  transition: background 0.2s;
}
.nlq-send-btn:hover { background: var(--wd-forest-mid); }

/* ═══════════════════════════════════════════
   AI AGENT ROI REPORT
   ═══════════════════════════════════════════ */
.roi-report {
  background: var(--wd-white); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg); overflow: hidden;
  box-shadow: var(--wd-shadow-md);
}
.roi-report-header {
  display: flex; align-items: center; gap: 12px;
  padding: 20px 28px; border-bottom: 1px solid var(--wd-border);
  background: var(--wd-forest); color: var(--wd-white);
}
.roi-report-title {
  font-family: var(--wd-font-display); font-size: 17px;
  font-weight: 700;
}
.roi-report-period {
  font-family: var(--wd-font-data); font-size: 10px;
  color: rgba(255,255,255,0.5); margin-left: auto; letter-spacing: 0.06em;
}
.roi-report-body { padding: 28px; }
.roi-summary-row {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
  margin-bottom: 28px;
}
@media(max-width:700px) { .roi-summary-row { grid-template-columns: 1fr; } }
.roi-summary-card {
  text-align: center; padding: 24px 16px;
  border-radius: var(--wd-r-md); border: 1px solid var(--wd-border);
}
.roi-summary-card.highlight {
  background: var(--wd-forest-pale); border-color: rgba(30,58,47,0.2);
}
.roi-summary-val {
  font-family: var(--wd-font-display); font-size: 26px;
  font-weight: 800; color: var(--wd-forest); letter-spacing: -0.02em;
  white-space: nowrap;
}
.roi-summary-label {
  font-family: var(--wd-font-data); font-size: 10px;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--wd-stone); margin-top: 4px;
}
.roi-agent-table {
  width: 100%; border-collapse: collapse; margin-bottom: 24px;
}
.roi-agent-table th {
  font-family: var(--wd-font-data); font-size: 10px;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--wd-stone); text-align: left;
  padding: 10px 12px; border-bottom: 2px solid var(--wd-border-md);
}
.roi-agent-table td {
  padding: 12px; font-size: 13px; color: var(--wd-ink);
  border-bottom: 1px solid var(--wd-border);
}
.roi-agent-table td:first-child { font-weight: 600; }
.roi-agent-dot {
  display: inline-block; width: 8px; height: 8px;
  border-radius: 50%; margin-right: 8px;
}
.roi-action-tag {
  display: inline-flex; padding: 2px 8px; border-radius: var(--wd-r-pill);
  font-family: var(--wd-font-data); font-size: 10px;
  letter-spacing: 0.04em;
}
.roi-action-tag.dispatched { background: rgba(34,197,94,0.1); color: #16a34a; }
.roi-action-tag.pending { background: rgba(245,158,11,0.1); color: #d97706; }
.roi-action-tag.revenue { background: rgba(30,58,47,0.08); color: var(--wd-forest); }
.roi-outcome-bar {
  display: flex; align-items: center; gap: 8px;
}
.roi-outcome-track {
  flex: 1; height: 6px; background: var(--wd-cream-2);
  border-radius: 3px; overflow: hidden;
}
.roi-outcome-fill {
  height: 100%; border-radius: 3px; background: var(--wd-success);
}
.roi-outcome-val {
  font-family: var(--wd-font-data); font-size: 11px;
  color: var(--wd-success); font-weight: 600; min-width: 36px;
}
.roi-footer-note {
  display: flex; align-items: flex-start; gap: 12px;
  background: var(--wd-cream); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md); padding: 16px 20px;
}
.roi-footer-note-text {
  font-size: 13px; color: var(--wd-stone-mid); line-height: 1.6;
}
.roi-footer-note-text strong { color: var(--wd-ink); font-weight: 600; }

/* ── KPI IMPACT SECTION ── */
.impact-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px;
  margin-top: 32px;
}
@media(max-width:700px) { .impact-grid { grid-template-columns: 1fr; } }

.impact-card {
  background: var(--wd-cream); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg); padding: 28px 24px;
  transition: transform 0.2s, box-shadow 0.2s;
}
.impact-card:hover {
  transform: translateY(-2px); box-shadow: var(--wd-shadow-md);
}
.impact-kpi {
  font-family: var(--wd-font-data); font-size: 10px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--wd-stone); margin-bottom: 8px;
}
.impact-range {
  font-family: var(--wd-font-display); font-size: 20px;
  font-weight: 700; letter-spacing: -0.02em;
  color: var(--wd-forest); margin-bottom: 10px;
}
.impact-detail {
  font-size: 14px; color: var(--wd-stone-mid); line-height: 1.6;
}

.impact-caveat {
  margin-top: 32px; padding: 24px 28px;
  background: var(--wd-amber-pale); border: 1px solid var(--wd-amber-dim);
  border-radius: var(--wd-r-lg);
}
.impact-caveat-label {
  font-family: var(--wd-font-data); font-size: 10px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--wd-amber); font-weight: 600; margin-bottom: 10px;
}
.impact-caveat p {
  font-size: 14px; color: var(--wd-stone-dark); line-height: 1.7;
}

/* ── CASE STUDY ── */
.case-study {
  margin-top: 32px; padding: 32px;
  background: var(--wd-forest); border-radius: var(--wd-r-xl);
  color: rgba(255,255,255,0.85);
}
.case-study-label {
  font-family: var(--wd-font-data); font-size: 10px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: rgba(255,255,255,0.5); margin-bottom: 12px;
}
.case-study-headline {
  font-family: var(--wd-font-display); font-size: 24px;
  font-weight: 700; letter-spacing: -0.02em;
  color: var(--wd-white); margin-bottom: 16px; line-height: 1.3;
}
.case-study-body {
  font-size: 15px; line-height: 1.7; color: rgba(255,255,255,0.75);
  margin-bottom: 28px; max-width: 640px;
}
.case-study-stats {
  display: flex; gap: 0;
  border: 1px solid rgba(255,255,255,0.15); border-radius: var(--wd-r-lg);
  overflow: hidden; background: rgba(255,255,255,0.05);
}
@media(max-width:600px) { .case-study-stats { flex-direction: column; } }
.case-study-stat {
  flex: 1; padding: 20px 24px;
}
.case-study-stat.bordered {
  border-right: 1px solid rgba(255,255,255,0.12);
}
@media(max-width:600px) {
  .case-study-stat.bordered { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.12); }
}
.case-study-stat-value {
  font-family: var(--wd-font-display); font-size: 20px;
  font-weight: 700; color: var(--wd-white); margin-bottom: 4px;
}
.case-study-stat-label {
  font-family: var(--wd-font-data); font-size: 10px;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: rgba(255,255,255,0.45);
}

/* ═══════════════════════════════════════════
   COCKPIT INTAKE WIZARD — Hero inline form
   ═══════════════════════════════════════════ */
.cockpit-intake {
  margin-top: 32px;
  background: var(--wd-white);
  border: 1px solid var(--wd-border-md);
  border-radius: var(--wd-r-xl);
  box-shadow: var(--wd-shadow-lg);
  overflow: hidden;
  max-width: 520px;
  animation: fadeUp 0.4s ease both;
}
.ci-step { display: none; padding: 28px 28px 24px; }
.ci-step.active { display: block; animation: fadeUp 0.3s ease both; }

.ci-progress {
  height: 3px; background: var(--wd-cream-2);
  border-radius: 2px; overflow: hidden; margin-bottom: 16px;
}
.ci-progress-fill {
  display: block; height: 100%; background: var(--wd-forest);
  border-radius: 2px; transition: width 0.4s ease;
}

.ci-step-label {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.08em;
  color: var(--wd-stone); margin-bottom: 8px;
  text-transform: uppercase;
}
.ci-step-title {
  font-family: var(--wd-font-display);
  font-size: 20px; font-weight: 700; letter-spacing: -0.02em;
  color: var(--wd-ink); margin-bottom: 20px; line-height: 1.2;
}

/* Radio option cards */
.ci-options {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
  margin-bottom: 20px;
}
@media(max-width:500px) { .ci-options { grid-template-columns: 1fr; } }

.ci-option { cursor: pointer; }
.ci-option input { display: none; }
.ci-option-inner {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 14px; border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  font-size: 13px; color: var(--wd-ink);
  transition: all 0.2s;
}
.ci-option-inner:hover { border-color: var(--wd-forest); }
.ci-option input:checked + .ci-option-inner {
  border-color: var(--wd-forest);
  background: var(--wd-forest-pale);
  color: var(--wd-forest);
}
.ci-option-icon {
  flex-shrink: 0; width: 28px; height: 28px;
  display: flex; align-items: center; justify-content: center;
  background: var(--wd-forest-dim);
  border-radius: var(--wd-r-sm);
  color: var(--wd-forest);
}

.ci-fields {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
  margin-bottom: 16px;
}
@media(max-width:500px) { .ci-fields { grid-template-columns: 1fr; } }

.ci-nav {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 20px;
}
.ci-next:disabled {
  opacity: 0.45; cursor: not-allowed;
  pointer-events: none;
}

/* Success state */
.ci-success {
  text-align: center; padding: 40px 28px;
  animation: fadeUp 0.4s ease both;
}
.ci-success-icon { margin-bottom: 16px; }
.ci-success-title {
  font-family: var(--wd-font-display);
  font-size: 22px; font-weight: 700; color: var(--wd-ink);
  margin-bottom: 8px;
}
.ci-success-desc {
  font-size: 14px; color: var(--wd-stone-mid);
  line-height: 1.65; margin-bottom: 24px;
}

/* ═══════════════════════════════════════════
   VALUE DRIVERS — AI in Retail Stats
   ═══════════════════════════════════════════ */
.vd-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
  margin-top: 48px;
}
@media(max-width:900px) { .vd-grid { grid-template-columns: repeat(2, 1fr); } }
@media(max-width:550px) { .vd-grid { grid-template-columns: 1fr; } }

.vd-card {
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg);
  padding: 28px 24px 24px;
  transition: border-color 0.25s, box-shadow 0.25s;
}
.vd-card:hover {
  border-color: var(--wd-border-md);
  box-shadow: var(--wd-shadow-md);
}

.vd-stat {
  font-family: var(--wd-font-display);
  font-size: 36px; font-weight: 900; letter-spacing: -0.04em;
  color: var(--wd-forest); line-height: 1.0; margin-bottom: 10px;
}
.vd-title {
  font-family: var(--wd-font-display);
  font-size: 15px; font-weight: 700; letter-spacing: -0.01em;
  color: var(--wd-ink); line-height: 1.3; margin-bottom: 10px;
}
.vd-desc {
  font-size: 13px; color: var(--wd-stone-mid);
  line-height: 1.6; margin-bottom: 12px;
}
.vd-source {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.06em;
  color: var(--wd-stone); text-transform: uppercase;
}

.vd-callout {
  display: flex; align-items: flex-start; gap: 16px;
  background: var(--wd-forest-pale);
  border: 1px solid rgba(30,58,47,0.15);
  border-radius: var(--wd-r-lg);
  padding: 24px; margin-top: 32px;
}
.vd-callout-icon {
  flex-shrink: 0; color: var(--wd-forest);
  margin-top: 2px;
}
.vd-callout-text {
  font-size: 14px; color: var(--wd-forest);
  line-height: 1.65;
}
.vd-callout-text strong { font-weight: 700; }

/* ═══════════════════════════════════════════
   SPLIT LAYOUT — Content + Slider side by side
   ═══════════════════════════════════════════ */
.csplit {
  display: grid;
  grid-template-columns: 2fr 3fr;
  gap: 48px;
  align-items: center;
}
.csplit--left .csplit__content { order: 0; }
.csplit--left .csplit__slider  { order: 1; }
.csplit--right .csplit__content { order: 1; }
.csplit--right .csplit__slider  { order: 0; }

.csplit__content { min-width: 0; }
.csplit__slider  { min-width: 0; overflow: hidden; }

.csplit__content .section-heading {
  text-align: left;
  font-size: clamp(24px, 3vw, 36px);
}
.csplit__content .section-desc {
  text-align: left; max-width: 100%;
  font-size: 14px;
}
.csplit__content .section-label { justify-content: flex-start; }

@media(max-width:900px) {
  .csplit { grid-template-columns: 1fr; gap: 24px; }
  .csplit--right .csplit__content { order: 0; }
  .csplit--right .csplit__slider  { order: 1; }
  .csplit__content .section-heading { font-size: 24px; }
}

/* ═══════════════════════════════════════════
   CAROUSEL SYSTEM — Shared Base (no arrows)
   ═══════════════════════════════════════════ */
.carousel { position: relative; overflow: hidden; }
.carousel__track {
  display: flex;
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform;
}
.carousel__slide {
  flex: 0 0 100%; min-width: 0;
  padding: 0 8px;
  box-sizing: border-box;
}
.carousel__dots { display: none; }
.carousel__dot { display: none; }

/* ─── Insight Carousel (Horizontal Slide + Fade) ─── */
.carousel--insight .carousel__track {
  transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}
.carousel--insight .carousel__slide {
  transition: opacity 0.5s ease;
  opacity: 0.15;
}
.carousel--insight .carousel__slide.active {
  opacity: 1;
}

.insight-card-large {
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg);
  padding: 24px 28px;
  transition: border-color 0.3s, box-shadow 0.3s;
}
.insight-card-large:hover {
  border-color: var(--wd-border-md);
  box-shadow: var(--wd-shadow-md);
}
.insight-card-large.card-amber { border-top: 3px solid var(--wd-amber); }
.insight-card-large.card-forest { border-top: 3px solid var(--wd-forest); }
.insight-card-large.card-success { border-top: 3px solid var(--wd-success); }

.icl-top {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 20px;
}
.icl-type-badge {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase;
  font-weight: 600; padding: 4px 10px; border-radius: var(--wd-r-pill);
}
.icl-type-insight { background: rgba(217,119,6,0.1); color: #b45309; }
.icl-type-action { background: var(--wd-forest-pale); color: var(--wd-forest); }
.icl-type-kpi-impact { background: rgba(14,165,233,0.1); color: #0369a1; }
.icl-category {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--wd-stone); margin-bottom: 8px;
}
.icl-title {
  font-family: var(--wd-font-display);
  font-size: 20px; font-weight: 800; letter-spacing: -0.02em;
  color: var(--wd-ink); line-height: 1.2; margin-bottom: 16px;
}
.icl-desc {
  font-size: 15px; color: var(--wd-stone-mid);
  line-height: 1.6; margin-bottom: 24px;
}
.icl-metric {
  display: flex; align-items: baseline; gap: 10px;
  margin-bottom: 24px; padding: 16px 0;
  border-top: 1px solid var(--wd-border);
  border-bottom: 1px solid var(--wd-border);
}
.icl-metric-val {
  font-family: var(--wd-font-display);
  font-size: 28px; font-weight: 900; letter-spacing: -0.04em;
  color: var(--wd-forest); line-height: 1;
}
.icl-metric-label {
  font-family: var(--wd-font-data);
  font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--wd-stone);
}
.icl-footer {
  display: flex; align-items: center; justify-content: space-between;
}
.icl-dept {
  font-family: var(--wd-font-data);
  font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--wd-stone);
}
.icl-action {
  font-size: 13px; padding: 8px 18px;
  animation: icl-flicker 3s ease-in-out infinite;
  position: relative;
  overflow: hidden;
}
.icl-action::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(105deg, transparent 40%, rgba(255,255,255,0.25) 50%, transparent 60%);
  animation: icl-shimmer 3s ease-in-out infinite;
}
.icl-action-icon {
  display: inline-block;
  animation: icl-spin 3s ease-in-out infinite;
}
@keyframes icl-flicker {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(30,58,47,0); }
  15% { opacity: 0.7; }
  30% { opacity: 1; box-shadow: 0 0 12px 2px rgba(30,58,47,0.25); }
  45% { opacity: 0.85; }
  60% { opacity: 1; box-shadow: 0 0 0 0 rgba(30,58,47,0); }
}
@keyframes icl-spin {
  0%, 60%, 100% { transform: rotate(0deg); }
  30% { transform: rotate(360deg); }
}
@keyframes icl-shimmer {
  0%, 60%, 100% { transform: translateX(-100%); }
  30% { transform: translateX(100%); }
}

/* ─── KPI Carousel (Vertical Reveal + Stagger) ─── */
.carousel--kpi .carousel__track {
  transition: transform 0.65s cubic-bezier(0.33, 1, 0.68, 1);
}
.carousel--kpi .carousel__slide {
  transition: opacity 0.4s, transform 0.65s cubic-bezier(0.33, 1, 0.68, 1);
  opacity: 0;
  transform: translateY(40px);
}
.carousel--kpi .carousel__slide.active {
  opacity: 1;
  transform: translateY(0);
}

.kpi-card-large {
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg);
  overflow: hidden;
  transition: box-shadow 0.3s;
}
.kpi-card-large:hover { box-shadow: var(--wd-shadow-md); }

.kcl-front {
  padding: 32px 28px 24px;
  border-bottom: 1px solid var(--wd-border);
}
.kcl-front .kf-industry-badge {
  display: inline-block;
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 3px 10px; border-radius: var(--wd-r-pill);
  background: var(--wd-forest-pale); color: var(--wd-forest);
  font-weight: 500; margin-bottom: 16px;
}
.kcl-metric {
  font-family: var(--wd-font-display);
  font-size: 36px; font-weight: 900; letter-spacing: -0.04em;
  color: var(--wd-forest); line-height: 1; margin-bottom: 6px;
}
.kcl-metric-label {
  font-family: var(--wd-font-data);
  font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--wd-stone); margin-bottom: 16px;
}
.kcl-title {
  font-family: var(--wd-font-display);
  font-size: 15px; font-weight: 700; letter-spacing: -0.01em;
  color: var(--wd-ink); line-height: 1.3;
}

.kcl-action {
  padding: 24px 28px;
  background: var(--wd-forest);
  color: var(--wd-white);
}
.kcl-action-label {
  font-family: var(--wd-font-data);
  font-size: 9px; letter-spacing: 0.12em; text-transform: uppercase;
  color: rgba(255,255,255,0.5); margin-bottom: 8px;
}
.kcl-action-title {
  font-family: var(--wd-font-display);
  font-size: 14px; font-weight: 700;
  line-height: 1.3; margin-bottom: 14px;
}
.kcl-action-result {
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,0.15);
}
.kcl-result-val {
  font-family: var(--wd-font-display);
  font-size: 22px; font-weight: 900; letter-spacing: -0.03em;
  display: block; line-height: 1; margin-bottom: 4px;
}
.kcl-result-label {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase;
  color: rgba(255,255,255,0.6);
}

/* ─── Value Driver Carousel (Fade) ─── */
.carousel--vd .carousel__track {
  transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.carousel--vd .carousel__slide {
  transition: opacity 0.5s ease;
  opacity: 0.15;
}
.carousel--vd .carousel__slide.active {
  opacity: 1;
}

.vd-card-large {
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg);
  padding: 28px 24px;
  text-align: left;
  transition: border-color 0.3s, box-shadow 0.3s;
}
.vd-card-large:hover {
  border-color: var(--wd-border-md);
  box-shadow: var(--wd-shadow-md);
}
.vd-stat-big {
  font-family: var(--wd-font-display);
  font-size: 44px; font-weight: 900; letter-spacing: -0.04em;
  color: var(--wd-forest); line-height: 1; margin-bottom: 12px;
}
.vd-card-title {
  font-family: var(--wd-font-display);
  font-size: 16px; font-weight: 700; letter-spacing: -0.01em;
  color: var(--wd-ink); line-height: 1.3; margin-bottom: 10px;
}
.vd-card-desc {
  font-size: 15px; color: var(--wd-stone-mid);
  line-height: 1.6; margin-bottom: 20px;
}
.vd-card-large .vd-source {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.06em;
  color: var(--wd-stone); text-transform: uppercase;
}

/* ─── Carousel Responsive ─── */
@media(max-width:768px) {
  .insight-card-large { padding: 20px 18px; }
  .icl-title { font-size: 17px; }
  .icl-metric-val { font-size: 24px; }
  .kcl-front { padding: 20px 16px 16px; }
  .kcl-action { padding: 16px; }
  .kcl-metric { font-size: 28px; }
  .vd-stat-big { font-size: 32px; }
  .vd-card-large { padding: 24px 20px; }
}

/* ═══════════════════════════════════════════
   GLASSMORPHISM INSIGHT CARDS — Data Lake
   ═══════════════════════════════════════════ */
.df-glass-cards {
  position: absolute; inset: 0;
  pointer-events: none; z-index: 2;
  overflow: hidden;
}
.df-glass-card {
  position: absolute;
  width: 240px;
  padding: 16px 18px;
  background: rgba(30,58,47,0.85);
  backdrop-filter: blur(16px) saturate(1.4);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: var(--wd-r-lg);
  box-shadow: 0 8px 32px rgba(30,58,47,0.18), inset 0 1px 0 rgba(255,255,255,0.1);
  opacity: 0;
  transform: translateY(12px) scale(0.95);
  transition: opacity 1.4s cubic-bezier(0.16,1,0.3,1), transform 1.4s cubic-bezier(0.16,1,0.3,1);
  pointer-events: none;
}
.df-glass-card.glass-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.df-glass-card.glass-exit {
  opacity: 0;
  transform: translateY(-8px) scale(0.97);
  transition: opacity 1s cubic-bezier(0.16,1,0.3,1), transform 1s cubic-bezier(0.16,1,0.3,1);
}
.df-glass-dot {
  width: 6px; height: 6px; border-radius: 50%;
  display: inline-block; margin-right: 6px;
  vertical-align: middle;
  animation: pulse 2s infinite;
}
.df-glass-agent {
  display: inline;
  font-family: var(--wd-font-data);
  font-size: 9px; font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: rgba(255,255,255,0.7); opacity: 1;
}
.df-glass-insight {
  font-size: 12px; color: rgba(255,255,255,0.9);
  line-height: 1.5; margin-top: 8px;
  opacity: 1;
}
.df-glass-metric {
  margin-top: 8px; padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,0.12);
  font-family: var(--wd-font-data);
  font-size: 10px; color: rgba(255,255,255,0.55);
  letter-spacing: 0.04em;
}
.df-glass-val {
  font-family: var(--wd-font-display);
  font-size: 14px; font-weight: 700;
  color: #6ee7b7; margin-right: 4px;
}
@media(max-width:900px) {
  .df-glass-cards { display: none; }
}

/* ═══════════════════════════════════════════
   PRICING PAGE
   ═══════════════════════════════════════════ */
.pricing-grid {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px;
  margin-bottom: 64px;
}
@media(max-width:1200px) { .pricing-grid { grid-template-columns: repeat(3, 1fr); } }
@media(max-width:900px) { .pricing-grid { grid-template-columns: repeat(2, 1fr); } }
@media(max-width:600px) { .pricing-grid { grid-template-columns: 1fr; } }

.pricing-card {
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-xl);
  padding: 32px 24px 28px;
  display: flex; flex-direction: column;
  transition: all 0.3s ease;
  position: relative;
}
.pricing-card:hover {
  border-color: var(--wd-border-md);
  box-shadow: var(--wd-shadow-lg);
  transform: translateY(-4px);
}
.pricing-card.popular {
  border-color: var(--wd-forest);
  box-shadow: 0 8px 32px rgba(30,58,47,0.12);
}
.pricing-card.onprem {
  background: var(--wd-forest);
  color: var(--wd-white);
  border-color: var(--wd-forest);
}
.pricing-badge {
  position: absolute; top: -12px; left: 50%;
  transform: translateX(-50%);
  padding: 4px 14px; border-radius: var(--wd-r-pill);
  background: var(--wd-forest); color: var(--wd-white);
  font-family: var(--wd-font-data);
  font-size: 10px; font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase;
  white-space: nowrap;
}
.pricing-tier {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--wd-stone); margin-bottom: 8px;
}
.pricing-card.onprem .pricing-tier { color: rgba(255,255,255,0.5); }
.pricing-price {
  font-family: var(--wd-font-display);
  font-size: 36px; font-weight: 900;
  color: var(--wd-ink); letter-spacing: -0.03em;
  line-height: 1.0; margin-bottom: 4px;
}
.pricing-card.onprem .pricing-price { color: var(--wd-white); }
.pricing-period {
  font-family: var(--wd-font-data);
  font-size: 11px; color: var(--wd-stone);
  letter-spacing: 0.04em; margin-bottom: 16px;
}
.pricing-card.onprem .pricing-period { color: rgba(255,255,255,0.5); }
.pricing-desc {
  font-size: 13px; color: var(--wd-stone-mid);
  line-height: 1.55; margin-bottom: 20px;
}
.pricing-card.onprem .pricing-desc { color: rgba(255,255,255,0.7); }
.pricing-features {
  list-style: none; margin-bottom: 24px; flex: 1;
}
.pricing-features li {
  font-size: 13px; color: var(--wd-ink);
  line-height: 1.5; padding: 6px 0 6px 20px;
  position: relative;
}
.pricing-card.onprem .pricing-features li { color: rgba(255,255,255,0.85); }
.pricing-features li::before {
  content: '\2713'; position: absolute; left: 0; top: 6px;
  color: var(--wd-forest); font-size: 12px; font-weight: 700;
}
.pricing-card.onprem .pricing-features li::before { color: rgba(255,255,255,0.6); }
.pricing-cta {
  width: 100%; text-align: center; justify-content: center;
  margin-top: auto;
}

/* Credit explainer */
.credit-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px;
  margin-top: 32px;
}
@media(max-width:800px) { .credit-grid { grid-template-columns: repeat(2, 1fr); } }
@media(max-width:500px) { .credit-grid { grid-template-columns: 1fr; } }
.credit-card {
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  padding: 20px; text-align: center;
}
.credit-card-val {
  font-family: var(--wd-font-display);
  font-size: 24px; font-weight: 800;
  color: var(--wd-forest); margin-bottom: 4px;
}
.credit-card-label {
  font-size: 13px; color: var(--wd-ink); font-weight: 500; margin-bottom: 4px;
}
.credit-card-sub {
  font-family: var(--wd-font-data);
  font-size: 10px; color: var(--wd-stone); letter-spacing: 0.04em;
}

/* Feature comparison table */
.compare-table {
  width: 100%; border-collapse: collapse;
  background: var(--wd-white); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg); overflow: hidden;
}
.compare-table th {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--wd-stone); text-align: center;
  padding: 14px 12px; border-bottom: 2px solid var(--wd-border-md);
  background: var(--wd-cream);
}
.compare-table th:first-child { text-align: left; }
.compare-table td {
  padding: 12px; font-size: 13px; color: var(--wd-ink);
  border-bottom: 1px solid var(--wd-border);
  text-align: center;
}
.compare-table td:first-child {
  text-align: left; font-weight: 500;
}
.compare-table tr:last-child td { border-bottom: none; }
.compare-table .check { color: var(--wd-forest); font-weight: 700; }
.compare-table .dash { color: var(--wd-stone); }

/* ═══════════════════════════════════════════
   FOOTER KPI STRIP
   ═══════════════════════════════════════════ */
.footer-kpi-strip {
  border-top: 1px solid var(--wd-border);
  padding: 48px 0;
  position: relative; z-index: 1;
}
.footer-kpi-inner {
  max-width: 1140px; margin: 0 auto; padding: 0 40px;
}
.footer-kpi-label {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--wd-stone); margin-bottom: 20px; text-align: center;
}
.footer-kpi-grid {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px;
}
@media(max-width:900px) { .footer-kpi-grid { grid-template-columns: repeat(3, 1fr); } }
@media(max-width:500px) { .footer-kpi-grid { grid-template-columns: repeat(2, 1fr); } }
.footer-kpi-card {
  text-align: center; padding: 16px 12px;
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  text-decoration: none; color: inherit;
  transition: all 0.25s;
  display: block;
}
.footer-kpi-card:hover {
  border-color: var(--wd-forest);
  box-shadow: var(--wd-shadow-sm);
  transform: translateY(-2px);
}
.footer-kpi-val {
  font-family: var(--wd-font-display);
  font-size: 22px; font-weight: 800;
  color: var(--wd-forest); letter-spacing: -0.02em;
}
.footer-kpi-name {
  font-family: var(--wd-font-data);
  font-size: 9px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--wd-stone); margin-top: 4px;
}

/* ═══════════════════════════════════════════
   LEGAL PAGES — Privacy & Terms
   ═══════════════════════════════════════════ */
.detail-content h2 {
  font-family: var(--wd-font-display);
  font-size: 24px; font-weight: 700; letter-spacing: -0.02em;
  color: var(--wd-ink); margin: 48px 0 12px;
}
.detail-content h3 {
  font-family: var(--wd-font-display);
  font-size: 18px; font-weight: 700; letter-spacing: -0.01em;
  color: var(--wd-ink); margin: 32px 0 10px;
}

/* ═══════════════════════════════════════════
   INTELLIGENCE PILLARS
   ═══════════════════════════════════════════ */
.pillars-section { background: var(--wd-cream); }
.pillars-accordion {
  max-width: 720px;
  margin-top: 40px;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.pillar-item {
  border-bottom: 1px solid var(--wd-border);
}
.pillar-item:first-child {
  border-top: 1px solid var(--wd-border);
}
.pillar-header {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 4px;
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
}
.pillar-header:hover {
  background: rgba(30,58,47,0.02);
}
.pillar-icon {
  width: 44px; height: 44px;
  min-width: 44px;
  border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
}
.pillar-name {
  font-family: var(--wd-font-display);
  font-size: 17px; font-weight: 700;
  color: var(--wd-ink);
  letter-spacing: -0.01em;
  flex: 1;
}
.pillar-agent {
  font-family: var(--wd-font-data);
  font-size: 11px;
  color: var(--wd-forest);
  background: rgba(30,58,47,0.06);
  border-radius: 6px;
  padding: 4px 10px;
  white-space: nowrap;
}
.pillar-chevron {
  display: flex;
  align-items: center;
  color: var(--wd-stone);
  transition: transform 0.3s ease;
}
.pillar-item.active .pillar-chevron {
  transform: rotate(180deg);
}
.pillar-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease, padding 0.35s ease;
  padding: 0 4px 0 76px;
}
.pillar-item.active .pillar-body {
  max-height: 120px;
  padding: 0 4px 20px 76px;
}
.pillar-desc {
  font-size: 14px; line-height: 1.6;
  color: var(--wd-stone);
}
@media (max-width: 600px) {
  .pillar-header { gap: 12px; padding: 16px 0; }
  .pillar-icon { width: 36px; height: 36px; min-width: 36px; }
  .pillar-name { font-size: 15px; }
  .pillar-agent { display: none; }
  .pillar-body { padding-left: 52px; }
  .pillar-item.active .pillar-body { padding-left: 52px; }
}

/* ═══════════════════════════════════════════
   DATA FLOW UNIFIED CALLOUT
   ═══════════════════════════════════════════ */
.df-unified-callout {
  margin-top: 32px;
  padding: 20px 24px;
  background: rgba(30,58,47,0.04);
  border: 1px solid rgba(30,58,47,0.1);
  border-radius: 12px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--wd-ink);
  text-align: center;
}

/* ═══════════════════════════════════════════
   WHY NOW SECTION
   ═══════════════════════════════════════════ */
.why-now-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 40px;
}
.why-now-card {
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  border-radius: 14px;
  padding: 32px 24px;
  text-align: center;
}
.why-now-stat {
  font-family: var(--wd-font-data);
  font-size: 48px; font-weight: 500;
  color: var(--wd-forest);
  line-height: 1;
  margin-bottom: 12px;
}
.why-now-title {
  font-family: var(--wd-font-display);
  font-size: 16px; font-weight: 700;
  color: var(--wd-ink);
  margin-bottom: 10px;
  letter-spacing: -0.01em;
}
.why-now-desc {
  font-size: 14px; line-height: 1.6;
  color: var(--wd-stone);
}
@media (max-width: 700px) {
  .why-now-grid { grid-template-columns: 1fr; gap: 16px; }
}

/* ═══════════════════════════════════════════
   TRACTION / PROOF SECTION
   ═══════════════════════════════════════════ */
.traction-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 40px;
}
.traction-card {
  background: rgba(30,58,47,0.04);
  border: 1px solid rgba(30,58,47,0.1);
  border-radius: 14px;
  padding: 32px 24px;
  text-align: center;
}
.traction-metric {
  font-family: var(--wd-font-data);
  font-size: 42px; font-weight: 500;
  color: var(--wd-forest);
  line-height: 1;
  margin-bottom: 8px;
}
.traction-label {
  font-family: var(--wd-font-display);
  font-size: 15px; font-weight: 700;
  color: var(--wd-ink);
  margin-bottom: 10px;
  letter-spacing: -0.01em;
}
.traction-desc {
  font-size: 13px; line-height: 1.5;
  color: var(--wd-stone);
}
.traction-quote {
  margin-top: 40px;
  padding: 32px;
  background: rgba(30,58,47,0.04);
  border-left: 3px solid var(--wd-forest);
  border-radius: 0 12px 12px 0;
}
.traction-quote blockquote {
  font-family: var(--wd-font-display);
  font-size: 18px; font-weight: 400;
  font-style: italic;
  color: var(--wd-ink);
  line-height: 1.6;
  margin: 0;
}
.traction-quote-attr {
  margin-top: 12px;
  font-size: 13px;
  color: var(--wd-stone);
}
@media (max-width: 700px) {
  .traction-grid { grid-template-columns: 1fr; gap: 16px; }
  .traction-quote { padding: 20px; }
  .traction-quote blockquote { font-size: 16px; }
}

/* ═══════════════════════════════════════════
   SCROLLYTELLING SECTIONS
   ═══════════════════════════════════════════ */

/* ── Shared scrolly layout ── */
.scrolly-track { position: relative; }
.scrolly-sticky {
  position: sticky; top: 0; height: 100vh;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.scrolly-inner {
  position: relative; width: 100%; max-width: 900px;
  margin: 0 auto; padding: 0 24px; height: 420px;
}

/* ════════════════════════════════════════════
   SECTION A: Intelligence Loop
   ════════════════════════════════════════════ */
#scrolly-intelligence .scrolly-sticky { background: var(--wd-cream); }
#scrolly-intelligence .scrolly-track { height: 420vh; }
#scrolly-intelligence .scrolly-inner {
  height: 100%; max-width: 520px;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding-top: 80px; padding-bottom: 40px;
}

/* Step dots (top progress) */
.si-header {
  position: absolute; top: 6vh; left: 50%;
  transform: translateX(-50%); text-align: center;
  z-index: 30; width: 100%;
}
.si-step-dots {
  display: flex; align-items: center; justify-content: center;
  gap: 0; margin-bottom: 14px;
}
.si-dot {
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--wd-cream-3); border: 2px solid var(--wd-border-md);
  transition: background 0.4s, border-color 0.4s, box-shadow 0.4s;
}
.si-dot.active {
  background: var(--wd-forest); border-color: var(--wd-forest);
  box-shadow: 0 0 0 4px rgba(30,58,47,0.12);
}
.si-dot.done {
  background: var(--wd-forest-hi); border-color: var(--wd-forest-hi);
}
.si-dot-line {
  width: 40px; height: 2px; background: var(--wd-cream-3);
  transition: background 0.4s;
}
.si-dot-line.done { background: var(--wd-forest-hi); }

.si-phase-label {
  font-family: var(--wd-font-data);
  font-size: 11px; font-weight: 500;
  letter-spacing: 0.10em; text-transform: uppercase;
  color: var(--wd-stone); white-space: nowrap;
  will-change: opacity; opacity: 0;
  transition: opacity 0.3s;
}

/* Ward "W" node */
.si-ward-node {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%) scale(0);
  width: 72px; height: 72px; border-radius: 50%;
  background: var(--wd-forest);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 40px rgba(30,58,47,0.15);
  will-change: transform, opacity; z-index: 10;
}
.si-ward-node span {
  font-family: var(--wd-font-display);
  font-weight: 900; font-size: 26px;
  color: var(--wd-white); letter-spacing: -0.04em;
}

/* Orbiting particles */
.si-particles {
  position: absolute; left: 50%; top: 50%;
  width: 0; height: 0; pointer-events: none;
  will-change: opacity; z-index: 5;
}
.si-particle {
  position: absolute; width: 7px; height: 7px;
  border-radius: 50%; will-change: transform, opacity;
}
.si-particle:nth-child(3n+1) { background: var(--wd-forest); }
.si-particle:nth-child(3n+2) { background: var(--wd-amber); }
.si-particle:nth-child(3n)   { background: var(--wd-forest-hi); }

/* ── Shared card styles (center-stage) ── */
.si-card {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  width: 420px; max-width: calc(100vw - 48px);
  border-radius: var(--wd-r-xl);
  padding: 28px 32px;
  will-change: transform, opacity; opacity: 0;
  z-index: 15;
  box-shadow: var(--wd-shadow-lg);
}
.si-card-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--wd-font-data);
  font-size: 10px; font-weight: 500;
  letter-spacing: 0.08em; text-transform: uppercase;
  padding: 4px 10px; border-radius: var(--wd-r-pill);
  margin-bottom: 16px;
}
.si-badge-amber { background: rgba(196,124,43,0.10); color: var(--wd-amber); }
.si-badge-forest { background: rgba(30,58,47,0.08); color: var(--wd-forest); }
.si-badge-stone { background: rgba(154,149,133,0.12); color: var(--wd-stone-mid); }

.si-card-title {
  font-family: var(--wd-font-display);
  font-size: 20px; font-weight: 700;
  color: var(--wd-ink); letter-spacing: -0.02em;
  line-height: 1.3; margin-bottom: 12px;
}
.si-card-body {
  font-size: 14px; line-height: 1.65; color: var(--wd-stone-dark);
}
.si-card-meta {
  display: flex; gap: 8px; flex-wrap: wrap; margin-top: 16px;
}
.si-meta-chip {
  font-family: var(--wd-font-data);
  font-size: 10px; font-weight: 500; letter-spacing: 0.06em;
  padding: 4px 10px; border-radius: var(--wd-r-pill);
}
.si-chip-amber { background: rgba(196,124,43,0.10); color: var(--wd-amber); }
.si-chip-forest { background: rgba(30,58,47,0.08); color: var(--wd-forest); }

/* Alert card */
.si-alert-card {
  background: var(--wd-white);
  border: 1px solid rgba(196,124,43,0.20);
  border-left: 4px solid var(--wd-amber);
}

/* Insight card */
.si-insight-card {
  background: var(--wd-white);
  border: 1px solid rgba(30,58,47,0.12);
  border-left: 4px solid var(--wd-forest-hi);
}
.si-action-list { display: flex; flex-direction: column; gap: 12px; }
.si-action-item {
  display: flex; gap: 12px; align-items: flex-start;
  font-size: 14px; line-height: 1.6; color: var(--wd-stone-dark);
}
.si-action-n {
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--wd-forest); color: var(--wd-white);
  font-family: var(--wd-font-data); font-size: 11px; font-weight: 500;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; margin-top: 2px;
}

/* Ticket card */
.si-ticket-card {
  background: var(--wd-white);
  border: 1px solid var(--wd-border-md);
}
.si-ticket-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 0; border-bottom: 1px solid var(--wd-border);
}
.si-ticket-row:last-of-type { border-bottom: none; }
.si-ticket-key {
  font-family: var(--wd-font-data); font-size: 10px; font-weight: 500;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--wd-stone);
}
.si-ticket-val {
  font-size: 14px; font-weight: 500; color: var(--wd-ink);
}
.si-status-active { color: var(--wd-forest-hi); }

/* Validation card */
.si-valid-card {
  background: var(--wd-forest-pale);
  border: 1px solid rgba(30,58,47,0.15);
  border-left: 4px solid var(--wd-forest);
}
.si-loop-note {
  display: flex; align-items: center; gap: 8px;
  margin-top: 16px; padding-top: 14px;
  border-top: 1px solid rgba(30,58,47,0.12);
  font-family: var(--wd-font-data); font-size: 10px;
  font-weight: 500; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--wd-forest);
}
.si-loop-note svg { flex-shrink: 0; stroke: var(--wd-forest); }

/* ════════════════════════════════════════════
   SECTION B: External Data Grid (dark)
   ════════════════════════════════════════════ */
#scrolly-external .scrolly-sticky { background: var(--wd-ink); }
#scrolly-external .scrolly-track { height: 250vh; }

.se-title {
  font-family: var(--wd-font-display);
  font-size: 36px; font-weight: 800;
  letter-spacing: -0.03em; line-height: 1.15;
  color: var(--wd-white); text-align: center;
  margin-bottom: 40px;
  will-change: transform, opacity; opacity: 0;
}

.se-tiles {
  display: flex; flex-direction: column; gap: 14px;
  max-width: 620px; margin: 0 auto;
}

.se-tile {
  display: flex; align-items: flex-start; gap: 16px;
  padding: 14px 18px; border-radius: var(--wd-r-md);
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  will-change: transform, opacity; opacity: 0;
}
.se-tile-icon {
  width: 36px; height: 36px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.se-tile-text h4 {
  font-family: var(--wd-font-display);
  font-size: 14px; font-weight: 700; color: var(--wd-white);
  letter-spacing: -0.01em; margin-bottom: 4px;
}
.se-tile-text p {
  font-size: 12px; line-height: 1.5; color: rgba(255,255,255,0.6);
}

.se-tagline {
  font-family: var(--wd-font-data);
  font-size: 11px; font-weight: 500;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--wd-forest-hi); text-align: center;
  margin-top: 32px;
  will-change: transform, opacity; opacity: 0;
}

/* ════════════════════════════════════════════
   DATA LAKE LOOP (canvas-based pentagon flow)
   ════════════════════════════════════════════ */
.dl-loop {
  position: relative; width: 100%; max-width: 720px;
  aspect-ratio: 720 / 400;
  margin: 0 auto;
}
#dl-canvas {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  pointer-events: none; z-index: 0;
}

.dl-node {
  position: absolute; transform: translate(-50%, -50%);
  text-align: center; z-index: 5;
}
/* Pentagon layout: Data In left, Ward top, Insight right, Action bottom-right, Feedback bottom-left */
.dl-node-datain  { left: 12.5%; top: 50%; }
.dl-node-ward    { left: 50%;   top: 12%; }
.dl-node-insight { left: 87.5%; top: 50%; }
.dl-node-action  { left: 75%;   top: 90%; }
.dl-node-feedback { left: 25%;  top: 90%; }

.dl-node-circle {
  width: 64px; height: 64px; border-radius: 50%;
  background: var(--wd-white);
  border: 2px solid var(--wd-border-md);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 8px;
  transition: all 0.6s cubic-bezier(0.4,0,0.2,1);
  color: var(--wd-stone);
  box-shadow: var(--wd-shadow-sm);
}
.dl-node-ward .dl-node-circle {
  width: 80px; height: 80px;
  border-color: var(--wd-forest-dim);
}

.dl-node.dl-active .dl-node-circle {
  background: var(--wd-forest); border-color: var(--wd-forest);
  box-shadow: 0 0 28px rgba(30,58,47,0.25), 0 0 8px rgba(30,58,47,0.15);
  color: var(--wd-white);
}
.dl-node-feedback.dl-active .dl-node-circle,
.dl-node-action.dl-active .dl-node-circle {
  background: var(--wd-amber); border-color: var(--wd-amber);
  box-shadow: 0 0 28px rgba(196,124,43,0.25), 0 0 8px rgba(196,124,43,0.15);
  color: var(--wd-white);
}

.dl-w {
  font-family: var(--wd-font-display);
  font-weight: 900; font-size: 22px;
  letter-spacing: -0.04em; color: inherit;
}
.dl-node-label {
  font-family: var(--wd-font-data);
  font-size: 10px; font-weight: 500;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--wd-stone); white-space: nowrap;
  transition: color 0.4s;
}
.dl-node.dl-active .dl-node-label { color: var(--wd-ink); }

.dl-descs {
  position: relative; min-height: 48px;
  width: 100%; max-width: 520px; text-align: center;
  margin: 20px auto 0;
}
.dl-desc {
  position: absolute; top: 0; left: 0; right: 0;
  font-size: 14px; line-height: 1.6;
  color: var(--wd-stone-dark);
  opacity: 0; transition: opacity 0.4s;
}
.dl-desc.dl-desc-active { opacity: 1; }

/* ════════════════════════════════════════════
   SECTION C: Design Partnership Proof
   ════════════════════════════════════════════ */
.dp-section { padding: 80px 0 60px; background: var(--wd-cream); }
.dp-header { text-align: center; margin-bottom: 48px; }
.dp-header .section-desc { margin-left: auto; margin-right: auto; }

.dp-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 20px; max-width: 780px; margin: 0 auto;
}
.dp-metric-card {
  background: var(--wd-white); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-xl); padding: 32px 28px;
  text-align: center;
  transition: box-shadow 0.3s;
}
.dp-metric-card:hover { box-shadow: var(--wd-shadow-md); }

/* Hero card spans full width */
.dp-metric-hero {
  grid-column: 1 / -1;
  background: var(--wd-forest); border-color: var(--wd-forest);
  text-align: center; padding: 44px 32px;
}
.dp-metric-hero .dp-number { color: var(--wd-white); }
.dp-metric-hero .dp-label { color: rgba(255,255,255,0.7); }
.dp-metric-hero .dp-context { color: rgba(255,255,255,0.55); }

.dp-number {
  font-family: var(--wd-font-display);
  font-size: 56px; font-weight: 900;
  color: var(--wd-forest); letter-spacing: -0.04em;
  line-height: 1; margin-bottom: 8px;
}
.dp-label {
  font-family: var(--wd-font-data);
  font-size: 11px; font-weight: 500;
  letter-spacing: 0.10em; text-transform: uppercase;
  color: var(--wd-stone); margin-bottom: 14px;
}
.dp-context {
  font-size: 13px; line-height: 1.6;
  color: var(--wd-stone);
}

/* Count-up animation class */
.dp-number.counting { transition: none; }

@media (max-width: 700px) {
  .dp-grid { grid-template-columns: 1fr; }
  .dp-number { font-size: 42px; }
  .dp-metric-hero { padding: 32px 24px; }
  .dp-section { padding: 60px 0 40px; }
}

/* ── Mobile fallback: simple reveal ── */
.scrolly-mobile .scrolly-track { height: auto !important; }
.scrolly-mobile .scrolly-sticky {
  position: relative !important; height: auto !important;
  padding: 60px 0;
}
.scrolly-mobile .scrolly-inner { height: auto; }

/* Mobile: Intelligence Loop */
.scrolly-mobile .si-ward-node { display: none; }
.scrolly-mobile .si-particles { display: none; }
.scrolly-mobile .si-header { position: relative; top: auto; left: auto; transform: none; margin-bottom: 24px; }
.scrolly-mobile .si-dot.active, .scrolly-mobile .si-dot { background: var(--wd-forest-hi); border-color: var(--wd-forest-hi); }
.scrolly-mobile .si-dot-line { background: var(--wd-forest-hi); }
.scrolly-mobile .si-phase-label { display: none; }
.scrolly-mobile .si-card {
  position: relative; left: auto; top: auto;
  transform: none !important; opacity: 1 !important;
  margin: 16px auto; width: 100%;
}

/* Mobile: External data */
.scrolly-mobile .se-title {
  opacity: 1 !important; transform: none !important;
  font-size: 28px;
}
.scrolly-mobile .se-tile {
  opacity: 1 !important; transform: none !important;
}
.scrolly-mobile .se-tagline {
  opacity: 1 !important; transform: none !important;
}

@media (max-width: 700px) {
  .se-title { font-size: 24px; }
  .dl-node-circle { width: 44px; height: 44px; }
  .dl-node-ward .dl-node-circle { width: 56px; height: 56px; }
  .dl-w { font-size: 16px; }
  .dl-node-label { font-size: 8px; }
  .dl-node svg { width: 14px; height: 14px; }
  .dl-loop { aspect-ratio: 720 / 440; }
  .dl-descs { min-height: 64px; }
  .dl-desc { font-size: 12px; }
  .si-card { width: 100%; max-width: 100%; padding: 20px 18px; }
  .si-card-title { font-size: 17px; }
}

/* ═══════════════════════════════════════════
   MOBILE RESPONSIVE OVERHAUL
   ═══════════════════════════════════════════ */

/* ── Mobile nav menu (CSS-driven) ── */
@media (max-width: 768px) {
  .nav-links {
    display: none;
    flex-direction: column;
    position: absolute;
    top: 56px;
    left: 0;
    right: 0;
    background: rgba(250,248,243,0.98);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    padding: 16px 20px;
    border-bottom: 1px solid var(--wd-border);
    gap: 4px;
    box-shadow: 0 8px 24px rgba(26,26,20,0.08);
    max-height: calc(100vh - 56px);
    overflow-y: auto;
  }
  .nav-links.mobile-open {
    display: flex;
  }
  .nav-links li { width: 100%; }
  .nav-link-btn, .nav-link-simple {
    width: 100%;
    justify-content: space-between;
    padding: 12px 16px;
    font-size: 12px;
  }
  .nav-cta {
    display: block;
    text-align: center;
    margin-left: 0;
    margin-top: 8px;
    padding: 12px 18px;
  }
  .nav-has-mega { position: static; }
}

/* ── Section padding reduction ── */
@media (max-width: 700px) {
  section { padding: 60px 0; }
  .section-desc { margin-bottom: 32px; }
  .form-section { padding: 48px 0; }
  .cta-section { padding: 56px 0; }
  .security-section { padding: 56px 0; }
  .dp-section { padding: 48px 0 32px; }
  .footer-kpi-strip { padding: 32px 0; }
  .footer-kpi-inner { padding: 0 20px; }
}

/* ── Hero mobile fixes ── */
@media (max-width: 700px) {
  .hero-flex { padding: 100px 20px 32px; gap: 24px; }
  .hero-sub { font-size: 15px; margin-bottom: 24px; }
  .hero-eyebrow { margin-bottom: 20px; }
  .cockpit-intake { max-width: 100%; }
  .ci-step { padding: 20px 18px 18px; }
  .ci-step-title { font-size: 17px; margin-bottom: 16px; }
}
@media (max-width: 500px) {
  .hero-flex { padding: 90px 16px 24px; }
  h1.hero-title { margin-bottom: 16px; }
}

/* ── Breadcrumbs mobile ── */
@media (max-width: 700px) {
  .breadcrumbs { padding: 70px 0 12px; }
  .detail-hero { padding: 16px 0 48px; }
}

/* ── Grid collapse fixes ── */
@media (max-width: 500px) {
  .accuracy-metrics-row { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .accuracy-metric-val { font-size: 22px; }
  .accuracy-metric-card { padding: 14px 8px; }
  .accuracy-bar-label { min-width: 60px; font-size: 10px; }
}
@media (max-width: 600px) {
  .pillars-accordion { max-width: 100%; }
}

/* ── Tables: horizontal scroll ── */
.roi-agent-table-wrap,
.compare-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 0 -20px;
  padding: 0 20px;
}
@media (max-width: 700px) {
  .roi-agent-table { min-width: 540px; }
  .compare-table { min-width: 600px; }
}

/* ── ROI report mobile ── */
@media (max-width: 700px) {
  .roi-report-header { padding: 16px 20px; flex-wrap: wrap; gap: 8px; }
  .roi-report-title { font-size: 15px; }
  .roi-report-period { margin-left: 0; }
  .roi-report-body { padding: 20px; }
  .roi-summary-card { padding: 18px 12px; }
  .roi-summary-val { font-size: 26px; }
}

/* ── Accuracy report mobile ── */
@media (max-width: 700px) {
  .accuracy-report-header { padding: 14px 18px; flex-wrap: wrap; gap: 8px; }
  .accuracy-report-date { margin-left: 0; }
  .accuracy-report-body { padding: 18px; }
  .accuracy-bar-row { gap: 8px; }
}

/* ── NLQ chat mobile ── */
@media (max-width: 500px) {
  .nlq-chat-messages { padding: 14px; gap: 12px; }
  .nlq-msg-bubble { max-width: 90%; padding: 10px 12px; font-size: 12px; }
  .nlq-chat-input { padding: 10px 14px; }
  .nlq-input-field { padding: 8px 10px; font-size: 12px; }
  .nlq-send-btn { padding: 8px 14px; font-size: 12px; }
}

/* ── Data flow viz mobile ── */
@media (max-width: 600px) {
  .df-sources { gap: 8px; }
  .df-source-node { padding: 10px 12px; }
  .df-node-label { font-size: 12px; }
  .df-ward-hub { width: 90px; height: 90px; }
  .df-hub-icon svg { width: 22px; height: 22px; }
  .df-hub-name { font-size: 12px; }
  .df-hub-ring { inset: -10px; }
  .df-hub-ring-2 { inset: -20px; }
  .int-lake-sources { gap: 8px; }
  .int-lake-node { padding: 10px 12px; }
}

/* ── Trust bar mobile ── */
@media (max-width: 600px) {
  .trust-bar { padding: 14px 0; }
  .trust-bar-inner { padding: 0 20px; }
  .trust-bar-names { flex-wrap: wrap; gap: 8px; }
  .trust-name { font-size: 12px; }
  .trust-bar-context { font-size: 11px; }
}

/* ── Security strip mobile ── */
@media (max-width: 600px) {
  .security-strip-inner { gap: 10px; justify-content: flex-start; padding: 0 20px; }
  .security-badge { font-size: 9px; }
  .security-badge-divider { display: none; }
}

/* ── Security grid mobile ── */
@media (max-width: 500px) {
  .security-card { padding: 20px 16px; }
  .security-card-title { font-size: 14px; }
  .security-card-desc { font-size: 12px; }
}

/* ── Pricing mobile ── */
@media (max-width: 600px) {
  .pricing-card { padding: 24px 18px 22px; }
  .pricing-price { font-size: 28px; }
  .credit-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 400px) {
  .credit-grid { grid-template-columns: 1fr; }
}

/* ── Comparison cards mobile ── */
@media (max-width: 700px) {
  .compare-card { padding: 24px 20px; }
  .compare-title { font-size: 19px; }
}

/* ── How-it-works mobile ── */
@media (max-width: 800px) {
  .how-step { padding: 28px 24px; }
}

/* ── Flip cards mobile ── */
@media (max-width: 600px) {
  .insight-card-flip { height: 360px; }
  .kpi-flip-card { height: 340px; }
  .kf-metric-big { font-size: 26px; }
}

/* ── Value driver cards mobile ── */
@media (max-width: 550px) {
  .vd-stat { font-size: 28px; }
  .vd-card { padding: 22px 18px 18px; }
}

/* ── Case study mobile ── */
@media (max-width: 600px) {
  .case-study { padding: 24px 18px; }
  .case-study-headline { font-size: 20px; }
  .case-study-body { font-size: 14px; }
  .case-study-stat { padding: 16px 18px; }
  .case-study-stat-value { font-size: 18px; }
}

/* ── External data grid mobile ── */
@media (max-width: 600px) {
  .ext-data-card { padding: 24px 18px; }
  .ext-icon { width: 44px; height: 44px; margin-bottom: 14px; }
  .ext-title { font-size: 17px; }
  .ext-callout { flex-direction: column; gap: 10px; padding: 18px; }
}

/* ── Ward demo bubble mobile ── */
@media (max-width: 500px) {
  .ward-demo-header { padding: 12px 16px; }
  .ward-demo-body { padding: 16px; }
  .ward-demo-body p { font-size: 13px; }
}

/* ── Form mobile ── */
@media (max-width: 700px) {
  .form-header { padding: 24px 20px 18px; }
  .lead-form { padding: 20px; }
  .form-container { border-radius: var(--wd-r-lg); }
}

/* ── Footer mobile ── */
@media (max-width: 700px) {
  .footer-inner { padding: 0 20px; gap: 12px; }
  .footer-left { flex-wrap: wrap; }
  .footer-links { flex-wrap: wrap; gap: 14px; }
  .footer-trust { justify-content: flex-start; }
  footer { padding: 32px 0; }
}

/* ── FAQ mobile ── */
@media (max-width: 500px) {
  .faq-q { font-size: 14px; padding: 16px 0; }
  .faq-a p { font-size: 13px; }
}

/* ── Impact cards mobile ── */
@media (max-width: 500px) {
  .impact-card { padding: 22px 18px; }
  .impact-range { font-size: 17px; }
  .impact-caveat { padding: 18px 20px; }
}

/* ── Why now / traction mobile ── */
@media (max-width: 500px) {
  .why-now-card { padding: 24px 18px; }
  .why-now-stat { font-size: 36px; }
  .traction-card { padding: 24px 18px; }
  .traction-metric { font-size: 32px; }
}

/* ── Industry KPI tabs overflow ── */
@media (max-width: 600px) {
  .industry-kpi-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 6px;
    padding-bottom: 4px;
  }
  .industry-kpi-tab { flex-shrink: 0; padding: 6px 14px; font-size: 10px; }
}

/* ── Ticker mobile ── */
@media (max-width: 500px) {
  .ticker-strip { padding: 10px 0; }
  .ticker-track { gap: 32px; }
  .ticker-item { font-size: 10px; }
}

/* ── Vert tabs mobile ── */
@media (max-width: 800px) {
  .vert-tab-content { padding: 24px 18px; }
}

/* ── Global: prevent horizontal overflow ── */
html, body { overflow-x: clip; }
img, video, svg, canvas { max-width: 100%; height: auto; }

/* ── Small touch targets ── */
@media (max-width: 768px) {
  .btn { padding: 14px 24px; font-size: 15px; }
  .nav-mobile-toggle { padding: 10px; }
}

/* ══════════════════════════════════════════════════════════════
   CLOSED-LOOP WIDGET
   ══════════════════════════════════════════════════════════════ */
.closed-loop-section { padding: 0; }

/* ── Closed-loop scrollytelling ── */
#scrolly-closed-loop { padding: 0; }
#scrolly-closed-loop .scrolly-track { height: 500vh; position: relative; }
#scrolly-closed-loop > .scrolly-track > .scrolly-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: var(--wd-cream);
}
#scrolly-closed-loop .cl-loop-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 40px;
  max-width: 1200px;
  width: 100%;
  padding: 0 40px;
  box-sizing: border-box;
}

/* ── Loop ring canvas ── */
.cl-loop-canvas {
  position: relative;
  width: 100%;
  max-width: 440px;
  aspect-ratio: 1;
  margin: 0 auto;
  align-self: center;
}
.cl-loop-svg {
  width: 100%; height: 100%;
  display: block;
}
.cl-loop-progress {
  transition: stroke-dashoffset 0.35s cubic-bezier(0.16,1,0.3,1);
}

/* Node active states */
.cl-loop-node circle {
  transition: all 0.4s cubic-bezier(0.16,1,0.3,1);
}
.cl-loop-node.active circle {
  fill: var(--wd-forest);
  stroke: var(--wd-forest);
}
.cl-loop-node.active svg { stroke: rgba(255,255,255,0.9); }
.cl-loop-node.done circle {
  fill: var(--wd-forest-pale);
  stroke: var(--wd-forest-hi);
}
.cl-loop-node.done svg { stroke: var(--wd-forest-hi); }

/* Center hub */
.cl-loop-center {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 72px; height: 72px;
  background: var(--wd-forest);
  border-radius: 50%;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  box-shadow: 0 4px 24px rgba(30,58,47,0.25);
}
.cl-loop-center-icon svg { width: 24px; height: 24px; }
.cl-loop-center-label {
  font-family: var(--wd-font-data);
  font-size: 8px; letter-spacing: 0.14em;
  text-transform: uppercase; color: rgba(255,255,255,0.6);
  margin-top: 1px;
}

/* Labels positioned outside the ring */
.cl-loop-label {
  position: absolute;
  font-family: var(--wd-font-data);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wd-stone);
  white-space: nowrap;
  transition: color 0.4s, font-weight 0.4s;
}
.cl-loop-label.active {
  color: var(--wd-forest);
  font-weight: 700;
}
.cl-loop-label-0 { top: 2%;  left: 50%; transform: translateX(-50%); }
.cl-loop-label-1 { top: 26%; right: 0; }
.cl-loop-label-2 { bottom: 8%; right: 10%; }
.cl-loop-label-3 { bottom: 8%; left: 10%; }
.cl-loop-label-4 { top: 26%; left: 0; }

/* ── Detail panel (right side) ── */
.cl-loop-detail {
  align-self: center;
  max-width: 440px;
  position: relative;
}
.cl-loop-header {
  margin-bottom: 24px;
}

/* Step detail cards */
.cl-loop-card {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.45s cubic-bezier(0.16,1,0.3,1), transform 0.45s cubic-bezier(0.16,1,0.3,1);
  position: absolute;
  top: 80px;
  left: 0; right: 0;
  pointer-events: none;
}
.cl-loop-card.active {
  opacity: 1;
  transform: translateY(0);
  position: relative;
  pointer-events: auto;
}
.cl-loop-card-num {
  font-family: var(--wd-font-data);
  font-size: 12px; letter-spacing: 0.08em;
  color: var(--wd-stone);
  margin-bottom: 8px;
}
.cl-loop-card-title {
  font-family: var(--wd-font-display);
  font-size: clamp(20px, 2.5vw, 26px);
  font-weight: 700;
  color: var(--wd-ink);
  margin: 0 0 12px 0;
  line-height: 1.25;
}
.cl-loop-card-desc {
  font-size: 15px;
  color: var(--wd-stone-mid);
  line-height: 1.7;
  margin: 0;
}
.cl-loop-card-signals {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 20px;
}

/* Signal chips (shared) */
.cl-signal {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--wd-font-data);
  font-size: 11px;
  letter-spacing: 0.04em;
  color: var(--wd-forest);
  background: rgba(30,58,47,0.05);
  border: 1px solid rgba(30,58,47,0.12);
  border-radius: 6px;
  padding: 6px 12px;
  white-space: nowrap;
}
.cl-signal svg {
  flex-shrink: 0;
  color: var(--wd-forest);
}

/* ── Metrics strip ── */
.cl-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin: 40px 0 60px;
  border: 1px solid var(--wd-border-md);
  border-radius: var(--wd-r-lg);
  overflow: hidden;
  background: var(--wd-white);
}
.cl-metric {
  padding: 24px 20px;
  text-align: center;
  border-right: 1px solid var(--wd-border);
}
.cl-metric:last-child { border-right: none; }
.cl-metric-val {
  font-family: var(--wd-font-display);
  font-size: 28px; font-weight: 900;
  color: var(--wd-forest);
  letter-spacing: -0.03em;
  display: inline;
}
.cl-metric-unit {
  font-family: var(--wd-font-display);
  font-size: 18px; font-weight: 700;
  color: var(--wd-forest);
  display: inline;
}
.cl-metric-label {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wd-stone);
  margin-top: 6px;
}

/* ── Closed-loop mobile fallback ── */
#scrolly-closed-loop.scrolly-mobile .scrolly-track { height: auto !important; }
#scrolly-closed-loop.scrolly-mobile .scrolly-sticky {
  position: relative;
  height: auto;
}
#scrolly-closed-loop.scrolly-mobile .cl-loop-inner {
  display: flex;
  flex-direction: column;
  padding: 60px 24px 40px;
  gap: 32px;
}
#scrolly-closed-loop.scrolly-mobile .cl-loop-canvas {
  max-width: 280px;
}
#scrolly-closed-loop.scrolly-mobile .cl-loop-detail {
  max-width: 100%;
}
#scrolly-closed-loop.scrolly-mobile .cl-loop-card {
  opacity: 1;
  transform: none;
  position: relative;
  top: auto;
  pointer-events: auto;
  padding-bottom: 28px;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--wd-border);
}
#scrolly-closed-loop.scrolly-mobile .cl-loop-card:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

@media (max-width: 900px) {
  #scrolly-closed-loop .cl-loop-inner {
    grid-template-columns: 1fr;
    padding: 40px 24px;
  }
  .cl-loop-canvas { max-width: 300px; }
}
@media (max-width: 600px) {
  .cl-metrics { grid-template-columns: repeat(2, 1fr); }
  .cl-metric { border-bottom: 1px solid var(--wd-border); }
  .cl-metric:nth-child(3), .cl-metric:nth-child(4) { border-bottom: none; }
  .cl-metric:nth-child(2) { border-right: none; }
  .cl-signal { font-size: 10px; padding: 5px 10px; }
  .closed-loop-section { padding: 0 0 48px; }
}

/* ═══════════════════════════════════════════════════════════
   ABOUT PAGE
   ═══════════════════════════════════════════════════════════ */

/* ── ABOUT PAGE — v2 visual overhaul ── */

/* Shared section spacing — tighter than old 80px/80px */
.about-section {
  padding: 56px 0;
  position: relative;
  overflow: hidden;
}
.about-section:nth-child(odd) { background: var(--wd-cream); }
.about-section:nth-child(even) { background: var(--wd-white); }

/* Shared body text */
.about-body-text {
  font-size: 17px;
  line-height: 1.7;
  color: var(--wd-stone-mid);
  margin-bottom: 20px;
}

/* Directional reveal animations */
.reveal-left {
  opacity: 0; transform: translateX(-40px);
  transition: all 0.8s cubic-bezier(0.16,1,0.3,1);
}
.reveal-left.visible { opacity: 1; transform: translateX(0); }

.reveal-right {
  opacity: 0; transform: translateX(40px);
  transition: all 0.8s cubic-bezier(0.16,1,0.3,1);
}
.reveal-right.visible { opacity: 1; transform: translateX(0); }

/* Staggered delay support for reveal */
.reveal[style*="--delay"] { transition-delay: var(--delay); }

/* ── TIMELINE (Section 01) ── */
.about-timeline {
  position: relative;
  padding-left: 40px;
}
.about-timeline-line {
  position: absolute;
  left: 8px;
  top: 0;
  bottom: 0;
  width: 2px;
  background: linear-gradient(to bottom, var(--wd-forest) 0%, var(--wd-forest-hi) 50%, transparent 100%);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform 1.4s cubic-bezier(0.16,1,0.3,1);
}
.about-timeline.animated .about-timeline-line {
  transform: scaleY(1);
}
.about-timeline-block {
  position: relative;
  margin-bottom: 32px;
}
.about-timeline-block:last-child { margin-bottom: 0; }
.about-timeline-dot {
  position: absolute;
  left: -40px;
  top: 6px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--wd-white);
  border: 3px solid var(--wd-forest);
  box-shadow: 0 0 0 4px var(--wd-forest-dim);
  z-index: 1;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.about-timeline-block.visible .about-timeline-dot {
  transform: scale(1.2);
  box-shadow: 0 0 0 8px var(--wd-forest-dim);
}

/* ── STAT CARDS (Section 02) ── */
.about-stats-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 32px;
}
.about-stat-card {
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  padding: 24px;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  transition-delay: var(--delay, 0s);
}
.about-stat-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--wd-forest), var(--wd-forest-hi));
  transform: scaleX(0);
  transition: transform 0.6s cubic-bezier(0.16,1,0.3,1) 0.3s;
}
.about-stat-card.visible::before { transform: scaleX(1); }
.about-stat-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--wd-shadow-lg);
}
.about-stat-number {
  font-family: var(--wd-font-data);
  font-size: 40px;
  font-weight: 500;
  color: var(--wd-forest);
  margin-bottom: 4px;
  line-height: 1;
}
.about-stat-label {
  font-size: 13px;
  color: var(--wd-stone);
  margin-bottom: 12px;
}
.about-stat-bar {
  height: 4px;
  background: var(--wd-border);
  border-radius: 2px;
  overflow: hidden;
}
.about-stat-bar-fill {
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--wd-forest), var(--wd-forest-hi));
  border-radius: 2px;
  transition: width 1.2s cubic-bezier(0.16,1,0.3,1) 0.5s;
}
.about-stat-card.visible .about-stat-bar-fill {
  width: var(--fill);
}

.about-stack-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

/* ── PHILOSOPHY CARD (Section 03) ── */
.about-philosophy-card {
  position: relative;
  border-radius: var(--wd-r-lg);
  padding: 3px;
  background: linear-gradient(135deg, var(--wd-forest), var(--wd-forest-hi), var(--wd-amber), var(--wd-forest));
  background-size: 300% 300%;
  animation: about-gradient-shift 6s ease infinite;
}
@keyframes about-gradient-shift {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}
.about-philosophy-glow {
  position: absolute;
  inset: -60px;
  background: radial-gradient(circle at center, rgba(30,58,47,0.15), transparent 70%);
  pointer-events: none;
  animation: about-glow-pulse 4s ease-in-out infinite;
}
@keyframes about-glow-pulse {
  0%, 100% { opacity: 0.5; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.05); }
}
.about-philosophy-inner {
  background: var(--wd-forest);
  border-radius: calc(var(--wd-r-lg) - 2px);
  padding: 48px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.about-philosophy-headline {
  font-family: var(--wd-font-display);
  font-size: clamp(24px, 3.5vw, 36px);
  color: var(--wd-white);
  margin: 0 0 12px;
  font-weight: 600;
}
.about-philosophy-sub {
  color: rgba(255,255,255,0.6);
  margin: 0;
  font-size: 15px;
}
.about-philosophy-pulse {
  position: absolute;
  top: 50%; left: 50%;
  width: 200px; height: 200px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(61,122,92,0.3), transparent 70%);
  animation: about-pulse-ring 3s ease-in-out infinite;
  pointer-events: none;
}
@keyframes about-pulse-ring {
  0%, 100% { transform: translate(-50%, -50%) scale(0.8); opacity: 0; }
  50% { transform: translate(-50%, -50%) scale(1.5); opacity: 1; }
}

/* ── TEAM GRID (Section 04) ── */
.about-team-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
.about-team-card {
  display: flex;
  gap: 20px;
  padding: 24px;
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  position: relative;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  transition-delay: var(--delay, 0s);
}
.about-team-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--wd-shadow-lg);
}
.about-team-card-accent {
  position: absolute;
  top: 0; left: 0; bottom: 0;
  width: 3px;
  background: linear-gradient(to bottom, var(--wd-forest), var(--wd-forest-hi));
  transform: scaleY(0);
  transform-origin: top;
  transition: transform 0.6s cubic-bezier(0.16,1,0.3,1) 0.2s;
}
.about-team-card.visible .about-team-card-accent {
  transform: scaleY(1);
}
.about-team-photo {
  flex-shrink: 0;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--wd-border);
  background: var(--wd-cream);
  transition: border-color 0.3s ease;
}
.about-team-card:hover .about-team-photo {
  border-color: var(--wd-forest);
}
.about-team-info {
  min-width: 0;
}
.about-team-name {
  font-family: var(--wd-font-display);
  font-weight: 600;
  font-size: 18px;
  color: var(--wd-forest);
  margin-bottom: 2px;
}
.about-team-role {
  font-family: var(--wd-font-data);
  font-size: 12px;
  color: var(--wd-stone);
  letter-spacing: 0.02em;
  margin-bottom: 10px;
}
.about-team-bio {
  font-size: 14px;
  line-height: 1.6;
  color: var(--wd-stone-mid);
  margin: 0;
}

/* ── INDUSTRY GRID (Section 05) ── */
.about-industry-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
.about-industry-card {
  padding: 28px;
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  position: relative;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  transition-delay: var(--delay, 0s);
}
.about-industry-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--wd-shadow-lg);
}
.about-industry-card-line {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--wd-forest), var(--wd-forest-hi));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.6s cubic-bezier(0.16,1,0.3,1) 0.2s;
}
.about-industry-card.visible .about-industry-card-line {
  transform: scaleX(1);
}
.about-industry-icon {
  width: 44px;
  height: 44px;
  border-radius: var(--wd-r-sm);
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  transition: background 0.3s ease, border-color 0.3s ease;
}
.about-industry-card:hover .about-industry-icon {
  background: var(--wd-forest-pale);
  border-color: var(--wd-forest);
}
.about-industry-card h3 {
  font-family: var(--wd-font-display);
  font-weight: 600;
  font-size: 18px;
  color: var(--wd-forest);
  margin: 0 0 8px;
}
.about-industry-card p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--wd-stone-mid);
  margin: 0;
}

/* About responsive */
@media (max-width: 700px) {
  .about-section { padding: 40px 0; }
  .about-team-grid,
  .about-industry-grid { grid-template-columns: 1fr; }
  .about-team-card {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .about-stats-row { grid-template-columns: 1fr; }
  .about-stack-grid { grid-template-columns: 1fr; }
  .about-timeline { padding-left: 32px; }
}

/* ═══════════════════════════════════════════════════════════
   PPC LANDING PAGE
   ═══════════════════════════════════════════════════════════ */

/* Social proof badge */
.ppc-proof-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--wd-font-data);
  font-size: 13px;
  color: var(--wd-stone-mid);
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-pill);
  padding: 8px 18px;
}

/* Insight card on PPC */
.ppc-insight-card {
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  overflow: hidden;
  box-shadow: var(--wd-shadow-md);
}
.ppc-insight-card .aic-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 20px;
  border-bottom: 1px solid var(--wd-border);
  font-family: var(--wd-font-data);
  font-size: 12px;
  color: var(--wd-stone);
}
.ppc-insight-card .aic-agent-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.ppc-insight-card .aic-agent-name { font-weight: 500; color: var(--wd-stone-dark); }
.ppc-insight-card .aic-time { margin-left: auto; }
.ppc-insight-card .aic-body { padding: 20px; }
.ppc-insight-card .aic-title {
  font-family: var(--wd-font-display);
  font-weight: 600;
  font-size: 18px;
  color: var(--wd-forest);
  margin-bottom: 8px;
}
.ppc-insight-card .aic-desc {
  font-size: 14px;
  line-height: 1.6;
  color: var(--wd-stone-mid);
  margin-bottom: 12px;
}
.ppc-insight-card .aic-metric {
  font-family: var(--wd-font-data);
  font-size: 13px;
  color: var(--wd-stone);
}
.ppc-insight-card .aic-val.down { color: var(--wd-danger); }
.ppc-insight-card .aic-val.up { color: var(--wd-success); }

.ppc-action-btn {
  font-family: var(--wd-font-data);
  font-size: 12px;
  padding: 6px 14px;
  border-radius: var(--wd-r-sm);
  background: var(--wd-forest);
  color: var(--wd-white);
  cursor: pointer;
}
.ppc-action-btn.secondary {
  background: transparent;
  color: var(--wd-stone);
  border: 1px solid var(--wd-border);
}

/* Steps */
.ppc-steps-grid {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 0;
}
.ppc-step {
  flex: 1;
  max-width: 280px;
  text-align: center;
  padding: 0 24px;
}
.ppc-step-n {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--wd-forest);
  color: var(--wd-white);
  font-family: var(--wd-font-data);
  font-size: 16px;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px;
}
.ppc-step h3 {
  font-family: var(--wd-font-display);
  font-weight: 600;
  font-size: 20px;
  color: var(--wd-forest);
  margin-bottom: 8px;
}
.ppc-step p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--wd-stone-mid);
  margin: 0;
}
.ppc-step-arrow {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  padding-top: 8px;
}

/* KPI grid */
.ppc-kpi-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.ppc-kpi-card {
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  padding: 24px;
  text-align: center;
}
.ppc-kpi-label {
  font-family: var(--wd-font-data);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--wd-stone);
  margin-bottom: 8px;
}
.ppc-kpi-val {
  font-family: var(--wd-font-data);
  font-size: 28px;
  font-weight: 500;
  color: var(--wd-forest);
  margin-bottom: 4px;
}
.ppc-kpi-note {
  font-size: 12px;
  color: var(--wd-stone);
}

/* ─── PARTNER / REFERRAL PAGES ────────────────────────── */

/* Steps */
.partner-steps {
  display: flex;
  align-items: flex-start;
  gap: 24px;
  margin-top: 48px;
}
.partner-step {
  flex: 1;
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg);
  padding: 32px 28px;
}
.partner-step h3 {
  font-family: var(--wd-font-display);
  font-size: 20px;
  font-weight: 600;
  color: var(--wd-ink);
  margin: 0 0 10px;
}
.partner-step p {
  font-size: 14px;
  line-height: 1.65;
  color: var(--wd-stone);
  margin: 0;
}
.partner-step-n {
  font-family: var(--wd-font-data);
  font-size: 13px;
  font-weight: 500;
  color: var(--wd-forest);
  background: rgba(30,58,47,0.08);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}
.partner-step-arrow {
  display: flex;
  align-items: center;
  padding-top: 60px;
  flex-shrink: 0;
}

/* Terms Grid */
.partner-terms-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: 48px;
}
.partner-term-card {
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  padding: 28px 24px;
  text-align: center;
}
.partner-term-label {
  font-family: var(--wd-font-data);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--wd-stone);
  margin-bottom: 8px;
}
.partner-term-value {
  font-family: var(--wd-font-data);
  font-size: 32px;
  font-weight: 500;
  color: var(--wd-forest);
  margin-bottom: 6px;
}
.partner-term-desc {
  font-size: 13px;
  color: var(--wd-stone);
}

/* Example Payout */
.partner-example {
  background: var(--wd-forest);
  border-radius: var(--wd-r-lg);
  padding: 32px 36px;
  margin-top: 32px;
}
.partner-example-label {
  font-family: var(--wd-font-data);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: rgba(255,255,255,0.5);
  margin-bottom: 12px;
}
.partner-example p {
  font-size: 15px;
  line-height: 1.7;
  color: rgba(255,255,255,0.9);
  margin: 0;
}
.partner-example strong {
  color: #fff;
}

/* Partner Profiles */
.partner-profiles-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: 48px;
}
.partner-profile {
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  padding: 28px 24px;
}
.partner-profile-icon {
  width: 44px;
  height: 44px;
  background: rgba(30,58,47,0.06);
  border-radius: var(--wd-r-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}
.partner-profile h4 {
  font-family: var(--wd-font-display);
  font-size: 17px;
  font-weight: 600;
  color: var(--wd-ink);
  margin: 0 0 8px;
}
.partner-profile p {
  font-size: 13px;
  line-height: 1.6;
  color: var(--wd-stone);
  margin: 0;
}

/* Referral Form */
.partner-form-container {
  max-width: 700px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-xl);
  padding: 48px 44px;
}
.referral-form-group {
  margin-top: 32px;
  padding-top: 28px;
  border-top: 1px solid var(--wd-border);
}
.referral-form-group:first-of-type {
  border-top: none;
  padding-top: 0;
}
.referral-form-group-label {
  font-family: var(--wd-font-data);
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--wd-stone);
  margin-bottom: 20px;
}
.referral-form-row {
  display: flex;
  gap: 16px;
  margin-bottom: 16px;
}
.referral-form-row .form-field {
  flex: 1;
}
.referral-form .form-field {
  margin-bottom: 16px;
}
.referral-form .form-field label {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: var(--wd-ink);
  margin-bottom: 6px;
}
.referral-form .form-field .req {
  color: var(--wd-amber);
}
.referral-form .form-field input,
.referral-form .form-field select,
.referral-form .form-field textarea {
  width: 100%;
  padding: 12px 14px;
  font-size: 14px;
  font-family: var(--wd-font-body);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-sm);
  background: var(--wd-cream);
  color: var(--wd-ink);
  transition: border-color 0.2s;
  box-sizing: border-box;
}
.referral-form .form-field input:focus,
.referral-form .form-field select:focus,
.referral-form .form-field textarea:focus {
  outline: none;
  border-color: var(--wd-forest);
}
.referral-form .form-field textarea {
  resize: vertical;
  min-height: 80px;
}
.referral-form-actions {
  margin-top: 28px;
  text-align: center;
}
.referral-form-actions .btn {
  min-width: 220px;
}
.referral-form-note {
  font-size: 12px;
  color: var(--wd-stone);
  margin-top: 12px;
}

/* Referral Success */
.referral-success {
  text-align: center;
  padding: 40px 20px;
}
.referral-success-icon {
  margin-bottom: 20px;
}
.referral-success h3 {
  font-family: var(--wd-font-display);
  font-size: 24px;
  font-weight: 600;
  color: var(--wd-ink);
  margin: 0 0 12px;
}
.referral-success p {
  font-size: 14px;
  line-height: 1.7;
  color: var(--wd-stone);
  margin: 0 0 16px;
}
.referral-success strong {
  font-family: var(--wd-font-data);
  font-size: 18px;
  color: var(--wd-forest);
}
.referral-success a {
  color: var(--wd-forest);
}

/* Partner Status Lookup */
.partner-lookup-form {
  background: #fff;
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg);
  padding: 32px 28px;
}
.partner-lookup-form .form-field label {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: var(--wd-ink);
  margin-bottom: 6px;
}
.partner-lookup-form .form-field input {
  width: 100%;
  padding: 12px 14px;
  font-size: 14px;
  font-family: var(--wd-font-body);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-sm);
  background: var(--wd-cream);
  color: var(--wd-ink);
  box-sizing: border-box;
}
.partner-lookup-form .form-field input:focus {
  outline: none;
  border-color: var(--wd-forest);
}
.partner-lookup-or {
  display: flex;
  align-items: flex-end;
  padding-bottom: 14px;
  font-size: 13px;
  color: var(--wd-stone);
  font-style: italic;
}

/* Partner Results */
.partner-no-results {
  text-align: center;
  padding: 40px 20px;
  color: var(--wd-stone);
  font-size: 14px;
}
.partner-no-results a {
  color: var(--wd-forest);
}
.partner-result-card {
  background: #fff;
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  padding: 24px;
  margin-bottom: 16px;
}
.partner-result-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 14px;
}
.partner-result-company {
  font-family: var(--wd-font-display);
  font-size: 18px;
  font-weight: 600;
  color: var(--wd-ink);
}
.partner-result-contact {
  font-size: 13px;
  color: var(--wd-stone);
  margin-top: 2px;
}
.partner-result-code {
  font-family: var(--wd-font-data);
  font-size: 13px;
  font-weight: 500;
  color: var(--wd-forest);
  background: rgba(30,58,47,0.06);
  padding: 6px 12px;
  border-radius: var(--wd-r-sm);
}
.partner-result-meta {
  display: flex;
  gap: 16px;
  font-size: 12px;
  color: var(--wd-stone);
}
.partner-result-status {
  font-family: var(--wd-font-data);
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 3px 10px;
  border-radius: var(--wd-r-pill);
}
.partner-status-submitted {
  background: rgba(196,124,43,0.1);
  color: var(--wd-amber);
}
.partner-status-contacted {
  background: rgba(30,58,47,0.08);
  color: var(--wd-forest-mid);
}
.partner-status-demo {
  background: rgba(30,58,47,0.12);
  color: var(--wd-forest);
}
.partner-status-closed {
  background: rgba(30,58,47,0.15);
  color: var(--wd-forest);
  font-weight: 600;
}
.partner-status-lost {
  background: rgba(154,149,133,0.1);
  color: var(--wd-stone);
}

/* Partner responsive */
@media (max-width: 800px) {
  .partner-steps {
    flex-direction: column;
    gap: 16px;
  }
  .partner-step-arrow {
    transform: rotate(90deg);
    padding: 0;
    justify-content: center;
  }
  .partner-terms-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .partner-profiles-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .partner-form-container {
    padding: 32px 24px;
  }
  .referral-form-row {
    flex-direction: column;
    gap: 0;
  }
}
@media (max-width: 480px) {
  .partner-terms-grid {
    grid-template-columns: 1fr;
  }
  .partner-profiles-grid {
    grid-template-columns: 1fr;
  }
  .partner-result-header {
    flex-direction: column;
    gap: 8px;
  }
  .partner-result-meta {
    flex-wrap: wrap;
  }
}

/* ── PPC Hero CTA Button ── */
.ppc-hero-btn {
  background: var(--wd-forest);
  color: var(--wd-white);
  font-size: 17px;
  font-weight: 600;
  padding: 16px 36px;
  border-radius: var(--wd-r-md);
  display: inline-flex;
  align-items: center;
  box-shadow: 0 4px 24px rgba(30,58,47,0.3), 0 0 0 0 rgba(30,58,47,0);
  transition: all 0.3s ease;
  animation: ppc-btn-pulse 2.5s ease-in-out infinite;
}
.ppc-hero-btn:hover {
  background: var(--wd-forest-mid);
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(30,58,47,0.35);
  animation: none;
}
@keyframes ppc-btn-pulse {
  0%, 100% { box-shadow: 0 4px 24px rgba(30,58,47,0.3), 0 0 0 0 rgba(30,58,47,0.15); }
  50% { box-shadow: 0 4px 24px rgba(30,58,47,0.3), 0 0 0 10px rgba(30,58,47,0); }
}
.ppc-hero-subtext {
  margin-top: 14px;
  font-size: 13px;
  color: var(--wd-stone);
  letter-spacing: 0.02em;
}

/* ── PPC Signal Strip (hero animation) ── */
.ppc-signal-strip {
  overflow: hidden;
  max-width: 600px;
  margin: 0 auto;
  mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
  -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
  height: 32px;
  position: relative;
}
.ppc-signal-row {
  display: flex;
  gap: 32px;
  white-space: nowrap;
  animation: ppc-scroll 28s linear infinite;
  will-change: transform;
}
.ppc-sig-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.ppc-sig-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 1px;
}
.ppc-sig-dot.green { background: var(--wd-success); box-shadow: 0 0 6px var(--wd-success); }
.ppc-sig-dot.amber { background: #f59e0b; box-shadow: 0 0 6px #f59e0b; }
.ppc-sig-dot.red   { background: var(--wd-danger); box-shadow: 0 0 6px var(--wd-danger); animation: ppc-blink 1.2s ease-in-out infinite; }
.ppc-sig-label {
  font-family: var(--wd-font-data);
  font-size: 12px;
  color: var(--wd-stone);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
@keyframes ppc-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
@keyframes ppc-blink {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.3; }
}

/* PPC responsive */
@media (max-width: 700px) {
  .ppc-steps-grid {
    flex-direction: column;
    align-items: center;
    gap: 32px;
  }
  .ppc-step-arrow {
    transform: rotate(90deg);
  }
  .ppc-step { max-width: none; padding: 0; }
  .ppc-kpi-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .ppc-hero-btn { font-size: 15px; padding: 14px 28px; }
}
@media (max-width: 480px) {
  .ppc-kpi-grid {
    grid-template-columns: 1fr;
  }
}

/* ═══════════════════════════════════════════
   LOCALE TOGGLE
   ═══════════════════════════════════════════ */
.nav-locale-toggle {
  display: inline-flex; align-items: center; gap: 2px;
  background: var(--wd-forest-dim); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-pill); padding: 4px 10px;
  cursor: pointer; transition: all 0.2s;
  font-family: var(--wd-font-data); font-size: 10px; font-weight: 500;
  letter-spacing: 0.08em; text-transform: uppercase;
  margin-right: 8px; flex-shrink: 0;
}
.nav-locale-toggle:hover { border-color: var(--wd-forest); }
.locale-flag {
  color: var(--wd-stone); transition: color 0.2s;
  padding: 2px 4px; border-radius: 4px;
}
.locale-flag.active {
  color: var(--wd-forest); font-weight: 700;
  background: rgba(30,58,47,0.08);
}
.locale-sep { color: var(--wd-stone); font-size: 9px; }

/* ═══════════════════════════════════════════
   GDPR COOKIE CONSENT BANNER
   ═══════════════════════════════════════════ */
.cookie-banner {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 9999;
  background: var(--wd-white);
  border-top: 1px solid var(--wd-border-md);
  box-shadow: 0 -4px 24px rgba(26,26,20,0.08);
  padding: 24px 0;
  animation: cookieSlideUp 0.4s ease-out;
}
@keyframes cookieSlideUp {
  from { transform: translateY(100%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
.cookie-banner-inner {
  max-width: 1140px; margin: 0 auto; padding: 0 40px;
  display: flex; align-items: center; gap: 32px;
}
.cookie-banner-text { flex: 1; }
.cookie-banner-title {
  font-family: var(--wd-font-display); font-size: 16px; font-weight: 600;
  color: var(--wd-ink); margin-bottom: 4px;
}
.cookie-banner-desc {
  font-size: 13px; color: var(--wd-stone-mid); line-height: 1.6;
}
.cookie-banner-desc a { color: var(--wd-forest); text-decoration: underline; }
.cookie-banner-actions {
  display: flex; gap: 8px; flex-shrink: 0; align-items: center;
}
.cookie-banner-actions .btn { font-size: 12px; padding: 10px 18px; white-space: nowrap; }

/* Cookie preferences panel */
.cookie-prefs {
  max-width: 1140px; margin: 0 auto; padding: 20px 40px 0;
  border-top: 1px solid var(--wd-border); margin-top: 20px;
}
.cookie-pref-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 0; border-bottom: 1px solid var(--wd-border);
}
.cookie-pref-row:last-of-type { border-bottom: none; }
.cookie-pref-info strong {
  font-family: var(--wd-font-body); font-size: 14px; font-weight: 600; color: var(--wd-ink);
}
.cookie-pref-info p {
  font-size: 12px; color: var(--wd-stone-mid); margin-top: 2px;
}
.cookie-pref-status {
  font-family: var(--wd-font-data); font-size: 11px; color: var(--wd-stone);
  text-transform: uppercase; letter-spacing: 0.06em;
}
.cookie-prefs-actions { padding: 16px 0 0; }
.cookie-prefs-actions .btn { font-size: 12px; padding: 10px 20px; }

/* Toggle switch */
.cookie-toggle {
  position: relative; display: inline-block; width: 44px; height: 24px;
}
.cookie-toggle input { opacity: 0; width: 0; height: 0; }
.cookie-toggle-slider {
  position: absolute; cursor: pointer; inset: 0;
  background: var(--wd-cream-3); border-radius: 24px;
  transition: 0.3s;
}
.cookie-toggle-slider::before {
  content: ''; position: absolute; height: 18px; width: 18px;
  left: 3px; bottom: 3px; background: var(--wd-white);
  border-radius: 50%; transition: 0.3s;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}
.cookie-toggle input:checked + .cookie-toggle-slider { background: var(--wd-forest); }
.cookie-toggle input:checked + .cookie-toggle-slider::before { transform: translateX(20px); }

@media(max-width:768px) {
  .cookie-banner-inner { flex-direction: column; gap: 16px; padding: 0 20px; }
  .cookie-banner-actions { width: 100%; justify-content: stretch; }
  .cookie-banner-actions .btn { flex: 1; text-align: center; justify-content: center; }
  .cookie-prefs { padding: 16px 20px 0; }
}

/* ═══════════════════════════════════════════
   JP HOMEPAGE COMPONENTS
   ═══════════════════════════════════════════ */

/* Challenges grid */
.jp-challenges-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px;
  margin-top: 48px;
}
.jp-challenge-card {
  background: var(--wd-cream); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg); padding: 32px;
  transition: all 0.25s;
}
.jp-challenge-card:hover {
  border-color: var(--wd-forest); box-shadow: var(--wd-shadow-md);
}
.jp-challenge-icon { margin-bottom: 16px; }
.jp-challenge-card h3 {
  font-family: var(--wd-font-display); font-size: 20px; font-weight: 600;
  color: var(--wd-ink); margin-bottom: 8px;
}
.jp-challenge-card p {
  font-size: 14px; color: var(--wd-stone-mid); line-height: 1.7;
}
.jp-challenge-stat {
  margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--wd-border);
  display: flex; align-items: baseline; gap: 10px;
}
.jp-stat-val {
  font-family: var(--wd-font-data); font-size: 22px; font-weight: 700;
  color: var(--wd-forest);
}
.jp-stat-label {
  font-family: var(--wd-font-data); font-size: 11px; color: var(--wd-stone);
  text-transform: uppercase; letter-spacing: 0.04em;
}

/* Agents grid */
.jp-agents-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
  margin-top: 48px;
}
.jp-agent-card {
  background: var(--wd-white); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg); padding: 28px;
  transition: all 0.25s;
}
.jp-agent-card:hover {
  border-color: var(--wd-forest); box-shadow: var(--wd-shadow-md);
  transform: translateY(-2px);
}
.jp-agent-dot {
  width: 10px; height: 10px; border-radius: 50%; margin-bottom: 14px;
}
.jp-agent-card h3 {
  font-family: var(--wd-font-display); font-size: 17px; font-weight: 600;
  color: var(--wd-ink); margin-bottom: 8px;
}
.jp-agent-card p {
  font-size: 13px; color: var(--wd-stone-mid); line-height: 1.7;
}

/* Insight cards for JP */
.jp-insight-cards {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
  margin-top: 48px;
}
.jp-insight-card {
  background: var(--wd-cream); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg); padding: 24px;
}
.jp-insight-card .aic-header { margin-bottom: 12px; }
.jp-insight-card .aic-body { }
.jp-insight-card .aic-title {
  font-family: var(--wd-font-display); font-size: 15px; font-weight: 600;
  margin-bottom: 8px;
}
.jp-insight-card .aic-desc {
  font-size: 13px; color: var(--wd-stone-mid); line-height: 1.7;
  margin-bottom: 12px;
}

/* Verticals grid for JP */
.jp-verticals-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
  margin-top: 48px;
}
.jp-vertical-card {
  display: block; background: var(--wd-white); border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg); padding: 28px;
  text-decoration: none; color: inherit;
  transition: all 0.25s; position: relative;
}
.jp-vertical-card:hover {
  border-color: var(--wd-forest); box-shadow: var(--wd-shadow-md);
  transform: translateY(-2px);
}
.jp-vertical-card h3 {
  font-family: var(--wd-font-display); font-size: 18px; font-weight: 600;
  color: var(--wd-ink); margin-bottom: 8px;
}
.jp-vertical-card p {
  font-size: 13px; color: var(--wd-stone-mid); line-height: 1.6;
}
.jp-vertical-arrow {
  position: absolute; top: 28px; right: 28px;
  color: var(--wd-forest); font-size: 18px; opacity: 0;
  transition: opacity 0.2s;
}
.jp-vertical-card:hover .jp-vertical-arrow { opacity: 1; }

/* JP responsive */
@media(max-width:768px) {
  .jp-challenges-grid { grid-template-columns: 1fr; }
  .jp-agents-grid { grid-template-columns: 1fr; }
  .jp-insight-cards { grid-template-columns: 1fr; }
  .jp-verticals-grid { grid-template-columns: 1fr; }
}

/* ═══ PRODUCT SCREENSHOT SHOWCASE ═══ */

/* Full-width showcase with browser chrome — stands apart from all widget cards */
.product-showcase {
  position: relative;
  margin: 48px auto 0;
  max-width: 960px;
  padding: 24px;
  background: var(--wd-ink);
  border-radius: calc(var(--wd-r-lg) + 8px);
}
.product-showcase-frame {
  position: relative;
  border-radius: var(--wd-r-lg);
  overflow: hidden;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.06), 0 24px 80px rgba(0,0,0,0.4);
  background: var(--wd-white);
}
.product-showcase-frame img {
  display: block;
  width: 100%;
  height: auto;
}
.product-showcase-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 16px;
  background: #1a1a1a;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.product-showcase-dot {
  width: 8px; height: 8px; border-radius: 50%;
}
.product-showcase-dot:nth-child(1) { background: #ef4444; }
.product-showcase-dot:nth-child(2) { background: #f59e0b; }
.product-showcase-dot:nth-child(3) { background: #22c55e; }
.product-showcase-url {
  margin-left: 12px; font-size: 11px; font-family: var(--wd-font-mono);
  color: rgba(255,255,255,0.4); background: rgba(255,255,255,0.06);
  padding: 3px 12px; border-radius: 4px; border: 1px solid rgba(255,255,255,0.08);
}
.product-showcase-glow {
  position: absolute; bottom: -40px; left: 50%; transform: translateX(-50%);
  width: 80%; height: 80px;
  background: radial-gradient(ellipse, rgba(42,76,55,0.15) 0%, transparent 70%);
  pointer-events: none; z-index: -1;
}
.product-showcase-caption {
  text-align: center; margin-top: 14px;
  font-size: 12px; color: rgba(255,255,255,0.35); font-family: var(--wd-font-mono);
  letter-spacing: 0.02em;
}

/* Dark variant — used on default (cream) background sections */
.product-showcase--dark {
  background: var(--wd-forest);
}
.product-showcase--dark .product-showcase-bar {
  background: rgba(255,255,255,0.05);
}
.product-showcase--dark .product-showcase-caption {
  color: rgba(255,255,255,0.3);
}

/* Inline product screenshot — frameless, clean */
.product-screenshot {
  position: relative;
  border-radius: var(--wd-r-lg);
  overflow: hidden;
}
.product-screenshot img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--wd-r-lg);
}
/* When inside a pair, crop to uniform height */
.product-screenshot-pair .product-screenshot {
  aspect-ratio: 4 / 3;
}
.product-screenshot-pair .product-screenshot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top left;
  border-radius: var(--wd-r-lg);
}

/* Product screenshot pair — side-by-side */
.product-screenshot-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 32px;
}
@media(max-width:640px) {
  .product-screenshot-pair { grid-template-columns: 1fr; }
}

/* Product screenshot with label */
.product-screenshot-labeled {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.product-screenshot-label {
  font-size: 11px; font-family: var(--wd-font-data);
  color: var(--wd-stone); text-transform: uppercase;
  letter-spacing: 0.08em;
}
.product-screenshot-desc {
  font-size: 14px; line-height: 1.6;
  color: var(--wd-stone); margin: -2px 0 4px;
}

/* ── Product screenshot scroll animations ── */
/* Container: don't animate the wrapper, animate children instead */
.product-screenshot-pair.reveal {
  opacity: 1;
  transform: none;
}
/* Children start hidden, slide in from sides */
.product-screenshot-pair .product-screenshot-labeled {
  opacity: 0;
  transform: translateX(-24px) translateY(12px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.product-screenshot-pair .product-screenshot-labeled:nth-child(2) {
  transform: translateX(24px) translateY(12px);
  transition-delay: 0.12s;
}
/* Visible: slide to rest */
.product-screenshot-pair.reveal.visible .product-screenshot-labeled {
  opacity: 1;
  transform: translateX(0) translateY(0);
}
/* Image frame subtle scale-up */
.product-screenshot-pair .product-screenshot {
  transform: scale(0.95);
  transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.1s;
}
.product-screenshot-pair.reveal.visible .product-screenshot {
  transform: scale(1);
}
.product-screenshot-pair .product-screenshot-labeled:nth-child(2) .product-screenshot {
  transition-delay: 0.22s;
}
/* Single product-screenshot (not in a pair) — slide up + scale */
.product-screenshot-labeled.reveal {
  opacity: 1;
  transform: none;
}
.product-screenshot-labeled.reveal .product-screenshot {
  opacity: 0;
  transform: translateY(16px) scale(0.96);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.product-screenshot-labeled.reveal.visible .product-screenshot {
  opacity: 1;
  transform: translateY(0) scale(1);
}
@media (prefers-reduced-motion: reduce) {
  .product-screenshot-pair .product-screenshot-labeled,
  .product-screenshot-pair .product-screenshot,
  .product-screenshot-labeled.reveal .product-screenshot {
    transition: none;
    opacity: 1;
    transform: none;
  }
}

/* Hero product showcase — sits inside hero, flush below hero content */
.hero-product-wrap {
  position: relative;
  z-index: 2;
  padding-bottom: 48px;
}
.hero-product-showcase {
  margin-top: 0;
  position: relative;
  max-width: 100%;
}
.hero-product-showcase .product-showcase-frame {
  box-shadow: 0 0 0 1px rgba(255,255,255,0.08), 0 32px 100px rgba(0,0,0,0.5);
}
/* Video embed inside product showcase */
.product-showcase-video {
  position: relative;
  padding-top: 56.25%; /* 16:9 */
  background: #000;
}
.product-showcase-video iframe {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  border: 0;
}
@media(max-width:768px) {
  .hero-product-wrap { padding-bottom: 32px; }
}

/* Product showcase responsive */
@media(max-width:768px) {
  .product-showcase { margin-top: 32px; padding: 12px; }
  .hero-product-showcase { margin-top: 40px; }
  .product-showcase-bar { padding: 8px 12px; }
  .product-showcase-url { display: none; }
}

/* ═══════════════════════════════════════════
   INTERACTIVE PLATFORM DEMO WIDGET
   Mirrors the actual Ward app — sidebar, panels, tables
   ═══════════════════════════════════════════ */
.ward-platform {
  position: relative;
  margin: 0 auto;
  max-width: 1100px;
  padding: 18px;
  background: var(--wd-ink);
  border-radius: calc(var(--wd-r-lg) + 8px);
}
.ward-platform-shell {
  position: relative;
  border-radius: var(--wd-r-lg);
  overflow: hidden;
  background: var(--wd-cream);
  box-shadow: 0 0 0 1px rgba(255,255,255,0.06), 0 32px 100px rgba(0,0,0,0.5);
}
/* Browser chrome */
.wp-chrome {
  display: flex; align-items: center; gap: 6px;
  padding: 10px 16px;
  background: #1a1a1a;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.wp-chrome .wp-dot { width: 8px; height: 8px; border-radius: 50%; background: #ef4444; }
.wp-chrome .wp-dot:nth-child(2) { background: #f59e0b; }
.wp-chrome .wp-dot:nth-child(3) { background: #22c55e; }
.wp-url {
  margin-left: 12px; font-size: 11px; font-family: var(--wd-font-data);
  color: rgba(255,255,255,0.4); background: rgba(255,255,255,0.06);
  padding: 3px 12px; border-radius: 4px; border: 1px solid rgba(255,255,255,0.08);
}
.wp-livedot {
  margin-left: auto; width: 7px; height: 7px; border-radius: 50%;
  background: #22c55e; box-shadow: 0 0 0 0 rgba(34,197,94,0.6);
  animation: wp-pulse 1.8s ease-out infinite;
}
.wp-livetxt {
  font-size: 10px; font-family: var(--wd-font-data);
  color: rgba(255,255,255,0.6); text-transform: uppercase; letter-spacing: 0.08em;
}
@keyframes wp-pulse {
  0% { box-shadow: 0 0 0 0 rgba(34,197,94,0.6); }
  100% { box-shadow: 0 0 0 10px rgba(34,197,94,0); }
}

/* Body grid: sidebar + main */
.wp-body {
  display: grid;
  grid-template-columns: 196px 1fr;
  min-height: 520px;
  background: var(--wd-cream);
}

/* Sidebar */
.wp-side {
  background: var(--wd-forest);
  color: rgba(255,255,255,0.85);
  padding: 16px 10px 12px;
  display: flex; flex-direction: column;
  font-family: var(--wd-font-data);
}
.wp-side-head {
  font-family: var(--wd-font-display);
  font-size: 15px; color: #fff;
  padding: 4px 10px 14px;
  letter-spacing: -0.01em;
}
.wp-side-group {
  font-size: 9px; text-transform: uppercase; letter-spacing: 0.12em;
  color: rgba(255,255,255,0.4);
  padding: 14px 10px 6px;
}
.wp-nav {
  display: flex; align-items: center; gap: 8px;
  width: 100%; padding: 8px 10px; margin-bottom: 1px;
  background: transparent; border: 0;
  color: rgba(255,255,255,0.7);
  font-family: var(--wd-font-data); font-size: 12px;
  text-align: left; cursor: pointer; border-radius: 6px;
  transition: background .15s, color .15s;
}
.wp-nav svg { flex: 0 0 14px; opacity: 0.7; }
.wp-nav:hover { background: rgba(255,255,255,0.06); color: #fff; }
.wp-nav.active {
  background: rgba(255,255,255,0.10);
  color: #fff;
}
.wp-nav.active svg { opacity: 1; }
.wp-side-foot {
  margin-top: auto; padding: 12px 10px 4px;
  border-top: 1px solid rgba(255,255,255,0.08);
}
.wp-side-tenant {
  font-size: 10px; color: rgba(255,255,255,0.4);
}

/* Main pane */
.wp-main {
  display: flex; flex-direction: column;
  background: var(--wd-cream);
  min-width: 0;
}
.wp-top {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 18px;
  border-bottom: 1px solid var(--wd-border);
  background: rgba(255,255,255,0.4);
}
.wp-top-left { display: flex; align-items: center; gap: 10px; min-width: 0; }
.wp-top-pipe {
  width: 2px; height: 14px; background: var(--wd-forest); border-radius: 2px;
}
.wp-top-title {
  font-family: var(--wd-font-display); font-size: 14px;
  color: var(--wd-ink); font-weight: 600;
}
.wp-top-pill {
  font-family: var(--wd-font-data); font-size: 10px;
  color: var(--wd-forest); background: var(--wd-forest-pale);
  padding: 3px 8px; border-radius: 4px;
}
.wp-top-model {
  font-family: var(--wd-font-data); font-size: 10px;
  color: var(--wd-stone-mid); background: rgba(0,0,0,0.04);
  padding: 3px 8px; border-radius: 4px;
}
.wp-top-model em {
  font-style: normal; font-size: 9px; color: var(--wd-stone);
  margin-left: 6px; text-transform: uppercase; letter-spacing: 0.08em;
}
.wp-top-right { display: flex; align-items: center; gap: 10px; }
.wp-top-icon { color: var(--wd-stone-mid); display: inline-flex; cursor: pointer; }
.wp-top-icon:hover { color: var(--wd-ink); }
.wp-top-avatar {
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--wd-forest); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--wd-font-data); font-size: 11px; font-weight: 600;
}

/* Panels */
.wp-panels {
  position: relative;
  flex: 1; padding: 22px 24px 24px;
  overflow: hidden;
}
.wp-panel {
  display: none;
  animation: wp-fade .35s ease-out;
}
.wp-panel.active { display: block; }
@keyframes wp-fade {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

.wp-page-head {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 16px; margin-bottom: 14px;
}
.wp-h {
  font-family: var(--wd-font-display); font-size: 22px;
  color: var(--wd-ink); font-weight: 600; letter-spacing: -0.01em;
  margin: 0 0 2px;
}
.wp-sub {
  font-size: 12px; color: var(--wd-stone-mid); margin: 0;
}
.wp-btn-pri {
  background: var(--wd-forest); color: #fff;
  border: 0; padding: 7px 12px; border-radius: 6px;
  font-family: var(--wd-font-data); font-size: 11px; cursor: pointer;
  transition: background .15s, transform .15s;
}
.wp-btn-pri:hover { background: var(--wd-forest-mid); transform: translateY(-1px); }

.wp-search {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 12px; margin-bottom: 12px;
  background: #fff; border: 1px solid var(--wd-border);
  border-radius: 8px;
  font-family: var(--wd-font-data); font-size: 12px;
  color: var(--wd-stone);
}
.wp-search svg { color: var(--wd-stone); }

.wp-tabs {
  display: flex; gap: 18px; margin-bottom: 12px;
  border-bottom: 1px solid var(--wd-border);
}
.wp-tab {
  font-family: var(--wd-font-data); font-size: 12px;
  color: var(--wd-stone); padding: 6px 0; cursor: pointer;
  border-bottom: 2px solid transparent;
}
.wp-tab.active {
  color: var(--wd-ink); border-bottom-color: var(--wd-forest);
}

/* Tables */
.wp-tbl {
  width: 100%; border-collapse: collapse;
  background: #fff; border: 1px solid var(--wd-border);
  border-radius: 8px; overflow: hidden;
  font-size: 12px;
}
.wp-tbl thead {
  background: rgba(0,0,0,0.02);
}
.wp-tbl th {
  text-align: left; padding: 9px 14px;
  font-family: var(--wd-font-data); font-size: 10px;
  text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--wd-stone); font-weight: 500;
}
.wp-tbl td {
  padding: 9px 14px;
  border-top: 1px solid var(--wd-border);
  color: var(--wd-stone-dark);
  font-family: var(--wd-font-body);
}
.wp-tbl td code {
  font-family: var(--wd-font-data); font-size: 11px;
  color: var(--wd-ink);
  background: rgba(0,0,0,0.04); padding: 2px 6px; border-radius: 4px;
}
.wp-tbl tbody tr { transition: background .12s; }
.wp-tbl tbody tr:hover { background: rgba(30,58,47,0.03); }

/* Chips / pills */
.wp-chip {
  display: inline-block;
  font-family: var(--wd-font-data); font-size: 10px;
  padding: 2px 8px; border-radius: 4px;
  background: rgba(0,0,0,0.05); color: var(--wd-stone-mid);
}
.wp-chip-green {
  background: rgba(34,197,94,0.12); color: #15803d;
  position: relative; padding-left: 16px;
}
.wp-chip-green::before {
  content: ''; position: absolute; left: 6px; top: 50%;
  width: 5px; height: 5px; border-radius: 50%; background: #22c55e;
  transform: translateY(-50%);
  animation: wp-blink 1.8s ease-in-out infinite;
}
.wp-chip-red {
  background: rgba(239,68,68,0.12); color: #b91c1c;
}
@keyframes wp-blink {
  0%, 100% { opacity: 1; } 50% { opacity: 0.4; }
}

.wp-note {
  margin-top: 12px; font-size: 11px;
  color: var(--wd-stone-mid); font-family: var(--wd-font-data);
}

/* ── CHAT panel ── */
.wp-chat {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 14px;
  min-height: 380px;
  height: 480px;
  min-width: 0;
}
.wp-chat-rail {
  background: #fff; border: 1px solid var(--wd-border); border-radius: 8px;
  padding: 10px; display: flex; flex-direction: column; gap: 2px;
  overflow-y: auto; min-width: 0;
}
.wp-chat-rail-group {
  font-family: var(--wd-font-data);
  font-size: 9px; text-transform: uppercase; letter-spacing: 0.1em;
  color: var(--wd-stone); padding: 10px 10px 4px;
}
.wp-chat-new {
  background: var(--wd-cream-2); border: 1px solid var(--wd-border);
  padding: 7px 10px; border-radius: 6px;
  font-family: var(--wd-font-data); font-size: 11px;
  color: var(--wd-ink); cursor: pointer; text-align: left;
  margin-bottom: 4px;
}
.wp-chat-new:hover { background: var(--wd-cream-3); }
.wp-chat-conv {
  padding: 8px 10px; border-radius: 6px; cursor: pointer;
  transition: background .12s;
}
.wp-chat-conv:hover { background: rgba(0,0,0,0.03); }
.wp-chat-conv.active {
  background: var(--wd-forest-pale);
  box-shadow: inset 2px 0 0 var(--wd-forest);
}
.wp-chat-conv-title {
  font-size: 12px; color: var(--wd-ink); font-weight: 500;
  line-height: 1.3;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.wp-chat-conv-meta {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 10px; color: var(--wd-stone); margin-top: 3px;
  font-family: var(--wd-font-data);
}
.wp-chat-live-dot {
  width: 5px; height: 5px; border-radius: 50%;
  background: #22c55e;
  animation: wp-blink 1.6s ease-in-out infinite;
}
.wp-chat-stream {
  background: #fff; border: 1px solid var(--wd-border); border-radius: 8px;
  display: flex; flex-direction: column;
  min-width: 0; min-height: 0;
}
.wp-chat-msgs {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 16px 18px 8px;
  display: flex; flex-direction: column; gap: 14px;
  min-height: 0;
}

/* Message rows */
.wp-chat-msg { display: flex; flex-direction: column; max-width: 100%; }
.wp-chat-msg-user { align-items: flex-end; }
.wp-chat-msg-agent { align-items: flex-start; }
.wp-chat-bubble {
  max-width: 80%;
  background: var(--wd-forest);
  color: #fff;
  padding: 8px 12px;
  border-radius: 14px 14px 4px 14px;
  font-size: 13px; line-height: 1.45;
}
.wp-chat-msg-agent > .wp-chat-line,
.wp-chat-msg-agent > .wp-chat-table,
.wp-chat-msg-agent > .wp-chat-evidence { align-self: stretch; }
.wp-chat-meta {
  font-family: var(--wd-font-data); font-size: 9px;
  color: var(--wd-stone); margin-top: 4px; padding: 0 4px;
}
.wp-chat-thinking {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 6px 10px;
  background: var(--wd-cream-2);
  border: 1px solid var(--wd-border);
  border-radius: 8px;
  font-family: var(--wd-font-data); font-size: 11px;
  color: var(--wd-stone-mid);
}
.wp-chat-thinking code {
  font-family: var(--wd-font-data); font-size: 10px;
  color: var(--wd-forest); background: var(--wd-forest-pale);
  padding: 1px 5px; border-radius: 3px;
}
.wp-chat-thinking-step {
  transition: opacity .18s ease-out;
}
@keyframes wp-fade-in {
  from { opacity: 0; transform: translateY(2px); }
  to   { opacity: 1; transform: translateY(0); }
}
.wp-chat-agent {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 4px 10px; border-radius: 4px;
  background: var(--wd-forest-pale); color: var(--wd-forest);
  font-family: var(--wd-font-data); font-size: 10px;
  margin-bottom: 14px;
}
.wp-chat-agent-dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--wd-forest);
  animation: wp-blink 1.6s ease-in-out infinite;
}
.wp-chat-line {
  font-size: 13px; line-height: 1.6; color: var(--wd-stone-dark);
  margin: 0 0 12px;
}
.wp-chat-line strong { color: var(--wd-ink); }
.wp-chat-table {
  width: 100%; border-collapse: collapse; margin: 8px 0 14px;
  font-size: 12px;
}
.wp-chat-table th {
  text-align: left; padding: 6px 10px;
  font-family: var(--wd-font-data); font-size: 10px;
  text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--wd-stone); font-weight: 500;
  background: rgba(0,0,0,0.03);
}
.wp-chat-table td {
  padding: 7px 10px;
  border-top: 1px solid var(--wd-border);
  color: var(--wd-stone-dark);
}
.wp-chat-table td code {
  font-family: var(--wd-font-data); font-size: 11px;
  color: var(--wd-forest); background: var(--wd-forest-pale);
  padding: 2px 6px; border-radius: 3px;
}
.wp-chat-table td strong { color: var(--wd-ink); }
.wp-chat-evidence {
  display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0;
}
.wp-chat-pill {
  display: inline-flex; align-items: center; gap: 4px;
  font-family: var(--wd-font-data); font-size: 10px;
  padding: 3px 8px; border-radius: 4px;
  background: rgba(0,0,0,0.04); color: var(--wd-stone-mid);
}
.wp-chat-pill-green {
  background: rgba(34,197,94,0.1); color: #15803d;
}
.wp-chat-input {
  display: flex; align-items: center; gap: 10px;
  margin: 0 12px 12px; padding: 10px 12px;
  background: var(--wd-cream-2); border: 1px solid var(--wd-border);
  border-radius: 8px;
  flex: 0 0 auto;
}
.wp-chat-caret {
  font-family: var(--wd-font-data); color: var(--wd-forest); font-weight: 700;
}
.wp-chat-placeholder {
  font-family: var(--wd-font-body); font-size: 12px;
  color: var(--wd-stone); flex: 1;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.wp-chat-typing { display: inline-flex; gap: 3px; }
.wp-chat-typing span {
  width: 5px; height: 5px; border-radius: 50%; background: var(--wd-stone);
  animation: wp-typing 1.4s ease-in-out infinite;
}
.wp-chat-typing span:nth-child(2) { animation-delay: .15s; }
.wp-chat-typing span:nth-child(3) { animation-delay: .3s; }
@keyframes wp-typing {
  0%, 60%, 100% { opacity: 0.3; transform: translateY(0); }
  30% { opacity: 1; transform: translateY(-3px); }
}
.wp-chat-hint {
  margin-left: auto; font-family: var(--wd-font-data);
  font-size: 10px; color: var(--wd-stone);
}

/* ── DASHBOARDS ── */
.wp-dash-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px;
}
.wp-dash-card {
  background: #fff; border: 1px solid var(--wd-border); border-radius: 8px;
  padding: 14px;
}
.wp-dash-card-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 10px;
}
.wp-dash-card-title {
  font-family: var(--wd-font-data); font-size: 11px;
  color: var(--wd-stone-dark);
}
.wp-dash-tag {
  font-family: var(--wd-font-data); font-size: 10px;
  padding: 2px 7px; border-radius: 4px;
}
.wp-tag-green { background: rgba(34,197,94,0.12); color: #15803d; }
.wp-tag-amber { background: rgba(196,124,43,0.14); color: #92500b; }
.wp-tag-red   { background: rgba(239,68,68,0.12); color: #b91c1c; }
.wp-spark { width: 100%; height: 60px; display: block; }
.wp-spark path { stroke-dasharray: 600; stroke-dashoffset: 600; animation: wp-draw 1.8s ease-out forwards; }
.wp-spark path:nth-child(2) { animation: wp-fade-in 1s ease-out .8s forwards; opacity: 0; stroke-dasharray: none; stroke-dashoffset: 0; }
@keyframes wp-draw  { to { stroke-dashoffset: 0; } }
@keyframes wp-fade-in { to { opacity: 1; } }
.wp-bars {
  display: flex; align-items: flex-end; gap: 6px; height: 60px;
}
.wp-bars span {
  flex: 1; background: linear-gradient(to top, var(--wd-amber), rgba(196,124,43,0.4));
  border-radius: 2px 2px 0 0;
  animation: wp-grow .9s cubic-bezier(.16,1,.3,1) both;
  transform-origin: bottom;
}
.wp-bars span:nth-child(2) { animation-delay: .05s; }
.wp-bars span:nth-child(3) { animation-delay: .1s; }
.wp-bars span:nth-child(4) { animation-delay: .15s; }
.wp-bars span:nth-child(5) { animation-delay: .2s; }
.wp-bars span:nth-child(6) { animation-delay: .25s; }
.wp-bars span:nth-child(7) { animation-delay: .3s; }
@keyframes wp-grow { from { transform: scaleY(0); } to { transform: scaleY(1); } }

/* ── STREAMS ── */
.wp-stream {
  display: grid; grid-template-columns: 1fr 1.2fr; gap: 14px;
  align-items: start;
}
.wp-stream-stats {
  display: flex; flex-direction: column; gap: 10px;
}
.wp-stream-stat {
  background: #fff; border: 1px solid var(--wd-border); border-radius: 8px;
  padding: 14px 16px;
  display: flex; flex-direction: column; gap: 2px;
}
.wp-stream-num {
  font-family: var(--wd-font-display); font-size: 28px;
  color: var(--wd-forest); font-weight: 600; line-height: 1;
}
.wp-stream-lbl {
  font-family: var(--wd-font-data); font-size: 10px;
  color: var(--wd-stone); text-transform: uppercase; letter-spacing: 0.08em;
}
.wp-stream-feed {
  list-style: none; padding: 12px; margin: 0;
  background: var(--wd-ink); color: rgba(255,255,255,0.85);
  border-radius: 8px; font-family: var(--wd-font-data); font-size: 11px;
  min-height: 220px; max-height: 280px; overflow: hidden;
}
.wp-stream-feed li {
  display: flex; align-items: center; gap: 8px;
  padding: 5px 4px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  animation: wp-feedin .35s ease-out;
}
.wp-stream-feed li code {
  color: #6ee7b7; background: transparent; padding: 0;
}
.wp-stream-tick {
  width: 5px; height: 5px; border-radius: 50%; background: #22c55e;
  flex: 0 0 5px;
}
@keyframes wp-feedin {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── POLICIES — Security viz ── */
.wp-sec-grid {
  display: grid; grid-template-columns: 220px 1fr; gap: 14px;
  align-items: start;
}
.wp-sec-viz {
  background: var(--wd-forest); border-radius: 8px;
  padding: 18px 14px; text-align: center; color: rgba(255,255,255,0.85);
  position: relative; overflow: hidden;
}
.wp-sec-shield {
  position: relative; height: 140px; display: flex; align-items: center; justify-content: center;
  margin-bottom: 14px;
}
.wp-sec-shield svg { width: 80px; height: 100px; color: rgba(255,255,255,0.95); position: relative; z-index: 2; }
.wp-sec-shield svg path:last-child { stroke: #6ee7b7; }
.wp-sec-orbit {
  position: absolute; top: 50%; left: 50%;
  width: 150px; height: 150px;
  border: 1px solid rgba(255,255,255,0.18); border-radius: 50%;
  transform: translate(-50%,-50%);
  animation: wp-spin 8s linear infinite;
}
.wp-sec-orbit::before {
  content: ''; position: absolute; top: -3px; left: 50%;
  width: 6px; height: 6px; border-radius: 50%; background: #6ee7b7;
  transform: translateX(-50%);
  box-shadow: 0 0 8px rgba(110,231,183,0.7);
}
.wp-sec-orbit-2 {
  width: 190px; height: 190px;
  border-color: rgba(255,255,255,0.10);
  animation: wp-spin-rev 12s linear infinite;
}
.wp-sec-orbit-2::before {
  background: #c47c2b; box-shadow: 0 0 8px rgba(196,124,43,0.7);
}
@keyframes wp-spin { to { transform: translate(-50%,-50%) rotate(360deg); } }
@keyframes wp-spin-rev { to { transform: translate(-50%,-50%) rotate(-360deg); } }
.wp-sec-badges {
  display: flex; flex-direction: column; gap: 6px;
}
.wp-sec-badge {
  display: inline-flex; align-items: center; gap: 6px; justify-content: center;
  padding: 5px 8px; border-radius: 5px;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.85);
  font-family: var(--wd-font-data); font-size: 10px;
}

/* ── SETTINGS ── */
.wp-set-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.wp-set-card {
  background: #fff; border: 1px solid var(--wd-border); border-radius: 8px;
  padding: 14px;
}
.wp-set-head {
  font-family: var(--wd-font-display); font-size: 14px;
  color: var(--wd-ink); margin-bottom: 12px;
}
.wp-set-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 0; border-top: 1px solid var(--wd-border);
  font-size: 12px; color: var(--wd-stone-mid);
}
.wp-set-row:first-of-type { border-top: 0; }
.wp-set-row strong { color: var(--wd-ink); font-weight: 500; }
.wp-set-desc {
  font-size: 11px; color: var(--wd-stone); margin-top: 8px;
  font-family: var(--wd-font-data);
}
.wp-radio-grp { display: flex; gap: 12px; }
.wp-radio {
  font-family: var(--wd-font-data); font-size: 11px;
  color: var(--wd-stone-mid);
}
.wp-radio.active { color: var(--wd-forest); font-weight: 600; }

/* ── ARCHITECTURE panel — federated query vs. ingest ── */
.wp-arch-toggle {
  display: inline-flex; gap: 0;
  background: rgba(0,0,0,0.04);
  border: 1px solid var(--wd-border);
  border-radius: 6px; padding: 2px;
}
.wp-arch-mode {
  background: transparent; border: 0;
  padding: 5px 12px; cursor: pointer;
  font-family: var(--wd-font-data); font-size: 11px;
  color: var(--wd-stone-mid); border-radius: 4px;
  transition: background .15s, color .15s;
}
.wp-arch-mode.active {
  background: var(--wd-forest); color: #fff;
}
.wp-arch {
  display: grid; grid-template-columns: 160px 1fr 200px;
  gap: 0;
  background: var(--wd-cream-2);
  border: 1px solid var(--wd-border);
  border-radius: 10px;
  padding: 18px 14px;
  position: relative;
  min-height: 320px;
}
.wp-arch-col { display: flex; flex-direction: column; gap: 8px; position: relative; z-index: 2; }
.wp-arch-col-lbl {
  font-family: var(--wd-font-data); font-size: 9px;
  text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--wd-stone); margin-bottom: 6px;
}
.wp-arch-col-lbl em {
  font-style: normal; color: var(--wd-forest); text-transform: none;
  font-size: 9px; letter-spacing: 0;
}
.wp-arch-node {
  display: flex; align-items: center; gap: 7px;
  background: #fff; border: 1px solid var(--wd-border);
  border-radius: 6px; padding: 7px 10px;
  font-family: var(--wd-font-data); font-size: 11px;
  color: var(--wd-ink);
  animation: wp-fade .4s ease-out both;
}
.wp-arch-node:nth-child(2) { animation-delay: 0s; }
.wp-arch-node:nth-child(3) { animation-delay: .1s; }
.wp-arch-node:nth-child(4) { animation-delay: .2s; }
.wp-arch-node:nth-child(5) { animation-delay: .3s; }
.wp-arch-node:nth-child(6) { animation-delay: .4s; }
.wp-arch-dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--wd-forest);
  animation: wp-blink 1.6s ease-in-out infinite;
}

/* Middle gateway */
.wp-arch-mid {
  position: relative;
  display: flex; align-items: center; justify-content: center;
}
.wp-arch-svg {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  pointer-events: none; z-index: 1;
}
.wp-arch-line {
  fill: none;
  stroke: rgba(30,58,47,0.18);
  stroke-width: 1.5;
  stroke-dasharray: 4 4;
  animation: wp-arch-dash 1.6s linear infinite;
}
.wp-arch-line-out {
  stroke: rgba(196,124,43,0.4);
  stroke-dasharray: 6 4;
  animation-duration: 1.2s;
}
@keyframes wp-arch-dash {
  to { stroke-dashoffset: -16; }
}
.wp-arch-pkt { filter: drop-shadow(0 0 4px rgba(61,122,92,0.6)); }
.wp-arch-pkt-out { filter: drop-shadow(0 0 6px rgba(196,124,43,0.7)); }

/* Federated mode: data flows OUT to systems and back in. Default. */
/* Ingest mode: reverse particle direction */
.wp-arch[data-arch-active="ingest"] .wp-arch-pkt animateMotion,
.wp-arch[data-arch-active="ingest"] .wp-arch-pkt {
  /* Use CSS keyframes fallback by re-running motion in opposite direction */
}
.wp-arch[data-arch-active="ingest"] .wp-arch-line {
  stroke: rgba(196,124,43,0.32);
}
.wp-arch[data-arch-active="ingest"] .wp-arch-line-out {
  stroke: rgba(30,58,47,0.18);
}

.wp-arch-gate {
  position: relative; z-index: 3;
  background: var(--wd-forest); color: #fff;
  border-radius: 10px;
  padding: 14px 18px; min-width: 140px;
  text-align: center;
  box-shadow: 0 8px 24px rgba(30,58,47,0.25);
}
.wp-arch-gate::before {
  content: ''; position: absolute; inset: -6px;
  border-radius: 14px; border: 1px solid rgba(30,58,47,0.2);
  animation: wp-arch-ring 2s ease-out infinite;
  pointer-events: none;
}
@keyframes wp-arch-ring {
  0%   { transform: scale(0.92); opacity: 0.7; }
  100% { transform: scale(1.18); opacity: 0; }
}
.wp-arch-gate-lock {
  width: 36px; height: 36px; border-radius: 50%;
  background: rgba(255,255,255,0.1);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 8px; color: #6ee7b7;
}
.wp-arch-gate-name {
  font-family: var(--wd-font-display); font-size: 13px;
  font-weight: 600;
}
.wp-arch-gate-meta {
  font-family: var(--wd-font-data); font-size: 9px;
  color: rgba(255,255,255,0.55); margin-top: 2px;
  letter-spacing: 0.04em;
}
.wp-arch-gate-status {
  display: flex; align-items: center; gap: 6px; justify-content: center;
  margin-top: 10px;
  font-family: var(--wd-font-data); font-size: 10px;
  color: rgba(255,255,255,0.85);
}
.wp-arch-pulse {
  width: 6px; height: 6px; border-radius: 50%; background: #22c55e;
  box-shadow: 0 0 0 0 rgba(34,197,94,0.6);
  animation: wp-pulse 1.6s ease-out infinite;
}

/* Right column — output */
.wp-arch-col-r { padding-left: 6px; }
.wp-arch-out {
  display: none; flex-direction: column; gap: 6px;
  background: #fff; border: 1px solid var(--wd-border); border-radius: 8px;
  padding: 10px 12px;
}
.wp-arch[data-arch-active="federate"] .wp-arch-out-fed,
.wp-arch[data-arch-active="ingest"]   .wp-arch-out-lake {
  display: flex; animation: wp-fade .35s ease-out;
}
.wp-arch-out-line {
  font-family: var(--wd-font-data); font-size: 10px;
  color: var(--wd-stone-mid);
}
.wp-arch-out-line code {
  background: var(--wd-forest-pale); color: var(--wd-forest);
  padding: 1px 5px; border-radius: 3px; font-size: 10px;
}
.wp-arch-out-line-ans {
  color: var(--wd-amber); font-weight: 600;
  margin-top: 4px;
}
.wp-arch-lake {
  display: flex; flex-direction: column; gap: 4px;
}
.wp-arch-lake-l {
  font-family: var(--wd-font-data); font-size: 9px;
  color: var(--wd-stone); text-transform: uppercase; letter-spacing: 0.08em;
  margin-bottom: 4px;
}
.wp-arch-lake-row {
  height: 6px; background: linear-gradient(to right, var(--wd-forest), var(--wd-forest-hi));
  border-radius: 2px; opacity: 0;
  animation: wp-arch-lake-fill .8s cubic-bezier(.16,1,.3,1) forwards;
}
.wp-arch-lake-row:nth-child(2) { animation-delay: .1s; }
.wp-arch-lake-row:nth-child(3) { animation-delay: .2s; }
.wp-arch-lake-row:nth-child(4) { animation-delay: .3s; }
.wp-arch-lake-row:nth-child(5) { animation-delay: .4s; }
@keyframes wp-arch-lake-fill {
  from { opacity: 0; transform: scaleX(0.2); transform-origin: left; }
  to   { opacity: 1; transform: scaleX(1); transform-origin: left; }
}

/* Security stripe under arch */
.wp-arch-strip {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px;
}
.wp-arch-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 10px; border-radius: 4px;
  background: #fff; border: 1px solid var(--wd-border);
  font-family: var(--wd-font-data); font-size: 10px;
  color: var(--wd-stone-mid);
}
.wp-arch-chip svg { color: var(--wd-forest); }

@media (max-width: 760px) {
  .wp-arch { grid-template-columns: 1fr; gap: 14px; min-height: auto; }
  .wp-arch-svg { display: none; }
  .wp-arch-mid { padding: 14px 0; }
  .wp-arch-col-r { padding-left: 0; }
}

/* Caption */
.wp-caption {
  text-align: center; margin-top: 14px;
  font-size: 12px; color: rgba(255,255,255,0.55);
  font-family: var(--wd-font-data); letter-spacing: 0.02em;
}

/* Responsive */
@media (max-width: 900px) {
  .ward-platform { padding: 10px; }
  .wp-body { grid-template-columns: 64px 1fr; }
  .wp-side-head, .wp-side-group, .wp-side-foot, .wp-nav span,
  .wp-side .wp-side-tenant { display: none; }
  .wp-nav { justify-content: center; padding: 10px 6px; }
  .wp-nav { font-size: 0; }
  .wp-nav svg { margin: 0; }
  .wp-chat { grid-template-columns: 1fr; height: 420px; }
  .wp-chat-rail { display: none; }
  .wp-sec-grid { grid-template-columns: 1fr; }
  .wp-stream { grid-template-columns: 1fr; }
  .wp-dash-grid, .wp-set-grid { grid-template-columns: 1fr; }
  .wp-top-pill, .wp-top-model { display: none; }
}
@media (max-width: 600px) {
  .wp-h { font-size: 18px; }
  .wp-panels { padding: 14px; }
  .wp-tbl { font-size: 11px; }
  .wp-tbl th, .wp-tbl td { padding: 7px 10px; }
}

/* ═══════════════════════════════════════════
   PRODUCT GALLERY PAGE — frameless L/R
   ═══════════════════════════════════════════ */
.product-gallery-section {
  padding: 48px 0 96px;
  background: var(--wd-cream);
}

/* ── Frameless image ── */
.pg-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--wd-r-lg);
}
/* Crop container for paired images — forces uniform aspect ratio */
.pg-img-wrap {
  position: relative;
  overflow: hidden;
  border-radius: var(--wd-r-lg);
}
.pg-img-wrap .pg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
}
.pg-img--wide {
  margin-bottom: 28px;
}

/* ── Explanation block ── */
.pg-explain {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
}
.pg-title {
  font-family: var(--wd-font-display);
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--wd-ink);
  margin: 4px 0 8px;
}
.pg-text {
  font-size: 15px;
  line-height: 1.7;
  color: var(--wd-stone-mid);
  max-width: 460px;
}

/* ── Row layouts ── */
.pg-row {
  margin-bottom: 72px;
}

/* Left/right: image left, text right */
.pg-row--lr {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 48px;
  align-items: center;
}

/* Right/left: text left, image right */
.pg-row--rl {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 48px;
  align-items: center;
}

/* Wide hero shot — full width with centered text below */
.pg-row--wide {
  text-align: center;
}
.pg-explain--center {
  max-width: 600px;
  margin: 0 auto;
  text-align: center;
  align-items: center;
}
.pg-explain--center .pg-text {
  max-width: 560px;
}

@media(max-width:800px) {
  .pg-row--lr,
  .pg-row--rl {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .pg-row--rl .pg-explain { order: 2; }
  .pg-row--rl .pg-img-wrap { order: 1; }
  .pg-row { margin-bottom: 56px; }
}

/* ── Scroll animations ── */
.pg-row.reveal {
  opacity: 1;
  transform: none;
}
.pg-row--lr.reveal .pg-img-wrap {
  opacity: 0;
  transform: translateX(-28px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.pg-row--lr.reveal .pg-explain {
  opacity: 0;
  transform: translateX(20px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1) 0.1s,
              transform 0.7s cubic-bezier(0.16, 1, 0.3, 1) 0.1s;
}
.pg-row--rl.reveal .pg-explain {
  opacity: 0;
  transform: translateX(-20px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.pg-row--rl.reveal .pg-img-wrap {
  opacity: 0;
  transform: translateX(28px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1) 0.1s,
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.1s;
}
.pg-row--wide.reveal .pg-img {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.pg-row--wide.reveal .pg-explain {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.15s,
              transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.15s;
}
.pg-row.reveal.visible .pg-img-wrap,
.pg-row.reveal.visible .pg-img,
.pg-row.reveal.visible .pg-explain {
  opacity: 1;
  transform: translateX(0) translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .pg-row.reveal .pg-img-wrap,
  .pg-row.reveal .pg-img,
  .pg-row.reveal .pg-explain {
    transition: none;
    opacity: 1;
    transform: none;
  }
}

/* ═══════════════════════════════════════════════════════════
   ADVISORY PAGE
   ═══════════════════════════════════════════════════════════ */
.adv-section {
  padding: 80px 0;
  background: var(--wd-cream);
}
.adv-section.adv-section-alt {
  background: var(--wd-white, #fff);
}
.adv-body {
  font-size: 16px;
  line-height: 1.7;
  color: var(--wd-ink);
  max-width: 720px;
}

/* Problem Grid */
.adv-problem-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.adv-problem-card {
  background: var(--wd-white, #fff);
  border: 1px solid var(--wd-cream-3);
  border-radius: var(--wd-r-lg);
  padding: 28px 24px;
  transition: transform 0.2s, box-shadow 0.2s;
}
.adv-problem-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--wd-shadow-md);
}
.adv-problem-icon {
  width: 44px;
  height: 44px;
  background: var(--wd-forest-pale);
  border-radius: var(--wd-r-md);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}
.adv-problem-card h4 {
  font-family: var(--wd-font-display);
  font-size: 17px;
  font-weight: 600;
  margin: 0 0 8px;
  color: var(--wd-ink);
}
.adv-problem-card p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--wd-stone);
  margin: 0;
}

/* Credibility Stats */
.adv-cred-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.adv-cred-card {
  background: var(--wd-forest-pale);
  border-radius: var(--wd-r-lg);
  padding: 28px 24px;
  text-align: center;
}
.adv-cred-number {
  font-family: var(--wd-font-data);
  font-size: 36px;
  font-weight: 500;
  color: var(--wd-forest);
  line-height: 1;
  margin-bottom: 8px;
}
.adv-cred-label {
  font-family: var(--wd-font-data);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--wd-stone);
}

/* Strategy Cards Grid */
.adv-strategy-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.adv-strategy-card {
  background: var(--wd-white, #fff);
  border: 1px solid var(--wd-cream-3);
  border-radius: var(--wd-r-lg);
  padding: 32px 28px;
  position: relative;
  overflow: hidden;
  transition: transform 0.2s, box-shadow 0.2s;
  display: flex;
  flex-direction: column;
}
.adv-strategy-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--wd-shadow-lg);
}
.adv-strategy-accent {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--wd-forest), var(--wd-forest-hi));
  opacity: 0;
  transition: opacity 0.2s;
}
.adv-strategy-card:hover .adv-strategy-accent {
  opacity: 1;
}
.adv-strategy-icon {
  width: 52px;
  height: 52px;
  background: var(--wd-forest-pale);
  border-radius: var(--wd-r-md);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}
.adv-strategy-label {
  font-family: var(--wd-font-data);
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wd-forest);
  margin-bottom: 8px;
}
.adv-strategy-card h3 {
  font-family: var(--wd-font-display);
  font-size: 20px;
  font-weight: 600;
  color: var(--wd-ink);
  margin: 0 0 12px;
}
.adv-strategy-card > p {
  font-size: 14px;
  line-height: 1.65;
  color: var(--wd-stone);
  margin: 0 0 16px;
}
.adv-strategy-list {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
  flex: 1;
}
.adv-strategy-list li {
  font-size: 13px;
  line-height: 1.5;
  color: var(--wd-ink);
  padding: 6px 0 6px 20px;
  position: relative;
}
.adv-strategy-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 12px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--wd-forest-hi);
}
.adv-strategy-cta {
  font-family: var(--wd-font-body);
  font-size: 13px;
  font-weight: 500;
  color: var(--wd-forest);
  text-decoration: none;
  transition: color 0.15s;
  margin-top: auto;
}
.adv-strategy-cta:hover {
  color: var(--wd-forest-hi);
}

/* Process Steps */
.adv-process-grid {
  display: flex;
  align-items: flex-start;
  gap: 0;
}
.adv-process-step {
  flex: 1;
  padding: 24px;
  background: var(--wd-cream);
  border-radius: var(--wd-r-lg);
}
.adv-process-n {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--wd-forest);
  color: #fff;
  font-family: var(--wd-font-data);
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
}
.adv-process-step h4 {
  font-family: var(--wd-font-display);
  font-size: 17px;
  font-weight: 600;
  color: var(--wd-ink);
  margin: 0 0 8px;
}
.adv-process-step p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--wd-stone);
  margin: 0;
}
.adv-process-arrow {
  display: flex;
  align-items: center;
  padding: 0 8px;
  padding-top: 24px;
  opacity: 0.4;
}

/* Audience Grid */
.adv-audience-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.adv-audience-card {
  background: var(--wd-white, #fff);
  border: 1px solid var(--wd-cream-3);
  border-radius: var(--wd-r-lg);
  padding: 28px 24px;
  position: relative;
  overflow: hidden;
}
.adv-audience-line {
  position: absolute;
  top: 0;
  left: 24px;
  right: 24px;
  height: 2px;
  background: var(--wd-forest);
  opacity: 0.3;
  transition: opacity 0.2s;
}
.adv-audience-card:hover .adv-audience-line {
  opacity: 1;
}
.adv-audience-card h4 {
  font-family: var(--wd-font-display);
  font-size: 18px;
  font-weight: 600;
  color: var(--wd-ink);
  margin: 12px 0 10px;
}
.adv-audience-card p {
  font-size: 14px;
  line-height: 1.65;
  color: var(--wd-stone);
  margin: 0;
}

/* Advisory Form */
.adv-form-container {
  max-width: 720px;
  margin: 0 auto;
  background: var(--wd-cream);
  border: 1px solid var(--wd-cream-3);
  border-radius: var(--wd-r-lg);
  padding: 48px 40px;
}
.advisory-form .field-group {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}
.advisory-form .field {
  display: flex;
  flex-direction: column;
}
.advisory-form textarea.field-input {
  resize: vertical;
  min-height: 80px;
}
.adv-form-actions {
  margin-top: 24px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.adv-form-note {
  font-size: 13px;
  color: var(--wd-stone);
  margin: 0;
}
.req {
  color: var(--wd-danger);
}

/* Advisory Responsive */
@media (max-width: 1024px) {
  .adv-strategy-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .adv-strategy-card:last-child {
    grid-column: span 2;
  }
}

@media (max-width: 768px) {
  .adv-section {
    padding: 48px 0;
  }
  .adv-problem-grid {
    grid-template-columns: 1fr 1fr;
  }
  .adv-cred-row {
    grid-template-columns: 1fr 1fr;
  }
  .adv-strategy-grid {
    grid-template-columns: 1fr;
  }
  .adv-strategy-card:last-child {
    grid-column: span 1;
  }
  .adv-process-grid {
    flex-direction: column;
    gap: 12px;
  }
  .adv-process-arrow {
    transform: rotate(90deg);
    padding: 0;
    justify-content: center;
  }
  .adv-audience-grid {
    grid-template-columns: 1fr;
  }
  .adv-form-container {
    padding: 32px 24px;
  }
  .advisory-form .field-group {
    grid-template-columns: 1fr;
  }
  .adv-form-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .adv-form-note {
    text-align: center;
  }
}

/* ═══════════════════════════════════════════════════════════
   ADVISORY: Stack types, Packages, Methodology, Hire compare
   ═══════════════════════════════════════════════════════════ */

/* Stack Types Grid */
.adv-stack-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
.adv-stack-card {
  background: var(--wd-white, #fff);
  border: 1px solid var(--wd-cream-3);
  border-radius: var(--wd-r-lg);
  padding: 32px 28px;
  transition: transform 0.2s, box-shadow 0.2s;
}
.adv-stack-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--wd-shadow-md);
}
.adv-stack-tag {
  display: inline-block;
  font-family: var(--wd-font-data);
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--wd-forest);
  background: var(--wd-forest-pale);
  padding: 4px 10px;
  border-radius: var(--wd-r-pill);
  margin-bottom: 14px;
}
.adv-stack-card h3 {
  font-family: var(--wd-font-display);
  font-size: 20px;
  font-weight: 600;
  color: var(--wd-ink);
  margin: 0 0 12px;
  line-height: 1.3;
}
.adv-stack-desc {
  font-size: 14px;
  line-height: 1.65;
  color: var(--wd-stone);
  margin: 0 0 20px;
}
.adv-stack-meta {
  border-top: 1px solid var(--wd-cream-3);
  border-bottom: 1px solid var(--wd-cream-3);
  padding: 12px 0;
  margin-bottom: 16px;
}
.adv-stack-meta-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 6px 0;
  font-size: 13px;
}
.adv-stack-meta-row span {
  font-family: var(--wd-font-data);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--wd-stone);
}
.adv-stack-meta-row strong {
  font-weight: 600;
  color: var(--wd-ink);
  text-align: right;
}
.adv-stack-typical {
  font-size: 13px;
  line-height: 1.55;
  color: var(--wd-stone);
  margin: 0;
}
.adv-stack-typical strong {
  color: var(--wd-ink);
  font-weight: 600;
}

/* Packages Grid */
.adv-pkg-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-bottom: 32px;
}
.adv-pkg-card {
  background: var(--wd-white, #fff);
  border: 1px solid var(--wd-cream-3);
  border-radius: var(--wd-r-lg);
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: transform 0.2s, box-shadow 0.2s;
}
.adv-pkg-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--wd-shadow-md);
}
.adv-pkg-card.featured {
  border: 2px solid var(--wd-forest);
  box-shadow: var(--wd-shadow-glow);
}
.adv-pkg-pill {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--wd-forest);
  color: #fff;
  font-family: var(--wd-font-data);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 4px 12px;
  border-radius: var(--wd-r-pill);
  white-space: nowrap;
}
.adv-pkg-stack {
  font-family: var(--wd-font-data);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wd-stone);
  margin-bottom: 8px;
}
.adv-pkg-name {
  font-family: var(--wd-font-display);
  font-size: 24px;
  font-weight: 700;
  color: var(--wd-ink);
  letter-spacing: -0.02em;
  margin-bottom: 16px;
}
.adv-pkg-price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--wd-cream-3);
  margin-bottom: 16px;
}
.adv-pkg-amount {
  font-family: var(--wd-font-display);
  font-size: 32px;
  font-weight: 800;
  color: var(--wd-ink);
  letter-spacing: -0.02em;
  line-height: 1;
}
.adv-pkg-unit {
  font-family: var(--wd-font-data);
  font-size: 12px;
  color: var(--wd-stone);
}
.adv-pkg-meta {
  margin-bottom: 16px;
}
.adv-pkg-meta-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 4px 0;
  font-size: 12px;
}
.adv-pkg-meta-row span {
  font-family: var(--wd-font-data);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--wd-stone);
}
.adv-pkg-meta-row strong {
  font-weight: 600;
  color: var(--wd-ink);
  text-align: right;
}
.adv-pkg-list {
  list-style: none;
  padding: 0;
  margin: 0 0 16px;
  flex: 1;
}
.adv-pkg-list li {
  font-size: 13px;
  line-height: 1.5;
  color: var(--wd-ink);
  padding: 5px 0 5px 20px;
  position: relative;
}
.adv-pkg-list li::before {
  content: '\2713';
  position: absolute;
  left: 0;
  top: 5px;
  color: var(--wd-forest);
  font-weight: 600;
  font-size: 12px;
}
.adv-pkg-best {
  border-top: 1px solid var(--wd-cream-3);
  padding-top: 14px;
  font-size: 13px;
  line-height: 1.55;
  color: var(--wd-stone);
}
.adv-pkg-best strong {
  display: block;
  font-family: var(--wd-font-data);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wd-forest);
  margin-bottom: 4px;
}
.adv-pkg-fineprint {
  background: var(--wd-cream);
  border: 1px solid var(--wd-cream-3);
  border-radius: var(--wd-r-md);
  padding: 20px 24px;
}
.adv-pkg-fp-row {
  font-size: 13px;
  line-height: 1.6;
  color: var(--wd-stone);
  padding: 6px 0;
}
.adv-pkg-fp-row strong {
  color: var(--wd-ink);
  font-weight: 600;
}

/* Methodology List */
.adv-method-list {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.adv-method-row {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 24px;
  background: var(--wd-white, #fff);
  border: 1px solid var(--wd-cream-3);
  border-radius: var(--wd-r-lg);
  padding: 28px 32px;
}
.adv-method-n {
  font-family: var(--wd-font-data);
  font-size: 32px;
  font-weight: 500;
  color: var(--wd-forest);
  line-height: 1;
  letter-spacing: -0.02em;
}
.adv-method-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.adv-method-head h3 {
  font-family: var(--wd-font-display);
  font-size: 22px;
  font-weight: 700;
  color: var(--wd-ink);
  margin: 0;
  letter-spacing: -0.01em;
}
.adv-method-when {
  font-family: var(--wd-font-data);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wd-forest);
  background: var(--wd-forest-pale);
  padding: 4px 10px;
  border-radius: var(--wd-r-pill);
}
.adv-method-body > p {
  font-size: 14px;
  line-height: 1.7;
  color: var(--wd-ink);
  margin: 0 0 18px;
}
.adv-method-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--wd-cream-3);
}
.adv-method-grid > div p {
  font-size: 13px;
  line-height: 1.55;
  color: var(--wd-stone);
  margin: 0;
}
.adv-method-label {
  display: block;
  font-family: var(--wd-font-data);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wd-forest);
  margin-bottom: 6px;
  font-weight: 500;
}

/* Hire Comparison Table */
.adv-hire-table-wrap {
  background: var(--wd-white, #fff);
  border: 1px solid var(--wd-cream-3);
  border-radius: var(--wd-r-lg);
  overflow: hidden;
  margin-bottom: 32px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.adv-hire-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  min-width: 720px;
}
.adv-hire-table th {
  font-family: var(--wd-font-data);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--wd-stone);
  text-align: left;
  padding: 16px 18px;
  background: var(--wd-cream);
  border-bottom: 2px solid var(--wd-cream-3);
  white-space: nowrap;
}
.adv-hire-table th.adv-hire-ward {
  background: var(--wd-forest);
  color: #fff;
}
.adv-hire-table td {
  padding: 14px 18px;
  border-bottom: 1px solid var(--wd-cream-3);
  color: var(--wd-stone);
  vertical-align: top;
  line-height: 1.5;
}
.adv-hire-table td:first-child {
  font-weight: 600;
  color: var(--wd-ink);
  white-space: nowrap;
}
.adv-hire-table td.adv-hire-ward {
  background: var(--wd-forest-pale);
  color: var(--wd-forest);
  font-weight: 500;
}
.adv-hire-table tbody tr:nth-child(even) td {
  background: rgba(250, 248, 243, 0.5);
}
.adv-hire-table tbody tr:nth-child(even) td.adv-hire-ward {
  background: var(--wd-forest-pale);
}
.adv-hire-table tr.adv-hire-total td {
  font-family: var(--wd-font-display);
  font-size: 15px;
  font-weight: 700;
  color: var(--wd-ink);
  border-top: 2px solid var(--wd-cream-3);
  border-bottom: none;
  background: var(--wd-cream);
}
.adv-hire-table tr.adv-hire-total td.adv-hire-ward {
  background: var(--wd-forest);
  color: #fff;
}
.adv-hire-callout {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.adv-hire-callout-row {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 16px;
  align-items: start;
  background: var(--wd-cream);
  border-left: 3px solid var(--wd-forest);
  padding: 18px 20px;
  border-radius: 0 var(--wd-r-md) var(--wd-r-md) 0;
}
.adv-hire-callout-n {
  font-family: var(--wd-font-data);
  font-size: 18px;
  font-weight: 500;
  color: var(--wd-forest);
  line-height: 1;
  padding-top: 2px;
}
.adv-hire-callout-row p {
  font-size: 14px;
  line-height: 1.65;
  color: var(--wd-ink);
  margin: 0;
}

/* Responsive */
@media (max-width: 1100px) {
  .adv-pkg-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .adv-stack-grid { grid-template-columns: 1fr; }
  .adv-pkg-grid { grid-template-columns: 1fr; }
  .adv-method-row {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 24px 20px;
  }
  .adv-method-grid { grid-template-columns: 1fr; gap: 16px; }
  .adv-method-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}

/* Advisory detail pages */
/* Advisory detail page sections */
.advd-section {
  padding: 80px 0;
}
.advd-section.advd-cream { background: var(--wd-cream); }
.advd-section.advd-white { background: var(--wd-white, #fff); }
.advd-section.advd-forest-pale { background: var(--wd-forest-pale); }
.advd-section.advd-cream-2 { background: var(--wd-cream-2); }

/* Split layout: text left/right with content beside it */
.advd-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: start;
}
.advd-split.advd-flip { direction: rtl; }
.advd-split.advd-flip > * { direction: ltr; }

.advd-text h2 {
  font-family: var(--wd-font-display);
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--wd-ink);
  margin: 0 0 16px;
  line-height: 1.2;
}
.advd-text p {
  font-size: 15px;
  line-height: 1.7;
  color: var(--wd-ink);
  margin: 0 0 16px;
}
.advd-text ul {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
}
.advd-text ul li {
  font-size: 14px;
  line-height: 1.6;
  color: var(--wd-ink);
  padding: 7px 0 7px 22px;
  position: relative;
  border-bottom: 1px solid var(--wd-border, rgba(0,0,0,0.06));
}
.advd-text ul li:last-child { border-bottom: none; }
.advd-text ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 14px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--wd-forest-hi);
}

/* Cards panel (right/left side of split) */
.advd-cards {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.advd-card {
  background: var(--wd-white, #fff);
  border: 1px solid var(--wd-cream-3);
  border-radius: var(--wd-r-lg);
  padding: 24px;
}
.advd-forest-pale .advd-card { background: var(--wd-white, #fff); }
.advd-cream .advd-card { background: var(--wd-white, #fff); }
.advd-white .advd-card { background: var(--wd-cream); }
.advd-cream-2 .advd-card { background: var(--wd-white, #fff); }

.advd-card h4 {
  font-family: var(--wd-font-display);
  font-size: 17px;
  font-weight: 600;
  color: var(--wd-forest);
  margin: 0 0 8px;
}
.advd-card p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--wd-stone);
  margin: 0;
}
.advd-card ul {
  list-style: none;
  padding: 0;
  margin: 8px 0 0;
}
.advd-card ul li {
  font-size: 13px;
  line-height: 1.5;
  color: var(--wd-ink);
  padding: 4px 0 4px 18px;
  position: relative;
}
.advd-card ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 10px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--wd-forest-hi);
}

/* Callout bar */
.advd-callout {
  position: relative;
  padding: 24px 0 24px 28px;
  margin: 32px 0 0;
}
.advd-callout::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--wd-forest);
  border-radius: 2px;
}
.advd-callout p {
  font-size: 17px;
  font-weight: 500;
  color: var(--wd-forest);
  line-height: 1.5;
  margin: 0;
}

/* Full-width section (non-split) */
.advd-full {
  max-width: 720px;
}
.advd-full h2 {
  font-family: var(--wd-font-display);
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--wd-ink);
  margin: 0 0 16px;
  line-height: 1.2;
}
.advd-full p {
  font-size: 15px;
  line-height: 1.7;
  color: var(--wd-ink);
  margin: 0 0 16px;
}
.advd-full ul {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
}
.advd-full ul li {
  font-size: 14px;
  line-height: 1.6;
  color: var(--wd-ink);
  padding: 7px 0 7px 22px;
  position: relative;
  border-bottom: 1px solid var(--wd-border, rgba(0,0,0,0.06));
}
.advd-full ul li:last-child { border-bottom: none; }
.advd-full ul li::before {
  content: '';
  position: absolute;
  left: 0; top: 14px;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--wd-forest-hi);
}

/* Deliverable rows */
.advd-deliverables {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 24px;
}
.advd-deliverable {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  background: var(--wd-white, #fff);
  border: 1px solid var(--wd-cream-3);
  border-radius: var(--wd-r-lg);
  padding: 20px 24px;
}
.advd-cream .advd-deliverable,
.advd-forest-pale .advd-deliverable { background: var(--wd-white, #fff); }
.advd-white .advd-deliverable { background: var(--wd-cream); }
.advd-deliverable svg { flex-shrink: 0; margin-top: 2px; }
.advd-deliverable h4 {
  font-family: var(--wd-font-display);
  font-size: 15px;
  font-weight: 600;
  color: var(--wd-forest);
  margin: 0 0 4px;
}
.advd-deliverable p {
  font-size: 13px;
  line-height: 1.5;
  color: var(--wd-stone);
  margin: 0;
}

@media (max-width: 768px) {
  .advd-section { padding: 48px 0; }
  .advd-split { grid-template-columns: 1fr; gap: 32px; }
  .advd-split.advd-flip { direction: ltr; }
  .advd-deliverables { grid-template-columns: 1fr; }
  .advd-callout p { font-size: 15px; }
}

/* ═══════════════════════════════════════════════════════════
   BLOG — Listing & Post Pages
   ═══════════════════════════════════════════════════════════ */

/* ── Blog Hero ── */
.blog-hero {
  padding: 80px 0 40px;
}
.blog-hero .section-heading {
  max-width: 640px;
}
.blog-hero .section-desc {
  max-width: 560px;
  margin-bottom: 0;
}

/* ── Blog Card Grid ── */
.blog-grid-section {
  padding: 0 0 120px;
}
.blog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.blog-card {
  display: block;
  text-decoration: none;
  color: inherit;
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg);
  transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
}
.blog-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--wd-shadow-md);
  border-color: var(--wd-border-md);
}
.blog-card-inner {
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: 100%;
}
.blog-card-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-family: 'DM Mono', monospace;
  color: var(--wd-stone);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.blog-card-category {
  color: var(--wd-forest);
  font-weight: 500;
}
.blog-card-dot {
  color: var(--wd-stone);
  opacity: 0.5;
}
.blog-card-title {
  font-family: 'Fraunces', serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--wd-ink);
  margin: 0;
}
.blog-card-desc {
  font-size: 14px;
  line-height: 1.6;
  color: var(--wd-stone-mid);
  margin: 0;
  flex: 1;
}
.blog-card-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--wd-stone);
  margin-top: auto;
  padding-top: 8px;
  border-top: 1px solid var(--wd-border);
}
.blog-card-author { font-weight: 500; color: var(--wd-stone-dark); }
.blog-card-read { font-family: 'DM Mono', monospace; font-size: 12px; }
.blog-empty {
  text-align: center;
  color: var(--wd-stone);
  padding: 80px 0;
  font-size: 15px;
}

/* ── Pagination ── */
.blog-pagination {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 48px;
  padding-bottom: 24px;
  scroll-margin-top: 80px;
  position: relative;
  z-index: 1;
}
.blog-page-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 14px;
  border-radius: var(--wd-r-md);
  border: 1px solid var(--wd-border);
  background: var(--wd-white);
  color: var(--wd-stone-dark);
  font-size: 14px;
  font-family: 'DM Mono', monospace;
  text-decoration: none;
  transition: all 0.15s;
}
.blog-page-link:hover {
  border-color: var(--wd-forest);
  color: var(--wd-forest);
}
.blog-page-link.active {
  background: var(--wd-forest);
  border-color: var(--wd-forest);
  color: white;
}

/* ── Blog Post Nav Bar (sticky below main nav) ── */
.blog-post-nav {
  position: sticky;
  top: 56px;
  z-index: 1999;
  background: rgba(250,248,243,0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--wd-border);
}
.blog-post-nav-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  height: 40px;
}
.blog-post-nav-title {
  font-family: 'Fraunces', serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--wd-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 600px;
  text-align: center;
}
.blog-post-nav-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: var(--wd-r-sm);
  border: 1px solid var(--wd-border);
  font-size: 14px;
  color: var(--wd-stone-dark);
  text-decoration: none;
  flex-shrink: 0;
  transition: all 0.15s;
}
.blog-post-nav-arrow:hover {
  border-color: var(--wd-forest);
  color: var(--wd-forest);
  background: var(--wd-forest-pale);
}
.blog-post-nav-disabled {
  opacity: 0.25;
  pointer-events: none;
}

/* ── Blog Post — Breadcrumb ── */
.blog-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-family: 'DM Mono', monospace;
  color: var(--wd-stone);
  padding: 0 0 24px;
}
.blog-breadcrumb a {
  color: var(--wd-stone);
  text-decoration: none;
  transition: color 0.15s;
}
.blog-breadcrumb a:hover { color: var(--wd-forest); }
.bc-sep { opacity: 0.4; }
.bc-current { color: var(--wd-stone-dark); }

/* ── Blog Post — Header ── */
.blog-post-header {
  padding: 0 0 32px;
  max-width: 720px;
}

/* ── Blog Post — Single Column Layout ── */
.blog-post-single {
  max-width: 760px;
}
.blog-post-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-family: 'DM Mono', monospace;
  color: var(--wd-stone);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 16px;
}
.blog-post-title {
  font-family: 'Fraunces', serif;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--wd-ink);
  margin: 0 0 16px;
}
.blog-post-desc {
  font-size: 18px;
  line-height: 1.6;
  color: var(--wd-stone-mid);
  margin: 0 0 24px;
}
.blog-post-byline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 20px;
  border-top: 1px solid var(--wd-border);
}
.blog-post-author-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.blog-post-author {
  font-weight: 500;
  font-size: 14px;
  color: var(--wd-ink);
}
.blog-post-author-role {
  font-size: 13px;
  color: var(--wd-stone);
}
.blog-post-date {
  font-size: 13px;
  font-family: 'DM Mono', monospace;
  color: var(--wd-stone);
}

/* ── Blog Post — Body ── */
.blog-post-body {
  padding: 120px 0 64px;
}

/* ── Share Links (inline) ── */
.blog-share {
  padding-bottom: 24px;
  border-bottom: 1px solid var(--wd-border);
}
.blog-share-links {
  display: flex;
  gap: 8px;
}
.blog-share-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: var(--wd-r-sm);
  border: 1px solid var(--wd-border);
  color: var(--wd-stone);
  text-decoration: none;
  transition: all 0.15s;
}
.blog-share-link:hover {
  border-color: var(--wd-forest);
  color: var(--wd-forest);
  background: var(--wd-forest-pale);
}

/* ── TOC (inline, collapsible) ── */
.blog-toc-inline {
  padding: 20px 0 28px;
  border-bottom: 1px solid var(--wd-border);
  margin-bottom: 32px;
}
.blog-toc-label {
  font-size: 11px;
  font-family: 'DM Mono', monospace;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wd-stone);
  font-weight: 500;
  cursor: pointer;
  list-style: none;
}
.blog-toc-label::-webkit-details-marker { display: none; }
.blog-toc-label::before {
  content: '+ ';
  font-weight: 400;
}
details[open] > .blog-toc-label::before {
  content: '- ';
}
.blog-toc-list {
  list-style: none;
  padding: 0;
  margin: 12px 0 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.blog-toc-item {}
.blog-toc-sub { padding-left: 16px; }
.blog-toc-link {
  display: block;
  font-size: 13px;
  line-height: 1.5;
  color: var(--wd-stone);
  text-decoration: none;
  padding: 3px 0;
  transition: color 0.15s;
}
.blog-toc-link:hover {
  color: var(--wd-forest);
}
.blog-toc-link.active {
  color: var(--wd-forest);
  font-weight: 500;
}

/* ── Article Content ── */
.blog-article {
  max-width: 720px;
  font-size: 16px;
  line-height: 1.75;
  color: var(--wd-ink);
}
.blog-article h2 {
  font-family: 'Fraunces', serif;
  font-size: 28px;
  font-weight: 600;
  line-height: 1.3;
  margin: 48px 0 16px;
  color: var(--wd-ink);
  scroll-margin-top: 100px;
}
.blog-article h3 {
  font-family: 'Fraunces', serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.3;
  margin: 32px 0 12px;
  color: var(--wd-ink);
  scroll-margin-top: 100px;
}
.blog-article p {
  margin: 0 0 20px;
}
.blog-article ul, .blog-article ol {
  margin: 0 0 20px;
  padding-left: 24px;
}
.blog-article li {
  margin-bottom: 8px;
}
.blog-article blockquote {
  border-left: 3px solid var(--wd-forest);
  margin: 24px 0;
  padding: 16px 24px;
  background: var(--wd-forest-pale);
  border-radius: 0 var(--wd-r-md) var(--wd-r-md) 0;
  font-style: italic;
  color: var(--wd-stone-dark);
}
.blog-article code {
  font-family: 'DM Mono', monospace;
  font-size: 14px;
  background: var(--wd-cream-2);
  padding: 2px 6px;
  border-radius: 4px;
}
.blog-article strong {
  font-weight: 600;
  color: var(--wd-ink);
}
.blog-article a {
  color: var(--wd-forest);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.blog-article a:hover {
  color: var(--wd-forest-hi);
}

/* ── Mid-Article CTA ── */
.blog-cta-mid {
  margin: 40px 0;
  padding: 24px 28px;
  background: var(--wd-forest-pale);
  border: 1px solid rgba(30,58,47,0.12);
  border-radius: var(--wd-r-lg);
}
.blog-cta-mid-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.blog-cta-mid-text {
  font-family: 'Fraunces', serif;
  font-size: 17px;
  font-weight: 600;
  color: var(--wd-forest);
  margin: 0;
}
.blog-cta-mid .btn {
  white-space: nowrap;
  flex-shrink: 0;
}

/* ── End-of-Article CTA ── */
.blog-cta-end {
  margin: 48px 0 32px;
  padding: 36px 32px;
  background: var(--wd-forest);
  border-radius: var(--wd-r-xl);
  color: white;
}
.blog-cta-end-inner h3 {
  font-family: 'Fraunces', serif;
  font-size: 24px;
  font-weight: 600;
  margin: 0 0 8px;
  color: white;
}
.blog-cta-end-inner p {
  font-size: 15px;
  color: rgba(255,255,255,0.75);
  margin: 0 0 20px;
}
.blog-cta-end-actions {
  display: flex;
  gap: 12px;
}
.blog-cta-end .btn-forest {
  background: white;
  color: var(--wd-forest);
}
.blog-cta-end .btn-forest:hover {
  background: var(--wd-cream);
}
.blog-cta-end .btn-outline {
  border-color: rgba(255,255,255,0.3);
  color: white;
}
.blog-cta-end .btn-outline:hover {
  border-color: rgba(255,255,255,0.6);
  background: rgba(255,255,255,0.08);
}

/* ── Tags ── */
.blog-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid var(--wd-border);
}
.blog-tag {
  display: inline-block;
  font-size: 12px;
  font-family: 'DM Mono', monospace;
  color: var(--wd-stone-mid);
  background: var(--wd-cream-2);
  padding: 4px 12px;
  border-radius: var(--wd-r-pill);
}

/* ── Related Posts ── */
.blog-related {
  padding: 64px 0;
  background: var(--wd-cream-2);
}
.blog-related .section-label { margin-bottom: 24px; }

/* ── Funnel Bridge ── */
.blog-funnel-bridge {
  padding: 64px 0;
  background: var(--wd-white);
  border-top: 1px solid var(--wd-border);
}
.blog-funnel-bridge .section-label { margin-bottom: 24px; }
.blog-funnel-bridge .section-heading { margin-bottom: 8px; }

/* ── Blog Responsive ── */
@media (max-width: 768px) {
  .blog-hero { padding: 60px 0 32px; }
  .blog-grid { grid-template-columns: 1fr; gap: 16px; }
  .blog-card-inner { padding: 20px; }
  .blog-card-title { font-size: 18px; }
  .blog-post-nav-title { max-width: 200px; font-size: 12px; }
  .blog-post-title { font-size: 28px; }
  .blog-post-desc { font-size: 16px; }
  .blog-article h2 { font-size: 22px; margin-top: 36px; }
  .blog-article h3 { font-size: 18px; margin-top: 24px; }
  .blog-article { font-size: 15px; }
  .blog-cta-mid-inner { flex-direction: column; align-items: flex-start; }
  .blog-cta-end { padding: 28px 24px; }
  .blog-cta-end-inner h3 { font-size: 20px; }
  .blog-cta-end-actions { flex-direction: column; }
  .blog-pagination { gap: 4px; }
  .blog-page-link { min-width: 36px; height: 36px; padding: 0 10px; font-size: 13px; }
}

/* ═══════════════════════════════════════════
   REVAMP v2 — Loop / Plays / Enterprise
   ═══════════════════════════════════════════ */

/* Hero variant for narrative pages (loop, plays, enterprise) */
.hero.hero-narrative { padding: 96px 0 56px; min-height: auto; }
.hero.hero-narrative .hero-content { max-width: 880px; margin: 0 auto; text-align: center; }
.hero.hero-narrative .hero-eyebrow { justify-content: center; }
.hero.hero-narrative .hero-actions { justify-content: center; }

/* ─── HOMEPAGE: 01 The Loop strip ─── */
.loop-strip {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
  margin-top: 32px;
}
.loop-stage {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 18px 16px 18px 14px;
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  border-left: 3px solid var(--wd-forest);
  transition: transform .2s ease, box-shadow .2s ease;
}
.loop-stage:hover { transform: translateY(-2px); box-shadow: var(--wd-shadow-md); }
.loop-stage-n {
  font-family: var(--wd-font-data);
  font-size: 11px;
  color: var(--wd-stone-mid);
  letter-spacing: 0.08em;
}
.loop-stage-name {
  font-family: var(--wd-font-display);
  font-weight: 700;
  font-size: 20px;
  color: var(--wd-ink);
  line-height: 1.1;
}
.loop-stage-line {
  font-size: 13px;
  line-height: 1.5;
  color: var(--wd-stone-dark);
}
.loop-stage-sor {
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px dashed var(--wd-border);
  font-family: var(--wd-font-data);
  font-size: 10px;
  color: var(--wd-stone-mid);
  letter-spacing: 0.04em;
  line-height: 1.4;
}
.loop-cta { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; margin-top: 32px; }
@media (max-width: 1024px) {
  .loop-strip { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 600px) {
  .loop-strip { grid-template-columns: 1fr; }
}

/* ─── HOMEPAGE: 02 Plays preview grid ─── */
.plays-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 32px;
}
.play-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 22px;
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  text-decoration: none;
  color: inherit;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.play-card:hover { transform: translateY(-3px); box-shadow: var(--wd-shadow-md); border-color: var(--wd-forest-mid); }
.play-card-name {
  font-family: var(--wd-font-display);
  font-weight: 700;
  font-size: 19px;
  color: var(--wd-ink);
  line-height: 1.2;
}
.play-card-line {
  font-size: 14px;
  line-height: 1.55;
  color: var(--wd-stone-dark);
}
.play-card-meta { margin-top: auto; display: flex; flex-direction: column; gap: 6px; padding-top: 12px; border-top: 1px solid var(--wd-border); }
.play-meta-row { display: flex; justify-content: space-between; gap: 12px; font-size: 12px; }
.play-meta-k { font-family: var(--wd-font-data); text-transform: uppercase; letter-spacing: 0.06em; color: var(--wd-stone-mid); }
.play-meta-v { color: var(--wd-stone-dark); text-align: right; }
@media (max-width: 1024px) { .plays-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .plays-grid { grid-template-columns: 1fr; } }

/* ─── HOMEPAGE: 03 Loop, not Layer (vs table) ─── */
.vs-table {
  margin-top: 28px;
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  overflow: hidden;
}
.vs-row { display: grid; grid-template-columns: 180px 1fr 1fr; border-top: 1px solid var(--wd-border); }
.vs-row:first-child { border-top: 0; }
.vs-row-head .vs-cell {
  font-family: var(--wd-font-data);
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.08em;
  color: var(--wd-stone-mid);
  background: var(--wd-cream-2);
}
.vs-cell { padding: 18px 22px; font-size: 14px; line-height: 1.55; color: var(--wd-stone-dark); }
.vs-cell.vs-stage { background: var(--wd-cream); border-right: 1px solid var(--wd-border); font-family: var(--wd-font-display); }
.vs-cell.vs-without { color: var(--wd-stone-dark); border-right: 1px solid var(--wd-border); }
.vs-cell.vs-with { background: rgba(30,58,47,0.04); color: var(--wd-ink); }
@media (max-width: 800px) {
  .vs-row { grid-template-columns: 1fr; }
  .vs-cell.vs-stage { border-right: 0; border-bottom: 1px solid var(--wd-border); }
  .vs-cell.vs-without { border-right: 0; border-bottom: 1px solid var(--wd-border); }
}

/* ─── HOMEPAGE: 05 Lighthouse ─── */
.lighthouse-card {
  margin-top: 32px;
  padding: 40px;
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg);
}
.lh-quote {
  font-family: var(--wd-font-display);
  font-weight: 400;
  font-style: italic;
  font-size: clamp(20px, 2.4vw, 28px);
  line-height: 1.35;
  color: var(--wd-ink);
  margin-bottom: 24px;
}
.lh-attribution { display: flex; flex-direction: column; gap: 4px; padding-top: 18px; border-top: 1px solid var(--wd-border); }
.lh-name { font-family: var(--wd-font-display); font-weight: 700; font-size: 16px; color: var(--wd-ink); }
.lh-meta { font-family: var(--wd-font-data); font-size: 12px; color: var(--wd-stone-mid); letter-spacing: 0.04em; }
.lh-kpi-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 28px; }
.lh-kpi { padding: 18px; background: var(--wd-white); border: 1px solid var(--wd-border); border-radius: var(--wd-r-md); }
.lh-kpi-val { display: block; font-family: var(--wd-font-display); font-weight: 700; font-size: 28px; color: var(--wd-forest); line-height: 1; }
.lh-kpi-label { display: block; margin-top: 6px; font-size: 12px; color: var(--wd-stone-mid); font-family: var(--wd-font-data); }
@media (max-width: 700px) { .lh-kpi-row { grid-template-columns: 1fr; } .lighthouse-card { padding: 28px 22px; } }

/* ─── HOMEPAGE: 06 Enterprise grid ─── */
.enterprise-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-top: 32px;
}
.ent-card {
  padding: 22px 24px;
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
}
.ent-card-eyebrow {
  font-family: var(--wd-font-data);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wd-forest);
  margin-bottom: 8px;
}
.ent-card-title { font-family: var(--wd-font-display); font-weight: 700; font-size: 18px; line-height: 1.3; color: var(--wd-ink); margin-bottom: 8px; }
.ent-card-desc { font-size: 14px; line-height: 1.6; color: var(--wd-stone-dark); }
@media (max-width: 800px) { .enterprise-grid { grid-template-columns: 1fr; } }

/* ─── /LOOP narrative sections ─── */
.loop-section { padding: 80px 0; border-top: 1px solid var(--wd-border); }
.loop-section.bg-white { background: var(--wd-white); }
.loop-section-flex { display: grid; grid-template-columns: 1.6fr 1fr; gap: 56px; align-items: start; }
.loop-section-main {}
.loop-section-eyebrow { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.loop-section-n {
  font-family: var(--wd-font-data);
  font-weight: 500;
  font-size: 14px;
  color: var(--wd-forest);
  letter-spacing: 0.06em;
  padding: 4px 8px;
  background: var(--wd-forest-pale);
  border-radius: 4px;
}
.loop-section-tag {
  font-family: var(--wd-font-data);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wd-stone-mid);
}
.loop-section-name {
  font-family: var(--wd-font-display);
  font-weight: 800;
  font-size: clamp(40px, 5vw, 64px);
  line-height: 1;
  color: var(--wd-ink);
  margin-bottom: 22px;
}
.loop-section-line {
  font-family: var(--wd-font-display);
  font-weight: 400;
  font-style: italic;
  font-size: clamp(18px, 1.8vw, 22px);
  line-height: 1.45;
  color: var(--wd-ink);
  margin-bottom: 20px;
}
.loop-section-long { font-size: 15px; line-height: 1.7; color: var(--wd-stone-dark); margin-bottom: 24px; }
.loop-section-meta { display: flex; flex-direction: column; gap: 8px; padding-top: 18px; border-top: 1px solid var(--wd-border); }
.loop-meta-row { display: flex; justify-content: space-between; gap: 16px; font-size: 13px; }
.loop-meta-k { font-family: var(--wd-font-data); text-transform: uppercase; letter-spacing: 0.06em; color: var(--wd-stone-mid); flex-shrink: 0; }
.loop-meta-v { color: var(--wd-stone-dark); text-align: right; }
.loop-section-sidebar {
  position: sticky;
  top: 100px;
  padding: 24px 22px;
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  border-left: 3px solid var(--wd-amber);
  border-radius: var(--wd-r-md);
}
.loop-sidebar-label {
  font-family: var(--wd-font-data);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wd-amber);
  margin-bottom: 12px;
}
.loop-sidebar-quote {
  font-family: var(--wd-font-display);
  font-weight: 600;
  font-size: 18px;
  line-height: 1.4;
  color: var(--wd-ink);
  margin-bottom: 12px;
}
.loop-sidebar-attr { font-family: var(--wd-font-data); font-size: 11px; color: var(--wd-stone-mid); }
@media (max-width: 900px) {
  .loop-section-flex { grid-template-columns: 1fr; gap: 32px; }
  .loop-section-sidebar { position: static; }
}

/* Final cycle on /loop */
.loop-cycle { padding: 96px 0; }
.bg-forest { background: var(--wd-forest); color: var(--wd-cream); }
.bg-forest .section-heading { color: var(--wd-cream); }
.btn-cream {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 22px;
  background: var(--wd-cream);
  color: var(--wd-forest);
  border: 1px solid var(--wd-cream);
  border-radius: var(--wd-r-pill);
  font-family: var(--wd-font-body);
  font-weight: 600; font-size: 14px;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease;
}
.btn-cream:hover { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(0,0,0,0.18); }
.btn-outline-light {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 22px;
  background: transparent;
  color: var(--wd-cream);
  border: 1px solid rgba(255,255,255,0.4);
  border-radius: var(--wd-r-pill);
  font-family: var(--wd-font-body);
  font-weight: 600; font-size: 14px;
  text-decoration: none;
}
.btn-outline-light:hover { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.6); }

/* ─── /PLAYS catalog ─── */
.plays-filters { padding: 28px 0; border-bottom: 1px solid var(--wd-border); }
.plays-filter-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 6px 0; }
.plays-filter-label {
  flex-shrink: 0;
  font-family: var(--wd-font-data);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wd-stone-mid);
  margin-right: 10px;
  min-width: 56px;
}
.plays-filter-chip {
  padding: 6px 12px;
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-pill);
  font-family: var(--wd-font-data);
  font-size: 12px;
  color: var(--wd-stone-dark);
  cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.plays-filter-chip:hover { border-color: var(--wd-forest-mid); }
.plays-filter-chip.active { background: var(--wd-forest); color: var(--wd-cream); border-color: var(--wd-forest); }

.plays-full { padding: 64px 0; }
.play-detail {
  margin: 32px 0 48px;
  padding: 32px 36px;
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg);
}
.play-detail-head { padding-bottom: 22px; border-bottom: 1px solid var(--wd-border); margin-bottom: 22px; }
.play-detail-eyebrow {
  font-family: var(--wd-font-data);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wd-forest);
  margin-bottom: 8px;
}
.play-detail-name {
  font-family: var(--wd-font-display);
  font-weight: 800;
  font-size: clamp(28px, 3.4vw, 40px);
  line-height: 1.1;
  color: var(--wd-ink);
  margin-bottom: 14px;
}
.play-detail-one {
  font-family: var(--wd-font-display);
  font-weight: 400;
  font-style: italic;
  font-size: 18px;
  line-height: 1.5;
  color: var(--wd-stone-dark);
}
.play-detail-meta { display: flex; flex-wrap: wrap; gap: 24px; padding: 18px 0; border-bottom: 1px solid var(--wd-border); margin-bottom: 22px; }
.play-detail-meta .play-meta-row { flex: 1 1 220px; flex-direction: column; align-items: flex-start; gap: 4px; }
.play-detail-meta .play-meta-v { text-align: left; font-family: var(--wd-font-display); font-weight: 600; color: var(--wd-ink); }
.play-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.play-detail-block { padding: 18px 20px; background: var(--wd-cream); border: 1px solid var(--wd-border); border-radius: var(--wd-r-md); }
.play-detail-block-label {
  font-family: var(--wd-font-data);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wd-stone-mid);
  margin-bottom: 10px;
}
.play-detail-block p { font-size: 14px; line-height: 1.65; color: var(--wd-stone-dark); margin: 0; }
.play-detail-block-wide { grid-column: 1 / -1; }
.play-detail-example { background: var(--wd-forest-pale); border-color: rgba(30,58,47,0.18); }
.play-detail-example p { color: var(--wd-ink); font-family: var(--wd-font-display); font-weight: 400; font-style: italic; font-size: 15px; }
.play-procedure { margin: 0; padding-left: 22px; }
.play-procedure li { font-size: 14px; line-height: 1.7; color: var(--wd-stone-dark); margin-bottom: 4px; }
@media (max-width: 800px) {
  .play-detail-grid { grid-template-columns: 1fr; }
  .play-detail { padding: 22px; }
}

.plays-stubs { padding: 64px 0; background: var(--wd-cream-2); }
.plays-stub-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 32px; }
.play-stub-card { padding: 18px; background: var(--wd-white); border: 1px solid var(--wd-border); border-radius: var(--wd-r-md); }
.play-stub-name { font-family: var(--wd-font-display); font-weight: 700; font-size: 15px; color: var(--wd-ink); margin-bottom: 10px; }
.play-stub-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.play-stub-tag { font-family: var(--wd-font-data); font-size: 10px; padding: 3px 8px; background: var(--wd-cream); border: 1px solid var(--wd-border); border-radius: 3px; color: var(--wd-stone-mid); letter-spacing: 0.04em; }
.play-stub-tag-kpi { background: var(--wd-forest-pale); color: var(--wd-forest); border-color: rgba(30,58,47,0.15); }
@media (max-width: 1024px) { .plays-stub-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px) { .plays-stub-grid { grid-template-columns: repeat(2, 1fr); } }

/* ─── /ENTERPRISE trust center ─── */
.enterprise-table {
  margin-top: 28px;
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  overflow: hidden;
}
.ent-table-row { display: grid; grid-template-columns: 1.2fr 0.8fr 2fr; border-top: 1px solid var(--wd-border); }
.ent-table-row:first-child { border-top: 0; }
.ent-table-cell { padding: 14px 20px; font-size: 14px; line-height: 1.5; color: var(--wd-stone-dark); }
.ent-table-head .ent-table-cell { font-family: var(--wd-font-data); text-transform: uppercase; font-size: 11px; letter-spacing: 0.08em; color: var(--wd-stone-mid); background: var(--wd-cream-2); }
.ent-table-row:not(.ent-table-head) .ent-table-cell:first-child { font-family: var(--wd-font-display); font-weight: 600; color: var(--wd-ink); }
.ent-status { display: inline-block; padding: 3px 10px; border-radius: var(--wd-r-pill); font-family: var(--wd-font-data); font-size: 11px; letter-spacing: 0.04em; }
.ent-status-progress { background: rgba(196,124,43,0.12); color: var(--wd-amber); }
.ent-status-planned { background: rgba(154,149,133,0.18); color: var(--wd-stone-dark); }
.ent-status-ready { background: rgba(34,197,94,0.12); color: #15803d; }
@media (max-width: 700px) {
  .ent-table-row { grid-template-columns: 1fr; }
  .ent-table-row:not(.ent-table-head) .ent-table-cell { padding: 10px 18px; border-bottom: 1px dashed var(--wd-border); }
}

.deploy-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 32px; }
.deploy-card { padding: 26px; background: var(--wd-cream); border: 1px solid var(--wd-border); border-radius: var(--wd-r-md); display: flex; flex-direction: column; gap: 12px; }
.deploy-card-eyebrow { font-family: var(--wd-font-data); font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--wd-forest); }
.deploy-card-name { font-family: var(--wd-font-display); font-weight: 700; font-size: 22px; color: var(--wd-ink); line-height: 1.1; }
.deploy-card-line { font-size: 14px; line-height: 1.6; color: var(--wd-stone-dark); }
.deploy-card-list { margin: 0; padding-left: 0; list-style: none; padding-top: 12px; border-top: 1px solid var(--wd-border); display: flex; flex-direction: column; gap: 6px; }
.deploy-card-list li { font-family: var(--wd-font-data); font-size: 12px; color: var(--wd-stone-mid); }
@media (max-width: 900px) { .deploy-grid { grid-template-columns: 1fr; } }

.integration-tiers { display: flex; flex-direction: column; gap: 22px; margin-top: 32px; }
.int-tier { padding: 26px; background: var(--wd-white); border: 1px solid var(--wd-border); border-radius: var(--wd-r-md); }
.int-tier-head { margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid var(--wd-border); }
.int-tier-name { font-family: var(--wd-font-display); font-weight: 700; font-size: 20px; color: var(--wd-ink); margin-bottom: 6px; }
.int-tier-line { font-size: 14px; color: var(--wd-stone-dark); }
.int-tier-list { display: flex; flex-wrap: wrap; gap: 8px; }
.int-chip { padding: 6px 12px; background: var(--wd-cream); border: 1px solid var(--wd-border); border-radius: 4px; font-family: var(--wd-font-data); font-size: 12px; color: var(--wd-stone-dark); }

.pilot-timeline { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 32px; }
.pilot-week { padding: 22px; background: var(--wd-white); border: 1px solid var(--wd-border); border-left: 3px solid var(--wd-forest); border-radius: var(--wd-r-md); }
.pilot-week-n { font-family: var(--wd-font-data); font-size: 11px; color: var(--wd-stone-mid); letter-spacing: 0.08em; margin-bottom: 6px; }
.pilot-week-name { font-family: var(--wd-font-display); font-weight: 700; font-size: 18px; color: var(--wd-ink); margin-bottom: 10px; line-height: 1.2; }
.pilot-week-line { font-size: 13px; line-height: 1.55; color: var(--wd-stone-dark); }
@media (max-width: 900px) { .pilot-timeline { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .pilot-timeline { grid-template-columns: 1fr; } }

.docs-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 32px; }
.doc-card { padding: 22px; background: var(--wd-cream); border: 1px solid var(--wd-border); border-radius: var(--wd-r-md); }
.doc-card-name { font-family: var(--wd-font-display); font-weight: 700; font-size: 15px; color: var(--wd-ink); margin-bottom: 8px; line-height: 1.2; }
.doc-card-line { font-size: 13px; color: var(--wd-stone-dark); margin-bottom: 14px; line-height: 1.5; }
.doc-card-cta { font-family: var(--wd-font-data); font-size: 12px; color: var(--wd-forest); letter-spacing: 0.04em; }
@media (max-width: 900px) { .docs-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 500px) { .docs-grid { grid-template-columns: 1fr; } }

/* ── PUBLIC SIGNALS WIDGET (homepage section 04) ── */
.ps-widget {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, 1fr);
  gap: 20px;
  align-items: stretch;
}

/* Chart card */
.ps-chart {
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-lg);
  padding: 22px 24px 18px;
  box-shadow: var(--wd-shadow-sm);
  display: flex; flex-direction: column;
  min-width: 0;
}
.ps-chart-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 16px;
  margin-bottom: 14px;
}
.ps-chart-titlewrap { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ps-chart-eyebrow {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.14em; color: var(--wd-stone);
}
.ps-chart-title {
  font-family: var(--wd-font-data);
  font-size: 13px; color: var(--wd-ink); line-height: 1.4;
}
.ps-chart-title code {
  background: var(--wd-cream-2);
  padding: 1px 6px; border-radius: 4px;
  font-family: var(--wd-font-data); font-size: 12px; color: var(--wd-forest);
}
.ps-chart-acc {
  display: flex; align-items: baseline; gap: 8px;
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-pill);
  padding: 6px 14px; flex-shrink: 0;
}
.ps-acc-lbl {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--wd-stone-mid);
}
.ps-acc-val {
  font-family: var(--wd-font-display);
  font-size: 18px; font-weight: 700; color: var(--wd-ink);
  letter-spacing: -0.02em;
  transition: color 0.4s ease;
}
.ps-acc-val.acc-green { color: var(--wd-forest); }
.ps-acc-val.acc-amber { color: var(--wd-amber); }
.ps-acc-delta {
  font-family: var(--wd-font-data); font-size: 11px;
  color: var(--wd-forest);
  opacity: 0; transform: translateX(-4px);
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.ps-acc-delta.show { opacity: 1; transform: translateX(0); }

/* SVG chart */
.ps-svg {
  display: block; width: 100%; height: auto;
  aspect-ratio: 600 / 280;
  overflow: visible;
}
.ps-grid line { stroke: var(--wd-border); stroke-width: 1; stroke-dasharray: 2 4; }
.ps-grid line:last-child { stroke: var(--wd-border-md); stroke-dasharray: none; }
.ps-axis-y text,
.ps-axis-x text {
  font-family: var(--wd-font-data);
  font-size: 9px; fill: var(--wd-stone); letter-spacing: 0.04em;
  text-transform: uppercase;
}
.ps-axis-y text { text-anchor: end; }
.ps-axis-x text { text-anchor: middle; }

/* Highlight bands */
.ps-band {
  fill: transparent;
  transition: fill 0.45s ease;
  pointer-events: none;
}
.ps-band-weather.show { fill: rgba(196, 124, 43, 0.08); }
.ps-band-holiday.show { fill: rgba(30, 58, 47, 0.07); }

.ps-band-lbl {
  opacity: 0;
  transform: translateY(-4px);
  transition: opacity 0.4s ease, transform 0.4s ease;
  transform-box: fill-box;
}
.ps-band-lbl.show { opacity: 1; transform: translateY(0); }
.ps-band-lbl rect {
  fill: var(--wd-white);
  stroke-width: 1;
}
.ps-band-lbl text {
  font-family: var(--wd-font-data);
  font-size: 9px;
  letter-spacing: 0.04em;
  font-weight: 600;
}
.ps-band-lbl-weather rect { stroke: rgba(196, 124, 43, 0.4); }
.ps-band-lbl-weather text,
.ps-band-lbl-weather path { fill: var(--wd-amber); color: var(--wd-amber); }
.ps-band-lbl-holiday rect { stroke: rgba(30, 58, 47, 0.3); }
.ps-band-lbl-holiday text,
.ps-band-lbl-holiday path { fill: var(--wd-forest); color: var(--wd-forest); }

/* Lines */
.ps-path-base {
  fill: none;
  stroke: var(--wd-stone);
  stroke-width: 1.5;
  stroke-dasharray: 3 4;
  opacity: 0.55;
}
.ps-path-adj {
  fill: none;
  stroke: var(--wd-forest-hi);
  stroke-width: 2.5;
  stroke-linejoin: round;
  stroke-linecap: round;
  filter: drop-shadow(0 1px 2px rgba(30,58,47,0.12));
}
.ps-path-actual {
  fill: none;
  stroke: var(--wd-amber);
  stroke-width: 1.5;
  stroke-dasharray: 5 3;
  opacity: 0;
  transition: opacity 0.5s ease;
}
.ps-path-actual.show { opacity: 0.85; }

.ps-path-dots circle {
  fill: var(--wd-forest-hi);
  stroke: var(--wd-white);
  stroke-width: 1.5;
}
.ps-path-dots circle.ps-dot-pulse {
  fill: var(--wd-forest);
}
.ps-path-dots circle.ps-dot-pulse::after { content: ''; }

/* Legend */
.ps-legend {
  display: flex; flex-wrap: wrap; gap: 18px;
  padding-top: 14px; margin-top: 10px;
  border-top: 1px solid var(--wd-border);
}
.ps-leg-item {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--wd-font-data);
  font-size: 11px; color: var(--wd-stone-mid);
  letter-spacing: 0.02em;
}
.ps-leg-swatch {
  width: 18px; height: 2px; border-radius: 2px; flex-shrink: 0;
}
.ps-leg-base {
  background: linear-gradient(90deg, var(--wd-stone) 0 4px, transparent 4px 8px, var(--wd-stone) 8px 12px, transparent 12px 16px, var(--wd-stone) 16px 18px);
  opacity: 0.65;
}
.ps-leg-adj { background: var(--wd-forest-hi); height: 2.5px; }
.ps-leg-actual {
  background: linear-gradient(90deg, var(--wd-amber) 0 5px, transparent 5px 8px, var(--wd-amber) 8px 13px, transparent 13px 16px, var(--wd-amber) 16px 18px);
}

/* Controls */
.ps-controls {
  display: flex; flex-direction: column; gap: 10px;
  min-width: 0;
}
.ps-controls-head {
  font-family: var(--wd-font-data);
  font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--wd-stone-mid);
  padding: 0 2px 4px;
}
.ps-layer {
  display: flex; flex-direction: column; gap: 8px;
  text-align: left;
  background: var(--wd-white);
  border: 1px solid var(--wd-border);
  border-left: 3px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  padding: 14px 16px;
  cursor: pointer;
  font: inherit;
  color: inherit;
  transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}
.ps-layer:hover { background: var(--wd-cream); transform: translateX(2px); }
.ps-layer.active { border-left-color: var(--wd-forest-hi); background: var(--wd-white); }
.ps-layer[data-ps-layer="weather"].active { border-left-color: var(--wd-amber); }

.ps-layer-top {
  display: flex; align-items: center; gap: 10px;
}
.ps-layer-icon {
  width: 26px; height: 26px; border-radius: 6px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--wd-cream-2);
  color: var(--wd-stone);
  flex-shrink: 0;
  transition: background 0.25s ease, color 0.25s ease;
}
.ps-layer.active[data-ps-layer="weather"] .ps-layer-icon { background: var(--wd-amber-pale); color: var(--wd-amber); }
.ps-layer.active[data-ps-layer="holiday"] .ps-layer-icon { background: var(--wd-forest-pale); color: var(--wd-forest); }

.ps-layer-name {
  font-family: var(--wd-font-display);
  font-weight: 700; font-size: 15px; color: var(--wd-ink);
  letter-spacing: -0.01em;
  flex: 1 1 auto; min-width: 0;
}
.ps-layer-impact {
  font-family: var(--wd-font-data);
  font-size: 11px; font-weight: 600;
  padding: 3px 8px; border-radius: var(--wd-r-pill);
  background: var(--wd-cream-2);
  color: var(--wd-stone-mid);
  flex-shrink: 0;
  transition: background 0.25s ease, color 0.25s ease;
}
.ps-layer.active .ps-layer-impact { background: var(--wd-forest-pale); color: var(--wd-forest); }
.ps-layer.active[data-ps-layer="weather"] .ps-layer-impact { background: var(--wd-amber-pale); color: var(--wd-amber); }

.ps-layer-desc {
  font-size: 13px; line-height: 1.5; color: var(--wd-stone-dark);
}
.ps-layer-desc strong { color: var(--wd-ink); font-weight: 600; }

.ps-layer-meta {
  display: flex; gap: 12px;
  font-family: var(--wd-font-data);
  font-size: 10px; color: var(--wd-stone);
  letter-spacing: 0.02em;
  padding-top: 6px; border-top: 1px dashed var(--wd-border);
}
.ps-layer-src { color: var(--wd-stone-mid); }
.ps-layer-cad { margin-left: auto; color: var(--wd-stone); }

.ps-foot {
  margin-top: 2px;
  padding: 14px 16px;
  background: var(--wd-cream);
  border: 1px solid var(--wd-border);
  border-radius: var(--wd-r-md);
  display: flex; flex-direction: column; gap: 6px;
}
.ps-foot-bullet {
  font-size: 12px; line-height: 1.55; color: var(--wd-stone-dark);
  position: relative; padding-left: 12px;
}
.ps-foot-bullet::before {
  content: ''; position: absolute; left: 0; top: 8px;
  width: 4px; height: 4px; border-radius: 50%;
  background: var(--wd-forest-hi);
}

@media (max-width: 900px) {
  .ps-widget { grid-template-columns: 1fr; }
  .ps-chart { padding: 18px 18px 14px; }
  .ps-chart-head { flex-direction: column; align-items: stretch; gap: 10px; }
  .ps-chart-acc { align-self: flex-start; }
}
@media (max-width: 600px) {
  .ps-axis-fri,
  .ps-axis-x text:nth-child(even) { display: none; }
  .ps-legend { gap: 12px; }
  .ps-leg-item { font-size: 10px; }
}
.pillars-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:36px}.pillar-card{display:flex;flex-direction:column;padding:26px 24px 24px;background:var(--wd-cream);border:1px solid var(--wd-border);border-radius:var(--wd-r-lg);border-top:3px solid var(--wd-forest);transition:transform .2s ease,box-shadow .2s ease}.pillar-card:hover{transform:translateY(-3px);box-shadow:var(--wd-shadow-md)}.pillar-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.pillar-card-n{font-family:var(--wd-font-data);font-size:12px;color:var(--wd-forest);letter-spacing:.1em}.pillar-card-tag{font-family:var(--wd-font-data);font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--wd-stone-mid);background:rgba(30,58,47,.06);border:1px solid var(--wd-border);padding:4px 10px;border-radius:100px}.pillar-card-name{font-family:var(--wd-font-display);font-weight:700;font-size:26px;color:var(--wd-ink);line-height:1.1;margin-bottom:12px}.pillar-card-line{font-size:14px;line-height:1.6;color:var(--wd-stone-dark);margin-bottom:18px}.pillar-card-drivers{margin:auto 0 0;padding:16px 0 0;list-style:none;border-top:1px dashed var(--wd-border);display:flex;flex-direction:column;gap:9px}.pillar-card-drivers li{position:relative;padding-left:20px;font-size:13px;line-height:1.45;color:var(--wd-stone-dark)}.pillar-card-drivers li::before{content:"";position:absolute;left:4px;top:7px;width:6px;height:6px;border-radius:2px;background:var(--wd-forest)}@media (max-width:860px){.pillars-grid{grid-template-columns:1fr}}.pb-deptnav{display:flex;flex-wrap:wrap;gap:8px;margin:32px 0 8px}.pb-deptnav-chip{font-family:var(--wd-font-data);font-size:12px;color:var(--wd-stone-dark);background:var(--wd-white);border:1px solid var(--wd-border);border-radius:100px;padding:7px 14px;text-decoration:none;transition:all .18s ease;display:inline-flex;align-items:center;gap:7px}.pb-deptnav-chip:hover{border-color:var(--wd-forest);color:var(--wd-forest)}.pb-deptnav-chip span{font-size:10px;color:var(--wd-forest);background:var(--wd-forest-pale);border-radius:100px;padding:1px 7px}.pb-dept{margin-top:48px;scroll-margin-top:90px}.pb-dept-head{border-bottom:1px solid var(--wd-border);padding-bottom:14px;margin-bottom:8px}.pb-dept-name{font-family:var(--wd-font-display);font-weight:700;font-size:22px;color:var(--wd-ink);margin:0 0 4px}.pb-dept-blurb{font-size:14px;color:var(--wd-stone-mid);margin:0;line-height:1.5}.play-stub-tag-sys{background:rgba(26,26,20,.03);color:var(--wd-stone-dark)}.play-stub-one{font-size:13px;line-height:1.5;color:var(--wd-stone-mid);margin:-2px 0 12px}.hero-demo-wrap{width:100%;margin:38px 0 26px;animation:fadeUp 0.6s ease 0.35s both}.icon-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;margin-top:34px}.icon-feat{display:flex;flex-direction:column;gap:9px;padding:24px;background:var(--wd-white);border:1px solid var(--wd-border);border-radius:var(--wd-r-lg);transition:transform .2s ease,box-shadow .2s ease}.icon-feat:hover{transform:translateY(-2px);box-shadow:var(--wd-shadow-md)}.icon-feat-ico{width:40px;height:40px;border-radius:10px;background:var(--wd-forest-pale);color:var(--wd-forest);display:flex;align-items:center;justify-content:center;margin-bottom:2px}.icon-feat-ico svg{width:20px;height:20px}.icon-feat-h{font-family:var(--wd-font-display);font-weight:700;font-size:16.5px;color:var(--wd-ink);line-height:1.25}.icon-feat-p{font-size:13.5px;line-height:1.55;color:var(--wd-stone-dark);margin:0}.stat-band{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:24px;margin-top:32px;padding:28px 32px;background:var(--wd-forest-pale);border:1px solid rgba(30,58,47,.12);border-radius:var(--wd-r-lg)}.stat-cell{display:flex;flex-direction:column;gap:5px}.stat-num{font-family:var(--wd-font-display);font-weight:700;font-size:34px;line-height:1;color:var(--wd-forest)}.stat-lbl{font-family:var(--wd-font-data);font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--wd-stone-mid)}.viz-forest{margin-top:36px;padding:34px 38px;background:var(--wd-forest);border-radius:var(--wd-r-lg);color:#fff}.viz-forest-h{font-family:var(--wd-font-display);font-weight:700;font-size:22px;color:#fff;margin:0 0 8px}.viz-forest-p{color:rgba(255,255,255,.82);font-size:14px;line-height:1.6;margin:0}.flow-strip{display:flex;flex-wrap:wrap;margin-top:32px;border:1px solid var(--wd-border);border-radius:var(--wd-r-lg);overflow:hidden}.flow-step{flex:1;min-width:150px;padding:20px;background:var(--wd-cream);border-right:1px solid var(--wd-border)}.flow-step:last-child{border-right:0}.flow-step-n{font-family:var(--wd-font-data);font-size:11px;color:var(--wd-forest);letter-spacing:.08em}.flow-step-h{font-family:var(--wd-font-display);font-weight:700;font-size:15px;color:var(--wd-ink);margin:6px 0 4px}.flow-step-p{font-size:12.5px;line-height:1.5;color:var(--wd-stone-mid);margin:0}.lead-quote{margin:34px 0;padding:6px 0 6px 24px;border-left:3px solid var(--wd-forest);font-family:var(--wd-font-display);font-weight:500;font-size:21px;line-height:1.45;color:var(--wd-ink);font-style:italic}.split{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;margin-top:36px}.split-viz{background:var(--wd-cream);border:1px solid var(--wd-border);border-radius:var(--wd-r-lg);padding:24px}@media(max-width:820px){.split{grid-template-columns:1fr;gap:28px}}
/* ── Two-column hero (demo right) + global slim ── */
.hero-flex.hero-2col{display:grid;grid-template-columns:minmax(0,0.92fr) minmax(0,1.08fr);gap:52px;align-items:center;text-align:left;max-width:1180px;padding:116px 40px 60px}
.hero-2col .hero-col-text{min-width:0}
.hero-2col .hero-title{margin-bottom:18px}
.hero-2col .hero-sub{margin:0 0 26px;max-width:none;text-align:left}
.hero-2col .hero-actions{justify-content:flex-start}
.hero-2col .hero-eyebrow{margin-bottom:22px}
.hero-2col .hero-trust{margin-top:22px;align-items:flex-start}
.hero-2col .hero-col-demo{min-width:0}
.hero-2col .hero-demo-wrap{margin:0}
.hero-2col .hd-demo{max-width:none}
@media(max-width:900px){.hero-flex.hero-2col{grid-template-columns:1fr;gap:30px;text-align:center;padding:104px 24px 40px}.hero-2col .hero-sub{text-align:center;margin-left:auto;margin-right:auto}.hero-2col .hero-actions{justify-content:center}.hero-2col .hero-trust{align-items:center}}
/* Global slim: tighter section rhythm (was 72px) */
section{padding-top:52px;padding-bottom:52px}