/* ============================================================
   GlobalMusicWave — Landing · tema OSCURO espacial (antigravity-style)
   Fondo casi negro, auroras suaves, hairlines finos, tipografía
   grande y serena, acento violeta con glow. Unificado con la intro.
   ============================================================ */

:root{
  --paper:#08090e; --paper2:#0c0d14; --ink:#f1f2f7; --ink-soft:#aab0c0;
  --accent:#8f8bff; --accent-deep:#aaa6ff; --accent-soft:rgba(143,139,255,.13);
  --muted:#9097a8; --muted2:#676d7e; --hairline:rgba(255,255,255,.09);
  --line:rgba(255,255,255,.14); --line-strong:rgba(255,255,255,.22);
  --dark:#070810; --dark-soft:rgba(255,255,255,.08); --on-dark:#f1f2f7; --on-dark-mut:#9097a8;
  --da:#8f8bff; --da2:#b6b3ff; --band-soft:rgba(255,255,255,.66); --band-emph:#fff;
  /* sistema multicolor — una identidad por fase / dato (más luminosos sobre negro) */
  --c1:#7d78ff; --c1s:rgba(125,120,255,.14);  /* contrato  · indigo  */
  --c2:#27c5c2; --c2s:rgba(39,197,194,.14);    /* producción· teal    */
  --c3:#f0a83c; --c3s:rgba(240,168,60,.14);    /* ejecución · ámbar    */
  --c4:#ef6aa0; --c4s:rgba(239,106,160,.14);   /* auditoría · magenta  */
  --c5:#5a93ff; --c5s:rgba(90,147,255,.14);    /* pago TV   · azul     */
  --c6:#34c777; --c6s:rgba(52,199,119,.14);    /* liquidada · verde    */
  --mono:"Space Mono", monospace;
  --sans:"Schibsted Grotesk", system-ui, sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; background:var(--paper); }
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--sans); -webkit-font-smoothing:antialiased;
  font-size:17px; line-height:1.55; position:relative;
}
/* aura ambiental fija: el cielo espacial detrás de todo */
body::before{
  content:""; position:fixed; inset:0; z-index:-2; pointer-events:none;
  background:
    radial-gradient(60% 42% at 18% 8%, rgba(143,139,255,.16), transparent 60%),
    radial-gradient(55% 45% at 86% 18%, rgba(90,147,255,.12), transparent 62%),
    radial-gradient(70% 50% at 50% 108%, rgba(143,139,255,.10), transparent 60%);
}
body::after{
  content:""; position:fixed; inset:0; z-index:-2; pointer-events:none; opacity:.45;
  background-image:linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.022) 1px, transparent 1px);
  background-size:72px 72px;
  -webkit-mask-image:radial-gradient(120% 90% at 50% 0%, #000 35%, transparent 80%);
  mask-image:radial-gradient(120% 90% at 50% 0%, #000 35%, transparent 80%);
}
img{ display:block; max-width:100%; }
a{ color:inherit; }
::selection{ background:rgba(143,139,255,.3); }

/* layout helpers */
.wrap{ max-width:1240px; margin:0 auto; padding:0 48px; position:relative; }
.section{ padding:118px 0; border-top:1px solid var(--hairline); position:relative; }
.section.tight{ padding:80px 0; }
.section.soft{ background:rgba(255,255,255,.018); }
.section.dark{ background:transparent; border-top-color:var(--hairline); }

.kicker{
  font-family:var(--mono); font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent); display:flex; align-items:center; gap:12px; margin:0 0 24px;
}
.kicker .idx{ color:var(--muted2); }
.section.dark .kicker{ color:var(--da2); }
.section.dark .kicker .idx{ color:var(--muted2); }

h2.title{
  font-size:clamp(34px,4.6vw,56px); line-height:1.0; letter-spacing:-0.035em; font-weight:800;
  margin:0; max-width:18ch; text-wrap:balance; color:var(--ink);
}
h2.title .accent{ color:var(--accent); }
.section.dark h2.title .accent{ color:var(--da); }
.lead{ font-size:19px; color:var(--ink-soft); max-width:54ch; margin:22px 0 0; line-height:1.6; }
.section.dark .lead{ color:var(--ink-soft); }

