/* Limpiezas Lumis · capa de efectos (burbujas, brillos, transiciones) */
::selection{background:var(--sky);color:var(--navy)}

/* Lienzo global de burbujas y destellos */
.fx-air,.fx-layer{position:fixed;inset:0;pointer-events:none;z-index:45;overflow:hidden}

/* Transición entre páginas: velo circular con el logo */
.fx-veil{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;pointer-events:none;background:radial-gradient(circle at 50% 40%,#1abfe0 0%,#0a5766 55%,#063640 100%);clip-path:circle(0% at var(--vx,50%) var(--vy,50%));transition:clip-path .6s cubic-bezier(.7,0,.25,1)}
.fx-veil img{width:190px;height:auto;background:#fff;border-radius:16px;padding:10px 14px;opacity:0;transform:scale(.85);transition:opacity .3s,transform .5s var(--ease);box-shadow:0 20px 60px rgba(0,0,0,.35)}
html.fx-leaving .fx-veil{clip-path:circle(150% at var(--vx,50%) var(--vy,50%));pointer-events:all}
html.fx-leaving .fx-veil img{opacity:1;transform:none;transition-delay:.18s}
html.fx-enter .fx-veil{clip-path:circle(150% at 50% 50%);animation:veil-out .75s .12s cubic-bezier(.7,0,.25,1) forwards}
html.fx-enter .fx-veil img{opacity:1;transform:none;animation:veil-logo .35s forwards}
@keyframes veil-out{to{clip-path:circle(0% at 50% 50%)}}
@keyframes veil-logo{to{opacity:0;transform:scale(1.1)}}

/* Escenario oscuro inmersivo (hero) */
.stage{position:relative;overflow:hidden;isolation:isolate;color:#d6f5fb;padding-bottom:clamp(40px,6vw,90px);
  background:radial-gradient(80% 70% at 85% 5%,rgba(42,205,238,.75) 0%,transparent 60%),radial-gradient(60% 60% at 0% 100%,rgba(92,215,239,.28) 0%,transparent 60%),linear-gradient(160deg,#063640 0%,#0a5766 48%,#0c8ca6 100%)}
.stage::before{content:'';position:absolute;inset:0;z-index:-1;opacity:.35;background-image:radial-gradient(rgba(255,255,255,.18) 1px,transparent 1px);background-size:28px 28px;mask-image:radial-gradient(70% 70% at 50% 40%,#000,transparent)}
.stage-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.stage>section,.stage>nav{position:relative;z-index:1}
.stage-light{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.stage-light i{position:absolute;top:-40%;width:22%;height:180%;background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,0) 65%);transform:rotate(22deg);animation:ray 11s ease-in-out infinite}
.stage-light i:nth-child(1){left:8%}.stage-light i:nth-child(2){left:38%;width:12%;animation-delay:-4s}.stage-light i:nth-child(3){left:66%;width:30%;animation-delay:-7s}
@keyframes ray{0%,100%{opacity:.25;translate:0 0}50%{opacity:.8;translate:40px 0}}
.stage .hero{overflow:visible}
.stage .hero-title,.stage .svc-hero h1{color:#fff}
.stage .hero-title em{background:linear-gradient(100deg,#8fecff 5%,#fff 30%,#9fefff 55%,#e9f6b8 80%,#8fecff 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 6s ease-in-out infinite}
.stage .eyebrow{color:var(--sky)}
.stage .hero-lead,.stage .svc-lead{color:#bce7ef}
.stage .hero-lead b{color:#fff}
.stage .pill,.stage .hero-rating,.stage .facts li{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:#fff;box-shadow:none}
.stage .hero-rating b{color:#fff}
.stage .hero-rating small{color:var(--sky)}
.stage .facts .i{color:var(--sky)}
.stage .hero-proof{color:#e1f7fb}
.stage .btn-ghost{--bg:rgba(255,255,255,.08);--fg:#fff;border-color:rgba(255,255,255,.3);}
.stage .btn-ghost:hover{border-color:var(--sky);color:var(--sky)}
.stage .btn-primary{--fg:var(--navy-2);background:linear-gradient(135deg,#6fdcef,var(--brand));box-shadow:0 14px 34px -10px rgba(18,178,210,.7)}
.stage .orb{border-color:rgba(255,255,255,.92);box-shadow:0 0 0 1px rgba(255,255,255,.25),0 40px 90px -30px rgba(0,0,0,.65),0 0 90px rgba(92,215,239,.35)}
.stage .seal-shape{fill:#fff}
.stage .seal{color:var(--navy);filter:drop-shadow(0 18px 30px rgba(0,0,0,.35))}
.stage .seal::before{border-color:rgba(10,87,102,.35)}
.stage .seal-ring text{fill:var(--blue)}
.stage .crumbs{color:#9fd2dc}
.stage .crumbs a{color:var(--sky)}
.stage .svc-tagline em{color:var(--sky)}
.stage .svc-frame{box-shadow:0 0 0 1px rgba(255,255,255,.2),0 40px 90px -30px rgba(0,0,0,.65),0 0 90px rgba(92,215,239,.3)}
.scroll-cue{position:absolute;left:50%;bottom:clamp(70px,8vw,120px);translate:-50% 0;z-index:3;width:28px;height:44px;border:2px solid rgba(255,255,255,.45);border-radius:20px}
.scroll-cue span{position:absolute;left:50%;top:8px;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,var(--sky));animation:cue 2s ease-in-out infinite}
@keyframes cue{0%{opacity:0;transform:translateY(16px) scale(.6)}40%{opacity:1}100%{opacity:0;transform:translateY(-2px) scale(1)}}

/* Olas animadas */
.wave{position:absolute;left:0;right:0;height:clamp(46px,6.5vw,100px);overflow:hidden;line-height:0;pointer-events:none;z-index:2}
.wave svg{width:200%;height:100%;animation:wave 16s linear infinite}
.wave-bottom{bottom:-1px}
.wave-top{top:-1px;transform:scaleY(-1)}
.wave-top svg{animation-duration:20s;animation-direction:reverse}
@keyframes wave{to{transform:translateX(-50%)}}
.offer{padding-top:calc(clamp(72px,9vw,128px) + 60px);padding-bottom:calc(clamp(72px,9vw,128px) + 60px)}
.offer>.stage-canvas{z-index:0}
.offer .wrap{position:relative;z-index:1}

/* Destellos sobre las palabras en cursiva */
em{position:relative}
.glint{position:absolute;width:.36em;height:.36em;pointer-events:none;color:var(--sky);opacity:0;animation:twinkle 3.6s ease-in-out infinite;filter:drop-shadow(0 0 6px rgba(92,215,239,.9))}
.glint svg{width:100%;height:100%;fill:currentColor}
.stage .glint,.offer .glint,.cta-in .glint,.rv-feature .glint{color:#fff}
@keyframes twinkle{0%,100%{opacity:0;transform:scale(.2) rotate(0)}45%,55%{opacity:1;transform:scale(1) rotate(90deg)}}

/* Titulares: las palabras suben al aparecer */
.w{display:inline-block;overflow:hidden;vertical-align:bottom;padding:0 .14em .16em 0;margin:0 -.14em -.16em 0}
.w>span{display:inline-block;transform:translateY(112%);transition:transform 1s var(--ease) calc(var(--i,0) * 45ms)}
.in .w>span,.w.in>span{transform:none}

/* Reflejo de cristal sobre las fotos */
.feat-media::after,.card-media::after,.orb::after,.svc-frame::after,.includes-media::after,.why-media figure::after,.cmp::after,.qs::before{content:'';position:absolute;inset:0;pointer-events:none;z-index:1;background:linear-gradient(115deg,transparent 32%,rgba(255,255,255,.5) 46%,rgba(255,255,255,.12) 54%,transparent 64%);transform:translateX(-120%)}
.why-media figure,.qs{position:relative}
.feat:hover .feat-media::after,.card:hover .card-media::after,.why-media:hover figure::after,.includes-media:hover::after,.qs:hover::before{transform:translateX(120%);transition:transform 1.1s var(--ease)}
.orb::after,.svc-frame::after{animation:gleam 8s ease-in-out infinite}
.orb-b::after{animation-delay:4s}
.js .reveal.in .feat-media::after,.js .reveal.in.card .card-media::after,.js .reveal.in .includes-media::after,.js .includes-media.in::after,.js .reveal.in .cmp::after{animation:gleam-once 1.6s .35s var(--ease)}
@keyframes gleam{0%,72%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
@keyframes gleam-once{from{transform:translateX(-120%)}to{transform:translateX(120%)}}

/* Brillo periódico en los botones principales */
.btn-primary::after,.btn-light::after,.dock-main{background-image:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%)}
.btn-primary::after,.btn-light::after{animation:auto-shine 5.5s 1.5s ease-in-out infinite}
@keyframes auto-shine{0%,78%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.dock-main{background:linear-gradient(135deg,var(--blue),var(--blue-2))}
.btn,.seal{transition:transform .25s var(--ease),box-shadow .25s,background .25s,color .25s,border-color .25s,translate .35s var(--ease)}

/* Tarjetas con inclinación 3D y reflejo que sigue al cursor */
.tilt.tilt{position:relative;transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0px));transition:transform .6s var(--ease),box-shadow .4s,border-color .3s,background .3s}
.js .reveal.tilt:not(.in){transform:translateY(28px)}
.js .reveal.in.tilt{transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0px));transition:opacity .8s var(--ease) var(--d,0ms),transform .6s var(--ease),box-shadow .4s,border-color .3s,background .3s}
.tilt.tilt.tilting{transition:transform .12s linear,box-shadow .4s,border-color .3s,background .3s}
.tilt:hover{--ty:-6px}
.glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:4;opacity:0;transition:opacity .35s;background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.42),rgba(255,255,255,0) 45%)}
.tilt:hover .glare{opacity:1}
.stamp-card .glare{border-radius:26px}

/* Borde luminoso giratorio en tarjetas destacadas */
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
.rv-feature,.freq-card.hl{position:relative}
.summary::before,.freq-card.hl::before{content:'';position:absolute;inset:-1.5px;border-radius:inherit;padding:1.5px;background:conic-gradient(from var(--ang),transparent 0 60%,var(--sky) 75%,var(--blue) 85%,transparent 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:ang 5s linear infinite;pointer-events:none}
@keyframes ang{to{--ang:360deg}}

/* Detalles vivos */
.fc-big{background:linear-gradient(135deg,var(--blue),var(--navy),var(--blue-2));background-size:200% 200%;animation:grad 4s ease-in-out infinite}
@keyframes grad{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}
.stamp-gold.done{animation:gold 2.6s ease-in-out infinite}
@keyframes gold{0%,100%{box-shadow:0 10px 24px -8px rgba(229,170,40,.8),0 0 0 0 rgba(255,209,102,.5)}50%{box-shadow:0 10px 24px -8px rgba(229,170,40,.8),0 0 0 10px rgba(255,209,102,0)}}
.intro,.process{overflow:hidden;isolation:isolate}
.intro::before,.process::before{content:'';position:absolute;z-index:-1;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(92,215,239,.28),transparent 65%);animation:drift 18s ease-in-out infinite}
.intro::before{right:-120px;top:-120px}
.process::before{left:-160px;bottom:-160px;animation-delay:-9s}
@keyframes drift{0%,100%{translate:0 0}50%{translate:-60px 50px}}
.faq details[open]{background:linear-gradient(90deg,rgba(92,215,239,.08),transparent);border-radius:12px}
.faq summary{transition:padding .3s var(--ease)}
.faq details[open] summary{padding-left:14px}
.faq details[open] .faq-a p{padding-left:14px}
.nav>a,.nav-drop{position:relative}
@media (min-width:981px){
  .nav>a::after{content:'';position:absolute;left:50%;bottom:4px;width:4px;height:4px;border-radius:50%;background:var(--blue);opacity:0;translate:-50% 4px;transition:.25s var(--ease)}
  .nav>a:hover::after,.nav>a[aria-current]::after{opacity:1;translate:-50% 0}
}

@media (max-width:980px){
  .scroll-cue{display:none}
  .stage .hero{padding-bottom:40px}
}
@media (max-width:640px){
  .stage-light i:nth-child(3){display:none}
  .offer{padding-top:calc(72px + 36px);padding-bottom:calc(72px + 36px)}
}
@media (prefers-reduced-motion:reduce){
  .fx-canvas,.stage-canvas,.stage-light,.scroll-cue,.glint{display:none}
  .fx-veil{display:none}
  .wave svg{animation:none}
  .w>span{transform:none}
}

/* Burbujas de navegación (CSS puro, compuestas en GPU) */
.fx-air i{position:absolute;left:var(--x);bottom:calc(var(--s) * -2);width:var(--s);height:var(--s);border-radius:50%;
  background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.95) 0 8%,transparent 16%),radial-gradient(circle at 50% 50%,rgba(255,255,255,.08) 55%,hsla(var(--h),90%,65%,.35) 78%,hsla(calc(var(--h) + 60),90%,70%,.55) 92%,transparent 100%);
  box-shadow:inset 0 0 0 1px hsla(var(--h),80%,60%,.25);opacity:.7;will-change:transform;animation:air var(--dur) linear var(--delay) infinite}
@keyframes air{0%{transform:translate3d(0,0,0);opacity:0}8%{opacity:.75}50%{transform:translate3d(var(--sway),-55vh,0)}92%{opacity:.6}100%{transform:translate3d(0,-112vh,0);opacity:0}}
.fx-spark{position:absolute;width:14px;height:14px;color:var(--sky);filter:drop-shadow(0 0 4px rgba(92,215,239,.9))}
.fx-spark svg{width:100%;height:100%;fill:currentColor}
.fx-pop{position:absolute;width:10px;height:10px;border-radius:50%;background:radial-gradient(circle at 32% 30%,#fff 0 18%,rgba(92,215,239,.25) 50%,rgba(42,205,238,.6) 100%);box-shadow:0 0 6px rgba(92,215,239,.6)}
@media (prefers-reduced-motion:reduce){.fx-air,.fx-layer{display:none}}