
:root{
  --navy:#070b44;--navy2:#0b155f;--deep:#020419;--blue:#0b67e9;--cyan:#15d8e8;
  --white:#fff;--cloud:#f6f9fc;--ink:#0d1530;--muted:#657089;--line:#dfe7f0;
  --container:1180px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:#fff;overflow-x:hidden}
h1,h2,h3{font-family:Manrope,Inter,sans-serif}a{text-decoration:none;color:inherit}
.container{width:min(var(--container),calc(100% - 40px));margin:auto}
header{position:sticky;top:0;z-index:20;background:rgba(3,6,29,.95);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.08)}
.nav{min-height:82px;display:flex;align-items:center;gap:24px}.logo img{width:220px;display:block}.navlinks{display:flex;gap:20px;margin-left:auto;white-space:nowrap}.navlinks a{color:rgba(255,255,255,.8);font-size:14px}.navlinks a:hover{color:#fff}.navcta{display:flex;gap:8px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 16px;border-radius:999px;font-weight:700;border:1px solid transparent}.btn-primary{background:linear-gradient(90deg,var(--blue),#0c7af0);color:#fff}.btn-ghost{color:#fff;border-color:rgba(255,255,255,.18)}
.hero{padding:105px 0 90px;color:#fff;background:radial-gradient(circle at 78% 26%,rgba(14,130,238,.30),transparent 30%),linear-gradient(135deg,var(--deep),var(--navy2));overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:65px;align-items:center}.eyebrow{font-size:12px;letter-spacing:.18em;color:var(--cyan);font-weight:800;margin-bottom:18px}.hero h1{font-size:clamp(50px,6vw,78px);line-height:.98;letter-spacing:-.05em;margin:0}.hero h1 span{color:#9edcff}.hero p{font-size:19px;line-height:1.7;color:rgba(255,255,255,.7)}
.visual{position:relative;width:min(450px,88vw);aspect-ratio:1;margin:auto;border-radius:28px;border:1px solid rgba(86,220,255,.14);background:rgba(255,255,255,.025);box-shadow:inset 0 0 70px rgba(23,113,231,.08)}.visual:before,.visual:after{content:"";position:absolute;border-radius:50%;inset:12%;border:1px dashed rgba(64,219,255,.18);animation:spin 15s linear infinite}.visual:after{inset:27%;animation-direction:reverse;animation-duration:9s}@keyframes spin{to{transform:rotate(360deg)}}.visual-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:124px;height:124px;border-radius:50%;display:grid;place-items:center;text-align:center;background:radial-gradient(circle at 35% 30%,#17d6e7,#166de3 55%,#07115d);color:#fff;font:800 18px Manrope;box-shadow:0 0 34px rgba(29,170,236,.24)}
.visual-chip{position:absolute;padding:11px 13px;border-radius:14px;background:rgba(255,255,255,.07);border:1px solid rgba(94,219,255,.20);color:#fff;font-size:11px}.v1{left:3%;top:16%}.v2{right:3%;top:20%}.v3{left:2%;bottom:20%}.v4{right:2%;bottom:16%}
.section{padding:92px 0}.section.light{background:var(--cloud)}.section.dark{background:linear-gradient(135deg,#04102d,#0a1f67);color:#fff}.section h2{font-size:clamp(38px,5vw,56px);line-height:1.05;letter-spacing:-.04em;margin:0 0 16px}.lead{font-size:18px;line-height:1.7;color:var(--muted);max-width:850px}.dark .lead{color:rgba(255,255,255,.62)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:32px}.card{padding:26px;border-radius:22px;background:#fff;border:1px solid var(--line);transition:.25s}.card:hover{transform:translateY(-4px);box-shadow:0 20px 55px rgba(20,65,120,.08)}.dark .card{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.09)}.card h3{font-size:21px;margin:0 0 10px}.card p{color:var(--muted);line-height:1.6}.dark .card p{color:rgba(255,255,255,.6)}
.useflow{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:30px}.useflow div{position:relative;padding:20px;border-radius:18px;background:#fff;border:1px solid var(--line)}.useflow div:not(:last-child):after{content:"→";position:absolute;right:-10px;top:50%;transform:translateY(-50%);color:var(--blue);font-weight:800}
.tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.tags span{font-size:12px;padding:8px 11px;border-radius:999px;background:#eaf3ff;color:#275d9e}
.cta{padding:82px 0;text-align:center;color:#fff;background:radial-gradient(circle at 50% 15%,rgba(18,131,248,.24),transparent 30%),linear-gradient(135deg,var(--deep),var(--navy2))}.cta h2{font-size:clamp(38px,5vw,56px);margin:0 0 14px}.cta p{color:rgba(255,255,255,.65);font-size:18px;max-width:760px;margin:0 auto}.actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:24px}
footer{background:#020419;color:rgba(255,255,255,.55);padding:28px 0;font-size:12px}.foot{display:flex;justify-content:space-between;gap:20px}
.menu-btn{display:none}
@media(max-width:1000px){.hero-grid{grid-template-columns:1fr}.navlinks{display:none}.navcta .btn-ghost{display:none}.menu-btn{display:block;margin-left:auto;width:44px;height:44px;border-radius:10px;border:1px solid rgba(255,255,255,.15);background:transparent;color:#fff}.grid{grid-template-columns:repeat(2,1fr)}.useflow{grid-template-columns:1fr}.useflow div:not(:last-child):after{content:"↓";right:auto;left:50%;top:auto;bottom:-16px;transform:translateX(-50%)}}
@media(max-width:650px){.container{width:min(100% - 24px,var(--container))}.nav{min-height:72px}.logo img{width:165px}.navcta{display:none}.hero{padding:76px 0 62px}.hero h1{font-size:46px}.grid{grid-template-columns:1fr}.section{padding:70px 0}.foot{flex-direction:column}.visual{width:min(330px,86vw)}}
@media(prefers-reduced-motion:reduce){*{animation:none!important}}


/* ===== AOD V21 — Unique animated Industry visuals ===== */
.industry-visual{
  position:relative; overflow:hidden;
  background:
    radial-gradient(circle at 50% 50%,rgba(25,145,239,.14),transparent 34%),
    rgba(255,255,255,.025);
}
.industry-visual:before{
  content:"";position:absolute;inset:0;
  background-image:linear-gradient(rgba(77,218,255,.035) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(77,218,255,.035) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:radial-gradient(circle,black,transparent 75%);
}
.industry-core{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:132px;height:132px;border-radius:50%;display:grid;place-items:center;
  text-align:center;padding:18px;color:#fff;font:800 15px Manrope;
  background:radial-gradient(circle at 35% 30%,#20d9e7,#1378e8 55%,#07115c);
  box-shadow:0 0 38px rgba(38,188,241,.25);z-index:5;
}
.industry-core:after{
  content:"";position:absolute;inset:-18px;border-radius:50%;
  border:1px dashed rgba(95,229,255,.22);animation:industrySpin 11s linear infinite;
}
@keyframes industrySpin{to{transform:rotate(360deg)}}
.industry-node{
  position:absolute;z-index:5;min-width:112px;padding:11px 13px;border-radius:14px;
  color:#fff;font-size:11px;text-align:center;
  background:rgba(7,30,93,.80);border:1px solid rgba(95,226,255,.18);
  box-shadow:0 12px 30px rgba(0,0,0,.14);
}
.industry-node span{
  display:inline-block;width:7px;height:7px;border-radius:50%;
  margin-right:7px;background:#62ebf7;box-shadow:0 0 10px #62ebf7;
}
.n1{left:5%;top:16%}.n2{right:5%;top:20%}.n3{left:4%;bottom:18%}.n4{right:4%;bottom:15%}
.industry-link{
  position:absolute;z-index:2;left:50%;top:50%;width:34%;height:1px;
  transform-origin:left center;
  background:linear-gradient(90deg,rgba(59,216,239,.8),transparent);
}
.l1{transform:rotate(-142deg)}.l2{transform:rotate(-35deg)}
.l3{transform:rotate(145deg)}.l4{transform:rotate(34deg)}
.industry-pulse{
  position:absolute;z-index:6;width:7px;height:7px;border-radius:50%;
  background:#74f3ff;box-shadow:0 0 14px #5de9ff;
  animation:industryPulse 4s ease-in-out infinite;
}
.ip1{left:19%;top:43%}.ip2{right:18%;top:54%;animation-delay:1.2s}.ip3{left:52%;bottom:12%;animation-delay:2.2s}
@keyframes industryPulse{0%,100%{opacity:.2;transform:scale(.7)}50%{opacity:1;transform:translate(12px,-10px) scale(1.2)}}

/* Sector-specific visual language */
.industry-visual.financial .industry-core:before{content:"$";font-size:28px}
.industry-visual.retail .industry-core:before{content:"▦";font-size:26px}
.industry-visual.health .industry-core:before{content:"+";font-size:34px}
.industry-visual.manufacturing .industry-core:before{content:"⚙";font-size:28px}
.industry-visual.public .industry-core:before{content:"◇";font-size:30px}
.industry-visual.hospitality .industry-core:before{content:"✦";font-size:27px}
.industry-visual.logistics .industry-core:before{content:"→";font-size:30px}
.industry-visual.realestate .industry-core:before{content:"⌂";font-size:31px}
.industry-core:before{display:block;margin-bottom:-18px;color:#b9f4ff;text-shadow:0 0 14px rgba(75,225,255,.6)}

@media(max-width:650px){
 .industry-core{width:112px;height:112px;font-size:12px}
 .industry-node{min-width:92px;font-size:9px;padding:9px}
 .n1{left:2%;top:13%}.n2{right:2%;top:17%}.n3{left:2%;bottom:16%}.n4{right:2%;bottom:13%}
}
@media(prefers-reduced-motion:reduce){
 .industry-core:after,.industry-pulse{animation:none!important}
}


/* ===== AOD V22 — Animated Industries HUB hero ===== */
.industries-hub-visual{
  position:relative;
  overflow:hidden;
}
.industries-hub-visual:before,
.industries-hub-visual:after{
  content:"";
  position:absolute;
  left:50%; top:50%;
  width:270px; height:270px;
  margin:-135px 0 0 -135px;
  border-radius:50%;
  border:1px dashed rgba(76,219,255,.20);
  pointer-events:none;
  animation:hubOrbitSpin 15s linear infinite;
}
.industries-hub-visual:after{
  width:390px;height:390px;
  margin:-195px 0 0 -195px;
  border-style:solid;
  border-color:rgba(76,219,255,.09);
  animation-duration:24s;
  animation-direction:reverse;
}
@keyframes hubOrbitSpin{to{transform:rotate(360deg)}}

/* Existing center orb */
.industries-hub-visual .core,
.industries-hub-visual .center,
.industries-hub-visual .orb{
  animation:hubCoreFloat 3.6s ease-in-out infinite;
  box-shadow:0 0 30px rgba(26,207,240,.22);
}
@keyframes hubCoreFloat{
  0%,100%{transform:translate(-50%,-50%) scale(1)}
  50%{transform:translate(-50%,-54%) scale(1.035)}
}

/* Existing labels: gentle independent movement */
.industries-hub-visual .tag,
.industries-hub-visual .node,
.industries-hub-visual [class*="label"]{
  animation:hubNodeFloat 4s ease-in-out infinite;
}
.industries-hub-visual .tag:nth-of-type(2),
.industries-hub-visual .node:nth-of-type(2){animation-delay:.7s}
.industries-hub-visual .tag:nth-of-type(3),
.industries-hub-visual .node:nth-of-type(3){animation-delay:1.4s}
.industries-hub-visual .tag:nth-of-type(4),
.industries-hub-visual .node:nth-of-type(4){animation-delay:2.1s}
@keyframes hubNodeFloat{
  0%,100%{translate:0 0}
  50%{translate:0 -7px}
}

/* Moving data pulses across the hero visual */
.industries-hub-visual{
  --hub-pulse:#67efff;
}
.industries-hub-visual .hub-data-pulse{display:none}
.industries-hub-visual > i{
  animation:hubPulse 3.2s ease-in-out infinite;
}
@keyframes hubPulse{
  0%,100%{opacity:.25;filter:drop-shadow(0 0 2px var(--hub-pulse))}
  50%{opacity:1;filter:drop-shadow(0 0 10px var(--hub-pulse))}
}

/* Animate the original orbital rings if they are actual elements */
.industries-hub-visual .ring,
.industries-hub-visual [class*="orbit"]{
  animation:hubOrbitSpin 15s linear infinite;
  transform-origin:center;
}
.industries-hub-visual .ring:nth-child(even),
.industries-hub-visual [class*="orbit"]:nth-child(even){
  animation-direction:reverse;
  animation-duration:21s;
}

/* Ensure motion remains visible even if original visual is built mostly with pseudo-elements */
.industries-hub-visual{
  background:
    radial-gradient(circle at 50% 50%,rgba(30,205,238,.13),transparent 22%),
    linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,.008));
  animation:hubGlow 5s ease-in-out infinite;
}
@keyframes hubGlow{
  0%,100%{box-shadow:inset 0 0 45px rgba(18,116,230,.04)}
  50%{box-shadow:inset 0 0 75px rgba(20,184,238,.10)}
}

@media(prefers-reduced-motion:reduce){
  .industries-hub-visual,
  .industries-hub-visual:before,
  .industries-hub-visual:after,
  .industries-hub-visual *,
  .industries-hub-visual *:before,
  .industries-hub-visual *:after{
    animation:none!important;
  }
}


/* ===== AOD V23 — Industries HUB: animation rebuilt with real elements ===== */
.industries-hub-v23{
  isolation:isolate;
  background:
    radial-gradient(circle at 50% 50%,rgba(26,218,235,.16),transparent 23%),
    linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.008));
  box-shadow:inset 0 0 80px rgba(14,111,231,.08),0 0 0 1px rgba(84,220,255,.02);
}
.industries-hub-v23:before,.industries-hub-v23:after{display:none!important}
.hub-grid{
  position:absolute;inset:0;z-index:0;
  background-image:linear-gradient(rgba(81,211,255,.032) 1px,transparent 1px),linear-gradient(90deg,rgba(81,211,255,.032) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:radial-gradient(circle at 50% 50%,black 10%,transparent 72%);
  animation:gridBreath 5s ease-in-out infinite;
}
@keyframes gridBreath{50%{opacity:.38;transform:scale(1.025)}}
.hub-ring{position:absolute;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%);z-index:1;pointer-events:none}
.hub-ring-outer{width:78%;height:78%;border:1px dashed rgba(82,223,255,.17);animation:ringRotate 18s linear infinite}
.hub-ring-mid{width:55%;height:55%;border:1px solid rgba(82,223,255,.13);animation:ringRotateReverse 13s linear infinite}
.hub-ring-inner{width:34%;height:34%;border:1px dashed rgba(82,223,255,.20);animation:ringPulse 3.6s ease-in-out infinite}
@keyframes ringRotate{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes ringRotateReverse{to{transform:translate(-50%,-50%) rotate(-360deg)}}
@keyframes ringPulse{50%{transform:translate(-50%,-50%) scale(1.08);opacity:.55}}
.orbit-dot{position:absolute;width:8px;height:8px;border-radius:50%;background:#69efff;box-shadow:0 0 16px #69efff}
.od1{left:10%;top:21%}.od2{right:8%;bottom:18%}.od3{left:47%;top:-4%}
.hub-lines{position:absolute;inset:0;width:100%;height:100%;z-index:2;overflow:visible}
.hub-lines line{stroke:rgba(58,216,240,.26);stroke-width:1.2;stroke-dasharray:7 10;animation:dashFlow 3.5s linear infinite}
.hub-lines line:nth-child(2){animation-delay:.6s}.hub-lines line:nth-child(3){animation-delay:1.2s}.hub-lines line:nth-child(4){animation-delay:1.8s}
@keyframes dashFlow{to{stroke-dashoffset:-68}}
.hub-core-v23{z-index:7!important;width:142px!important;height:142px!important;display:flex!important;flex-direction:column;gap:4px;justify-content:center!important;animation:coreFloatV23 3.8s ease-in-out infinite;overflow:visible}
.hub-core-v23 b{font-size:17px;letter-spacing:.02em}
.hub-core-v23 small{font-size:9px;font-weight:600;color:rgba(255,255,255,.72)}
.hub-core-glow{position:absolute;inset:-18px;border-radius:50%;border:1px solid rgba(88,235,255,.22);box-shadow:0 0 26px rgba(36,210,239,.14);animation:coreGlowV23 2.5s ease-in-out infinite;z-index:-1}
@keyframes coreFloatV23{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,-54%) scale(1.035)}}
@keyframes coreGlowV23{50%{transform:scale(1.09);opacity:.35;box-shadow:0 0 40px rgba(36,210,239,.28)}}
.hub-chip{z-index:8!important;min-width:105px;text-align:center;animation:chipFloatV23 4s ease-in-out infinite;box-shadow:0 12px 30px rgba(0,0,0,.14)}
.hub-chip span{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:7px;margin-right:6px;color:#77f4ff;background:rgba(41,217,238,.08)}
.chip-health{animation-delay:.8s}.chip-log{animation-delay:1.6s}.chip-retail{animation-delay:2.4s}
@keyframes chipFloatV23{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px);border-color:rgba(94,230,255,.46);box-shadow:0 16px 36px rgba(18,133,229,.18)}}
.flow-packet{position:absolute;width:8px;height:8px;border-radius:50%;z-index:9;background:#73f4ff;box-shadow:0 0 16px #73f4ff;left:50%;top:50%;transform:translate(-50%,-50%);opacity:0}
.fp1{animation:packetToFinance 3.2s ease-in-out infinite}.fp2{animation:packetToHealth 3.2s ease-in-out infinite .8s}.fp3{animation:packetToLog 3.2s ease-in-out infinite 1.6s}.fp4{animation:packetToRetail 3.2s ease-in-out infinite 2.4s}
@keyframes packetToFinance{0%{opacity:0;transform:translate(-50%,-50%)}15%{opacity:1}80%{opacity:1;transform:translate(-205px,-162px)}100%{opacity:0;transform:translate(-205px,-162px)}}
@keyframes packetToHealth{0%{opacity:0;transform:translate(-50%,-50%)}15%{opacity:1}80%{opacity:1;transform:translate(170px,-142px)}100%{opacity:0;transform:translate(170px,-142px)}}
@keyframes packetToLog{0%{opacity:0;transform:translate(-50%,-50%)}15%{opacity:1}80%{opacity:1;transform:translate(-200px,155px)}100%{opacity:0;transform:translate(-200px,155px)}}
@keyframes packetToRetail{0%{opacity:0;transform:translate(-50%,-50%)}15%{opacity:1}80%{opacity:1;transform:translate(172px,175px)}100%{opacity:0;transform:translate(172px,175px)}}
@media(max-width:650px){
  .hub-core-v23{width:116px!important;height:116px!important}.hub-core-v23 b{font-size:14px}.hub-core-v23 small{font-size:8px}
  .hub-chip{min-width:86px;font-size:9px!important;padding:8px!important}.hub-chip span{width:17px;height:17px;margin-right:3px}
  @keyframes packetToFinance{80%,100%{transform:translate(-145px,-120px)}}
  @keyframes packetToHealth{80%,100%{transform:translate(118px,-105px)}}
  @keyframes packetToLog{80%,100%{transform:translate(-142px,117px)}}
  @keyframes packetToRetail{80%,100%{transform:translate(120px,125px)}}
}

/* V38 — navegación unificada */
.navlinks a.nav-active{color:#fff;position:relative}
.navlinks a.nav-active:after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:2px;border-radius:2px;background:linear-gradient(90deg,#19d8ff,#1687ff)}

/* ===== AOD V43 — Responsive hardening ===== */
@media(max-width:1000px){
  .nav{position:relative;gap:12px}.navlinks{position:absolute;left:0;right:0;top:calc(100% + 8px);display:flex!important;flex-direction:column;gap:3px;padding:13px;border-radius:16px;background:rgba(3,6,29,.98);border:1px solid rgba(255,255,255,.08);box-shadow:0 20px 55px rgba(0,0,0,.3);opacity:0;visibility:hidden;transform:translateY(-8px);pointer-events:none;transition:.2s;z-index:50}.navlinks.open{opacity:1;visibility:visible;transform:none;pointer-events:auto}.navlinks a{padding:11px 12px;border-radius:9px}.menu-btn{display:inline-flex!important;align-items:center;justify-content:center;font-size:21px;cursor:pointer;flex:0 0 44px}
  .hero-grid{gap:38px}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  .container{width:min(100% - 24px,var(--container))}.nav{min-height:68px}.logo img{width:158px}.navcta{display:none}.navlinks{max-height:calc(100dvh - 90px);overflow-y:auto}
  .hero{padding:64px 0 58px}.hero h1{font-size:clamp(40px,12vw,50px)}.hero p{font-size:16px}.actions{flex-direction:column;align-items:stretch}.actions .btn{width:100%}
  .section{padding:66px 0}.section h2{font-size:clamp(34px,10vw,44px)}.grid{grid-template-columns:1fr}.card{padding:22px}.visual{width:min(330px,90vw)}.useflow{grid-template-columns:1fr}.cta{padding:66px 0}.foot{flex-direction:column}
}
@media(max-width:420px){.logo img{width:146px}.section{padding:60px 0}}
