/* Servicio Integral / Soluciones financieras. Versión 1.0.0.
   Recursos locales. Tipografías del sistema. Sin dependencias externas. */
:root {
  --bg: #0b1020;
  --surface: #141d32;
  --ink: #f6f8ff;
  --muted: #b0bdd2;
  --teal: #5ce9d2;
  --purple: #b4a2ff;
  --line: #b9caff26;
  --header: 82px;
  --ease: cubic-bezier(.18,.8,.25,1);
  color-scheme: dark;
  color: var(--ink);
  background: var(--bg);
  font-family: "Segoe UI", Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scrollbar-color: #62709b #0b1020; }
body { margin: 0; min-width: 280px; isolation: isolate; }
button, a { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
button { font: inherit; color: inherit; cursor: pointer; }
a { color: inherit; text-decoration: none; }
img, svg { max-width: 100%; vertical-align: middle; }
img { height: auto; }
h1, h2, h3, p, figure { margin: 0; }
button:focus-visible, a:focus-visible { outline: 3px solid var(--teal); outline-offset: 5px; }
::selection { color: #081d22; background: #7bffe1; }
em { font-style: normal; color: var(--teal); }
.icon { width: 24px; height: 24px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.svg-library { position: absolute; width: 0; height: 0; overflow: hidden; }
.skip { position: fixed; left: 14px; top: -100px; z-index: 500; background: var(--teal); color: #0b2427; padding: 14px; border-radius: 8px; }
.skip:focus { top: 14px; }
/* Un único fondo, sin bordes de fotografías ni rectángulos visibles. */
.atmosphere { position: fixed; inset: 0; overflow: hidden; pointer-events: none; z-index: -1; background: radial-gradient(ellipse at 8% 20%, #3b235039, transparent 60%), radial-gradient(ellipse at 85% 50%, #0746504a, transparent 65%), #0b1020; }
.atmosphere>img { position: absolute; width: 130vw; max-width: none; height: 120vh; object-fit: cover; left: -15%; top: -10%; opacity: .22; }
.light { position: absolute; width: 55vw; height: 55vw; border-radius: 50%; filter: blur(100px); opacity: .17; }
.light--mint { right: -30%; top: 10%; background: #267581; }
.light--blue { left: -25%; bottom: -25%; background: #6746c6; }
.site-header { position: fixed; inset: 0 0 auto; height: var(--header); z-index: 80; display: flex; align-items: center; gap: 25px; padding: 0 max(32px,calc((100vw - 1320px)/2)); border-bottom: 1px solid #94bde716; background: #0b1020dc; backdrop-filter: blur(20px); }
.brand { display: inline-flex; align-items: center; gap: 11px; flex-shrink: 0; }
.brand img { display: block; width: 39px; height: 46px; object-fit: contain; filter: drop-shadow(0 0 7px #5bdbf12a); }
.brand-wordmark { display: flex; flex-direction: column; line-height: 1; gap: 5px; }
.brand-wordmark b { font-size: 20px; letter-spacing: .025em; font-weight: 720; color: #f7f9ff; }
.brand-wordmark strong { font-size: 12px; letter-spacing: .35em; color: var(--teal); font-weight: 650; }
.main-nav { display: flex; align-items: center; gap: 27px; margin: auto; font-size: 12px; font-weight: 550; color: #b8c3d5; }
.main-nav a { padding: 10px 0; position: relative; }
.main-nav a::after { content: ""; position: absolute; height: 2px; left: 0; right: 100%; bottom: 2px; background: var(--teal); transition: right .3s; }
.main-nav a[aria-current], .main-nav a:hover { color: #fff; }
.main-nav a[aria-current]::after, .main-nav a:hover::after { right: 0; }
.header-label { display: flex; align-items: center; gap: 7px; font-size: 9px; letter-spacing: .13em; color: #a7bac9; white-space: nowrap; }
.header-label>span { width: 5px; height: 5px; border-radius: 50%; background: var(--teal); }
.header-cta { display: inline-flex; align-items: center; gap: 10px; border: 1px solid #51bbbf75; padding: 11px 16px; border-radius: 30px; font-size: 12px; font-weight: 700; white-space: nowrap; background: #1a31448c; }
.header-cta .icon { width: 16px; height: 16px; color: var(--teal); }
.header-cta:hover { background: #204855; }
.step-nav { position: fixed; right: 14px; top: 50%; transform: translateY(-50%); display: flex; gap: 17px; flex-direction: column; z-index: 70; }
.step-nav a { display: flex; align-items: center; gap: 8px; padding: 5px; font-size: 9px; color: #a9bbd0; }
.step-nav a>span { opacity: 0; transition: opacity .3s; }
.step-nav i { width: 6px; height: 6px; border: 1px solid #71819c; border-radius: 100%; transition: .3s; }
.step-nav a[aria-current] i { background: var(--teal); border-color: var(--teal); box-shadow: 0 0 0 5px #5ce9d217, 0 0 12px #5ce9d250; }
.step-nav a[aria-current]>span, .step-nav a:hover>span { opacity: 1; }
.section-shell { width: min(1240px,calc(100% - 128px)); margin-inline: auto; }
.scene { position: relative; min-height: 100svh; padding: 124px 0 100px; overflow: clip; }
.scene-footer { position: absolute; bottom: 29px; left: 0; right: 0; display: flex; justify-content: space-between; align-items: center; font-size: 9px; letter-spacing: .13em; color: #99abc1; }
.scene-footer b { font-weight: 700; color: var(--teal); margin-right: 8px; }
.scene-footer a { display: inline-flex; align-items: center; gap: 16px; margin-right: 225px; }
.scene-footer .icon { width: 16px; height: 16px; color: var(--teal); }
.eyebrow { display: flex; align-items: center; gap: 9px; font-size: 10px; font-weight: 680; letter-spacing: .12em; line-height: 1.8; color: #a0c3d2; }
.eyebrow>span { width: 6px; height: 6px; flex-shrink: 0; border-radius: 2px; background: var(--teal); }
h2 { font-size: clamp(34px,3.55vw,51px); font-weight: 740; line-height: 1.13; letter-spacing: -.045em; }
h3 { letter-spacing: -.025em; }
.lead { font-size: 18px; line-height: 1.7; color: var(--muted); max-width: 530px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 22px; min-height: 56px; border-radius: 11px; padding: 17px 25px; font-weight: 750; font-size: 14px; border: 0; transition: transform .25s, box-shadow .25s, background .25s; }
.button--primary { background: linear-gradient(120deg,#71f0d4,#49d6ed); color: #092a34; box-shadow: 0 10px 28px #22dab321; }
.button--primary:hover { transform: translateY(-3px); box-shadow: 0 14px 32px #22dac33b; background: linear-gradient(120deg,#91ffe0,#73e3ff); }
.button .icon { width: 19px; height: 19px; }
.text-link { display: inline-flex; align-items: center; gap: 11px; font-size: 12px; font-weight: 650; }
.text-link .icon { width: 17px; height: 17px; color: var(--teal); }
.text-link:hover { color: var(--teal); }
/* 01 — texto protagonista + mapa y los tres rectángulos solicitados. */
.hero { display: flex; align-items: center; padding-top: 124px; padding-bottom: 94px; }
.hero-grid { display: grid; grid-template-columns: 1.07fr 1fr; align-items: center; gap: 35px; }
.hero-copy { position: relative; z-index: 2; }
.hero-copy h1 { font-size: clamp(49px,5.15vw,78px); font-weight: 810; line-height: 1.05; letter-spacing: -.048em; margin: 0 0 25px; }
.hero-highlight { color: #bfb0ff; }
.hero-copy h1 em { color: #68efd5; }
.hero-copy .lead { max-width: 100%; font-size: clamp(17px,1.5vw,21px); line-height: 1.65; color: #c9d4e8; }
.hero-copy .lead strong { color: #fff; font-weight: 650; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 23px; align-items: center; margin-top: 30px; }
.hero-pillars { display: flex; flex-wrap: wrap; gap: 22px; margin-top: 30px; font-size: 11px; font-weight: 600; color: #b9c8de; }
.hero-pillars>span { display: flex; align-items: center; gap: 8px; }
.hero-pillars>span::before { content: ""; width: 4px; height: 4px; background: var(--teal); border-radius: 100%; }
.ecosystem { position: relative; width: 100%; aspect-ratio: 1/.99; min-height: 485px; isolation: isolate; }
.map-area { position: absolute; inset: 0; z-index: -1; }
.map-area::before { content: ""; position: absolute; inset: 7%; border-radius: 50%; background: radial-gradient(ellipse,#22b5c124,transparent 69%); filter: blur(12px); }
.map-area img { width: 109%; max-width: none; transform: translate(-1%,-3%); opacity: .85; }
.region-tag { position: absolute; top: 0; right: 3%; font-size: 9px; letter-spacing: .16em; color: #94b5c2; display: flex; gap: 10px; align-items: center; }
.region-tag i { width: 23px; height: 1px; background: #69c9c976; }
.ecosystem-stage { position: absolute; inset: 0; transform: translate3d(var(--px,0px),var(--py,0px),0); transition: transform .2s ease-out; }
.connections { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: #53babb; stroke-width: 1; stroke-dasharray: 3 5; opacity: .7; }
.connections .moving-line { stroke: #b4fff2; stroke-width: 2; stroke-dasharray: 10 310; animation: connector-flow 12s linear infinite; }
.core { position: absolute; left: 49%; top: 47%; transform: translate(-50%,-50%); width: 172px; height: 174px; border-radius: 29px; background: linear-gradient(140deg,#1e3449,#131b31); border: 1px solid #78b3c04d; box-shadow: 0 20px 50px #0004, inset 0 1px 0 #b4defe18; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.core::before { content: ""; position: absolute; inset: -12px; border: 1px solid #6cedd51a; border-radius: 38px; }
.core img { height: 58px; width: auto; margin-bottom: 16px; filter: drop-shadow(0 0 10px #5bdfd926); }
.core>span { font-size: 8px; letter-spacing: .14em; color: #a5bed4; }
.core>strong { font-size: 12px; margin-top: 8px; font-weight: 650; }
.module { position: absolute; background: linear-gradient(130deg,#f1fffc,#d6f4f5); color: #122a3e; box-shadow: 0 14px 36px #0003; border: 1px solid #cff8ed; border-radius: 15px; padding: 20px 18px; display: flex; align-items: center; justify-content: center; min-height: 88px; text-align: center; animation: module-float 7s ease-in-out infinite; }
.module>strong { font-size: 22px; font-weight: 730; line-height: 1.22; letter-spacing: -.035em; }
.module--users { left: 0; top: 9%; width: 237px; animation-delay: -1s; }
.module--money { left: 0; bottom: 6%; width: 269px; animation-delay: -3s; }
.module--money>strong { font-size: 21px; }
.module--movements { right: 0; bottom: 27%; width: 211px; animation-delay: -5s; }
.ecosystem figcaption { position: absolute; bottom: -3%; left: 0; right: 0; font-size: 9px; color: #96a9bf; line-height: 1.5; text-align: center; }
/* 02 — movimientos separados vs solución conectada */
.connection { background: linear-gradient(180deg,transparent,#281c4138 44%,transparent); }
.section-heading { max-width: 970px; margin-bottom: 32px; }
.section-heading h2 { margin-top: 15px; }
.section-intro { max-width: 690px; font-size: 16px; line-height: 1.75; color: var(--muted); margin-top: 18px; }
.comparison { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; position: relative; }
.comparison-side { border-radius: 23px; padding: 25px 31px 28px; position: relative; min-width: 0; }
.comparison-side--before { background: linear-gradient(135deg,#302131ce,#1c1c32c9); border: 1px solid #b4858d42; }
.comparison-side--after { background: linear-gradient(140deg,#163b44d9,#142a3ceb); border: 1px solid #55d7bb4d; box-shadow: 0 18px 60px #08171a38; }
.comparison-label { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 10px; letter-spacing: .08em; color: #e0e7f5; }
.comparison-label>span:last-child { margin-left: auto; font-weight: 600; font-size: 8px; color: #a9bacb; letter-spacing: .05em; white-space: nowrap; }
.dot { width: 6px; height: 6px; background: var(--teal); border-radius: 50%; flex-shrink: 0; }
.dot--warm { background: #ffad95; }
.compare-arrow { position: absolute; z-index: 4; left: 50%; top: 48%; transform: translate(-50%,-50%); background: #142f3b; color: var(--teal); border: 1px solid #51d5ca69; box-shadow: 0 7px 22px #0004; border-radius: 100%; width: 47px; height: 47px; display: grid; place-items: center; }
.dispersed-visual,.connected-visual { position: relative; height: 150px; margin-top: 17px; }
.dispersed-visual>svg,.connected-visual>svg { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke-width: 1.25; }
.dispersed-visual>svg { stroke-dasharray: 4 9; stroke: #b4929b75; }
.loose { position: absolute; display: flex; align-items: center; gap: 9px; padding: 11px 14px; background: #372a3f; border: 1px solid #c28c9940; border-radius: 10px; font-size: 11px; color: #eadbe4; box-shadow: 0 8px 20px #0002; z-index: 2; white-space: nowrap; }
.loose .icon { width: 17px; height: 17px; color: #f5b6a4; }
.loose--one { left: 3%; top: 13%; transform: rotate(-5deg); }
.loose--two { right: 2%; top: 7%; transform: rotate(4deg); }
.loose--three { left: 7%; bottom: 10%; transform: rotate(4deg); }
.loose--four { right: 2%; bottom: 10%; transform: rotate(-3deg); }
.connected { position: absolute; font-size: 11px; font-weight: 600; padding: 9px 16px; background: #24505a; border: 1px solid #68c5b46b; border-radius: 30px; color: #e3fff6; }
.connected--one { left: 1%; top: 11%; }
.connected--two { right: 1%; top: 11%; }
.connected--three { left: 4%; bottom: 9%; }
.connected--four { right: 3%; bottom: 9%; }
.connected-center { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 57px; height: 57px; border-radius: 18px; background: #76ead6; color: #143942; display: grid; place-items: center; box-shadow: 0 0 24px #55e0c520; }
.connected-visual>svg { stroke: #8be1cfaa; }
.connected-visual>svg circle { stroke-dasharray: 2 7; animation: orbit 40s linear infinite; transform-origin: 250px 85px; }
.comparison h3 { font-size: 25px; font-weight: 720; line-height: 1.18; margin-top: 15px; }
.comparison-list { margin: 19px 0 0; padding: 0; list-style: none; }
.comparison-list li { display: flex; gap: 10px; font-size: 14px; line-height: 1.65; margin: 10px 0; color: #bbc6d9; }
.comparison-list li::before { content: "—"; flex-shrink: 0; color: #c89aaa; }
.comparison-side--after li::before { content: "✓"; color: var(--teal); }
.connection-takeaway { margin: 27px auto 0; text-align: center; font-size: 17px; line-height: 1.65; color: #bdc7df; }
.connection-takeaway strong { color: #77efdb; font-weight: 720; }
/* 03 — seis servicios financieros */
.services { background: radial-gradient(ellipse at 50% 40%,#17274055,transparent 70%); }
.services-heading { display: flex; gap: 45px; justify-content: space-between; align-items: end; margin-bottom: 30px; }
.services-heading h2 { margin-top: 14px; font-size: clamp(33px,3.3vw,48px); }
.services-heading>p { max-width: 290px; font-size: 15px; line-height: 1.8; color: var(--muted); padding-bottom: 4px; }
.service-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 17px; }
.service-card { background: linear-gradient(130deg,#1a273f,#131d30); border: 1px solid #7f9ac933; border-radius: 17px; padding: 24px 26px 27px; box-shadow: 0 10px 25px #060d1829; transition: transform .3s,border-color .3s,box-shadow .3s; min-width: 0; }
.service-card:nth-child(2), .service-card:nth-child(6) { background: linear-gradient(130deg,#232741,#172137); }
.service-card.card--pain { background: linear-gradient(130deg,#35263e,#1d2338); border-color: #a07fcd57; }
.service-card:hover { transform: translateY(-4px); border-color: #6cebd384; box-shadow: 0 14px 30px #02071444; }
.service-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 19px; }
.service-icon { color: #75efdc; width: 45px; height: 45px; display: grid; place-items: center; border-radius: 12px; background: #50d6c914; border: 1px solid #88ead51f; }
.service-icon .icon { width: 24px; height: 24px; }
.card--pain .service-icon { color: #d3b7ff; background: #b293e919; border-color: #b49bdb26; }
.service-number { font-size: 11px; letter-spacing: .13em; color: #8a9dbd; }
.service-family { display: block; font-size: 9px; font-weight: 650; color: #9babcb; letter-spacing: .12em; line-height: 1.7; }
.service-card h3 { font-size: 23px; font-weight: 720; margin: 8px 0 11px; line-height: 1.19; color: #f6f9ff; }
.service-card>p { font-size: 14px; line-height: 1.75; color: #b8c5db; }
.modular-note { display: flex; align-items: center; gap: 16px; margin-top: 21px; padding: 20px 23px; border-radius: 12px; background: #1c354855; border: 1px solid #55c9c637; }
.note-icon { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid #69c9d44d; border-radius: 9px; color: var(--teal); flex-shrink: 0; }
.note-icon .icon { width: 23px; height: 23px; }
.modular-note strong { font-size: 15px; font-weight: 650; }
.modular-note p { font-size: 13px; line-height: 1.65; color: #a8bdd2; margin-top: 5px; }
.modular-note a { margin-left: auto; white-space: nowrap; color: #79e9d8; }
.scope-note { font-size: 11px; color: #97a8c2; margin-top: 15px; line-height: 1.7; }
/* 04 — propuesta financiera y contacto */
.final { padding-bottom: 0; background: radial-gradient(ellipse at 80% 65%,#083d4655,transparent 60%); }
.final-layout { display: grid; grid-template-columns: .83fr 1.1fr; gap: 65px; align-items: center; }
.final-map { position: relative; align-self: stretch; min-height: 397px; }
.final-map>img { width: 105%; max-width: none; position: absolute; top: -10px; left: -8%; opacity: .78; }
.map-caption { position: absolute; left: 0; bottom: 17%; font-size: 9px; line-height: 2; letter-spacing: .13em; color: #8ed6d6; }
.map-caption>b { font-size: 13px; font-weight: 550; letter-spacing: -.015em; color: #dae5f6; }
.final-map-tag { position: absolute; bottom: 3%; left: 0; display: flex; align-items: center; gap: 9px; font-size: 9px; letter-spacing: .1em; color: #aabbd5; }
.final-map-tag .icon { width: 23px; height: 23px; color: var(--teal); }
.final-copy h2 { font-size: clamp(40px,4.2vw,61px); margin: 21px 0; line-height: 1.07; letter-spacing: -.045em; font-weight: 770; }
.final-copy .lead { max-width: 540px; font-size: 17px; line-height: 1.75; }
.final-copy .eyebrow { font-size: 10px; }
.conditions { margin-top: 20px; font-size: 12px; line-height: 1.8; color: #97abc3; max-width: 500px; }
.final-pillars { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: 35px; padding: 25px 0; border-block: 1px solid #9db0dc24; }
.final-pillars article { display: flex; gap: 16px; align-items: center; padding: 0 24px; border-right: 1px solid #9db0dc24; }
.final-pillars article:first-child { padding-left: 0; }
.final-pillars article:last-child { border: 0; padding-right: 0; }
.final-pillars .icon { width: 30px; height: 30px; color: var(--teal); }
.final-pillars h3 { font-size: 16px; font-weight: 680; margin-bottom: 7px; }
.final-pillars p { font-size: 12px; color: #a5b8d2; line-height: 1.6; }
.final-contact { text-align: center; padding: 28px 0 30px; }
.final-contact>p { font-size: 28px; font-weight: 710; letter-spacing: -.03em; }
.contact-slot { width: min(100%,660px); min-height: 88px; margin: 21px auto 13px; }
.final-contact>small { font-size: 11px; color: #a0b2cd; line-height: 1.7; }
.site-footer { display: flex; align-items: center; gap: 28px; padding: 24px 0 28px; border-top: 1px solid #9abfd321; font-size: 10px; color: #9eb3ce; }
.brand--footer img { width: 29px; height: 35px; }
.brand--footer .brand-wordmark b { font-size: 15px; }
.brand--footer .brand-wordmark strong { font-size: 9px; }
.brand--footer .brand-wordmark { gap: 3px; }
.site-footer>span { margin-right: auto; }
.site-footer>button { background: none; border: 0; padding: 10px 0; font-size: inherit; color: inherit; text-decoration: underline; text-underline-offset: 4px; }
.back-top { padding: 10px 0; }
.site-footer a:hover,.site-footer button:hover { color: #fff; }
/* Un único componente: flota durante el recorrido y se integra en el cierre. */
.contact-widget { z-index: 110; transform-origin: 0 0; }
.contact-widget.is-floating { position: fixed; right: max(22px,env(safe-area-inset-right)); bottom: max(22px,env(safe-area-inset-bottom)); width: 238px; }
.contact-toggle { border: 1px solid #85d9e16b; border-radius: 100px; min-height: 65px; width: 100%; display: flex; align-items: center; gap: 11px; padding: 9px 17px 9px 10px; background: linear-gradient(120deg,#19535d,#293459); box-shadow: 0 10px 36px #0007,0 0 30px #55c2e01c; color: #fff; text-align: left; position: relative; }
.contact-toggle::after { content: ""; position: absolute; inset: -4px; border: 1px solid #81f3e64f; border-radius: inherit; pointer-events: none; animation: contact-light 8s ease infinite; }
.contact-toggle strong { font-size: 14px; font-weight: 720; display: block; }
.contact-toggle small { font-size: 9px; color: #c2e0ef; display: block; margin-top: 3px; }
.contact-glyph { width: 44px; height: 44px; flex-shrink: 0; background: #76efd723; border: 1px solid #9aeed280; border-radius: 100%; display: grid; place-items: center; color: #a8ffe9; }
.contact-glyph .icon { width: 21px; height: 21px; }
.toggle-sign { margin-left: auto; font-weight: 300; font-size: 24px; transition: transform .3s; }
.contact-widget.is-open .toggle-sign { transform: rotate(45deg); }
.channel-list[hidden] { display: none!important; }
.is-floating .channel-list { position: absolute; right: 0; bottom: calc(100% + 15px); display: flex; flex-direction: column; width: 310px; gap: 8px; background: #111c2ef7; border: 1px solid #98cbf54a; padding: 9px; border-radius: 16px; box-shadow: 0 15px 42px #0006; }
.channel { display: flex; align-items: center; gap: 12px; text-align: left; padding: 13px 12px; border: 1px solid #75bcc737; border-radius: 11px; background: #192d3f; min-height: 70px; color: #ecfaff; transition: background .2s,transform .2s; }
.channel:hover { background: #224153; transform: translateY(-2px); }
.channel strong { font-size: 13px; font-weight: 700; display: block; }
.channel small { display: block; font-size: 10px; line-height: 1.5; margin-top: 3px; color: #afc7d9; }
.channel-symbol { width: 38px; height: 38px; border-radius: 10px; background: #38e49b1c; color: #78e7a6; display: grid; place-items: center; flex-shrink: 0; }
.channel-symbol .icon { width: 24px; height: 24px; }
.channel>.icon { margin-left: auto; width: 16px; height: 16px; color: #b3dfde; }
.is-docked { width: 100%; position: relative; }
.is-docked .contact-toggle { display: none; }
.is-docked .channel-list { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.is-docked .channel { min-height: 82px; padding: 16px; border-color: #69c8b56b; background: linear-gradient(120deg,#164b41,#193343); box-shadow: 0 10px 24px #08181522; }
.toast { position: fixed; z-index: 250; bottom: 100px; right: 24px; width: min(365px,calc(100% - 32px)); padding: 16px 19px; font-size: 12px; line-height: 1.65; background: #173447; color: white; border: 1px solid #7cafc887; border-radius: 12px; box-shadow: 0 15px 34px #0005; opacity: 0; transform: translateY(8px); pointer-events: none; transition: .2s; }
.toast.is-visible { opacity: 1; transform: none; }
dialog { width: min(600px,calc(100% - 28px)); max-height: 85svh; border: 1px solid #7fb6ca66; border-radius: 19px; padding: 0; color: var(--ink); background: #142136; box-shadow: 0 40px 120px #0008; }
dialog::backdrop { background: #060915b5; backdrop-filter: blur(4px); }
.dialog-content { padding: 34px; }
.dialog-close { position: absolute; right: 15px; top: 15px; background: none; border: 0; padding: 7px; }
.dialog-close .icon { width: 18px; height: 18px; }
dialog h2 { font-size: 29px; line-height: 1.15; margin: 20px 0; }
dialog p:not(.eyebrow) { font-size: 14px; line-height: 1.8; color: #bdcbe0; margin-bottom: 17px; }
dialog .button { margin-top: 10px; }
.noscript { padding: 18px; text-align: center; font-size: 13px; background: #203249; }
/* La información permanece visible si no hay JS o el usuario reduce movimiento. */
.is-js .reveal { opacity: 0; transform: translateY(20px); transition: opacity .75s var(--ease),transform .8s var(--ease); transition-delay: var(--delay,0ms); }
.is-js .reveal.in-view { opacity: 1; transform: none; }
@keyframes module-float { 0%,100% { translate: 0 0; } 50% { translate: 0 -6px; } }
@keyframes connector-flow { to { stroke-dashoffset: -640; } }
@keyframes orbit { to { rotate: 360deg; } }
@keyframes contact-light { 0%,70%,100% { opacity: .22; scale: 1; } 80% { opacity: .9; scale: 1.025; } }
@media(min-width:1500px) and (min-height:920px) {
  .scene:not(.final) { display: flex; flex-direction: column; justify-content: center; }
  .hero-grid { min-height: 590px; }
}
@media(max-width:1190px) {
 .section-shell { width: calc(100% - 104px); }
 .site-header { padding-inline: 28px; gap: 20px; }
 .header-label { display: none; }
 .main-nav { gap: 21px; }
 .hero-grid { gap: 20px; }
 .hero-copy h1 { font-size: clamp(45px,5.1vw,65px); }
 .hero-copy .lead { font-size: 17px; }
 .ecosystem { min-height: 500px; }
 .module--users { width: 208px; top: 7%; }
 .module--money { width: 247px; bottom: 3%; }
 .module--movements { width: 194px; bottom: 25%; }
 .module { padding: 19px 15px; min-height: 80px; }
 .module strong { font-size: 20px; }
 .module--money strong { font-size: 19px; }
 .core { width: 147px; height: 157px; top: 43%; }
 .core>strong { font-size: 11px; }
 .hero-pillars { gap: 12px; }
 .comparison-side { padding: 23px; }
 .comparison h3 { font-size: 22px; }
 .comparison-list li { font-size: 13px; }
 .loose { padding: 10px; font-size: 10px; }
 .loose--three { left: 0; }
 .loose--four { right: 0; }
 .services-heading { align-items: start; gap: 25px; }
 .services-heading>p { max-width: 240px; font-size: 14px; }
 .service-card { padding: 23px; }
 .service-card h3 { font-size: 21px; }
 .service-card>p { font-size: 13px; }
 .final-layout { gap: 40px; }
 .final-map { min-height: 410px; }
 .final-map>img { width: 118%; top: 14px; left: -12%; }
 .final-copy .lead { font-size: 16px; }
}
@media(max-width:1000px) {
 .main-nav { display: none; }
 .header-label { display: flex; margin-left: auto; }
 .header-cta { margin-left: auto; }
 .site-header { gap: 25px; }
 .section-shell { width: calc(100% - 80px); }
 .hero-copy h1 { font-size: 50px; }
 .hero-copy .lead { font-size: 16px; }
 .hero-actions { flex-direction: column; align-items: start; gap: 20px; }
 .hero-pillars { font-size: 10px; gap: 11px; }
 .module--money { width: 229px; }
 .module--money strong { font-size: 18px; }
 .module--users { width: 196px; }
 .module--movements { width: 173px; }
 .module strong { font-size: 19px; }
 .ecosystem { min-height: 520px; }
 .comparison-label { font-size: 8px; letter-spacing: .055em; }
 .comparison-label>span:last-child { font-size: 7px; }
 .loose { font-size: 9px; padding: 9px; gap: 6px; }
 .loose .icon { width: 15px; height: 15px; }
 .connected { font-size: 10px; padding: 9px 12px; }
 .comparison h3 { font-size: 21px; }
 .comparison-list li { font-size: 13px; }
 .service-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .services-heading { flex-direction: column; }
 .services-heading>p { max-width: 600px; }
 .service-card>p { font-size: 14px; }
 .final-map { min-height: 430px; }
 .final-copy h2 { font-size: 44px; }
 .final-pillars article { padding: 0 16px; gap: 12px; }
 .final-pillars h3 { font-size: 14px; }
 .final-pillars p { font-size: 11px; }
 .site-footer { gap: 20px; }
}
@media(max-width:760px) {
 :root { --header: 70px; }
 .site-header { height: var(--header); padding-inline: 22px; gap: 15px; }
 .brand { gap: 9px; }
 .brand img { width: 31px; height: 37px; }
 .brand-wordmark b { font-size: 17px; }
 .brand-wordmark strong { font-size: 10px; }
 .header-label { display: none; }
 .header-cta { font-size: 11px; padding: 9px 13px; gap: 8px; }
 .header-cta .icon { width: 15px; height: 15px; }
 .section-shell { width: calc(100% - 48px); }
 .step-nav { right: 3px; gap: 13px; }
 .step-nav a>span { display: none; }
 .step-nav a { padding: 5px; }
 .step-nav i { width: 4px; height: 4px; }
 .scene { min-height: 100svh; padding-top: 102px; padding-bottom: 90px; }
 .hero { padding-top: 108px; padding-bottom: 97px; }
 .hero-grid { grid-template-columns: 1fr; gap: 35px; }
 .hero-copy h1 { font-size: clamp(45px,9.6vw,64px); line-height: 1.04; letter-spacing: -.047em; margin-bottom: 24px; }
 .hero-copy .lead { font-size: 17px; line-height: 1.65; }
 .hero-actions { flex-direction: row; flex-wrap: wrap; align-items: center; margin-top: 26px; gap: 22px; }
 .hero-actions>.button { min-height: 54px; padding: 16px 23px; font-size: 14px; }
 .hero-actions>.text-link { font-size: 12px; }
 .hero-pillars { font-size: 11px; gap: 18px; margin-top: 27px; }
 .ecosystem { width: min(100%,520px); min-height: 0; aspect-ratio: 1/1.02; margin-inline: auto; }
 .core { width: 149px; height: 152px; left: 49%; top: 43%; border-radius: 24px; }
 .core::before { inset: -9px; border-radius: 32px; }
 .core img { height: 50px; margin-bottom: 12px; }
 .core>span { font-size: 7px; }
 .core>strong { font-size: 11px; }
 .module { min-height: 75px; padding: 17px 14px; border-radius: 14px; }
 .module>strong { font-size: 19px; }
 .module--users { width: 199px; left: 0; top: 4%; }
 .module--movements { width: 177px; right: 0; bottom: 23%; }
 .module--money { width: 240px; left: 0; bottom: 3%; }
 .module--money>strong { font-size: 19px; }
 .region-tag { font-size: 7px; top: -3%; right: 1%; }
 .ecosystem figcaption { font-size: 8px; bottom: -4%; }
 .scene-footer { bottom: 24px; font-size: 8px; letter-spacing: .06em; }
 .scene-footer>span { display: none; }
 .scene-footer>a { margin-right: 0; max-width: calc(100% - 160px); font-size: 7px; gap: 9px; }
 .scene-footer .icon { width: 13px; height: 13px; }
 .eyebrow { font-size: 9px; letter-spacing: .09em; gap: 8px; }
 .eyebrow>span { width: 5px; height: 5px; }
 h2 { font-size: clamp(33px,6.8vw,43px); line-height: 1.14; }
 .section-heading { margin-bottom: 28px; }
 .section-heading h2 br, .services-heading h2 br { display: none; }
 .section-intro { font-size: 15px; line-height: 1.75; margin-top: 17px; }
 .comparison { grid-template-columns: 1fr; gap: 24px; }
 .comparison-side { padding: 25px; }
 .comparison-label { font-size: 10px; }
 .comparison-label>span:last-child { font-size: 8px; }
 .dispersed-visual,.connected-visual { height: 155px; }
 .loose { font-size: 11px; padding: 11px; }
 .connected { font-size: 11px; }
 .compare-arrow { top: 50%; width: 41px; height: 41px; transform: translate(-50%,-50%) rotate(90deg); }
 .comparison h3 { font-size: 25px; }
 .comparison-list li { font-size: 14px; line-height: 1.7; }
 .connection-takeaway { font-size: 17px; line-height: 1.7; }
 .connection-takeaway strong { display: block; }
 .services-heading { gap: 17px; margin-bottom: 27px; }
 .services-heading h2 { font-size: clamp(32px,6.5vw,41px); }
 .services-heading>p { font-size: 15px; line-height: 1.75; }
 .service-grid { gap: 15px; }
 .service-card { padding: 23px; }
 .service-card h3 { font-size: 22px; line-height: 1.2; }
 .service-card>p { font-size: 14px; line-height: 1.75; }
 .service-family { font-size: 8px; }
 .modular-note { padding: 20px; gap: 13px; flex-wrap: wrap; }
 .modular-note strong { font-size: 14px; }
 .modular-note p { font-size: 12px; }
 .modular-note>div { flex: 1; min-width: 200px; }
 .modular-note a { margin-left: 53px; font-size: 12px; }
 .scope-note { font-size: 10px; line-height: 1.8; }
 .final { padding-bottom: 0; }
 .final-layout { display: flex; flex-direction: column-reverse; gap: 15px; }
 .final-copy h2 { font-size: clamp(41px,9vw,55px); line-height: 1.09; margin-top: 20px; }
 .final-copy .lead { font-size: 16px; line-height: 1.8; }
 .final-copy .eyebrow { font-size: 9px; }
 .conditions { font-size: 12px; }
 .final-map { width: 100%; height: 320px; min-height: 0; }
 .final-map>img { width: 360px; height: 360px; max-width: 100%; object-fit: contain; left: 50%; top: -5px; transform: translateX(-50%); }
 .map-caption { left: 0; bottom: 20%; font-size: 7px; max-width: 125px; }
 .map-caption>b { font-size: 11px; line-height: 1.6; display: block; }
 .final-map-tag { bottom: 0; left: 0; font-size: 8px; }
 .final-pillars { grid-template-columns: 1fr; margin-top: 22px; padding-block: 0; }
 .final-pillars article,.final-pillars article:first-child,.final-pillars article:last-child { border-right: 0; border-bottom: 1px solid #9db0dc24; padding: 20px 0; gap: 18px; }
 .final-pillars article:last-child { border-bottom: 0; }
 .final-pillars h3 { font-size: 16px; margin-bottom: 5px; }
 .final-pillars p { font-size: 13px; }
 .final-contact { padding: 30px 0; }
 .final-contact>p { font-size: 26px; }
 .contact-slot { min-height: 171px; }
 .is-docked .channel-list { grid-template-columns: 1fr; gap: 10px; }
 .is-docked .channel { min-height: 80px; }
 .final-contact>small { font-size: 10px; }
 .site-footer { flex-wrap: wrap; gap: 17px; justify-content: space-between; padding-bottom: 32px; }
 .brand--footer img { width: 27px; height: 33px; }
 .brand--footer .brand-wordmark b { font-size: 14px; }
 .brand--footer .brand-wordmark strong { font-size: 9px; }
 .site-footer>span { font-size: 9px; margin: 0; }
 .site-footer>button { margin-right: auto; }
 .contact-widget.is-floating { right: max(14px,env(safe-area-inset-right)); bottom: max(14px,env(safe-area-inset-bottom)); width: 201px; }
 .contact-toggle { min-height: 58px; gap: 9px; padding: 7px 13px 7px 7px; }
 .contact-toggle strong { font-size: 12px; }
 .contact-toggle small { font-size: 8px; }
 .contact-glyph { width: 39px; height: 39px; }
 .contact-glyph .icon { width: 19px; height: 19px; }
 .toggle-sign { font-size: 21px; }
 .is-floating .channel-list { width: min(306px,calc(100vw - 30px)); bottom: calc(100% + 13px); }
 .toast { right: 14px; bottom: 89px; font-size: 11px; padding: 14px; }
 .atmosphere>img { width: 230vw; left: -70%; opacity: .17; }
 .light { width: 90vw; height: 90vw; filter: blur(70px); }
 .dialog-content { padding: 29px 24px; }
 dialog h2 { font-size: 25px; }
}
@media(max-width:560px) {
 .service-grid { grid-template-columns: 1fr; }
 .service-card { padding: 25px; }
 .service-card h3 { font-size: 25px; }
 .service-top { margin-bottom: 18px; }
 .service-card>p { font-size: 15px; }
 .service-family { font-size: 9px; }
 .hero-actions { gap: 20px; }
 .hero-copy .lead { font-size: 17px; }
 .ecosystem { aspect-ratio: 1/1.2; }
 .module--users { top: 6%; }
 .module--money { bottom: 0; }
 .module--movements { bottom: 24%; }
 .core { top: 46%; }
 .site-footer>span { display: none; }
}
@media(max-width:420px) {
 .section-shell { width: calc(100% - 42px); }
 .site-header { padding-inline: 20px; }
 .hero-copy h1 { font-size: clamp(39px,10.2vw,46px); }
 .hero-copy .lead { font-size: 16px; }
 .hero-actions { flex-direction: column; align-items: start; }
 .hero-pillars { font-size: 10px; gap: 14px; }
 .ecosystem { aspect-ratio: 1/1.38; }
 .module--users { width: 190px; top: 7%; }
 .module--money { width: 236px; bottom: 0; }
 .module--movements { width: 176px; bottom: 25%; }
 .module>strong { font-size: 19px; }
 .module--money>strong { font-size: 18px; }
 .module { min-height: 76px; }
 .core { top: 44%; width: 131px; height: 141px; left: 45%; }
 .core>strong { font-size: 10px; }
 .region-tag { top: 0; }
 .ecosystem figcaption { bottom: -5%; font-size: 8px; }
 .comparison-side { padding: 23px 20px; }
 .comparison-label { font-size: 8px; }
 .comparison-label>span:last-child { font-size: 7px; }
 .comparison h3 { font-size: 24px; }
 .loose { font-size: 9px; padding: 9px 10px; }
 .loose--one { left: 1%; }
 .loose--two { right: 0; }
 .connected { font-size: 10px; padding: 9px 12px; }
 .connected-center { width: 51px; height: 51px; }
 .dispersed-visual,.connected-visual { height: 150px; }
 .comparison-list li { font-size: 13px; }
 .modular-note .note-icon { display: none; }
 .modular-note>div { flex-basis: 100%; min-width: 0; }
 .modular-note a { margin-left: 0; }
 .final-copy .eyebrow { font-size: 8px; }
 .final-copy h2 { font-size: 43px; }
 .final-copy .lead { font-size: 15px; }
}
@media(max-width:345px) {
 .site-header { padding-inline: 16px; gap: 8px; }
 .brand { gap: 7px; }
 .brand img { width: 26px; height: 33px; }
 .brand-wordmark b { font-size: 15px; }
 .brand-wordmark strong { font-size: 9px; letter-spacing: .29em; }
 .header-cta { font-size: 10px; padding: 9px 11px; gap: 5px; }
 .header-cta .icon { width: 13px; }
 .hero-copy h1 { font-size: 38px; }
 .hero-copy .lead { font-size: 15px; }
 .hero-pillars { gap: 12px; font-size: 9px; }
 .ecosystem { aspect-ratio: 1/1.58; }
 .core { width: 126px; height: 134px; left: 43%; }
 .module--users { width: 179px; }
 .module--movements { width: 164px; bottom: 25%; }
 .module--money { width: 225px; }
 .module strong { font-size: 18px; }
 .module--money strong { font-size: 17px; }
 .loose { padding: 8px; font-size: 8px; }
 .loose .icon { width: 14px; height: 14px; }
 .comparison-label { font-size: 7px; }
 .comparison-label>span:last-child { font-size: 6px; }
 .comparison h3 { font-size: 22px; }
 .comparison-list li { font-size: 12px; }
 .service-card { padding: 23px; }
 .service-card h3 { font-size: 24px; }
 .service-card>p { font-size: 14px; }
 .final-copy h2 { font-size: 38px; }
 .scene-footer>a { max-width: calc(100% - 165px); }
}
@media(max-height:550px) and (orientation:landscape) {
 :root { --header: 58px; }
 .scene { padding-top: 92px; }
 .site-header .brand img { height: 35px; width: 30px; }
 .site-header .brand-wordmark b { font-size: 16px; }
 .site-header .brand-wordmark strong { font-size: 9px; }
 .contact-widget.is-floating { bottom: 12px; }
 .is-floating .channel-list { max-height: calc(100svh - 100px); overflow-y: auto; }
}
@media(prefers-reduced-motion:reduce) {
 html { scroll-behavior: auto; }
 *,*::before,*::after { animation: none!important; transition: none!important; }
 .is-js .reveal { opacity: 1; transform: none; }
 .ecosystem-stage, .contact-widget { transform: none!important; }
}
/* La consulta dentro de la nota no compite con la cápsula flotante. */
@media(min-width:761px) { .modular-note a { margin-left: 28px; } }
@media(max-width:760px) {
  .scene-footer>a { max-width: 93px; font-size: 0; gap: 10px; }
  .scene-footer>a::before { content: "Seguí\a bajando"; white-space: pre; font-size: 10px; line-height: 1.45; letter-spacing: .02em; }
}
@media(max-width:420px) { .core { top:39%; } }
@media(max-width:345px) { .core { top:40%; } }
/* Aire suficiente entre los cuatro elementos, incluso a 320 px. */
@media(min-width:1191px) { .module--movements { bottom:18%; } }
@media(min-width:761px) and (max-width:1190px) { .module--movements { bottom:22%; } }
@media(max-width:560px) { .ecosystem { aspect-ratio:1/1.32; } .core { top:43%; } }
@media(max-width:420px) { .ecosystem { aspect-ratio:1/1.5; } .core { top:40%; } }
@media(max-width:345px) { .ecosystem { aspect-ratio:1/1.8; } .core { top:40%; } }