:root {
  --bg: #050b14;
  --bg-2: #07111f;
  --surface: #0b1624;
  --surface-2: #0d1b2b;
  --cyan: #11d5e5;
  --cyan-2: #22e7f5;
  --blue: #5271ff;
  --green: #39e7a6;
  --text: #f5f9fc;
  --text-2: #a7b6c8;
  --muted: #65778b;
  --line: rgba(255,255,255,.095);
  --line-soft: rgba(255,255,255,.055);
  --cyan-line: rgba(17,213,229,.22);
  --container: 1240px;
  --ease: cubic-bezier(.2,.8,.2,1);
  --radius: 22px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body { margin: 0; min-width: 320px; background: var(--bg); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
img { display: block; max-width: 100%; }
::selection { background: rgba(17,213,229,.24); color: #fff; }

.skip-link { position: fixed; left: 16px; top: 12px; z-index: 10000; transform: translateY(-150%); padding: 10px 14px; border-radius: 10px; background: #fff; color: #08101b; font-size: 13px; font-weight: 800; transition: transform .2s; }
.skip-link:focus { transform: none; }
.container { width: min(calc(100% - 48px), var(--container)); margin: 0 auto; }
.section-pad { padding: 132px 0; position: relative; }

.noise { position: fixed; inset: 0; z-index: 1; pointer-events: none; opacity: .13; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.14'/%3E%3C/svg%3E"); mix-blend-mode: soft-light; }
#network-canvas { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; opacity: .8; }
main, .site-header, .site-footer { position: relative; z-index: 2; }

/* Boot */
body.is-booting { overflow: hidden; }
body.is-booting .site-header,
body.is-booting main { opacity: 0; transform: translateY(10px) scale(1.008); filter: blur(7px); }
.site-header,
main { transition: opacity .82s var(--ease), transform .82s var(--ease), filter .82s var(--ease); }

.boot {
  position: fixed;
  inset: 0;
  z-index: 9998;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 38%, rgba(18, 67, 98, .12), transparent 24%),
    radial-gradient(circle at 50% 55%, rgba(8, 25, 38, .42), transparent 40%),
    linear-gradient(180deg, rgba(3, 8, 17, 1), rgba(5, 11, 20, 1));
  transition: opacity .78s var(--ease), visibility .78s;
}
.boot.is-done { opacity: 0; visibility: hidden; }
.boot-grid,
.boot-vignette,
.boot-depth,
.boot-network,
.boot-stage,
.boot-mark,
.boot-wordmark,
.boot-sweep,
.boot-symbol-frame,
.boot-construct,
.boot-symbol-final { pointer-events: none; }
.boot-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(17, 213, 229, .032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(17, 213, 229, .032) 1px, transparent 1px);
  background-size: 62px 62px;
  opacity: .9;
  mask-image: radial-gradient(circle at center, #000 0 72%, transparent 100%);
}
.boot-vignette {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at center, transparent 0 34%, rgba(4, 11, 20, .14) 60%, rgba(3, 8, 18, .7) 100%),
    linear-gradient(180deg, rgba(255,255,255,.012), rgba(255,255,255,0));
}
.boot-depth {
  position: absolute;
  border-radius: 999px;
  filter: blur(18px);
  opacity: .22;
}
.boot-depth-a {
  width: min(60vw, 700px);
  height: min(36vw, 420px);
  background: radial-gradient(circle, rgba(17,213,229,.18), transparent 68%);
  left: 50%;
  top: 46%;
  transform: translate(-50%, -50%);
}
.boot-depth-b {
  width: min(30vw, 360px);
  height: min(30vw, 360px);
  background: radial-gradient(circle, rgba(79,124,255,.12), transparent 70%);
  right: 12%;
  top: 18%;
}
.boot-network {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: .96;
}
.boot-stage {
  position: relative;
  z-index: 1;
  width: min(94vw, 1080px);
  min-height: min(78vh, 760px);
  display: grid;
  place-items: center;
}
.boot-mark {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(14px, 2vw, 18px);
}
.boot-mark-orbit,
.boot-mark-core {
  position: absolute;
  left: 50%;
  top: 33%;
  transform: translate(-50%, -50%);
  border-radius: 999px;
}
.boot-mark-orbit {
  width: min(42vw, 470px);
  aspect-ratio: 1;
  border: 1px solid rgba(17, 213, 229, .14);
  box-shadow: 0 0 80px rgba(17, 213, 229, .04) inset;
  opacity: 0;
}
.boot-mark-orbit-b {
  width: min(31vw, 330px);
  border-style: dashed;
  border-color: rgba(79, 124, 255, .12);
}
.boot-mark-core {
  width: min(26vw, 240px);
  aspect-ratio: 1;
  background: radial-gradient(circle, rgba(17,213,229,.12), rgba(17,213,229,.06) 34%, transparent 72%);
  filter: blur(2px);
  opacity: 0;
}
.boot.is-playing .boot-mark-orbit { animation: bootOrbitIn .9s .95s var(--ease) forwards, bootOrbitFloat 6.2s 1.75s ease-in-out infinite; }
.boot.is-playing .boot-mark-orbit-b { animation-delay: 1.15s, 2s; }
.boot.is-playing .boot-mark-core { animation: bootCoreIn .8s 1.25s var(--ease) forwards, bootCorePulse 2.8s 2s ease-in-out infinite; }
.boot-symbol-frame {
  position: relative;
  width: min(58vw, 640px);
  aspect-ratio: 626 / 397;
}
.boot-symbol-glow {
  position: absolute;
  inset: 14% 12%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(17,213,229,.16), rgba(17,213,229,.05) 38%, transparent 72%);
  filter: blur(24px);
  opacity: 0;
  transform: scale(.85);
}
.boot.is-playing .boot-symbol-glow { animation: bootSymbolGlow 1.1s 1.55s var(--ease) forwards; }
.boot-symbol-final,
.boot-construct {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.boot-symbol-final {
  object-fit: contain;
  opacity: 0;
  transform: scale(.985);
  filter: drop-shadow(0 0 18px rgba(17,213,229,.18)) drop-shadow(0 0 42px rgba(17,213,229,.1));
}
.boot.is-consolidated .boot-symbol-final {
  opacity: 1;
  transform: scale(1);
  transition: opacity .54s ease, transform .54s ease;
}
.boot-construct {
  overflow: visible;
  transition: opacity .42s ease, filter .42s ease;
}
.boot.is-consolidated .boot-construct {
  opacity: .22;
  filter: blur(.3px);
}
.boot.show-submark .boot-construct {
  opacity: .12;
}
.boot-logo-traced { opacity: 1; }
.boot-logo-traced-glow { opacity: .34; }
.boot-path {
  fill: none;
  stroke: #fff;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0;
}
.boot-outline { stroke-width: 52; }
.boot-lower,
.boot-trace { stroke-width: 50; }
.boot-node {
  fill: #fff;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
}
.boot.is-playing .boot-path,
.boot.is-playing .boot-node {
  opacity: 1;
}
.boot.is-playing .boot-outline {
  animation: bootDrawPath 1.05s 1.42s var(--ease) forwards;
}
.boot.is-playing .boot-lower {
  animation: bootDrawPath .72s 1.92s var(--ease) forwards;
}
.boot.is-playing .boot-trace-1 {
  animation: bootDrawPath .68s 1.18s var(--ease) forwards;
}
.boot.is-playing .boot-trace-2 {
  animation: bootDrawPath .72s 1.32s var(--ease) forwards;
}
.boot.is-playing .boot-node:nth-child(1) { animation: bootNodeIn .28s 1.66s var(--ease) forwards; }
.boot.is-playing .boot-node:nth-child(2) { animation: bootNodeIn .28s 1.83s var(--ease) forwards; }
.boot.is-playing .boot-node:nth-child(3) { animation: bootNodeIn .28s 1.72s var(--ease) forwards; }
.boot.is-playing .boot-node:nth-child(4) { animation: bootNodeIn .28s 1.94s var(--ease) forwards; }
.boot.is-playing .boot-node:nth-child(5) { animation: bootNodeIn .28s 2.13s var(--ease) forwards; }
.boot.is-playing .boot-node:nth-child(6) { animation: bootNodeIn .28s 2.24s var(--ease) forwards; }
.boot-wordmark {
  position: relative;
  display: grid;
  justify-items: center;
  min-width: min(74vw, 620px);
  padding-top: 8px;
}
.boot-wordmark strong,
.boot-wordmark span {
  position: relative;
  display: block;
  clip-path: inset(0 100% 0 0);
  opacity: 0;
  will-change: clip-path, opacity, transform;
}
.boot-wordmark strong {
  font-size: clamp(52px, 10vw, 132px);
  line-height: .94;
  letter-spacing: -.06em;
  font-weight: 900;
  color: #14c8dc;
  text-shadow: 0 0 32px rgba(17,213,229,.08);
  transform: translateY(8px);
}
.boot-wordmark span {
  margin-top: 10px;
  font-size: clamp(10px, 1.65vw, 18px);
  letter-spacing: .56em;
  font-weight: 600;
  color: rgba(20, 200, 220, .88);
  text-transform: uppercase;
  transform: translateY(6px);
}
.boot.show-wordmark .boot-wordmark strong {
  opacity: 1;
  clip-path: inset(0 0 0 0);
  transform: translateY(0);
  transition: clip-path .72s cubic-bezier(.12,.9,.2,1), opacity .24s ease, transform .72s cubic-bezier(.12,.9,.2,1);
}
.boot.show-submark .boot-wordmark span {
  opacity: 1;
  clip-path: inset(0 0 0 0);
  transform: translateY(0);
  transition: clip-path .56s cubic-bezier(.18,.88,.2,1), opacity .28s ease, transform .56s cubic-bezier(.18,.88,.2,1), letter-spacing .6s ease;
}
.boot-sweep {
  position: absolute;
  left: -18%;
  top: 34px;
  width: min(18vw, 180px);
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.95) 42%, rgba(17,213,229,.8) 66%, rgba(79,124,255,.1) 100%);
  box-shadow: 0 0 18px rgba(255,255,255,.18), 0 0 26px rgba(17,213,229,.34);
  opacity: 0;
  filter: blur(.2px);
}
.boot.show-wordmark .boot-sweep {
  animation: bootSweepAcross .72s .06s cubic-bezier(.12,.9,.2,1) forwards;
}
.boot.is-static .boot-mark-orbit,
.boot.is-static .boot-mark-core,
.boot.is-static .boot-symbol-glow,
.boot.is-static .boot-symbol-final,
.boot.is-static .boot-wordmark strong,
.boot.is-static .boot-wordmark span {
  opacity: 1;
  clip-path: inset(0 0 0 0);
  transform: none;
}
.boot.is-static .boot-construct { display: none; }
.boot.is-leaving .boot-mark {
  transform: scale(.985);
  opacity: .92;
  transition: transform .58s ease, opacity .58s ease;
}
.boot.is-leaving .boot-grid {
  opacity: .22;
  transform: scale(1.045);
  transition: opacity .68s ease, transform .8s var(--ease);
}

@keyframes bootOrbitIn {
  from { opacity: 0; transform: translate(-50%, -50%) scale(.82); }
  to { opacity: .78; transform: translate(-50%, -50%) scale(1); }
}
@keyframes bootOrbitFloat {
  0%,100% { transform: translate(-50%, -50%) scale(1); }
  50% { transform: translate(-50%, -50%) scale(1.025); }
}
@keyframes bootCoreIn {
  from { opacity: 0; transform: translate(-50%, -50%) scale(.72); }
  to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}
@keyframes bootCorePulse {
  0%,100% { opacity: .55; }
  50% { opacity: .92; }
}
@keyframes bootSymbolGlow {
  from { opacity: 0; transform: scale(.8); }
  to { opacity: 1; transform: scale(1); }
}
@keyframes bootDrawPath {
  from { stroke-dashoffset: var(--dash-length, 1000); opacity: 0; }
  18% { opacity: 1; }
  to { stroke-dashoffset: 0; opacity: 1; }
}
@keyframes bootNodeIn {
  from { opacity: 0; transform: scale(.3); }
  72% { opacity: 1; }
  to { opacity: 1; transform: scale(1); }
}
@keyframes bootSweepAcross {
  from { opacity: 0; left: -18%; }
  10% { opacity: 1; }
  85% { opacity: 1; }
  to { opacity: 0; left: 100%; }
}

@media (max-width: 1100px) {
  .boot-stage { min-height: min(74vh, 660px); }
  .boot-symbol-frame { width: min(68vw, 600px); }
  .boot-mark-orbit { width: min(48vw, 430px); }
  .boot-mark-orbit-b { width: min(35vw, 300px); }
}
@media (max-width: 820px) {
  .boot-grid { background-size: 48px 48px; }
  .boot-stage { width: min(96vw, 760px); min-height: min(70vh, 560px); }
  .boot-symbol-frame { width: min(78vw, 470px); }
  .boot-mark-orbit { width: min(64vw, 360px); }
  .boot-mark-orbit-b { width: min(46vw, 250px); }
  .boot-wordmark { min-width: min(86vw, 520px); }
  .boot-sweep { top: 28px; }
}
@media (max-width: 640px) {
  .boot-grid { background-size: 42px 42px; }
  .boot-stage { min-height: 100svh; padding: 0 20px; }
  .boot-mark { gap: 12px; }
  .boot-symbol-frame { width: min(84vw, 430px); }
  .boot-mark-orbit { width: min(82vw, 330px); top: 31%; }
  .boot-mark-orbit-b { width: min(58vw, 228px); }
  .boot-mark-core { width: min(54vw, 180px); top: 31%; }
  .boot-wordmark strong { font-size: clamp(42px, 13vw, 70px); }
  .boot-wordmark span { margin-top: 8px; font-size: clamp(10px, 2.8vw, 13px); letter-spacing: .42em; }
  .boot-sweep { left: -8%; top: 24px; width: min(28vw, 140px); }
  .boot-depth-b { right: 6%; top: 20%; }
}

/* Intro 2026 — convergencia de señal / lockup oficial */
.boot {
  background: #040a12;
  transition: opacity .72s var(--ease), visibility .72s;
}
.boot-atmosphere {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 50% 47%, rgba(15, 78, 96, .12), transparent 30%),
    radial-gradient(ellipse at 50% 100%, rgba(25, 65, 102, .08), transparent 42%),
    linear-gradient(180deg, #040a12, #050c15);
}
.boot-grid {
  background-image:
    linear-gradient(rgba(89, 145, 168, .024) 1px, transparent 1px),
    linear-gradient(90deg, rgba(89, 145, 168, .024) 1px, transparent 1px);
  background-size: 76px 76px;
  opacity: 0;
  transform: scale(1.02);
  mask-image: radial-gradient(ellipse at center, #000 0 54%, transparent 84%);
}
.boot.is-playing .boot-grid { animation: bootGridSettle 1.2s .08s ease forwards; }
.boot-network { opacity: .64; }
.boot-stage { width: 100%; min-height: 100svh; padding: 32px; }
.boot-lockup {
  position: relative;
  width: min(76vw, 680px);
  aspect-ratio: 570 / 176;
}
.boot-lockup,
.boot-atmosphere,
.boot-wordmark-mask,
.boot-scan { pointer-events: none; }
.boot-symbol-frame {
  position: absolute;
  left: 0;
  top: 0;
  width: 49%;
  height: 100%;
  transform: translateX(52%) scale(1.42);
  transform-origin: center;
  transition: transform .82s cubic-bezier(.18,.82,.2,1);
}
.boot.is-lockup .boot-symbol-frame { transform: translateX(0) scale(1); }
.boot-symbol-aura {
  position: absolute;
  inset: 10%;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(17,213,229,.12), transparent 68%);
  filter: blur(18px);
  opacity: 0;
}
.boot.is-playing .boot-symbol-aura { animation: bootAuraIn 1.2s 1.15s ease forwards; }
.boot-symbol-final,
.boot-construct { position: absolute; inset: 0; width: 100%; height: 100%; }
.boot-symbol-final {
  object-fit: contain;
  opacity: 0;
  filter: drop-shadow(0 0 13px rgba(17,213,229,.13));
  transition: opacity .34s ease;
}
.boot.is-resolved .boot-symbol-final { opacity: 1; }
.boot-construct { overflow: visible; transition: opacity .3s ease; }
.boot.is-resolved .boot-construct { opacity: 0; }
.boot-logo-traced { opacity: 1; }
.boot-logo-traced-glow { opacity: .2; }
.boot-path {
  fill: none;
  stroke: #fff;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0;
}
.boot-outline { stroke-width: 50; }
.boot-trace,
.boot-lower { stroke-width: 48; }
.boot-node { fill: #fff; opacity: 0; transform-box: fill-box; transform-origin: center; }
.boot.is-playing .boot-path,
.boot.is-playing .boot-node { opacity: 0; }
.boot.is-playing .boot-trace-a { animation: bootDrawPath .62s 1.02s var(--ease) forwards; }
.boot.is-playing .boot-trace-b { animation: bootDrawPath .62s 1.17s var(--ease) forwards; }
.boot.is-playing .boot-outline { animation: bootDrawPath .92s 1.34s var(--ease) forwards; }
.boot.is-playing .boot-lower { animation: bootDrawPath .58s 1.68s var(--ease) forwards; }
.boot.is-playing .boot-node { animation: none !important; opacity: 0; }
.boot.nodes-arrived .boot-node { opacity: 1; transition: opacity .12s ease; }
.boot-wordmark-mask {
  position: absolute;
  inset: 0;
  clip-path: inset(0 100% 0 49%);
  opacity: 0;
}
.boot-wordmark-mask img { width: 100%; height: 100%; object-fit: contain; }
.boot.show-wordmark .boot-wordmark-mask {
  opacity: 1;
  clip-path: inset(0 0 0 49%);
  transition: clip-path .78s cubic-bezier(.16,.84,.18,1), opacity .12s ease;
}
.boot.is-complete .boot-wordmark-mask {
  clip-path: inset(0);
  transition: clip-path .18s ease;
}
.boot-scan {
  position: absolute;
  left: 49%;
  top: 19%;
  width: 1px;
  height: 62%;
  opacity: 0;
  background: linear-gradient(180deg, transparent, rgba(230,253,255,.92) 44%, rgba(17,213,229,.75) 55%, transparent);
  box-shadow: 0 0 12px rgba(17,213,229,.32);
}
.boot.show-wordmark .boot-scan { animation: bootLockupScan .78s cubic-bezier(.16,.84,.18,1) forwards; }
.boot.is-static .boot-symbol-frame { transform: none; }
.boot.is-static .boot-symbol-final { opacity: 1; }
.boot.is-static .boot-wordmark-mask { opacity: 1; clip-path: inset(0); }
.boot.is-static .boot-construct,
.boot.is-static .boot-scan { display: none; }
.boot.is-leaving .boot-lockup { opacity: .72; transform: scale(.985); transition: opacity .55s ease, transform .7s ease; }
.boot.is-leaving .boot-grid { opacity: .08; transform: scale(1.035); }

@keyframes bootGridSettle { to { opacity: .72; transform: scale(1); } }
@keyframes bootAuraIn { from { opacity: 0; transform: scale(.8); } to { opacity: .62; transform: scale(1); } }
@keyframes bootLockupScan {
  0% { left: 49%; opacity: 0; }
  12%,82% { opacity: 1; }
  100% { left: 100%; opacity: 0; }
}

@media (max-width: 760px) {
  .boot-stage { padding: 24px 18px; }
  .boot-lockup { width: min(90vw, 570px); }
  .boot-symbol-frame { transform: translateX(52%) scale(1.52); }
  .boot-grid { background-size: 54px 54px; }
}
@media (max-width: 430px) {
  .boot-lockup { width: 92vw; }
  .boot-symbol-frame { transform: translateX(52%) scale(1.62); }
}

.site-header { position: fixed; left: 0; right: 0; top: 0; z-index: 100; border-bottom: 1px solid transparent; transition: background .25s, border-color .25s, backdrop-filter .25s, opacity .82s var(--ease), transform .82s var(--ease), filter .82s var(--ease); }
.site-header.scrolled { background: rgba(5,11,20,.78); backdrop-filter: blur(18px); border-bottom-color: var(--line-soft); }
.nav-wrap { min-height: 78px; display: flex; align-items: center; gap: 36px; }
.brand { width: 190px; height:54px; flex:0 0 auto; position:relative; display:block; overflow:visible; }
.brand img { width:176px; position:absolute; left:0; top:2px; }
.brand span{position:absolute;left:74px;top:44px;font-size:7px;line-height:1;letter-spacing:.19em;color:#76a2b7;font-weight:800;white-space:nowrap}
.desktop-nav { margin-left: auto; display: flex; align-items: center; gap: 29px; }
.desktop-nav a { color: #9aaabd; font-size: 12px; transition: color .2s; white-space: nowrap; }
.desktop-nav a:hover { color: #fff; }
.nav-actions { display: flex; align-items: center; gap: 12px; }
.menu-btn { width: 44px; height: 44px; display: none; align-items: center; justify-content: center; flex-direction: column; gap: 6px; background: transparent; border: 1px solid var(--line); border-radius: 13px; cursor: pointer; }
.menu-btn span { width: 17px; height: 1px; background: #d9e1ec; transition: transform .2s; }
.menu-btn.open span:first-child { transform: translateY(3.5px) rotate(45deg); }.menu-btn.open span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
.mobile-menu { display: none; }

/* Buttons */
.btn { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 0 20px; border-radius: 999px; border: 1px solid transparent; font-size: 12px; font-weight: 760; cursor: pointer; transition: transform .22s var(--ease), box-shadow .22s, border-color .22s, background .22s; }
.btn span { transition: transform .22s var(--ease); }
.btn:hover { transform: translateY(-2px); }.btn:hover span { transform: translate(2px,-2px); }
.btn-primary { color: #001115; background: linear-gradient(100deg, #12d6e5, #35c4f7 58%, #5271ff); box-shadow: 0 10px 34px rgba(17,213,229,.16), inset 0 1px rgba(255,255,255,.35); }
.btn-primary:hover { box-shadow: 0 14px 38px rgba(17,213,229,.25); }
.btn-ghost { border-color: rgba(17,213,229,.38); background: rgba(17,213,229,.07); color: #eefcff; }
.btn-ghost:hover { border-color: rgba(34,231,245,.66); background: rgba(17,213,229,.11); }
.btn-link { padding-inline: 3px; color: #eef4fa; min-height: 42px; }

.eyebrow { color: #a8b9ce; display: flex; align-items: center; gap: 10px; font-size: 10px; font-weight: 750; letter-spacing: .15em; text-transform: uppercase; }
.live-dot { width: 7px; height: 7px; display: inline-block; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 0 5px rgba(17,213,229,.05), 0 0 16px rgba(17,213,229,.5); }
.gradient-text { background: linear-gradient(100deg, #f6fbff 0%, #a7b6c8 17%, #11d5e5 61%, #5271ff 112%); color: transparent; background-clip: text; -webkit-background-clip: text; }

/* Hero */
.hero { min-height: 100svh; padding-top: 145px; display: flex; align-items: center; overflow: hidden; background: radial-gradient(circle at 80% 37%, rgba(17,213,229,.08), transparent 28%), radial-gradient(circle at 85% 65%, rgba(82,113,255,.045), transparent 24%); }
.hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(17,213,229,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(17,213,229,.035) 1px, transparent 1px); background-size: 63px 63px; mask-image: linear-gradient(to bottom, #000 5%, rgba(0,0,0,.72) 65%, transparent); pointer-events: none; }
.hero-grid { display: grid; grid-template-columns: .92fr 1.08fr; gap: 62px; align-items: center; position: relative; }
.hero-copy { position: relative; z-index: 3; }
.hero h1 { margin: 23px 0 25px; max-width: 670px; font-size: clamp(56px, 5.55vw, 83px); line-height: .98; letter-spacing: -.06em; font-weight: 760; }
.hero h1 span { display: block; }
.hero-lead { max-width: 620px; margin: 0; color: var(--text-2); font-size: 16px; line-height: 1.7; }
.hero-actions { display: flex; gap: 20px; align-items: center; margin-top: 31px; }
.hero-proof { display: grid; grid-template-columns: repeat(3,1fr); gap: 0; border-top: 1px solid var(--line); margin-top: 48px; max-width: 650px; }
.hero-proof > div { padding: 21px 23px 0 0; min-width: 0; }
.hero-proof strong { display: block; color: #fff; font-size: 13px; margin-bottom: 5px; }.hero-proof span { color: #66788d; font-size: 9px; line-height: 1.4; display: block; }

.hero-system { min-height: 620px; position: relative; display: grid; place-items: center; isolation: isolate; }
.core-glow { position: absolute; width: 520px; height: 520px; border-radius: 50%; background: radial-gradient(circle, rgba(17,213,229,.08), transparent 58%); filter: blur(3px); }
.core-orbit { position: absolute; border: 1px solid rgba(17,213,229,.14); border-radius: 50%; pointer-events: none; }
.orbit-outer { width: 545px; height: 545px; box-shadow: 0 0 80px rgba(17,213,229,.03) inset; animation: orbitSlow 28s linear infinite; }
.orbit-inner { width: 388px; height: 388px; border-style: dashed; border-color: rgba(82,113,255,.12); animation: orbitSlow 19s linear reverse infinite; }
.core-radar { position: absolute; width: 460px; height: 460px; border-radius: 50%; background: conic-gradient(from 180deg, transparent 0 74%, rgba(17,213,229,.08) 82%, transparent 90%); animation: radar 7s linear infinite; mask-image: radial-gradient(circle, transparent 0 37%, #000 38% 100%); }
@keyframes orbitSlow { to { transform: rotate(360deg); } } @keyframes radar { to { transform: rotate(360deg); } }
.core-center { position: relative; z-index: 6; width: 205px; height: 205px; border-radius: 50%; border: 1px solid rgba(17,213,229,.34); background: radial-gradient(circle at 45% 35%, rgba(17,213,229,.12), rgba(7,17,31,.94) 58%); box-shadow: 0 0 0 12px rgba(17,213,229,.015), 0 25px 70px rgba(0,0,0,.35), 0 0 70px rgba(17,213,229,.05); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; transition: transform .2s; }
.core-center img { width: 58px; margin-bottom: 8px; filter: drop-shadow(0 0 12px rgba(17,213,229,.35)); }
.core-center > span { color: #7890a8; font-size: 8px; letter-spacing: .18em; }.core-center strong { margin-top: 4px; font-size: 14px; letter-spacing: .08em; }.core-center em { margin-top: 12px; font-style: normal; font-size: 7px; color: var(--green); display: flex; align-items: center; gap: 6px; letter-spacing: .12em; }.core-center em i { width: 5px; height: 5px; border-radius: 50%; background: var(--green); box-shadow: 0 0 11px rgba(57,231,166,.7); }
.system-lines { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; overflow: visible; }
.system-lines path { stroke: url(#wire); stroke-width: 1.1; fill: none; stroke-dasharray: 5 7; }
.system-node { position: absolute; z-index: 7; width: 104px; min-height: 58px; border-radius: 15px; border: 1px solid var(--line); background: rgba(8,17,30,.88); backdrop-filter: blur(10px); box-shadow: 0 14px 35px rgba(0,0,0,.24); cursor: pointer; display: flex; align-items: center; justify-content: center; flex-direction: column; transition: transform .22s var(--ease), border-color .22s, background .22s, box-shadow .22s; }
.system-node span { font-size: 11px; font-weight: 850; letter-spacing: .05em; }.system-node small { margin-top: 3px; color: #62768c; font-size: 7px; text-transform: uppercase; letter-spacing: .11em; }
.system-node:hover, .system-node.active { transform: translateY(-3px) scale(1.03); border-color: rgba(17,213,229,.45); background: rgba(10,29,43,.94); box-shadow: 0 16px 40px rgba(0,0,0,.3), 0 0 25px rgba(17,213,229,.07); }
.system-node.active::after { content: ""; position: absolute; right: 8px; top: 8px; width: 5px; height: 5px; border-radius: 50%; background: var(--green); box-shadow: 0 0 9px var(--green); }
.node-external { left: 6%; top: 12%; }.node-sap { right: 5%; top: 13%; }.node-hik { right: -1%; top: 45%; }.node-pay { right: 6%; bottom: 11%; }.node-alerts { left: 7%; bottom: 9%; }
.core-console { position: absolute; z-index: 8; bottom: 16px; left: 50%; transform: translateX(-50%); width: min(78%, 445px); border: 1px solid rgba(17,213,229,.2); border-radius: 17px; padding: 15px 17px; background: rgba(4,12,22,.88); backdrop-filter: blur(14px); box-shadow: 0 18px 50px rgba(0,0,0,.32); }
.console-head { display: flex; justify-content: space-between; color: #63798e; font-size: 7px; letter-spacing: .14em; }.console-head b { color: var(--cyan); font-size: 7px; }
.core-console > strong { display: block; margin: 8px 0 5px; font-size: 13px; }.core-console p { margin: 0; color: #8497aa; font-size: 10px; line-height: 1.5; }.console-event { margin-top: 11px; padding-top: 10px; border-top: 1px solid var(--line-soft); display: flex; align-items: center; gap: 7px; color: #6f8398; font-size: 7px; letter-spacing: .09em; }.console-event i { width: 5px; height: 5px; background: var(--green); border-radius: 50%; box-shadow: 0 0 10px var(--green); }
.data-packet { position: absolute; z-index: 5; width: 7px; height: 7px; border-radius: 50%; background: #fff; box-shadow: 0 0 5px #fff, 0 0 17px var(--cyan); opacity: .8; }
.packet-external { animation: packetExternal 4.6s linear infinite; }
.packet-sap-in { animation: packetSapIn 4.1s .7s linear infinite; }
.packet-hik-out { animation: packetHikOut 4.1s 2.75s linear infinite; }
.packet-alerts-out { animation: packetAlertsOut 4.8s 1.4s linear infinite; }
.packet-pay { animation: packetPay 5s 2.1s linear infinite; }
@keyframes packetExternal { 0%{left:16%;top:23%;opacity:0} 10%{opacity:1} 45%{left:49%;top:49%} 55%{left:49%;top:49%} 90%{left:16%;top:23%;opacity:1} 100%{left:16%;top:23%;opacity:0} }
@keyframes packetSapIn { 0%{left:84%;top:24%;opacity:0} 18%{opacity:1} 88%{left:49%;top:49%;opacity:1} 100%{left:49%;top:49%;opacity:0} }
@keyframes packetHikOut { 0%{left:49%;top:49%;opacity:0} 18%{opacity:1} 88%{left:92%;top:50%;opacity:1} 100%{left:92%;top:50%;opacity:0} }
@keyframes packetAlertsOut { 0%{left:49%;top:49%;opacity:0} 15%{opacity:1} 90%{left:18%;top:82%;opacity:1} 100%{left:18%;top:82%;opacity:0} }
@keyframes packetPay { 0%{left:83%;top:82%;opacity:0} 12%{opacity:1} 47%{left:49%;top:49%} 57%{left:49%;top:49%} 92%{left:83%;top:82%;opacity:1} 100%{left:83%;top:82%;opacity:0} }

/* Carrusel principal */
.hero-integrations{position:relative;padding:34px 0 42px;border-block:1px solid var(--line-soft);background:linear-gradient(180deg,rgba(10,23,37,.5),rgba(5,11,20,.92));overflow:hidden}
.hero-integrations .brands-heading{margin-top:0;padding-top:0;border-top:0}

/* marquee */
.signal-strip { overflow: hidden; border-block: 1px solid var(--line-soft); background: rgba(255,255,255,.012); }
.signal-track { width: max-content; height: 49px; display: flex; align-items: center; gap: 18px; animation: marquee 32s linear infinite; color: #718398; font-size: 8px; letter-spacing: .14em; font-weight: 700; }
.signal-track i { width: 4px; height: 4px; border-radius: 50%; background: var(--cyan); opacity: .6; }
@keyframes marquee { to { transform: translateX(-50%); } }

/* Shared headings */
.section-heading { margin-bottom: 54px; }
.section-heading h2 { max-width: 790px; margin: 19px 0 0; font-size: clamp(42px, 4.5vw, 66px); line-height: 1.02; letter-spacing: -.055em; font-weight: 720; }
.section-heading h2 span { color: var(--cyan); }
.section-heading > p, .section-heading.split > p { color: var(--text-2); line-height: 1.72; font-size: 14px; max-width: 390px; }
.section-heading.split { display: grid; grid-template-columns: 1fr 360px; gap: 80px; align-items: end; }
.section-heading.split > p { margin: 0 0 8px; }

/* Statement */
.statement { min-height: 720px; display: flex; align-items: center; border-bottom: 1px solid var(--line-soft); }
.statement-grid { display: grid; grid-template-columns: 180px 1fr; gap: 70px; }
.section-index { color: #53708d; font-size: 9px; letter-spacing: .16em; }
.statement-main h2 { margin: 0; max-width: 990px; font-size: clamp(52px, 5.2vw, 78px); letter-spacing: -.055em; line-height: .98; }.statement-main h2 span { color: #778ba1; }
.statement-main p { max-width: 690px; margin: 30px 0 0; color: var(--text-2); line-height: 1.7; font-size: 15px; }.statement-main p strong { color: #fff; }
.connection-sequence { max-width: 940px; display: flex; align-items: center; gap: 14px; margin-top: 48px; padding-top: 20px; border-top: 1px solid var(--line); }.connection-sequence div { min-width: 100px; display: flex; flex-direction: column; gap: 2px; }.connection-sequence b { color: var(--cyan); font-size: 8px; }.connection-sequence span { color: #78899c; font-size: 7px; letter-spacing: .1em; }.connection-sequence i { flex: 1; height: 1px; background: linear-gradient(90deg, rgba(17,213,229,.55), rgba(17,213,229,.06)); position: relative; }.connection-sequence i::after { content:""; position:absolute; right:0; top:-2px; width:5px; height:5px; border-radius:50%; background:var(--cyan); box-shadow:0 0 12px rgba(17,213,229,.7); }

/* Services */
.solutions { background: radial-gradient(circle at 90% 0, rgba(17,213,229,.035), transparent 24%); }
.services-grid { display: grid; grid-template-columns: 1.08fr .92fr .92fr; grid-template-areas: "a b b" "a c d" "e e f"; gap: 14px; }
.service-card { border: 1px solid var(--line); border-radius: var(--radius); padding: 28px; min-height: 292px; background: linear-gradient(145deg, rgba(13,27,43,.93), rgba(7,17,31,.95)); display: flex; flex-direction: column; position: relative; overflow: hidden; transition: transform .25s var(--ease), border-color .25s, box-shadow .25s; }
.service-card:nth-child(1){grid-area:a;min-height:600px}.service-card:nth-child(2){grid-area:b}.service-card:nth-child(3){grid-area:c}.service-card:nth-child(4){grid-area:d}.service-card:nth-child(5){grid-area:e}.service-card:nth-child(6){grid-area:f}
.service-card:hover { transform: translateY(-4px); border-color: rgba(17,213,229,.24); box-shadow: 0 28px 70px rgba(0,0,0,.16); }
.service-top { display: flex; align-items: center; gap: 11px; color: #60758a; font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }.service-top b { color: var(--cyan); font-size: 8px; }
.service-card h3 { margin: 25px 0 10px; max-width: 520px; font-size: clamp(24px, 2.25vw, 34px); letter-spacing: -.045em; line-height: 1.05; }.service-card p { max-width: 520px; margin: 0; color: #8ca0b4; font-size: 12px; line-height: 1.65; }
.service-visual { margin-top: auto; padding-top: 30px; min-height: 130px; position: relative; }
/* generated visuals */
.mini-dashboard { border:1px solid var(--line); border-radius:16px; padding:15px; background:rgba(3,10,18,.35) }.mini-toolbar{height:18px;border-bottom:1px solid var(--line);display:flex;gap:5px}.mini-toolbar i{width:5px;height:5px;border-radius:50%;background:#40566c}.mini-bars{height:105px;display:flex;align-items:flex-end;gap:10px;padding:18px 5px 4px}.mini-bars i{flex:1;border-radius:4px 4px 0 0;background:linear-gradient(#22e7f5,rgba(17,213,229,.16));box-shadow:0 0 18px rgba(17,213,229,.08)}.mini-lines span{height:6px;background:#15263a;border-radius:999px;display:block;margin-top:7px}.mini-lines span:nth-child(2){width:74%}.mini-lines span:nth-child(3){width:52%}
.web-visual{display:grid;grid-template-columns:1.2fr .8fr;gap:9px}.web-block{border:1px solid var(--line);border-radius:13px;background:rgba(3,10,18,.3);padding:12px}.web-block big{display:block;height:42px;background:linear-gradient(120deg,rgba(17,213,229,.18),rgba(82,113,255,.08));border-radius:9px}.web-block i{display:block;height:5px;background:#17283b;border-radius:9px;margin-top:8px}.web-block i:nth-child(3){width:60%}.web-stack{display:grid;gap:9px}.web-stack span{border:1px solid var(--line);border-radius:11px;background:rgba(17,213,229,.025)}
.commerce-flow,.api-flow,.auto-flow{height:100px;display:flex;align-items:center;justify-content:space-between;gap:8px}.flow-box{min-width:64px;padding:12px 8px;border-radius:12px;border:1px solid var(--line);text-align:center;background:rgba(3,10,18,.35)}.flow-box b{display:block;color:var(--cyan);font-size:12px}.flow-box small{display:block;color:#5e748a;font-size:6px;margin-top:6px;letter-spacing:.08em}.flow-arrow{flex:1;height:1px;background:linear-gradient(90deg,rgba(17,213,229,.06),rgba(17,213,229,.45),rgba(17,213,229,.06));position:relative}.flow-arrow i{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--cyan);top:-2px;animation:linePacket 2.5s linear infinite}@keyframes linePacket{from{left:0}to{left:calc(100% - 5px)}}
.document-visual{display:flex;align-items:center;gap:18px}.doc-paper{width:82px;height:104px;border:1px solid var(--line);border-radius:12px;background:rgba(3,10,18,.35);padding:14px;position:relative}.doc-paper i{display:block;height:4px;background:#1a2a3a;border-radius:5px;margin-bottom:7px}.doc-paper::after{content:"✓";position:absolute;right:9px;bottom:7px;color:var(--green);font-weight:800}.doc-info strong{color:var(--cyan);font-size:11px}.doc-info span{display:block;color:#62788f;font-size:8px;margin-top:4px}

/* Integration story */
.integration-story { border-block: 1px solid var(--line-soft); background: linear-gradient(180deg, rgba(255,255,255,.008), transparent); overflow: hidden; }
.integration-story-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; align-items: center; }
.api-note { display: flex; align-items: flex-start; gap: 12px; max-width: 580px; padding-top: 24px; margin-top: 26px; border-top: 1px solid var(--line); }.api-note i { font-style: normal; border: 1px solid rgba(17,213,229,.3); border-radius: 7px; padding: 5px 7px; color: var(--cyan); font-size: 8px; font-weight: 800; }.api-note span { color: #61778e; font-size: 9px; line-height: 1.6; }
.integration-pipeline { min-height: 500px; display: flex; align-items: center; justify-content: center; position: relative; }
.integration-pipeline::before { content:""; position:absolute; width:430px; height:430px; border-radius:50%; border:1px solid rgba(17,213,229,.08); box-shadow:0 0 80px rgba(17,213,229,.025) inset; }
.pipe-system { width: 126px; min-height: 82px; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: rgba(6,16,29,.85); z-index:2 }.pipe-system span{color:#657a91;font-size:7px;letter-spacing:.11em}.pipe-system strong{display:block;margin-top:8px;font-size:10px;line-height:1.4}.pipe-core{z-index:3;width:150px;height:150px;border:1px solid rgba(17,213,229,.34);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(circle,rgba(17,213,229,.08),rgba(5,11,20,.95) 64%);box-shadow:0 0 50px rgba(17,213,229,.05)}.pipe-core img{width:45px;margin-bottom:7px}.pipe-core strong{font-size:12px}.pipe-core span{font-size:6px;color:#668098;margin-top:4px;letter-spacing:.13em}.pipe-wire{width:90px;height:1px;background:rgba(17,213,229,.18);position:relative;z-index:2}.pipe-wire i{position:absolute;left:0;top:-2px;width:5px;height:5px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px rgba(17,213,229,.8);animation:linePacket 2.4s linear infinite}.pipe-wire em{position:absolute;top:-20px;width:100%;text-align:center;font-style:normal;color:#52708b;font-size:6px;letter-spacing:.08em}.pipe-wire.reverse i{animation-direction:reverse}
.brands-heading { margin-top: 40px; padding-top: 30px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 20px; color: #9fb2c6; }.brands-heading span { font-size: 10px; letter-spacing: .14em; }.brands-heading small { color: #6f859b; font-size: 10px; }
 .brands-marquee { margin-top: 20px; overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); }
.brands-marquee:hover .brands-track { animation-play-state: paused; }
.brands-track { width: max-content; display: flex; gap: 18px; animation: brands 48s linear infinite; padding: 5px 0; }
@keyframes brands { to { transform: translateX(-50%); } }
.brand-chip { width: 280px; height: 142px; flex: 0 0 auto; border: 1px solid rgba(255,255,255,.1); border-radius: 24px; background: radial-gradient(circle at 50% 0, rgba(17,213,229,.08), transparent 46%), linear-gradient(145deg, rgba(10,21,35,.96), rgba(7,15,26,.98)); padding: 18px 22px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:13px; text-align:center; box-shadow: inset 0 1px 0 rgba(255,255,255,.03), 0 18px 45px rgba(0,0,0,.14); transition: transform .25s var(--ease), border-color .2s, background .2s, box-shadow .25s; }
.brand-chip:hover { transform: translateY(-3px); border-color: rgba(17,213,229,.34); background: radial-gradient(circle at 0 0, rgba(17,213,229,.12), transparent 40%), linear-gradient(145deg, rgba(10,24,38,.98), rgba(7,15,26,.98)); box-shadow: 0 24px 55px rgba(0,0,0,.18); }
.brand-mark { width:100%; height:68px; display:grid; place-items:center; padding:0 12px; overflow:hidden; }
.brand-mark-fallback { color:var(--cyan);font-size:18px;font-weight:850;letter-spacing:.06em; }
.brand-mark img{width:100%;height:100%;max-width:190px;max-height:64px;object-fit:contain;display:block;transform:scale(var(--logo-scale,1));transform-origin:center;filter:drop-shadow(0 2px 10px rgba(0,0,0,.18));}
.brand-subtitle{display:block;color:#8297ac;font-size:10px;line-height:1.4;min-height:14px}
.brand-copy{min-width:0}
.brand-chip strong{font-size:16px;display:block;line-height:1.2}.brand-chip small{display:block;color:#71869b;font-size:10px;line-height:1.45;margin-top:7px}.brand-chip em{display:block;color:var(--green);font-size:7px;font-style:normal;margin-top:10px;letter-spacing:.1em}.brand-chip em.ecosystem{color:#8096ac}

/* Demos */
.demos { background: radial-gradient(circle at 10% 50%, rgba(82,113,255,.035), transparent 30%); }
.demo-switcher { display: inline-flex; padding: 5px; border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.016); margin-bottom: 20px; }
.demo-tab { border:0;background:transparent;color:#73869b;border-radius:999px;padding:12px 16px;font-size:10px;cursor:pointer;transition:background .2s,color .2s }.demo-tab span{color:#4d657d;margin-right:6px}.demo-tab.active{background:rgba(17,213,229,.1);color:#fff;box-shadow:inset 0 0 0 1px rgba(17,213,229,.18)}.demo-tab.active span{color:var(--cyan)}
.demo-stage { display:grid;grid-template-columns: minmax(300px, .31fr) minmax(0, .69fr);min-height:760px;border:1px solid var(--line);border-radius:30px;overflow:hidden;background:linear-gradient(145deg,#091522,#06101c);box-shadow:0 30px 80px rgba(0,0,0,.18); }
.demo-info { padding:46px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;border-right:1px solid var(--line);background:radial-gradient(circle at 0 0, rgba(17,213,229,.06), transparent 36%) }.demo-status{display:flex;align-items:center;gap:7px;color:#6d849a;font-size:7px;letter-spacing:.12em}.demo-status i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}.demo-info h3{font-size:34px;letter-spacing:-.05em;line-height:1.04;margin:23px 0 13px;max-width:420px}.demo-info p{color:#8296aa;font-size:13px;line-height:1.75;margin:0;max-width:420px}.demo-tags{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 28px}.demo-tags span{border:1px solid var(--line);border-radius:999px;padding:7px 10px;color:#657b91;font-size:7px}.demo-browser{padding:18px;background:#040b13;min-width:0;display:flex;flex-direction:column}.browser-bar{height:44px;border:1px solid var(--line);border-bottom:0;border-radius:18px 18px 0 0;display:grid;grid-template-columns:70px 1fr 60px;align-items:center;padding:0 12px;background:#09131f}.browser-dots{display:flex;gap:5px}.browser-dots i{width:6px;height:6px;border-radius:50%;background:#324659}.browser-dots i:first-child{background:#ff6a72}.browser-address{height:24px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line-soft);border-radius:8px;color:#60768c;font-size:7px;min-width:0;overflow:hidden}.browser-bar>span{color:var(--cyan);font-size:6px;text-align:right;letter-spacing:.1em}.demo-viewport{height:620px;border:1px solid var(--line);border-radius:0 0 18px 18px;overflow:hidden;background:#07101b;flex:1;min-height:0}.demo-viewport iframe{width:100%;height:100%;border:0;background:#07101b}

/* Why */
.why-section { border-top:1px solid var(--line-soft); }
.why-grid { display:grid;grid-template-columns:.8fr 1.2fr;gap:100px;align-items:start }.problem-list{border-top:1px solid var(--line)}.problem-list article{display:grid;grid-template-columns:44px 1fr;column-gap:16px;padding:26px 0;border-bottom:1px solid var(--line)}.problem-list article>span{color:var(--cyan);font-size:8px;grid-row:1/span 2;padding-top:4px}.problem-list strong{font-size:18px;letter-spacing:-.025em}.problem-list p{margin:8px 0 0;color:#778ca1;font-size:11px;line-height:1.5}

/* System */
.system-section{background:radial-gradient(circle at 70% 50%,rgba(17,213,229,.035),transparent 28%)}.system-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:90px;align-items:center}.system-connected{display:flex;align-items:center;gap:12px;margin-top:28px;padding-top:20px;border-top:1px solid var(--line);max-width:300px}.system-connected>i{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 15px rgba(57,231,166,.7)}.system-connected div{display:flex;flex-direction:column}.system-connected strong{font-size:8px}.system-connected span{font-size:7px;color:#5e748a;margin-top:2px}.ecosystem{height:580px;position:relative;display:grid;place-items:center}.eco-orbit{position:absolute;border:1px solid rgba(17,213,229,.13);border-radius:50%}.e1{width:500px;height:500px}.e2{width:360px;height:360px;border-style:dashed;border-color:rgba(82,113,255,.12)}.eco-center{width:165px;height:165px;border-radius:50%;border:1px solid rgba(17,213,229,.32);background:radial-gradient(circle,rgba(17,213,229,.09),rgba(5,11,20,.96) 70%);display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:3;text-align:center}.eco-center span{font-size:7px;color:#61788e}.eco-center strong{font-size:22px;line-height:.95;margin:6px 0}.eco-center small{font-size:6px;color:var(--green)}.eco-node{position:absolute;border:1px solid var(--line);border-radius:999px;background:#091522;padding:10px 14px;font-size:7px;color:#8ba0b4;z-index:4}.en1{top:34px}.en2{right:55px;top:150px}.en3{right:70px;bottom:120px}.en4{bottom:30px}.en5{left:45px;bottom:120px}.en6{left:65px;top:150px}.ecosystem svg{position:absolute;width:500px;height:500px}.ecosystem svg path{stroke:rgba(17,213,229,.15);stroke-width:1;stroke-dasharray:5 8;fill:none}

/* Tech */
.technology{border-block:1px solid var(--line-soft);background-image:linear-gradient(rgba(17,213,229,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(17,213,229,.025) 1px,transparent 1px);background-size:58px 58px}.tech-matrix{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid var(--line);border-radius:22px;overflow:hidden;background:rgba(5,11,20,.82)}.tech-matrix>div{min-height:260px;padding:28px 24px;border-right:1px solid var(--line)}.tech-matrix>div:last-child{border-right:0}.tech-matrix span{color:var(--cyan);font-size:8px}.tech-matrix strong{display:block;margin:26px 0 22px;font-size:15px}.tech-matrix p{margin:0;color:#778ba1;font-size:11px;line-height:2.25}

/* Process */
.process-line{max-width:930px;margin:20px auto 0;position:relative}.process-line::before{content:"";position:absolute;left:11px;top:0;bottom:0;width:1px;background:linear-gradient(var(--cyan),var(--blue),rgba(82,113,255,.1))}.process-line article{min-height:150px;display:grid;grid-template-columns:60px 1fr;gap:18px;position:relative}.process-line article>span{color:var(--cyan);font-size:8px;background:var(--bg);z-index:2;padding-top:4px}.process-line article>span::after{content:"";position:absolute;left:8px;top:4px;width:7px;height:7px;border-radius:50%;border:1px solid rgba(17,213,229,.65);background:#06111d;box-shadow:0 0 13px rgba(17,213,229,.15)}.process-line h3{font-size:24px;letter-spacing:-.035em;margin:0 0 8px}.process-line p{margin:0;color:#7e91a5;font-size:12px;line-height:1.6}

/* Maintenance */
.maintenance{background:radial-gradient(circle at 15% 20%,rgba(17,213,229,.035),transparent 25%)}.maintenance-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.maintenance-card{border:1px solid var(--line);border-radius:24px;padding:38px;background:linear-gradient(145deg,#081522,#07111e);position:relative;overflow:hidden}.maintenance-card.featured{border-color:rgba(17,213,229,.32);background:linear-gradient(145deg,rgba(10,36,49,.95),#07111e)}.maintenance-card.featured::before{content:"RECOMENDADO";position:absolute;right:28px;top:28px;border:1px solid rgba(17,213,229,.3);border-radius:999px;padding:7px 9px;color:var(--cyan);font-size:6px;letter-spacing:.1em}.maintenance-card>span{color:#5d758c;font-size:7px;letter-spacing:.11em}.maintenance-card h3{font-size:32px;margin:28px 0 8px}.maintenance-card>p{color:#8296aa;font-size:12px}.price{display:flex;align-items:baseline;gap:8px;margin:35px 0}.price small{color:#5d748a;font-size:8px}.price strong{font-size:55px;letter-spacing:-.06em}.price span{color:#5e758b;font-size:8px}.maintenance-card ul{list-style:none;margin:0 0 30px;padding:0;display:grid;gap:12px}.maintenance-card li{color:#9db0c2;font-size:11px}.maintenance-card li::before{content:"✓";color:var(--green);margin-right:10px}.maintenance-card .btn{width:100%}.maintenance-note{color:#5f7488;font-size:8px;margin:17px 3px 0;line-height:1.55}

/* About */
.about{border-top:1px solid var(--line-soft)}.about-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:105px;align-items:center}.founder-visual{height:470px;border:1px solid var(--line);border-radius:26px;position:relative;overflow:hidden;background:linear-gradient(145deg,#091724,#06111e)}.founder-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(17,213,229,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(17,213,229,.035) 1px,transparent 1px);background-size:46px 46px}.founder-o{position:absolute;left:42px;bottom:24px;font-size:170px;font-weight:200;color:transparent;-webkit-text-stroke:1px rgba(17,213,229,.34);line-height:.8}.founder-labels{position:absolute;right:28px;bottom:30px;display:flex;flex-direction:column;align-items:flex-end;gap:4px;color:#587087;font-size:7px}.about .section-heading{margin-bottom:0}.about .section-heading>p{max-width:690px;font-size:14px;margin-top:19px}.founder-sign{margin-top:25px;display:flex;flex-direction:column;gap:4px}.founder-sign strong{font-size:16px}.founder-sign span{color:#637a90;font-size:9px}.founder-note{display:block;border-left:1px solid rgba(17,213,229,.32);padding-left:12px;margin-top:22px;color:#60778d;font-size:8px;line-height:1.6}

/* CTA */
.final-cta{padding-bottom:90px}.final-shell{min-height:520px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;background-image:linear-gradient(rgba(17,213,229,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(17,213,229,.03) 1px,transparent 1px);background-size:58px 58px;position:relative;overflow:hidden}.final-shell h2{font-size:clamp(62px,7.2vw,105px);letter-spacing:-.065em;line-height:.9;margin:26px 0 25px}.final-shell h2 span{display:block;color:var(--cyan)}.final-shell p{color:#899bad;font-size:14px;max-width:620px;line-height:1.65;margin:0 0 30px}.cta-wire{width:430px;display:flex;align-items:center;gap:18px;margin-top:68px}.cta-wire i{flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(17,213,229,.32))}.cta-wire i:last-child{transform:scaleX(-1)}.cta-wire b{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 16px rgba(17,213,229,.7)}

/* Contact */
.contact-section{padding-top:70px}.contact-shell{border:1px solid var(--line);border-radius:28px;padding:52px;background:radial-gradient(circle at 0 0,rgba(17,213,229,.055),transparent 25%),linear-gradient(145deg,#0a1725,#06111e);display:grid;grid-template-columns:.82fr 1.18fr;gap:70px}.contact-copy h2{font-size:46px;letter-spacing:-.05em;line-height:1.03;margin:23px 0 18px}.contact-copy h2 span{color:var(--cyan)}.contact-copy p{color:#8397aa;font-size:13px;line-height:1.7}.contact-status{margin-top:26px;display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:999px;padding:8px 11px;color:#668098;font-size:7px;letter-spacing:.11em}.contact-status i{width:5px;height:5px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green)}.contact-form{display:flex;flex-direction:column;gap:17px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.contact-form label{display:flex;flex-direction:column;gap:8px;color:#7790a7;font-size:8px;letter-spacing:.08em}.contact-form input,.contact-form textarea,.contact-form select{width:100%;border:1px solid var(--line);border-radius:12px;background:rgba(3,10,18,.5);color:#eef7ff;padding:13px 14px;outline:none;font-size:12px;transition:border-color .2s,box-shadow .2s}.contact-form textarea{min-height:130px;resize:vertical;line-height:1.55}.contact-form input::placeholder,.contact-form textarea::placeholder{color:#486078}.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus{border-color:rgba(17,213,229,.48);box-shadow:0 0 0 3px rgba(17,213,229,.055)}.form-actions{display:flex;align-items:center;gap:17px;flex-wrap:wrap}.form-helper{color:#577087;font-size:8px}

/* Footer */
.site-footer{padding:80px 0 32px;border-top:1px solid var(--line-soft);overflow:hidden;background:radial-gradient(circle at 70% 15%,rgba(17,213,229,.035),transparent 22%)}.footer-top{display:grid;grid-template-columns:1.15fr .65fr .8fr .7fr;gap:70px;padding-bottom:55px}.footer-brand img{width:150px}.footer-brand p{max-width:310px;color:#7c91a5;font-size:11px;line-height:1.6;margin:15px 0 0}.footer-column{display:flex;flex-direction:column;gap:13px}.footer-column>span{color:#526a81;font-size:7px;letter-spacing:.14em;margin-bottom:6px}.footer-column a{color:#91a3b5;font-size:10px}.footer-column a:hover{color:#fff}.footer-column small{color:#4e667d;font-size:8px}.footer-core{display:flex;flex-direction:column;align-items:center;justify-content:center}.mini-core{width:92px;height:92px;border:1px solid rgba(17,213,229,.18);border-radius:50%;position:relative;display:grid;place-items:center}.mini-core img{width:38px}.mini-core i{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan)}.mini-core i:nth-child(2){top:0}.mini-core i:nth-child(3){right:6px;bottom:18px}.mini-core i:nth-child(4){left:6px;bottom:18px}.footer-core strong{font-size:7px;margin-top:10px}.footer-core span{font-size:6px;color:var(--green);margin-top:3px;letter-spacing:.1em}.footer-bottom{padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;color:#4f677e;font-size:8px}.footer-network{position:absolute;inset:0;pointer-events:none}.footer-network i{position:absolute;height:1px;background:linear-gradient(90deg,transparent,rgba(17,213,229,.2),transparent);width:260px;transform:rotate(11deg)}.footer-network i:first-of-type{right:4%;top:26%}.footer-network i:last-of-type{left:11%;bottom:20%;transform:rotate(-8deg)}.footer-network span{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 14px rgba(17,213,229,.65);opacity:.6}.footer-network span:nth-child(1){right:8%;top:23%}.footer-network span:nth-child(2){left:20%;bottom:22%}.footer-network span:nth-child(3){left:53%;top:8%}

.toast{position:fixed;left:50%;bottom:25px;z-index:9999;transform:translate(-50%,20px);opacity:0;pointer-events:none;border:1px solid var(--line);background:rgba(7,17,31,.96);padding:12px 15px;border-radius:12px;color:#dce9f5;font-size:10px;box-shadow:0 16px 50px rgba(0,0,0,.35);transition:opacity .2s,transform .2s}.toast.show{opacity:1;transform:translate(-50%,0)}

/* Reveal */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .72s var(--ease),transform .72s var(--ease)}.reveal.in-view{opacity:1;transform:none}.delay-1{transition-delay:.08s}

/* Cursor */
.cursor-ring,.cursor-dot,.cursor-ripple{position:fixed;left:0;top:0;pointer-events:none;z-index:9999;border-radius:50%;opacity:0;will-change:transform,opacity}.cursor-ring{width:40px;height:40px;border:1px solid rgba(34,231,245,.58);background:radial-gradient(circle,rgba(17,213,229,.05) 0 42%,transparent 44%);box-shadow:0 0 0 1px rgba(17,213,229,.08) inset,0 0 24px rgba(17,213,229,.12);transition:width .2s var(--ease),height .2s var(--ease),border-color .2s,box-shadow .2s,opacity .18s}.cursor-dot{width:5px;height:5px;background:var(--cyan-2);box-shadow:0 0 13px rgba(34,231,245,.85),0 0 25px rgba(34,231,245,.3);transition:width .18s,height .18s,background .18s,opacity .18s}.cursor-ring.is-visible,.cursor-dot.is-visible{opacity:1}.cursor-ring.is-hovering{width:60px;height:60px;border-color:rgba(34,231,245,.82);box-shadow:0 0 30px rgba(17,213,229,.22),0 0 70px rgba(82,113,255,.08)}.cursor-dot.is-hovering{width:7px;height:7px;background:#fff}.cursor-ring.is-pressed{width:30px;height:30px}.cursor-ripple{width:18px;height:18px;border:1px solid rgba(34,231,245,.75);opacity:.8;animation:pointerRipple .62s var(--ease) forwards}@keyframes pointerRipple{from{opacity:.8;transform:translate(-50%,-50%) scale(.4)}to{opacity:0;transform:translate(-50%,-50%) scale(3.8)}}
@media(hover:hover) and (pointer:fine){body.custom-cursor-enabled,body.custom-cursor-enabled a,body.custom-cursor-enabled button,body.custom-cursor-enabled input,body.custom-cursor-enabled textarea,body.custom-cursor-enabled select,body.custom-cursor-enabled [data-tilt]{cursor:none!important}}

/* Responsive */
@media (max-width: 1180px) {
  .desktop-nav { gap: 20px; }.desktop-nav a{font-size:11px}.hero-grid{grid-template-columns:1fr}.hero{padding-top:145px}.hero-copy{max-width:850px}.hero-system{min-height:650px;max-width:780px;width:100%;margin:0 auto}.services-grid{grid-template-columns:1fr 1fr;grid-template-areas:"a b" "a c" "d e" "f f"}.integration-story-grid,.system-grid{grid-template-columns:1fr;gap:35px}.integration-pipeline{min-height:430px}.demo-stage{grid-template-columns:1fr}.demo-info{border-right:0;border-bottom:1px solid var(--line);padding:32px}.demo-info p{max-width:700px}.why-grid,.about-grid{gap:60px}.tech-matrix{grid-template-columns:repeat(3,1fr)}.tech-matrix>div:nth-child(3){border-right:0}.tech-matrix>div{border-bottom:1px solid var(--line)}.contact-shell{gap:45px}.footer-top{grid-template-columns:1fr 1fr;gap:45px}.footer-core{align-items:flex-start}
}

@media (max-width: 900px) {
  .container{width:min(calc(100% - 30px),var(--container))}.section-pad{padding:96px 0}.desktop-nav,.desktop-only{display:none!important}.menu-btn{display:flex;margin-left:auto}.nav-wrap{min-height:72px}.brand{width:138px}.mobile-menu{position:fixed;top:73px;left:15px;right:15px;display:flex;flex-direction:column;padding:10px;border:1px solid var(--line);border-radius:18px;background:rgba(5,11,20,.96);backdrop-filter:blur(18px);box-shadow:0 25px 60px rgba(0,0,0,.45);opacity:0;transform:translateY(-8px);pointer-events:none;transition:opacity .2s,transform .2s}.mobile-menu.open{opacity:1;transform:none;pointer-events:auto}.mobile-menu a{padding:13px 12px;border-bottom:1px solid var(--line-soft);font-size:13px;color:#a0b1c2}.mobile-menu a:last-child{border:0}.mobile-whatsapp{color:var(--cyan)!important}.hero{min-height:auto;padding-top:125px}.hero h1{font-size:clamp(48px,10vw,70px)}.hero-system{min-height:600px}.section-heading.split{grid-template-columns:1fr;gap:18px}.section-heading.split>p{max-width:650px}.statement{min-height:auto}.statement-grid{grid-template-columns:1fr;gap:22px}.statement-main h2{font-size:clamp(47px,8vw,70px)}.services-grid{grid-template-columns:1fr;grid-template-areas:"a" "b" "c" "d" "e" "f"}.service-card:nth-child(1){min-height:500px}.integration-story-grid{grid-template-columns:1fr}.brands-heading{flex-direction:column}.why-grid,.about-grid{grid-template-columns:1fr;gap:50px}.why-grid .section-heading{margin-bottom:0}.system-grid{grid-template-columns:1fr}.ecosystem{height:540px}.tech-matrix{grid-template-columns:1fr 1fr}.tech-matrix>div:nth-child(3){border-right:1px solid var(--line)}.tech-matrix>div:nth-child(even){border-right:0}.maintenance-grid{grid-template-columns:1fr}.contact-shell{grid-template-columns:1fr;padding:38px}.footer-top{grid-template-columns:1fr 1fr}.footer-bottom{flex-direction:column}
}

@media (max-width: 620px) {
  .container{width:min(calc(100% - 24px),var(--container))}.section-pad{padding:78px 0}.hero{padding-top:110px}.hero::before{background-size:42px 42px}.hero h1{font-size:43px;line-height:1}.hero-lead{font-size:14px}.hero-actions{flex-direction:column;align-items:stretch;gap:7px}.hero-actions .btn{width:100%}.hero-proof{grid-template-columns:1fr;margin-top:32px}.hero-proof>div{display:grid;grid-template-columns:100px 1fr;gap:7px;padding-top:14px}.hero-proof strong{font-size:12px}.hero-system{min-height:490px;margin-top:20px}.core-glow{width:350px;height:350px}.orbit-outer{width:350px;height:350px}.orbit-inner{width:270px;height:270px}.core-radar{width:320px;height:320px}.core-center{width:145px;height:145px}.core-center img{width:42px}.core-center strong{font-size:10px}.system-node{width:76px;min-height:47px;border-radius:12px}.system-node span{font-size:8px}.system-node small{font-size:5px}.node-zoho{left:3%;top:7%}.node-sap{right:1%;top:9%}.node-hik{right:-1%;top:42%}.node-pay{right:3%;bottom:19%}.node-wa{left:2%;bottom:19%}.node-api{left:-1%;top:42%}.core-console{bottom:0;width:92%;padding:12px 13px}.core-console>strong{font-size:11px}.core-console p{font-size:8px}.system-lines{opacity:.7}.data-packet{display:none}.signal-track{height:43px}.statement-main h2{font-size:42px}.statement-main p{font-size:13px}.connection-sequence{gap:7px}.connection-sequence div{min-width:58px}.connection-sequence i{min-width:12px}.section-heading{margin-bottom:36px}.section-heading h2{font-size:39px}.section-heading>p,.section-heading.split>p{font-size:12px}.service-card{padding:22px;min-height:330px}.service-card:nth-child(1){min-height:450px}.service-card h3{font-size:26px}.integration-pipeline{min-height:370px;transform:scale(.88);transform-origin:center}.pipe-system{width:105px;padding:12px}.pipe-wire{width:46px}.pipe-core{width:112px;height:112px}.brands-track{gap:10px}.brand-chip{width:220px;height:102px;grid-template-columns:72px 1fr;padding:13px 14px}.brand-mark,.brand-mark-fallback{width:72px;height:50px;border-radius:14px}.brand-mark img{max-height:30px}.demo-switcher{display:grid;width:100%;border-radius:17px}.demo-tab{border-radius:13px;text-align:left}.demo-stage{border-radius:22px;min-height:auto}.demo-info{padding:26px}.demo-info h3{font-size:28px}.demo-browser{padding:10px}.browser-bar{grid-template-columns:52px 1fr 45px;padding:0 8px}.demo-viewport{height:640px}.problem-list strong{font-size:16px}.ecosystem{height:410px;transform:scale(.82);margin-inline:-30px}.tech-matrix{grid-template-columns:1fr}.tech-matrix>div,.tech-matrix>div:nth-child(3){border-right:0;min-height:auto}.tech-matrix p{line-height:1.9}.process-line article{grid-template-columns:45px 1fr;min-height:135px}.process-line h3{font-size:21px}.maintenance-card{padding:26px}.maintenance-card h3{font-size:28px}.price strong{font-size:48px}.maintenance-card.featured::before{right:19px;top:19px}.founder-visual{height:350px}.founder-o{font-size:130px;left:28px}.contact-shell{padding:26px 20px;border-radius:22px}.contact-copy h2{font-size:37px}.form-grid{grid-template-columns:1fr}.form-actions .btn{width:100%}.final-shell h2{font-size:58px}.cta-wire{width:85%}.footer-top{grid-template-columns:1fr}.footer-core{align-items:flex-start}.footer-brand img{width:142px}
}

@media (max-width: 380px) {
  .hero h1{font-size:39px}.hero-system{min-height:465px}.system-node{width:69px}.core-center{width:132px;height:132px}.core-console{bottom:-2px}.statement-main h2,.section-heading h2{font-size:36px}.service-card h3{font-size:24px}.integration-pipeline{transform:scale(.76);margin-inline:-50px}.brand-chip{width:100%;max-width:236px}.demo-viewport{height:600px}.final-shell h2{font-size:50px}.maintenance-card{padding:22px}.price strong{font-size:44px}
}

/* Ajustes productivos: carrusel, demo embebida y nombres del Core */
.footer-lockup{display:flex;align-items:center;gap:10px}
.footer-lockup strong{font-size:7px;letter-spacing:.16em;color:#7894a9;border-left:1px solid rgba(17,213,229,.25);padding-left:10px}
.demo-viewport{height:690px}
.demo-viewport iframe{overflow:hidden}
@media (max-width: 900px) {
  .nav-wrap{gap:14px}
  .brand{width:172px;height:50px}
  .brand img{width:160px;top:2px}
  .brand span{display:block;left:67px;top:40px;font-size:6px}
  .hero-integrations{padding-block:28px 34px}
}
@media (max-width: 620px) {
  .node-external{left:1%;top:7%}
  .node-alerts{left:2%;bottom:19%}
  .hero-integrations .brands-heading{gap:7px}
  .hero-integrations .brands-heading span{font-size:9px}
  .hero-integrations .brands-heading small{font-size:8px;line-height:1.45}
  .brand-chip{width:250px;height:122px;padding:14px 18px;gap:9px}
  .brand-mark{width:100%;height:62px;padding:0 10px}
  .brand-mark img{max-width:170px;max-height:58px}
  .brand-mark-fallback{width:auto;height:auto;border:0;background:none;padding:0}
  .brand-subtitle{font-size:9px}
  .brand-chip strong{font-size:14px}
  .brand-chip small{font-size:9px}
  .brand-chip em{font-size:6px;margin-top:7px}
  .demo-browser{overflow:visible}
  .demo-viewport{height:720px;flex:none}
}
@media (max-width: 380px) {
  .brand-chip{width:248px;max-width:none}
  .brand{width:156px;height:47px}
  .brand img{width:146px;top:2px}
  .brand span{left:61px;top:37px;font-size:5.5px;letter-spacing:.15em}
  .nav-wrap{gap:8px}
  .demo-viewport{height:720px}
}

@media (pointer: coarse), (hover: none) {
  .cursor-ring,.cursor-dot{transition:opacity .2s,width .18s,height .18s}.cursor-ring.touch-active{opacity:.95;width:48px;height:48px;border-color:rgba(34,231,245,.78);box-shadow:0 0 26px rgba(17,213,229,.2)}.cursor-dot.touch-active{opacity:1;width:6px;height:6px}
}

@media (prefers-reduced-motion: reduce) {
  html{scroll-behavior:auto}.boot-network{display:none}.signal-track,.brands-track,.core-radar,.core-orbit,.data-packet{animation:none!important}.reveal{opacity:1;transform:none}*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}

/* Layout safety: evita que contenido min-content ensanche grids en mobile. */
.statement-grid > *,
.section-heading.split > *,
.integration-story-grid > *,
.why-grid > *,
.system-grid > *,
.about-grid > *,
.contact-shell > * { min-width: 0; }
.integration-story,
.system-section,
.brands-marquee { overflow: hidden; }
.brands-marquee { max-width: 100%; contain: paint; }
.ecosystem { max-width: 100%; overflow: hidden; }

@media (max-width: 620px) {
  .integration-pipeline {
    transform: none;
    min-height: auto;
    width: 100%;
    padding: 18px 28px;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    overflow: hidden;
  }
  .integration-pipeline::before { display: none; }
  .pipe-system { width: 100%; min-height: 72px; text-align: center; }
  .pipe-core { width: 118px; height: 118px; margin: 0 auto; }
  .pipe-wire,
  .pipe-wire.reverse { width: 1px; height: 42px; margin: 0 auto; }
  .pipe-wire i,
  .pipe-wire.reverse i {
    left: -2px;
    top: 0;
    animation: pipePacketMobile 2.2s linear infinite;
  }
  .pipe-wire.reverse i { animation-direction: reverse; }
  .pipe-wire em { width: 110px; left: 10px; top: 16px; text-align: left; }
  .pipe-wire.reverse em { left: auto; right: 10px; text-align: right; }
  @keyframes pipePacketMobile { from { top: 0; } to { top: calc(100% - 5px); } }
  .connection-sequence { overflow: hidden; }
  .ecosystem { margin-inline: 0; transform: none; height: 410px; }
  .eco-orbit.e1,
  .ecosystem svg { width: 390px; height: 390px; }
  .eco-orbit.e2 { width: 285px; height: 285px; }
  .eco-center { width: 132px; height: 132px; }
  .en1 { top: 22px; }
  .en2 { right: 2px; top: 110px; }
  .en3 { right: 6px; bottom: 85px; }
  .en4 { bottom: 16px; }
  .en5 { left: 0; bottom: 85px; }
  .en6 { left: 4px; top: 110px; }
}

@media (max-width: 380px) {
  .integration-pipeline { transform: none; margin-inline: 0; padding-inline: 18px; }
  .eco-orbit.e1,
  .ecosystem svg { width: 340px; height: 340px; }
  .eco-orbit.e2 { width: 245px; height: 245px; }
  .ecosystem { height: 360px; }
  .eco-node { padding: 8px 10px; font-size: 6px; }
}
@media (min-width: 621px) {
  .node-pay { bottom: 22%; }
  .node-alerts { bottom: 22%; }
}

/* Refinamiento visual: marca, flujos, capacidades y cierre responsive. */
.brand {
  width: 194px;
  height: 58px;
  display: flex;
  align-items: center;
  position: relative;
  overflow: visible;
}
.brand-lockup {
  --mark-symbol: 82px;
  --mark-word: 106px;
  --mark-source: 188px;
  --mark-shift: -79px;
  width: calc(var(--mark-symbol) + var(--mark-word) + 6px);
  height: 56px;
  display: grid;
  grid-template-columns: var(--mark-symbol) var(--mark-word);
  align-items: center;
  gap: 6px;
  position: relative;
}
.brand .brand-lockup,
.brand .brand-copy,
.brand .brand-word-crop,
.brand .brand-subline {
  left: auto;
  top: auto;
}
.brand-lockup .brand-symbol {
  position: static;
  width: var(--mark-symbol);
  height: auto;
  object-fit: contain;
}
.brand-lockup .brand-copy {
  width: var(--mark-word);
  height: 52px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: static;
}
.brand-lockup .brand-word-crop {
  width: var(--mark-word);
  height: 40px;
  display: block;
  position: relative;
  overflow: hidden;
}
.brand-lockup .brand-word-source {
  position: absolute;
  left: var(--mark-shift);
  top: 0;
  width: var(--mark-source);
  max-width: none;
  height: auto;
}
.brand-lockup .brand-subline {
  display: block;
  position: static;
  color: #62a1b5;
  font-size: 5.5px;
  font-weight: 850;
  line-height: 1;
  letter-spacing: .23em;
  text-align: center;
  white-space: nowrap;
}

/* La demo conserva una ventana acotada: la página sigue desplazándose por fuera. */
.demo-stage { min-height: 0; }
.demo-browser { min-height: 0; }
.demo-viewport {
  height: clamp(560px, 70vh, 690px);
  flex: none;
  scrollbar-gutter: stable;
}
.demo-viewport iframe { display: block; overflow: auto; }

/* Diagrama vivo: objetos reconocibles reemplazan a los puntos abstractos. */
.eco-flow { z-index: 2; overflow: visible; }
.eco-flow .eco-wire {
  stroke: rgba(17,213,229,.16);
  stroke-width: 1;
  stroke-dasharray: 5 8;
  fill: none;
}
.eco-packet {
  color: var(--cyan-2);
  fill: rgba(5,11,20,.96);
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 7px rgba(17,213,229,.75));
}
.eco-flow .eco-packet path,
.eco-flow .eco-packet rect,
.eco-flow .eco-packet circle {
  fill: rgba(5,11,20,.96);
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-dasharray: none;
}
.eco-money { color: #58e9ae; }
.eco-file { color: #85a5ff; }
.eco-bell { color: #ffcf63; }
.eco-task { color: #d9f8ff; }
.eco-signal,
.eco-state { fill: var(--cyan); stroke: rgba(255,255,255,.8); }
.eco-flow .eco-api path { color: #37dded; fill: none; }
.eco-center { box-shadow: 0 0 50px rgba(17,213,229,.08); }
.eco-center strong { margin-bottom: 0; }
.eco-node {
  box-shadow: 0 10px 26px rgba(0,0,0,.24);
  backdrop-filter: blur(8px);
}

/* Capacidades: una banda compacta con ritmo y profundidad. */
.technology {
  overflow: hidden;
  background-image:
    radial-gradient(circle at 72% 32%,rgba(17,213,229,.055),transparent 25%),
    linear-gradient(rgba(17,213,229,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(17,213,229,.025) 1px,transparent 1px);
}
.tech-matrix {
  position: relative;
  gap: 12px;
  padding: 12px;
  border-radius: 26px;
  overflow: visible;
  background: linear-gradient(145deg,rgba(9,22,36,.9),rgba(5,11,20,.82));
}
.tech-matrix::before {
  content: "";
  position: absolute;
  left: 3%;
  right: 3%;
  top: 67px;
  height: 1px;
  background: linear-gradient(90deg,transparent,var(--cyan-line),rgba(82,113,255,.35),transparent);
}
.tech-matrix article {
  position: relative;
  min-width: 0;
  min-height: 208px;
  padding: 19px 18px 22px;
  border: 1px solid var(--line-soft);
  border-radius: 18px;
  background: linear-gradient(155deg,rgba(12,29,45,.92),rgba(6,15,26,.94));
  transition: transform .28s var(--ease), border-color .28s, background .28s;
}
.tech-matrix article:hover {
  transform: translateY(-6px);
  border-color: rgba(17,213,229,.3);
  background: linear-gradient(155deg,rgba(13,37,52,.96),rgba(6,15,26,.96));
}
.tech-head { display: flex; justify-content: space-between; align-items: center; }
.tech-head span { color: var(--cyan); font-size: 8px; letter-spacing: .12em; }
.tech-head i {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(17,213,229,.24);
  border-radius: 13px;
  background: rgba(17,213,229,.05);
  color: #dffcff;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  box-shadow: 0 0 22px rgba(17,213,229,.06);
}
.tech-matrix article strong {
  display: block;
  margin: 30px 0 14px;
  font-size: 16px;
}
.tech-matrix article p {
  margin: 0;
  color: #7f93a8;
  font-size: 10px;
  line-height: 1.85;
}

/* Proceso: números realmente centrados y menos espacio muerto. */
.process-line { max-width: 980px; margin-top: 8px; }
.process-line::before { left: 19px; top: 20px; bottom: 20px; }
.process-line article {
  min-height: 0;
  grid-template-columns: 40px minmax(0,1fr);
  gap: 22px;
  padding-bottom: 42px;
  align-items: start;
}
.process-line article:last-child { padding-bottom: 0; }
.process-line article>span {
  width: 40px;
  height: 40px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid rgba(17,213,229,.32);
  border-radius: 50%;
  background: #07121f;
  color: var(--cyan);
  font-size: 8px;
  line-height: 1;
  box-shadow: 0 0 0 6px var(--bg);
}
.process-line article>span::after { display: none; }
.process-line h3 { margin-top: 6px; }

/* Footer limpio: sin indicadores ficticios y con jerarquía consistente. */
.footer-top {
  grid-template-columns: minmax(260px,1.25fr) .65fr .85fr;
  gap: clamp(34px,6vw,84px);
  align-items: start;
}
.footer-lockup.brand-lockup {
  --mark-symbol: 94px;
  --mark-word: 122px;
  --mark-source: 216px;
  --mark-shift: -91px;
  width: 222px;
  height: 64px;
  padding: 0;
}
.footer-lockup.brand-lockup .brand-copy { height: 59px; }
.footer-lockup.brand-lockup .brand-word-crop { height: 46px; }
.footer-lockup.brand-lockup .brand-subline { font-size: 6.2px; }
.footer-bottom { align-items: center; }

@media (max-width: 1180px) {
  .tech-matrix { grid-template-columns: repeat(5,minmax(180px,1fr)); overflow-x: auto; scroll-snap-type: x proximity; }
  .tech-matrix article { scroll-snap-align: start; }
  .footer-top { grid-template-columns: 1.2fr .7fr .9fr; }
}

@media (max-width: 900px) {
  .brand { width: 180px; height: 54px; }
  .brand-lockup {
    --mark-symbol: 76px;
    --mark-word: 98px;
    --mark-source: 174px;
    --mark-shift: -73px;
    width: 180px;
    height: 52px;
  }
  .brand-lockup .brand-copy { height: 49px; }
  .brand-lockup .brand-word-crop { height: 37px; }
  .brand-lockup .brand-subline { font-size: 5px; }
  .demo-viewport { height: min(68vh,640px); min-height: 520px; }
  .footer-top { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  .section-pad { padding: 68px 0; }
  .brand { width: 172px; height: 50px; }
  .brand-lockup {
    --mark-symbol: 72px;
    --mark-word: 94px;
    --mark-source: 167px;
    --mark-shift: -70px;
    width: 172px;
    height: 49px;
  }
  .brand-lockup .brand-copy { height: 46px; }
  .brand-lockup .brand-word-crop { height: 35px; }
  .brand-lockup .brand-subline { font-size: 4.8px; }
  .nav-wrap { min-height: 66px; }
  .mobile-menu { top: 67px; }
  .demo-info { padding: 23px 20px; }
  .demo-info h3 { font-size: 25px; }
  .demo-browser { padding: 8px; }
  .demo-viewport { height: 70svh; min-height: 500px; max-height: 620px; }
  .browser-address { justify-content: flex-start; padding-inline: 7px; }
  .ecosystem { height: 390px; }
  .eco-flow,
  .eco-orbit.e1 { width: 370px; height: 370px; }
  .eco-orbit.e2 { width: 270px; height: 270px; }
  .eco-center { width: 124px; height: 124px; }
  .eco-center strong { font-size: 19px; }
  .technology .section-heading { margin-bottom: 28px; }
  .tech-matrix {
    width: calc(100% + 12px);
    grid-template-columns: repeat(5,235px);
    gap: 9px;
    margin-right: -12px;
    padding: 9px;
    border-radius: 20px 0 0 20px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }
  .tech-matrix article { min-height: 190px; padding: 16px; }
  .tech-matrix article strong { margin-top: 25px; }
  .process-line::before { left: 17px; }
  .process-line article {
    grid-template-columns: 36px minmax(0,1fr);
    gap: 14px;
    padding-bottom: 30px;
  }
  .process-line article>span { width: 36px; height: 36px; box-shadow: 0 0 0 5px var(--bg); }
  .process-line h3 { margin-top: 4px; font-size: 20px; }
  .process-line p { font-size: 11px; }
  .site-footer { padding: 54px 0 24px; }
  .footer-top { grid-template-columns: 1fr 1fr; gap: 34px 20px; padding-bottom: 38px; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-brand p { margin-top: 12px; }
  .footer-lockup.brand-lockup {
    --mark-symbol: 86px;
    --mark-word: 112px;
    --mark-source: 198px;
    --mark-shift: -83px;
    width: 204px;
    height: 59px;
  }
  .footer-lockup.brand-lockup .brand-copy { height: 55px; }
  .footer-lockup.brand-lockup .brand-word-crop { height: 42px; }
  .footer-lockup.brand-lockup .brand-subline { font-size: 5.7px; }
  .footer-bottom { gap: 9px; padding-top: 18px; line-height: 1.55; }
  .footer-network { opacity: .45; }
  .final-cta { padding-bottom: 48px; }
  .final-shell { min-height: 410px; padding-inline: 12px; }
  .final-shell h2 { font-size: clamp(45px,15vw,58px); }
  .cta-wire { margin-top: 46px; }
}

@media (max-width: 380px) {
  .brand { width: 165px; }
  .brand-lockup {
    --mark-symbol: 69px;
    --mark-word: 90px;
    --mark-source: 160px;
    --mark-shift: -67px;
    width: 165px;
  }
  .eco-flow,
  .eco-orbit.e1 { width: 330px; height: 330px; }
  .eco-orbit.e2 { width: 238px; height: 238px; }
  .ecosystem { height: 350px; }
  .en2 { right: 0; }
  .en6 { left: 0; }
}


/* ======================================================================
   SENSUS — AJUSTE MANUAL: logo definitivo + nueva ubicación del sistema
   Estas reglas están al final para reemplazar de forma segura el lockup viejo
   sin romper el resto del diseño existente.
   ====================================================================== */
.brand.brand-simple {
  width: 225px;
  height: auto;
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  overflow: visible;
  padding: 0;
}

.sensus-header-logo {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  object-fit: contain;
}

.footer-brand .sensus-footer-logo {
  display: block;
  width: 280px;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

/* El bloque "El sistema detrás" ahora ocupa el lugar de "Qué construimos". */
.system-section#soluciones {
  scroll-margin-top: 92px;
}

@media (max-width: 1180px) {
  .brand.brand-simple { width: 205px; }
  .footer-brand .sensus-footer-logo { width: 260px; }
}

@media (max-width: 900px) {
  .brand.brand-simple { width: 190px; }
}

@media (max-width: 620px) {
  .brand.brand-simple { width: 170px; }
  .sensus-header-logo { width: 100%; }
  .footer-brand .sensus-footer-logo { width: 235px; }
}

@media (max-width: 380px) {
  .brand.brand-simple { width: 158px; }
  .footer-brand .sensus-footer-logo { width: 220px; }
}

/* ==========================================================
   HERO — INTEGRATION WORKSPACE + WHATSAPP NAV
   ========================================================== */
.whatsapp-icon-btn{
  width:46px;height:46px;flex:0 0 46px;border-radius:50%;
  display:grid;place-items:center;border:1px solid rgba(17,213,229,.42);
  background:radial-gradient(circle at 35% 28%,rgba(39,231,244,.14),rgba(17,213,229,.035) 58%,rgba(5,11,20,.9));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.015),0 0 0 0 rgba(17,213,229,0);
  transition:transform .22s var(--ease),border-color .22s,box-shadow .22s,background .22s;
}
.whatsapp-icon-btn:hover{transform:translateY(-2px) scale(1.04);border-color:rgba(39,231,244,.78);box-shadow:0 0 0 5px rgba(17,213,229,.045),0 13px 32px rgba(0,0,0,.25)}
.whatsapp-icon-btn img{width:25px;height:25px;object-fit:contain;filter:hue-rotate(66deg) saturate(1.35) brightness(1.09) drop-shadow(0 0 8px rgba(17,213,229,.24))}
.mobile-whatsapp{display:flex!important;align-items:center;gap:9px}.mobile-whatsapp img{width:20px;height:20px;object-fit:contain;filter:hue-rotate(66deg) saturate(1.35) brightness(1.09)}

.hero-operations{min-height:640px;display:flex;align-items:center;justify-content:center;padding:22px 0}
.integration-board{width:100%;max-width:720px;border:1px solid rgba(255,255,255,.095);border-radius:26px;overflow:hidden;background:linear-gradient(150deg,rgba(10,24,38,.97),rgba(5,13,23,.98));box-shadow:0 34px 90px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.035);position:relative}
.integration-board::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(17,213,229,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(17,213,229,.025) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(to bottom,#000,transparent 75%);pointer-events:none}
.integration-board-head{height:68px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:2;background:rgba(3,10,18,.32)}
.board-title{display:flex;align-items:center;gap:10px}.board-title>i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 13px rgba(57,231,166,.8)}.board-title strong{display:block;font-size:10px;letter-spacing:.12em}.board-title small{display:block;color:#5f768d;font-size:7px;margin-top:4px}.board-status{border:1px solid rgba(17,213,229,.22);border-radius:999px;padding:7px 10px;color:var(--cyan);font-size:6px;letter-spacing:.13em;background:rgba(17,213,229,.035)}
.integration-board-body{display:grid;grid-template-columns:minmax(0,.9fr) minmax(210px,1.05fr) minmax(0,.9fr);gap:16px;padding:22px 20px 18px;position:relative;z-index:2;align-items:start}
.system-column{display:grid;gap:10px;align-content:start}.column-kicker{color:#536b81;font-size:6px;letter-spacing:.15em;margin:0 3px 3px;text-align:left}.destinations-column .column-kicker{text-align:right}
.hero-operations .system-node.integration-card{position:relative;inset:auto!important;width:100%;min-height:76px;border-radius:15px;padding:11px 11px;display:grid;grid-template-columns:46px 1fr;gap:10px;align-items:center;justify-items:stretch;text-align:left;background:linear-gradient(145deg,rgba(13,28,44,.92),rgba(7,16,28,.96));border:1px solid rgba(255,255,255,.085);box-shadow:none;transform:none;overflow:visible}
.hero-operations .system-node.integration-card:hover,.hero-operations .system-node.integration-card.active{transform:translateY(-2px);border-color:rgba(17,213,229,.42);background:linear-gradient(145deg,rgba(13,35,49,.96),rgba(7,18,31,.98));box-shadow:0 14px 30px rgba(0,0,0,.18),0 0 24px rgba(17,213,229,.045)}
.hero-operations .system-node.integration-card.active::after{right:9px;top:9px;width:5px;height:5px}
.platform-logo{width:46px;height:42px;border:1px solid rgba(255,255,255,.07);border-radius:11px;background:rgba(255,255,255,.025);display:grid!important;place-items:center;padding:8px;margin:0!important}
.platform-logo img{width:100%;max-width:100%;max-height:25px;object-fit:contain;display:block}.platform-logo.whatsapp-logo img{filter:hue-rotate(66deg) saturate(1.28) brightness(1.06)}
.platform-logo.custom-logo{font-size:11px!important;color:var(--cyan);font-weight:800;letter-spacing:.02em}
.hero-operations .platform-copy{display:block!important;min-width:0;margin:0!important}.hero-operations .platform-copy strong{display:block;font-size:10px;line-height:1.2;color:#f5fbff}.hero-operations .platform-copy small{display:block;margin-top:4px;color:#63798e;font-size:6px;line-height:1.35;text-transform:none;letter-spacing:.01em}
.flow-badge{position:absolute;right:9px;bottom:8px;font-style:normal;color:#547088;font-size:5px;letter-spacing:.12em}.integration-card.active .flow-badge{color:var(--green)}
.sources-column .integration-card::after,.destinations-column .integration-card::before{content:"";position:absolute;top:50%;width:16px;height:1px;background:linear-gradient(90deg,rgba(17,213,229,.5),rgba(17,213,229,.08));opacity:.7}.sources-column .integration-card::after{right:-17px}.destinations-column .integration-card::before{left:-17px;transform:scaleX(-1)}
.core-lane{display:flex;flex-direction:column;align-items:stretch;gap:10px;position:relative}.core-lane::before{content:"";position:absolute;left:50%;top:4px;bottom:5px;width:1px;background:linear-gradient(transparent,rgba(17,213,229,.12) 18%,rgba(17,213,229,.2) 52%,rgba(17,213,229,.06) 82%,transparent);z-index:-1}.core-connector-label{align-self:center;padding:6px 9px;border:1px solid var(--line);border-radius:999px;color:#60788e;background:#07111d;font-size:5px;letter-spacing:.12em}
.hero-operations .core-center.integration-core-card{position:relative;width:100%;height:auto;min-height:168px;border-radius:20px;padding:20px 17px;border:1px solid rgba(17,213,229,.34);background:radial-gradient(circle at 50% 0,rgba(17,213,229,.13),transparent 48%),linear-gradient(145deg,rgba(9,31,43,.96),rgba(6,16,28,.98));box-shadow:0 20px 46px rgba(0,0,0,.26),0 0 38px rgba(17,213,229,.045);display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}
.hero-operations .core-center.integration-core-card img{width:48px;margin:0 0 7px;filter:drop-shadow(0 0 13px rgba(17,213,229,.36))}.hero-operations .core-center.integration-core-card>span{font-size:6px;color:#6d879d;letter-spacing:.2em}.hero-operations .core-center.integration-core-card strong{font-size:12px;letter-spacing:.09em;margin-top:4px}.hero-operations .core-center.integration-core-card p{margin:9px auto 0;max-width:190px;color:#7e95a9;font-size:7px;line-height:1.5}.core-tags{display:flex;gap:5px;flex-wrap:wrap;justify-content:center;margin-top:12px}.core-tags b{border:1px solid rgba(17,213,229,.16);border-radius:999px;padding:5px 6px;color:#678095;font-size:5px;letter-spacing:.08em;font-weight:650;background:rgba(17,213,229,.025)}
.hero-operations .core-console{position:relative;left:auto;bottom:auto;transform:none;width:100%;border-radius:14px;padding:12px 13px;background:rgba(3,10,18,.78);box-shadow:none}.hero-operations .core-console>strong{font-size:10px;margin:7px 0 5px;line-height:1.35}.hero-operations .core-console p{font-size:7px;line-height:1.5}.hero-operations .console-event{margin-top:8px;padding-top:8px;font-size:5px;line-height:1.35}.hero-operations .console-head{font-size:5px}.hero-operations .console-head b{font-size:5px}
.integration-log{border:1px solid var(--line);border-radius:13px;background:rgba(3,9,17,.45);overflow:hidden}.integration-log>div{display:grid;grid-template-columns:44px 1fr auto;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid var(--line-soft);font-size:5px}.integration-log>div:last-child{border-bottom:0}.integration-log time{color:#4f687e}.integration-log span{color:#768b9f}.integration-log b{color:var(--green);font-size:5px;letter-spacing:.08em}
.integration-board-footer{min-height:49px;padding:10px 20px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:center;gap:9px;position:relative;z-index:2;background:rgba(3,10,18,.34)}.integration-board-footer span{color:#536b80;font-size:5px;letter-spacing:.13em;margin-right:3px}.integration-board-footer strong{font-size:7px}.integration-board-footer i{font-style:normal;color:var(--cyan);font-size:8px}

@media(max-width:1100px){.hero-operations{max-width:820px!important}.integration-board{max-width:760px}}
@media(max-width:760px){
  .hero-operations{min-height:auto;padding:12px 0 0}.integration-board{border-radius:21px}.integration-board-head{height:62px;padding:0 14px}.board-title small{display:none}.integration-board-body{grid-template-columns:1fr;gap:12px;padding:14px}.column-kicker,.destinations-column .column-kicker{text-align:left}.sources-column .integration-card::after,.destinations-column .integration-card::before{display:none}.system-column{grid-template-columns:1fr 1fr 1fr;gap:7px}.column-kicker{grid-column:1/-1}.hero-operations .system-node.integration-card{min-height:90px;grid-template-columns:1fr;gap:7px;text-align:center;padding:9px}.platform-logo{margin:auto!important;width:44px;height:39px}.hero-operations .platform-copy strong{font-size:8px}.hero-operations .platform-copy small{font-size:5px}.flow-badge{position:static;display:block;text-align:center;font-size:4px}.core-lane{order:2}.destinations-column{order:3}.hero-operations .core-center.integration-core-card{min-height:145px}.integration-log{display:none}.integration-board-footer{flex-wrap:wrap}.integration-board-footer span{width:100%;text-align:center;margin:0}.whatsapp-icon-btn{display:none!important}
}
@media(max-width:430px){.system-column{grid-template-columns:1fr}.hero-operations .system-node.integration-card{min-height:69px;grid-template-columns:42px 1fr auto;text-align:left}.platform-logo{width:42px;height:38px}.flow-badge{font-size:4px}.board-status{padding:6px 8px}.integration-board-footer{gap:6px}}


/* Floating WhatsApp */
.floating-whatsapp{position:fixed;right:28px;bottom:28px;z-index:96;width:74px;height:74px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(17,213,229,.48);background:radial-gradient(circle at 35% 28%,rgba(39,231,244,.2),rgba(17,213,229,.06) 55%,rgba(5,11,20,.96));box-shadow:0 18px 42px rgba(0,0,0,.32),0 0 0 1px rgba(255,255,255,.02) inset,0 0 22px rgba(17,213,229,.18);transition:transform .22s var(--ease),border-color .22s,box-shadow .22s,background .22s;backdrop-filter:blur(8px)}
.floating-whatsapp:hover{transform:translateY(-4px) scale(1.03);border-color:rgba(39,231,244,.82);box-shadow:0 22px 52px rgba(0,0,0,.4),0 0 0 8px rgba(17,213,229,.05),0 0 28px rgba(17,213,229,.22)}
.floating-whatsapp img{width:38px;height:38px;object-fit:contain;filter:hue-rotate(66deg) saturate(1.42) brightness(1.1) drop-shadow(0 0 10px rgba(17,213,229,.28))}

@media(max-width:760px){
  .floating-whatsapp{right:18px;bottom:18px;width:68px;height:68px}
  .floating-whatsapp img{width:35px;height:35px}
}

/* ==========================================================
   AJUSTE FINO — ICONOS DEL HERO / WHATSAPP
   ========================================================== */

/*
  El PNG de WhatsApp tiene aire transparente alrededor del logo.
  Lo ampliamos visualmente sin modificar el tamaño de la card.
*/
.hero-operations .platform-logo.whatsapp-logo {
  overflow: hidden;
  padding: 5px;
}

.hero-operations .platform-logo.whatsapp-logo img {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: contain;
  transform: scale(1.9);
  transform-origin: center;
}

/*
  Centrado óptico de los identificadores WWW / ADM / AUTO / SYS.
  Evita que la línea base de la tipografía los haga parecer corridos.
*/
.hero-operations .platform-logo.custom-logo {
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  text-align: center;
  line-height: 1;
  letter-spacing: .015em;
  text-indent: 0;
  font-size: 11px !important;
  font-weight: 850;
}

/* Botón flotante: misma card, logo bastante más protagonista. */
.floating-whatsapp {
  overflow: hidden;
}

.floating-whatsapp img {
  width: 46px;
  height: 46px;
  max-width: none;
  max-height: none;
  object-fit: contain;
  transform: scale(2.05);
  transform-origin: center;
}

@media (max-width: 760px) {
  .floating-whatsapp img {
    width: 42px;
    height: 42px;
    transform: scale(2.05);
  }

  .hero-operations .platform-logo.custom-logo {
    font-size: 10px !important;
  }
}

@media (max-width: 430px) {
  .hero-operations .platform-logo.whatsapp-logo img {
    transform: scale(1.82);
  }
}

/* ==========================================================
   MOBILE HEADER — AJUSTE DEFINITIVO
   Mantiene logo y menú contenidos dentro de la barra superior.
   ========================================================== */
@media (max-width: 900px) {
  .site-header {
    background: rgba(5, 11, 20, .94);
    border-bottom: 1px solid rgba(255,255,255,.055);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
  }

  .nav-wrap {
    min-height: 76px !important;
    height: 76px;
    width: min(calc(100% - 28px), var(--container));
    padding: 0 !important;
    gap: 12px !important;
    justify-content: space-between;
  }

  .brand.brand-simple {
    position: relative !important;
    width: 164px !important;
    height: 50px !important;
    flex: 0 0 164px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .brand.brand-simple .sensus-header-logo,
  .brand .sensus-header-logo {
    position: static !important;
    inset: auto !important;
    display: block !important;
    width: 158px !important;
    max-width: 158px !important;
    height: auto !important;
    margin: 0 !important;
    object-fit: contain !important;
    transform: none !important;
  }

  .nav-actions {
    margin-left: auto !important;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }

  .menu-btn {
    position: static !important;
    inset: auto !important;
    display: flex !important;
    width: 48px !important;
    height: 48px !important;
    flex: 0 0 48px;
    margin: 0 !important;
    border-radius: 15px;
    background: rgba(7,17,30,.72);
  }

  .mobile-menu {
    top: 76px !important;
    left: 14px !important;
    right: 14px !important;
    max-height: calc(100svh - 92px);
    overflow-y: auto;
  }

  .hero {
    padding-top: 124px !important;
  }
}

@media (max-width: 620px) {
  .nav-wrap {
    width: calc(100% - 24px);
    min-height: 72px !important;
    height: 72px;
  }

  .brand.brand-simple {
    width: 150px !important;
    flex-basis: 150px !important;
    height: 46px !important;
  }

  .brand.brand-simple .sensus-header-logo,
  .brand .sensus-header-logo {
    width: 146px !important;
    max-width: 146px !important;
  }

  .menu-btn {
    width: 46px !important;
    height: 46px !important;
    flex-basis: 46px;
  }

  .mobile-menu {
    top: 72px !important;
    left: 12px !important;
    right: 12px !important;
  }

  .hero {
    padding-top: 116px !important;
  }
}

@media (max-width: 380px) {
  .brand.brand-simple {
    width: 140px !important;
    flex-basis: 140px !important;
  }

  .brand.brand-simple .sensus-header-logo,
  .brand .sensus-header-logo {
    width: 136px !important;
    max-width: 136px !important;
  }
}

/* ==========================================================
   PRODUCT LAB — DEMOS 2026
   ========================================================== */
.demos .section-heading { margin-bottom: 34px; }
.demo-switcher {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
  padding: 0;
  margin-bottom: 16px;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.demo-tab {
  min-width: 0;
  min-height: 82px;
  padding: 15px 16px;
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  column-gap: 11px;
  align-items: center;
  text-align: left;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 17px;
  background: linear-gradient(145deg, rgba(12,24,38,.72), rgba(7,15,26,.88));
  color: #8ea0b4;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
  transition: transform .22s var(--ease), border-color .22s, background .22s, box-shadow .22s;
}
.demo-tab > span {
  grid-row: 1 / 3;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  margin: 0;
  border-radius: 11px;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.025);
  color: #6f8599;
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .08em;
}
.demo-tab strong {
  display: block;
  min-width: 0;
  font-size: 11px;
  line-height: 1.2;
  color: #dbe5ee;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.demo-tab small {
  display: block;
  min-width: 0;
  font-size: 7px;
  line-height: 1.3;
  color: #60758a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.demo-tab:hover { transform: translateY(-2px); border-color: rgba(255,255,255,.14); }
.demo-tab.active {
  color: #fff;
  border-color: color-mix(in srgb, var(--demo-tab-accent, #11d5e5) 42%, transparent);
  background: radial-gradient(circle at 0 0, color-mix(in srgb, var(--demo-tab-accent, #11d5e5) 12%, transparent), transparent 45%), linear-gradient(145deg, rgba(12,25,40,.96), rgba(7,15,26,.96));
  box-shadow: 0 18px 45px rgba(0,0,0,.14), inset 0 0 0 1px color-mix(in srgb, var(--demo-tab-accent, #11d5e5) 12%, transparent);
}
.demo-tab.active > span { color: var(--demo-tab-accent, #11d5e5); border-color: color-mix(in srgb, var(--demo-tab-accent, #11d5e5) 32%, transparent); background: color-mix(in srgb, var(--demo-tab-accent, #11d5e5) 8%, transparent); }
.demo-tab[data-demo="commerce"] { --demo-tab-accent:#7c6cff; }
.demo-tab[data-demo="motors"] { --demo-tab-accent:#ff7a1a; }
.demo-tab[data-demo="agendas"] { --demo-tab-accent:#ff6f91; }

.demo-stage {
  --demo-accent: #7c6cff;
  --demo-accent-soft: rgba(124,108,255,.12);
  display: grid;
  grid-template-columns: minmax(285px,.30fr) minmax(0,.70fr);
  min-height: 720px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.08);
  overflow: hidden;
  background: linear-gradient(145deg,#08131f,#050c15);
  box-shadow: 0 30px 85px rgba(0,0,0,.22);
  transition: border-color .3s, box-shadow .3s, background .3s;
}
.demo-stage[data-theme="commerce"] { --demo-accent:#7c6cff; --demo-accent-soft:rgba(124,108,255,.12); }
.demo-stage[data-theme="motors"] { --demo-accent:#ff7a1a; --demo-accent-soft:rgba(255,122,26,.12); }
.demo-stage[data-theme="agendas"] { --demo-accent:#ff6f91; --demo-accent-soft:rgba(255,111,145,.12); }
.demo-info {
  position: relative;
  padding: 42px;
  justify-content: center;
  border-right: 1px solid rgba(255,255,255,.07);
  background: radial-gradient(circle at 0 0, var(--demo-accent-soft), transparent 42%), linear-gradient(180deg, rgba(9,21,34,.94), rgba(7,16,27,.98));
}
.demo-info::after {
  content:"";
  position:absolute;
  width:120px;
  height:120px;
  right:-60px;
  top:50%;
  border-radius:50%;
  background:radial-gradient(circle,var(--demo-accent-soft),transparent 70%);
  pointer-events:none;
}
.demo-status { color:#71869a; font-size:7px; letter-spacing:.14em; }
.demo-status i { background:var(--demo-accent); box-shadow:0 0 14px color-mix(in srgb,var(--demo-accent) 75%,transparent); }
.demo-index { margin-top:25px; color:var(--demo-accent); font-size:8px; font-weight:850; letter-spacing:.15em; }
.demo-info h3 { margin-top:10px; font-size:35px; max-width:390px; }
.demo-info p { max-width:390px; color:#8599ad; }
.demo-tags { margin-top:25px; }
.demo-tags span { color:#7e93a6; border-color:rgba(255,255,255,.08); background:rgba(255,255,255,.018); }
.demo-info .btn { border-color:color-mix(in srgb,var(--demo-accent) 42%,transparent); background:color-mix(in srgb,var(--demo-accent) 7%,rgba(5,11,20,.9)); }
.demo-info .btn:hover { border-color:color-mix(in srgb,var(--demo-accent) 72%,transparent); background:color-mix(in srgb,var(--demo-accent) 11%,rgba(5,11,20,.9)); }
.demo-browser { padding:16px; background:linear-gradient(180deg,#040a12,#050b13); }
.browser-bar { height:42px; border-radius:15px 15px 0 0; background:#09131e; }
.browser-bar > span { color:var(--demo-accent); }
.demo-viewport { height:650px; min-height:0; max-height:none; border-radius:0 0 15px 15px; background:#080d14; }
.demo-viewport iframe { background:#080d14; }

@media (max-width: 1080px) {
  .demo-switcher { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .demo-stage { grid-template-columns:1fr; min-height:0; }
  .demo-info { border-right:0; border-bottom:1px solid rgba(255,255,255,.07); padding:30px; }
  .demo-info::after { display:none; }
  .demo-info h3,.demo-info p { max-width:760px; }
  .demo-viewport { height:min(72vh,680px); min-height:540px; }
}
@media (max-width: 620px) {
  .demo-switcher { grid-template-columns:1fr 1fr; gap:8px; }
  .demo-tab { min-height:72px; padding:12px 10px; column-gap:8px; border-radius:15px; }
  .demo-tab > span { width:30px; height:30px; border-radius:10px; font-size:7px; }
  .demo-tab strong { font-size:10px; }
  .demo-tab small { font-size:6px; }
  .demo-stage { border-radius:20px; }
  .demo-info { padding:24px 20px; }
  .demo-index { margin-top:18px; }
  .demo-info h3 { font-size:27px; }
  .demo-info p { font-size:12px; line-height:1.65; }
  .demo-browser { padding:8px; }
  .demo-viewport { height:68svh; min-height:500px; max-height:620px; }
}
@media (max-width: 380px) {
  .demo-switcher { grid-template-columns:1fr; }
  .demo-tab { min-height:64px; }
  .demo-viewport { min-height:480px; }
}

/* ==========================================================
   DESKTOP HEADER — ajuste óptico de logo
   ========================================================== */
@media (min-width: 901px) {
  .site-header .nav-wrap {
    min-height: 82px;
    align-items: center;
  }
  .site-header .brand.brand-simple {
    width: 178px !important;
    height: 46px !important;
    flex: 0 0 178px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow: visible !important;
  }
  .site-header .brand.brand-simple .sensus-header-logo,
  .site-header .brand .sensus-header-logo {
    position: static !important;
    width: 168px !important;
    max-width: 168px !important;
    height: auto !important;
    transform: none !important;
    margin: 0 !important;
  }
  .site-header.scrolled .brand.brand-simple .sensus-header-logo {
    width: 160px !important;
    max-width: 160px !important;
  }
}