/* ============================================
   GALBUST — Design tokens
   Paleta oficial: manual de marca v1.0
   Tokens semánticos + modo claro/oscuro.
   ============================================ */
:root{
  /* --- Marca (valores fijos, no cambian con el tema) --- */
  --azul-profundo: #0B2E4F;
  --azul-profundo-2: #0e3a63;
  --cian: #12B3C8;
  --tinta: #111318;
  --niebla: #F4F7FA;

  /* --- Tokens semánticos: tema claro --- */
  --bg: #ffffff;
  --bg-alt: #F4F7FA;
  --surface: #ffffff;
  --surface-2: #F4F7FA;
  --border: #cbd6e0;
  --heading: #0B2E4F;
  --text: #111318;
  --text-2: #3c4a56;
  --text-3: #4f5e6b;
  --accent: #0a7081;              /* cian oscurecido: contraste AA (5,7:1) sobre fondo claro */
  --accent-bright: #12B3C8;       /* cian de marca, para rellenos y superficies */
  --accent-ink: #062126;          /* texto sobre relleno cian */
  --accent-soft: rgba(10,112,129,.10);
  --band: #0B2E4F;                /* fondo de secciones oscuras */
  --band-2: #0e3a63;
  --shadow: 0 8px 24px -12px rgba(11,46,79,.35);

  /* --- Sobre fondo oscuro (bandas): estables en ambos temas --- */
  --on-dark-text: #eef3f7;
  --on-dark-muted: #bdd0df;
  --accent-on-dark: #5CDDEE;     /* cian claro para texto sobre bandas oscuras (>=7:1) */
  --on-dark-border: rgba(244,247,250,.14);

  --font-display: 'Poppins', 'Inter', system-ui, sans-serif;
  --font-body: 'Poppins', 'Inter', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

  --wrap: 1180px;
  --radius: 14px;
  --radius-sm: 8px;

  --ease: cubic-bezier(.22,.9,.3,1);
  color-scheme: light;
}

/* Tema oscuro por preferencia del sistema (salvo que se fuerce claro) */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg: #0A1420;
    --bg-alt: #0F2133;
    --surface: #142A3F;
    --surface-2: #112336;
    --border: rgba(233,241,247,.26);
    --heading: #ffffff;
    --text: #E8EFF5;
    --text-2: #bed0dd;
    --text-3: #a3b8c9;
    --accent: #3AD1E4;
    --accent-bright: #3AD1E4;
    --accent-ink: #05161c;
    --accent-soft: rgba(58,209,228,.14);
    --band: #0D2742;
    --band-2: #0F3150;
    --shadow: 0 10px 30px -14px rgba(0,0,0,.7);
    color-scheme: dark;
  }
}

/* Tema oscuro forzado por el usuario (botón) */
:root[data-theme="dark"]{
  --bg: #0A1420;
  --bg-alt: #0F2133;
  --surface: #142A3F;
  --surface-2: #112336;
  --border: rgba(233,241,247,.26);
  --heading: #ffffff;
  --text: #E8EFF5;
  --text-2: #bed0dd;
  --text-3: #a3b8c9;
  --accent: #3AD1E4;
  --accent-bright: #3AD1E4;
  --accent-ink: #05161c;
  --accent-soft: rgba(58,209,228,.14);
  --band: #0D2742;
  --band-2: #0F3150;
  --shadow: 0 10px 30px -14px rgba(0,0,0,.7);
  color-scheme: dark;
}

*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; scroll-padding-top: 84px; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  *, *::before, *::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important;
  }
}

body{
  margin:0;
  font-family: var(--font-body);
  color: var(--text);
  background: var(--bg);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  transition: background .3s var(--ease), color .3s var(--ease);
}

h1,h2,h3{
  font-family: var(--font-display);
  font-weight: 600; line-height: 1.15; margin: 0 0 .5em;
  color: var(--heading);
}
h1{ font-size: clamp(2.1rem, 4.6vw, 3.4rem); font-weight:700; letter-spacing:-.01em; text-wrap: balance; }
h2{ font-size: clamp(1.6rem, 3.2vw, 2.3rem); text-wrap: balance; }
h3{ font-size: 1.15rem; margin-bottom:.35em; }
p{ margin: 0 0 1em; }
a{ color: inherit; }
ul{ margin:0; padding:0; }
img{ max-width:100%; }

