:root {
  --ink-950: #020914;
  --ink-900: #03101f;
  --ink-850: #07182c;
  --ink-800: #0a2039;
  --surface: rgba(8, 28, 50, .72);
  --surface-strong: #0a213a;
  --surface-soft: rgba(255, 255, 255, .055);
  --line: rgba(160, 220, 255, .15);
  --line-strong: rgba(127, 230, 255, .34);
  --white: #f7fbff;
  --text: #dceaf6;
  --muted: #95abc0;
  --cyan: #5de7ff;
  --cyan-bright: #a5f5ff;
  --blue: #0aaeed;
  --blue-deep: #0871f9;
  --green: #4ef6b1;
  --danger: #ff9eac;
  --shadow: 0 30px 80px rgba(0, 4, 14, .42);
  --radius-sm: .8rem;
  --radius-md: 1.25rem;
  --radius-lg: 2rem;
  --shell: min(90rem, calc(100% - 2rem));
  --ease: cubic-bezier(.22, 1, .36, 1);
  color-scheme: dark;
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: 6rem;
  background: var(--ink-950);
}

[id] { scroll-margin-top: 6rem; }

body {
  margin: 0;
  min-width: 20rem;
  overflow-x: clip;
  background:
    radial-gradient(circle at 84% 8%, rgba(0, 176, 239, .11), transparent 27rem),
    var(--ink-950);
  color: var(--text);
  font-family: "Sora", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 1rem;
  line-height: 1.6;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body.menu-open { overflow: hidden; }

::selection { color: var(--ink-950); background: var(--cyan); }

a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button:disabled { opacity: .58; cursor: wait; transform: none !important; }
button, a { -webkit-tap-highlight-color: transparent; }
img, canvas, svg { display: block; max-width: 100%; }
p { margin: 0 0 1.2rem; }
h1, h2, h3 { margin: 0; color: var(--white); line-height: 1.06; letter-spacing: -.045em; }
h1 { font-size: clamp(3.05rem, 14vw, 6.2rem); }
h2 { font-size: clamp(2.25rem, 8.5vw, 4.6rem); }
h3 { font-size: clamp(1.3rem, 4vw, 2rem); letter-spacing: -.025em; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: fixed;
  z-index: 1000;
  inset-block-start: .75rem;
  inset-inline-start: .75rem;
  padding: .8rem 1rem;
  border-radius: .6rem;
  color: var(--ink-950);
  background: var(--cyan);
  transform: translateY(-180%);
  transition: transform .2s var(--ease);
}

.skip-link:focus { transform: translateY(0); }

:focus-visible {
  outline: 3px solid var(--cyan-bright);
  outline-offset: 3px;
}

.shell { width: var(--shell); margin-inline: auto; }
.section { position: relative; padding-block: clamp(5.5rem, 12vw, 10rem); }

.eyebrow {
  display: flex;
  align-items: center;
  gap: .65rem;
  margin: 0 0 1.2rem;
  color: var(--cyan);
  font-size: .72rem;
  font-weight: 760;
  letter-spacing: .16em;
  line-height: 1.4;
  text-transform: uppercase;
}

.live-dot {
  display: inline-block;
  width: .48rem;
  height: .48rem;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 0 .28rem rgba(78, 246, 177, .08), 0 0 1rem rgba(78, 246, 177, .58);
}

.button {
  position: relative;
  display: inline-flex;
  min-height: 3.25rem;
  align-items: center;
  justify-content: center;
  gap: .75rem;
  padding: .85rem 1.2rem;
  overflow: hidden;
  border: 1px solid rgba(156, 231, 255, .2);
  border-radius: 999px;
  color: var(--white);
  background: rgba(255, 255, 255, .055);
  font-size: .88rem;
  font-weight: 720;
  line-height: 1;
  cursor: pointer;
  transition: transform .22s var(--ease), border-color .22s ease, background-color .22s ease, box-shadow .22s ease;
}

.button::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent 25%, rgba(255,255,255,.22), transparent 72%);
  transform: translateX(-120%);
  transition: transform .55s var(--ease);
}

