/* =====================================================================
   DeskAgent — styles.css
   Hand-authored, static (no React/Babel). Readable + commented.
   Accent teal is exposed as a CSS custom property so colour-mix() glow
   rules stay editable in one place.
   ===================================================================== */

:root {
  /* ===== Brand accents ===== */
  --accent: #5bf0c8;          /* PRIMARY teal — all actions / CTAs (unchanged) */
  --accent-rgb: 91, 240, 200;
  --violet: #8b5cf6;          /* SECONDARY violet — bg gradients, glows, borders */
  --violet-rgb: 139, 92, 246;
  --hq-purple: #a78bfa;       /* DeskAgent HQ / owner-control layer (echoes violet) */

  /* ===== Base background ===== */
  --bg: #10121c;              /* deep indigo-charcoal (lifted from near-black #0b0f14) */
  --bg-rgb: 16, 18, 28;

  /* ===== Ambient master dials — turn these up/down ±20% to taste (0 = off) ===== */
  --ambient-violet: 0.18;     /* violet wash strength in the page background */
  --ambient-teal: 0.11;       /* teal wash strength in the page background */
  --ambient-grid: 0.03;       /* faint grid / network line strength */

  /* ===== Elevated surfaces — sit visibly ABOVE --bg, indigo-tinted ===== */
  --surface-hi: #232636;      /* card fill — top of gradient (lighter, solid) */
  --surface-lo: #191c2a;      /* card fill — bottom of gradient */
  --surface-card:       linear-gradient(180deg, var(--surface-hi) 0%, var(--surface-lo) 100%);
  --surface-card-soft:  linear-gradient(180deg, rgba(35,38,54,0.80) 0%, rgba(25,28,42,0.80) 100%);
  --surface-inset:      #1c2031;                 /* raised tiles (KPI/feature) — solid, pops off bg */
  --surface-sunken:     rgba(8,9,16,0.34);       /* sunken wells (transcript boxes) */

  /* ===== Borders — faint violet tint so panels read as distinct ===== */
  --border:        rgba(168, 156, 236, 0.12);    /* default hairline */
  --border-strong: rgba(172, 160, 240, 0.17);    /* card / panel edge */

  /* ===== Text ===== */
  --ink: #fbfcff;             /* primary text — crisp strong white */
  --ink-dim: rgba(248, 250, 255, 0.82);
  --maxw: 1320px;             /* section max width */
}

/* Ambient background wash — fixed, low-opacity, behind starfield (0) and all content.
   Driven by the --ambient-* master dials above. */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(ellipse 95% 62% at 84% 8%,  rgba(var(--violet-rgb), var(--ambient-violet)), transparent 60%),
    radial-gradient(ellipse 85% 58% at 10% 90%, rgba(var(--accent-rgb), var(--ambient-teal)),  transparent 62%),
    radial-gradient(ellipse 130% 90% at 50% 128%, rgba(var(--violet-rgb), calc(var(--ambient-violet) * 0.55)), transparent 72%);
}

/* ----------------------------------------------------------------- reset */
*, *::before, *::after { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--bg);
  overflow-x: clip;
  max-width: 100vw;
  scroll-behavior: smooth;
}

/* Anchor-link landing — leave breathing room above section heads */
[id] { scroll-margin-top: 92px; }

body {
  font-family: 'Geist', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  position: relative;
  color: var(--ink);
}

/* Belt-and-braces: stop any inner section forcing horizontal scroll */
body > div, section { max-width: 100vw; }

/* Grid children must shrink so wide intrinsic content doesn't overflow cells */
.da-grid-split > *, .da-hero-grid > *, .da-grid-2 > *, .da-grid-3 > *,
.da-grid-4 > *, .da-pilot-grid > *, .da-value-math-grid > * { min-width: 0; }

/* Mockup frames must never extend past their column */
.da-browser-frame, .da-chat-widget { max-width: 100%; }

button { font-family: inherit; }
a { color: inherit; }

/* Branded keyboard focus ring */
a:focus-visible, button:focus-visible, [tabindex]:focus-visible,
.da-btn-primary:focus-visible, .da-btn-ghost:focus-visible, .da-nav-links a:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
  border-radius: 6px;
}

/* ----------------------------------------------------------------- keyframes */
@keyframes blink { 0%, 50% { opacity: 1; } 51%, 100% { opacity: 0; } }

@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 3px color-mix(in oklch, currentColor 25%, transparent); transform: scale(1); }
  50%      { box-shadow: 0 0 0 6px color-mix(in oklch, currentColor 8%, transparent);  transform: scale(1.15); }
}

@keyframes da-marquee {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(-50%, 0, 0); }
}
.da-marquee-wrap:hover .da-marquee-track { animation-play-state: running; }

@keyframes da-reviews-marquee {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(-50%, 0, 0); }
}

/* Flow-diagram connector pulse (the little travelling dots) */
@keyframes da-flow-pulse { 0% { stroke-dashoffset: 100; } 100% { stroke-dashoffset: 0; } }

/* =====================================================================
   SHARED SECTION PRIMITIVES
   (ports of SectionWrap / SectionLabel / SectionHeading / SectionLede
   and the button styles from sections-shared.jsx)
   ===================================================================== */

.da-section {
  position: relative;
  padding: 140px 56px;
  max-width: var(--maxw);
  margin: 0 auto;
  overflow: clip;
}

/* radial accent glow that some sections place on a side */
.da-section-glow {
  position: absolute;
  top: 10%;
  height: 80%;
  width: 800px;
  background: radial-gradient(circle, color-mix(in oklch, var(--accent) 14%, transparent), transparent 55%);
  filter: blur(40px);
  pointer-events: none;
}
.da-section-glow.is-left  { left: -100px; }
.da-section-glow.is-right { right: -100px; }

.da-label {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: 'Geist Mono', ui-monospace, monospace;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent);
  padding: 11px 22px;
  background: color-mix(in oklch, var(--accent) 14%, var(--surface-lo));
  border: 1px solid color-mix(in oklch, var(--accent) 26%, transparent);
  border-radius: 999px;
  white-space: nowrap;
}
.da-label-dot {
  width: 9px; height: 9px; border-radius: 999px;
  background: var(--accent);
  box-shadow: 0 0 10px var(--accent);
  flex-shrink: 0;
}

.da-heading {
  font-family: 'Geist', system-ui;
  font-size: clamp(38px, 3.6vw, 52px);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--ink);
  margin: 18px 0 0;
  max-width: 720px;
  width: 100%;
  text-wrap: balance;
  text-transform: capitalize;   /* Title Case every section headline */
}

.da-lede {
  font-family: 'Geist', system-ui;
  font-size: 18px;
  line-height: 1.5;
  color: var(--ink-dim);
  margin: 20px 0 0;
  max-width: 580px;
  width: 100%;
  text-wrap: pretty;
  letter-spacing: -0.005em;
}

.da-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.08) 20%, rgba(255,255,255,0.08) 80%, transparent);
  margin: 0 56px;
  max-width: var(--maxw);
  margin-left: auto;
  margin-right: auto;
}

/* buttons -------------------------------------------------------------- */
.da-btn-primary {
  background: var(--accent);
  color: #0a0d12;
  border: none;
  padding: 13px 22px;
  border-radius: 10px;
  font-family: 'Geist', system-ui;
  font-size: 14.5px;
  font-weight: 600;
  letter-spacing: -0.005em;
  cursor: pointer;
  box-shadow:
    0 0 0 1px color-mix(in oklch, var(--accent) 30%, transparent),
    0 12px 28px -8px color-mix(in oklch, var(--accent) 60%, transparent),
    0 0 60px -10px color-mix(in oklch, var(--accent) 70%, transparent);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: transform 120ms ease;
  white-space: nowrap;
  text-decoration: none;
}
.da-btn-primary:hover { transform: translateY(-1px); }

.da-btn-ghost {
  background: transparent;
  color: rgba(238,242,247,0.85);
  border: 1px solid rgba(255,255,255,0.1);
  padding: 13px 18px;
  border-radius: 10px;
  font-family: 'Geist', system-ui;
  font-size: 14.5px;
  font-weight: 500;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  text-decoration: none;
}

.da-tag {
  font-family: 'Geist Mono', ui-monospace, monospace;
  font-size: 10.5px;
  color: rgba(238,242,247,0.8);
  padding: 4px 9px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 6px;
  letter-spacing: 0.01em;
}
.da-tag.is-active {
  color: var(--accent);
  background: color-mix(in oklch, var(--accent) 12%, transparent);
  border-color: color-mix(in oklch, var(--accent) 28%, transparent);
}

/* Starfield canvas + floating call button ----------------------------- */
.da-starfield {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}

.da-call-btn {
  position: fixed;
  left: 20px;
  bottom: 20px;
  z-index: 50;
  width: 56px;
  height: 56px;
  border-radius: 999px;
  background: var(--accent);
  color: #0b0f14;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  box-shadow:
    0 18px 40px -10px color-mix(in oklch, var(--accent) 55%, transparent),
    0 0 0 1px color-mix(in oklch, var(--accent) 35%, transparent),
    0 0 28px -4px color-mix(in oklch, var(--accent) 60%, transparent);
  transition: transform 160ms ease, box-shadow 160ms ease;
}
.da-call-btn:hover {
  transform: translateY(-2px) scale(1.04);
  box-shadow:
    0 22px 50px -10px color-mix(in oklch, var(--accent) 70%, transparent),
    0 0 0 1px color-mix(in oklch, var(--accent) 50%, transparent),
    0 0 36px -2px color-mix(in oklch, var(--accent) 75%, transparent);
}

/* Native lazy reveal — replaces the old React LazySection */
.da-lazy { content-visibility: auto; contain-intrinsic-size: auto 600px; }

/* =====================================================================
   NAVBAR + LOGO
   ===================================================================== */
.da-nav {
  position: sticky; top: 0; z-index: 60;
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 56px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  background: color-mix(in oklch, var(--bg) 72%, transparent);
  backdrop-filter: blur(14px) saturate(1.2);
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
}
.da-logo { display: flex; align-items: center; gap: 10px; }
.da-logo img { width: 30px; height: 30px; border-radius: 50%; display: block;
  box-shadow: 0 0 0 1px color-mix(in oklch, var(--accent) 28%, transparent), 0 6px 18px -6px color-mix(in oklch, var(--accent) 45%, transparent); }
.da-logo-word { font-family: 'Geist', system-ui; font-weight: 600; font-size: 17px; letter-spacing: -0.01em; color: var(--ink); }
.da-logo-word .accent { color: var(--accent); }
.da-logo-word .reg { color: var(--accent); font-weight: 500; font-size: 11px; vertical-align: super; margin-left: 1px; }
.da-nav-home { text-decoration: none; display: inline-flex; align-items: center; }
.da-nav-links { display: flex; align-items: center; gap: 26px; font-family: 'Geist', system-ui; font-size: 14px; color: rgba(238,242,247,0.76); }
.da-nav-links a { color: rgba(238,242,247,0.76); text-decoration: none; cursor: pointer; white-space: nowrap; }
.da-nav-cta { display: flex; align-items: center; gap: 14px; font-family: 'Geist', system-ui; font-size: 14px; }
.da-nav-cta a {
  text-decoration: none; background: rgba(255,255,255,0.06);
  border: 1px solid var(--border-strong); color: var(--ink);
  padding: 8px 14px; border-radius: 8px; font-size: 13px; font-weight: 500;
  cursor: pointer; display: inline-flex; align-items: center;
}

/* =====================================================================
   HERO
   ===================================================================== */