.wrap{ max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }
.visually-hidden{
  position:absolute; width:1px; height:1px; margin:-1px; padding:0;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

.skip-link{
  position:absolute; left:-999px; top:0; background: var(--azul-profundo); color:#fff;
  padding:12px 18px; z-index:300; border-radius:0 0 8px 0;
}
.skip-link:focus{ left:0; }

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

/* ---------- Header ---------- */
.site-header{
  position: sticky; top:0; z-index:100;
  background: transparent; border-bottom: 1px solid transparent;
  transition: background .3s var(--ease), border-color .3s var(--ease);
}
.site-header.scrolled{
  background: color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
}
.header-inner{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding: 14px 24px; }
.brand{ display:flex; }
.brand img{ display:block; height:30px; width:auto; }
.brand .logo-dark{ display:none; }
:root[data-theme="dark"] .brand .logo-light{ display:none; }
:root[data-theme="dark"] .brand .logo-dark{ display:block; }
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .brand .logo-light{ display:none; }
  :root:not([data-theme="light"]) .brand .logo-dark{ display:block; }
}

.nav{ display:flex; align-items:center; gap: 26px; }
.nav > a, .menu-trigger{
  text-decoration:none; color: var(--heading); font-size:.95rem; font-weight:500;
  position:relative; padding: 4px 0; background:none; border:0; font-family:inherit; cursor:pointer;
}
.nav > a:not(.nav-cta)::after, .menu-trigger::after{
  content:''; position:absolute; left:0; right:100%; bottom:-2px; height:2px; background: var(--accent);
  transition: right .25s var(--ease);
}
.nav > a:not(.nav-cta):hover::after, .menu-trigger:hover::after, .menu-trigger[aria-expanded="true"]::after{ right:0; }
.nav > a.active:not(.nav-cta){ color: var(--accent); }
.nav > a.active:not(.nav-cta)::after{ right:0; }
.nav-cta{
  background: var(--azul-profundo); color:#fff !important; padding:10px 18px; border-radius:999px;
  font-weight:600; transition: background .2s var(--ease), transform .2s var(--ease);
}
.nav-cta:hover{ background: var(--accent-bright); color: var(--accent-ink) !important; transform: translateY(-1px); }
:root[data-theme="dark"] .nav-cta{ background: var(--accent-bright); color: var(--accent-ink) !important; }

/* Mega menú */
.menu-trigger .caret{ display:inline-block; margin-left:6px; transition: transform .2s var(--ease); }
.menu-trigger[aria-expanded="true"] .caret{ transform: rotate(180deg); }
.mega{
  position:absolute; left:0; right:0; top:100%;
  background: var(--surface); border-top:1px solid var(--border); border-bottom:1px solid var(--border);
  box-shadow: var(--shadow); padding: 30px 0;
}
.mega-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap: 34px; }
.mega-col h3{
  font-family: var(--font-mono); font-size:.76rem; letter-spacing:.08em; text-transform:uppercase;
  color: var(--accent); margin-bottom:14px;
}
.mega-col ul{ list-style:none; display:flex; flex-direction:column; gap:9px; }
.mega-col a{
  text-decoration:none; color: var(--text-2); font-size:.94rem;
  display:inline-block; border-bottom:1px solid transparent;
  transition: color .2s var(--ease), border-color .2s var(--ease);
}
.mega-col a:hover{ color: var(--accent); border-color: var(--accent); }

/* Toggle de tema */
.theme-toggle{
  width:38px; height:38px; border-radius:50%; border:1px solid var(--border);
  background: var(--surface); color: var(--heading); cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  transition: border-color .2s var(--ease), transform .2s var(--ease);
}
.theme-toggle:hover{ border-color: var(--accent); transform: translateY(-1px); }
.theme-toggle svg{ width:18px; height:18px; }
.theme-toggle .icon-moon{ display:none; }
:root[data-theme="dark"] .theme-toggle .icon-sun{ display:none; }
:root[data-theme="dark"] .theme-toggle .icon-moon{ display:block; }
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .theme-toggle .icon-sun{ display:none; }
  :root:not([data-theme="light"]) .theme-toggle .icon-moon{ display:block; }
}

.nav-toggle{
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:40px; height:40px; border:0; background:none; cursor:pointer;
}
.nav-toggle span{
  display:block; width:22px; height:2px; background: var(--heading); margin:0 auto;
  transition: transform .25s var(--ease), opacity .25s var(--ease);
}

/* ---------- Botones ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 14px 26px; border-radius:999px; font-weight:600; font-size:.98rem;
  text-decoration:none; border:2px solid transparent; cursor:pointer; font-family:inherit;
  transition: transform .2s var(--ease), background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease);
}
.btn-primary{ background: var(--accent-bright); color: var(--accent-ink); }
.btn-primary:hover{ filter: brightness(.94); transform: translateY(-2px); }
.btn-ghost{ border-color: var(--heading); color: var(--heading); }
.btn-ghost:hover{ background: var(--heading); color: var(--bg); transform: translateY(-2px); }
.btn-block{ width:100%; }

/* ---------- Hero ---------- */
.hero{
  padding: 96px 0 72px; overflow:hidden; position:relative;
  background:
    radial-gradient(760px 420px at 82% -8%, var(--accent-soft), transparent 60%),
    radial-gradient(620px 480px at -6% 30%, rgba(11,46,79,.10), transparent 65%),
    linear-gradient(180deg, var(--bg-alt), var(--bg) 70%);
}
.hero-inner{ display:grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items:center; }

