/* XAE Landing 1.5 — UI-027..033. Scoped to XAE only. No third-party assets. */
body[data-xae-landing]{
 --xae-cta-a:#347dff;--xae-cta-b:#1456cc;--xae-header-glass:rgba(7,24,50,.18);
 background-color:#07172f;
 background-image:
 radial-gradient(ellipse 75% 28% at 84% 21%,#2967d484,transparent 85%),
 radial-gradient(ellipse 70% 27% at 13% 75%,#14b7b933,transparent 78%),
 linear-gradient(120deg,#08172b,#12366d 58%,#0a2245);
 background-repeat:no-repeat;
 background-size:100% max(1550px,125svh);
 width:100%;min-width:0;overflow-x:clip;
}
/* A single canvas begins under BOTH navigation rows, not below the Hero. */
body[data-xae-landing] .bar{
 background:var(--xae-header-glass)!important;
 -webkit-backdrop-filter:blur(13px);backdrop-filter:blur(13px);
 border-color:#80a8de33;
}
body[data-xae-landing] .xae-sticky{
 background:transparent!important;border:0!important;
 backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
 box-shadow:none!important;top:72px;max-width:100%;
}
body[data-xae-landing] .hero{
 background:transparent!important;isolation:isolate;
}
body[data-xae-landing] .hero::before{opacity:.8;background-size:42px 42px}
body[data-xae-landing] .xae-depth-grid{
 opacity:.95;background-size:43px 43px;
 background-image:linear-gradient(#629cff25 1px,transparent 1px),linear-gradient(90deg,#629cff25 1px,transparent 1px);
}
body[data-xae-landing] .xae-depth-halo{
 opacity:1;background:
 radial-gradient(ellipse at 72% 45%,#367bff80,transparent 42%),
 radial-gradient(ellipse at 20% 75%,#24c5c74a,transparent 37%);
}
body[data-xae-landing] .xae-depth-lines{opacity:.85}
body[data-xae-landing] .engine strong{color:#fff!important;text-shadow:0 2px 12px #06224c44}
body[data-xae-landing] .engine small{color:#e4efff!important}
/* UI-027: all five sticky tabs remain onscreen, no horizontal page overflow. */
body[data-xae-landing] .xae-sticky-track{
 width:100%;max-width:100%;min-width:0;
 justify-content:center;scrollbar-width:none;
}
body[data-xae-landing] .xae-sticky a{
 min-width:0;box-sizing:border-box;white-space:nowrap;
}
body[data-xae-landing] .xae-sticky a[aria-current="location"]{
 box-shadow:0 5px 14px #3268c65c;
}
body[data-xae-landing] .section[id]{scroll-margin-top:150px}
body[data-xae-landing] .hero[id]{scroll-margin-top:0}
body[data-xae-landing] #automatizacion{scroll-margin-top:150px}
body[data-xae-landing] .flow-sec .eyebrow,body[data-xae-landing] #ecosistema .eyebrow{position:relative;z-index:1}
/* UI-031/033: one commercial action in Hero, same reusable electric-blue CTA at bottom. */
body[data-xae-landing] .xae-hero-actions{display:flex;align-items:center;margin-top:28px}
body[data-xae-landing] .xae-cta-electric,
body[data-xae-landing] #direct-contact.xae-cta-electric{
 position:relative;isolation:isolate;
 background:linear-gradient(135deg,var(--xae-cta-a),var(--xae-cta-b))!important;
 border:1px solid #85baff!important;
 color:#fff!important;
 font-size:clamp(15px,2.5vw,19px);font-weight:780;
 box-shadow:0 8px 23px #1359d74e,0 0 0 0 #3a8bff85;
 text-shadow:0 1px 2px #0e3b80b0;
 border-radius:13px;padding:16px 22px;min-height:56px;max-width:100%;
 text-align:center;white-space:normal;line-height:1.25;
 animation:xae-cta-electric-pulse 3.2s ease-in-out infinite!important;
 transition:background .2s,box-shadow .2s,transform .2s;
}
@keyframes xae-cta-electric-pulse{
 0%,100%{box-shadow:0 8px 23px #1359d74e,0 0 0 0 #3a8bff80}
 50%{box-shadow:0 12px 30px #1359d782,0 0 0 8px #3a8bff00}
}
body[data-xae-landing] .xae-cta-electric:hover,
body[data-xae-landing] #direct-contact.xae-cta-electric:hover{
 background:linear-gradient(135deg,#4596ff,#175acf)!important;
 transform:translateY(-2px);
}
body[data-xae-landing] .xae-cta-electric:focus-visible{
 outline:3px solid #b1d2ff;outline-offset:4px;
}
/* UI-029: keep only the subtle staggered card float, never polygon rotations. */
body[data-xae-landing] #soluciones .card.xae-capability{overflow:visible!important}
body[data-xae-landing] #soluciones .xae-flip-control{
 animation:xae-card-microfloat 6.8s ease-in-out infinite;
 will-change:transform;
 transform:translateY(0);
}
body[data-xae-landing] #soluciones .xae-capability:nth-child(2n) .xae-flip-control{animation-delay:-2.1s}
body[data-xae-landing] #soluciones .xae-capability:nth-child(3n) .xae-flip-control{animation-delay:-4.2s}
body[data-xae-landing] #soluciones .xae-capability:has(.xae-flip-control[aria-expanded="true"]) .xae-flip-control{
 animation:none!important;transform:none!important;
}
body[data-xae-landing] #soluciones .xae-capability .xae-flip-inner{transform-style:preserve-3d}
body[data-xae-landing] #soluciones .xae-flip-control[aria-expanded="true"] .xae-flip-inner{transform:rotateY(180deg)}
body[data-xae-landing] #soluciones .xae-flip-return{display:none!important}
@keyframes xae-card-microfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
/* UI-030: extra strategic content on independent N1–N4 flip backs. */
body[data-xae-landing] #ecosistema .xae-layer-back{
 display:flex;justify-content:center;gap:6px;
 padding:12px 9px;
}
body[data-xae-landing] #ecosistema .xae-layer-back>strong{font-size:clamp(13px,2vw,17px);line-height:1.18;margin:0}
body[data-xae-landing] #ecosistema .xae-layer-extra{
 display:grid!important;gap:3px!important;align-content:center;
 width:100%;max-width:100%;min-width:0;
 font-size:inherit!important;line-height:1.3!important;
}
body[data-xae-landing] #ecosistema .xae-layer-capability{
 display:block;white-space:normal;overflow-wrap:break-word;
 width:100%;border-radius:5px;
 background:#ffffff13;color:#f2f7ff!important;
 font-size:clamp(12px,1.8vw,15px)!important;
 line-height:1.24;font-weight:580;
 padding:3px 5px;text-align:center;
}
body[data-xae-landing] #ecosistema .xae-layer-cue,
body[data-xae-landing] #ecosistema .xae-layer-return{display:none!important}
body[data-xae-landing] #ecosistema .xae-layer[aria-expanded="true"] .xae-layer-flip{
 transform:rotateY(180deg);
}
body[data-xae-landing] #ecosistema .layer.xae-layer:focus-visible{
 outline:3px solid #a6c9ff;outline-offset:3px;
}
/* UI-032: a visible introduction prevents an empty workflow grid on entry. */
body[data-xae-landing] .xae-graph.is-enhanced .xae-node.is-preview{
 opacity:.88!important;visibility:visible!important;
 transform:translate(-50%,-50%) scale(.98)!important;
 border-color:#598ad4!important;
}
/* Light tokens and explicit contrast across all surfaces. */
html[data-theme="light"] body[data-xae-landing]{
 --xae-header-glass:rgba(240,247,255,.18);
 --xae-cta-a:#286ff0;--xae-cta-b:#194eb6;
 background-color:#eef5ff;
 background-image:
 radial-gradient(ellipse 75% 30% at 81% 22%,#83b6ff9e,transparent 85%),
 radial-gradient(ellipse 62% 25% at 13% 70%,#38cfc95e,transparent 78%),
 linear-gradient(116deg,#f8fbff,#d9eafd 56%,#deedff);
}
html[data-theme="light"] body[data-xae-landing] .bar{
 background:var(--xae-header-glass)!important;
 border-color:#9dbadd59;
}
html[data-theme="light"] body[data-xae-landing] .hero{
 background:transparent!important;color:#13365d;
}
html[data-theme="light"] body[data-xae-landing] .hero h1{color:#0e315e!important}
html[data-theme="light"] body[data-xae-landing] .hero p,
html[data-theme="light"] body[data-xae-landing] .hero .micro{color:#315879!important}
html[data-theme="light"] body[data-xae-landing] .hero .eyebrow{color:#1f56a3!important}
html[data-theme="light"] body[data-xae-landing] .xae-depth-grid{
 background-image:linear-gradient(#2767bd18 1px,transparent 1px),linear-gradient(90deg,#2767bd18 1px,transparent 1px);
}
html[data-theme="light"] body[data-xae-landing] .xae-depth-halo{opacity:.67}
html[data-theme="light"] body[data-xae-landing] .engine{
 background:linear-gradient(145deg,#2d70d8,#153768)!important;
}
html[data-theme="light"] body[data-xae-landing] .engine strong{color:#fff!important}
html[data-theme="light"] body[data-xae-landing] .engine small{color:#e3f0ff!important}
html[data-theme="light"] body[data-xae-landing] .sat{
 background:#f9fcfff5;color:#224979;border-color:#789bcb;
}
html[data-theme="light"] body[data-xae-landing] #soluciones .card .ico{
 background:linear-gradient(145deg,#d8e7ff,#b2cef5)!important;
 border-color:#4d81c4!important;color:#1b57a4!important;
 filter:drop-shadow(0 2px 5px #3d6da93f)!important;
}
html[data-theme="light"] body[data-xae-landing] #soluciones .card .ico svg{
 color:#1b57a4!important;stroke:#1b57a4!important;
}
html[data-theme="light"] body[data-xae-landing] #soluciones .xae-flip-front{
 color:#153b66!important;background:linear-gradient(145deg,#fff,#eaf3ff)!important;
}
html[data-theme="light"] body[data-xae-landing] #soluciones .xae-flip-hint{color:#2d5684!important}
html[data-theme="light"] body[data-xae-landing] #soluciones .xae-flip-back{color:#fff!important}
html[data-theme="light"] body[data-xae-landing] #ecosistema .xae-layer-front{
 color:#173e70!important;background:linear-gradient(155deg,#fff,#e6f1ff)!important;
 border:1px solid #8fb2dd!important;
}
html[data-theme="light"] body[data-xae-landing] #ecosistema .xae-layer-front strong{color:#173e70!important}
html[data-theme="light"] body[data-xae-landing] #ecosistema .xae-layer-front .xae-layer-tag{color:#2a61ae!important}
html[data-theme="light"] body[data-xae-landing] #ecosistema .xae-layer-front .xae-layer-teaser{color:#385c82!important}
html[data-theme="light"] body[data-xae-landing] #ecosistema .xae-layer-back{
 color:#fff!important;background:linear-gradient(135deg,#2461bb,#16467f)!important;
}
html[data-theme="light"] body[data-xae-landing] #ecosistema .xae-layer-back .xae-layer-capability{
 color:#fff!important;background:#ffffff22;
}
html[data-theme="light"] body[data-xae-landing] .flow-sec .eyebrow,
html[data-theme="light"] body[data-xae-landing] #ecosistema .eyebrow,
html[data-theme="light"] body[data-xae-landing] #contacto .eyebrow{
 color:#205caf!important;
}
html[data-theme="light"] body[data-xae-landing] .flow-sec .flow-head strong{color:#133c6a}
html[data-theme="light"] body[data-xae-landing] .xae-sticky a{
 background:rgba(247,251,255,.85)!important;color:#204a7b!important;
 border-color:#9cb9df90!important;
}
html[data-theme="light"] body[data-xae-landing] .xae-sticky a[aria-current="location"]{
 background:linear-gradient(135deg,#3378df,#2054bd)!important;
 color:#fff!important;border-color:#74a8ff!important;
 box-shadow:0 6px 14px #2555a247!important;
}
html[data-theme="light"] body[data-xae-landing] #direct-contact.xae-cta-electric,
html[data-theme="light"] body[data-xae-landing] .xae-hero-actions .xae-cta-electric{
 color:#fff!important;background:linear-gradient(135deg,#286ff0,#194eb6)!important;
}
html[data-theme="light"] body[data-xae-landing] .xp-footer{
 background:#e5f0ff;color:#214a76;
}
html[data-theme="light"] body[data-xae-landing] .xp-footer .xp-foot-brand small,
html[data-theme="light"] body[data-xae-landing] .xp-footer .xp-copyright,
html[data-theme="light"] body[data-xae-landing] .xp-footer .xp-legal a{color:#2c5682!important}
@media(max-width:690px){
 body[data-xae-landing] .bar-inner{height:65px}
 body[data-xae-landing] .xae-sticky{
  top:65px!important;width:100%;min-width:0;
 }
 body[data-xae-landing] .xae-sticky-track{
  display:grid!important;
  grid-template-columns:.68fr .99fr 1.33fr 1fr .94fr;
  gap:3px!important;
  width:100%;max-width:100%;min-width:0;
  padding:5px max(3px,env(safe-area-inset-left))!important;
  overflow:hidden!important;
  scroll-snap-type:none!important;justify-content:stretch!important;
 }
 body[data-xae-landing] .xae-sticky a{
  display:flex;min-width:0!important;max-width:100%;width:100%;
  margin:0;justify-content:center;align-items:center;
  padding:11px 1px!important;
  font-size:clamp(10px,2.9vw,12px)!important;
  line-height:1.2;letter-spacing:-.035em;
  white-space:nowrap;overflow:hidden;text-overflow:clip;
  text-shadow:none!important;
  border-radius:12px!important;
 }
 body[data-xae-landing] .xae-sticky a::after{
  left:10%;width:80%;height:2px;
 }
 body[data-xae-landing] .hero h1{font-size:clamp(38px,10.5vw,53px)}
 body[data-xae-landing] .xae-hero-actions{margin-top:24px}
 body[data-xae-landing] .xae-hero-actions .xae-cta-electric{
  min-height:56px;padding:15px 19px;font-size:16px;
 }
 body[data-xae-landing] #ecosistema .layer.xae-layer{
  height:clamp(265px,34svh,302px)!important;
 }
 body[data-xae-landing] #ecosistema .xae-layer-back{padding:9px 6px;gap:4px}
 body[data-xae-landing] #ecosistema .xae-layer-back>strong{font-size:13px;line-height:1.16}
 body[data-xae-landing] #ecosistema .xae-layer-extra{gap:2px!important}
 body[data-xae-landing] #ecosistema .xae-layer-capability{
  font-size:clamp(11px,3vw,13px)!important;line-height:1.2;
  padding:3px 3px;
 }
 body[data-xae-landing] .xae-graph.is-enhanced .xae-node.is-preview{opacity:.85!important}
}
@media(max-width:355px){
 body[data-xae-landing] .xae-sticky a{font-size:10px!important;letter-spacing:-.06em}
 body[data-xae-landing] .xae-sticky-track{gap:2px!important}
 body[data-xae-landing] #ecosistema .layer.xae-layer{height:286px!important}
 body[data-xae-landing] #ecosistema .xae-layer-capability{font-size:11px!important;padding:2px}
}
@media(prefers-reduced-motion:reduce){
 body[data-xae-landing] .xae-cta-electric,
 body[data-xae-landing] #direct-contact.xae-cta-electric,
 body[data-xae-landing] #soluciones .xae-flip-control{animation:none!important}
 body[data-xae-landing] .hero::before,
 body[data-xae-landing] .xae-depth-grid,
 body[data-xae-landing] .xae-depth-halo,
 body[data-xae-landing] .xae-depth-lines{transform:none!important}
}