.da-hero {
  position: relative; min-height: 100vh; background: transparent;
  color: var(--ink); font-family: 'Geist', system-ui; overflow: hidden;
}
.da-hero-bg {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 70% 50% at 80% 18%, rgba(var(--violet-rgb), 0.20) 0%, transparent 60%),
    radial-gradient(ellipse 64% 46% at 12% 88%, rgba(var(--accent-rgb), 0.12) 0%, transparent 62%),
    radial-gradient(ellipse 90% 60% at 50% 120%, rgba(var(--violet-rgb), 0.12) 0%, transparent 70%),
    linear-gradient(180deg, rgba(16,18,28,0.55) 0%, rgba(13,15,24,0.74) 100%);
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 60%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 0%, #000 60%, transparent 100%);
}
.da-hero-grid-pattern {
  position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 56px 56px;
  -webkit-mask-image:
    linear-gradient(180deg, #000 0%, #000 30%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 9%, #000 91%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(180deg, #000 0%, #000 30%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 9%, #000 91%, transparent 100%);
  mask-composite: intersect;
}
.da-hero-grid {
  position: relative; z-index: 5; max-width: 1320px; margin: 0 auto;
  padding: 88px 56px 80px;
  display: grid; grid-template-columns: 1.05fr 1fr; gap: 80px; align-items: center;
}
.da-hero-badge {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 6px 12px 6px 6px; background: rgba(255,255,255,0.04);
  border: 1px solid var(--border); border-radius: 999px; margin-bottom: 28px;
}
.da-hero-badge .pill {
  padding: 3px 8px; background: color-mix(in oklch, var(--accent) 16%, transparent);
  border: 1px solid color-mix(in oklch, var(--accent) 30%, transparent); border-radius: 999px;
  font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; font-weight: 500;
  color: var(--accent); letter-spacing: 0.06em; text-transform: uppercase;
}
.da-hero-badge .txt { font-family: 'Geist', system-ui; font-size: 12.5px; color: rgba(238,242,247,0.8); }
.da-hero h1, .da-hero h2 {
  font-family: 'Geist', system-ui; font-size: clamp(56px, 5.4vw, 76px); font-weight: 600;
  line-height: 1.02; letter-spacing: -0.035em; margin: 0; color: var(--ink); text-wrap: balance;
}
.da-hero-sub {
  font-family: 'Geist', system-ui; font-size: 19px; line-height: 1.45;
  color: rgba(238,242,247,0.74); margin: 26px 0 0; max-width: 540px;
  text-wrap: pretty; letter-spacing: -0.005em;
}
.da-cta-row { display: flex; align-items: center; gap: 14px; margin-top: 40px; }
.da-hero-social { margin-top: 48px; display: flex; align-items: center; gap: 14px; }
.da-hero-avatars { display: flex; }
.da-hero-avatars span { width: 28px; height: 28px; border-radius: 999px; border: 2px solid #0b0f14; }
.da-hero-avatars span + span { margin-left: -8px; }
.da-hero-social p { font-family: 'Geist', system-ui; font-size: 12.5px; color: rgba(238,242,247,0.7); margin: 0; max-width: 360px; line-height: 1.5; }
.da-hero-social p b { color: var(--ink); font-weight: 400; }
.da-hero-disclaimer { font-family: 'Geist', system-ui; font-size: 11px; color: rgba(238,242,247,0.58); margin: 16px 0 0; font-style: italic; max-width: 420px; }

/* hero cards (CardStage) ---------------------------------------------- */
.da-hero-cards { position: relative; width: 100%; height: 560px; }
.da-hero-cards-glow {
  position: absolute; inset: 10% -5% 10% 5%;
  background: radial-gradient(circle at 60% 50%, color-mix(in oklch, var(--accent) 18%, transparent), transparent 65%);
  filter: blur(40px); pointer-events: none;
}
.da-hero-cards-lines { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; opacity: 0.4; }
.da-hero-card { position: absolute; }
.da-hero-card[data-card="1"] { top: 0; left: 0; width: 88%; transform: rotate(-1.2deg); z-index: 2; }
.da-hero-card[data-card="2"] { top: 230px; right: 0; width: 85%; transform: rotate(1deg); z-index: 3; }
.da-hero-card[data-card="3"] { bottom: 0; left: 8%; width: 78%; transform: rotate(-0.6deg); z-index: 4; }

.da-card {
  background: var(--surface-card);
  border: 1px solid var(--border); border-radius: 16px; padding: 18px 20px;
  backdrop-filter: blur(20px);
  box-shadow: 0 30px 60px -20px rgba(0,0,0,0.6), 0 1px 0 rgba(255,255,255,0.04) inset;
}
.da-card-row { display: flex; align-items: center; justify-content: space-between; }
.da-card-id { display: flex; align-items: center; gap: 12px; }
.da-card-ico { width: 36px; height: 36px; border-radius: 10px; background: rgba(255,255,255,0.04); border: 1px solid var(--border); display: grid; place-items: center; }
.da-card-title { font-family: 'Geist', system-ui; font-size: 13px; font-weight: 500; color: var(--ink); letter-spacing: -0.005em; }
.da-card-meta { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 11.5px; color: rgba(238,242,247,0.6); margin-top: 2px; }
.da-card-live {
  display: flex; align-items: center; gap: 7px; padding: 5px 10px;
  background: color-mix(in oklch, var(--accent) 14%, transparent);
  border: 1px solid color-mix(in oklch, var(--accent) 30%, transparent); border-radius: 999px;
}
.da-card-live .dot { width: 6px; height: 6px; border-radius: 999px; background: var(--accent); box-shadow: 0 0 0 3px color-mix(in oklch, var(--accent) 25%, transparent); animation: pulse 1.4s ease-in-out infinite; color: var(--accent); }
.da-card-live .lbl { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10.5px; font-weight: 500; color: var(--accent); letter-spacing: 0.04em; text-transform: uppercase; }
.da-transcript { margin-top: 18px; background: var(--surface-sunken); border: 1px solid rgba(255,255,255,0.05); border-radius: 12px; padding: 14px 16px; }
.da-transcript-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.da-transcript-head .lbl { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; color: rgba(238,242,247,0.6); letter-spacing: 0.08em; text-transform: uppercase; }
.da-transcript-meta { display: flex; align-items: center; gap: 10px; }
.da-transcript-time { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 11px; color: rgba(238,242,247,0.7); }
.da-transcript-body { font-family: 'Geist', system-ui; font-size: 13.5px; line-height: 1.5; color: rgba(238,242,247,0.92); min-height: 42px; }
.da-transcript-who { color: rgba(238,242,247,0.6); font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10.5px; margin-right: 8px; letter-spacing: 0.04em; }
.da-caret { display: inline-block; width: 1px; height: 14px; background: var(--accent); margin-left: 2px; margin-bottom: -2px; animation: blink 1s steps(2) infinite; vertical-align: baseline; }
.da-wave { display: flex; align-items: center; gap: 3px; height: 18px; }
.da-wave-bar { width: 2.5px; height: 9px; background: var(--accent); border-radius: 2px; opacity: 0.8; transition: height 110ms ease-out, opacity 110ms ease-out; }
.da-card-tags { margin-top: 14px; display: flex; gap: 8px; }
.da-card-tag { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10.5px; color: rgba(238,242,247,0.8); padding: 4px 9px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.06); border-radius: 6px; letter-spacing: 0.01em; }

/* chat card */
.da-card-flush { padding: 0; overflow: hidden; }
.da-chat-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 20px; border-bottom: 1px solid rgba(255,255,255,0.05); background: rgba(255,255,255,0.015); }
.da-chat-site { display: flex; align-items: center; gap: 10px; }
.da-chat-site .dot { width: 7px; height: 7px; border-radius: 999px; background: var(--accent); box-shadow: 0 0 8px var(--accent); }
.da-chat-site .name { font-family: 'Geist', system-ui; font-size: 12.5px; color: var(--ink); font-weight: 500; }
.da-chat-replied { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; color: rgba(238,242,247,0.6); letter-spacing: 0.06em; text-transform: uppercase; }
.da-chat-body { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 10px; }
.da-chat-user { align-self: flex-end; max-width: 78%; }
.da-chat-user .bubble { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.06); color: rgba(238,242,247,0.92); padding: 9px 13px; border-radius: 14px 14px 4px 14px; font-family: 'Geist', system-ui; font-size: 13px; line-height: 1.45; }
.da-chat-user .stamp { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9.5px; color: rgba(238,242,247,0.58); margin-top: 4px; text-align: right; }
.da-chat-ai { align-self: flex-start; max-width: 82%; }
.da-chat-ai .bubble { background: color-mix(in oklch, var(--accent) 12%, #0b0f14); border: 1px solid color-mix(in oklch, var(--accent) 28%, transparent); color: var(--ink); padding: 9px 13px; border-radius: 14px 14px 14px 4px; font-family: 'Geist', system-ui; font-size: 13px; line-height: 1.45; box-shadow: 0 0 24px -8px color-mix(in oklch, var(--accent) 40%, transparent); }
.da-chat-ai .stamp { display: flex; align-items: center; gap: 6px; margin-top: 4px; }
.da-chat-ai .stamp .who { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9.5px; color: var(--accent); letter-spacing: 0.04em; }
.da-chat-ai .stamp .at { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9.5px; color: rgba(238,242,247,0.58); }

/* whatsapp lead card */
.da-wa { padding: 14px 16px; display: flex; align-items: center; gap: 14px; }
.da-wa-ico { width: 40px; height: 40px; border-radius: 11px; background: color-mix(in oklch, var(--accent) 16%, #0b0f14); border: 1px solid color-mix(in oklch, var(--accent) 30%, transparent); display: grid; place-items: center; flex-shrink: 0; box-shadow: 0 0 18px -6px color-mix(in oklch, var(--accent) 50%, transparent); }
.da-wa-main { flex: 1; min-width: 0; }
.da-wa-top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.da-wa-top .name { font-family: 'Geist', system-ui; font-size: 12.5px; font-weight: 600; color: var(--ink); }
.da-wa-top .now { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; color: rgba(238,242,247,0.6); }
.da-wa-desc { font-family: 'Geist', system-ui; font-size: 12.5px; color: rgba(238,242,247,0.8); margin-top: 3px; line-height: 1.4; }
.da-wa-desc b { color: var(--ink); font-weight: 500; }
.da-wa-desc .sep { margin: 0 6px; color: rgba(238,242,247,0.58); }
.da-wa-desc .post { color: var(--accent); font-family: 'Geist Mono', ui-monospace, monospace; font-size: 11px; }
.da-wa-badge { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9.5px; color: var(--accent); padding: 3px 7px; background: color-mix(in oklch, var(--accent) 10%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 25%, transparent); border-radius: 5px; letter-spacing: 0.06em; text-transform: uppercase; flex-shrink: 0; }

/* =====================================================================
   TRUSTED-BY MARQUEE  (logo-marquee.jsx)
   ===================================================================== */
.da-marquee-wrap {
  position: relative; z-index: 5;
  border-top: 1px solid rgba(255,255,255,0.06);
  border-bottom: 1px solid rgba(255,255,255,0.04);
  padding: 26px 0; max-width: 100%; overflow: hidden;
  background: linear-gradient(180deg, transparent 0%, rgba(255,255,255,0.012) 50%, transparent 100%);
}
.da-marquee-label {
  position: absolute; top: 50%; left: 56px; transform: translateY(-50%); z-index: 3;
  display: inline-flex; align-items: center; gap: 10px; padding: 6px 12px;
  background: rgba(11,15,20,0.88); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.06); border-radius: 999px;
  font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; font-weight: 500;
  letter-spacing: 0.18em; text-transform: uppercase; color: rgba(238,242,247,0.7); white-space: nowrap;
}
.da-marquee-label .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 10px var(--accent); }
.da-marquee-fade { position: absolute; top: 0; bottom: 0; pointer-events: none; z-index: 2; }
.da-marquee-fade.is-left { left: 0; width: 220px; background: linear-gradient(90deg, #10121c 0%, rgba(16,18,28,0.95) 30%, transparent 100%); }
.da-marquee-fade.is-right { right: 0; width: 160px; background: linear-gradient(270deg, #10121c 0%, rgba(16,18,28,0.95) 30%, transparent 100%); }
.da-marquee-track {
  display: flex; align-items: center; gap: 64px; width: max-content;
  animation: da-marquee 48s linear infinite; color: rgba(238,242,247,0.78); padding-left: 200px;
}
.da-marquee-item { display: inline-flex; align-items: center; flex-shrink: 0; opacity: 0.78; transition: color 200ms ease, opacity 200ms ease; }
.da-marquee-item:hover { opacity: 1; color: var(--ink); }
.da-marquee-sep { width: 3px; height: 3px; border-radius: 50%; background: rgba(238,242,247,0.18); flex-shrink: 0; }

/* per-brand wordmarks */
.lm-row { display: inline-flex; align-items: center; }
.lm-upkeep { gap: 8px; }
.lm-upkeep .word { font-family: 'Geist', system-ui, sans-serif; font-weight: 700; font-size: 17px; letter-spacing: -0.02em; }
.lm-biowise { align-items: baseline; gap: 6px; }
.lm-biowise .word { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; font-size: 21px; letter-spacing: -0.02em; font-style: italic; }
.lm-biowise .sub { font-family: 'Geist Mono',ui-monospace,monospace; font-weight: 400; font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; opacity: 0.6; }
.lm-harmony { gap: 9px; }
.lm-harmony .glyph { display: inline-flex; gap: 3px; align-items: center; }
.lm-harmony .glyph span { border-radius: 50%; background: currentColor; }
.lm-harmony .glyph .a { width: 5px; height: 5px; opacity: 0.4; }
.lm-harmony .glyph .b { width: 7px; height: 7px; opacity: 0.7; }
.lm-harmony .w1 { font-family: 'Geist', system-ui, sans-serif; font-weight: 300; font-size: 16px; letter-spacing: 0.04em; text-transform: uppercase; }
.lm-harmony .w2 { font-family: 'Geist', system-ui, sans-serif; font-weight: 600; font-size: 16px; letter-spacing: 0.04em; text-transform: uppercase; }
.lm-eca { gap: 8px; }
.lm-eca .mark { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border: 1.5px solid currentColor; font-family: 'Geist', system-ui, sans-serif; font-size: 11px; font-weight: 900; letter-spacing: 0.02em; }
.lm-eca .word { font-family: 'Geist', system-ui, sans-serif; font-weight: 500; font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase; }
.lm-regal { gap: 10px; }
.lm-regal .word { font-family: Georgia, 'Times New Roman', serif; font-weight: 500; font-size: 22px; letter-spacing: 0.01em; }
.lm-regal .sub { font-family: 'Geist',system-ui,sans-serif; font-weight: 500; font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; opacity: 0.85; }
.lm-cozumel { gap: 9px; }
.lm-cozumel .stack { display: inline-flex; flex-direction: column; line-height: 1; }
.lm-cozumel .kicker { font-family: 'Geist Mono',ui-monospace,monospace; font-weight: 500; font-size: 9px; letter-spacing: 0.36em; text-transform: uppercase; opacity: 0.6; }
.lm-cozumel .word { font-family: 'Geist', system-ui, sans-serif; font-weight: 600; font-size: 16px; letter-spacing: -0.005em; margin-top: 3px; }

/* =====================================================================
   IMPACT (stats band)
   ===================================================================== */
.da-impact-section {
  position: relative; padding: 100px 0;
  border-top: 1px solid rgba(255,255,255,0.06);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  background:
    radial-gradient(ellipse 60% 100% at 50% 50%, color-mix(in oklch, var(--accent) 5%, transparent), transparent 70%),
    rgba(255,255,255,0.012);
}
.da-impact-inner { max-width: 1320px; margin: 0 auto; padding: 0 56px; }
.da-impact-head { text-align: center; margin-bottom: 64px; }
.da-impact-head .da-heading { width: auto; max-width: 1200px; margin: 18px auto 0; text-align: center; }
.da-impact-heading { display: block; margin: 0 auto; white-space: nowrap; }
.da-impact-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }
.da-impact-stat { padding: 20px 36px; text-align: center; }
.da-impact-stat.has-divider { border-left: 1px solid rgba(255,255,255,0.07); }
.da-impact-stat-row { display: flex; align-items: baseline; justify-content: center; gap: 10px; flex-wrap: wrap; }
.da-impact-stat-row .num { font-family: 'Geist', system-ui; font-size: clamp(64px, 6.5vw, 96px); font-weight: 600; letter-spacing: -0.045em; color: var(--ink); line-height: 0.95; }
.da-impact-stat-row .badge { display: inline-flex; align-items: center; gap: 4px; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 11px; color: var(--accent); padding: 3px 7px; background: color-mix(in oklch, var(--accent) 12%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 25%, transparent); border-radius: 5px; letter-spacing: 0.05em; }
.da-impact-stat .lbl { font-family: 'Geist', system-ui; font-size: 16px; font-weight: 500; color: var(--ink); margin-top: 18px; letter-spacing: -0.01em; }
.da-impact-stat .sub { font-family: 'Geist', system-ui; font-size: 13px; color: rgba(238,242,247,0.6); margin-top: 6px; }
.da-impact-note { margin-top: 36px; font-family: 'Geist', system-ui; font-size: 12px; color: rgba(238,242,247,0.6); font-style: italic; text-align: center; max-width: 720px; margin-left: auto; margin-right: auto; }

/* =====================================================================
   PROBLEM
   ===================================================================== */
.da-section.pad-160-140 { padding-top: 160px; padding-bottom: 140px; }
.da-prob-grid { margin-top: 64px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.da-prob-note { margin-top: 28px; font-family: 'Geist', system-ui; font-size: 12px; color: rgba(238,242,247,0.6); font-style: italic; max-width: 640px; }
.da-prob-card {
  background: var(--surface-card-soft);
  border: 1px solid rgba(255,255,255,0.06); border-radius: 18px; padding: 28px;
  display: flex; flex-direction: column; min-height: 360px;
}
.da-prob-statrow { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.da-prob-stat { font-family: 'Geist', system-ui; font-size: 64px; font-weight: 600; letter-spacing: -0.04em; color: var(--ink); line-height: 1; white-space: nowrap; }
.da-prob-tail { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 11.5px; color: rgba(238,242,247,0.6); letter-spacing: 0.04em; white-space: nowrap; }
.da-prob-title { font-family: 'Geist', system-ui; font-size: 20px; font-weight: 600; letter-spacing: -0.015em; color: var(--ink); margin: 24px 0 10px; }
.da-prob-body { font-family: 'Geist', system-ui; font-size: 14px; line-height: 1.55; color: rgba(238,242,247,0.72); margin: 0; }
.da-prob-spacer { flex: 1; }
.da-prob-mini { margin-top: 28px; padding: 14px 14px 12px; background: var(--surface-sunken); border: 1px solid rgba(255,255,255,0.05); border-radius: 12px; }
.da-prob-mini-label { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9.5px; color: rgba(238,242,247,0.6); letter-spacing: 0.1em; margin-bottom: 12px; }
/* bar mini */
.da-bar-mini { display: flex; align-items: flex-end; gap: 6px; height: 60px; }
.da-bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 5px; }
.da-bar-fill { width: 100%; background: rgba(255,255,255,0.12); border-radius: 3px; min-height: 6px; }
.da-bar-fill.is-peak { background: var(--accent); box-shadow: 0 0 12px -2px var(--accent); }
.da-bar-col span { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9px; color: rgba(238,242,247,0.6); }
/* latency mini */
.da-lat-row { display: flex; align-items: center; gap: 10px; }
.da-lat-row + .da-lat-row { margin-top: 8px; }
.da-lat-who { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; color: rgba(238,242,247,0.7); width: 88px; }
.da-lat-bar { flex: 1; height: 6px; background: rgba(255,255,255,0.06); border-radius: 3px; overflow: hidden; }
.da-lat-fill { height: 100%; background: rgba(255,255,255,0.2); border-radius: 3px; }
.da-lat-fill.is-good { background: var(--accent); box-shadow: 0 0 10px -2px var(--accent); }
.da-lat-time { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; color: rgba(238,242,247,0.7); width: 44px; text-align: right; }
.da-lat-time.is-good { color: var(--accent); }
/* breakdown mini */
.da-bd-row { display: flex; align-items: center; gap: 10px; }
.da-bd-row + .da-bd-row { margin-top: 6px; }
.da-bd-name { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; color: rgba(238,242,247,0.7); width: 70px; }
.da-bd-bar { flex: 1; height: 4px; background: rgba(255,255,255,0.06); border-radius: 2px; overflow: hidden; }
.da-bd-fill { height: 100%; background: rgba(255,255,255,0.22); border-radius: 2px; }
.da-bd-pct { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; color: rgba(238,242,247,0.6); width: 30px; text-align: right; }

/* section padding modifiers (ports of SectionWrap padTop/padBottom) */
.da-section.pad-120-120 { padding-top: 120px; padding-bottom: 120px; }
.da-section.pad-80-80 { padding-top: 80px; padding-bottom: 80px; }
.da-section.pad-60-120 { padding-top: 60px; padding-bottom: 120px; }
.da-section.pad-120-130 { padding-top: 120px; padding-bottom: 130px; }
.da-flow-lede { font-family: 'Geist', system-ui; font-size: 18px; line-height: 1.5; color: rgba(238,242,247,0.72); margin: 20px 0 0; max-width: 1040px; width: 694px; text-wrap: pretty; letter-spacing: -0.005em; }

/* =====================================================================
   REVIEWS (auto-scrolling marquee)
   ===================================================================== */
.da-reviews-marquee {
  margin-top: 56px; margin-left: -56px; margin-right: -56px; padding-bottom: 24px;
  position: relative; overflow: hidden; pointer-events: none; user-select: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 80px, #000 calc(100% - 80px), transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 80px, #000 calc(100% - 80px), transparent 100%);
}
.da-reviews-track {
  display: flex; gap: 18px; width: max-content;
  padding-left: 56px; padding-right: 56px; padding-top: 6px;
  animation: da-reviews-marquee 70s linear infinite; will-change: transform;
}
.da-review-card {
  flex: 0 0 360px; width: 360px; padding: 26px 26px 24px; border-radius: 16px;
  background: var(--surface-card);
  border: 1px solid var(--border-strong); box-shadow: 0 18px 40px -20px rgba(0,0,0,0.65);
  display: flex; flex-direction: column; position: relative;
}
.da-review-stars { display: inline-flex; gap: 3px; margin-bottom: 18px; }
.da-review-quote { font-family: 'Geist', system-ui; font-size: 16px; line-height: 1.55; letter-spacing: -0.005em; color: rgba(238,242,247,0.88); margin: 0 0 24px; text-wrap: pretty; flex: 1; }
.da-review-author { display: flex; align-items: center; gap: 12px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,0.06); }
.da-review-avatar { width: 38px; height: 38px; border-radius: 999px; background: linear-gradient(135deg, color-mix(in oklch, var(--accent) 18%, #1a2030) 0%, rgba(20,24,32,0.95) 100%); border: 1px solid var(--border-strong); display: grid; place-items: center; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 11px; font-weight: 600; letter-spacing: 0.06em; color: var(--ink); flex-shrink: 0; }
.da-review-name { font-family: 'Geist', system-ui; font-size: 14px; font-weight: 600; color: var(--ink); letter-spacing: -0.01em; }
.da-review-role { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10.5px; color: rgba(238,242,247,0.6); letter-spacing: 0.04em; margin-top: 3px; }
.da-star { fill: var(--accent); filter: drop-shadow(0 0 4px color-mix(in oklch, var(--accent) 50%, transparent)); }
.da-reviews-trust { margin-top: 32px; display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; }
.da-reviews-trust .stars { display: inline-flex; gap: 3px; }
.da-reviews-trust .txt { font-family: 'Geist', system-ui; font-size: 14.5px; color: rgba(238,242,247,0.78); letter-spacing: -0.005em; }
.da-reviews-trust .txt b { color: var(--ink); font-weight: 600; }
.da-reviews-trust .txt .sep { color: rgba(238,242,247,0.6); margin: 0 10px; }

/* =====================================================================
   HOW IT WORKS (4 steps)
   ===================================================================== */
.da-steps-grid { margin-top: 64px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; position: relative; }
.da-steps-line { position: absolute; top: 32px; left: 12%; right: 12%; height: 1px; background: linear-gradient(90deg, transparent, color-mix(in oklch, var(--accent) 30%, transparent) 10%, color-mix(in oklch, var(--accent) 30%, transparent) 90%, transparent); }
.da-step { position: relative; padding: 0 18px; }
.da-step-node { width: 64px; height: 64px; border-radius: 16px; background: var(--surface-card); border: 1px solid var(--border-strong); display: grid; place-items: center; position: relative; z-index: 1; box-shadow: 0 8px 24px -8px rgba(0,0,0,0.5); }
.da-step-num { position: absolute; top: -8px; right: -8px; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; font-weight: 500; color: var(--accent); padding: 3px 7px; background: #0b0f14; border: 1px solid color-mix(in oklch, var(--accent) 30%, transparent); border-radius: 5px; letter-spacing: 0.05em; }
.da-step-title { font-family: 'Geist', system-ui; font-size: 17px; font-weight: 600; letter-spacing: -0.015em; color: var(--ink); margin: 24px 0 8px; }
.da-step-body { font-family: 'Geist', system-ui; font-size: 13.5px; line-height: 1.5; color: rgba(238,242,247,0.7); margin: 0; max-width: 240px; }

/* =====================================================================
   FINAL CTA
   ===================================================================== */
.da-final-cta {
  position: relative; border-radius: 28px; padding: 56px 56px; overflow: hidden; text-align: center;
  background:
    radial-gradient(ellipse 80% 100% at 50% 0%, color-mix(in oklch, var(--accent) 14%, transparent), transparent 60%),
    radial-gradient(ellipse 70% 90% at 50% 110%, rgba(var(--violet-rgb), 0.16), transparent 65%),
    var(--surface-card);
  border: 1px solid var(--border-strong);
  box-shadow: 0 40px 80px -30px rgba(0,0,0,0.6), 0 0 80px -20px color-mix(in oklch, var(--accent) 18%, transparent);
}
.da-final-cta-grid {
  position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%);
  mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%);
}
.da-final-cta-inner { position: relative; z-index: 1; }
.da-final-cta h2 { text-transform: capitalize; font-family: 'Geist', system-ui; font-size: clamp(48px, 5vw, 72px); font-weight: 600; line-height: 1.02; letter-spacing: -0.035em; color: var(--ink); margin: 20px auto 0; max-width: 800px; text-wrap: balance; }
.da-final-cta-sub { font-family: 'Geist', system-ui; font-size: 19px; line-height: 1.5; color: rgba(238,242,247,0.72); margin: 22px auto 0; max-width: 560px; }
.da-btn-primary.is-lg { padding: 16px 26px; font-size: 15.5px; }
.da-trust-pills { margin-top: 32px; display: inline-flex; align-items: center; gap: 24px; padding: 10px 18px; background: var(--surface-sunken); border: 1px solid rgba(255,255,255,0.05); border-radius: 999px; max-width: 100%; flex-wrap: wrap; justify-content: center; }
.da-trust-pill { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.da-trust-pill .txt { font-family: 'Geist', system-ui; font-size: 12.5px; color: rgba(238,242,247,0.8); }
.da-trust-pill .sep { margin-left: 16px; color: rgba(255,255,255,0.1); }

/* =====================================================================
   FOOTER
   ===================================================================== */
.da-footer { border-top: 1px solid rgba(255,255,255,0.06); padding: 40px 56px 32px; max-width: 1320px; margin: 0 auto; }
.da-footer-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 40px; flex-wrap: wrap; }
.da-footer-brand { max-width: 280px; }
.da-footer-brand p { font-family: 'Geist', system-ui; font-size: 13px; line-height: 1.55; color: rgba(238,242,247,0.6); margin: 14px 0 0; }
.da-footer-cols { display: grid; grid-template-columns: repeat(3, auto); gap: 0 56px; }
.da-footer-coltitle { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10.5px; color: rgba(238,242,247,0.6); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 14px; }
.da-footer-col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 9px; }
.da-footer-col a { font-family: 'Geist', system-ui; font-size: 13px; color: rgba(238,242,247,0.8); text-decoration: none; cursor: pointer; transition: color 120ms ease; }
.da-footer-col a:hover { color: var(--ink); }
.da-footer-bottom { margin-top: 40px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,0.05); display: flex; flex-direction: column; gap: 6px; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 11px; color: rgba(238,242,247,0.6); letter-spacing: 0.04em; }
.da-footer-bottom .status { margin-top: 6px; opacity: 0.7; }

/* Reviews marquee — mobile (ported from the section's own <style> block) */
@media (max-width: 760px) {
  .da-reviews-marquee {
    margin-left: -20px !important; margin-right: -20px !important;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%) !important;
    mask-image: linear-gradient(90deg, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%) !important;
  }
  .da-reviews-track { padding-left: 20px !important; padding-right: 20px !important; animation-duration: 55s !important; }
}
@media (prefers-reduced-motion: reduce) { .da-reviews-track { animation: none !important; } }

/* =====================================================================
   SPLIT-LAYOUT BASE (founder, HQ, agent sections)
   ===================================================================== */
.da-grid-split { display: grid; align-items: center; width: 100%; }

/* =====================================================================
   ABOUT FOUNDER
   ===================================================================== */
.da-founder-grid { grid-template-columns: minmax(380px, 460px) 1fr; gap: 72px; margin-top: 72px; }
.da-founder-photos { position: relative; aspect-ratio: 1 / 1.18; max-width: 460px; width: 100%; }
.da-founder-photos .glow { position: absolute; inset: -8% -6% -6% -8%; background: radial-gradient(ellipse 60% 50% at 30% 80%, color-mix(in oklch, var(--accent) 22%, transparent), transparent 65%); filter: blur(20px); pointer-events: none; z-index: 0; }
.da-founder-portrait { position: absolute; top: 0; right: 0; width: 78%; aspect-ratio: 941 / 1378; border-radius: 18px; overflow: hidden; border: 1px solid rgba(255,255,255,0.1); box-shadow: 0 30px 70px -25px rgba(0,0,0,0.7), 0 0 0 1px rgba(255,255,255,0.04); transform: rotate(1.2deg); z-index: 2; background: #0b0f14; }
.da-founder-portrait img { width: 100%; height: 100%; object-fit: cover; display: block; }
.da-founder-tag { position: absolute; top: 12px; right: 12px; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; font-weight: 500; color: var(--accent); padding: 4px 8px; background: rgba(11,15,20,0.7); backdrop-filter: blur(8px); border: 1px solid color-mix(in oklch, var(--accent) 36%, transparent); border-radius: 6px; letter-spacing: 0.06em; display: inline-flex; align-items: center; gap: 6px; }
.da-founder-tag .dot { width: 6px; height: 6px; border-radius: 999px; background: var(--accent); box-shadow: 0 0 6px var(--accent); }
.da-founder-working { position: absolute; bottom: -18px; left: 0; width: 50%; aspect-ratio: 1122 / 1312; border-radius: 14px; overflow: hidden; border: 1px solid rgba(255,255,255,0.1); box-shadow: 0 24px 50px -18px rgba(0,0,0,0.75), 0 0 0 1px rgba(255,255,255,0.04); transform: rotate(-2.4deg); z-index: 3; background: #0b0f14; }
.da-founder-working img { width: 100%; height: 100%; object-fit: cover; display: block; }
.da-founder-caption { position: absolute; left: 0; right: 0; bottom: 0; padding: 24px 12px 10px; background: linear-gradient(to top, rgba(11,15,20,0.85) 0%, transparent 100%); font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9.5px; letter-spacing: 0.1em; color: rgba(238,242,247,0.85); text-transform: uppercase; }
.da-founder-name { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent); margin-bottom: 14px; }
.da-founder-h3 { font-family: 'Geist', system-ui; font-size: clamp(28px, 2.6vw, 36px); font-weight: 600; letter-spacing: -0.025em; line-height: 1.1; color: var(--ink); margin: 0 0 18px; text-wrap: balance; }
.da-founder-bio { font-family: 'Geist', system-ui; font-size: 17px; line-height: 1.55; color: rgba(238,242,247,0.82); text-wrap: pretty; max-width: 580px; }
.da-founder-bio p { margin: 0 0 14px; }
.da-founder-bio p:last-child { margin: 0; }
.da-founder-chips { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 8px; }
.da-founder-link { margin-top: 32px; font-size: 14px; }
@media (max-width: 900px) {
  .da-founder-grid { gap: 56px !important; margin-top: 48px !important; }
  .da-founder-grid > .da-founder-photos { margin: 0 auto 28px; }
}
@media (max-width: 760px) {
  .da-founder-grid { gap: 40px !important; margin-top: 36px !important; }
  .da-founder-grid > .da-founder-photos { max-width: 360px !important; margin: 0 auto 24px; }
  .da-founder-grid .da-founder-h3 { font-size: 26px !important; }
}
@media (max-width: 420px) {
  .da-founder-grid > .da-founder-photos { max-width: 300px !important; }
}

/* =====================================================================
   DESKAGENT HQ
   ===================================================================== */
.da-hq-grid { grid-template-columns: 1fr 1.05fr; gap: 80px; }
.da-hq-feats { margin-top: 36px; display: grid; grid-template-columns: 1fr; gap: 14px; }
.da-hq-feat { padding: 18px; background: var(--surface-inset); border: 1px solid var(--border-strong); border-radius: 12px; box-shadow: 0 10px 26px -16px rgba(0,0,0,0.7), 0 1px 0 rgba(255,255,255,0.04) inset; display: flex; gap: 14px; align-items: flex-start; }
.da-hq-feat .num { flex-shrink: 0; width: 28px; height: 28px; border-radius: 8px; background: color-mix(in oklch, var(--accent) 14%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 28%, transparent); color: var(--accent); display: grid; place-items: center; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 11px; font-weight: 600; }
.da-hq-feat .t { font-family: 'Geist', system-ui; font-size: 15px; font-weight: 600; color: var(--ink); letter-spacing: -0.01em; }
.da-hq-feat .d { font-family: 'Geist', system-ui; font-size: 13px; line-height: 1.5; color: rgba(238,242,247,0.72); margin-top: 5px; }
.da-hq-included { margin-top: 26px; display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px; background: color-mix(in oklch, var(--accent) 10%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 25%, transparent); border-radius: 999px; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 11px; font-weight: 500; color: var(--accent); letter-spacing: 0.08em; text-transform: uppercase; }
.da-hq-included .dot { width: 6px; height: 6px; border-radius: 999px; background: var(--accent); box-shadow: 0 0 8px var(--accent); }
/* phone mock */
.da-hq-mock { border-radius: 22px; overflow: hidden; border: 1px solid var(--border); background: #111b21; box-shadow: 0 30px 60px -20px rgba(0,0,0,0.6); }
.da-hq-mock-head { padding: 12px 14px; background: #202c33; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid rgba(255,255,255,0.04); }
.da-hq-mock-avatar { width: 36px; height: 36px; border-radius: 999px; background: #0b141a; border: 1.5px solid color-mix(in oklch, var(--accent) 50%, transparent); display: grid; place-items: center; font-family: 'Geist', system-ui; font-size: 13px; font-weight: 700; color: var(--accent); letter-spacing: -0.02em; }
.da-hq-mock-head .meta { flex: 1; min-width: 0; }
.da-hq-mock-head .name { font-family: 'Geist', system-ui; font-size: 13.5px; font-weight: 600; color: #e9edef; }
.da-hq-mock-head .sub { font-family: 'Geist', system-ui; font-size: 11px; color: #8696a0; margin-top: 1px; }
.da-hq-auth { display: inline-flex; align-items: center; gap: 6px; padding: 4px 9px; background: color-mix(in oklch, var(--accent) 14%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 30%, transparent); border-radius: 999px; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9px; font-weight: 500; color: var(--accent); letter-spacing: 0.08em; text-transform: uppercase; }
.da-hq-auth .dot { width: 4px; height: 4px; border-radius: 999px; background: var(--accent); }
.da-hq-mock-body { padding: 18px 14px; background: #0b141a; background-image: radial-gradient(rgba(255,255,255,0.012) 1px, transparent 1px); background-size: 14px 14px; display: flex; flex-direction: column; gap: 8px; }
.da-hq-bubble { max-width: 85%; padding: 7px 11px 4px; color: #e9edef; box-shadow: 0 1px 0 rgba(0,0,0,0.13); font-family: 'Geist', system-ui; font-size: 12.5px; line-height: 1.4; }
.da-hq-bubble.out { align-self: flex-end; background: #005c4b; border-radius: 12px 4px 12px 12px; }
.da-hq-bubble.in { align-self: flex-start; background: #202c33; border-radius: 4px 12px 12px 12px; }
.da-hq-bubble .check { color: var(--accent); margin-right: 4px; }
.da-hq-bubble .time { font-size: 10px; color: rgba(255,255,255,0.45); text-align: right; margin-top: 2px; }
.da-hq-card { align-self: flex-start; max-width: 92%; background: #202c33; border: 1px solid color-mix(in oklch, var(--accent) 18%, transparent); border-radius: 10px; padding: 11px; margin-top: 2px; }
.da-hq-card-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.da-hq-card-head .applied { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9px; color: var(--accent); letter-spacing: 0.1em; text-transform: uppercase; }
.da-hq-card-head .ms { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9px; color: rgba(255,255,255,0.4); }
.da-hq-card-rows { display: grid; gap: 5px; }
.da-hq-row { display: flex; align-items: center; justify-content: space-between; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; }
.da-hq-row .ch { color: rgba(255,255,255,0.7); }
.da-hq-row .st { color: var(--accent); display: flex; align-items: center; gap: 5px; }
.da-hq-chip { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; margin-top: 2px; padding: 6px 10px; background: #202c33; border: 1px solid rgba(255,255,255,0.05); border-radius: 999px; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; color: rgba(255,255,255,0.7); }
.da-hq-chip .v { color: var(--accent); }
.da-hq-chip .x { color: rgba(255,255,255,0.2); }
.da-hq-mock-foot { padding: 10px 14px; background: #202c33; display: flex; align-items: center; gap: 10px; }
.da-hq-mock-foot .field { flex: 1; padding: 8px 14px; background: #202c33; border-radius: 999px; font-family: 'Geist', system-ui; font-size: 12.5px; color: #8696a0; border: 1px solid rgba(255,255,255,0.04); }
.da-hq-mock-foot .send { width: 34px; height: 34px; border-radius: 999px; background: var(--accent); display: grid; place-items: center; box-shadow: 0 0 14px -2px var(--accent); }

/* =====================================================================
   WHATSAPP AGENT
   ===================================================================== */
.da-wa-grid { grid-template-columns: 1.05fr 1fr; gap: 80px; }
.da-wa-mockwrap { display: grid; gap: 14px; }
.da-wa-phone { border-radius: 22px; overflow: hidden; border: 1px solid var(--border); background: #111b21; box-shadow: 0 30px 60px -20px rgba(0,0,0,0.6); }
.da-wa-head { padding: 12px 14px; background: #202c33; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid rgba(255,255,255,0.04); }
.da-wa-head img { width: 36px; height: 36px; border-radius: 50%; display: block; flex-shrink: 0; }
.da-wa-head .meta { flex: 1; min-width: 0; }
.da-wa-head .name { font-family: 'Geist', system-ui; font-size: 13.5px; font-weight: 600; color: #e9edef; }
.da-wa-head .sub { font-family: 'Geist', system-ui; font-size: 11px; color: #8696a0; margin-top: 1px; }
.da-wa-body { padding: 18px 14px; background: #0b141a; background-image: radial-gradient(rgba(255,255,255,0.012) 1px, transparent 1px); background-size: 14px 14px; display: flex; flex-direction: column; gap: 8px; min-height: 360px; }
.da-wa-bubble { max-width: 82%; padding: 7px 11px 4px; color: #e9edef; box-shadow: 0 1px 0 rgba(0,0,0,0.13); font-family: 'Geist', system-ui; font-size: 12.5px; line-height: 1.4; }
.da-wa-bubble.in { align-self: flex-start; background: #202c33; border-radius: 4px 12px 12px 12px; }
.da-wa-bubble.out { align-self: flex-end; background: #005c4b; border-radius: 12px 4px 12px 12px; }
.da-wa-bubble .time { font-size: 10px; color: rgba(255,255,255,0.45); text-align: right; margin-top: 2px; }
.da-wa-foot { padding: 10px 14px; background: #202c33; display: flex; align-items: center; gap: 10px; }
.da-wa-foot .field { flex: 1; padding: 8px 14px; background: #202c33; border-radius: 999px; font-family: 'Geist', system-ui; font-size: 12.5px; color: #8696a0; }
.da-wa-foot .send { width: 34px; height: 34px; border-radius: 999px; background: #25d366; display: grid; place-items: center; }
.da-wa-lead { background: var(--surface-card); border: 1px solid var(--border); border-radius: 16px; padding: 18px; }
.da-wa-lead-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.da-wa-lead-head .id { display: flex; align-items: center; gap: 8px; }
.da-wa-lead-head .dot { width: 6px; height: 6px; border-radius: 999px; background: var(--accent); box-shadow: 0 0 8px var(--accent); }
.da-wa-lead-head .lbl { font-family: 'Geist', system-ui; font-size: 13px; font-weight: 600; color: var(--ink); }
.da-wa-lead-head .ref { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; color: rgba(238,242,247,0.6); }
.da-wa-lead-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.da-wa-sumlabel { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9.5px; color: rgba(238,242,247,0.6); letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 4px; }
.da-wa-sumval { font-family: 'Geist', system-ui; font-size: 12.5px; font-weight: 500; color: var(--ink); }
.da-wa-sumval.is-hi { color: var(--accent); }
.da-wa-kpi { padding: 18px; background: var(--surface-inset); border: 1px solid var(--border-strong); border-radius: 12px; box-shadow: 0 10px 26px -16px rgba(0,0,0,0.7), 0 1px 0 rgba(255,255,255,0.04) inset; }
.da-wa-kpi .ico { font-size: 20px; margin-bottom: 8px; }
.da-wa-kpi .t { font-family: 'Geist', system-ui; font-size: 14.5px; font-weight: 600; color: var(--ink); letter-spacing: -0.01em; }
.da-wa-kpi .d { font-family: 'Geist', system-ui; font-size: 12.5px; line-height: 1.5; color: rgba(238,242,247,0.7); margin-top: 6px; }
.da-wa-cta { margin-top: 36px; display: flex; align-items: center; gap: 14px; }
.da-wa-cta .note { font-family: 'Geist', system-ui; font-size: 12.5px; color: rgba(238,242,247,0.7); }

/* =====================================================================
   INBOX AGENT
   ===================================================================== */
.da-inbox-grid { grid-template-columns: 1.15fr 1fr; gap: 80px; }
.da-inbox-cta { margin-top: 36px; display: flex; align-items: center; gap: 14px; }
.da-inbox-cta .note { font-family: 'Geist', system-ui; font-size: 12.5px; color: rgba(238,242,247,0.7); }
.da-inbox-frame { display: grid; gap: 14px; }
.da-inbox-client { background: var(--surface-card); border: 1px solid var(--border-strong); border-radius: 18px; overflow: hidden; box-shadow: 0 30px 60px -20px rgba(0,0,0,0.6); }
.da-inbox-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; border-bottom: 1px solid rgba(255,255,255,0.06); }
.da-inbox-toolbar .id { display: flex; align-items: center; gap: 12px; min-width: 0; }
.da-inbox-ico { width: 38px; height: 38px; border-radius: 10px; background: color-mix(in oklch, var(--accent) 13%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 22%, transparent); display: grid; place-items: center; flex-shrink: 0; }
.da-inbox-toolbar .meta { min-width: 0; }
.da-inbox-toolbar .meta .name { font-family: 'Geist', system-ui; font-size: 14px; font-weight: 600; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.da-inbox-toolbar .meta .sub { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10.5px; color: rgba(238,242,247,0.6); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.da-inbox-status { display: flex; align-items: center; gap: 8px; padding: 5px 11px; background: color-mix(in oklch, var(--accent) 14%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 30%, transparent); border-radius: 999px; flex-shrink: 0; }
.da-inbox-status .dot { width: 6px; height: 6px; border-radius: 999px; background: var(--accent); box-shadow: 0 0 8px var(--accent); animation: pulse 1.4s ease-in-out infinite; }
.da-inbox-status .lbl { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10.5px; font-weight: 500; color: var(--accent); letter-spacing: 0.04em; text-transform: uppercase; }
.da-inbox-list { display: flex; flex-direction: column; }
.da-inbox-mail { display: flex; align-items: stretch; gap: 12px; padding: 16px 18px; border-bottom: 1px solid rgba(255,255,255,0.04); }
.da-inbox-mail:last-child { border-bottom: none; }
.da-inbox-mail.is-filtered { opacity: 0.5; }
.da-inbox-rail { width: 3px; border-radius: 999px; background: rgba(255,255,255,0.12); flex-shrink: 0; }
.da-inbox-mail.is-lead .da-inbox-rail { background: var(--accent); box-shadow: 0 0 8px var(--accent); }
.da-inbox-mail.is-escalated .da-inbox-rail { background: #ff8a5b; box-shadow: 0 0 8px rgba(255,138,91,0.6); }
.da-inbox-mailmain { flex: 1; min-width: 0; }
.da-inbox-mailtop { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.da-inbox-from { font-family: 'Geist', system-ui; font-size: 13px; font-weight: 600; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.da-inbox-when { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; color: rgba(238,242,247,0.6); flex-shrink: 0; }
.da-inbox-subj { font-family: 'Geist', system-ui; font-size: 12.5px; color: rgba(238,242,247,0.82); margin-top: 3px; line-height: 1.4; text-wrap: pretty; }
.da-inbox-act { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; letter-spacing: 0.03em; margin-top: 8px; display: inline-flex; align-items: center; gap: 7px; color: rgba(238,242,247,0.6); }
.da-inbox-act .da-inbox-actdot { width: 4px; height: 4px; border-radius: 999px; background: currentColor; flex-shrink: 0; }
.da-inbox-mail.is-lead .da-inbox-act { color: var(--accent); }
.da-inbox-mail.is-escalated .da-inbox-act { color: #ff8a5b; }
.da-inbox-tag { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9px; font-weight: 600; letter-spacing: 0.08em; padding: 3px 7px; border-radius: 5px; flex-shrink: 0; align-self: flex-start; }
.da-inbox-tag.is-lead { color: var(--accent); background: color-mix(in oklch, var(--accent) 12%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 28%, transparent); }
.da-inbox-tag.is-filtered { color: rgba(238,242,247,0.6); background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1); }
.da-inbox-tag.is-escalated { color: #ff8a5b; background: rgba(255,138,91,0.1); border: 1px solid rgba(255,138,91,0.28); }

/* =====================================================================
   PHONE AGENT
   ===================================================================== */
.da-phone-grid { grid-template-columns: 1fr 1.05fr; gap: 80px; }
.da-phone-kpi { padding: 18px; background: var(--surface-inset); border: 1px solid var(--border-strong); border-radius: 12px; box-shadow: 0 10px 26px -16px rgba(0,0,0,0.7), 0 1px 0 rgba(255,255,255,0.04) inset; }
.da-phone-kpi .kpi { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; color: var(--accent); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 10px; }
.da-phone-kpi .t { font-family: 'Geist', system-ui; font-size: 14.5px; font-weight: 600; color: var(--ink); letter-spacing: -0.01em; }
.da-phone-kpi .d { font-family: 'Geist', system-ui; font-size: 12.5px; line-height: 1.5; color: rgba(238,242,247,0.7); margin-top: 6px; }
.da-phone-cta { margin-top: 36px; display: flex; align-items: center; gap: 14px; }
.da-phone-cta .note { font-family: 'Geist', system-ui; font-size: 12.5px; color: rgba(238,242,247,0.7); }
.da-phone-frame { display: grid; gap: 14px; }
.da-phone-call { background: var(--surface-card); border: 1px solid var(--border-strong); border-radius: 18px; padding: 22px; box-shadow: 0 30px 60px -20px rgba(0,0,0,0.6); position: relative; }
.da-phone-call .glow { position: absolute; inset: -1px; border-radius: 18px; background: linear-gradient(180deg, color-mix(in oklch, var(--accent) 18%, transparent), transparent 30%); pointer-events: none; z-index: 0; }
.da-phone-call .inner { position: relative; z-index: 1; }
.da-phone-callhead { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.da-phone-caller { display: flex; align-items: center; gap: 12px; }
.da-phone-avatar { width: 38px; height: 38px; border-radius: 999px; background: linear-gradient(135deg, #2a2f38, #1a1f28); display: grid; place-items: center; font-family: 'Geist', system-ui; font-size: 13px; font-weight: 600; color: var(--ink); }
.da-phone-caller .name { font-family: 'Geist', system-ui; font-size: 14px; font-weight: 600; color: var(--ink); }
.da-phone-caller .num { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 11px; color: rgba(238,242,247,0.6); margin-top: 2px; }
.da-phone-status { display: flex; align-items: center; gap: 8px; padding: 5px 11px; background: color-mix(in oklch, var(--accent) 14%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 30%, transparent); border-radius: 999px; }
.da-phone-status .dot { width: 6px; height: 6px; border-radius: 999px; background: var(--accent); box-shadow: 0 0 8px var(--accent); }
.da-phone-status .lbl { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10.5px; font-weight: 500; color: var(--accent); letter-spacing: 0.04em; text-transform: uppercase; }
.da-phone-tbox { background: var(--surface-sunken); border: 1px solid rgba(255,255,255,0.05); border-radius: 12px; padding: 14px 16px; }
.da-phone-thead { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.da-phone-thead .lbl { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9.5px; color: rgba(238,242,247,0.6); letter-spacing: 0.1em; text-transform: uppercase; }
.da-phone-tlines { display: grid; gap: 10px; }
.da-tline { font-family: 'Geist', system-ui; font-size: 13px; line-height: 1.5; color: rgba(238,242,247,0.78); }
.da-tline.is-hi { color: var(--ink); }
.da-tline .who { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; letter-spacing: 0.06em; margin-right: 8px; }
.da-tline .who.caller { color: rgba(238,242,247,0.7); }
.da-tline .who.agent { color: var(--accent); }
.da-phone-sum { background: var(--surface-card); border: 1px solid var(--border); border-radius: 16px; padding: 18px; }
.da-phone-sumhead { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.da-phone-sumhead .id { display: flex; align-items: center; gap: 8px; }
.da-phone-sumhead .dot { width: 6px; height: 6px; border-radius: 999px; background: var(--accent); animation: pulse 1.4s ease-in-out infinite; color: var(--accent); }
.da-phone-sumhead .lbl { font-family: 'Geist', system-ui; font-size: 13px; font-weight: 600; color: var(--ink); }
.da-phone-sumhead .ref { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; color: rgba(238,242,247,0.6); }
.da-phone-sumgrid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.da-sumrow .lbl { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9.5px; color: rgba(238,242,247,0.6); letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 4px; }
.da-sumrow .val-row { display: flex; align-items: center; gap: 8px; }
.da-sumrow .val { font-family: 'Geist', system-ui; font-size: 12.5px; font-weight: 500; color: var(--ink); }
.da-sumrow .val.is-hi { color: var(--accent); }
.da-sum-badge { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9px; color: #ff8a5b; padding: 2px 6px; background: rgba(255,138,91,0.1); border: 1px solid rgba(255,138,91,0.25); border-radius: 4px; letter-spacing: 0.06em; text-transform: uppercase; }
.da-phone-sumfoot { margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,0.05); display: flex; align-items: center; justify-content: space-between; }
.da-phone-sumfoot .route { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; color: rgba(238,242,247,0.6); letter-spacing: 0.05em; }
.da-phone-sumfoot .synced { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; color: var(--accent); }

/* =====================================================================
   WEB AGENT
   ===================================================================== */
.da-web-grid { grid-template-columns: 1.05fr 1fr; gap: 80px; }
.da-web-checklist { margin-top: 36px; padding: 0; list-style: none; display: grid; gap: 14px; }
.da-web-checklist li { display: flex; align-items: flex-start; gap: 12px; }
.da-web-check { margin-top: 6px; width: 16px; height: 16px; border-radius: 999px; border: 1px solid color-mix(in oklch, var(--accent) 35%, transparent); background: color-mix(in oklch, var(--accent) 14%, transparent); display: grid; place-items: center; flex-shrink: 0; }
.da-web-checklist .txt { flex: 1; min-width: 0; font-family: 'Geist', system-ui; font-size: 15.5px; line-height: 1.5; color: rgba(238,242,247,0.85); }
.da-web-cta { margin-top: 36px; display: flex; align-items: center; gap: 18px; }
.da-web-cta .note { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 11px; color: rgba(238,242,247,0.6); letter-spacing: 0.06em; text-transform: uppercase; }
/* browser frame */
.da-browser-frame { position: relative; border-radius: 18px; overflow: hidden; border: 1px solid var(--border); background: linear-gradient(180deg, #1a1f28 0%, #14181f 100%); box-shadow: 0 40px 80px -30px rgba(0,0,0,0.7); }
.da-browser-chrome { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-bottom: 1px solid rgba(255,255,255,0.05); background: rgba(255,255,255,0.015); }
.da-browser-dots { display: flex; gap: 6px; }
.da-browser-dots span { width: 10px; height: 10px; border-radius: 999px; background: #3b3f46; }
.da-browser-url { flex: 1; height: 22px; background: var(--surface-sunken); border: 1px solid rgba(255,255,255,0.05); border-radius: 6px; display: flex; align-items: center; justify-content: center; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10.5px; color: rgba(238,242,247,0.6); letter-spacing: 0.02em; }
.da-browser-url .lock { margin-right: 6px; color: rgba(238,242,247,0.58); }
/* faux site */
.da-web-site { position: relative; padding: 28px; min-height: 460px; background: #fafaf7; }
.da-web-sitehead { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; }
.da-web-brand { display: flex; align-items: center; gap: 8px; }
.da-web-brand .sq { width: 22px; height: 22px; border-radius: 5px; background: #1a4d2e; }
.da-web-brand .nm { font-family: 'Geist', system-ui; font-weight: 700; font-size: 14px; color: #1a1f28; letter-spacing: -0.01em; }
.da-web-nav { display: flex; gap: 18px; font-family: 'Geist', system-ui; font-size: 11.5px; color: #5a5f68; align-items: center; }
.da-web-nav .quote { background: #1a4d2e; color: #fff; padding: 4px 10px; border-radius: 5px; font-weight: 500; }
.da-web-herotitle { font-family: 'Geist', system-ui; font-weight: 600; font-size: 24px; color: #1a1f28; letter-spacing: -0.025em; line-height: 1.1; max-width: 320px; }
.da-web-herosub { font-family: 'Geist', system-ui; font-size: 12.5px; color: #5a5f68; margin-top: 8px; max-width: 340px; line-height: 1.5; }
.da-web-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 16px 0; }
.da-web-card { padding: 12px; border-radius: 8px; background: #fff; border: 1px solid #e7e7e0; }
.da-web-card .ph { width: 100%; height: 40px; background: repeating-linear-gradient(135deg, #f1f1ec, #f1f1ec 6px, #e9e9e2 6px, #e9e9e2 12px); border-radius: 4px; margin-bottom: 8px; }
.da-web-card .nm { font-family: 'Geist', system-ui; font-size: 11px; font-weight: 600; color: #1a1f28; }
.da-web-card .pr { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9px; color: #8a8f96; margin-top: 2px; }
.da-web-bars { display: flex; gap: 8px; }
.da-web-bars span { flex: 1; height: 8px; background: #e7e7e0; border-radius: 4px; }
/* chat widget */
.da-chat-widget { position: absolute; right: 22px; bottom: 22px; width: 340px; height: 440px; background: linear-gradient(180deg, rgba(20,24,32,0.98), rgba(15,18,24,0.98)); border: 1px solid var(--border-strong); border-radius: 18px; overflow: hidden; box-shadow: 0 30px 60px -20px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.02); backdrop-filter: blur(20px); display: flex; flex-direction: column; pointer-events: none; user-select: none; }
.da-cw-head { padding: 12px 14px; background: linear-gradient(180deg, color-mix(in oklch, var(--accent) 14%, #0b0f14), color-mix(in oklch, var(--accent) 6%, #0b0f14)); border-bottom: 1px solid color-mix(in oklch, var(--accent) 18%, transparent); display: flex; align-items: center; justify-content: space-between; }
.da-cw-head .id { display: flex; align-items: center; gap: 9px; }
.da-cw-avatar { width: 24px; height: 24px; border-radius: 999px; background: #0b0f14; border: 1px solid color-mix(in oklch, var(--accent) 40%, transparent); display: grid; place-items: center; font-family: 'Geist', system-ui; font-size: 11px; font-weight: 700; color: var(--accent); letter-spacing: -0.02em; }
.da-cw-head .nm { font-family: 'Geist', system-ui; font-size: 13px; font-weight: 600; color: var(--ink); letter-spacing: -0.005em; }
.da-cw-head .icons { display: flex; align-items: center; gap: 10px; color: rgba(238,242,247,0.72); }
.da-cw-greet { padding: 14px 16px 8px; }
.da-cw-greetbubble { background: rgba(255,255,255,0.05); color: var(--ink); padding: 7px 12px; border-radius: 12px 12px 12px 4px; font-family: 'Geist', system-ui; font-size: 12px; line-height: 1.35; width: fit-content; max-width: 90%; }
.da-cw-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.da-cw-chip { font-family: 'Geist', system-ui; font-size: 11px; font-weight: 500; color: var(--accent); padding: 5px 10px; background: color-mix(in oklch, var(--accent) 8%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 25%, transparent); border-radius: 999px; white-space: nowrap; }
.da-cw-convo { padding: 4px 16px 10px; display: flex; flex-direction: column; gap: 7px; flex: 1; min-height: 0; overflow-y: auto; }
.da-cw-user { align-self: flex-end; max-width: 85%; }
.da-cw-user .bubble { background: color-mix(in oklch, var(--accent) 14%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 22%, transparent); color: var(--ink); padding: 8px 12px; border-radius: 14px 14px 4px 14px; font-family: 'Geist', system-ui; font-size: 12.5px; line-height: 1.4; }
.da-cw-ai { align-self: flex-start; max-width: 92%; }
.da-cw-ai .bubble { background: rgba(255,255,255,0.05); color: var(--ink); padding: 9px 13px; border-radius: 14px 14px 14px 4px; font-family: 'Geist', system-ui; font-size: 12.5px; line-height: 1.45; }
.da-cw-ai .da-caret { height: 11px; }
.da-cw-capture { margin-top: 4px; padding: 10px 12px; background: rgba(255,255,255,0.03); border: 1px dashed color-mix(in oklch, var(--accent) 25%, transparent); border-radius: 12px; }
.da-cw-capture .head { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9px; color: var(--accent); letter-spacing: 0.08em; margin-bottom: 8px; }
.da-cw-fields { display: grid; gap: 6px; }
.da-cw-field { display: flex; align-items: center; gap: 8px; }
.da-cw-field .lbl { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9.5px; color: rgba(238,242,247,0.6); width: 56px; }
.da-cw-field .val { flex: 1; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10.5px; color: rgba(238,242,247,0.6); padding: 3px 7px; background: var(--surface-sunken); border: 1px solid rgba(255,255,255,0.05); border-radius: 4px; }
.da-cw-field .val.done { color: var(--ink); }
.da-cw-field .val.active { border-color: color-mix(in oklch, var(--accent) 30%, transparent); }
.da-cw-composer { padding: 8px 14px 12px; margin-top: auto; }
.da-cw-composer .pill { display: flex; align-items: center; gap: 8px; padding: 8px 8px 8px 14px; background: var(--surface-sunken); border: 1px solid var(--border-strong); border-radius: 999px; }
.da-cw-composer .pill span { flex: 1; font-family: 'Geist', system-ui; font-size: 12px; color: rgba(238,242,247,0.6); }
.da-cw-composer .send { width: 26px; height: 26px; border-radius: 999px; background: var(--accent); display: grid; place-items: center; box-shadow: 0 0 12px -2px var(--accent); }

/* =====================================================================
   VALUE MATH (the live ValueMathSection, nested inside pricing)
   ===================================================================== */
.da-vm { position: relative; margin: 72px 0; border-radius: 24px; background: linear-gradient(180deg, rgba(20,24,32,0.55) 0%, rgba(15,19,26,0.55) 100%); border: 1px solid rgba(255,255,255,0.06); overflow: hidden; padding: clamp(28px, 4vw, 46px) clamp(22px, 4vw, 46px); }
.da-vm-noise { position: absolute; inset: 0; background-image: radial-gradient(rgba(255,255,255,0.025) 1px, transparent 1px); background-size: 3px 3px; opacity: 0.5; pointer-events: none; mix-blend-mode: overlay; }
.da-vm-glow { position: absolute; top: 15%; left: -160px; width: 520px; height: 520px; background: radial-gradient(circle, color-mix(in oklch, var(--accent) 12%, transparent), transparent 65%); filter: blur(60px); pointer-events: none; }
.da-value-math-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 48px); align-items: stretch; }
.da-vm-h2 { font-family: 'Geist', system-ui; font-weight: 600; letter-spacing: -0.03em; line-height: 1.05; color: var(--ink); margin: 0 0 24px; text-wrap: balance; font-size: clamp(28px, 4.4vw, 37px); }
.da-vm-h2 .accent { color: var(--accent); }
.da-vm-lead { font-family: 'Geist', system-ui; font-size: clamp(15px, 1.6vw, 18px); line-height: 1.55; color: rgba(238,242,247,0.74); margin: 0 0 28px; text-wrap: pretty; }
.da-vm-lead b { color: var(--ink); font-weight: 600; }
.da-vm-pills { display: flex; flex-wrap: wrap; gap: 10px; }
.da-vm-pill { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 12.5px; color: rgba(238,242,247,0.85); padding: 8px 13px; background: rgba(255,255,255,0.025); border: 1px solid rgba(255,255,255,0.09); border-radius: 7px; letter-spacing: 0.01em; display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.da-vm-pill .x { color: var(--accent); font-weight: 600; }
.da-vm-callout { margin-top: 28px; padding: 20px 22px; background: color-mix(in oklch, var(--accent) 7%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 32%, transparent); border-radius: 14px; display: flex; align-items: flex-start; gap: 16px; }
.da-vm-callout .ico { flex-shrink: 0; width: 36px; height: 36px; border-radius: 9px; background: color-mix(in oklch, var(--accent) 16%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 40%, transparent); display: grid; place-items: center; font-family: 'Geist', system-ui; font-size: 16px; font-weight: 600; color: var(--accent); margin-top: 2px; }
.da-vm-callout .txt { font-family: 'Geist', system-ui; font-size: clamp(14.5px, 1.5vw, 16px); line-height: 1.55; color: rgba(238,242,247,0.88); text-wrap: pretty; min-width: 0; }
.da-vm-callout .txt b { color: var(--ink); font-weight: 700; }
.da-vm-faq { background: linear-gradient(180deg, rgba(28,33,42,0.85) 0%, rgba(20,24,32,0.85) 100%); border: 1px solid var(--border); border-radius: 18px; position: relative; overflow: hidden; display: flex; flex-direction: column; padding: clamp(24px, 3vw, 35px); min-width: 0; }
.da-vm-coffee { position: absolute; top: 24px; right: 24px; opacity: 0.7; filter: drop-shadow(0 0 12px color-mix(in oklch, var(--accent) 40%, transparent)); }
.da-vm-faq h3 { font-family: 'Geist', system-ui; font-size: clamp(22px, 2.4vw, 30px); font-weight: 600; letter-spacing: -0.022em; line-height: 1.2; color: var(--ink); margin: 0 0 22px; text-wrap: balance; padding-right: 64px; }
.da-vm-faq p { font-family: 'Geist', system-ui; font-size: clamp(15px, 1.5vw, 16.5px); line-height: 1.6; color: rgba(238,242,247,0.8); margin: 0 0 28px; text-wrap: pretty; flex: 1; }
.da-vm-sig { display: flex; align-items: center; gap: 14px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,0.06); }
.da-vm-sig .av { width: 42px; height: 42px; border-radius: 999px; background: linear-gradient(135deg, color-mix(in oklch, var(--accent) 28%, #0f1620) 0%, color-mix(in oklch, var(--accent) 8%, #0a1218) 100%); border: 1px solid color-mix(in oklch, var(--accent) 30%, transparent); display: grid; place-items: center; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 12px; font-weight: 700; letter-spacing: 0.06em; color: var(--ink); flex-shrink: 0; }
.da-vm-sig .nm { font-family: 'Geist', system-ui; font-size: 15px; font-weight: 600; color: var(--ink); letter-spacing: -0.01em; }
.da-vm-sig .role { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10.5px; color: rgba(238,242,247,0.6); letter-spacing: 0.08em; margin-top: 3px; text-transform: uppercase; }
@media (max-width: 900px) { .da-value-math-grid { grid-template-columns: 1fr !important; gap: 32px !important; } }
@media (max-width: 760px) { .da-vm { margin: 48px 0 !important; border-radius: 18px !important; } }

/* =====================================================================
   PRICING
   ===================================================================== */
.da-pricing-head { max-width: 1200px; margin-bottom: 56px; width: 100%; }
.da-pricing-head .da-heading { white-space: nowrap; font-size: clamp(28px, 3.6vw, 52px); }
@media (max-width: 720px) { .da-pricing-head .da-heading { white-space: normal; } }
.da-pricing-lede { font-family: 'Geist', system-ui; font-size: 18px; line-height: 1.5; color: rgba(238,242,247,0.72); margin: 20px 0 0; max-width: 1100px; letter-spacing: -0.005em; text-wrap: pretty; white-space: nowrap; }
@media (max-width: 900px) { .da-pricing-lede { white-space: normal !important; } }
.da-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.da-price-logo {
  position: absolute; top: 18px; right: 18px; z-index: 2;
  width: 30px; height: 30px; border-radius: 9px;
  background: color-mix(in oklch, var(--accent) 13%, transparent);
  border: 1px solid color-mix(in oklch, var(--accent) 32%, transparent);
  display: grid; place-items: center;
  box-shadow: inset 0 0 16px -10px var(--accent);
}
.da-price-card .da-price-head { padding-right: 40px; }
.da-price-card { position: relative; background: var(--surface-card-soft); border: 1px solid var(--border); border-radius: 18px; padding: 26px 22px 22px; box-shadow: 0 20px 50px -20px rgba(0,0,0,0.5); display: flex; flex-direction: column; }
.da-price-card.featured { background: linear-gradient(180deg, color-mix(in oklch, var(--accent) 6%, rgba(28,33,42,0.95)) 0%, rgba(20,24,32,0.95) 100%); border: 1px solid color-mix(in oklch, var(--accent) 38%, transparent); box-shadow: 0 30px 80px -30px color-mix(in oklch, var(--accent) 35%, transparent), 0 0 0 1px color-mix(in oklch, var(--accent) 18%, transparent), 0 0 60px -20px color-mix(in oklch, var(--accent) 40%, transparent); }
.da-price-badge { position: absolute; top: -11px; left: 20px; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9.5px; font-weight: 600; color: #0a0d12; padding: 4px 9px; background: var(--accent); border-radius: 5px; letter-spacing: 0.1em; text-transform: uppercase; box-shadow: 0 4px 16px -4px color-mix(in oklch, var(--accent) 60%, transparent); }
.da-price-head { display: flex; align-items: baseline; justify-content: space-between; gap: 6px; flex-wrap: wrap; }
.da-price-name { font-family: 'Geist', system-ui; font-size: 15px; font-weight: 600; color: var(--ink); letter-spacing: -0.01em; }
.da-price-live { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9.5px; color: rgba(238,242,247,0.6); letter-spacing: 0.08em; text-transform: uppercase; white-space: nowrap; }
.da-price-amt { margin-top: 16px; display: flex; align-items: baseline; gap: 4px; }
.da-price-amt .cur { font-family: 'Geist', system-ui; font-size: 20px; font-weight: 500; color: rgba(238,242,247,0.6); }
.da-price-amt .num { font-family: 'Geist', system-ui; font-size: 48px; font-weight: 600; letter-spacing: -0.04em; color: var(--ink); line-height: 1; }
.da-price-amt .per { font-family: 'Geist', system-ui; font-size: 13px; color: rgba(238,242,247,0.6); margin-left: 4px; }
.da-price-tag { font-family: 'Geist', system-ui; font-size: 13px; line-height: 1.5; color: rgba(238,242,247,0.76); margin: 14px 0 0; min-height: 39px; }
.da-btn-primary.is-block, .da-btn-ghost.is-block { width: 100%; justify-content: center; padding: 12px 16px; margin-top: 20px; font-size: 13px; }
.da-price-divider { height: 1px; background: rgba(255,255,255,0.06); margin: 20px 0 16px; }
.da-price-feats { padding: 0; margin: 0; list-style: none; display: grid; gap: 9px; flex: 1; }
.da-price-feats li { display: flex; align-items: flex-start; gap: 9px; }
.da-price-check { margin-top: 4px; flex-shrink: 0; width: 13px; height: 13px; border-radius: 999px; background: color-mix(in oklch, var(--accent) 14%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 30%, transparent); display: grid; place-items: center; }
.da-price-feats .txt { flex: 1; min-width: 0; font-family: 'Geist', system-ui; font-size: 12.5px; line-height: 1.45; color: rgba(238,242,247,0.85); }

/* pilot banner */
.da-pilot-banner { position: relative; margin-top: 40px; border-radius: 22px; overflow: hidden; padding: 36px 40px; background: radial-gradient(ellipse 70% 100% at 100% 0%, color-mix(in oklch, var(--accent) 16%, transparent), transparent 60%), linear-gradient(180deg, #131923 0%, #0e131a 100%); border: 1px solid color-mix(in oklch, var(--accent) 28%, transparent); box-shadow: 0 30px 60px -20px rgba(0,0,0,0.6), 0 0 80px -20px color-mix(in oklch, var(--accent) 32%, transparent); }
.da-pilot-gridpattern { position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px); background-size: 40px 40px; -webkit-mask-image: radial-gradient(ellipse at 80% 30%, black 30%, transparent 75%); mask-image: radial-gradient(ellipse at 80% 30%, black 30%, transparent 75%); pointer-events: none; opacity: 0.6; }
.da-pilot-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.2fr 1fr; gap: 40px; align-items: center; }
.da-pilot-pill { display: inline-flex; align-items: center; gap: 8px; padding: 5px 11px; background: color-mix(in oklch, var(--accent) 18%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 38%, transparent); border-radius: 999px; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10.5px; font-weight: 600; color: var(--accent); letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 18px; }
.da-pilot-pill .dot { width: 6px; height: 6px; border-radius: 999px; background: var(--accent); box-shadow: 0 0 8px var(--accent); }
.da-pilot h3 { font-family: 'Geist', system-ui; font-size: clamp(28px, 3vw, 38px); font-weight: 600; letter-spacing: -0.025em; line-height: 1.05; margin: 0; color: var(--ink); text-wrap: balance; max-width: 555px; }
.da-pilot h3 .accent { color: var(--accent); }
.da-pilot-p { font-family: 'Geist', system-ui; font-size: 15px; line-height: 1.55; color: rgba(238,242,247,0.8); margin: 14px 0 0; max-width: 540px; }
.da-pilot-feats { padding: 0; margin: 0; list-style: none; display: grid; gap: 10px; }
.da-pilot-feats li { display: flex; align-items: flex-start; gap: 10px; }
.da-pilot-check { margin-top: 4px; flex-shrink: 0; width: 16px; height: 16px; border-radius: 999px; background: color-mix(in oklch, var(--accent) 20%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 40%, transparent); display: grid; place-items: center; }
.da-pilot-feats .txt { flex: 1; min-width: 0; font-family: 'Geist', system-ui; font-size: 13.5px; line-height: 1.45; color: var(--ink); }
.da-pilot-cta { padding: 14px 22px; margin-top: 22px; font-size: 14.5px; }

/* =====================================================================
   SYSTEM FLOW DIAGRAM
   ===================================================================== */
.da-flow-canvas { position: relative; margin-top: 64px; }
.da-flow-svg { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; overflow: visible; }
.da-flow-pulse-seg { stroke-dasharray: 8 92; stroke-dashoffset: 100; opacity: 0; }
.da-flow-pulse-seg.is-flowing { opacity: 1; animation: da-flow-pulse 2.8s linear infinite; }
@media (prefers-reduced-motion: reduce) { .da-flow-pulse-seg.is-flowing { animation: none; opacity: 0.45; } }

/* nodes */
.da-flow-node {
  --nc: var(--accent);
  position: relative; z-index: 2;
  background: linear-gradient(180deg, rgba(26,32,41,0.94) 0%, rgba(16,20,27,0.96) 100%);
  border: 1px solid color-mix(in oklch, var(--nc) 22%, transparent);
  border-radius: 18px; padding: 17px 18px;
  box-shadow: inset 0 0 26px -16px var(--nc), 0 16px 40px -26px rgba(0,0,0,0.7);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  opacity: 0; transform: translateY(12px) scale(0.9);
  transition: opacity 560ms cubic-bezier(0.16,1,0.3,1), transform 560ms cubic-bezier(0.34,1.56,0.64,1);
  will-change: opacity, transform;
}
.da-flow-node.is-shown { opacity: 1; transform: translateY(0) scale(1); }
.da-flow-node--core { padding: 22px 22px; border-color: color-mix(in oklch, var(--nc) 55%, transparent); box-shadow: inset 0 0 40px -14px var(--nc), 0 0 0 1px color-mix(in oklch, var(--nc) 18%, transparent), 0 24px 60px -22px color-mix(in oklch, var(--nc) 70%, transparent); }
.da-flow-node--hq { --nc: var(--hq-purple); box-shadow: inset 0 0 30px -16px var(--nc), 0 18px 44px -24px color-mix(in oklch, var(--nc) 60%, transparent); }
.da-flow-node .da-node-head { display: flex; align-items: center; gap: 12px; }
.da-node-ico { flex-shrink: 0; width: 38px; height: 38px; border-radius: 11px; background: color-mix(in oklch, var(--nc) 13%, transparent); border: 1px solid color-mix(in oklch, var(--nc) 30%, transparent); display: grid; place-items: center; box-shadow: inset 0 0 14px -8px var(--nc); }
.da-flow-node--core .da-node-ico { width: 44px; height: 44px; }
.da-flow-node .da-node-textcol { min-width: 0; flex: 1; }
.da-flow-node .da-node-kicker { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9px; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; color: var(--nc); opacity: 0.5; margin-bottom: 7px; }
.da-flow-node .da-node-title { font-family: 'Geist', system-ui; font-size: 16.5px; font-weight: 600; letter-spacing: -0.018em; color: var(--ink); line-height: 1.2; text-wrap: balance; }
.da-flow-node .da-node-title .accent { color: var(--accent); }
.da-flow-node--core .da-node-title { font-size: 21px; }
.da-flow-node .da-node-body { font-family: 'Geist', system-ui; font-size: 12.5px; line-height: 1.45; color: rgba(238,242,247,0.72); margin: 11px 0 0; text-wrap: pretty; }
.da-flow-node--core .da-node-body { font-size: 13.5px; }

/* grid */
.da-flow-hq-row { display: flex; justify-content: center; margin-top: clamp(76px, 8vw, 116px); }
.da-flow-hq-row > * { width: clamp(280px, 34%, 420px); }
.da-flow-grid {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1.18fr) minmax(0,1fr) minmax(0,1fr);
  grid-template-rows: auto auto auto;
  column-gap: clamp(38px, 5vw, 84px);
  row-gap: clamp(26px, 3.4vw, 52px);
  align-items: center;
}
/* the column wrappers are transparent by default (mobile grid uses the inner
   pos-* nodes directly); the desktop media query turns them into flex columns */
.da-flow-col { display: contents; }
.da-flow-grid .pos-phone      { grid-column: 1; grid-row: 1; }
.da-flow-grid .pos-whatsIn    { grid-column: 1; grid-row: 2; }
.da-flow-grid .pos-web        { grid-column: 1; grid-row: 3; }
.da-flow-grid .pos-core       { grid-column: 2; grid-row: 2; }
.da-flow-grid .pos-leadRouted { grid-column: 3; grid-row: 1; }
.da-flow-grid .pos-closeJob   { grid-column: 4; grid-row: 1; }
.da-flow-grid .pos-followUp   { grid-column: 3; grid-row: 3; }
.da-flow-grid .pos-whatsClient{ grid-column: 4; grid-row: 3; }
@media (max-width: 1100px) { .da-flow-grid { column-gap: 34px; row-gap: 30px; } }
@media (max-width: 820px) {
  .da-flow-canvas { max-width: 460px; margin-left: auto; margin-right: auto; }
  .da-flow-grid { grid-template-columns: repeat(6, 1fr); grid-template-rows: auto auto auto auto; column-gap: 8px; row-gap: clamp(54px, 14vw, 76px); align-items: stretch; }
  .da-flow-grid .pos-phone      { grid-column: 1 / 3; grid-row: 1; }
  .da-flow-grid .pos-whatsIn    { grid-column: 3 / 5; grid-row: 1; }
  .da-flow-grid .pos-web        { grid-column: 5 / 7; grid-row: 1; }
  .da-flow-grid .pos-core       { grid-column: 1 / 7; grid-row: 2; }
  .da-flow-grid .pos-leadRouted { grid-column: 1 / 4; grid-row: 3; }
  .da-flow-grid .pos-followUp   { grid-column: 4 / 7; grid-row: 3; }
  .da-flow-grid .pos-closeJob   { grid-column: 1 / 4; grid-row: 4; }
  .da-flow-grid .pos-whatsClient{ grid-column: 4 / 7; grid-row: 4; }
  .da-flow-grid > div { display: flex; }
  .da-flow-grid .da-flow-node { width: 100%; }
  .da-flow-node--entry { padding: 12px 10px; }
  .da-flow-node--entry .da-node-head { flex-direction: column; align-items: flex-start; gap: 9px; }
  .da-flow-node--entry .da-node-kicker, .da-flow-node--entry .da-node-body { display: none; }
  .da-flow-node--entry .da-node-title { font-size: 13.5px; }
  .da-flow-node--biz, .da-flow-node--cust { padding: 14px 13px; }
  .da-flow-node--biz .da-node-body, .da-flow-node--cust .da-node-body { font-size: 11.5px; }
  .da-flow-hq-row { margin-top: clamp(54px, 14vw, 76px); }
  .da-flow-hq-row > * { width: min(78%, 320px); }
}
@media (max-width: 480px) {
  .da-flow-node--entry .da-node-title { font-size: 12.5px; }
  .da-flow-node--biz .da-node-body, .da-flow-node--cust .da-node-body { font-size: 11px; }
}

/* =====================================================================
   FAQ (native <details>/<summary> accordion)
   ===================================================================== */
.da-faq-list { display: grid; grid-template-columns: 1fr; gap: 12px; max-width: 980px; }
.da-faq-item { border-radius: 14px; background: linear-gradient(180deg, rgba(28,33,42,0.55) 0%, rgba(20,24,32,0.55) 100%); border: 1px solid var(--border); transition: border-color 180ms ease, background 180ms ease; overflow: hidden; }
.da-faq-item[open] { background: linear-gradient(180deg, color-mix(in oklch, var(--accent) 3%, rgba(28,33,42,0.7)) 0%, rgba(20,24,32,0.7) 100%); border-color: color-mix(in oklch, var(--accent) 22%, transparent); }
.da-faq-summary { list-style: none; width: 100%; padding: 22px 26px; display: flex; align-items: center; gap: 20px; cursor: pointer; text-align: left; }
.da-faq-summary::-webkit-details-marker { display: none; }
.da-faq-num { flex-shrink: 0; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 12px; font-weight: 600; letter-spacing: 0.08em; color: rgba(238,242,247,0.6); padding: 5px 9px; background: rgba(255,255,255,0.04); border: 1px solid var(--border); border-radius: 6px; transition: all 180ms ease; }
.da-faq-item[open] .da-faq-num { color: var(--accent); background: color-mix(in oklch, var(--accent) 12%, transparent); border-color: color-mix(in oklch, var(--accent) 30%, transparent); }
.da-faq-q { flex: 1; font-family: 'Geist', system-ui; font-size: clamp(16px, 1.4vw, 19px); font-weight: 600; letter-spacing: -0.012em; line-height: 1.35; color: var(--ink); text-wrap: balance; }
.da-faq-ico { flex-shrink: 0; width: 32px; height: 32px; border-radius: 999px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); display: grid; place-items: center; transition: all 180ms ease; color: rgba(238,242,247,0.8); }
.da-faq-item[open] .da-faq-ico { background: var(--accent); border: 1px solid transparent; color: #0a0d12; }
.da-faq-ico svg { transition: transform 220ms ease; }
.da-faq-item[open] .da-faq-ico svg { transform: rotate(45deg); }
.da-faq-body { padding: 4px 26px 26px 73px; font-family: 'Geist', system-ui; font-size: 15.5px; line-height: 1.6; color: rgba(238,242,247,0.82); text-wrap: pretty; }
.da-faq-body p { margin: 0 0 14px; }
.da-faq-body p:last-child { margin-bottom: 0; }
.da-faq-body em { color: rgba(238,242,247,0.85); font-style: italic; }
.da-faq-body strong { color: var(--ink); font-weight: 600; }
.da-faq-body .intro { color: rgba(238,242,247,0.85); }
@media (max-width: 760px) { .da-faq-body { padding-left: 26px; } }
.da-faq-ul { padding: 0; margin: 8px 0 16px; list-style: none; display: grid; gap: 8px; }
.da-faq-ul li { display: flex; align-items: flex-start; gap: 12px; padding: 4px 0; }
.da-faq-dot { margin-top: 9px; flex-shrink: 0; width: 5px; height: 5px; border-radius: 999px; background: var(--accent); box-shadow: 0 0 6px var(--accent); }
.da-faq-ul .term { color: var(--ink); font-weight: 600; letter-spacing: -0.005em; }
.da-faq-ul .desc { color: rgba(238,242,247,0.7); }
.da-faq-subhead { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 11.5px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(238,242,247,0.6); margin: 6px 0 10px; }
.da-faq-callout { margin-top: 16px; padding: 14px 16px; background: color-mix(in oklch, var(--accent) 6%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 26%, transparent); border-radius: 10px; display: flex; align-items: flex-start; gap: 12px; }
.da-faq-callout .label { flex-shrink: 0; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--accent); padding: 3px 7px; background: color-mix(in oklch, var(--accent) 14%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 32%, transparent); border-radius: 5px; margin-top: 1px; }
.da-faq-callout .txt { font-family: 'Geist', system-ui; font-size: 14.5px; line-height: 1.55; color: rgba(238,242,247,0.85); }
.da-faq-cta { margin-top: 48px; padding: 22px 26px; background: var(--surface-card-soft); border: 1px solid var(--border); border-radius: 16px; display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; max-width: 980px; }
.da-faq-cta .txt { font-family: 'Geist', system-ui; font-size: 15.5px; color: rgba(238,242,247,0.78); letter-spacing: -0.005em; }
.da-faq-cta .txt b { color: var(--ink); font-weight: 600; }
.da-btn-primary.is-sm { font-size: 13.5px; padding: 11px 18px; }

/* =====================================================================
   HERO REBUILD — centred intro above the system-flow diagram
   ===================================================================== */
.da-hero-grid { grid-template-columns: 1fr; max-width: 1320px; padding-top: 34px; padding-bottom: 6px; gap: 0; text-align: left; }
.da-hero-grid > div { display: flex; flex-direction: column; align-items: flex-start; }
.da-hero .da-hero-badge { margin-left: auto; margin-right: auto; }
.da-hero h1, .da-hero h2 { font-size: clamp(26px, 3.4vw, 44px); text-align: left; max-width: none; margin: 0; line-height: 1.05; }
.da-hero .da-hero-sub { max-width: 720px; margin: 14px 0 0; text-align: left; font-size: 16px; }
.da-hero .da-cta-row { justify-content: center; }
/* the diagram sits tight under the hero intro and reads as its visual core */
.da-hero-diagram { padding-top: 32px; padding-bottom: clamp(12px, 2vw, 28px); }
.da-hero-diagram .da-flow-canvas { margin-top: 0; }
.da-flow-badge { display: flex; justify-content: center; margin-top: clamp(8px, 1vw, 14px); }
/* CTA relocated to just below the reviews section */
.da-mini-cta { padding-top: clamp(20px, 3vw, 40px); padding-bottom: clamp(20px, 3vw, 40px); }
.da-demo-band {
  display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap;
  padding: clamp(22px, 3vw, 32px) clamp(24px, 3.5vw, 40px);
  border-radius: 20px;
  background:
    radial-gradient(ellipse 70% 130% at 100% 0%, color-mix(in oklch, var(--accent) 12%, transparent), transparent 60%),
    var(--surface-card-soft);
  border: 1px solid color-mix(in oklch, var(--accent) 20%, transparent);
  box-shadow: 0 24px 50px -28px rgba(0,0,0,0.6);
}
.da-demo-copy { flex: 1; min-width: 280px; }
.da-demo-eyebrow { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--accent); margin-bottom: 10px; }
.da-demo-title { font-family: 'Geist', system-ui; font-size: clamp(20px, 2.2vw, 27px); font-weight: 600; letter-spacing: -0.02em; line-height: 1.15; color: var(--ink); margin: 0; text-wrap: balance; }
.da-demo-sub { font-family: 'Geist', system-ui; font-size: 14px; line-height: 1.5; color: rgba(238,242,247,0.72); margin: 10px auto 0; max-width: 560px; text-wrap: pretty; }
.da-demo-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 18px; margin-top: 15px; }
.da-demo-chip { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; font-family: 'Geist', system-ui; font-size: 12.5px; color: rgba(238,242,247,0.84); }
.da-demo-chip .dot { width: 5px; height: 5px; border-radius: 999px; background: var(--accent); box-shadow: 0 0 6px var(--accent); flex-shrink: 0; }
.da-demo-actions { display: flex; flex-direction: column; gap: 10px; flex-shrink: 0; }
.da-demo-actions a { justify-content: center; }
@media (max-width: 760px) {
  .da-demo-band { gap: 22px; flex-direction: column; align-items: stretch; }
  .da-demo-copy { min-width: 0 !important; width: 100% !important; max-width: 100% !important; }
  .da-demo-actions { width: 100%; }
  .da-demo-actions a { width: 100%; }
}
/* Squeeze the diagram's vertical footprint now it lives inside the hero
   (desktop/tablet only; mobile keeps its own compact stacked layout). */
@media (min-width: 821px) {
  .da-hero-diagram .da-flow-grid { display: flex; align-items: center; justify-content: space-between; gap: clamp(20px, 2.4vw, 40px); }
  .da-hero-diagram .da-flow-col { display: flex; flex-direction: column; justify-content: center; min-width: 0; }
  .da-hero-diagram .da-flow-col--in  { flex: 0 1 22%; gap: clamp(12px, 1.7vw, 22px); }
  .da-hero-diagram .da-flow-col--core { flex: 0 1 30%; }
  .da-hero-diagram .da-flow-col--mid { flex: 0 1 21%; gap: clamp(16px, 2vw, 30px); }
  .da-hero-diagram .da-flow-col--out { flex: 0 1 21%; gap: clamp(16px, 2vw, 30px); }
  .da-hero-diagram .da-flow-hq-row { margin-top: clamp(34px, 3.4vw, 52px); }
  .da-hero-diagram .da-flow-node { padding: 7px 11px; }
  .da-hero-diagram .da-flow-node--core { padding: 9px 13px; }
  .da-hero-diagram .da-flow-node .da-node-title { font-size: 13px; line-height: 1.16; }
  .da-hero-diagram .da-flow-node--core .da-node-title { font-size: 14.5px; }
  /* clamp the long bodies so every node is roughly agent-node height — this is
     what collapses the tall rows and brings the hero under one screen */
  .da-hero-diagram .da-flow-node .da-node-body {
    font-size: 10px; line-height: 1.22; margin-top: 3px;
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
  }
  /* core + HQ show their FULL description (no clamp); other nodes stay clamped */
  .da-hero-diagram .da-flow-node--core .da-node-body { display: block; -webkit-line-clamp: none; overflow: visible; font-size: 10.5px; line-height: 1.26; }
  .da-hero-diagram .da-flow-node--hq .da-node-body { display: block; -webkit-line-clamp: none; overflow: visible; font-size: 10.5px; line-height: 1.3; }
  /* the four branch nodes also show their full text (no mid-sentence cut-off) */
  .da-hero-diagram .da-flow-node--biz .da-node-body,
  .da-hero-diagram .da-flow-node--cust .da-node-body { display: block; -webkit-line-clamp: none; overflow: visible; }
  .da-hero-diagram .da-node-ico { width: 32px; height: 32px; border-radius: 9px; }
  .da-hero-diagram .da-flow-node--core .da-node-ico { width: 38px; height: 38px; }
  .da-hero-diagram .da-flow-node .da-node-kicker { font-size: 8.5px; }
  .da-hero-diagram .da-flow-node .da-node-kicker { margin-bottom: 3px; }
}

/* Original hero (copy + the 3 animated infographic cards) recreated as a
   showcase section near the foot of the page. */
.da-showcase-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 80px; align-items: center; }
.da-showcase-head { font-family: 'Geist', system-ui; font-size: clamp(40px, 4vw, 60px); font-weight: 600; line-height: 1.04; letter-spacing: -0.035em; color: var(--ink); margin: 0; text-wrap: balance; max-width: 520px; }
@media (max-width: 900px) { .da-showcase-grid { grid-template-columns: 1fr !important; gap: 48px !important; } .da-showcase-grid .da-hero-cards { max-width: 560px; margin: 0 auto; } }
@media (max-width: 760px) { .da-showcase-grid { gap: 36px !important; } }

/* Logos marquee relocated inside the reviews section, below the title */
#reviews .da-marquee-wrap { margin: 26px -56px 4px; border-top: none; border-bottom: none; background: none; }
#reviews .da-marquee-label { display: none; }
#reviews .da-marquee-track { padding-left: 56px; }
@media (max-width: 760px) {
  #reviews .da-marquee-wrap { margin-left: -20px; margin-right: -20px; }
  #reviews .da-marquee-track { padding-left: 20px; }
}
/* written reviews scroll the opposite direction to the logos */
.da-reviews-track { animation-direction: reverse; }

/* =====================================================================
   RESPONSIVE OVERRIDES  (ported verbatim from the original <style> block)
   ===================================================================== */

/* Tablet */
@media (max-width: 1100px) {
  .da-section { padding-left: 32px !important; padding-right: 32px !important; }
  .da-hero-grid { padding-left: 32px !important; padding-right: 32px !important; padding-top: 64px !important; padding-bottom: 64px !important; gap: 56px !important; }
  .da-nav { padding-left: 32px !important; padding-right: 32px !important; }
  .da-footer { padding-left: 32px !important; padding-right: 32px !important; }
  .da-hero-grid > * { min-width: 0 !important; }
  .da-grid-4 { grid-template-columns: 1fr 1fr !important; }
  .da-pilot-grid { grid-template-columns: 1fr !important; gap: 28px !important; }
  .da-pilot-banner { padding: 32px 28px !important; }
  .da-nav-links { gap: 18px !important; font-size: 13px !important; }
}

/* Mid-tablet — collapse nav links to make room for logo + CTA */
/* Hide top-nav links early enough that the 8-link row never cramps/wraps in the tight band */
@media (max-width: 1000px) { .da-nav-links { display: none !important; } }
@media (max-width: 900px) {
  .da-nav-links { display: none !important; }
  .da-grid-split { grid-template-columns: 1fr !important; gap: 48px !important; }
  /* When stacked, demo mockup sits below the copy (Web & WhatsApp lead with the mockup in the DOM) */
  .da-web-grid > div:first-child,
  .da-wa-grid > div:first-child { order: 2; }
  /* Headline/lede already fluid; keep every split cell from spilling */
  .da-grid-split > * { max-width: 100%; }
  .da-hero-grid { grid-template-columns: 1fr !important; gap: 48px !important; }
  .da-hero-cards { max-width: 560px !important; margin: 0 auto !important; }
}

/* Mobile */
@media (max-width: 760px) {
  .da-section { padding: 72px 20px !important; max-width: 100% !important; }

  .da-hero-split { padding: 24px 20px 64px !important; grid-template-columns: 1fr !important; max-width: 100% !important; gap: 40px !important; }
  .da-hero-split > * { min-width: 0 !important; }
  .da-hero-intro h1, .da-hero-split h1, .da-hero-split h2 { font-size: clamp(33px, 10vw, 52px) !important; }

  .da-label {
    white-space: normal !important;
    max-width: 100% !important;
    font-size: 13px !important;
    letter-spacing: 0.1em !important;
    line-height: 1.35 !important;
    padding: 9px 16px !important;
    border-radius: 14px !important;
    align-items: center !important;
  }
  .da-hero-grid { padding: 28px 20px 48px !important; grid-template-columns: 1fr !important; gap: 36px !important; }
  .da-nav { padding: 14px 20px !important; }
  .da-footer { padding: 32px 20px 24px !important; }
  .da-final-cta { padding: 48px 24px !important; border-radius: 22px !important; }

  .da-hero-cards { height: auto !important; display: flex !important; flex-direction: column !important; gap: 0 !important; padding: 8px 0 14px !important; }
  .da-hero-cards-lines { display: none !important; }
  .da-hero-card { position: static !important; left: auto !important; right: auto !important; top: auto !important; bottom: auto !important; width: 92% !important; }
  .da-hero-card[data-card="1"] { align-self: flex-start !important; }
  .da-hero-card[data-card="2"] { align-self: flex-end !important; margin-top: -20px !important; }
  .da-hero-card[data-card="3"] { align-self: flex-start !important; margin-left: 6% !important; margin-top: -20px !important; width: 86% !important; }

  .da-hero-grid h1, .da-hero-grid h2 { font-size: clamp(40px, 11vw, 56px) !important; }

  .da-grid-2 { grid-template-columns: 1fr !important; gap: 16px !important; }
  .da-grid-3 { grid-template-columns: 1fr !important; gap: 14px !important; }
  .da-grid-4 { grid-template-columns: 1fr 1fr !important; gap: 14px !important; }
  .da-grid-split { grid-template-columns: 1fr !important; gap: 36px !important; }

  .da-section h2 { font-size: clamp(32px, 8.5vw, 42px) !important; }

  .da-chat-widget { width: calc(100% - 24px) !important; right: 12px !important; left: 12px !important; bottom: 12px !important; }

  .da-kpi-grid { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }

  .da-impact-section { padding: 64px 0 !important; }
  .da-impact-inner { padding: 0 20px !important; }
  .da-impact-head { margin-bottom: 36px !important; }
  .da-impact-heading { white-space: normal !important; text-wrap: balance; }
  .da-impact-grid { grid-template-columns: 1fr !important; gap: 0 !important; }
  .da-impact-grid > * { padding: 22px 0 !important; border-left: none !important; border-right: none !important; border-top: 1px solid rgba(255,255,255,0.06) !important; border-bottom: none !important; }
  .da-impact-grid > *:first-child { border-top: none !important; padding-top: 6px !important; }
  .da-impact-stat-row > span:first-child { font-size: 56px !important; }

  .da-steps-grid { grid-template-columns: 1fr !important; gap: 14px !important; }
  .da-steps-grid > * { padding: 20px !important; background: rgba(255,255,255,0.025) !important; border: 1px solid rgba(255,255,255,0.06) !important; border-radius: 14px !important; }
  .da-steps-line { display: none !important; }

  .da-footer-top { flex-direction: column !important; align-items: flex-start !important; gap: 28px !important; }
  .da-footer-cols { grid-template-columns: 1fr 1fr 1fr !important; gap: 24px !important; width: 100% !important; }
  .da-footer-bottom { flex-direction: column !important; align-items: flex-start !important; gap: 8px !important; font-size: 10px !important; }

  .da-nav-links { display: none !important; }

  .da-cta-row { flex-direction: column !important; align-items: stretch !important; gap: 12px !important; width: 100% !important; }
  .da-cta-row > button, .da-cta-row > a { width: 100% !important; justify-content: center !important; }

  .da-btn-primary, .da-btn-ghost { min-height: 46px !important; }
  .da-btn-primary.is-block, .da-btn-ghost.is-block { display: flex !important; align-items: center !important; justify-content: center !important; }

  .da-call-btn { width: 50px !important; height: 50px !important; left: 14px !important; bottom: 14px !important; }

  .da-price-card { padding: 22px 20px !important; }
  .da-grid-4 { grid-template-columns: 1fr !important; gap: 16px !important; }
  .da-pilot-banner { padding: 28px 22px !important; }
  .da-pilot-grid { grid-template-columns: 1fr !important; gap: 22px !important; }

  .da-marquee-wrap { padding: 14px 0 18px !important; }
  .da-marquee-label {
    position: static !important;
    left: auto !important; top: auto !important;
    transform: none !important;
    display: inline-flex !important;
    margin: 0 0 12px 16px !important;
    font-size: 9px !important;
    padding: 5px 10px !important;
  }
  .da-marquee-wrap > div[aria-hidden] { width: 48px !important; }
  .da-marquee-track { gap: 36px !important; padding-left: 16px !important; animation-duration: 28s !important; }
}

@media (max-width: 420px) {
  .da-grid-4 { grid-template-columns: 1fr !important; }
  .da-kpi-grid { grid-template-columns: 1fr !important; }
  .da-footer-cols { grid-template-columns: 1fr 1fr !important; }
  .da-section { padding: 64px 18px !important; }
}

/* Reduced motion — kill non-essential animation, hide starfield */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
  .da-starfield { display: none !important; }
}

/* =====================================================================
   HERO SPLIT v2 — intro left (pinned) · vertical system-flow right
   ===================================================================== */
#top.da-hero { overflow: visible; }
.da-hero-split {
  position: relative; z-index: 5; max-width: 1340px; margin: 0 auto;
  padding: 40px 56px 132px;
  display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 72px; align-items: start;
}
.da-hero-intro {
  position: sticky; top: 160px;
  display: flex; flex-direction: column; align-items: flex-start; padding-bottom: 28px;
}
.da-hero-split .da-hero-intro h1 {
  font-family: 'Geist', system-ui; font-size: clamp(34px, 3.5vw, 54px);
  font-weight: 600; line-height: 1.03; letter-spacing: -0.035em;
  margin: 20px 0 0; color: var(--ink); text-align: left; text-wrap: balance; max-width: 13ch;
}
.da-hero-split .da-hero-intro .da-hero-sub {
  font-size: 17px; line-height: 1.5; max-width: 440px; margin: 22px 0 0; text-align: left;
}
.da-hero-split .da-cta-row { margin-top: 34px; flex-direction: column; align-items: flex-start; gap: 14px; }
.da-hero-split .da-hero-social { margin-top: 38px; }
.da-hero-split .da-hero-intro .da-hero-badge { margin-left: 0; margin-right: 0; }

/* vertical flow ------------------------------------------------------- */
.da-vflow { position: relative; z-index: 2; }
.da-vflow .da-section-glow { top: 4%; }
.da-vflow-svg { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; overflow: visible; }
.da-vflow-grid { position: relative; z-index: 2; display: flex; flex-direction: column; }
.da-vflow-row { display: flex; justify-content: center; align-items: stretch; gap: 16px; }
.da-vflow-row + .da-vflow-row { margin-top: clamp(46px, 5.6vw, 74px); }
.da-vflow-row--hq > * { width: min(80%, 392px); }
.da-vflow-row--channels > * { flex: 1 1 0; min-width: 0; }
.da-vflow-row--core > * { width: 100%; }
.da-vflow-row--out2 > * { flex: 1 1 0; min-width: 0; }
.da-vflow .da-flow-node--entry { padding: 16px 15px; }
.da-vflow .da-flow-node--entry .da-node-head { flex-direction: column; align-items: flex-start; gap: 13px; }
.da-vflow .da-flow-node--entry .da-node-textcol { width: 100%; }
.da-vflow .da-flow-node--entry .da-node-kicker { font-size: 8.5px; margin-bottom: 5px; }
.da-vflow .da-flow-node--entry .da-node-title { font-size: 15px; white-space: nowrap; letter-spacing: -0.02em; }
.da-vflow .da-flow-node--entry .da-node-body { font-size: 11.5px; margin-top: 9px; }
.da-vflow .da-flow-node--biz { --nc: var(--accent); }
.da-vflow .da-flow-node--cust { --nc: oklch(0.86 0.13 200); }

/* connector pulse */
@keyframes daVPulse { 0% { stroke-dashoffset: 100; } 100% { stroke-dashoffset: 0; } }

@media (prefers-reduced-motion: reduce) {
  .da-vflow .da-flow-node { opacity: 1 !important; transform: none !important; }
}

/* responsive ---------------------------------------------------------- */
@media (max-width: 980px) {
  .da-hero-split { grid-template-columns: 1fr; gap: 44px; padding: 24px 32px 88px; }
  .da-hero-intro { position: static; top: auto; padding-bottom: 0; }
  .da-hero-split .da-hero-intro h1 { max-width: none; }
  .da-hero-split .da-hero-intro .da-hero-sub { max-width: 620px; }
}
/* narrow right column: channels become a 2x2 grid so agent names stay on one line */
@media (max-width: 1240px) {
  .da-vflow-row--channels { flex-wrap: wrap; gap: 14px; }
  .da-vflow-row--channels > * { flex: 1 1 calc(50% - 7px); }
}
@media (max-width: 560px) {
  .da-vflow-row--channels { flex-wrap: wrap; gap: 10px; }
  .da-vflow-row--channels > * { flex: 1 1 calc(50% - 5px); }
  .da-vflow .da-flow-node--entry { padding: 13px 13px; }
  .da-vflow .da-flow-node--entry .da-node-head { flex-direction: row; align-items: center; gap: 10px; }
  .da-vflow .da-flow-node--entry .da-node-kicker { display: none; }
  .da-vflow .da-flow-node--entry .da-node-body { display: none; }
  .da-vflow .da-flow-node--entry .da-node-title { font-size: 13.5px; }
}

/* =====================================================================
   FULL DESKAGENT — the complete system, its own featured section
   ===================================================================== */
.da-full {
  position: relative; margin-top: 24px; border-radius: 24px; overflow: hidden;
  padding: 42px 46px;
  border: 1px solid color-mix(in oklch, var(--accent) 30%, transparent);
  background: linear-gradient(180deg, color-mix(in oklch, var(--accent) 6%, rgba(24,29,37,0.85)) 0%, rgba(16,20,27,0.9) 100%);
  display: grid; grid-template-columns: 0.82fr 1.18fr; gap: 52px; align-items: center;
}
.da-full-glow {
  position: absolute; top: -45%; right: -8%; width: 460px; height: 460px;
  background: radial-gradient(circle, color-mix(in oklch, var(--accent) 16%, transparent), transparent 65%);
  filter: blur(22px); pointer-events: none;
}
.da-full-left, .da-full-right { position: relative; z-index: 1; min-width: 0; }
.da-full-badge {
  display: inline-flex; align-items: center;
  font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; font-weight: 600;
  letter-spacing: 0.1em; text-transform: uppercase; color: #0a0d12;
  background: var(--accent); padding: 5px 11px; border-radius: 999px;
}
.da-full-name {
  font-family: 'Geist', system-ui; font-size: 30px; font-weight: 600;
  letter-spacing: -0.025em; color: var(--ink); margin-top: 18px; line-height: 1.05;
}
.da-full-pilotline {
  font-family: 'Geist', system-ui; font-size: 14.5px; font-weight: 500;
  color: var(--accent); margin-top: 10px; letter-spacing: -0.01em;
}
.da-full .da-price-amt { margin-top: 12px; }
.da-full .da-price-amt .num { font-size: 56px; }
.da-full-tag {
  font-family: 'Geist', system-ui; font-size: 15px; line-height: 1.55;
  color: rgba(238,242,247,0.8); margin: 16px 0 0; max-width: 420px; text-wrap: pretty;
}
.da-full .da-btn-primary { margin-top: 26px; max-width: 300px; }
.da-full-note {
  font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10.5px;
  letter-spacing: 0.08em; text-transform: uppercase; color: rgba(238,242,247,0.6); margin: 14px 0 0;
}
.da-full-feats-title {
  font-family: 'Geist', system-ui; font-size: 13px; font-weight: 600; color: var(--ink);
  margin-bottom: 18px; letter-spacing: -0.005em;
}
.da-full-feats { grid-template-columns: 1fr 1fr; column-gap: 32px; row-gap: 13px; }
@media (max-width: 860px) {
  .da-full { grid-template-columns: 1fr; gap: 30px; padding: 32px 26px; }
  .da-full-feats { grid-template-columns: 1fr; }
  .da-full .da-btn-primary { max-width: none; }
}

/* --- £285 + includes on top row, 3-month pilot full-width below --- */
.da-full-3col { grid-template-columns: 1fr 1.04fr; gap: 0; padding: 0; align-items: stretch; }
.da-full-col { position: relative; z-index: 1; min-width: 0; display: flex; flex-direction: column; padding: 38px 36px; }
.da-full-col + .da-full-col { border-left: 1px solid rgba(255,255,255,0.08); }
.da-full-col.da-full-pilot {
  grid-column: 1 / -1; border-left: none; border-top: 1px solid rgba(255,255,255,0.08);
  background: color-mix(in oklch, var(--accent) 5%, transparent);
  flex-direction: row; align-items: center; gap: 56px;
}
.da-full-pilot-info { flex: 1; min-width: 0; }
.da-full-pilot-action { flex-shrink: 0; width: 300px; display: flex; flex-direction: column; }
.da-full-main .da-full-cta { margin-top: auto; max-width: none; }
.da-full-main .da-full-note { margin-top: 12px; margin-bottom: 0; }
.da-full-list .da-full-feats-title { margin-bottom: 18px; }
.da-full-list .da-price-feats { gap: 13px; }
.da-full-pilot-pill { display: inline-flex; align-items: center; gap: 7px; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent); }
.da-full-pilot-pill .dot { width: 6px; height: 6px; border-radius: 999px; background: var(--accent); box-shadow: 0 0 8px var(--accent); }
.da-full-pilot-title { font-family: 'Geist', system-ui; font-size: 22px; font-weight: 600; letter-spacing: -0.02em; color: var(--ink); margin-top: 14px; line-height: 1.12; }
.da-full-pilot-info .da-full-tag { max-width: 620px; }
.da-full-pilot-price { margin-top: 18px; display: flex; justify-content: flex-end; align-items: baseline; gap: 10px; }
.da-full-pilot-price .lbl { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(238,242,247,0.6); }
.da-full-pilot-price .amt { display: inline-flex; align-items: baseline; }
.da-full-pilot-price .cur { font-family: 'Geist', system-ui; font-size: 20px; font-weight: 500; color: rgba(238,242,247,0.6); }
.da-full-pilot-price .num { font-family: 'Geist', system-ui; font-size: 46px; font-weight: 600; letter-spacing: -0.04em; color: var(--ink); line-height: 1; }
@media (max-width: 920px) {
  .da-full-3col { grid-template-columns: 1fr; }
  .da-full-col { padding: 30px 26px; }
  .da-full-col + .da-full-col { border-left: none; border-top: 1px solid rgba(255,255,255,0.08); }
  .da-full-main .da-full-cta { margin-top: 22px; }
  .da-full-pilot { flex-direction: column; align-items: stretch; gap: 22px; }
  .da-full-pilot-action { width: auto; }
  .da-full-pilot-price { justify-content: flex-start; margin-top: 16px; }
}

/* =====================================================================
   FULL DESKAGENT SHOWCASE — the complete system (.da-fd) + ecosystem (.da-eco)
   ===================================================================== */
.da-fd {
  position: relative; margin-top: 26px; border-radius: 26px; overflow: hidden;
  padding: 48px 48px 44px;
  border: 1px solid color-mix(in oklch, var(--accent) 26%, transparent);
  background: linear-gradient(180deg, rgba(22,27,35,0.72) 0%, rgba(14,18,25,0.86) 100%);
}
.da-fd-glow { position: absolute; top: -32%; left: 50%; transform: translateX(-50%); width: 760px; height: 520px; background: radial-gradient(ellipse at center, color-mix(in oklch, var(--accent) 12%, transparent), transparent 70%); filter: blur(30px); pointer-events: none; }

/* top — two columns: description left, price + value summary right */
.da-fd-top { position: relative; z-index: 1; display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 48px; align-items: start; }
.da-fd-top-left { min-width: 0; }
.da-fd-title { font-family: 'Geist', system-ui; font-size: clamp(26px, 2.8vw, 38px); font-weight: 600; letter-spacing: -0.03em; color: var(--ink); margin: 18px 0 0; line-height: 1.05; text-wrap: balance; }
.da-fd-sub { font-family: 'Geist', system-ui; font-size: 16px; line-height: 1.55; color: rgba(238,242,247,0.66); margin: 16px 0 0; max-width: 560px; text-wrap: pretty; }

/* price card (top-right) */
.da-fd-top-right { min-width: 0; }
.da-fd-price { border-radius: 18px; padding: 26px 26px 24px; border: 1px solid color-mix(in oklch, var(--accent) 30%, transparent); background: linear-gradient(180deg, color-mix(in oklch, var(--accent) 7%, rgba(22,27,35,0.6)) 0%, rgba(14,18,25,0.7) 100%); box-shadow: inset 0 0 60px -30px var(--accent); }
.da-fd-price-amt { display: flex; align-items: baseline; gap: 4px; color: var(--ink); }
.da-fd-price-amt .cur { font-family: 'Geist', system-ui; font-size: 30px; font-weight: 500; color: rgba(238,242,247,0.72); }
.da-fd-price-amt .num { font-family: 'Geist', system-ui; font-size: 62px; font-weight: 600; letter-spacing: -0.045em; line-height: 0.9; }
.da-fd-price-amt .per { font-family: 'Geist', system-ui; font-size: 16px; font-weight: 500; color: rgba(238,242,247,0.6); margin-left: 4px; }
.da-fd-price-note { font-family: 'Geist', system-ui; font-size: 13px; line-height: 1.45; color: rgba(238,242,247,0.72); margin: 12px 0 0; }
.da-fd-price-rule { height: 1px; background: rgba(255,255,255,0.1); margin: 20px 0; }
.da-fd-value-line { font-family: 'Geist', system-ui; font-size: 16px; font-weight: 500; line-height: 1.35; color: var(--ink); letter-spacing: -0.01em; }
.da-fd-value-line .accent { font-weight: 600; }
.da-fd-value-pills { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; }
.da-fd-vpill { display: inline-flex; align-items: center; gap: 5px; font-family: 'Geist', system-ui; font-size: 11.5px; font-weight: 500; color: rgba(238,242,247,0.82); padding: 5px 10px; border-radius: 999px; background: rgba(255,255,255,0.04); border: 1px solid var(--border-strong); }
.da-fd-vpill .x { color: var(--accent); font-weight: 700; }
.da-fd-value-foot { font-family: 'Geist', system-ui; font-size: 12px; line-height: 1.5; color: rgba(238,242,247,0.6); margin: 14px 0 0; }

/* ecosystem diagram */
.da-eco { position: relative; margin-top: 32px; padding: 8px 0 4px; overflow: visible; }
.da-eco-svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; z-index: 1; }
.da-eco-row { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1.25fr 1fr; gap: 40px; align-items: center; }
.da-eco-col { display: flex; flex-direction: column; min-width: 0; }
.da-eco-inputs { gap: 12px; }
.da-eco-outputs { gap: 16px; }
.da-eco-center { align-items: center; gap: 20px; }
.da-eco-caption { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 9.5px; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(238,242,247,0.6); margin-bottom: 4px; }
.da-eco-outputs .da-eco-caption { text-align: right; }
.da-eco-chip { display: flex; align-items: center; gap: 11px; padding: 11px 13px; border-radius: 13px; background: linear-gradient(180deg, rgba(26,32,41,0.92), rgba(16,20,27,0.94)); border: 1px solid color-mix(in oklch, var(--accent) 18%, transparent); }
.da-eco-chip.is-hq { border-color: color-mix(in oklch, var(--hq-purple) 30%, transparent); }
.da-eco-chip.is-out { border-color: rgba(255,255,255,0.09); }
.da-eco-ico { flex-shrink: 0; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: color-mix(in oklch, var(--accent) 12%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 26%, transparent); }
.da-eco-ico.is-hq { background: color-mix(in oklch, var(--hq-purple) 12%, transparent); border-color: color-mix(in oklch, var(--hq-purple) 30%, transparent); }
.da-eco-txt { display: flex; flex-direction: column; min-width: 0; }
.da-eco-txt .t { font-family: 'Geist', system-ui; font-size: 14px; font-weight: 600; color: var(--ink); letter-spacing: -0.01em; }
.da-eco-txt .s { font-family: 'Geist', system-ui; font-size: 11.5px; color: rgba(238,242,247,0.6); }
.da-eco-hub { text-align: center; padding: 22px; border-radius: 18px; width: 100%;
  background: radial-gradient(ellipse at 50% 0%, color-mix(in oklch, var(--accent) 14%, transparent), transparent 70%), var(--surface-card);
  border: 1px solid color-mix(in oklch, var(--accent) 50%, transparent);
  box-shadow: inset 0 0 50px -20px var(--accent), 0 24px 60px -28px color-mix(in oklch, var(--accent) 70%, transparent); }
.da-eco-hub-ico { display: inline-grid; place-items: center; width: 46px; height: 46px; border-radius: 13px; background: color-mix(in oklch, var(--accent) 16%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 36%, transparent); }
.da-eco-hub-name { font-family: 'Geist', system-ui; font-size: 19px; font-weight: 600; letter-spacing: -0.02em; color: var(--ink); margin-top: 12px; }
.da-eco-hub-sub { font-family: 'Geist', system-ui; font-size: 12px; line-height: 1.45; color: rgba(238,242,247,0.72); margin-top: 8px; text-wrap: pretty; }

/* best-bits benefits */
.da-fd-benefits { position: relative; z-index: 1; margin-top: 30px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.da-fd-benefit { padding: 22px 20px; border-radius: 16px; background: rgba(255,255,255,0.018); border: 1px solid var(--border); }
.da-fd-bico { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: color-mix(in oklch, var(--accent) 12%, transparent); border: 1px solid color-mix(in oklch, var(--accent) 28%, transparent); }
.da-fd-benefit .t { font-family: 'Geist', system-ui; font-size: 15px; font-weight: 600; color: var(--ink); letter-spacing: -0.012em; margin-top: 14px; }
.da-fd-benefit .d { font-family: 'Geist', system-ui; font-size: 12.5px; line-height: 1.5; color: rgba(238,242,247,0.72); margin-top: 8px; text-wrap: pretty; }

/* bottom — start with the pilot band */
.da-fd-pilot { position: relative; z-index: 1; margin-top: 28px; padding: 30px 30px; border-radius: 18px; border: 1px solid color-mix(in oklch, var(--accent) 28%, transparent); background: linear-gradient(180deg, color-mix(in oklch, var(--accent) 8%, rgba(20,25,33,0.7)), rgba(14,18,25,0.8)); display: flex; align-items: center; justify-content: space-between; gap: 48px; flex-wrap: wrap; }
.da-fd-pilot-info { flex: 1; min-width: 280px; }
.da-fd-pilot-pill { display: inline-flex; align-items: center; gap: 7px; font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent); }
.da-fd-pilot-pill .dot { width: 6px; height: 6px; border-radius: 999px; background: var(--accent); box-shadow: 0 0 8px var(--accent); }
.da-fd-pilot-title { font-family: 'Geist', system-ui; font-size: 24px; font-weight: 600; letter-spacing: -0.025em; color: var(--ink); margin-top: 13px; line-height: 1.08; }
.da-fd-pilot-p { font-family: 'Geist', system-ui; font-size: 14px; line-height: 1.55; color: rgba(238,242,247,0.66); margin: 12px 0 0; max-width: 620px; text-wrap: pretty; }
.da-fd-pilot-action { flex-shrink: 0; width: 280px; display: flex; flex-direction: column; align-items: stretch; }
.da-fd-pilot-price { display: flex; align-items: baseline; justify-content: center; gap: 9px; margin-bottom: 14px; }
.da-fd-pilot-price .lbl { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(238,242,247,0.6); }
.da-fd-pilot-price .amt { display: inline-flex; align-items: baseline; }
.da-fd-pilot-price .cur { font-family: 'Geist', system-ui; font-size: 22px; font-weight: 500; color: rgba(238,242,247,0.6); }
.da-fd-pilot-price .num { font-family: 'Geist', system-ui; font-size: 50px; font-weight: 600; letter-spacing: -0.04em; color: var(--ink); line-height: 1; }
.da-fd-pilot-sub { font-family: 'Geist Mono', ui-monospace, monospace; font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(238,242,247,0.6); margin-top: 10px; text-align: center; }

/* entrance reveal (JS toggles .is-in) */
.da-eco-chip, .da-eco-hub, .da-eco .da-eco-caption { opacity: 0; transform: translateY(10px) scale(0.96); transition: opacity 560ms cubic-bezier(0.16,1,0.3,1), transform 560ms cubic-bezier(0.34,1.56,0.64,1); will-change: opacity, transform; }
.da-eco.is-in .da-eco-chip, .da-eco.is-in .da-eco-hub, .da-eco.is-in .da-eco-caption { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .da-eco-chip, .da-eco-hub, .da-eco .da-eco-caption { opacity: 1 !important; transform: none !important; } }

/* responsive */
@media (max-width: 860px) {
  .da-fd { padding: 34px 24px; }
  .da-fd-top { grid-template-columns: 1fr; gap: 26px; }
  .da-fd-price-amt .num { font-size: 54px; }
  .da-eco { padding: 26px 20px; }
  .da-eco-svg { display: none; }
  .da-eco-row { grid-template-columns: 1fr; gap: 20px; }
  .da-eco-inputs, .da-eco-outputs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .da-eco-inputs .da-eco-caption, .da-eco-outputs .da-eco-caption { grid-column: 1 / -1; text-align: left; }
  .da-fd-benefits { grid-template-columns: 1fr 1fr; }
  .da-fd-pilot { gap: 24px; padding: 26px 22px; }
  .da-fd-pilot-action { width: 100%; }
  .da-fd-pilot-price { justify-content: flex-start; }
}
@media (max-width: 520px) {
  .da-eco-inputs, .da-eco-outputs { grid-template-columns: 1fr; }
  .da-fd-benefits { grid-template-columns: 1fr; }
}