.eyebrow{
  font-family: var(--font-mono); font-size:.78rem; letter-spacing:.08em; text-transform:uppercase;
  color: var(--accent); font-weight:500; margin-bottom: 14px;
}
.hero-lead{ font-size: 1.12rem; color: var(--text-2); max-width: 46ch; }
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; margin: 26px 0 18px; }
.hero-note{ font-size:.88rem; color: var(--text-3); }

.hero-visual{ display:flex; justify-content:center; }
.diagram{ width:100%; max-width:600px; height:auto; overflow:visible; }

.chaos-card{ fill: var(--surface); stroke: var(--text-3); stroke-width:1.5; stroke-dasharray:3 3; }
.chaos-label{ font-family: var(--font-mono); font-size:11px; fill: var(--text-3); text-anchor:middle; dominant-baseline:middle; letter-spacing:.03em; }
.chaos{ opacity:0; animation: chaosIn .6s var(--ease) forwards; }
.chaos:nth-of-type(1){ animation-delay:.05s; }
.chaos:nth-of-type(2){ animation-delay:.15s; }
.chaos:nth-of-type(3){ animation-delay:.25s; }
.chaos:nth-of-type(4){ animation-delay:.35s; }
@keyframes chaosIn{ from{ opacity:0; transform: translateY(6px);} to{ opacity:1; transform:translateY(0);} }

.link{ fill:none; stroke-width:2; stroke-linecap:round; }
.link-in{ stroke: var(--text-3); stroke-dasharray:260; stroke-dashoffset:260; animation: draw 1s var(--ease) .5s forwards; }
.link-out{ stroke: var(--accent); stroke-dasharray:260; stroke-dashoffset:260; animation: draw .9s var(--ease) 1.15s forwards; }
@keyframes draw{ to{ stroke-dashoffset:0; } }

.hub{ opacity:0; animation: hubIn .5s var(--ease) .95s forwards; transform-origin: 60px 60px; }
@keyframes hubIn{ from{ opacity:0; transform: scale(.7);} to{ opacity:1; transform:scale(1);} }
.hub-ring{ fill: var(--azul-profundo); stroke: var(--accent-bright); stroke-width:2; }
.hub-tab{ fill: var(--accent-bright); }

.node{ opacity:0; animation: nodeIn .5s var(--ease) forwards; }
.node:nth-of-type(1){ animation-delay:1.35s; }
.node:nth-of-type(2){ animation-delay:1.45s; }
.node:nth-of-type(3){ animation-delay:1.55s; }
.node:nth-of-type(4){ animation-delay:1.65s; }
.node:nth-of-type(5){ animation-delay:1.75s; }
@keyframes nodeIn{ from{ opacity:0; transform: translateX(-8px);} to{ opacity:1; transform: translateX(0);} }
.node-card{ fill: var(--surface); stroke: var(--accent); stroke-width:1.5; }
.node-label{ font-family: var(--font-mono); font-size:12px; fill: var(--heading); text-anchor:middle; dominant-baseline:middle; font-weight:500; }

@media (prefers-reduced-motion: reduce){
  .chaos, .hub, .node{ opacity:1; animation:none; }
  .link-in, .link-out{ stroke-dashoffset:0; animation:none; }
}

/* ---------- Barra de métricas ---------- */
.metrics{
  border-top:1px solid var(--border); border-bottom:1px solid var(--border);
  background: var(--surface-2); padding: 34px 0;
}
.metrics-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap: 24px; }
.metric{ text-align:center; }
.metric-value{
  font-family: var(--font-display); font-weight:700; color: var(--heading);
  font-size: clamp(2rem, 4vw, 2.9rem); line-height:1; margin:0 0 6px;
  font-variant-numeric: tabular-nums;
}
.metric-value .unit{ color: var(--accent); }
.metric-label{ margin:0; font-size:.9rem; color: var(--text-2); }
.metrics-note{
  margin: 22px 0 0; text-align:center; font-family: var(--font-mono);
  font-size:.8rem; color: var(--text-3);
}

/* ---------- Banda declarativa ---------- */
.statement{ background: var(--band-2); padding: 72px 0; }
.statement-text{
  margin:0; text-align:center; color:#fff; text-wrap:balance;
  font-family: var(--font-display); font-weight:600;
  font-size: clamp(1.6rem, 4vw, 2.6rem); line-height:1.3;
}
.statement-text .hl{ color: var(--accent-bright); }