/* buttons (cápsula sutil, mono) */
.btn{
  font-family:var(--mono); font-size:13px; font-weight:700; letter-spacing:.03em;
  text-transform:uppercase; padding:15px 26px; border:1px solid var(--line);
  cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:9px;
  background:rgba(255,255,255,.02); color:var(--ink); border-radius:999px;
  transition:background .18s, color .18s, border-color .18s, box-shadow .18s, transform .18s;
}
.btn:hover{ transform:translateY(-1px); }
.btn.primary{ background:#fff; color:#08090e; border-color:#fff; }
.btn.primary:hover{ box-shadow:0 10px 30px -10px rgba(255,255,255,.5); }
.btn.ghost{ background:transparent; }
.btn.ghost:hover{ border-color:var(--line-strong); background:rgba(255,255,255,.05); }
.btn.accent{ background:var(--accent); color:#0a0a14; border-color:var(--accent); }
.btn.accent:hover{ background:var(--accent-deep); border-color:var(--accent-deep); box-shadow:0 12px 34px -10px rgba(143,139,255,.7); }
.section.dark .btn{ border-color:var(--line); color:var(--on-dark); }
.section.dark .btn.primary{ background:#fff; border-color:#fff; color:#08090e; }

/* ---- NAV (sticky, glass oscuro) ---- */
.nav{
  position:sticky; top:0; z-index:50; background:rgba(8,9,14,.72);
  backdrop-filter:saturate(1.4) blur(16px); border-bottom:1px solid var(--hairline);
}
.nav-in{ max-width:1240px; margin:0 auto; padding:17px 48px; display:flex; align-items:center; justify-content:space-between; }
.brand{ display:flex; align-items:center; gap:11px; }
.brand img{ height:30px; width:auto; }
.brand .wm{ font-weight:700; letter-spacing:-0.02em; font-size:19px; color:#fff; }
.brand .wm span{ font-weight:500; opacity:.78; }
.nav-links{ display:flex; gap:32px; align-items:center; }
.nav-links a{ font-family:var(--mono); font-size:12px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); text-decoration:none; transition:color .15s; }
.nav-links a:hover{ color:#fff; }
.nav-cta{ font-family:var(--mono); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; background:var(--accent); color:#0a0a14; padding:11px 20px; text-decoration:none; border-radius:999px; transition:background .15s, box-shadow .15s; }
.nav-cta:hover{ background:var(--accent-deep); box-shadow:0 8px 24px -8px rgba(143,139,255,.7); }

/* ---- HERO (una columna, glow espacial) ---- */
.hero{ border-bottom:1px solid var(--hairline); position:relative; overflow:hidden; }
.hero::before{
  content:""; position:absolute; left:50%; top:-12%; width:min(1100px,120%); height:760px;
  transform:translateX(-50%); z-index:0; pointer-events:none;
  background:radial-gradient(48% 52% at 50% 38%, rgba(143,139,255,.30), rgba(90,147,255,.12) 55%, transparent 72%);
  filter:blur(20px);
}
.hero-grid{ max-width:1080px; margin:0 auto; display:block; position:relative; z-index:1; }
.hero-left{ padding:128px 48px 108px; display:flex; flex-direction:column; align-items:center; text-align:center; }
.hero-eyebrow{ font-family:var(--mono); font-size:13px; letter-spacing:.16em; text-transform:uppercase; color:var(--accent); }
.hero h1{ font-size:clamp(46px,8vw,94px); line-height:.96; letter-spacing:-0.045em; font-weight:800; margin:22px 0 0; text-wrap:balance; max-width:16ch; color:#fff; }
.hero h1 .accent{ color:var(--accent); }
.hero-sub{ font-size:19.5px; color:var(--ink-soft); max-width:60ch; margin:28px auto 0; line-height:1.6; }
.hero-cta{ display:flex; gap:14px; margin-top:38px; flex-wrap:wrap; justify-content:center; }
.hero-adapt{ margin-top:48px; padding-top:32px; border-top:1px solid var(--hairline); width:100%; max-width:880px; }
.hero-adapt .ha-lead{ font-family:var(--mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted2); margin-bottom:18px; }
.hero-adapt .ha-lead b{ color:var(--accent); }
.hero-adapt .ha-chips{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.hero-adapt .ha-chip{ border:1px solid var(--line); padding:11px 17px; font-family:var(--mono); font-size:12px; letter-spacing:.02em; text-transform:uppercase; border-radius:999px; background:rgba(255,255,255,.02); }
.hero-adapt .ha-chip b{ color:var(--accent); }

/* hero index card (no usado en composición actual, se mantiene por compat) */
.idxhead{ font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted2); padding-bottom:12px; border-bottom:1px solid var(--line); }
.idxrow{ display:grid; grid-template-columns:34px 1fr auto; align-items:baseline; gap:12px; padding:12px 0; border-bottom:1px solid var(--hairline); }
.idxrow .n{ font-family:var(--mono); font-size:13px; color:var(--accent); font-weight:700; }
.idxrow .nm{ font-size:15.5px; font-weight:600; }
.idxrow .t{ font-family:var(--mono); font-size:12px; color:var(--muted2); }
.idxrow.last{ border-bottom:none; }
.idxrow.last .nm{ color:var(--accent); }
.idxfoot{ display:flex; align-items:center; gap:18px; margin-top:24px; }
.stamp{ font-family:var(--mono); font-weight:700; border:2px solid var(--accent); color:var(--accent); border-radius:50%; width:108px; height:108px; display:grid; place-items:center; text-align:center; transform:rotate(-9deg); flex:0 0 auto; }
.stamp .big{ font-size:27px; letter-spacing:-0.02em; line-height:1; }
.stamp .sm{ font-size:9px; letter-spacing:.12em; text-transform:uppercase; margin-top:3px; }
.idxfoot .cap{ font-family:var(--mono); font-size:12px; color:var(--muted); line-height:1.55; }

/* ---- PROBLEM (antes / ahora) ---- */
.cmp{ display:grid; grid-template-columns:1fr 1fr; gap:0; margin-top:52px; border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.cmp-col{ padding:38px 38px; }
.cmp-col.before{ background:rgba(255,255,255,.015); border-right:1px solid var(--line); }
.cmp-col.after{ background:var(--accent-soft); }
.cmp-tag{ font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted2); }
.cmp-col.after .cmp-tag{ color:var(--da2); }
.cmp-h{ font-size:26px; font-weight:800; letter-spacing:-0.02em; margin:6px 0 22px; color:var(--ink); }
.cmp-list{ list-style:none; margin:0; padding:0; }
.cmp-list li{ display:flex; gap:12px; padding:12px 0; border-top:1px solid var(--hairline); font-size:15.5px; color:var(--ink-soft); align-items:flex-start; }
.cmp-list li:first-child{ border-top:none; }
.cmp-list .mk{ font-family:var(--mono); font-weight:700; flex:0 0 auto; }
.before .mk{ color:#ef6a5f; }
.after .mk{ color:var(--accent); }
.after .cmp-list li{ color:var(--ink); }

/* metric strip */
.mstrip{ display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); border-radius:14px; overflow:hidden; margin-top:0; }
.mcell{ padding:36px 28px; border-right:1px solid var(--hairline); }
.mcell:last-child{ border-right:none; }
.mcell .v{ font-size:56px; font-weight:800; letter-spacing:-0.04em; line-height:1; color:var(--accent); font-variant-numeric:tabular-nums; }
.mcell .k{ font-family:var(--mono); font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin-top:12px; }
.mcell .sub{ font-size:13px; color:var(--muted2); margin-top:5px; }
.section.dark .mcell{ border-color:var(--hairline); }
.section.dark .mcell .v{ color:var(--da); }
.section.dark .mcell .k{ color:var(--muted); }

/* ---- FLOW (6 fases interactivo) ---- */
.flow-top{ display:flex; align-items:flex-end; justify-content:space-between; gap:30px; flex-wrap:wrap; }
.flow-stepper{ display:grid; grid-template-columns:repeat(6,1fr); border:1px solid var(--line); border-radius:14px 14px 0 0; overflow:hidden; margin-top:48px; }
.fstep{ padding:18px 16px; border-right:1px solid var(--hairline); cursor:pointer; background:transparent; text-align:left; font-family:inherit; position:relative; transition:background .15s; }
.fstep:last-child{ border-right:none; }
.fstep:hover{ background:rgba(255,255,255,.04); }
.fstep .fn{ font-family:var(--mono); font-size:12px; color:var(--muted2); font-weight:700; }
.fstep .fnm{ font-size:14.5px; font-weight:700; margin-top:8px; letter-spacing:-0.01em; color:var(--ink); }
.fstep.done .fn{ color:var(--cc); }
.fstep.active{ background:color-mix(in oklab, var(--cc) 22%, transparent); }
.fstep.active .fn{ color:var(--cc); }
.fstep.active .fnm{ color:#fff; }
.fstep .barwrap{ height:4px; background:var(--hairline); margin-top:14px; border-radius:2px; overflow:hidden; }
.fstep.done .barwrap{ background:var(--cc); }
.fstep.active .barwrap{ background:var(--cc); }

.flow-panel{ border:1px solid var(--line); border-top:none; border-radius:0 0 14px 14px; overflow:hidden; display:grid; grid-template-columns:1.3fr 1fr; }
.fp-main{ padding:40px 42px; border-right:1px solid var(--hairline); }
.fp-role{ font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--cc); }
.fp-h{ font-size:30px; font-weight:800; letter-spacing:-0.025em; margin:8px 0 14px; color:var(--ink); }
.fp-desc{ font-size:16px; color:var(--ink-soft); max-width:46ch; line-height:1.6; }
.fp-data{ list-style:none; margin:24px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.fp-data li{ font-family:var(--mono); font-size:11.5px; letter-spacing:.03em; text-transform:uppercase; border:1px solid var(--hairline); padding:7px 11px; color:var(--muted); border-radius:999px; }
.fp-side{ padding:36px 32px; background:rgba(255,255,255,.018); display:flex; flex-direction:column; }
.fp-side .sh{ font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted2); padding-bottom:14px; border-bottom:1px solid var(--line); }
.fp-kv{ display:flex; justify-content:space-between; align-items:baseline; padding:12px 0; border-bottom:1px solid var(--hairline); font-size:14px; }
.fp-kv .k{ color:var(--muted); }
.fp-kv .v{ font-weight:700; font-variant-numeric:tabular-nums; color:var(--ink); }
.fp-progress{ margin-top:auto; padding-top:24px; }
.fp-progress .lbl{ display:flex; justify-content:space-between; font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted2); margin-bottom:8px; }
.fp-progress .track{ height:8px; background:var(--hairline); overflow:hidden; border-radius:4px; }
.fp-progress .fill{ height:100%; background:var(--cc); transition:width .5s cubic-bezier(.2,.7,.2,1); }
.flow-nav{ display:flex; gap:12px; margin-top:28px; }

/* ---- SIMULATOR ---- */
.sim{ border:1px solid var(--line); border-radius:14px; overflow:hidden; margin-top:48px; display:grid; grid-template-columns:1fr 1.05fr; }
.sim-controls{ padding:40px 42px; border-right:1px solid var(--hairline); }
.sim-out{ padding:40px 42px; background:rgba(0,0,0,.35); color:var(--on-dark); }
.ctl{ margin-bottom:32px; }
.ctl:last-child{ margin-bottom:0; }
.ctl-h{ display:flex; justify-content:space-between; align-items:baseline; font-family:var(--mono); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:12px; }
.ctl-h b{ color:var(--ink); font-size:16px; }
input[type=range]{ -webkit-appearance:none; appearance:none; width:100%; height:4px; background:var(--line); outline:none; border-radius:2px; }
input[type=range]::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:20px; height:20px; border-radius:50%; background:var(--accent); border:2px solid var(--paper); cursor:pointer; box-shadow:0 0 0 1.5px var(--accent), 0 0 18px rgba(143,139,255,.6); }
input[type=range]::-moz-range-thumb{ width:20px; height:20px; border-radius:50%; background:var(--accent); border:2px solid var(--paper); cursor:pointer; }
.modes{ display:grid; grid-template-columns:1fr; gap:8px; }
.mode{ font-family:var(--sans); text-align:left; border:1px solid var(--hairline); background:rgba(255,255,255,.02); padding:13px 15px; cursor:pointer; font-size:14px; color:var(--ink-soft); transition:border-color .15s,background .15s; border-radius:10px; }
.mode b{ display:block; font-size:14.5px; color:var(--ink); margin-bottom:3px; }
.mode small{ font-family:var(--mono); font-size:10.5px; letter-spacing:.02em; color:var(--muted2); }
.mode.on{ border-color:var(--accent); background:var(--accent-soft); }
.exp-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.chip{ font-family:var(--mono); font-size:11.5px; letter-spacing:.02em; border:1px solid var(--hairline); padding:8px 12px; cursor:pointer; color:var(--muted); user-select:none; border-radius:999px; }
.chip.on{ border-color:var(--accent); background:var(--accent-soft); color:var(--da2); }
.chip .x{ color:var(--accent); margin-right:6px; font-weight:700; }

.sim-out .oh{ font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--on-dark-mut); padding-bottom:16px; border-bottom:1px solid var(--dark-soft); }
.bigsplit{ display:flex; gap:0; margin:26px 0 6px; height:120px; border:1px solid var(--dark-soft); border-radius:10px; overflow:hidden; }
.bigsplit .seg{ display:flex; flex-direction:column; justify-content:flex-end; flex-basis:0; flex-shrink:1; padding:14px; position:relative; overflow:hidden; min-width:0; }
.bigsplit .seg.artist{ background:var(--c6); color:#04140b; }
.bigsplit .seg.office{ background:var(--c1); color:#fff; }
.bigsplit .seg.exp{ background:var(--c3); color:#2a1c04; }
.bigsplit .seg .pct{ font-weight:800; letter-spacing:-0.03em; line-height:1; font-variant-numeric:tabular-nums; white-space:nowrap; }
.bigsplit .seg.exp{ padding:14px 10px; }
.bigsplit .seg .nm{ font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; margin-top:6px; opacity:.92; white-space:nowrap; }
.orow{ display:flex; justify-content:space-between; align-items:baseline; padding:13px 0; border-bottom:1px solid var(--dark-soft); font-size:15px; }
.orow .k{ color:var(--on-dark-mut); }
.orow .v{ font-weight:700; font-variant-numeric:tabular-nums; font-size:18px; color:var(--ink); }
.orow.artist .v{ color:var(--c6); }
.orow .delta{ font-family:var(--mono); font-size:11px; margin-left:8px; color:var(--on-dark-mut); }
.orow.total{ border-bottom:none; padding-top:16px; }
.orow.total .k{ color:var(--on-dark); font-weight:700; }
.sim-note{ font-family:var(--mono); font-size:11px; color:var(--on-dark-mut); margin-top:14px; line-height:1.6; }

/* ---- INTEGRATIONS / VISION ---- */
.intg{ display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); border-radius:14px; overflow:hidden; margin-top:48px; }
.icard{ padding:32px 28px; border-right:1px solid var(--hairline); border-bottom:1px solid var(--hairline); transition:background .15s; }
.icard:hover{ background:rgba(255,255,255,.025); }
.icard:nth-child(3n){ border-right:none; }
.icard:nth-last-child(-n+3){ border-bottom:none; }
.icard .st{ font-family:var(--mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; padding:4px 9px; display:inline-block; margin-bottom:16px; border-radius:999px; }
.st.live{ background:var(--accent-soft); color:var(--da2); border:1px solid rgba(143,139,255,.45); }
.st.soon{ background:rgba(255,255,255,.04); color:var(--muted); border:1px solid var(--hairline); }
.icard .ih{ font-size:19px; font-weight:700; letter-spacing:-0.01em; color:var(--ink); }
.icard .id{ font-size:14px; color:var(--ink-soft); margin-top:8px; line-height:1.55; }

/* ---- CTA final ---- */
.cta-final{ text-align:center; }
.cta-final h2{ font-size:clamp(40px,5.6vw,60px); line-height:1.02; letter-spacing:-0.04em; font-weight:800; margin:0 auto; max-width:18ch; color:#fff; }
.cta-final .lead{ margin:24px auto 0; }
.cta-final .row{ display:flex; gap:14px; justify-content:center; margin-top:40px; flex-wrap:wrap; }

/* ---- FOOTER ---- */
.foot{ background:transparent; color:var(--on-dark); padding:64px 0 44px; border-top:1px solid var(--hairline); }
.foot-in{ max-width:1240px; margin:0 auto; padding:0 48px; display:flex; justify-content:space-between; align-items:flex-start; gap:30px; flex-wrap:wrap; }
.foot .brand .wm{ color:#fff; }
.foot-tag{ font-family:var(--mono); font-size:12px; color:var(--on-dark-mut); margin-top:14px; max-width:30ch; line-height:1.6; }
.foot-cols{ display:flex; gap:60px; }
.foot-col h4{ font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--da2); margin:0 0 14px; }
.foot-col a{ display:block; font-size:14px; color:var(--on-dark-mut); text-decoration:none; padding:5px 0; transition:color .15s; }
.foot-col a:hover{ color:#fff; }
.foot-bottom{ max-width:1240px; margin:40px auto 0; padding:22px 48px 0; border-top:1px solid var(--hairline); font-family:var(--mono); font-size:11px; color:var(--on-dark-mut); display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; }

/* ---- ADAPT BAND (manifiesto · panel con glow) ---- */
.band{ background:linear-gradient(120deg, rgba(143,139,255,.16), rgba(90,147,255,.10) 60%, transparent); color:#fff; border-top:1px solid var(--hairline); border-bottom:1px solid var(--hairline); position:relative; overflow:hidden; }
.band::before{ content:""; position:absolute; right:-6%; top:-40%; width:560px; height:560px; border-radius:50%; background:radial-gradient(circle, rgba(143,139,255,.4), transparent 65%); filter:blur(30px); pointer-events:none; }
.band-in{ max-width:1240px; margin:0 auto; padding:84px 48px; position:relative; z-index:1; }
.band .bk{ font-family:var(--mono); font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--da2); }
.band h2{ font-size:clamp(34px,4.6vw,52px); line-height:1.04; letter-spacing:-0.035em; font-weight:800; margin:18px 0 0; max-width:24ch; text-wrap:balance; color:#fff; }
.band h2 em{ font-style:normal; color:var(--accent); }
.band-chips{ display:flex; gap:14px; margin-top:30px; flex-wrap:wrap; }
.band-chip{ border:1px solid var(--line); padding:12px 18px; font-family:var(--mono); font-size:12.5px; letter-spacing:.02em; text-transform:uppercase; border-radius:999px; background:rgba(255,255,255,.03); }
.band-chip b{ color:#fff; }

/* ---- PRODUCT MOCK (ventana oscura) ---- */
.prod-win{ margin-top:48px; border:1px solid var(--line); border-radius:14px; background:#0a0b12; box-shadow:0 50px 100px -40px rgba(0,0,0,.8), 0 0 0 1px rgba(255,255,255,.02); overflow:hidden; }
.win-bar{ display:flex; align-items:center; gap:8px; padding:14px 16px; border-bottom:1px solid var(--hairline); background:rgba(255,255,255,.02); }
.win-dot{ width:11px; height:11px; border-radius:50%; }
.win-url{ margin-left:14px; font-family:var(--mono); font-size:12px; color:var(--muted); background:rgba(255,255,255,.04); border:1px solid var(--hairline); padding:5px 14px; border-radius:6px; }
.app{ display:grid; grid-template-columns:228px 1fr; min-height:540px; }
.app-side{ background:rgba(0,0,0,.3); color:var(--on-dark); padding:22px 18px; border-right:1px solid var(--hairline); }
.app-brand{ display:flex; align-items:center; gap:9px; padding-bottom:20px; border-bottom:1px solid var(--hairline); margin-bottom:18px; }
.app-brand img{ height:24px; } .app-brand .wm{ font-size:15px; font-weight:700; color:#fff; }
.app-nav{ display:flex; flex-direction:column; gap:3px; }
.app-nav a{ font-family:var(--mono); font-size:12.5px; letter-spacing:.02em; color:var(--on-dark-mut); padding:10px 12px; text-decoration:none; display:flex; align-items:center; gap:9px; border-radius:8px; transition:background .15s,color .15s; }
.app-nav a .ico{ width:7px; height:7px; border:1.5px solid currentColor; border-radius:2px; }
.app-nav a:hover{ color:#fff; background:rgba(255,255,255,.04); }
.app-nav a.on{ background:var(--accent); color:#0a0a14; }
.app-side .sidefoot{ margin-top:26px; padding-top:18px; border-top:1px solid var(--hairline); font-family:var(--mono); font-size:10.5px; color:var(--on-dark-mut); line-height:1.6; }
.app-main{ background:#0c0d15; padding:28px 28px; }
.app-top{ display:flex; align-items:center; justify-content:space-between; padding-bottom:20px; border-bottom:1px solid var(--hairline); }
.app-top .h{ font-size:21px; font-weight:800; letter-spacing:-0.02em; color:#fff; }
.app-top .h small{ display:block; font-family:var(--mono); font-size:11px; font-weight:400; letter-spacing:.05em; text-transform:uppercase; color:var(--muted2); margin-top:4px; }
.app-top .tr{ display:flex; align-items:center; gap:10px; }
.app-search{ font-family:var(--mono); font-size:12px; color:var(--muted2); border:1px solid var(--hairline); padding:8px 14px; background:rgba(255,255,255,.02); border-radius:8px; }
.app-av{ width:32px; height:32px; border-radius:50%; background:var(--accent); color:#0a0a14; display:grid; place-items:center; font-family:var(--mono); font-size:12px; font-weight:700; }
.app-newbtn{ font-family:var(--mono); font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; background:#fff; color:#0a0a14; padding:9px 14px; border-radius:8px; }
.app-kpis{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:24px 0; }
.kpi{ border:1px solid var(--hairline); padding:16px 18px; background:rgba(255,255,255,.02); border-radius:10px; }
.kpi .kl{ font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted2); }
.kpi .kv{ font-size:26px; font-weight:800; letter-spacing:-0.02em; margin-top:7px; color:#fff; font-variant-numeric:tabular-nums; }
.kpi .kv .up{ font-family:var(--mono); font-size:12px; font-weight:700; color:var(--c6); margin-left:7px; }
.app-tablehead{ display:grid; grid-template-columns:2.1fr 1fr 1.2fr 1fr 1fr; font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted2); padding:10px 14px; border-bottom:1px solid var(--line); }
.app-row{ display:grid; grid-template-columns:2.1fr 1fr 1.2fr 1fr 1fr; align-items:center; padding:15px 14px; border-bottom:1px solid var(--hairline); font-size:14px; }
.app-row .ev{ font-weight:700; color:var(--ink); }
.app-row .ev small{ display:block; font-family:var(--mono); font-size:10.5px; font-weight:400; color:var(--muted2); margin-top:3px; letter-spacing:.02em; }
.app-row .num{ font-variant-numeric:tabular-nums; color:var(--ink-soft); }
.app-row .num.a{ color:var(--da2); font-weight:700; }
.bdg{ font-family:var(--mono); font-size:10px; letter-spacing:.04em; text-transform:uppercase; padding:5px 9px; display:inline-flex; align-items:center; gap:6px; border:1px solid; width:fit-content; border-radius:999px; }
.bdg .pt{ width:6px; height:6px; border-radius:50%; background:currentColor; }
.bdg.exec{ color:var(--c3); border-color:rgba(240,168,60,.4); background:rgba(240,168,60,.1); }
.bdg.audit{ color:var(--c5); border-color:rgba(90,147,255,.4); background:rgba(90,147,255,.1); }
.bdg.pay{ color:var(--c4); border-color:rgba(239,106,160,.4); background:rgba(239,106,160,.1); }
.bdg.settled{ color:var(--c6); border-color:rgba(52,199,119,.4); background:rgba(52,199,119,.1); }
.prod-note{ font-family:var(--mono); font-size:11.5px; color:var(--muted2); margin-top:18px; }

/* ---- ADAPT detail cards ---- */
.acards{ display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); border-radius:14px; overflow:hidden; margin-top:48px; }
.acard{ padding:30px 26px; border-right:1px solid var(--hairline); transition:background .15s; }
.acard:hover{ background:rgba(255,255,255,.025); }
.acard:last-child{ border-right:none; }
.acard .an{ font-family:var(--mono); font-size:13px; font-weight:700; color:var(--accent); }
.acard .ah{ font-size:18px; font-weight:800; letter-spacing:-0.01em; margin:12px 0 8px; color:var(--ink); }
.acard .ad{ font-size:14px; color:var(--ink-soft); line-height:1.55; }

/* ---- FAQ ---- */
.faq{ border:1px solid var(--line); border-radius:14px; overflow:hidden; margin-top:48px; }
.faq-item{ border-bottom:1px solid var(--hairline); }
.faq-item:last-child{ border-bottom:none; }
.faq-q{ width:100%; text-align:left; background:transparent; border:none; cursor:pointer; font-family:var(--sans); font-size:19px; font-weight:700; letter-spacing:-0.01em; color:var(--ink); padding:26px 28px; display:flex; justify-content:space-between; align-items:center; gap:20px; transition:color .15s; }
.faq-q:hover{ color:#fff; }
.faq-q .pm{ font-family:var(--mono); font-size:22px; color:var(--accent); flex:0 0 auto; }
.faq-a{ padding:0 28px; max-height:0; overflow:hidden; transition:max-height .3s ease, padding .3s ease; }
.faq-a.open{ max-height:340px; padding:0 28px 28px; }
.faq-a p{ margin:0; font-size:16px; color:var(--ink-soft); line-height:1.65; max-width:70ch; }

@media (max-width:980px){
  .band-in{ padding-left:24px; padding-right:24px; }
  .band h2{ font-size:34px; }
  .app{ grid-template-columns:1fr; }
  .app-side{ display:none; }
  .app-kpis, .acards{ grid-template-columns:1fr 1fr; }
  .app-tablehead{ display:none; }
  .app-row{ grid-template-columns:1fr 1fr; gap:6px; }
}

/* desactiva transiciones durante cambios de estado masivos */
body.no-trans, body.no-trans *{ transition:none !important; }

/* reveal animation */
.reveal{ opacity:0; transform:translateY(20px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* responsive */
@media (max-width:980px){
  .wrap, .nav-in, .hero-grid, .foot-in, .foot-bottom{ padding-left:24px; padding-right:24px; }
  .hero-grid{ grid-template-columns:1fr; }
  .hero-left{ padding:96px 24px 80px; border-right:none; }
  .hero h1{ font-size:52px; }
  .cmp, .mstrip, .flow-panel, .sim, .intg{ grid-template-columns:1fr; }
  .flow-stepper{ grid-template-columns:repeat(3,1fr); }
  .fp-main, .sim-controls{ border-right:none; border-bottom:1px solid var(--hairline); }
  .mcell{ border-right:none; border-bottom:1px solid var(--hairline); }
  .nav-links{ display:none; }
  h2.title{ font-size:36px; }
  .cta-final h2{ font-size:40px; }
  .section{ padding:80px 0; }
}