.button:hover::before, .button:focus-visible::before { transform: translateX(120%); }
.button:hover, .button:focus-visible { transform: translateY(-2px); border-color: rgba(126, 237, 255, .55); }
.button:active { transform: translateY(0) scale(.985); }
.button svg { width: 1.1rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.button-primary { color: #00101b; background: linear-gradient(135deg, var(--cyan-bright), var(--blue)); box-shadow: 0 12px 34px rgba(10, 174, 237, .24); border-color: transparent; }
.button-primary:hover, .button-primary:focus-visible { box-shadow: 0 18px 48px rgba(10, 174, 237, .34); }
.button-ghost { background: rgba(4, 17, 31, .55); }
.button-small { min-height: 2.7rem; padding: .75rem 1rem; font-size: .8rem; }

.text-link {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
  gap: .75rem;
  color: var(--cyan);
  font-size: .88rem;
  font-weight: 740;
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: .28rem;
  transition: color .2s ease, text-decoration-color .2s ease;
}

.text-link:hover, .text-link:focus-visible { color: var(--cyan-bright); text-decoration-color: currentColor; }
.text-link span:last-child { transition: transform .2s var(--ease); }
.text-link:hover span:last-child, .text-link:focus-visible span:last-child { transform: translate(.18rem, -.18rem); }

.site-header {
  position: fixed;
  z-index: 100;
  inset-block-start: 0;
  inset-inline: 0;
  padding: .8rem 0;
  transition: transform .35s var(--ease), background-color .25s ease, border-color .25s ease;
}

.site-header.is-scrolled {
  background: rgba(2, 9, 20, .84);
  border-block-end: 1px solid var(--line);
  box-shadow: 0 12px 34px rgba(0,0,0,.16);
  backdrop-filter: blur(14px);
}

.site-header.is-hidden { transform: translateY(-110%); }

.nav-shell {
  width: var(--shell);
  min-height: 4rem;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .9rem;
}

.brand { display: inline-flex; width: 8.8rem; align-items: center; z-index: 2; }
.brand img { width: 100%; height: 3.8rem; object-fit: contain; object-position: left center; }

.nav-toggle {
  z-index: 4;
  display: inline-grid;
  width: 3rem;
  height: 3rem;
  place-content: center;
  gap: .38rem;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--white);
  background: rgba(255, 255, 255, .05);
}

.nav-toggle span:not(.sr-only) { width: 1.15rem; height: 1px; background: currentColor; transition: transform .25s var(--ease); }
.nav-toggle[aria-expanded="true"] span:nth-last-child(2) { transform: translateY(.22rem) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:last-child { transform: translateY(-.22rem) rotate(-45deg); }

.site-nav {
  position: fixed;
  z-index: 3;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: .45rem;
  padding: 6rem 1.25rem 2rem;
  overflow-y: auto;
  background: rgba(2, 9, 20, .98);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-1rem);
  transition: opacity .25s ease, transform .35s var(--ease), visibility .25s;
}

.site-nav.is-open { opacity: 1; visibility: visible; transform: translateY(0); }
.site-nav a { padding: .5rem 0; color: var(--white); font-size: clamp(2rem, 10vw, 3.4rem); font-weight: 720; letter-spacing: -.04em; }
.site-nav a:hover, .site-nav a:focus-visible { color: var(--cyan); }
.nav-actions { display: none; }

.hero {
  position: relative;
  min-height: 53rem;
  display: grid;
  align-items: center;
  overflow: hidden;
  padding-block: 8.4rem 6rem;
  isolation: isolate;
  background: linear-gradient(180deg, var(--ink-900), var(--ink-950));
}

.network-canvas { position: absolute; z-index: -4; inset: 0; width: 100%; height: 100%; opacity: .65; }
.hero-grid {
  position: absolute;
  z-index: -3;
  inset: 0;
  background-image: linear-gradient(rgba(100,215,255,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(100,215,255,.055) 1px, transparent 1px);
  background-size: 3.5rem 3.5rem;
  mask-image: radial-gradient(circle at 70% 48%, black, transparent 70%);
}

.hero::after {
  content: "";
  position: absolute;
  z-index: -2;
  inset-inline: 0;
  inset-block-end: -1px;
  height: 11rem;
  background: linear-gradient(transparent, var(--ink-950));
  pointer-events: none;
}

.hero-glow { position: absolute; z-index: -3; width: 24rem; height: 24rem; border-radius: 50%; filter: blur(80px); opacity: .22; pointer-events: none; }
.hero-glow-one { inset: 9% -12rem auto auto; background: var(--blue); }
.hero-glow-two { inset: auto auto -7rem -10rem; background: #0d58f6; }

.hero-inner { display: grid; gap: 4.5rem; align-items: center; }
.hero-copy { position: relative; z-index: 3; }
.hero-copy h1 { max-width: 10ch; text-wrap: balance; }
.hero-copy h1 span { color: var(--cyan); text-shadow: 0 0 2.5rem rgba(93, 231, 255, .28); }
.hero-lede { max-width: 40rem; margin-block: 1.5rem 0; color: #b7c9d8; font-size: clamp(1.02rem, 2vw, 1.22rem); line-height: 1.62; }
.hero-actions { display: grid; gap: .75rem; margin-block-start: 1.8rem; }
.hero-proof { display: flex; flex-wrap: wrap; gap: .55rem; margin-block-start: 2rem; }
.hero-proof span { padding: .48rem .7rem; border: 1px solid var(--line); border-radius: 999px; color: #9db3c7; background: rgba(4, 18, 32, .46); font-size: .66rem; font-weight: 740; letter-spacing: .09em; }

.hero-visual { position: relative; z-index: 2; min-height: 27rem; perspective: 70rem; }
.orbital-stage {
  position: relative;
  width: min(100%, 38rem);
  aspect-ratio: 1;
  margin-inline: auto;
  transform-style: preserve-3d;
  transition: transform .35s var(--ease);
}

.orbital-stage::before {
  content: "";
  position: absolute;
  inset: 15%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(2, 13, 26, .2) 0 28%, rgba(31, 186, 255, .08) 50%, transparent 71%);
  box-shadow: inset 0 0 5rem rgba(64, 219, 255, .1);
  transform: translateZ(-2rem);
}

.orbit { position: absolute; inset: 50%; width: 84%; aspect-ratio: 1; border: 1px solid rgba(113, 222, 255, .21); border-radius: 50%; transform-style: preserve-3d; pointer-events: none; }
.orbit-one { transform: translate(-50%, -50%) rotateX(68deg) rotateZ(12deg); }
.orbit-two { width: 66%; transform: translate(-50%, -50%) rotateY(66deg) rotateZ(22deg); }
.orbit-three { width: 52%; border-style: dashed; transform: translate(-50%, -50%) rotateX(18deg) rotateY(61deg); opacity: .6; }
.orbit::after { content: ""; position: absolute; inset-block-start: -3px; inset-inline-start: 50%; width: 6px; height: 6px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 1.2rem var(--cyan); }

.core-sphere {
  position: absolute;
  z-index: 3;
  inset: 50% auto auto 50%;
  width: 10.8rem;
  aspect-ratio: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(181, 244, 255, .48);
  border-radius: 50%;
  background: radial-gradient(circle at 32% 25%, #8bf2ff 0, #0db9ed 20%, #0870ea 55%, #03275c 82%);
  box-shadow: inset -1.2rem -1.4rem 2.2rem rgba(0, 8, 38, .42), inset .8rem .8rem 1.2rem rgba(255,255,255,.15), 0 0 4rem rgba(0, 173, 239, .3), 0 2rem 4rem rgba(0,0,0,.35);
  transform: translate(-50%, -50%) translateZ(2.4rem);
}

.core-radar { position: absolute; inset: 10%; border: 1px solid rgba(255,255,255,.23); border-radius: inherit; }
.core-radar::before, .core-radar::after { content: ""; position: absolute; inset: 13%; border: 1px solid rgba(255,255,255,.13); border-radius: inherit; }
.core-radar::after { inset: 30%; }
.core-sphere strong { margin-top: .6rem; color: white; font-size: .77rem; letter-spacing: .08em; }
.core-sphere small { color: rgba(255,255,255,.78); font-size: .52rem; letter-spacing: .13em; }
.signal-bars { display: flex; align-items: end; gap: .18rem; height: 2.8rem; }
.signal-bars i { width: .36rem; border-radius: 1px; background: white; box-shadow: 0 0 .8rem rgba(255,255,255,.35); }
.signal-bars i:nth-child(1) { height: 28%; }.signal-bars i:nth-child(2) { height: 45%; }.signal-bars i:nth-child(3) { height: 62%; }.signal-bars i:nth-child(4) { height: 80%; }.signal-bars i:nth-child(5) { height: 100%; }

.orbit-node {
  position: absolute;
  z-index: 4;
  width: 7.7rem;
  min-height: 5.3rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: .8rem;
  border: 1px solid rgba(145, 227, 255, .25);
  border-radius: 1rem;
  background: linear-gradient(145deg, rgba(16, 49, 79, .82), rgba(4, 17, 31, .76));
  box-shadow: 0 1.2rem 3rem rgba(0,0,0,.28), inset 0 1px rgba(255,255,255,.08);
  backdrop-filter: blur(10px);
  transform-style: preserve-3d;
}

.orbit-node > span:not(.node-icon) { color: var(--white); font-size: .74rem; font-weight: 800; letter-spacing: .05em; }
.orbit-node small { color: var(--muted); font-size: .58rem; line-height: 1.25; }
.node-icon { position: absolute; inset-block-start: .7rem; inset-inline-end: .7rem; color: var(--cyan); font-size: .9rem; }
.node-pbx { inset: 5% auto auto 10%; transform: rotateY(10deg) translateZ(1rem); }
.node-sms { inset: 8% 2% auto auto; transform: rotateY(-14deg) translateZ(2rem); }
.node-crm { inset: auto auto 7% 2%; transform: rotateY(12deg) translateZ(1.2rem); }
.node-sip { inset: auto 6% 4% auto; transform: rotateY(-12deg) translateZ(2.6rem); }
.telemetry { position: absolute; z-index: 5; display: none; min-width: 7rem; padding: .65rem .8rem; border-inline-start: 1px solid var(--cyan); color: var(--muted); background: rgba(2, 10, 20, .5); font-size: .52rem; letter-spacing: .08em; }
.telemetry strong { display: block; color: var(--white); font-size: .64rem; }
.telemetry-top { inset: 20% auto auto 34%; }.telemetry-bottom { inset: auto 31% 17% auto; }

.scroll-cue { position: absolute; z-index: 4; inset: auto auto 2rem 50%; display: none; align-items: center; gap: .8rem; color: var(--muted); font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; transform: translateX(-50%); }
.scroll-cue i { width: 2.3rem; height: 1px; background: var(--line-strong); position: relative; }
.scroll-cue i::after { content: ""; position: absolute; inset: -2px 0 auto auto; width: 5px; height: 5px; border-radius: 50%; background: var(--cyan); }

.signal-strip { position: relative; z-index: 2; border-block: 1px solid var(--line); background: rgba(3, 15, 28, .82); }
.signal-grid { display: grid; grid-template-columns: 1fr 1fr; }
.signal-grid > div { min-height: 7.4rem; display: flex; flex-direction: column; justify-content: center; padding: 1.1rem; border-inline-end: 1px solid var(--line); border-block-end: 1px solid var(--line); }
.signal-grid > div:nth-child(2n) { border-inline-end: 0; }
.signal-grid > div:nth-last-child(-n+2) { border-block-end: 0; }
.signal-grid strong { color: var(--cyan); font-size: clamp(1.7rem, 8vw, 2.8rem); font-weight: 550; letter-spacing: -.04em; line-height: 1; }
.signal-grid span { max-width: 15ch; margin-block-start: .45rem; color: var(--muted); font-size: .67rem; line-height: 1.4; }

.intro { overflow: hidden; }
.intro-grid { display: grid; gap: 2rem; }
.section-heading h2 { max-width: 17ch; text-wrap: balance; }
.intro-copy { max-width: 42rem; color: var(--muted); }
.intro-copy .lead { color: var(--text); font-size: clamp(1.08rem, 3vw, 1.4rem); line-height: 1.55; }
.principles-grid { display: grid; margin-block-start: 4rem; border-block-start: 1px solid var(--line); }
.principle { position: relative; padding-block: 2rem; border-block-end: 1px solid var(--line); }
.principle .index, .industry-card .index { display: inline-block; margin-block-end: 2.5rem; color: var(--cyan); font-size: .68rem; font-weight: 760; letter-spacing: .1em; }
.principle h3 { margin-block-end: .75rem; }
.principle p { max-width: 25rem; margin: 0; color: var(--muted); font-size: .9rem; }

.section-dark { background: linear-gradient(180deg, #061529, #04101f); }
.split-heading { display: grid; gap: 1.5rem; margin-block-end: 3rem; }
.split-heading > p { max-width: 35rem; color: var(--muted); }
.solution-explorer { border-block-start: 1px solid var(--line); }
.solution-tabs { display: flex; gap: .35rem; padding-block: 1rem; overflow-x: auto; scrollbar-width: thin; scroll-snap-type: x mandatory; }
.solution-tabs button { flex: 0 0 auto; min-height: 3rem; padding: .75rem 1rem; border: 1px solid transparent; border-radius: 999px; color: var(--muted); background: transparent; font-size: .77rem; font-weight: 760; cursor: pointer; scroll-snap-align: start; transition: color .2s ease, border-color .2s ease, background-color .2s ease; }
.solution-tabs button span { margin-inline-end: .4rem; color: #59748d; font-size: .62rem; }
.solution-tabs button[aria-selected="true"] { color: var(--white); border-color: var(--line-strong); background: rgba(52, 199, 255, .09); }
.solution-panel { display: grid; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: rgba(255,255,255,.025); box-shadow: var(--shadow); }
.solution-media { position: relative; min-height: 0; aspect-ratio: 1013 / 600; overflow: hidden; background: var(--surface-strong); }
.solution-media img { width: 100%; height: 100%; object-fit: cover; transition: opacity .25s ease, transform .6s var(--ease); }
.solution-media.is-changing img { opacity: 0; transform: scale(1.025); }
.image-shade { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 48%, rgba(2, 10, 20, .88)); }
.media-status { position: absolute; inset: auto auto 1rem 1rem; display: flex; align-items: center; gap: .6rem; padding: .6rem .78rem; border: 1px solid rgba(255,255,255,.17); border-radius: 999px; color: var(--white); background: rgba(3, 16, 30, .76); font-size: .66rem; font-weight: 700; backdrop-filter: blur(10px); }
.solution-copy { padding: 2rem 1.25rem 2.2rem; }
.solution-kicker { margin-block-end: .9rem; color: var(--cyan); font-size: .68rem; font-weight: 760; letter-spacing: .14em; }
.solution-copy h3 { max-width: 18ch; margin-block-end: 1.2rem; font-size: clamp(1.8rem, 6vw, 3.1rem); }
.solution-copy > p:not(.solution-kicker) { max-width: 39rem; color: var(--muted); }
.feature-list, .check-list { padding: 0; margin: 1.5rem 0 1.8rem; list-style: none; }
.feature-list li, .check-list li { position: relative; padding: .8rem 0 .8rem 1.6rem; border-block-start: 1px solid var(--line); color: var(--text); font-size: .86rem; }
.feature-list li::before, .check-list li::before { content: ""; position: absolute; inset: 1.15rem auto auto .1rem; width: .5rem; height: .5rem; border: 1px solid var(--cyan); border-radius: 50%; box-shadow: 0 0 .7rem rgba(93, 231, 255, .35); }
.noscript-note { padding: 1rem; color: var(--muted); }

.operations { overflow: hidden; }
.operations-grid { display: grid; gap: 3rem; align-items: center; }
.operations-copy h2 { max-width: 15ch; }
.operations-copy > p:not(.eyebrow) { max-width: 40rem; color: var(--muted); }
.check-list li { max-width: 38rem; }
.ops-stage { position: relative; padding: .7rem; border: 1px solid rgba(131, 224, 255, .19); border-radius: var(--radius-lg); background: linear-gradient(150deg, rgba(16, 52, 84, .72), rgba(4, 16, 30, .88)); box-shadow: var(--shadow); transform-style: preserve-3d; transition: transform .35s var(--ease); }
.ops-toolbar { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; padding: .8rem .7rem 1rem; color: #819bb1; font-size: .58rem; letter-spacing: .09em; }
.ops-toolbar div { display: flex; align-items: center; gap: .55rem; color: var(--white); }
.ops-grid { position: relative; z-index: 2; display: grid; gap: .6rem; }
.metric-card { position: relative; overflow: hidden; padding: 1.1rem; border: 1px solid var(--line); border-radius: 1rem; background: rgba(4, 20, 37, .74); box-shadow: inset 0 1px rgba(255,255,255,.04); }
.metric-card > span { display: block; color: var(--muted); font-size: .68rem; }
.metric-card > strong { color: var(--white); font-size: 2rem; font-weight: 550; letter-spacing: -.05em; }
.metric-card small { display: block; margin-block-start: .15rem; color: #6f899f; font-size: .58rem; }
.metric-primary { min-height: 8.5rem; background: linear-gradient(145deg, rgba(11, 111, 223, .75), rgba(0, 169, 222, .44)); }
.mini-bars { position: absolute; inset: auto .8rem 1rem auto; height: 3.5rem; display: flex; align-items: end; gap: .22rem; }
.mini-bars i { width: .4rem; border-radius: 1rem; background: rgba(255,255,255,.6); }.mini-bars i:nth-child(1){height:30%}.mini-bars i:nth-child(2){height:65%}.mini-bars i:nth-child(3){height:42%}.mini-bars i:nth-child(4){height:88%}.mini-bars i:nth-child(5){height:63%}.mini-bars i:nth-child(6){height:75%}.mini-bars i:nth-child(7){height:100%}
.queue-card > div { display: flex; align-items: center; justify-content: space-between; }.queue-card > div span { color: var(--muted); font-size: .68rem; }.queue-card > div strong { color: var(--cyan); font-size: 1.4rem; }
.queue-card ol { padding: 0; margin: .8rem 0 0; list-style: none; }.queue-card li { display: grid; grid-template-columns: 1.6rem 1fr auto; align-items: center; gap: .55rem; padding: .46rem 0; border-block-start: 1px solid var(--line); font-size: .65rem; }.queue-card b { color: var(--muted); font-weight: 500; font-variant-numeric: tabular-nums; }
.avatar { width: 1.4rem; height: 1.4rem; display: grid; place-items: center; border-radius: 50%; color: var(--ink-950); background: var(--cyan); font-size: .46rem; font-style: normal; font-weight: 800; }.avatar-two { background: #a6ffde; }.avatar-three { background: #b7b6ff; }
.pipeline { height: 6rem; display: flex; align-items: end; gap: .5rem; margin-block: .7rem .3rem; }.pipeline i { flex: 1; height: var(--value); border-radius: .35rem .35rem .1rem .1rem; background: linear-gradient(180deg, var(--cyan), #075de1); box-shadow: 0 0 1rem rgba(0, 174, 239, .14); }.pipeline-card small { display: block; overflow: hidden; white-space: nowrap; letter-spacing: .05em; }
.ops-glow { position: absolute; inset: 20% 20%; border-radius: 50%; background: var(--blue); filter: blur(70px); opacity: .16; }

.section-image { min-height: 53rem; overflow: hidden; display: flex; align-items: center; }
.journey-backdrop, .journey-overlay { position: absolute; inset: 0; }
.journey-backdrop { background: url("assets/images/secure-connection.webp") center/cover no-repeat; transform: scale(1.04); }
.journey-overlay { background: linear-gradient(90deg, rgba(2, 9, 20, .96) 0%, rgba(3, 15, 31, .84) 55%, rgba(3, 13, 27, .62)), linear-gradient(0deg, rgba(2,9,20,.92), transparent 35%); }
.journey-inner { position: relative; z-index: 2; }
.split-heading.light > p { color: #b0c6d8; }
.journey-steps { display: grid; padding: 0; margin: 4rem 0 0; border-block-start: 1px solid rgba(255,255,255,.2); list-style: none; }
.journey-steps li { display: grid; grid-template-columns: 3.2rem 1fr; gap: .6rem; padding-block: 1.45rem; border-block-end: 1px solid rgba(255,255,255,.16); }
.journey-steps li > span { color: var(--cyan); font-size: .68rem; font-weight: 760; letter-spacing: .1em; }
.journey-steps h3 { margin-block-end: .45rem; font-size: 1.35rem; }
.journey-steps p { max-width: 28rem; margin: 0; color: #aec2d2; font-size: .84rem; }

.industry-grid { display: grid; gap: 1rem; }
.industry-card { position: relative; min-height: 23rem; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; padding: 1.2rem; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-strong); box-shadow: 0 1rem 3rem rgba(0,0,0,.22); isolation: isolate; transform-style: preserve-3d; transition: transform .35s var(--ease), border-color .25s ease; }
.industry-card:hover, .industry-card:focus-within { border-color: var(--line-strong); }
.industry-card img { position: absolute; z-index: -3; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.industry-card:hover img { transform: scale(1.04); }
.industry-shade { position: absolute; z-index: -2; inset: 0; background: linear-gradient(180deg, rgba(1,8,17,.15), rgba(2,9,20,.95)); }
.industry-card .index { margin: 0; color: white; }
.industry-card h3 { margin-block-end: .55rem; font-size: 1.65rem; }
.industry-card p { max-width: 29rem; margin: 0; color: #b2c5d6; font-size: .82rem; }

.global-section { min-height: 43rem; display: flex; align-items: center; overflow: hidden; border-block: 1px solid var(--line); background: #03101f; }
.global-bg { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(2,9,20,.96) 0%, rgba(2,9,20,.68) 50%, rgba(2,9,20,.34)), url("assets/images/global-network.webp") center/cover no-repeat; opacity: .92; }
.global-grid { position: relative; z-index: 2; display: grid; gap: 3rem; align-items: center; }
.global-grid h2 { max-width: 13ch; }
.global-grid p:not(.eyebrow) { max-width: 39rem; color: #afc3d5; }
.light-link { color: var(--cyan-bright); }
.region-list { border-block-start: 1px solid rgba(255,255,255,.2); }
.region-list div { position: relative; display: grid; grid-template-columns: 2.6rem 1fr; align-items: center; min-height: 4.5rem; border-block-end: 1px solid rgba(255,255,255,.2); overflow: hidden; }
.region-list span { color: var(--cyan); font-size: .62rem; }.region-list strong { color: var(--white); font-size: 1.05rem; font-weight: 580; }.region-list i { position: absolute; inset: auto auto 0 0; width: 100%; height: 1px; background: var(--cyan); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--ease); }.region-list div:hover i { transform: scaleX(1); }

.faq-grid { display: grid; gap: 3rem; }
.faq-intro { position: relative; }
.faq-intro h2 { max-width: 13ch; }
.faq-intro > p:not(.eyebrow) { max-width: 30rem; color: var(--muted); }
.accordion { border-block-start: 1px solid var(--line); }
.accordion details { border-block-end: 1px solid var(--line); }
.accordion summary { position: relative; min-height: 4.8rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; color: var(--white); font-size: .92rem; font-weight: 680; cursor: pointer; list-style: none; }
.accordion summary::-webkit-details-marker { display: none; }
.accordion summary i { flex: 0 0 auto; width: 1.6rem; height: 1.6rem; position: relative; border: 1px solid var(--line); border-radius: 50%; }
.accordion summary i::before, .accordion summary i::after { content: ""; position: absolute; inset: 50% auto auto 50%; width: .65rem; height: 1px; background: var(--cyan); transform: translate(-50%,-50%); transition: transform .25s var(--ease); }
.accordion summary i::after { transform: translate(-50%,-50%) rotate(90deg); }
.accordion details[open] summary i::after { transform: translate(-50%,-50%) rotate(0); }
.accordion details[open] summary { color: var(--cyan-bright); }
.accordion details p { max-width: 42rem; padding-block-end: 1.5rem; color: var(--muted); font-size: .86rem; }

.contact { overflow: hidden; background: linear-gradient(145deg, #082a4a, #07182c 48%, #03101f); }
.contact-grid { position: relative; z-index: 2; display: grid; gap: 3rem; }
.contact-copy h2 { max-width: 13ch; }
.contact-copy > p:not(.eyebrow) { max-width: 36rem; color: #b1c5d7; }
.contact-direct { display: grid; gap: .5rem; margin-block-start: 2rem; }
.contact-direct a { display: flex; flex-direction: column; padding-block: .85rem; border-block-start: 1px solid var(--line); }
.contact-direct span { color: var(--muted); font-size: .65rem; text-transform: uppercase; letter-spacing: .1em; }
.contact-direct strong { color: var(--white); font-size: .86rem; overflow-wrap: anywhere; }
.contact-direct a:hover strong, .contact-direct a:focus-visible strong { color: var(--cyan); }
.location-card { position: relative; overflow: hidden; margin-block-start: 1.25rem; border: 1px solid rgba(126,225,255,.22); border-radius: 1.35rem; background: rgba(1,13,28,.72); box-shadow: 0 1.25rem 3rem rgba(0,0,0,.2); }
.location-card::after { position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 2rem rgba(39,210,255,.08); pointer-events: none; content: ""; }
.location-copy { display: grid; grid-template-columns: auto 1fr; gap: .75rem; align-items: start; padding: 1rem; }
.location-pin { display: grid; width: 2.35rem; aspect-ratio: 1; place-items: center; border: 1px solid rgba(86,229,255,.42); border-radius: .8rem; color: var(--cyan); background: rgba(27,158,255,.12); box-shadow: 0 0 1.3rem rgba(46,217,255,.14); }
.location-pin svg { width: 1.15rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.location-label { display: block; color: var(--muted); font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; }
.location-copy strong { display: block; margin-block-start: .28rem; color: var(--white); font-size: .8rem; line-height: 1.5; }
.location-link { grid-column: 2; width: fit-content; color: var(--cyan); font-size: .7rem; font-weight: 700; }
.location-link:hover, .location-link:focus-visible { color: #fff; text-shadow: 0 0 1rem rgba(72,231,255,.55); }
.location-map { display: block; width: 100%; height: 12rem; border: 0; filter: saturate(.78) contrast(1.06); }
.contact-form { padding: 1.25rem; border: 1px solid rgba(153, 229, 255, .2); border-radius: var(--radius-lg); background: rgba(2, 12, 24, .63); box-shadow: var(--shadow); backdrop-filter: blur(12px); }
.form-row { display: grid; gap: 1rem; }
.field { margin: 0 0 1.15rem; }
.field label, .field legend { display: block; margin-block-end: .45rem; color: #c6d7e5; font-size: .7rem; font-weight: 700; }
.field input, .field textarea { width: 100%; min-height: 3.1rem; padding: .8rem .9rem; border: 1px solid var(--line); border-radius: .65rem; color: var(--white); background: rgba(255,255,255,.045); outline: none; transition: border-color .2s ease, box-shadow .2s ease; }
.field textarea { min-height: 7.5rem; resize: vertical; }
.field input:hover, .field textarea:hover { border-color: rgba(150, 228, 255, .34); }
.field input:focus, .field textarea:focus { border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(93, 231, 255, .1); }
.field input[aria-invalid="true"], .field textarea[aria-invalid="true"] { border-color: var(--danger); }
.field-error { display: block; min-height: 1.1rem; margin-block-start: .25rem; color: var(--danger); font-size: .64rem; }
.service-field { padding: 0; border: 0; }
.chip-options { display: flex; flex-wrap: wrap; gap: .45rem; }
.chip-options label { margin: 0; cursor: pointer; }
.chip-options input { position: absolute; width: 1px; height: 1px; min-height: 0; margin: 0; opacity: 0; pointer-events: none; }
.chip-options span { min-height: 2.55rem; display: inline-flex; align-items: center; padding: .62rem .82rem; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); background: rgba(255,255,255,.035); font-size: .68rem; transition: color .2s ease, border-color .2s ease, background-color .2s ease; }
.chip-options input:focus-visible + span { outline: 3px solid var(--cyan-bright); outline-offset: 2px; }
.chip-options input:checked + span { color: var(--white); border-color: var(--cyan); background: rgba(41, 198, 243, .14); }
.consent { min-height: 2.75rem; display: grid; grid-template-columns: 1.3rem 1fr; gap: .65rem; align-items: start; margin-block: 1rem 1.4rem; color: var(--muted); font-size: .72rem; cursor: pointer; }
.consent input { width: 1.15rem; height: 1.15rem; margin-top: .18rem; accent-color: var(--cyan); }
.submit-button { width: 100%; }
.form-note { margin: .8rem 0 0; color: #8ba2b6; font-size: .7rem; }
.form-status { margin-block-start: .8rem; color: var(--cyan-bright); font-size: .72rem; }
.contact-orb { position: absolute; width: 22rem; height: 22rem; border-radius: 50%; filter: blur(90px); opacity: .16; }.contact-orb-one { inset: -10rem auto auto -8rem; background: var(--cyan); }.contact-orb-two { inset: auto -9rem -10rem auto; background: #206cff; }

.site-footer { padding-block: 3rem 1.5rem; border-block-start: 1px solid var(--line); background: #020812; }
.footer-top { display: grid; gap: 1.3rem; align-items: center; padding-block-end: 2.5rem; }
.footer-brand { width: 9rem; }
.footer-top p { max-width: 28rem; margin: 0; color: var(--muted); }
.footer-bottom { display: grid; gap: .55rem; padding-block-start: 1.5rem; border-block-start: 1px solid var(--line); color: #7891a6; font-size: .7rem; }
.footer-address { color: inherit; }
.footer-address:hover, .footer-address:focus-visible { color: var(--cyan); }

[data-reveal] { opacity: 0; transform: translateY(2rem); transition: opacity .72s var(--ease), transform .72s var(--ease); transition-delay: var(--reveal-delay, 0ms); }
[data-reveal].is-visible { opacity: 1; transform: translateY(0); }

@media (min-width: 36rem) {
  :root { --shell: min(90rem, calc(100% - 3rem)); }
  .hero-actions { display: flex; flex-wrap: wrap; }
  .hero-actions .button { min-width: 10rem; }
  .telemetry { display: block; }
  .solution-copy, .contact-form { padding: 2rem; }
  .ops-grid, .form-row { grid-template-columns: 1fr 1fr; }
  .metric-primary { grid-column: span 1; }
  .queue-card, .pipeline-card { grid-column: span 2; }
  .industry-grid { grid-template-columns: 1fr 1fr; }
}

@media (min-width: 50rem) {
  .nav-toggle { display: none; }
  .site-nav { position: static; display: flex; flex-direction: row; justify-content: center; gap: .25rem; padding: 0; overflow: visible; background: transparent; opacity: 1; visibility: visible; transform: none; }
  .site-nav a { padding: .7rem .65rem; color: #9eb3c5; font-size: .71rem; font-weight: 680; letter-spacing: 0; }
  .nav-actions { display: flex; align-items: center; gap: .8rem; }
  .language-toggle { min-width: 4.7rem; min-height: 2.5rem; display: flex; align-items: center; gap: .35rem; padding: .4rem; border: 0; color: #8199ad; background: transparent; font-size: .55rem; cursor: pointer; }
  .toggle-track { width: 1.9rem; height: 1rem; display: flex; align-items: center; padding: .12rem; border: 1px solid var(--line-strong); border-radius: 1rem; }
  .toggle-track span { width: .62rem; height: .62rem; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 .6rem rgba(93,231,255,.55); transform: translateX(0); transition: transform .25s var(--ease); }
  html[data-lang="es"] .toggle-track span { transform: translateX(.78rem); }
  .hero { min-height: 58rem; padding-block-start: 9rem; }
  .hero-inner { grid-template-columns: minmax(0, 1.02fr) minmax(25rem, .98fr); gap: 1rem; }
  .hero-visual { min-height: 36rem; }
  .signal-grid { grid-template-columns: repeat(4, 1fr); }
  .signal-grid > div { border-block-end: 0; }
  .signal-grid > div:nth-child(2n) { border-inline-end: 1px solid var(--line); }
  .signal-grid > div:last-child { border-inline-end: 0; }
  .intro-grid { grid-template-columns: 1.05fr .95fr; gap: 6rem; }
  .principles-grid { grid-template-columns: repeat(3, 1fr); }
  .principle { min-height: 18rem; padding: 2rem 1.5rem; border-block-end: 0; border-inline-end: 1px solid var(--line); }
  .principle:first-child { padding-inline-start: 0; }.principle:last-child { border-inline-end: 0; }
  .split-heading { grid-template-columns: 1.25fr .75fr; align-items: end; gap: 4rem; }
  .solution-tabs { justify-content: space-between; }
  .solution-panel { grid-template-columns: 1.08fr .92fr; min-height: 37rem; }
  .solution-media { min-height: 100%; aspect-ratio: auto; }
  .solution-copy { display: flex; flex-direction: column; justify-content: center; padding: 3rem; }
  .operations-grid { grid-template-columns: .9fr 1.1fr; gap: 5rem; }
  .journey-steps { grid-template-columns: repeat(4, 1fr); }
  .journey-steps li { min-height: 13.5rem; display: flex; flex-direction: column; justify-content: space-between; padding: 1.5rem; border-inline-end: 1px solid rgba(255,255,255,.16); }
  .journey-steps li:last-child { border-inline-end: 0; }
  .industry-grid { grid-template-columns: repeat(12, 1fr); }
  .industry-card { grid-column: span 6; }
  .industry-featured { grid-column: span 7; min-height: 29rem; }.industry-featured + .industry-card { grid-column: span 5; min-height: 29rem; }
  .global-grid { grid-template-columns: 1.15fr .85fr; gap: 7rem; }
  .faq-grid { grid-template-columns: .82fr 1.18fr; gap: 7rem; }
  .faq-intro { position: sticky; top: 8rem; align-self: start; }
  .contact-grid { grid-template-columns: .92fr 1.08fr; gap: 5rem; }
  .footer-top { grid-template-columns: auto 1fr auto; }
  .footer-bottom { grid-template-columns: auto 1fr; }
  .footer-bottom span:last-child { grid-column: 1 / -1; }
}

@media (min-width: 72rem) {
  .site-header { padding-block: .45rem; }
  .brand { width: 10rem; }
  .site-nav { gap: .7rem; }
  .site-nav a { padding-inline: .8rem; }
  .hero { min-height: 61rem; }
  .hero-inner { grid-template-columns: .95fr 1.05fr; }
  .hero-visual { min-height: 42rem; }
  .orbital-stage { width: 42rem; }
  .scroll-cue { display: flex; }
  .solution-copy { padding: 4.5rem; }
  .ops-stage { padding: 1rem; transform: rotateY(-5deg) rotateX(2deg); }
  .ops-stage:hover { transform: rotateY(-1deg) rotateX(0deg) translateY(-.3rem); }
  .industry-card { grid-column: span 4; }
  .industry-card:nth-child(4) { grid-column: span 5; }
  .industry-featured { grid-column: span 7; }.industry-featured + .industry-card { grid-column: span 5; }
  .footer-bottom { grid-template-columns: auto 1fr auto; }.footer-bottom span:last-child { grid-column: auto; text-align: end; }
}

@media (hover: none), (pointer: coarse) {
  .magnetic { transform: none !important; }
}

@media (prefers-contrast: more) {
  :root { --muted: #bdd0df; --line: rgba(210, 242, 255, .34); --line-strong: rgba(230, 250, 255, .75); }
  .button, .metric-card, .contact-form, .solution-panel { border-width: 2px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  [data-reveal] { opacity: 1; transform: none; }
  .network-canvas { display: none; }
  .orbital-stage, .ops-stage, .industry-card { transform: none !important; }
}

/* Signal Core visual system ------------------------------------------------ */
:root {
  --violet: #7b61ff;
  --magenta: #f15cff;
  --electric: #36f4ff;
  --panel-cut: polygon(0 1.15rem, 1.15rem 0, 100% 0, 100% calc(100% - 1.15rem), calc(100% - 1.15rem) 100%, 0 100%);
}

.button-primary {
  isolation: isolate;
  overflow: hidden;
  border: 1px solid transparent;
  color: var(--white);
  background:
    linear-gradient(115deg, rgba(9, 26, 47, .98), rgba(5, 12, 27, .98)) padding-box,
    linear-gradient(110deg, var(--electric), var(--blue-deep) 42%, var(--magenta) 78%, var(--electric)) border-box;
  box-shadow:
    0 0 0 1px rgba(91, 236, 255, .08),
    0 0 1.1rem rgba(38, 220, 255, .2),
    0 .9rem 2.8rem rgba(0, 63, 255, .25),
    inset 0 0 1.15rem rgba(50, 218, 255, .1);
  text-shadow: 0 0 .85rem rgba(180, 247, 255, .48);
}

.button-primary::before {
  z-index: -1;
  border-radius: inherit;
  background: linear-gradient(100deg, transparent 22%, rgba(255,255,255,.72), transparent 72%);
  clip-path: inset(0 round 999px);
}

.button-primary::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  border-radius: inherit;
  background: transparent;
  box-shadow: inset 0 0 1.1rem rgba(61, 229, 255, .12);
  opacity: .55;
  transform: scale(.98);
  pointer-events: none;
  transition: opacity .25s ease, transform .25s var(--ease);
}

.button-primary:hover,
.button-primary:focus-visible {
  border-color: transparent;
  box-shadow:
    0 0 0 1px rgba(128, 242, 255, .14),
    0 0 1.8rem rgba(38, 220, 255, .34),
    0 1.2rem 3.2rem rgba(0, 63, 255, .32),
    inset 0 0 1.4rem rgba(73, 226, 255, .16);
}

.button-primary:hover::after,
.button-primary:focus-visible::after { opacity: 1; transform: scale(1); }

.button-ghost {
  border-color: rgba(118, 232, 255, .34);
  background: linear-gradient(135deg, rgba(7, 26, 48, .82), rgba(4, 10, 25, .88));
  box-shadow: inset 0 0 1.4rem rgba(39, 204, 255, .06), 0 0 1.2rem rgba(16, 158, 255, .05);
}

.button-product { align-self: flex-start; margin-block-start: .5rem; }

.hero::before,
.hero::after {
  display: none;
  position: absolute;
  z-index: 2;
  color: rgba(135, 222, 255, .34);
  font-size: .53rem;
  font-weight: 750;
  letter-spacing: .19em;
  writing-mode: vertical-rl;
  pointer-events: none;
}

.hero::before { content: "MTU // SIGNAL CORE // 2017"; inset-block-start: 9rem; inset-inline-start: max(.35rem, calc((100vw - 92rem) / 2)); }
.hero::after { content: "VOICE · MESSAGE · DATA · NETWORK"; inset-block-end: 6rem; inset-inline-end: max(.35rem, calc((100vw - 92rem) / 2)); }

.hero-copy::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -2rem auto auto -2rem;
  width: 7rem;
  height: 7rem;
  border-block-start: 1px solid rgba(82, 233, 255, .58);
  border-inline-start: 1px solid rgba(82, 233, 255, .58);
  clip-path: var(--panel-cut);
  opacity: .6;
}

.hero-copy h1 {
  font-family: "Sora", ui-sans-serif, system-ui, sans-serif;
  font-weight: 820;
  letter-spacing: -.065em;
}

.hero-copy h1 span {
  background: linear-gradient(92deg, #f5feff 0%, var(--electric) 48%, #7895ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 0 1.2rem rgba(55, 226, 255, .18));
}

.orbital-stage::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 11%;
  border-radius: 50%;
  background: conic-gradient(from 40deg, transparent, rgba(56, 220, 255, .17), transparent 38%, rgba(111, 74, 255, .18), transparent 75%);
  filter: blur(1rem);
  opacity: .9;
  transform: translateZ(-4rem) rotate(12deg);
}

.core-sphere {
  border: 1px solid rgba(170, 246, 255, .78);
  box-shadow:
    0 0 0 .7rem rgba(45, 215, 255, .035),
    0 0 0 1.7rem rgba(49, 158, 255, .025),
    0 0 4.5rem rgba(43, 211, 255, .34),
    0 1.5rem 5rem rgba(0, 0, 0, .45),
    inset -.8rem -1rem 2.5rem rgba(18, 46, 140, .55),
    inset .8rem 1rem 2rem rgba(187, 249, 255, .3);
}

.orbit-node {
  clip-path: var(--panel-cut);
  transition: transform .25s var(--ease), border-color .25s ease, box-shadow .25s ease, background-color .25s ease;
}

.orbit-node:hover,
.orbit-node:focus-visible {
  border-color: rgba(113, 239, 255, .74);
  background: rgba(8, 36, 64, .9);
  box-shadow: 0 0 1.5rem rgba(48, 220, 255, .18), inset 0 0 1.4rem rgba(48, 220, 255, .08);
  transform: translateZ(1.2rem) translateY(-.2rem);
}

.signal-strip { background: linear-gradient(180deg, rgba(4, 19, 36, .96), rgba(2, 10, 22, .96)); }
.signal-grid { gap: 1px; background: var(--line); }
.signal-grid > a {
  position: relative;
  min-height: 9.2rem;
  display: grid;
  grid-template-columns: 1fr auto;
  align-content: center;
  gap: .45rem 1rem;
  padding: 1.35rem;
  overflow: hidden;
  background: linear-gradient(140deg, rgba(6, 29, 52, .98), rgba(3, 13, 28, .98));
  transition: transform .25s var(--ease), background-color .25s ease;
}

.signal-grid > a::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 35%, rgba(62, 231, 255, .16), transparent 65%);
  opacity: 0;
  transform: translateX(-55%);
  transition: opacity .25s ease, transform .5s var(--ease);
}

.signal-grid > a:hover::before,
.signal-grid > a:focus-visible::before { opacity: 1; transform: translateX(55%); }
.signal-grid > a:hover,
.signal-grid > a:focus-visible { z-index: 1; background: linear-gradient(140deg, rgba(8, 44, 73, .98), rgba(4, 18, 38, .98)); transform: translateY(-.22rem); }
.signal-grid .signal-index { grid-column: 1 / -1; max-width: none; margin: 0; color: #7196b2; font-size: .55rem; letter-spacing: .15em; }
.signal-grid > a strong { color: var(--white); font-size: clamp(1.5rem, 7vw, 2.35rem); font-weight: 800; letter-spacing: -.055em; }
.signal-grid > a > span:not(.signal-index) { max-width: 20ch; margin: 0; color: var(--muted); font-size: .68rem; line-height: 1.4; }
.signal-grid > a i { grid-column: 2; grid-row: 2 / span 2; align-self: center; color: var(--electric); font-size: 1.3rem; font-style: normal; text-shadow: 0 0 1rem rgba(54, 244, 255, .6); }

.solution-panel {
  clip-path: var(--panel-cut);
  border-radius: 0;
  background:
    linear-gradient(145deg, rgba(9, 35, 60, .78), rgba(4, 15, 30, .95)) padding-box,
    linear-gradient(120deg, rgba(75, 235, 255, .48), rgba(62, 91, 225, .08), rgba(231, 77, 255, .34)) border-box;
  border: 1px solid transparent;
}

@media (max-width: 49.99rem) {
  .nav-shell { justify-content: flex-start; }
  .brand { margin-inline-end: auto; }
  .nav-toggle { order: 3; }
  .nav-actions { order: 2; display: flex; align-items: center; }
  .nav-actions > .button { display: none; }
  .language-toggle { min-width: 3.8rem; min-height: 2.75rem; display: flex; align-items: center; gap: .22rem; padding: .3rem; border: 0; color: #8199ad; background: transparent; font-size: .49rem; cursor: pointer; }
  .toggle-track { width: 1.65rem; height: .92rem; display: flex; align-items: center; padding: .1rem; border: 1px solid var(--line-strong); border-radius: 1rem; }
  .toggle-track span { width: .56rem; height: .56rem; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 .6rem rgba(93,231,255,.55); transform: translateX(0); transition: transform .25s var(--ease); }
  html[data-lang="es"] .toggle-track span { transform: translateX(.63rem); }
}

@media (min-width: 50rem) {
  .hero::before, .hero::after { display: block; }
  .signal-grid > a { min-height: 10.5rem; padding: 1.55rem; }
}

@media (prefers-reduced-motion: reduce) {
  .button-primary::after,
  .signal-grid > a::before { transform: none !important; }
}

/* V5 — editorial telecom hero + perimeter neon --------------------------- */

.button.button-primary {
  --neon-a: var(--electric, #36f4ff);
  --neon-b: var(--magenta, #f15cff);
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(102, 239, 255, .38);
  color: #f8fdff;
  background: transparent;
  box-shadow:
    0 0 .65rem rgba(54, 244, 255, .2),
    0 0 1.6rem rgba(45, 143, 255, .13),
    0 1rem 2.8rem rgba(0, 5, 24, .4);
  text-shadow: 0 0 .9rem rgba(151, 243, 255, .62);
}

.button.button-primary::before {
  content: "";
  position: absolute;
  z-index: -2;
  inset: -220% -35%;
  border-radius: 0;
  background: conic-gradient(
    from 0deg,
    transparent 0 54%,
    rgba(80, 220, 255, .12) 60%,
    var(--neon-a) 68%,
    #f7ffff 71%,
    var(--neon-b) 75%,
    transparent 83% 100%
  );
  clip-path: none;
  opacity: 1;
  transform: rotate(0deg);
  transform-origin: center;
  animation: neon-perimeter 3.25s linear infinite;
  transition: opacity .24s ease;
}

.button.button-primary::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 1px;
  border-radius: inherit;
  background:
    radial-gradient(circle at 22% 0%, rgba(68, 224, 255, .16), transparent 38%),
    linear-gradient(115deg, rgba(8, 30, 52, .98), rgba(3, 10, 25, .99));
  box-shadow: inset 0 0 1.15rem rgba(55, 227, 255, .11);
  opacity: 1;
  transform: none;
  transition: background-color .24s ease, box-shadow .24s ease;
}

.button.button-primary:hover::before,
.button.button-primary:focus-visible::before {
  opacity: 1;
  transform: rotate(0deg);
}

.button.button-primary:hover,
.button.button-primary:focus-visible {
  border-color: rgba(185, 252, 255, .72);
  box-shadow:
    0 0 .85rem rgba(54, 244, 255, .48),
    0 0 2.15rem rgba(28, 157, 255, .3),
    0 0 3.6rem rgba(241, 92, 255, .13),
    0 1.2rem 3rem rgba(0, 5, 24, .48);
}

.button.button-primary:hover::after,
.button.button-primary:focus-visible::after {
  opacity: 1;
  transform: none;
  box-shadow: inset 0 0 1.8rem rgba(55, 227, 255, .2);
}

@keyframes neon-perimeter {
  to { transform: rotate(360deg); }
}

.hero {
  min-height: 52rem;
  padding-block: 8.5rem 4.5rem;
  background:
    radial-gradient(circle at 76% 43%, rgba(28, 115, 255, .14), transparent 26rem),
    radial-gradient(circle at 54% 72%, rgba(33, 234, 255, .07), transparent 28rem),
    linear-gradient(180deg, #031224 0%, #020914 86%);
}

.hero-grid {
  background-image:
    linear-gradient(rgba(95, 215, 255, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(95, 215, 255, .04) 1px, transparent 1px);
  background-size: 4.5rem 4.5rem;
  mask-image: linear-gradient(to bottom, transparent 4%, black 28%, transparent 96%);
}

.hero::before,
.hero::after { display: none !important; }

.hero-inner { gap: clamp(3.5rem, 8vw, 6rem); }
.hero-copy { max-width: 45rem; }
.hero-copy::before { display: none; }

.hero-copy .eyebrow {
  margin-block-end: 1.45rem;
  color: #87eaff;
  font-size: .66rem;
  font-weight: 650;
  letter-spacing: .13em;
}

.hero-copy h1 {
  max-width: 10.5ch;
  font-family: "Sora", ui-sans-serif, system-ui, sans-serif;
  font-size: clamp(3.1rem, 6.4vw, 5.35rem);
  font-weight: 650;
  letter-spacing: -.075em;
  line-height: .96;
}

.hero-copy h1 span {
  background: linear-gradient(90deg, #f6feff 0%, #74efff 46%, #7a94ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 0 1.35rem rgba(54, 220, 255, .18));
}

.hero-lede {
  max-width: 38rem;
  margin-block-start: 1.55rem;
  color: #aec2d2;
  font-size: clamp(1rem, 2vw, 1.17rem);
  line-height: 1.68;
}

.hero-actions { margin-block-start: 2rem; }
.hero-actions .button-primary { min-width: min(100%, 16rem); }

.hero-proof {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: 34rem;
  gap: 0;
  margin-block-start: 2.25rem;
  padding-block-start: 1.15rem;
  border-block-start: 1px solid rgba(127, 224, 255, .16);
}

.hero-proof span {
  display: grid;
  gap: .1rem;
  padding: 0 .9rem;
  border: 0;
  border-inline-start: 1px solid rgba(127, 224, 255, .13);
  border-radius: 0;
  background: none;
  letter-spacing: 0;
}

.hero-proof span:first-child { padding-inline-start: 0; border-inline-start: 0; }
.hero-proof strong { color: var(--white); font-size: 1rem; font-weight: 650; letter-spacing: -.03em; }
.hero-proof small { color: #7892a8; font-size: .56rem; font-weight: 550; letter-spacing: .08em; line-height: 1.35; text-transform: uppercase; }

.hero-visual { min-height: 31rem; display: grid; place-items: center; }

.network-console {
  position: relative;
  width: min(100%, 39rem);
  overflow: hidden;
  border: 1px solid rgba(127, 229, 255, .25);
  border-radius: 1.6rem;
  background:
    linear-gradient(145deg, rgba(10, 37, 64, .88), rgba(2, 12, 27, .96)) padding-box,
    linear-gradient(120deg, rgba(108, 239, 255, .42), transparent 38%, rgba(128, 90, 255, .3)) border-box;
  box-shadow:
    0 2.5rem 7rem rgba(0, 3, 15, .52),
    0 0 3.6rem rgba(19, 141, 255, .1),
    inset 0 1px rgba(255, 255, 255, .08);
  transform-style: preserve-3d;
  transition: transform .35s var(--ease), border-color .25s ease, box-shadow .25s ease;
}

.network-console::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(118deg, rgba(255,255,255,.08), transparent 28%, transparent 74%, rgba(77, 125, 255, .08));
  pointer-events: none;
}

.console-head,
.console-foot {
  position: relative;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 3.15rem;
  padding-inline: 1rem;
  color: #82a2b9;
  background: rgba(2, 13, 28, .74);
  font-size: .55rem;
  font-weight: 650;
  letter-spacing: .13em;
}

.console-head { border-block-end: 1px solid rgba(127, 229, 255, .13); }
.console-status { display: inline-flex; align-items: center; gap: .5rem; color: #b8ffc9; }
.console-status i { width: .45rem; height: .45rem; border-radius: 50%; background: #56f6aa; box-shadow: 0 0 .7rem rgba(86, 246, 170, .8); }

.console-field {
  position: relative;
  min-height: 27rem;
  overflow: hidden;
  perspective: 65rem;
}

.field-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(83, 205, 255, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(83, 205, 255, .055) 1px, transparent 1px);
  background-size: 2.25rem 2.25rem;
  mask-image: radial-gradient(circle at 50% 50%, black, transparent 78%);
  transform: rotateX(66deg) scale(1.45) translateY(9%);
  transform-origin: center 75%;
}

.field-orbit {
  position: absolute;
  inset: 50% auto auto 50%;
  border: 1px solid rgba(105, 225, 255, .18);
  border-radius: 50%;
  transform-style: preserve-3d;
}

.field-orbit::after {
  content: "";
  position: absolute;
  inset-block-start: -.23rem;
  inset-inline-start: 48%;
  width: .46rem;
  height: .46rem;
  border-radius: 50%;
  background: #8df5ff;
  box-shadow: 0 0 .9rem #55eaff, 0 0 1.8rem rgba(68, 123, 255, .6);
}

.field-orbit-a { width: 18rem; aspect-ratio: 1; transform: translate(-50%, -50%) rotateX(70deg) rotateZ(13deg); }
.field-orbit-b { width: 14rem; aspect-ratio: 1; transform: translate(-50%, -50%) rotateY(68deg) rotateZ(20deg); }
.field-orbit-c { width: 10rem; aspect-ratio: 1; border-style: dashed; opacity: .65; transform: translate(-50%, -50%) rotateX(21deg) rotateY(62deg); }

.console-core {
  position: absolute;
  z-index: 4;
  inset: 50% auto auto 50%;
  width: 8.8rem;
  aspect-ratio: 1;
  display: grid;
  place-content: center;
  justify-items: center;
  border: 1px solid rgba(190, 249, 255, .75);
  border-radius: 50%;
  background:
    radial-gradient(circle at 34% 24%, rgba(255,255,255,.62), transparent 7%),
    radial-gradient(circle at 38% 33%, #70efff, #0874f2 48%, #071432 78%);
  box-shadow:
    0 0 0 .65rem rgba(56, 218, 255, .04),
    0 0 3.8rem rgba(43, 211, 255, .42),
    inset -.8rem -1rem 2rem rgba(7, 22, 90, .65),
    inset .7rem .8rem 1.4rem rgba(215, 251, 255, .25);
  transform: translate(-50%, -50%) translateZ(3rem);
}

.core-scan { position: absolute; inset: 10%; border: 1px solid rgba(255,255,255,.19); border-radius: inherit; }
.console-core .signal-bars { height: 2rem; gap: .14rem; }
.console-core .signal-bars i { width: .25rem; }
.console-core strong { margin-block-start: .35rem; color: white; font-size: .94rem; font-weight: 750; letter-spacing: .08em; line-height: 1; }
.console-core small { margin-block-start: .22rem; color: rgba(255,255,255,.68); font-size: .42rem; font-weight: 650; letter-spacing: .13em; }

.route-line {
  position: absolute;
  z-index: 1;
  width: 29%;
  height: 1px;
  background: linear-gradient(90deg, rgba(77, 228, 255, .08), rgba(103, 235, 255, .68), rgba(77, 228, 255, .08));
  box-shadow: 0 0 .7rem rgba(66, 221, 255, .24);
  transform-origin: center;
}

.route-line-a { inset: 26% auto auto 25%; transform: rotate(25deg); }
.route-line-b { inset: 28% 23% auto auto; transform: rotate(-28deg); }
.route-line-c { inset: auto auto 27% 23%; transform: rotate(-27deg); }
.route-line-d { inset: auto 22% 28% auto; transform: rotate(30deg); }

.console-node {
  position: absolute;
  z-index: 6;
  width: 8.7rem;
  min-height: 5.3rem;
  display: grid;
  align-content: center;
  padding: .75rem .8rem;
  border: 1px solid rgba(124, 226, 255, .23);
  border-radius: .85rem;
  background: linear-gradient(145deg, rgba(12, 47, 79, .9), rgba(3, 16, 32, .94));
  box-shadow: 0 1rem 2.6rem rgba(0,0,0,.31), inset 0 1px rgba(255,255,255,.07);
  backdrop-filter: blur(.6rem);
  transform: translateZ(2rem);
  transition: transform .25s var(--ease), border-color .25s ease, box-shadow .25s ease;
}

.console-node:hover,
.console-node:focus-visible {
  border-color: rgba(153, 246, 255, .72);
  box-shadow: 0 0 1.6rem rgba(47, 221, 255, .22), 0 1.3rem 2.8rem rgba(0,0,0,.38);
  transform: translateZ(2rem) translateY(-.22rem);
}

.console-node .node-code { color: #6f99b6; font-size: .45rem; font-weight: 650; letter-spacing: .12em; }
.console-node strong { margin-block-start: .18rem; color: white; font-size: .87rem; font-weight: 700; letter-spacing: -.02em; }
.console-node small { color: #91aabe; font-size: .5rem; line-height: 1.35; }
.console-node > i { position: absolute; inset-block-start: .7rem; inset-inline-end: .7rem; color: #74efff; font-size: .76rem; font-style: normal; }
.console-node-pbx { inset: 7% auto auto 4%; }
.console-node-sms { inset: 9% 4% auto auto; }
.console-node-sip { inset: auto auto 7% 5%; }
.console-node-crm { inset: auto 4% 8% auto; }

.console-packet {
  position: absolute;
  z-index: 7;
  inset: auto auto 1.2rem 50%;
  min-width: 7.5rem;
  padding: .5rem .7rem;
  border-inline-start: 1px solid #62eaff;
  color: #708fa6;
  background: rgba(2, 12, 26, .72);
  font-size: .42rem;
  letter-spacing: .1em;
  transform: translateX(-50%) translateZ(4rem);
}
.console-packet strong { display: block; color: #c9faff; font-size: .5rem; }

.console-foot { justify-content: flex-start; gap: 1.5rem; border-block-start: 1px solid rgba(127, 229, 255, .13); }
.console-foot > span { display: flex; align-items: baseline; gap: .45rem; }
.console-foot small { color: #59788f; font-size: .44rem; letter-spacing: .13em; }
.console-foot strong { color: #c8f9ff; font-size: .65rem; font-weight: 650; }

@media (max-width: 35rem) {
  .hero { padding-block-start: 7.6rem; }
  .hero-copy h1 { font-size: clamp(2.85rem, 14vw, 4rem); }
  .hero-proof span { padding-inline: .55rem; }
  .hero-proof small { font-size: .48rem; }
  .network-console { border-radius: 1.2rem; }
  .console-field { min-height: 23.5rem; }
  .console-core { width: 6.7rem; }
  .console-node { width: 7.2rem; min-height: 4.7rem; padding: .62rem; }
  .console-node strong { font-size: .76rem; }
  .console-node small { max-width: 13ch; font-size: .44rem; }
  .console-node-pbx, .console-node-sip { inset-inline-start: .65rem; }
  .console-node-sms, .console-node-crm { inset-inline-end: .65rem; }
  .field-orbit-a { width: 15rem; }
  .field-orbit-b { width: 11rem; }
  .field-orbit-c { width: 8rem; }
  .console-packet { display: none; }
}

@media (min-width: 50rem) {
  .hero { min-height: 57rem; padding-block: 9rem 4.5rem; }
  .hero-inner { grid-template-columns: minmax(0, .9fr) minmax(29rem, 1.1fr); gap: 2rem; }
  .hero-visual { min-height: 35rem; }
}

@media (min-width: 72rem) {
  .hero { min-height: 60rem; }
  .hero-inner { grid-template-columns: minmax(31rem, .92fr) minmax(35rem, 1.08fr); gap: 3rem; }
  .network-console { width: 42rem; }
  .console-field { min-height: 30rem; }
}

@media (prefers-reduced-motion: reduce) {
  .button.button-primary::before { animation: none; transform: rotate(32deg) !important; }
  .network-console { transform: none !important; }
}

/* V6 — human signal hero, visual editorial layer and site chrome ---------- */
.hero {
  min-height: 50rem;
  background:
    radial-gradient(circle at 74% 30%, rgba(30, 164, 255, .17), transparent 25rem),
    radial-gradient(circle at 18% 86%, rgba(69, 69, 255, .12), transparent 30rem),
    linear-gradient(180deg, #020b17 0%, #031326 82%, #020a14 100%);
}

.hero-photo-stage { min-height: 33rem; display: grid; place-items: center; isolation: isolate; }
.hero-photo-frame {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border: 1px solid rgba(133, 232, 255, .24);
  border-radius: 2rem;
  background: #07182a;
  box-shadow: 0 2.7rem 7rem rgba(0, 4, 18, .58), 0 0 4rem rgba(0, 160, 255, .12), inset 0 1px rgba(255,255,255,.08);
  transform: rotateY(-3deg) rotateX(1deg);
  transform-origin: center;
  transition: transform .45s var(--ease), border-color .3s ease, box-shadow .3s ease;
}
.hero-photo-stage:hover .hero-photo-frame { border-color: rgba(143, 239, 255, .47); box-shadow: 0 3rem 7rem rgba(0,4,18,.62), 0 0 5rem rgba(0,178,255,.18); transform: rotateY(-1deg) translateY(-.25rem); }
.hero-photo-frame img { width: 100%; height: 100%; object-fit: cover; object-position: 57% center; filter: saturate(.88) contrast(1.04); transform: scale(1.015); transition: transform 1s var(--ease), filter .45s ease; }
.hero-photo-stage:hover img { filter: saturate(1) contrast(1.05); transform: scale(1.035); }
.hero-photo-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(2,10,22,.34), transparent 42%), linear-gradient(0deg, rgba(2,10,22,.83), transparent 48%), linear-gradient(135deg, rgba(10,80,150,.12), transparent 58%); }
.hero-photo-grid { position: absolute; inset: 0; opacity: .22; background-image: linear-gradient(rgba(128,226,255,.11) 1px, transparent 1px), linear-gradient(90deg, rgba(128,226,255,.11) 1px, transparent 1px); background-size: 3rem 3rem; mask-image: linear-gradient(145deg, transparent 20%, #000 72%); }
.hero-frame-label { position: absolute; inset: 1.15rem auto auto 1.2rem; color: rgba(220,249,255,.72); font-size: .5rem; font-weight: 700; letter-spacing: .15em; }

.live-card {
  position: absolute;
  z-index: 3;
  min-width: 13.5rem;
  display: grid;
  grid-template-columns: 2.55rem 1fr auto;
  align-items: center;
  gap: .72rem;
  padding: .75rem .85rem;
  border: 1px solid rgba(136, 233, 255, .28);
  border-radius: 1rem;
  background: linear-gradient(145deg, rgba(8,34,58,.88), rgba(2,13,28,.94));
  box-shadow: 0 1rem 3rem rgba(0,4,18,.46), inset 0 1px rgba(255,255,255,.08);
  backdrop-filter: blur(14px);
  transform: translateZ(2rem);
  transition: transform .28s var(--ease), border-color .28s ease, box-shadow .28s ease;
}
.live-card:hover { border-color: rgba(151,244,255,.62); box-shadow: 0 0 1.8rem rgba(49,222,255,.16), 0 1.2rem 3rem rgba(0,4,18,.52); transform: translateZ(2rem) translateY(-.3rem); }
.live-card small { display: block; color: #70a0bd; font-size: .47rem; font-weight: 700; letter-spacing: .12em; }
.live-card strong { display: block; margin-block-start: .15rem; color: #f5fcff; font-size: .65rem; font-weight: 600; }
.live-card > i { width: .48rem; height: .48rem; border-radius: 50%; background: #58f7aa; box-shadow: 0 0 .9rem rgba(88,247,170,.75); }
.live-icon { width: 2.45rem; aspect-ratio: 1; display: grid; place-items: center; border-radius: .72rem; color: #8df5ff; background: linear-gradient(145deg, rgba(32,195,255,.25), rgba(48,83,255,.12)); box-shadow: inset 0 0 1.1rem rgba(57,226,255,.13); }
.live-icon svg { width: 1.22rem; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
.live-card-call { inset: auto auto 1.7rem -1.8rem; }
.live-card-message { inset: 2.2rem -1.5rem auto auto; }
.live-card-crm { inset: auto -1rem 5.6rem auto; }

.visual-story { overflow: hidden; background: linear-gradient(180deg, #020a14, #05172a 55%, #03101f); }
.story-grid { display: grid; gap: 1rem; }
.story-card { position: relative; min-height: 24rem; overflow: hidden; border: 1px solid rgba(126,221,255,.17); border-radius: 1.45rem; background: #071526; box-shadow: 0 1.6rem 4rem rgba(0,0,0,.26); isolation: isolate; transition: transform .32s var(--ease), border-color .28s ease, box-shadow .28s ease; }
.story-card:hover, .story-card:focus-visible { border-color: rgba(127,239,255,.55); box-shadow: 0 2rem 5rem rgba(0,0,0,.35), 0 0 2.5rem rgba(39,211,255,.1); transform: translateY(-.38rem); }
.story-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .75s var(--ease), filter .4s ease; }
.story-card:hover img, .story-card:focus-visible img { transform: scale(1.045); filter: saturate(1.08); }
.story-shade { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(2,9,20,.94), transparent 64%), linear-gradient(120deg, rgba(5,52,91,.18), transparent); }
.story-copy { position: absolute; inset: auto 1.25rem 1.2rem; display: grid; grid-template-columns: 1fr auto; gap: .35rem 1rem; align-items: end; }
.story-copy small { grid-column: 1 / -1; color: #79eaff; font-size: .56rem; font-weight: 700; letter-spacing: .14em; }
.story-copy strong { max-width: 20ch; color: #fff; font-size: clamp(1.35rem, 3vw, 2rem); line-height: 1.1; letter-spacing: -.04em; }
.story-copy i { color: #7eeeff; font-size: 1.4rem; font-style: normal; transition: transform .3s var(--ease); }
.story-card:hover .story-copy i { transform: translate(.2rem,-.2rem); }

.article-grid { display: grid; gap: 1rem; }
.article-card { min-width: 0; }
.article-card > a { height: 100%; display: flex; flex-direction: column; padding: .7rem .7rem 1.35rem; overflow: hidden; border: 1px solid rgba(126,221,255,.15); border-radius: 1.3rem; background: linear-gradient(145deg, rgba(10,37,61,.8), rgba(3,14,28,.94)); transition: transform .3s var(--ease), border-color .25s ease, box-shadow .3s ease; }
.article-card > a:hover, .article-card > a:focus-visible { border-color: rgba(129,239,255,.5); box-shadow: 0 1.6rem 4rem rgba(0,0,0,.3), 0 0 2rem rgba(42,213,255,.1); transform: translateY(-.38rem); }
.article-media { aspect-ratio: 16/10; overflow: hidden; border-radius: .9rem; background: #07172a; }
.article-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .65s var(--ease), filter .35s ease; }
.article-card > a:hover img { transform: scale(1.055); filter: saturate(1.08); }
.article-meta { margin: 1.15rem .55rem .7rem; color: #65e9ff; font-size: .55rem; font-weight: 700; letter-spacing: .13em; }
.article-card h3 { margin-inline: .55rem; font-size: clamp(1.2rem, 3vw, 1.58rem); line-height: 1.22; }
.article-link { margin: auto .55rem 0; padding-block-start: 1.25rem; color: #8fa8bc; font-size: .68rem; font-weight: 650; }

.modern-footer { position: relative; overflow: hidden; padding-block-start: 5rem; background: radial-gradient(circle at 50% 115%, rgba(11,93,255,.22), transparent 42%), #020812; isolation: isolate; }
.footer-aurora { position: absolute; z-index: -1; width: 70rem; height: 20rem; inset: auto auto -13rem 50%; border-radius: 50%; background: linear-gradient(90deg, #0c73ff, #31e9ff 48%, #745cff); filter: blur(68px); opacity: .22; transform: translateX(-50%) scaleX(.88); animation: footer-breathe 7s var(--ease) infinite alternate; }
.footer-main { display: grid; gap: 2.5rem; padding-block-end: 3.5rem; }
.footer-intro { display: grid; justify-items: start; gap: 1rem; }
.footer-intro p { max-width: 25rem; margin: 0; color: var(--muted); }
.footer-column { display: grid; align-content: start; gap: .72rem; }
.footer-column strong { margin-block-end: .35rem; color: #eaf8ff; font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; }
.footer-column a, .footer-column button { width: fit-content; padding: 0; border: 0; color: #7f99ae; background: none; font: inherit; font-size: .74rem; cursor: pointer; transition: color .2s ease, transform .2s var(--ease); }
.footer-column a:hover, .footer-column a:focus-visible, .footer-column button:hover, .footer-column button:focus-visible { color: #72edff; transform: translateX(.18rem); }
.footer-legal-inline { display: flex; flex-wrap: wrap; gap: .65rem 1.2rem; padding-block: 1rem; border-block-start: 1px solid var(--line); }
.footer-legal-inline a, .footer-legal-inline button { padding: 0; border: 0; color: #7891a6; background: none; font: inherit; font-size: .68rem; cursor: pointer; }
.footer-legal-inline a:hover, .footer-legal-inline button:hover { color: #72edff; }
@keyframes footer-breathe { to { opacity: .36; transform: translateX(-50%) scaleX(1.08) translateY(-1rem); } }

.whatsapp-fab { position: fixed; z-index: 80; inset: auto 1rem 1rem auto; width: 3.75rem; aspect-ratio: 1; display: grid; place-items: center; border: 1px solid rgba(169,255,214,.68); border-radius: 50%; color: #05160e; background: linear-gradient(145deg,#8cffc6,#25d366 72%); box-shadow: 0 0 0 .45rem rgba(37,211,102,.08), 0 0 1.7rem rgba(37,211,102,.36), 0 1.2rem 2.8rem rgba(0,0,0,.38); transition: transform .28s var(--ease), box-shadow .28s ease; }
.whatsapp-fab::before { content: ""; position: absolute; inset: -.55rem; border: 1px solid rgba(83,239,153,.26); border-radius: inherit; animation: wa-orbit 2.7s ease-out infinite; }
.whatsapp-fab:hover, .whatsapp-fab:focus-visible { transform: translateY(-.3rem) scale(1.05); box-shadow: 0 0 0 .5rem rgba(37,211,102,.11),0 0 2.3rem rgba(37,211,102,.55),0 1.4rem 3rem rgba(0,0,0,.42); }
.whatsapp-fab svg { width: 1.75rem; fill: currentColor; }
@keyframes wa-orbit { 0% { opacity: .8; transform: scale(.78); } 80%,100% { opacity: 0; transform: scale(1.35); } }

.cookie-banner { position: fixed; z-index: 90; inset: auto 1rem 5.8rem; max-width: 31rem; padding: 1rem; border: 1px solid rgba(128,230,255,.28); border-radius: 1.15rem; background: linear-gradient(145deg,rgba(7,30,51,.96),rgba(2,11,23,.98)); box-shadow: 0 1.8rem 5rem rgba(0,0,0,.55), inset 0 1px rgba(255,255,255,.06); backdrop-filter: blur(18px); }
.cookie-banner[hidden] { display: none; }
.cookie-banner strong { color: #fff; font-size: .9rem; }
.cookie-banner p { margin: .45rem 0 .85rem; color: #9cb4c7; font-size: .7rem; line-height: 1.55; }
.cookie-banner a { color: #78edff; text-decoration: underline; text-underline-offset: .15rem; }
.cookie-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.cookie-actions button { min-height: 2.65rem; padding: .62rem .8rem; border: 1px solid rgba(129,229,255,.25); border-radius: 999px; color: #dff8ff; background: rgba(255,255,255,.045); font: inherit; font-size: .66rem; font-weight: 650; cursor: pointer; }
.cookie-actions button[data-cookie-accept] { color: #03111d; border-color: #70ecff; background: #70ecff; }

@media (min-width: 42rem) {
  .story-grid { grid-template-columns: 1.12fr .88fr; }
  .story-card-wide { grid-row: span 2; min-height: 49rem; }
  .article-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .footer-main { grid-template-columns: minmax(17rem, 1.5fr) repeat(3,minmax(8rem,.6fr)); }
  .cookie-banner { inset-inline: auto 1.5rem; inset-block-end: 6.2rem; }
  .whatsapp-fab { inset-inline-end: 1.5rem; inset-block-end: 1.4rem; }
}

@media (max-width: 49.99rem) {
  .hero { min-height: 56rem; padding-block-end: 4rem; }
  .hero-inner { display: block; }
  .hero-copy { max-width: 26rem; }
  .hero-photo-stage { position: absolute; z-index: 0; inset: 5.6rem -9rem 0 22%; min-height: auto; margin: 0; opacity: .34; pointer-events: none; }
  .hero-photo-frame { inset: 0; border: 0; border-radius: 0; box-shadow: none; transform: none; }
  .hero-photo-frame img { object-position: 62% center; }
  .hero-photo-shade { background: linear-gradient(90deg,#020b17 0%,rgba(2,11,23,.76) 35%,rgba(2,11,23,.15) 76%),linear-gradient(0deg,#020b17 0%,transparent 34%,rgba(2,11,23,.35) 100%); }
  .hero-frame-label, .live-card { display: none; }
}

@media (min-width: 50rem) {
  .hero { min-height: 54rem; padding-block: 8.4rem 4rem; }
  .hero-inner { grid-template-columns: minmax(26rem,.92fr) minmax(31rem,1.08fr); gap: 3rem; }
  .hero-visual { min-height: 39rem; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-photo-frame, .hero-photo-stage:hover .hero-photo-frame, .live-card, .story-card, .article-card > a, .whatsapp-fab { transform: none !important; }
  .footer-aurora, .whatsapp-fab::before { animation: none !important; }
}

/* V7 — display preferences, light system and conversion utilities -------- */
.theme-toggle {
  width: 2.75rem;
  min-width: 2.75rem;
  height: 2.75rem;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--cyan-bright);
  background: rgba(255,255,255,.045);
  box-shadow: inset 0 1px rgba(255,255,255,.06);
  cursor: pointer;
  transition: transform .22s var(--ease), border-color .22s ease, color .22s ease, background-color .22s ease, box-shadow .22s ease;
}
.theme-toggle:hover, .theme-toggle:focus-visible { transform: translateY(-2px) rotate(5deg); border-color: var(--line-strong); box-shadow: 0 0 1.2rem rgba(93,231,255,.16); }
.theme-icon { position: absolute; width: 1.15rem; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; transition: opacity .2s ease, transform .3s var(--ease); }
.theme-icon-sun { opacity: 0; transform: scale(.45) rotate(-70deg); }
.theme-icon-moon { opacity: 1; transform: scale(1) rotate(0); }
html[data-theme="light"] .theme-icon-sun { opacity: 1; transform: scale(1) rotate(0); }
html[data-theme="light"] .theme-icon-moon { opacity: 0; transform: scale(.45) rotate(65deg); }

.whatsapp-tooltip {
  position: absolute;
  inset-inline-end: calc(100% + .85rem);
  min-width: max-content;
  padding: .62rem .8rem;
  border: 1px solid rgba(105,255,184,.3);
  border-radius: .75rem;
  color: #dfffee;
  background: rgba(3,30,19,.92);
  box-shadow: 0 .8rem 2.2rem rgba(0,0,0,.32);
  font-size: .67rem;
  font-weight: 700;
  line-height: 1;
  opacity: 0;
  pointer-events: none;
  transform: translateX(.45rem);
  transition: opacity .2s ease, transform .25s var(--ease);
}
.form-trap { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; }
.consent a { color: var(--cyan); text-decoration: underline; text-underline-offset: .16rem; }
.consent-optional { margin-block-start: -.35rem; opacity: .9; }
.whatsapp-fab:hover .whatsapp-tooltip, .whatsapp-fab:focus-visible .whatsapp-tooltip { opacity: 1; transform: translateX(0); }

html[data-theme="light"] {
  --ink-950: #eef7ff;
  --ink-900: #f8fbff;
  --ink-850: #e7f2fb;
  --ink-800: #dbeaf6;
  --surface: rgba(255,255,255,.78);
  --surface-strong: #ffffff;
  --surface-soft: rgba(5,60,105,.055);
  --line: rgba(8,64,107,.14);
  --line-strong: rgba(0,141,201,.34);
  --white: #061b2c;
  --text: #17374d;
  --muted: #577489;
  --cyan: #007fad;
  --cyan-bright: #006e99;
  --blue: #008ccc;
  --blue-deep: #075bd8;
  --green: #087b55;
  --shadow: 0 30px 80px rgba(24,74,108,.16);
  color-scheme: light;
  background: #eef7ff;
}
html[data-theme="light"] body {
  background: radial-gradient(circle at 84% 8%, rgba(0,156,220,.12), transparent 28rem), #f7fbff;
  color: var(--text);
}
html[data-theme="light"] ::selection { color: #fff; background: #007fad; }
html[data-theme="light"] .site-header { background: rgba(247,251,255,.82); box-shadow: 0 1px rgba(8,64,107,.09), 0 .75rem 2rem rgba(24,74,108,.05); }
html[data-theme="light"] .site-header .brand, html[data-theme="light"] .footer-brand { padding: .28rem .5rem; border-radius: .72rem; background: #061827; box-shadow: 0 .45rem 1.2rem rgba(22,66,95,.13); }
html[data-theme="light"] .site-nav { background: rgba(247,251,255,.985); }
html[data-theme="light"] .site-nav a { color: #37586e; }
html[data-theme="light"] .site-nav a:hover, html[data-theme="light"] .site-nav a:focus-visible { color: #007fad; }
html[data-theme="light"] .theme-toggle { color: #007fad; background: rgba(255,255,255,.8); }
html[data-theme="light"] .language-toggle { color: #46677c; }

html[data-theme="light"] .hero {
  background: radial-gradient(circle at 74% 30%, rgba(0,157,224,.16), transparent 26rem), radial-gradient(circle at 15% 86%, rgba(54,90,255,.08), transparent 30rem), linear-gradient(180deg,#f9fcff 0%,#edf7ff 82%,#f6fbff 100%);
}
html[data-theme="light"] .hero::before { opacity: .35; }
html[data-theme="light"] .hero-copy h1 span { color: #0876a2; text-shadow: none; }
html[data-theme="light"] .hero-lede, html[data-theme="light"] .section-heading > p, html[data-theme="light"] .intro-copy > p { color: #496a80; }
html[data-theme="light"] .button { color: #082236; background: rgba(255,255,255,.72); border-color: rgba(8,94,142,.2); }
html[data-theme="light"] .button-primary { color: #00131d; background: linear-gradient(135deg,#78ecff,#15a9e5); box-shadow: 0 12px 34px rgba(0,130,192,.2); }
html[data-theme="light"] .button-ghost { color: #11354b; background: rgba(255,255,255,.62); }
html[data-theme="light"] .hero-photo-frame { border-color: rgba(0,131,190,.24); box-shadow: 0 2.7rem 7rem rgba(31,87,124,.2), 0 0 4rem rgba(0,160,255,.1), inset 0 1px rgba(255,255,255,.8); }
html[data-theme="light"] .live-card { border-color: rgba(0,132,190,.23); background: linear-gradient(145deg,rgba(255,255,255,.92),rgba(230,245,255,.94)); box-shadow: 0 1rem 3rem rgba(40,85,113,.18), inset 0 1px #fff; }
html[data-theme="light"] .live-card small { color: #55768b; }
html[data-theme="light"] .live-card strong { color: #09273a; }
html[data-theme="light"] .live-icon { color: #007da9; background: linear-gradient(145deg,rgba(26,183,232,.2),rgba(66,91,255,.09)); }

html[data-theme="light"] .signal-strip, html[data-theme="light"] .section-dark, html[data-theme="light"] .visual-story, html[data-theme="light"] .blog-preview, html[data-theme="light"] .contact, html[data-theme="light"] .blog-index, html[data-theme="light"] .article-body { background: #eef7ff; }
html[data-theme="light"] .section-blue, html[data-theme="light"] .platform, html[data-theme="light"] .global { background: linear-gradient(180deg,#e7f3fc,#f8fbff); }
html[data-theme="light"] .solution-panel, html[data-theme="light"] .ops-console, html[data-theme="light"] .contact-form, html[data-theme="light"] .metric-card, html[data-theme="light"] .industry-card, html[data-theme="light"] .article-card > a, html[data-theme="light"] .blog-featured, html[data-theme="light"] .accordion details {
  color: #17374d;
  border-color: rgba(8,94,142,.15);
  background: linear-gradient(145deg,rgba(255,255,255,.94),rgba(233,246,255,.94));
  box-shadow: 0 1.2rem 3.2rem rgba(43,88,117,.1);
}
html[data-theme="light"] .story-card { border-color: rgba(0,123,178,.18); background: #dcecf8; box-shadow: 0 1.6rem 4rem rgba(43,88,117,.13); }
html[data-theme="light"] .article-meta, html[data-theme="light"] .text-link, html[data-theme="light"] .eyebrow { color: #007ca9; }
html[data-theme="light"] .article-link { color: #527287; }
html[data-theme="light"] input, html[data-theme="light"] textarea { color: #102f43; background: rgba(255,255,255,.9); border-color: rgba(8,94,142,.2); }
html[data-theme="light"] .chip-options span { color: #244b63; background: rgba(255,255,255,.7); border-color: rgba(8,94,142,.18); }
html[data-theme="light"] .chip-options input:checked + span { color: #052536; background: #a9effb; border-color: #1aa7d2; }
html[data-theme="light"] .content-hero { background: linear-gradient(180deg,#e3f1fb,#f7fbff); }
html[data-theme="light"] .content-hero::after { background: linear-gradient(90deg,rgba(238,247,255,.96),rgba(238,247,255,.55),rgba(238,247,255,.18)); }
html[data-theme="light"] .legal-review { color: #7a4c00; border-color: rgba(173,102,0,.22); background: rgba(255,185,55,.14); }

html[data-theme="light"] .cookie-banner { border-color: rgba(0,126,180,.24); background: linear-gradient(145deg,rgba(255,255,255,.98),rgba(232,246,255,.98)); box-shadow: 0 1.8rem 5rem rgba(42,85,111,.2); }
html[data-theme="light"] .cookie-banner strong { color: #09273a; }
html[data-theme="light"] .cookie-banner p { color: #4b6d82; }
html[data-theme="light"] .cookie-actions button { color: #17374d; border-color: rgba(0,126,180,.22); background: rgba(255,255,255,.7); }
html[data-theme="light"] .cookie-actions button[data-cookie-accept] { color: #00151e; background: #57d8ed; border-color: #31bfd9; }
html[data-theme="light"] .modern-footer { background: radial-gradient(circle at 50% 115%,rgba(24,120,255,.18),transparent 42%),#e8f4fc; }
html[data-theme="light"] .footer-column strong { color: #0a2c43; }
html[data-theme="light"] .footer-column a, html[data-theme="light"] .footer-column button, html[data-theme="light"] .footer-legal-inline a, html[data-theme="light"] .footer-legal-inline button { color: #55758a; }
html[data-theme="light"] .location-card { border-color: rgba(18,122,188,.2); background: rgba(255,255,255,.82); box-shadow: 0 1.1rem 2.8rem rgba(50,93,121,.13); }
html[data-theme="light"] .location-copy strong { color: #0a2c43; }

@media (max-width: 49.99rem) {
  .nav-actions { gap: .12rem; }
  .theme-toggle { width: 2.55rem; min-width: 2.55rem; height: 2.55rem; }
  .whatsapp-tooltip { display: none; }
  html[data-theme="light"] .hero-photo-shade { background: linear-gradient(90deg,#f7fbff 0%,rgba(247,251,255,.78) 35%,rgba(247,251,255,.18) 76%),linear-gradient(0deg,#f7fbff 0%,transparent 34%,rgba(247,251,255,.35) 100%); }
}

@media (prefers-reduced-motion: reduce) {
  .theme-toggle, .theme-icon, .whatsapp-tooltip { transition: none !important; transform: none !important; }
}