/* ---------- Marquee ---------- */
.marquee{
  background: var(--band); color: var(--on-dark-text); overflow:hidden;
  padding: 18px 0; border-top:1px solid var(--on-dark-border); border-bottom:1px solid var(--on-dark-border);
}
.marquee-track{
  display:flex; width:max-content; gap:0;
  animation: marquee 32s linear infinite;
}
.marquee:hover .marquee-track, .marquee:focus-within .marquee-track{ animation-play-state: paused; }
.marquee-group{ display:flex; gap:0; }
.marquee-item{
  font-family: var(--font-mono); font-size:.92rem; letter-spacing:.04em;
  padding: 0 28px; white-space:nowrap; color: var(--on-dark-muted);
}
.marquee-item::after{ content:'·'; margin-left:28px; color: var(--accent-bright); }
@keyframes marquee{ from{ transform: translateX(0); } to{ transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce){
  .marquee-track{ animation:none; width:100%; overflow-x:auto; }
}

/* ---------- Secciones ---------- */
.section{ padding: 84px 0; }
.section-alt{ background: var(--bg-alt); }
.section-dark{ background: var(--band); color: var(--on-dark-text); }
.section-dark h2, .section-dark h3{ color:#fff; }
.section-dark .section-lead{ color: var(--on-dark-muted); }
.section-dark .section-tag{ color: var(--accent-bright); }

.section-tag{
  font-family: var(--font-mono); font-size:.78rem; letter-spacing:.06em; text-transform:uppercase;
  color: var(--accent); margin-bottom:10px; font-weight:500;
}
.section-lead{ max-width:64ch; color: var(--text-2); font-size:1.05rem; }

/* reveal-on-scroll */
.reveal{ opacity:0; transform: translateY(18px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.reveal.in-view{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; } }

/* Pain grid */
.pain-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap:20px; margin-top:36px; }
.pain-card{
  background: var(--surface-2); border:1px solid var(--border); border-radius: var(--radius);
  padding: 26px 24px; transition: border-color .2s var(--ease), transform .2s var(--ease);
}
.pain-card:hover{ border-color: var(--accent); transform: translateY(-3px); }
.pain-tag{ font-family: var(--font-mono); color: var(--accent); font-weight:600; margin:0 0 10px; }
.pain-text{ margin:0; color: var(--text-2); }

/* Steps */
.steps{ list-style:none; margin: 40px 0 0; padding:0; display:flex; flex-direction:column; }
.step{ display:flex; gap:22px; padding: 22px 0; border-top:1px solid var(--on-dark-border); align-items:flex-start; }
.step:last-child{ border-bottom:1px solid var(--on-dark-border); }
.step-num{
  font-family: var(--font-mono); font-size:1rem; color: var(--accent-bright); font-weight:600;
  min-width: 2.4ch; padding-top:2px;
}
.step h3{ margin-bottom:.25em; }
.step p{ margin:0; color: var(--on-dark-muted); max-width: 62ch; }

/* Demo con pestañas */
.demo{ margin-top: 40px; }
.tablist{
  display:flex; gap:8px; flex-wrap:wrap; margin-bottom:18px;
  border-bottom:1px solid var(--border); padding-bottom:12px;
}
.tab{
  font-family: var(--font-mono); font-size:.86rem; letter-spacing:.03em;
  padding:9px 16px; border-radius:999px; border:1px solid var(--border);
  background: var(--surface); color: var(--text-2); cursor:pointer;
  transition: background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease);
}
.tab:hover{ border-color: var(--accent); color: var(--accent); }
.tab[aria-selected="true"]{ background: var(--accent-bright); border-color: var(--accent-bright); color: var(--accent-ink); font-weight:600; }

.tabpanel{
  background: var(--surface); border:1px solid var(--border); border-radius: var(--radius);
  padding: 26px; box-shadow: var(--shadow);
}
.panel-head{
  display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  padding-bottom:14px; margin-bottom:18px; border-bottom:1px solid var(--border);
}
.panel-title{ margin:0; font-family: var(--font-display); font-weight:600; color: var(--heading); }
.panel-meta{ margin:0; font-family: var(--font-mono); font-size:.8rem; color: var(--text-3); }

/* tabla OT */
.ot-table{ width:100%; border-collapse: collapse; font-size:.9rem; }
.ot-table th{
  text-align:left; font-family: var(--font-mono); font-size:.74rem; text-transform:uppercase;
  letter-spacing:.06em; color: var(--text-3); font-weight:500; padding: 0 12px 10px 0;
}
.ot-table td{ padding: 11px 12px 11px 0; border-top:1px solid var(--border); color: var(--text-2); }
.ot-table td:first-child{ font-family: var(--font-mono); color: var(--heading); font-weight:500; }
.pill{
  display:inline-block; font-family: var(--font-mono); font-size:.74rem; font-weight:500;
  padding: 3px 10px; border-radius:999px; white-space:nowrap;
}
.pill-ok{ background: var(--accent-soft); color: var(--accent); }
.pill-warn{ background: rgba(217,138,82,.18); color:#7f4608; }
.pill-crit{ background: rgba(192,57,43,.13); color:#9c261a; }
:root[data-theme="dark"] .pill-warn{ color:#f2b263; }
:root[data-theme="dark"] .pill-crit{ color:#ff8b7d; }
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .pill-warn{ color:#f2b263; }
  :root:not([data-theme="light"]) .pill-crit{ color:#ff8b7d; }
}

/* plan (gantt simple) */
.plan-row{ display:grid; grid-template-columns: 170px 1fr; gap:16px; align-items:center; padding:10px 0; border-top:1px solid var(--border); }
.plan-row:first-of-type{ border-top:0; }
.plan-label{ font-size:.88rem; color: var(--text-2); }
.plan-track{ background: var(--surface-2); border-radius:999px; height:14px; position:relative; overflow:hidden; }
.plan-bar{ position:absolute; top:0; bottom:0; border-radius:999px; background: var(--accent-bright); }
.plan-bar.is-late{ background:#d98a52; }
.plan-scale{
  display:grid; grid-template-columns: 170px 1fr; gap:16px; margin-top:12px;
  font-family: var(--font-mono); font-size:.72rem; color: var(--text-3);
}
.plan-weeks{ display:flex; justify-content:space-between; }

/* KPIs */
.kpi-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:16px; }
.kpi{ background: var(--surface-2); border:1px solid var(--border); border-radius: var(--radius-sm); padding:18px; }
.kpi-name{ margin:0 0 6px; font-family: var(--font-mono); font-size:.74rem; text-transform:uppercase; letter-spacing:.06em; color: var(--text-3); }
.kpi-value{ margin:0; font-family: var(--font-display); font-weight:700; font-size:1.7rem; color: var(--heading); font-variant-numeric: tabular-nums; }
.kpi-value small{ font-size:.9rem; font-weight:500; color: var(--text-3); }
.kpi-trend{ margin:6px 0 0; font-size:.8rem; font-family: var(--font-mono); color: var(--accent); }
.spark{ width:100%; height:38px; margin-top:10px; display:block; }
.spark path{ fill:none; stroke: var(--accent); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

.demo-note{
  margin: 14px 0 0; font-family: var(--font-mono); font-size:.8rem; color: var(--text-3);
}

/* Module grid */
.module-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:20px; margin-top:40px; }
.module-card{
  border:1px solid var(--border); border-radius: var(--radius); padding: 28px 24px; background: var(--surface);
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease), transform .2s var(--ease);
}
.module-card:hover{ border-color: var(--accent); box-shadow: var(--shadow); transform: translateY(-3px); }
.module-icon{
  display:flex; align-items:center; justify-content:center;
  width:44px; height:44px; margin-bottom:16px; border-radius: 12px;
  background: var(--accent-soft); color: var(--accent);
}
.module-icon svg{ width:22px; height:22px; }
.module-card p{ color: var(--text-2); margin:0; font-size:.96rem; }

/* Fortalezas numeradas */
.strengths{ display:grid; grid-template-columns: repeat(3,1fr); gap:24px; margin-top:40px; list-style:none; }
.strength{
  border-top:2px solid var(--accent); padding-top:20px;
}
.strength-num{
  font-family: var(--font-display); font-weight:700; font-size:2.4rem; line-height:1;
  color: var(--accent); margin:0 0 10px;
}
.strength h3{ margin-bottom:.4em; }
.strength p{ margin:0; color: var(--text-2); font-size:.96rem; }

/* IA section */
.ia-wrap{ display:grid; grid-template-columns: 1.1fr .9fr; gap:56px; align-items:center; }
.ia-list{ list-style:none; margin-top:20px; display:flex; flex-direction:column; gap:14px; }
.ia-list li{ padding-left:20px; position:relative; color: var(--on-dark-muted); }
.ia-list li::before{ content:''; position:absolute; left:0; top:.55em; width:8px; height:2px; background: var(--accent-bright); }
.ia-list strong{ color:#fff; }

.ia-panel{
  font-family: var(--font-mono); font-size:.86rem; background: rgba(0,0,0,.25);
  border:1px solid var(--on-dark-border); border-radius: var(--radius); padding: 22px;
}
.ia-panel-row{
  display:flex; justify-content:space-between; gap:12px; padding:9px 0;
  border-bottom:1px dashed var(--on-dark-border); color: var(--on-dark-muted);
}
.ia-panel-row:last-child{ border-bottom:0; }
.ia-ok{ color: var(--accent-bright); }
.ia-warn{ color:#f2b263; }

/* Calculadora de ROI */
.roi-wrap{ display:grid; grid-template-columns: 1fr 1fr; gap:48px; align-items:start; }
.roi-form{
  background: var(--surface); border:1px solid var(--border); border-radius: var(--radius);
  padding: 28px; display:flex; flex-direction:column; gap:18px;
}
.roi-field{ display:flex; flex-direction:column; gap:8px; }
.roi-field label{ font-size:.9rem; font-weight:500; color: var(--heading); }
.roi-field .hint{ font-size:.78rem; color: var(--text-3); font-family: var(--font-mono); }
.roi-field input[type="range"]{ width:100%; accent-color: var(--accent-bright); }
.roi-field input[type="number"]{
  font: inherit; padding:10px 12px; border-radius: var(--radius-sm);
  border:1px solid var(--border); background: var(--bg); color: var(--text);
}
.roi-out{
  background: var(--surface-2); border:1px solid var(--border); border-radius: var(--radius); padding:28px;
}
.roi-out-label{ margin:0 0 6px; font-family: var(--font-mono); font-size:.76rem; text-transform:uppercase; letter-spacing:.06em; color: var(--text-3); }
.roi-amount{
  margin:0 0 4px; font-family: var(--font-display); font-weight:700; color: var(--heading);
  font-size: clamp(1.8rem, 4vw, 2.6rem); line-height:1.1; font-variant-numeric: tabular-nums;
}
.roi-sub{ margin:0 0 20px; font-size:.9rem; color: var(--text-2); }
.roi-break{ list-style:none; display:flex; flex-direction:column; gap:10px; margin-bottom:20px; }
.roi-break li{ display:flex; justify-content:space-between; gap:12px; font-size:.9rem; color: var(--text-2); padding-bottom:10px; border-bottom:1px dashed var(--border); }
.roi-break li:last-child{ border-bottom:0; }
.roi-break b{ color: var(--heading); font-variant-numeric: tabular-nums; }
.roi-disclaimer{ margin:0; font-family: var(--font-mono); font-size:.8rem; color: var(--text-3); line-height:1.5; }

/* Industry grid */
.industry-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:18px; margin-top:36px; }
.industry-card{
  background: var(--surface-2); border-radius: var(--radius); padding:24px 20px;
  border:1px solid var(--border); transition: transform .2s var(--ease), border-color .2s var(--ease);
}
.industry-card:hover{ transform: translateY(-3px); border-color: var(--accent); }
.industry-card p{ margin:0; font-size:.92rem; color: var(--text-2); }
.industry-card-open{ background: var(--accent-soft); border-color: var(--accent); }

/* Testimonios / casos (plantillas, ocultas hasta tener material real) */
.testimonial-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:20px; margin-top:36px; }
.testimonial-card{
  background: var(--surface); border:1px solid var(--border); border-radius: var(--radius); padding:28px;
  display:flex; flex-direction:column; gap:16px;
}
.testimonial-quote{ margin:0; color: var(--text-2); font-size:1rem; }
.testimonial-who{ margin:0; font-size:.86rem; color: var(--text-3); }
.testimonial-who strong{ display:block; color: var(--heading); font-size:.95rem; }

/* Founders */
.founders{ display:grid; grid-template-columns: 1fr 1fr; gap:24px; margin-top:40px; }
.founder-card{ border:1px solid var(--on-dark-border); border-radius: var(--radius); padding:30px; }
.founder-photo{
  width:88px; height:88px; border-radius:50%; object-fit:cover;
  margin:0 0 16px; border:2px solid var(--accent-bright);
}
.founder-role{
  font-family: var(--font-mono); font-size:.82rem; color: var(--on-dark-muted);
  text-transform:uppercase; letter-spacing:.05em; margin-bottom:14px;
}
.founder-card p:not(.founder-role){ color: var(--on-dark-muted); }
.founder-link{
  display:inline-block; margin-top:6px; font-size:.88rem; font-weight:600; color: var(--accent-bright);
  text-decoration:none; border-bottom:1px solid transparent; transition: border-color .2s var(--ease);
}
.founder-link:hover{ border-color: var(--accent-bright); }
.founders-note{
  margin: 30px 0 0; text-align:center; font-family: var(--font-mono); font-size:.85rem;
  color: var(--on-dark-muted);
}
.founders-note strong{ color: var(--accent-bright); }

/* Contacto */
.contact-wrap{ display:grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items:start; }
.contact-direct{ margin-top: 30px; display:flex; flex-direction:column; gap:16px; }
.contact-line{
  display:flex; gap:14px; align-items:baseline; text-decoration:none; color:inherit;
  padding-bottom:14px; border-bottom:1px solid var(--border);
}
.contact-label{
  font-family: var(--font-mono); font-size:.8rem; text-transform:uppercase; letter-spacing:.05em;
  color: var(--accent); min-width:9ch;
}
.contact-value{ font-weight:500; }
a.contact-line:hover .contact-value{ color: var(--accent); }

.contact-form{
  background: var(--surface-2); border:1px solid var(--border); border-radius: var(--radius);
  padding: 30px; display:flex; flex-direction:column; gap:16px;
}
.contact-form label{ display:flex; flex-direction:column; gap:6px; font-size:.9rem; font-weight:500; color: var(--heading); }
.contact-form input, .contact-form textarea{
  font: inherit; padding: 12px 14px; border-radius: var(--radius-sm); border:1px solid var(--border);
  background: var(--bg); color: var(--text); resize: vertical;
}
.contact-form input:focus, .contact-form textarea:focus{ border-color: var(--accent); }
.form-status{ margin:0; font-size:.88rem; color: var(--heading); padding:10px 12px; border-radius: var(--radius-sm); }
.form-status.success{ background: var(--accent-soft); color: var(--heading); border:1px solid var(--accent); }
.form-status.error{ background: rgba(192,57,43,.08); color:#9c261a; border:1px solid rgba(192,57,43,.4); }
.field-error{ font-size:.82rem; font-weight:500; color:#9c261a; }
.contact-form input:invalid:not(:placeholder-shown){ border-color: rgba(192,57,43,.5); }
.req{ color:#9c261a; }
:root[data-theme="dark"] .req, :root[data-theme="dark"] .field-error{ color:#ff8b7d; }
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .req, :root:not([data-theme="light"]) .field-error{ color:#ff8b7d; }
}
.form-req-note{ margin:-4px 0 0; font-size:.78rem; color: var(--text-3); }

/* ---------- Footer ---------- */
.site-footer{ background: var(--band); color: var(--on-dark-muted); padding: 56px 0 32px; }
.footer-grid{ display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 36px; }
.footer-logo{ height:26px; width:auto; margin-bottom:16px; }
.footer-about{ font-size:.9rem; max-width: 34ch; }
.footer-col h3{
  font-family: var(--font-mono); font-size:.8rem; letter-spacing:.08em; text-transform:uppercase;
  color: var(--accent-bright); margin-bottom:14px;
}
.footer-col ul{ list-style:none; display:flex; flex-direction:column; gap:9px; }
.footer-col a{ text-decoration:none; color: var(--on-dark-muted); font-size:.9rem; }
.footer-col a:hover{ color:#fff; }
.footer-bottom{
  margin-top: 40px; padding-top: 22px; border-top:1px solid var(--on-dark-border);
  display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;
  font-size:.82rem; color: var(--on-dark-muted);
}
.footer-bottom p{ margin:0; }

/* ---------- Responsive ---------- */
@media (max-width: 980px){
  .hero-inner{ grid-template-columns:1fr; }
  .hero-visual{ order:-1; }
  .ia-wrap{ grid-template-columns:1fr; }
  .roi-wrap{ grid-template-columns:1fr; }
  .contact-wrap{ grid-template-columns:1fr; }
  .module-grid{ grid-template-columns: repeat(2,1fr); }
  .industry-grid{ grid-template-columns: repeat(2,1fr); }
  .testimonial-grid{ grid-template-columns:1fr; }
  .founders{ grid-template-columns:1fr; }
  .metrics-grid{ grid-template-columns: repeat(2,1fr); gap:28px; }
  .strengths{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns: 1fr 1fr; }
  .mega-grid{ grid-template-columns:1fr; gap:22px; }
}

@media (max-width: 720px){
  .nav{
    position:fixed; inset: 62px 0 0 0; background: var(--bg); flex-direction:column; align-items:flex-start;
    padding: 24px; gap:18px; transform: translateX(100%); transition: transform .3s var(--ease);
    border-top:1px solid var(--border); overflow-y:auto;
  }
  .nav.open{ transform: translateX(0); }
  .nav-toggle{ display:flex; }
  .nav-cta{ width:100%; text-align:center; }
  .mega{ position:static; box-shadow:none; border:0; padding: 8px 0 0; background:transparent; }
  .mega .wrap{ padding:0; }
  .pain-grid{ grid-template-columns:1fr; }
  .module-grid{ grid-template-columns:1fr; }
  .industry-grid{ grid-template-columns:1fr; }
  .kpi-grid{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr; }
  .plan-row, .plan-scale{ grid-template-columns: 110px 1fr; }
  .section{ padding: 60px 0; }
  .hero{ padding: 44px 0 56px; }
  .step{ gap:14px; }
  .tabpanel{ padding:18px; }
  .ot-wrap{ overflow-x:auto; }
}

/* --- Páginas internas (visión y misión, políticas) --- */
.page-hero{ padding: 72px 0 24px; background: linear-gradient(180deg, var(--bg-alt), var(--bg)); }
.page-hero h1{ margin: 8px 0 16px; }
.vm-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:24px; }
.vm-card{ border:1px solid var(--border, rgba(11,46,79,.14)); border-radius: var(--radius); padding:32px; background: var(--bg-alt); }
.vm-card h2{ margin: 6px 0 12px; font-size: 1.5rem; }
.legal{ max-width: 780px; }
.legal h2{ margin: 40px 0 12px; font-size: 1.4rem; scroll-margin-top: 90px; }
.legal p, .legal li{ line-height: 1.7; }
.legal ul{ padding-left: 20px; }
.legal-updated{ font-family: 'JetBrains Mono', monospace; font-size: .85rem; color: var(--text-3); }
.legal-index{ display:flex; flex-wrap:wrap; gap:8px 18px; padding-bottom:16px; border-bottom:1px solid rgba(128,128,128,.25); }

/* --- Fundadores: etiqueta de rol y trayectoria --- */
.founder-badge{
  display:inline-block; margin: 14px 0 0; padding: 3px 10px; border-radius: 999px;
  font-family: 'JetBrains Mono', monospace; font-size: .75rem; letter-spacing: .04em; text-transform: uppercase;
  background: var(--accent-bright); color: var(--accent-ink, #0B2E4F);
}
.timeline{ list-style:none; margin: 18px 0 18px; padding: 0 0 0 16px; border-left: 2px solid var(--on-dark-border); }
.timeline li{ position:relative; margin: 0 0 10px; color: var(--on-dark-muted); font-size: .92rem; line-height:1.5; }
.timeline li::before{ content:''; position:absolute; left:-22px; top:7px; width:8px; height:8px; border-radius:50%; background: var(--accent-bright); }
.timeline b{ display:block; color:#fff; font-weight:600; }

@media (max-width: 760px){ .vm-grid{ grid-template-columns:1fr; } }

/* --- Contraste reforzado --- */
.section-dark, .site-footer, .statement{ border-top:1px solid var(--on-dark-border); border-bottom:1px solid var(--on-dark-border); }
.pain-card, .module-card, .industry-card, .vm-card, .kpi, .tabpanel, .roi-out, .contact-form{ border-color: var(--border); }
.node-label{ font-size:12.5px; }

/* --- Texto sobre bandas oscuras: cian claro, legible en ambos temas --- */
.section-dark .section-tag, .statement-text .hl, .step-num, .ia-ok, .founder-link,
.founders-note strong, .footer-col h3{ color: var(--accent-on-dark); }
.founder-link:hover{ border-color: var(--accent-on-dark); }
.marquee-item::after, .ia-list li::before{ color: var(--accent-on-dark); }
.ia-list li::before{ background: var(--accent-on-dark); }
.footer-col a, .footer-about{ color: var(--on-dark-muted); }
.site-footer, .section-dark p, .section-dark li{ -webkit-font-smoothing: antialiased; }
/* Enlaces y texto de apoyo: nunca más claros que el fondo permite */
:root[data-theme="light"] .hero-note, :root[data-theme="light"] .metric-label{ color: var(--text-2); }

/* --- Botón "Agenda una demo": siempre destacado, en modo claro y oscuro --- */
.nav > a.nav-cta{
  background: var(--azul-profundo); color:#fff !important;
  border: 2px solid var(--accent-bright);
  box-shadow: 0 6px 18px -6px rgba(18,179,200,.75);
  font-weight:700; white-space:nowrap;
}
.nav > a.nav-cta::after{ display:none; }
.nav > a.nav-cta:hover{ background: var(--accent-bright); color: var(--accent-ink) !important; border-color: var(--accent-bright); box-shadow: 0 8px 22px -6px rgba(18,179,200,.9); }
:root[data-theme="dark"] .nav > a.nav-cta{
  background: var(--accent-bright); color: var(--accent-ink) !important;
  border-color: #fff; box-shadow: 0 0 0 3px rgba(58,209,228,.28), 0 8px 24px -6px rgba(58,209,228,.7);
}
:root[data-theme="dark"] .nav > a.nav-cta:hover{ background:#fff; border-color:#fff; color: var(--azul-profundo) !important; }
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .nav > a.nav-cta{
    background: var(--accent-bright); color: var(--accent-ink) !important;
    border-color: #fff; box-shadow: 0 0 0 3px rgba(58,209,228,.28), 0 8px 24px -6px rgba(58,209,228,.7);
  }
  :root:not([data-theme="light"]) .nav > a.nav-cta:hover{ background:#fff; border-color:#fff; color: var(--azul-profundo) !important; }
}
.nav > a.nav-cta{ padding: 11px 24px; border-radius: 999px; }
@media (max-width: 980px){ .nav > a.nav-cta{ width:100%; text-align:center; } }