.hero{
  --hero-cyan:var(--sx-cyan);
  --hero-cyan-soft:#7DF6FF;
  --hero-stat-purple:#7829FF;
  --hero-stat-navy:#003B73;
  --hero-benefit-dark:#0E1828;
  --hero-benefit-blue:#0079FF;
  --hero-vivo-bg:#FDECEA;
  --hero-gray:var(--sx-text-muted);
  --hero-gray-soft:var(--sx-text-muted);
  --hero-gray-body:#5B6778;
  --hero-input-border:#D9DCE2;
  --hero-mejor-bg:#EBF1FF;
  --hero-error:#FF6B35;
  --hero-error-bg:#FFF3EF;
  --hero-error-text:#C0400A;
  --hero-ok:#22C55E;
  --hero-ok-dark:#16A34A;
  --hero-ok-text:#14532D;
  --hero-ok-text-2:#15803D;
  --hero-ok-bg-1:#F0FDF4;
  --hero-ok-bg-2:#DCFCE7;

  position:relative;
  overflow:clip;
  background:
    linear-gradient(135deg, #D3E7FF 0%, #EAF4FE 38%, #DAEAFE 68%, #E3F0FF 100%);
  background-size:220% 220%;
  background-position:0% 50%;
  padding:clamp(88px,14vh,140px) 0 clamp(56px,9vh,96px);
  isolation:isolate;
}
.hero::before{
  content:"";position:absolute;inset:-15%;z-index:0;pointer-events:none;
  background:
    radial-gradient(46% 56% at 14% 16%, rgba(var(--sx-cyan-rgb),.34), transparent 60%),
    radial-gradient(52% 54% at 90% 22%, rgba(var(--sx-blue-rgb),.24), transparent 60%),
    radial-gradient(60% 62% at 64% 108%, rgba(var(--sx-cyan-rgb),.18), transparent 64%);
  background-repeat:no-repeat;
  background-size:146% 146%, 146% 146%, 146% 146%;
  background-position:-25% -25%, 125% -25%, 50% 125%;
  animation:hero-bg-drift 20s ease-in-out infinite;
  will-change:transform;
}
.hero.is-bg-paused::before{ animation-play-state:paused }
@keyframes hero-bg-drift{
  0%,100%{ transform:translate3d(0,0,0) scale(1) }
  50%    { transform:translate3d(-3%,3%,0) scale(1.12) }
}

.hero-stage{position:relative}
.hero-inner{position:relative;z-index:5}

.hero-decor{position:absolute;inset:0;z-index:0;pointer-events:none;display:none}
.hero-dotgrid{
  position:absolute;inset:0;opacity:.15;
  background-image:radial-gradient(var(--sx-gris-0) 1px,transparent 1px);
  background-size:26px 26px;
}
.hero-dollar{
  position:absolute;
  opacity:.9;user-select:none;pointer-events:none;
  animation:hero-float var(--d,7s) ease-in-out var(--dl,0s) infinite;
  will-change:transform;
}
@media (min-width:1280px){ .hero-decor{display:block} }
@keyframes hero-float{
  0%,100%{transform:translate3d(var(--px,0px),var(--py,0px),0) translateY(0) rotate(0)}
  50%{transform:translate3d(var(--px,0px),var(--py,0px),0) translateY(var(--fy,-16px)) rotate(var(--fr,4deg))}
}
.hero-dotgrid{ transform:translate3d(var(--px,0px),var(--py,0px),0); }

.hero-headlayer{text-align:center;margin-bottom:clamp(28px,4vw,48px)}

.hero-badge{
  display:inline-flex;align-items:center;gap:10px;
  padding:8px 16px;border-radius:var(--sx-r-pill);margin-bottom:18px;border:none;
  background:linear-gradient(135deg,#1077FD,#5543FF,var(--sx-cyan),#1077FD);
  background-size:300% 300%;
  animation:hero-badge-bg 4s ease infinite;
  transition:transform .18s var(--sx-ease);
}
.hero-badge:hover{transform:scale(1.03)}
.hero-badge:active{transform:scale(.97)}
@keyframes hero-badge-bg{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.hero-badge-coin{flex-shrink:0;filter:drop-shadow(0 0 6px rgba(var(--sx-cyan-rgb),.8))}
.hero-badge-txt{
  font-family:var(--sx-font-title);font-weight:700;font-size:14px;line-height:1;
  color:#fff;white-space:nowrap;letter-spacing:.02em;
}
@media (max-width:389.98px){
  .hero-badge-txt{white-space:normal;font-size:13px;line-height:1.2;text-align:center}
}
.hero-badge-hl{color:#fff;font-weight:700}

.hero-cot-cta{display:none}
@media (max-width:1279.98px), (max-height:619.98px){
  .hero-cot-cta{display:flex;width:100%;margin-top:4px}
}

.hero-headline{
  font-family:var(--sx-font-title);font-weight:800;
  font-size:clamp(2.2rem,10vw,4rem);line-height:1.05;letter-spacing:-.02em;
  text-transform:uppercase;
}
.hero-line{display:block;color:var(--sx-text)}
.hero-line--blue{color:var(--sx-blue)}
@media (min-width:768px){ .hero-headline{font-size:clamp(2.8rem,6.5vw,5rem)} }
@media (min-width:1280px){
  .hero-headline{font-size:clamp(2.4rem,5.6vw,80px);line-height:1.06}
}

.hero-stagerow{display:flex;flex-direction:column;align-items:center;gap:clamp(28px,4vw,40px)}
.hero-stagerow > *{min-width:0}
.hero-col{width:100%}
.hero-center{order:1}
.hero-col-stats{order:2}
.hero-col-benefits{order:3}

.hero-center{display:flex;flex-direction:column;align-items:center;gap:clamp(20px,3vw,28px);width:100%}

.hero-col-stats{max-width:720px;margin:0 auto;display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width:560px){ .hero-col-stats{grid-template-columns:repeat(3,1fr)} }

.hero-stat-card{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  border-radius:16px;padding:20px;min-height:96px;
}
.hero-stat-value{font-family:var(--sx-font-title);font-weight:700;font-size:24px;line-height:1.1;color:#fff}
.hero-stat-label{font-family:var(--sx-font-title);font-weight:300;font-size:15px;line-height:1.4;color:#fff;margin-top:2px}
.hero-stat-value--dark{color:var(--sx-text)}
.hero-stat-label--dark{color:var(--sx-text)}
.hero-stat-icon{width:28px;height:28px;flex-shrink:0}
.hero-stat-ico{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:56px;height:56px;border-radius:16px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16)}
.hero-stat-ico--onlight{background:rgba(6,20,40,.05);border-color:rgba(6,20,40,.1)}

.hero-col-benefits{display:none;max-width:760px;margin:0 auto;gap:16px}
@media (min-width:768px){ .hero-col-benefits{display:grid;grid-template-columns:1fr 1fr} }
.hero-benefit-card{border-radius:16px;padding:24px}
.hero-benefit-ico{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:16px;margin-bottom:16px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14)}
.hero-benefit-ico svg{width:28px;height:28px}
.hero-benefit-title{font-family:var(--sx-font-title);font-weight:700;font-size:clamp(24px,2.4vw,36px);line-height:1.1;color:#fff;margin-bottom:12px}
.hero-benefit-body{font-family:var(--sx-font-title);font-weight:300;font-size:clamp(16px,1.5vw,22px);line-height:1.5}

@media (min-width:1280px){
  .hero-col-stats,.hero-col-benefits{max-width:900px}
  .hero-stat-card{min-height:132px;padding:24px}
  .hero-stat-value{font-size:30px}
  .hero-stat-label{font-size:17px}
  .hero-stat-icon{width:28px;height:28px}
  .hero-benefit-card{padding:28px}
}

.hero-cotizador{position:relative;width:100%;max-width:458px;min-width:0;margin:0 auto;isolation:isolate}

.hero-cotizador-border{position:relative;overflow:hidden;border-radius:26px;padding:3px;min-width:0}
.hero-cotizador-spin{
  position:absolute;inset:-100%;z-index:0;
  background:conic-gradient(from 0deg,var(--sx-blue),var(--hero-cyan),var(--sx-blue),var(--hero-cyan),var(--sx-blue));
  animation:hero-spin 4s linear infinite;
}
@keyframes hero-spin{to{transform:rotate(360deg)}}

.hero-cotizador-card{
  position:relative;z-index:1;display:flex;flex-direction:column;min-width:0;
  gap:24px;background:var(--sx-white);border-radius:24px;
  padding:clamp(16px,4vw,24px) clamp(14px,4vw,24px) clamp(20px,5vw,32px);
}

.hero-cot-header{display:flex;align-items:center;justify-content:center;gap:12px;min-width:0}
.hero-vivo-pill{
  display:inline-flex;align-items:center;flex-shrink:0;
  background:var(--hero-vivo-bg);border-radius:var(--sx-r-pill);padding:4px 10px 4px 8px;
}
.hero-vivo-pill .sx-vivo{color:var(--sx-vivo-texto);font-size:13px;letter-spacing:.04em;gap:6px}
.hero-cot-title{
  font-family:var(--sx-font-body);font-weight:700;
  font-size:clamp(11px,3.2vw,15px);color:var(--sx-blue-dark);
  text-transform:uppercase;letter-spacing:.02em;line-height:20px;white-space:nowrap;margin:0;
  min-width:0;overflow:hidden;text-overflow:ellipsis;
}
@media (max-width:359.98px){
  .hero-cot-title{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.25}
}

.hero-tabs{
  display:flex;width:100%;
  border:1.5px solid var(--sx-blue);border-radius:12px;overflow:hidden;
  box-shadow:0 1px 3px rgba(var(--sx-blue-rgb),.08);
}
.hero-tab{
  flex:1 1 0;min-width:0;overflow:hidden;min-height:44px;padding:8px 10px;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--sx-font-body);font-weight:400;font-size:clamp(12px,3.6vw,15px);
  color:var(--sx-blue-texto);background:var(--sx-white);white-space:nowrap;
  transition:background .2s var(--sx-ease),color .2s var(--sx-ease);
}
@media (max-width:339.98px){
  .hero-tab{white-space:normal;line-height:1.2;overflow:visible}
}
.hero-tab strong{font-weight:700;letter-spacing:-.01em;margin-left:4px}
.hero-tab--active{background:var(--sx-blue);color:#fff;font-weight:500}

.hero-tc-updated{ display:none }

.hero-boxes{position:relative;display:flex;flex-direction:column;gap:16px;margin-top:8px}
.hero-box{
  position:relative;border:1.5px solid var(--hero-input-border);border-radius:14px;
  padding:clamp(14px,4vw,24px);background:var(--sx-white);
}
.hero-box-label{
  position:absolute;top:-10px;left:14px;padding:0 4px;background:var(--sx-white);
  font-family:var(--sx-font-body);font-weight:600;font-size:14px;
  color:var(--sx-blue-dark);text-transform:uppercase;line-height:20px;
}
.hero-box-row{display:flex;align-items:center;gap:10px}
.hero-box-amount{display:flex;align-items:baseline;gap:6px;flex:1;min-width:0}
.hero-box-symbol{
  font-family:var(--sx-font-title);font-weight:700;letter-spacing:-.01em;
  font-size:clamp(22px,6vw,30px);color:var(--sx-text);line-height:32px;flex-shrink:0;
}
.hero-input{
  flex:1;min-width:0;width:100%;background:transparent;border:none;outline:none;
  -webkit-appearance:none;appearance:none;border-radius:0;box-shadow:none;
  font-family:var(--sx-font-title);font-weight:700;letter-spacing:-.01em;
  font-size:clamp(22px,6vw,30px);color:var(--sx-text);line-height:32px;
}
.hero-input:focus{outline:none;box-shadow:none}
.hero-input::placeholder{color:var(--sx-text-muted);font-weight:400}
.hero-flag{
  width:32px;height:32px;flex-shrink:0;border-radius:50%;display:block;object-fit:cover;
}
.hero-swap{
  position:absolute;right:12px;top:50%;transform:translateY(-50%);z-index:10;
  width:40px;height:40px;border-radius:12px;background:var(--sx-blue);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 18px rgba(var(--sx-blue-rgb),.35);
  transition:transform .2s var(--sx-ease);
}
.hero-swap::before{content:"";position:absolute;inset:-2px}
.hero-swap svg{width:17px;height:17px}
.hero-swap:hover{transform:translateY(-50%) scale(1.1)}
.hero-swap:active{transform:translateY(-50%) scale(.95)}

.hero-cupon{
  position:relative;
  border:1.5px solid var(--hero-input-border);border-radius:8px;padding:13px 16px;
  cursor:pointer;transition:border-color .2s var(--sx-ease);
}
.hero-cupon[data-open="true"]{border-color:var(--sx-blue);cursor:default}
.hero-cupon-row{display:flex;align-items:center;gap:8px}
.hero-cupon-icon{width:32px;height:32px;flex-shrink:0}
.hero-cupon-placeholder{
  flex:1;font-family:var(--sx-font-body);font-weight:400;font-size:15px;color:var(--hero-gray-soft);
}
.hero-cupon-cta{
  flex-shrink:0;font-family:var(--sx-font-body);font-weight:700;font-size:14px;
  color:var(--sx-blue-texto);letter-spacing:.06em;text-transform:uppercase;
  background:none;border:none;padding:0;line-height:inherit;
}
.hero-cupon-input{
  flex:1;min-width:0;background:none;border:none;
  font-family:var(--sx-font-body);font-size:16px;color:var(--sx-text);display:none;
}
.hero-cupon-actions{display:none;align-items:center;gap:12px;flex-shrink:0}
.hero-cupon-simular{
  position:relative;
  font-family:var(--sx-font-body);font-weight:700;font-size:14px;
  color:var(--sx-blue-texto);cursor:pointer;white-space:nowrap;
  letter-spacing:.06em;text-transform:uppercase;
}
.hero-cupon-simular:hover{color:var(--sx-blue-dark)}
.hero-cupon-simular[disabled]{color:var(--sx-gris-0);cursor:default}
.hero-cupon-simular[disabled]:hover{color:var(--sx-gris-0)}
.hero-cupon-close{position:relative;display:flex;padding:6px;border-radius:50%;transition:background .18s var(--sx-ease)}
.hero-cupon-simular::before,
.hero-cupon-close::before,
.hero-cupon-applied-x::before{
  content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:max(100%,44px);height:max(100%,44px);
}
.hero-cupon-close:hover{background:var(--sx-gris-minus)}
.hero-cupon-close:hover svg{stroke:var(--sx-text)}
.hero-cupon-close svg{width:15px;height:15px}
.hero-cupon[data-open="true"] .hero-cupon-placeholder,
.hero-cupon[data-open="true"] .hero-cupon-cta{display:none}
.hero-cupon[data-open="true"] .hero-cupon-input,
.hero-cupon[data-open="true"] .hero-cupon-actions{display:flex}

.hero-cupon-error{
  display:flex;align-items:center;gap:10px;margin-top:-8px;
  background:var(--hero-error-bg);border:1.5px solid var(--hero-error);border-radius:10px;padding:11px 14px;
}
.hero-cupon-error[hidden]{display:none}
.hero-cupon-error svg{flex-shrink:0}
.hero-cupon-error p{
  flex:1;margin:0;font-family:var(--sx-font-body);font-weight:400;font-size:13.5px;
  color:var(--hero-error-text);line-height:1.4;
}
.hero-cupon-error p strong{font-weight:700}
.hero-cupon-error-close{display:flex;padding:2px;flex-shrink:0}
.hero-cupon-error-close svg{width:14px;height:14px}

.hero-cupon[hidden]{display:none}
.hero-cupon-applied{
  display:flex;align-items:center;gap:12px;
  background:linear-gradient(135deg,var(--hero-ok-bg-1) 0%,var(--hero-ok-bg-2) 55%,#BBF7D0 100%);
  border:1.5px solid var(--hero-ok);border-radius:14px;padding:12px 14px;
  box-shadow:0 1px 2px rgba(34,197,94,.08),inset 0 1px 0 rgba(255,255,255,.6);
}
.hero-cupon-applied[hidden]{display:none}
.hero-cupon-applied-icon{
  width:38px;height:38px;flex-shrink:0;border-radius:11px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--hero-ok) 0%,var(--hero-ok-dark) 100%);
  box-shadow:0 3px 10px rgba(34,197,94,.4),inset 0 1px 0 rgba(255,255,255,.3);
}
.hero-cupon-applied-icon svg{width:22px;height:22px}
.hero-cupon-applied-text{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.hero-cupon-applied-label{
  font-family:var(--sx-font-body);font-weight:700;font-size:14px;color:var(--hero-ok-text);
  line-height:1.3;letter-spacing:-.005em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.hero-cupon-applied-mejora{
  font-family:var(--sx-font-body);font-weight:500;font-size:12px;color:var(--hero-ok-text-2);line-height:1.3;
}
.hero-cupon-applied-mejora[hidden]{display:none}
.hero-cupon-applied-remove{
  width:30px;height:30px;flex-shrink:0;border-radius:9px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.75);border:1px solid rgba(34,197,94,.35);
  transition:transform .18s var(--sx-ease),background .18s var(--sx-ease);
}
.hero-cupon-applied-remove:hover{transform:scale(1.08);background:rgba(255,255,255,.95)}
.hero-cupon-applied-remove:active{transform:scale(.9)}
.hero-cupon-applied-remove svg{width:15px;height:15px}

.hero-mejor{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  border-radius:8px;padding:14px 16px;background:var(--hero-mejor-bg);
  border:1.5px dashed rgba(var(--sx-blue-rgb),.5);
}
.hero-mejor-text{flex:1;min-width:0}
.hero-mejor-title-row{display:flex;align-items:center;gap:6px;margin-bottom:3px}
.hero-mejor-title{font-family:var(--sx-font-body);font-weight:700;font-size:14px;color:var(--sx-text);line-height:1.4;letter-spacing:-.01em}
.hero-mejor-info{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .18s var(--sx-ease)}
.hero-mejor-info::before{content:"";position:absolute;inset:-14px}
.hero-mejor-info:hover{transform:scale(1.15)}
.hero-mejor-sub{font-family:var(--sx-font-body);font-weight:400;font-size:13px;color:var(--hero-gray-body);margin:0;line-height:1.4}

.hero-trust{display:flex;align-items:center;padding:8px 0;border-top:1px solid #E8F0FE}
.hero-trust-item{flex:1;display:flex;align-items:center;justify-content:center;gap:5px}
.hero-trust-icon{width:20px;height:20px;flex-shrink:0;opacity:.75}
.hero-trust-item span{font-family:var(--sx-font-body);font-size:12px;font-weight:400;color:var(--hero-gray);line-height:1.3}
.hero-trust-item strong{color:#374151}
.hero-trust-divider{width:1px;height:22px;background:var(--sx-gris-minus);flex-shrink:0}

.hero-scrollcue{
  position:relative;z-index:5;display:none;flex-direction:column;align-items:center;gap:1px;
  margin:clamp(28px,5vh,56px) auto 0;cursor:pointer;
  background:none;border:none;padding:0;
}
.hero-scrollcue.is-faded{pointer-events:none}
.hero-scrollcue svg{animation:hero-cue 2s ease-in-out infinite;animation-delay:calc(var(--i,0)*.28s);opacity:.45}
@keyframes hero-cue{0%,100%{opacity:.45;transform:translateY(-3px)}50%{opacity:1;transform:translateY(3px)}}

.hero-scroll-hint{display:none;flex-direction:column;align-items:center;gap:6px;pointer-events:none;cursor:pointer}
.hero-scroll-hint-txt{
  font-family:var(--sx-font-title);font-weight:400;font-size:13px;color:var(--hero-gray-soft);
  letter-spacing:.04em;text-transform:uppercase;
}
.hero-scroll-hint .scroll-arrow{animation:hero-hint-bob .9s ease-in-out infinite}
@keyframes hero-hint-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}

@media (min-width:1280px){
  .hero.is-scrolly{
    height:360vh;
    padding:0;overflow:clip;
  }
  .hero.is-scrolly .hero-stage{
    position:sticky;top:0;height:100vh;overflow:clip;
    display:flex;align-items:center;justify-content:center;
    background:var(--sx-white);
  }
  .hero.is-scrolly .hero-stage::before{
    content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
    opacity:var(--hero-glow,0);
    background:
      radial-gradient(58% 52% at 50% 44%, rgba(var(--sx-blue-rgb),.12), rgba(var(--sx-cyan-rgb),.06) 46%, transparent 72%),
      linear-gradient(180deg, #EEF6FF 0%, #F7FBFF 40%, #FFFFFF 78%);
  }
  .hero.is-scrolly .hero-inner{
    position:static;width:100%;max-width:1536px;height:100vh;padding:0 24px;
  }

  .hero.is-scrolly .hero-headlayer{
    position:absolute;top:0;left:0;right:0;z-index:5;
    padding-top:clamp(120px,20vh,280px);margin:0;pointer-events:none;
  }
  .hero.is-scrolly .hero-badge{pointer-events:auto;margin-bottom:14px}
  .hero.is-scrolly .hero-line{will-change:transform,opacity}
  .hero.is-scrolly .hero-headline{font-size:clamp(2.7rem,6vw,88px);line-height:1.03}

  .hero.is-scrolly .hero-stagerow{
    position:absolute;inset:0;display:block;
  }

  .hero.is-scrolly .hero-center{
    position:absolute;top:50%;left:50%;
    width:458px;transform:translate(-50%,-50%);
    display:block;gap:0;z-index:20;will-change:transform;
  }
  .hero.is-scrolly .hero-cotizador{max-width:458px;margin:0;opacity:1;transform:none}

  .hero.is-scrolly .hero-col{
    position:absolute;top:50%;z-index:10;transform:translateY(-50%);
    display:flex;flex-direction:column;margin:0;max-width:none;
  }
  .hero.is-scrolly .hero-col-stats{
    right:calc(50% + 278px);width:360px;gap:16px;
    grid-template-columns:none;
  }
  .hero.is-scrolly .hero-col-benefits{
    left:calc(50% + 278px);width:340px;gap:16px;
    display:flex;grid-template-columns:none;
  }
  .hero.is-scrolly .hero-stat-card{min-height:150px;height:150px;padding:0 24px;will-change:transform,opacity}
  .hero.is-scrolly .hero-stat-value{font-size:32px}
  .hero.is-scrolly .hero-stat-label{font-size:18px}
  .hero.is-scrolly .hero-stat-icon{width:28px;height:28px}
  .hero.is-scrolly .hero-benefit-card{padding:22px 24px;will-change:transform,opacity}
  .hero.is-scrolly .hero-benefit-title{font-size:30px}
  .hero.is-scrolly .hero-benefit-body{font-size:19px}

  .hero.is-scrolly .hero-anim{transition:none;opacity:0}

  .hero.is-scrolly .hero-scrollcue{
    display:flex;position:absolute;bottom:28px;left:calc(50% + 262px);margin:0;z-index:30;
  }
  .hero.is-scrolly .hero-scroll-hint{
    display:flex;position:absolute;bottom:30px;left:50%;transform:translateX(-50%);
    z-index:30;opacity:0;will-change:opacity;
  }
}

.hero-anim{opacity:0;transition:opacity .9s var(--sx-ease),transform .9s var(--sx-ease),filter .9s var(--sx-ease)}
.hero-anim--left{transform:translate(-48px,40px) scale(.85);filter:blur(10px)}
.hero-anim--right{transform:translate(48px,40px) scale(.85);filter:blur(10px)}
.hero-anim.is-in{opacity:1;transform:none;filter:none}

.hero-modal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:20px}
.hero-modal[hidden]{display:none}
.hero-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.45);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:hero-fade .22s ease}
.hero-modal-card{
  position:relative;background:var(--sx-white);border-radius:24px;padding:36px 32px 32px;
  max-width:420px;width:100%;text-align:center;
  box-shadow:0 24px 60px rgba(0,0,0,.18),0 4px 16px rgba(var(--sx-blue-rgb),.12);
  animation:hero-pop .28s var(--sx-ease);
}
.hero-modal-close{
  position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;background:var(--sx-fondo-card-azul);
  transition:background .18s var(--sx-ease)}
.hero-modal-close:hover{background:var(--sx-blue-light)}
.hero-modal-close svg{width:15px;height:15px}
.hero-modal-icon{
  width:56px;height:56px;border-radius:50%;margin:0 auto 20px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#EFF6FF,#DBEAFE);box-shadow:0 4px 16px rgba(var(--sx-blue-rgb),.15);
}
.hero-modal-icon svg{width:26px;height:26px}
.hero-modal-title{font-family:var(--sx-font-body);font-weight:700;font-size:20px;color:#111827;margin:0 0 16px;line-height:1.3}
.hero-modal-body{font-family:var(--sx-font-body);font-weight:400;font-size:15px;color:#4B5563;margin:0 0 20px;line-height:1.65}
.hero-modal-body strong{font-weight:700;color:#111827}
.hero-modal-tyc{display:block;font-family:var(--sx-font-body);font-weight:500;font-size:14px;color:var(--sx-blue-texto);margin-bottom:20px}
.hero-modal-tyc:hover{text-decoration:underline}
.hero-modal-cta{width:100%}
@keyframes hero-fade{from{opacity:0}to{opacity:1}}
@keyframes hero-pop{from{opacity:0;transform:scale(.92) translateY(24px)}to{opacity:1;transform:none}}

@media (prefers-reduced-motion:reduce){
  .hero::before{animation:none;transform:none;will-change:auto}
  .hero-dollar,.hero-cotizador-spin,.hero-scrollcue svg,.hero-scroll-hint .scroll-arrow{animation:none}
  .hero-scrollcue svg{opacity:.7}
  .hero-anim{opacity:1;transform:none;filter:none}
}

.secu{
  position:relative;
  overflow:hidden;
  background:#080815;
  padding:120px 0 80px;

  --secu-cyan-rgb:0,196,255;
  --secu-cyanbr-rgb:70,233,254;
  --secu-purple-rgb:140,60,255;
  --secu-orange-rgb:255,148,0;
  --secu-blue-rgb:16,119,253;
  --secu-purple-txt:#B47BFF;
  --secu-purple-lite:#9869FF;
}
@media (max-width:767.98px){
  .secu{padding:64px 0 64px}
}

.secu-glows{
  position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(ellipse 40% 60% at 12% 60%, rgba(var(--secu-cyan-rgb),.08) 0%, transparent 70%),
    radial-gradient(ellipse 36% 60% at 50% 60%, rgba(var(--secu-purple-rgb),.06) 0%, transparent 70%),
    radial-gradient(ellipse 40% 60% at 88% 60%, rgba(var(--secu-orange-rgb),.07) 0%, transparent 70%);
}
@media (max-width:1279.98px){
  .secu-glows{
    background:
      radial-gradient(ellipse 80% 40% at 50% 35%, rgba(var(--secu-cyan-rgb),.07) 0%, transparent 70%),
      radial-gradient(ellipse 70% 35% at 50% 60%, rgba(var(--secu-purple-rgb),.05) 0%, transparent 70%);
  }
}
.secu-fade{
  position:absolute; left:0; right:0; bottom:0; height:60px; pointer-events:none;
  background:linear-gradient(to bottom, transparent, #080815);
  display:none;
}
@media (max-width:1279.98px){ .secu-fade{display:block} }

.secu-container{width:100%; max-width:1200px; margin:0 auto; padding:0 20px; position:relative}
@media (min-width:1280px){ .secu-container{padding:0 40px} }

.secu-header{text-align:center; margin-bottom:72px}
@media (max-width:1279.98px){ .secu-header{margin-bottom:48px} }
.secu-title{
  font-family:var(--sx-font-title);
  font-weight:700; line-height:1.05; letter-spacing:-.03em;
  font-size:clamp(2rem,7vw,64px); color:var(--sx-white); margin:0 0 16px;
}
.secu-title-grad{
  background:linear-gradient(90deg,var(--sx-cyan),#9869FF);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
  
}
.secu-sub{
  font-family:var(--sx-font-title);
  font-weight:300; font-size:20px; line-height:1.65;
  color:rgba(255,255,255,.6); max-width:620px; margin:0 auto;
}
.secu-sub strong{color:var(--sx-white); font-weight:600}
@media (max-width:1279.98px){ .secu-sub{font-size:16px; max-width:540px} }

.secu-anim{margin-bottom:72px}
@media (max-width:1279.98px){ .secu-anim{margin-bottom:40px} }

.secu-track{display:flex; align-items:flex-start; padding-bottom:48px; justify-content:center}
.secu-anim--mobile .secu-track{padding-bottom:0; position:relative; min-height:340px; align-items:flex-start}
.secu-anim--mobile .secu-connector{display:none}
.secu-anim--mobile .secu-node{display:none}
.secu-anim--mobile .secu-node.is-on{display:flex}
.secu-anim--mobile .secu-node.is-leaving{display:flex; position:absolute; top:0; left:0; right:0; margin:0 auto; pointer-events:none}

.secu-node{
  display:flex; flex-direction:column; align-items:center; gap:40px;
  min-width:180px;
}
.secu-orb{position:relative; display:flex; align-items:center; justify-content:center; width:180px; height:180px}

.secu-node[data-ring="cyan"]  {--ring:rgba(var(--secu-cyan-rgb),.75);   --glow:var(--secu-cyan-rgb)}
.secu-node[data-ring="purple"]{--ring:rgba(var(--secu-purple-rgb),.75); --glow:var(--secu-purple-rgb)}
.secu-node[data-ring="orange"]{--ring:rgba(var(--secu-orange-rgb),.75); --glow:var(--secu-orange-rgb)}

.secu-ring-pulse{
  position:absolute; inset:-22px; border-radius:50%;
  border:1px solid var(--ring);
  box-shadow:0 0 32px rgba(var(--glow),.2);
  opacity:0;
}
.secu-node.is-on .secu-ring-pulse{animation:secu-ring-pulse 3.5s ease-in-out infinite}

.secu-ring-main{
  position:absolute; inset:0; border-radius:50%;
  border:2px solid var(--ring);
  box-shadow:0 0 50px rgba(var(--glow),.22), inset 0 0 30px rgba(var(--glow),.06);
}

.secu-orb-bg{
  position:absolute; inset:10px; border-radius:50%;
  background:radial-gradient(circle at 40% 35%, rgba(var(--glow),.16) 0%, rgba(var(--glow),.05) 60%, transparent 100%);
  display:flex; align-items:center; justify-content:center; z-index:2;
}

.secu-node .secu-ring-pulse,
.secu-node .secu-ring-main,
.secu-node .secu-orb-bg{
  opacity:0; transform:scale(.6);
  transition:opacity .45s var(--sx-ease), transform .45s var(--sx-ease);
}
.secu-node .secu-ring-pulse{transform:scale(.7)}
.secu-node.is-on .secu-ring-pulse,
.secu-node.is-on .secu-ring-main,
.secu-node.is-on .secu-orb-bg{opacity:1; transform:scale(1); transition-duration:.65s}

.secu-node-label{
  text-align:center;
  opacity:0; transform:translateY(8px);
  transition:opacity .45s var(--sx-ease), transform .45s var(--sx-ease);
}
.secu-node.is-on .secu-node-label{opacity:1; transform:none; transition-duration:.65s; transition-delay:.2s}
.secu-node-title{
  font-family:var(--sx-font-title); font-weight:700;
  font-size:clamp(2rem,3.8vw,56px); color:var(--sx-white); margin:0 0 6px; line-height:1;
}
.secu-node-sub{
  font-family:var(--sx-font-title); font-weight:300;
  font-size:20px; color:var(--sx-white); line-height:1.4; margin:0 auto; max-width:230px;
}
.secu-hl{color:var(--secu-purple-txt); font-weight:600}

.secu-connector{flex:1; padding-top:89px; align-self:flex-start; min-width:40px}
.secu-conn-rail{position:relative; height:2px; overflow:hidden; border-radius:2px}
.secu-conn-track{position:absolute; inset:0; background:rgba(255,255,255,.05)}
.secu-conn-fill{
  position:absolute; inset:0; transform-origin:left; transform:scaleX(0); opacity:0;
  transition:transform .4s var(--sx-ease), opacity .4s var(--sx-ease);
}
.secu-connector[data-conn="0"] .secu-conn-fill{background:linear-gradient(90deg,rgba(var(--secu-cyan-rgb),.7),rgba(var(--secu-purple-rgb),.7))}
.secu-connector[data-conn="1"] .secu-conn-fill{background:linear-gradient(90deg,rgba(var(--secu-purple-rgb),.7),rgba(var(--secu-orange-rgb),.7))}
.secu-connector.is-on .secu-conn-fill{transform:scaleX(1); opacity:1; transition-duration:.75s}
.secu-conn-light{
  position:absolute; top:0; bottom:0; width:35%; opacity:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent);
}
.secu-connector.is-on .secu-conn-light{opacity:1; animation:secu-conn-light 3s ease-in-out infinite}

.secu-dots{display:flex; justify-content:center; gap:8px; padding-bottom:4px}
.secu-anim--mobile .secu-dots{padding-bottom:0; margin-top:24px}
.secu-dot{width:6px; height:5px; border-radius:99px; background:rgba(255,255,255,.1); transition:width .4s var(--sx-ease), background .4s var(--sx-ease)}
.secu-dot.is-active{width:20px}
.secu-dot[data-dot="0"].is-lit{background:rgba(var(--secu-cyan-rgb),.7)}
.secu-dot[data-dot="1"].is-lit{background:rgba(var(--secu-purple-rgb),.7)}
.secu-dot[data-dot="2"].is-lit{background:rgba(var(--secu-orange-rgb),.7)}

.secu-illo--exchange{display:flex; align-items:center; width:128px}
.secu-cur{position:relative; flex-shrink:0}
.secu-cur-face{
  display:flex; align-items:center; justify-content:center;
  border-radius:50%; overflow:hidden; font-family:var(--sx-font-title); font-weight:700;
  color:var(--sx-white); position:relative; z-index:2;
  transition:border-color .3s var(--sx-ease), box-shadow .3s var(--sx-ease), transform .35s var(--sx-ease);
}
.secu-cur-face img{width:100%; height:100%; display:block; object-fit:cover}
.secu-cur--usd .secu-cur-face{
  width:52px; height:52px; font-size:22px;
  background:radial-gradient(circle at 50% 35%,#1a2740,#0a1220);
  border:2.5px solid rgba(var(--secu-cyanbr-rgb),.55);
  box-shadow:0 0 18px rgba(var(--secu-cyanbr-rgb),.4), 0 3px 14px rgba(0,0,0,.5);
}
.secu-cur--pen .secu-cur-face{
  width:46px; height:46px; font-size:16px;
  background:radial-gradient(circle at 50% 35%,#12243f,#08121f);
  border:2.5px solid rgba(var(--secu-blue-rgb),.55);
  box-shadow:0 0 16px rgba(var(--secu-blue-rgb),.4), 0 3px 14px rgba(0,0,0,.5);
}
.secu-cur--usd.is-bright .secu-cur-face{
  border-color:rgba(var(--secu-cyanbr-rgb),.9);
  box-shadow:0 0 32px rgba(var(--secu-cyanbr-rgb),.75), 0 3px 14px rgba(0,0,0,.5);
}
.secu-cur--pen.is-bright .secu-cur-face{
  border-color:rgba(var(--secu-blue-rgb),.9);
  box-shadow:0 0 28px rgba(var(--secu-blue-rgb),.75), 0 3px 14px rgba(0,0,0,.5);
}
.secu-cur-glow{
  position:absolute; inset:-12px; border-radius:50%; pointer-events:none;
  opacity:.35; transform:scale(1); transition:opacity .3s var(--sx-ease), transform .3s var(--sx-ease);
}
.secu-cur--usd .secu-cur-glow{background:radial-gradient(circle,rgba(var(--secu-cyanbr-rgb),.6) 0%,transparent 65%)}
.secu-cur--pen .secu-cur-glow{background:radial-gradient(circle,rgba(var(--secu-blue-rgb),.6) 0%,transparent 65%)}
.secu-cur.is-bright .secu-cur-glow{opacity:.85; transform:scale(1.5)}
.secu-cur-charge{
  position:absolute; inset:-14px; border-radius:50%; pointer-events:none; opacity:0;
}
.secu-cur--usd .secu-cur-charge{background:radial-gradient(circle,rgba(var(--secu-cyanbr-rgb),.7) 0%,transparent 65%)}
.secu-cur--pen .secu-cur-charge{inset:-12px; background:radial-gradient(circle,rgba(var(--secu-blue-rgb),.7) 0%,transparent 65%)}
.secu-cur.is-charging .secu-cur-charge{animation:secu-charge .48s ease-in-out infinite}
.secu-cur-ripple{position:absolute; inset:-4px; border-radius:50%; pointer-events:none; opacity:0}
.secu-cur--usd .secu-cur-ripple{border:2px solid var(--sx-cyan)}
.secu-cur--pen .secu-cur-ripple{border:2px solid var(--sx-blue)}
.secu-cur.is-impact .secu-cur-ripple{animation:secu-ripple .42s ease-out 1}
.secu-cur.is-impact .secu-cur-face{animation:secu-impact-bump .35s ease-out 1}

.secu-track-line{flex:1; position:relative; height:52px; margin:0 4px; display:flex; align-items:center}
.secu-track-base{width:100%; height:1.5px; border-radius:1px; background:linear-gradient(90deg,rgba(var(--secu-cyanbr-rgb),.22),rgba(var(--secu-blue-rgb),.22))}
.secu-particle{
  position:absolute; top:50%; margin-top:-5px; display:none; align-items:center; opacity:0;
}
.secu-particle.is-flying{display:flex}
.secu-particle-ball{width:11px; height:11px; border-radius:50%; flex-shrink:0}
.secu-particle-tail{width:28px; height:3px; border-radius:2px}
.secu-particle.dir-right{flex-direction:row-reverse; left:0}
.secu-particle.dir-right .secu-particle-ball{background:var(--sx-cyan); box-shadow:0 0 12px var(--sx-cyan),0 0 28px rgba(var(--sx-cyan-rgb),.5)}
.secu-particle.dir-right .secu-particle-tail{background:linear-gradient(to right,transparent,rgba(var(--secu-cyanbr-rgb),.6))}
.secu-particle.dir-right.is-flying{animation:secu-particle-right .52s cubic-bezier(.4,0,.6,1) 1 forwards}
.secu-particle.dir-left{flex-direction:row; right:0}
.secu-particle.dir-left .secu-particle-ball{background:var(--sx-blue); box-shadow:0 0 12px var(--sx-blue),0 0 28px rgba(var(--sx-blue-rgb),.5)}
.secu-particle.dir-left .secu-particle-tail{background:linear-gradient(to left,transparent,rgba(var(--secu-blue-rgb),.6))}
.secu-particle.dir-left.is-flying{animation:secu-particle-left .52s cubic-bezier(.4,0,.6,1) 1 forwards}

.secu-illo--coin{width:96px; height:96px}
.secu-coin-persp{perspective:500px; width:96px; height:96px}
.secu-coin-float{position:relative; width:96px; height:96px; transform-style:preserve-3d}
.secu-node.is-on .secu-coin-float{animation:secu-coin-float 4.2s ease-in-out infinite}

.secu-orbit{position:absolute; top:50%; left:50%; width:0; height:0}
.secu-orbit-inner{position:absolute; top:0; left:0; width:0; height:0}
.secu-orbit-dot{position:absolute; border-radius:50%}
.secu-node.is-on .secu-orbit-inner{animation:secu-orbit-spin linear infinite; animation-duration:var(--dur)}
.secu-node.is-on .secu-orbit-dot{animation:secu-orbit-pulse ease-in-out infinite; animation-duration:var(--pdur); animation-delay:var(--pdel)}
.secu-orbit--1{--r:58px; --sz:5px;   --clr:var(--sx-cyan); --dur:4.5s; --pdur:2.2s; --pdel:0s;   transform:rotate(0deg)}
.secu-orbit--2{--r:54px; --sz:3.5px; --clr:#9869FF; --dur:6.5s; --pdur:1.8s; --pdel:.7s;  transform:rotate(130deg)}
.secu-orbit--3{--r:60px; --sz:4px;   --clr:#519DFF; --dur:5.5s; --pdur:2.6s; --pdel:1.3s; transform:rotate(250deg)}
.secu-orbit-dot{
  top:calc(var(--sz) / -2); left:calc(var(--r) - var(--sz) / 2);
  width:var(--sz); height:var(--sz); background:var(--clr);
  box-shadow:0 0 calc(var(--sz)*3) var(--clr), 0 0 calc(var(--sz)*6) var(--clr);
}

.secu-coin-glow-deep{
  position:absolute; inset:-22px; border-radius:50%; filter:blur(14px); opacity:0;
  background:radial-gradient(circle,rgba(81,157,255,.55) 0%,rgba(111,46,255,.32) 50%,transparent 75%);
}
.secu-node.is-on .secu-coin-glow-deep{animation:secu-glow-deep 2.8s ease-in-out infinite}
.secu-coin-glow-inner{
  position:absolute; inset:-4px; border-radius:50%; filter:blur(5px); opacity:0;
  background:radial-gradient(circle,rgba(111,46,255,.28) 0%,transparent 70%);
}
.secu-node.is-on .secu-coin-glow-inner{animation:secu-glow-inner 1.6s ease-in-out infinite .5s}

.secu-coin-flip{position:relative; width:96px; height:96px; transform-style:preserve-3d}
.secu-node.is-on .secu-coin-flip{animation:secu-coin-entra 1.05s cubic-bezier(.22,.9,.36,1) 1 both}
.secu-coin-giro{position:absolute; inset:0; transform-style:preserve-3d}
.secu-node.is-on .secu-coin-giro{animation:secu-coin-giro 9s linear infinite}
.secu-coin-img{
  position:absolute; inset:0; width:96px; height:96px; display:block; z-index:1;
  backface-visibility:hidden; -webkit-backface-visibility:hidden;
  filter:drop-shadow(0 0 14px rgba(111,46,255,.65)) drop-shadow(0 0 30px rgba(81,157,255,.35));
}
.secu-coin-img--dorso{transform:rotateY(180deg)}
.secu-coin-canto{
  position:absolute; top:6%; left:50%; width:8px; height:88%; z-index:2;
  transform:translateX(-50%); border-radius:99px; opacity:0;
  background:linear-gradient(180deg,#9C8DFF 0%,#2E1E7A 24%,#0A4FA8 76%,#6FB4FF 100%);
  box-shadow:0 0 14px rgba(111,46,255,.85), 0 0 28px rgba(81,157,255,.4);
}
.secu-node.is-on .secu-coin-canto{animation:secu-coin-canto 9s linear infinite}
.secu-coin-luz{
  position:absolute; top:9%; left:15%; width:34%; height:24%; z-index:5;
  border-radius:50%; pointer-events:none; opacity:0; filter:blur(7px);
  transform:rotate(-24deg);
  background:radial-gradient(ellipse,rgba(255,255,255,.42) 0%,rgba(255,255,255,0) 70%);
}
.secu-node.is-on .secu-coin-luz{animation:secu-coin-luz 9s ease-in-out infinite}

.secu-coin-shadow{
  position:absolute; bottom:-14px; left:50%; transform:translateX(-50%);
  width:60px; height:10px; border-radius:50%; filter:blur(6px); opacity:0;
  background:radial-gradient(ellipse,rgba(111,46,255,.6) 0%,transparent 70%);
}
.secu-node.is-on .secu-coin-shadow{animation:secu-coin-shadow 4.2s ease-in-out infinite}

.secu-badge{
  position:absolute; top:-8px; right:-8px; z-index:10;
  background:linear-gradient(135deg,var(--sx-cyan),#00C4FF); color:#003B6E;
  font-family:var(--sx-font-title); font-weight:700; font-size:13px;
  padding:5px 13px; border-radius:99px; white-space:nowrap;
  box-shadow:0 0 22px rgba(var(--sx-cyan-rgb),.7),0 2px 10px rgba(0,0,0,.35);
  opacity:0; transform:scale(0) translateY(8px);
  transition:opacity .25s var(--sx-ease), transform .25s var(--sx-ease);
}
.secu-node.is-on .secu-badge{opacity:1; transform:scale(1) translateY(0); animation:secu-badge-pop .5s var(--sx-ease) .4s both}

.secu-floats{position:absolute; inset:0; pointer-events:none}
.secu-float{
  position:absolute; top:28%;
  font-family:var(--sx-font-title); font-weight:700; font-size:11px; line-height:1;
  color:var(--sx-cyan); text-shadow:0 0 8px rgba(var(--sx-cyan-rgb),.9); opacity:0; z-index:15;
}
.secu-float[data-float="0"]{left:calc(50% - 28px)}
.secu-float[data-float="1"]{left:calc(50% + 26px)}
.secu-float[data-float="2"]{left:calc(50% - 8px)}
.secu-float[data-float="3"]{left:calc(50% + 22px)}
.secu-node.is-on .secu-float{animation:secu-float 8.1s ease-out infinite}
.secu-node.is-on .secu-float[data-float="0"]{animation-delay:.9s}
.secu-node.is-on .secu-float[data-float="1"]{animation-delay:2.4s}
.secu-node.is-on .secu-float[data-float="2"]{animation-delay:3.8s}
.secu-node.is-on .secu-float[data-float="3"]{animation-delay:5.3s}

.secu-illo--brands{position:relative; width:100px; height:100px; display:flex; align-items:center; justify-content:center}
.secu-brand-glow{
  position:absolute; inset:-14px; border-radius:50%; filter:blur(8px); pointer-events:none; opacity:0;
  background:radial-gradient(circle,var(--brand-glow,rgba(var(--secu-orange-rgb),.33)) 0%,transparent 70%);
}
.secu-node.is-on .secu-brand-glow{animation:secu-brand-glow 1.8s ease-in-out infinite}
.secu-brand{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
}
.secu-brand-img{
  width:88%; height:88%; object-fit:contain;
  filter:drop-shadow(0 4px 16px rgba(0,0,0,.7));
}
.secu-brand.is-swap{animation:secu-brand-swap .32s var(--sx-ease) 1}

.secu-benefits{
  display:flex; flex-wrap:wrap; justify-content:center; gap:12px 48px; margin-top:48px;
}
@media (max-width:1279.98px){ .secu-benefits{gap:12px 24px; margin-top:32px} }
.secu-benefit{display:flex; align-items:center; gap:8px}
.secu-benefit-dot{width:5px; height:5px; border-radius:50%; flex-shrink:0; background:linear-gradient(135deg,var(--sx-cyan),#9869FF)}
.secu-benefit-text{
  font-family:var(--sx-font-title); font-weight:400; font-size:15px;
  color:rgba(255,255,255,.5); white-space:nowrap;
}
@media (max-width:1279.98px){ .secu-benefit-text{font-size:14px} }
.secu-levels{display:inline-flex; align-items:center; gap:3px; flex-shrink:0}
.secu-levels img{width:20px; height:20px; display:block; filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}
@media (max-width:1279.98px){ .secu-levels img{width:18px; height:18px} }

@keyframes secu-ring-pulse{
  0%,100%{transform:scale(1); opacity:.18}
  50%{transform:scale(1.14); opacity:.45}
}
@keyframes secu-conn-light{
  0%{transform:translateX(-110%)}
  73%,100%{transform:translateX(210%)}
}
@keyframes secu-charge{
  0%,100%{transform:scale(1); opacity:.5}
  50%{transform:scale(1.35); opacity:1}
}
@keyframes secu-ripple{
  0%{transform:scale(1); opacity:.8}
  100%{transform:scale(2.4); opacity:0}
}
@keyframes secu-impact-bump{
  0%{transform:scale(1)} 45%{transform:scale(1.18)} 100%{transform:scale(1)}
}
@keyframes secu-particle-right{
  0%{left:0; opacity:0} 15%{opacity:1} 80%{opacity:1} 100%{left:100%; opacity:0}
}
@keyframes secu-particle-left{
  0%{right:0; opacity:0} 15%{opacity:1} 80%{opacity:1} 100%{right:100%; opacity:0}
}
@keyframes secu-coin-float{
  0%,100%{transform:translateY(0) rotate(-2deg)}
  50%{transform:translateY(-11px) rotate(2deg)}
}
@keyframes secu-orbit-spin{ from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
@keyframes secu-orbit-pulse{
  0%,100%{opacity:.3; transform:scale(.7)}
  50%{opacity:1; transform:scale(1.4)}
}
@keyframes secu-glow-deep{
  0%,100%{opacity:.4; transform:scale(.95)}
  50%{opacity:.85; transform:scale(1.35)}
}
@keyframes secu-glow-inner{
  0%,100%{opacity:.6} 50%{opacity:1}
}
@keyframes secu-coin-entra{
  0%  {opacity:0; transform:scale(.25)}
  25% {opacity:1}
  70% {transform:scale(1.08)}
  100%{opacity:1; transform:scale(1)}
}
@keyframes secu-coin-giro{ from{transform:rotateY(0)} to{transform:rotateY(360deg)} }
@keyframes secu-coin-canto{
  0%,21%   {opacity:0}
  25%      {opacity:1}
  29%,71%  {opacity:0}
  75%      {opacity:1}
  79%,100% {opacity:0}
}
@keyframes secu-coin-luz{
  0%      {opacity:.85}
  20%,30% {opacity:0}
  50%     {opacity:.85}
  70%,80% {opacity:0}
  100%    {opacity:.85}
}
@keyframes secu-coin-shadow{
  0%,100%{opacity:.25; transform:translateX(-50%) scaleX(1)}
  50%{opacity:.12; transform:translateX(-50%) scaleX(.82)}
}
@keyframes secu-badge-pop{
  0%{transform:scale(0) translateY(8px)} 60%{transform:scale(1.08) translateY(0)} 100%{transform:scale(1) translateY(0)}
}
@keyframes secu-float{
  0%{opacity:0; transform:translateY(0)}
  3%{opacity:1}
  20%{opacity:1; transform:translateY(-34px)}
  26%{opacity:0; transform:translateY(-50px)}
  100%{opacity:0; transform:translateY(-50px)}
}
@keyframes secu-brand-glow{
  0%,100%{opacity:.2; transform:scale(1)}
  50%{opacity:.45; transform:scale(1.22)}
}
@keyframes secu-brand-swap{
  0%{opacity:0; transform:scale(.4) translateY(12px)}
  100%{opacity:1; transform:scale(1) translateY(0)}
}

@media (prefers-reduced-motion:reduce){
  .secu-node .secu-orb > *,
  .secu-node-label{opacity:1!important; transform:none!important}
  .secu-conn-fill{transform:scaleX(1)!important; opacity:1!important}
  .secu-badge{opacity:1!important; transform:none!important}
  .secu-particle{display:none!important}
  .secu-anim--mobile .secu-node{display:flex!important}
  .secu-dot.is-lit{background:rgba(255,255,255,.3)}
}

.testi{
  --testi-bg:#080815;
  --testi-card-w:300px;
  --testi-card-h:420px;

  position:relative;
  background:var(--testi-bg);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:48px 0 0;
}

.testi-halo{position:absolute;inset:0;pointer-events:none;z-index:0}
.testi-halo--left{
  background:radial-gradient(ellipse 80% 40% at 50% 10%, rgba(var(--sx-blue-rgb),.18) 0%, transparent 70%);
}
.testi-halo--right{
  background:radial-gradient(ellipse 55% 65% at 78% 55%, rgba(111,46,255,.12) 0%, transparent 70%);
}

.testi-left{
  position:relative;
  z-index:10;
  width:100%;
  flex-shrink:0;
  padding:0 24px 36px;
}
.testi-title{
  font-family:var(--sx-font-title);
  font-weight:700;
  color:var(--sx-white);
  line-height:.9;
  letter-spacing:-.03em;
  font-size:clamp(3.2rem, 14vw, 5rem);
  margin:0 0 16px;
}
.testi-lead{
  font-family:var(--sx-font-title);
  font-weight:300;
  color:var(--sx-white);
  line-height:1.4;
  font-size:17px;
  max-width:340px;
  margin:0 0 24px;
}

.testi-rating{
  display:inline-flex;
  align-items:center;
  gap:14px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  border-radius:18px;
  padding:12px 20px 12px 12px;
}
.testi-rating__logo{
  width:48px;height:48px;
  flex-shrink:0;
  border-radius:12px;
  overflow:hidden;
  background:var(--sx-white);
  display:flex;align-items:center;justify-content:center;
}
.testi-rating__logo img{width:36px;height:36px;object-fit:contain}
.testi-rating__divider{width:1px;height:32px;background:rgba(255,255,255,.12)}
.testi-rating__meta{display:flex;flex-direction:column}
.testi-rating__score{
  font-family:var(--sx-font-title);
  font-weight:700;
  font-size:18px;
  color:var(--sx-white);
  line-height:1.2;
  margin:0;
  display:inline-flex;align-items:center;gap:5px;
}
.testi-rating__score .testi-star{width:15px;height:15px;color:var(--sx-white)}
.testi-rating__count{
  font-family:var(--sx-font-title);
  font-weight:300;
  font-size:12px;
  color:#fff;
  margin:0;
}

.testi-right{width:100%;padding-bottom:40px}
.testi-track{
  position:relative;
  width:100%;
  height:var(--testi-card-h);
  overflow:visible;
  cursor:grab;
  touch-action:pan-y;
  transform-style:preserve-3d;
  user-select:none;
  -webkit-user-select:none;
}
.testi-track--grabbing{cursor:grabbing}

.testi-card{
  position:absolute;
  top:50%;
  left:0;
  margin-top:calc(var(--testi-card-h) / -2);
  width:var(--testi-card-w);
  height:var(--testi-card-h);
  padding:30px 26px;
  border-radius:var(--sx-r-card);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  transform-origin:center 85%;
  pointer-events:none;
  user-select:none;
  will-change:transform,opacity;
  color:var(--sx-white);
}
.testi-stars{
  display:flex;
  gap:3px;
  margin-bottom:22px;
  color:rgba(255,255,255,.85);
}
.testi-star{display:block;width:14px;height:14px}
.testi-quote{
  font-family:var(--sx-font-title);
  font-weight:300;
  font-size:19px;
  line-height:1.5;
  margin:0;
  color:var(--sx-white);
}
.testi-card__footer{
  border-top:1px solid rgba(255,255,255,.12);
  padding-top:16px;
}
.testi-name{
  font-family:var(--sx-font-title);
  font-weight:600;
  font-size:14px;
  margin:0 0 2px;
  color:var(--sx-white);
}
.testi-role{
  font-family:var(--sx-font-title);
  font-weight:300;
  font-size:12px;
  margin:0;
  color:#fff;
}

.testi-card--dark{color:#080815}
.testi-card--dark .testi-stars{color:rgba(8,8,21,.75)}
.testi-card--dark .testi-quote,
.testi-card--dark .testi-name{color:#080815}
.testi-card--dark .testi-role{color:rgba(8,8,21,.72)}
.testi-card--dark .testi-card__footer{border-top-color:rgba(8,8,21,.12)}

@media (min-width:768px){
  .testi{padding:60px 0 0}
  .testi-left{padding:0 40px 40px}
  .testi-title{font-size:clamp(4rem, 8vw, 6rem);margin:0 0 24px}
  .testi-lead{font-size:19px}
}

@media (min-width:1280px){
  .testi{
    flex-direction:row;
    align-items:center;
    height:820px;
    padding:0;
  }
  .testi-halo--left{
    background:radial-gradient(ellipse 38% 60% at 12% 50%, rgba(var(--sx-blue-rgb),.18) 0%, transparent 70%);
  }
  .testi{max-width:1920px;margin:0 auto;width:100%}
  .testi-left{width:420px;padding:0 0 0 60px}
  .testi-title{font-size:clamp(4.8rem, 7vw, 100px)}
  .testi-lead{font-size:22px}
  .testi-right{flex:1 1 auto;min-width:0;padding-bottom:0}
}

.promo{ padding:clamp(28px,5vw,56px) 0; background:var(--sx-white); }
.promo-wrap{ max-width:1240px; margin:0 auto; padding:0 24px; }

.promo-carousel{ position:relative; overflow:hidden; border-radius:26px; box-shadow:0 18px 46px rgba(10,22,40,.28); }
.promo-track{ display:flex; transition:transform .6s cubic-bezier(.16,1,.3,1); }

.promo-slide{
  flex:0 0 100%;
  position:relative; overflow:hidden;
  display:flex; align-items:center;
  min-height:clamp(196px,23vw,248px);
  padding:clamp(30px,4vw,52px);
  text-decoration:none;
  background-color:#0A1628;
}
.promo-slide::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:var(--promo-bg);
  background-repeat:no-repeat;
  background-position:var(--promo-bg-pos, center right);
  background-size:cover;
  transform:scale(1.06);
}
.promo-slide::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(90deg, rgba(8,17,33,.9) 0%, rgba(8,17,33,.55) 38%, rgba(8,17,33,0) 66%);
}
.promo-slide.is-live::before{ animation:promo-pan 22s ease-in-out infinite alternate; }
@keyframes promo-pan{
  0%  { transform:scale(1.06) translateX(1.6%);  }
  100%{ transform:scale(1.06) translateX(-1.6%); }
}

.promo-inner{ position:relative; z-index:2; max-width:60%; }

.promo-slide--sorteo{
  background-color:#070D24;
  --promo-bg:url("../imagenes/inicio/promo-bg-sorteo.webp");
}
.promo-slide--sorteo::before{
  background-size:contain;
  background-position:right center;
  transform:none;
}
.promo-slide--sorteo::after{
  background:linear-gradient(90deg, rgba(7,13,36,.95) 0%, rgba(7,13,36,.88) 30%, rgba(7,13,36,.45) 52%, rgba(7,13,36,0) 70%);
}
.promo-inner--sorteo{ max-width:64%; }
.promo-badge--live{ gap:9px; padding-left:9px; }
.promo-badge--live .sx-vivo{ color:#fff; }
.promo-ig{ flex-shrink:0; display:block; border-radius:5px; }
.promo-title--sorteo{ font-size:clamp(23px,3.1vw,40px); margin-bottom:12px; }
.promo-sorteo-sub{
  font-family:var(--sx-font-body); font-weight:400;
  font-size:clamp(13px,1.35vw,15px); line-height:1.5;
  color:rgba(255,255,255,.72); margin:0 0 clamp(16px,2vw,22px); max-width:46ch;
}
.promo-slide--sorteo .promo-btn--sorteo{
  background:linear-gradient(100deg,#2F6BFF,#7B3FE4); color:#fff;
  box-shadow:0 8px 26px rgba(93,63,228,.45);
}
.promo-slide--sorteo:hover .promo-btn--sorteo{ box-shadow:0 12px 32px rgba(93,63,228,.6); }

.promo-badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:7px 15px; margin-bottom:16px; border-radius:var(--sx-r-pill);
  background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.18);
  color:#fff; font-family:var(--sx-font-body); font-weight:700;
  font-size:12px; text-transform:uppercase; letter-spacing:.07em;
}
.promo-dot2{ width:8px; height:8px; border-radius:50%; background:#35DEC4; box-shadow:0 0 0 4px rgba(53,222,196,.22); flex-shrink:0; }
.promo-dot2--pink{ background:#FF5FD1; box-shadow:0 0 0 4px rgba(255,95,209,.22); }

.promo-eyebrow{
  font-family:var(--sx-font-body); font-weight:600;
  font-size:clamp(14px,1.5vw,17px); color:#fff; margin:0 0 6px;
}
.promo-eyebrow--pink{ color:#FBC2EC; }
.promo-eyebrow--biz{ color:#7FD3FF; font-weight:700; letter-spacing:.02em; }

.promo-title{
  font-family:var(--sx-font-title); font-weight:800;
  font-size:clamp(26px,3.6vw,46px); line-height:1.04; letter-spacing:-.015em;
  color:#fff; margin:0 0 clamp(18px,2.4vw,26px);
}
.promo-grad{ background:linear-gradient(100deg,var(--sx-cyan),#1077FD); -webkit-background-clip:text; background-clip:text; color:transparent; }
.promo-grad--pink{ background:linear-gradient(100deg,var(--sx-cyan) 0%,#B06BFF 45%,#FF5FD1 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.promo-grad--gold{ background:linear-gradient(100deg,#FFB347 0%,#FF6B35 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.promo-grad--sky{ background:linear-gradient(var(--sx-cyan),var(--sx-cyan)); -webkit-background-clip:text; background-clip:text; color:transparent; }

.promo-btn{
  display:inline-flex; align-items:center; gap:9px;
  padding:14px clamp(22px,2.4vw,28px); border-radius:var(--sx-r-pill);
  background:#fff; color:#0A1628; white-space:nowrap;
  font-family:var(--sx-font-body); font-weight:700; font-size:clamp(15px,1.5vw,17px);
  box-shadow:0 6px 20px rgba(0,0,0,.25);
  transition:transform .2s var(--sx-ease), box-shadow .2s var(--sx-ease);
}
.promo-btn svg{ transition:transform .2s var(--sx-ease); }
.promo-slide:hover .promo-btn{ transform:translateY(-2px); box-shadow:0 10px 28px rgba(var(--sx-cyan-rgb),.32); }
.promo-slide:hover .promo-btn svg{ transform:translateX(3px); }
.promo-slide:active .promo-btn{ transform:translateY(0) scale(.98); }

.promo-dots{ display:flex; justify-content:center; gap:16px; margin-top:16px; }
.promo-dot{
  width:9px; height:9px; padding:0; border:0; cursor:pointer;
  position:relative;
  border-radius:var(--sx-r-pill); background:var(--sx-gris-0);
  transition:width .25s var(--sx-ease), background .25s var(--sx-ease);
}
.promo-dot::before{ content:""; position:absolute; inset:-15px -8px -20px; }
.promo-dot.is-active{ width:28px; background:var(--sx-blue); }
.promo-dots:empty{ display:none; }

.promo-slide--app{
  --promo-bg:url("../imagenes/inicio/promo-bg-app.webp");
  --promo-bg-pos:center;
  overflow:hidden;
  min-height:0;
  padding-top:28px; padding-bottom:28px;
}
.promo-slide--app::after{
  background:linear-gradient(90deg, rgba(1,40,145,.86) 0%, rgba(1,46,155,.66) 46%, rgba(1,52,168,.28) 62%, rgba(1,58,178,0) 76%);
}
.promo-inner--app{ max-width:58%; }
.promo-title--app{ text-shadow:0 2px 10px rgba(0,18,70,.3); }
.promo-slide--app .promo-app-sub{ color:#fff; text-shadow:0 1px 4px rgba(0,18,70,.35); }
.promo-slide--app .promo-qr-txt span{ color:rgba(255,255,255,.88); }
.promo-title--app{ font-size:clamp(24px,2.9vw,38px); margin:0; }
.promo-app-sub{
  font-family:var(--sx-font-body); font-weight:400;
  font-size:clamp(14px,1.35vw,15px); line-height:1.45;
  color:rgba(255,255,255,.82); margin:8px 0 0; max-width:34ch;
}

.promo-brands{ margin-top:20px; }
.promo-brands-row{ display:flex; align-items:center; gap:11px; flex-wrap:wrap; }
.promo-brand{
  width:50px; height:50px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
}
.promo-brand img{ width:50px; height:50px; border-radius:50%; display:block; box-shadow:0 5px 14px rgba(0,0,0,.28); }
.promo-brands-more{
  font-family:var(--sx-font-body); font-weight:600; font-size:14px;
  color:rgba(255,255,255,.85); margin-left:4px;
}

.promo-qr{ display:flex; align-items:center; gap:15px; margin-top:16px; }
.promo-qr img{
  width:110px; height:110px; flex-shrink:0;
  background:#fff; padding:8px; border-radius:14px;
  box-shadow:0 12px 30px rgba(0,0,0,.34);
}
.promo-qr-txt{ display:flex; flex-direction:column; gap:2px; }
.promo-qr-txt strong{ font-family:var(--sx-font-body); font-weight:700; font-size:15px; color:#fff; }
.promo-qr-txt span{ font-family:var(--sx-font-body); font-weight:400; font-size:13px; color:rgba(255,255,255,.68); }

.promo-dl-btn{ display:none; margin-top:18px; text-decoration:none; }

.promo-phone{
  position:absolute; z-index:2;
  top:18px; right:clamp(30px,6.5vw,104px);
  width:clamp(190px,17vw,222px);
}
.promo-phone::before{
  content:""; position:absolute; inset:-15% -16%; z-index:-1;
  background:radial-gradient(circle at 50% 42%, rgba(var(--sx-cyan-rgb),.46), rgba(var(--sx-cyan-rgb),0) 60%);
  filter:blur(16px);
}
.promo-phone-frame{
  position:relative;
  padding:3px;
  border-radius:34px 34px 0 0;
  background:linear-gradient(125deg,
    #c2c5cd 0%, #6b6e76 6%, #303237 12%, #101114 26%,
    #0a0b0d 50%, #101114 74%, #303237 88%, #7e8189 94%, #c8cbd3 100%);
  box-shadow:0 50px 84px rgba(0,0,0,.5);
}
.promo-phone-screen{
  position:relative;
  padding:5px 5px 0;
  border-radius:31px 31px 0 0;
  background:#050506;
  overflow:hidden;
}
.promo-phone-img{
  display:block; width:100%; height:auto;
  border-radius:26px 26px 0 0; background:#fff;
}
.promo-phone-island{
  position:absolute; z-index:4;
  top:16px; left:50%; transform:translateX(-50%);
  width:31%; height:19px; border-radius:11px;
  background:#000; box-shadow:0 0 0 1px rgba(20,20,22,.9);
}
.promo-phone-screen::after{
  content:""; position:absolute; inset:5px 5px 0; z-index:3;
  border-radius:26px 26px 0 0;
  background:linear-gradient(120deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,.03) 26%, rgba(255,255,255,0) 48%);
  pointer-events:none;
}
.pbtn{ position:absolute; z-index:0; background:linear-gradient(90deg,#33353b,#1a1b1f); }
.pbtn-a { left:-2px; top:22%; width:3px; height:5%;  border-radius:2px 0 0 2px; }
.pbtn-vu{ left:-2px; top:31%; width:3px; height:8%;  border-radius:2px 0 0 2px; }
.pbtn-vd{ left:-2px; top:41%; width:3px; height:8%;  border-radius:2px 0 0 2px; }
.pbtn-pw{ right:-2px; top:33%; width:3px; height:11%; border-radius:0 2px 2px 0;
          background:linear-gradient(270deg,#33353b,#1a1b1f); }

.promo-slide--biz{
  --promo-bg:url("../imagenes/inicio/promo-bg-biz.webp");
  --promo-bg-pos:center;
  overflow:hidden;
  min-height:0;
  padding-top:30px; padding-bottom:30px;
}
.promo-inner--biz{ max-width:60%; }
.promo-biz-logo{ height:38px; width:auto; display:block; margin-bottom:16px; }
.promo-biz-btn{ margin-top:20px; text-decoration:none; }
.promo-biz-art{
  position:absolute; z-index:1;
  right:clamp(28px,6vw,116px); top:50%; transform:translateY(-50%);
  pointer-events:none;
}
.iso-seal{
  position:relative;
  width:clamp(148px,16vw,192px); height:clamp(148px,16vw,192px); border-radius:50%;
  background:conic-gradient(from 210deg, #9FE4FF, #1077FD, #004CAE, var(--sx-cyan), #1077FD, #9FE4FF);
  box-shadow:0 22px 55px rgba(var(--sx-blue-rgb),.35);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; gap:1px;
}
.iso-seal::after{
  content:""; position:absolute; inset:7px; border-radius:50%;
  background:radial-gradient(circle at 50% 34%, #0e2145, #060f22 78%);
  border:1.5px solid rgba(var(--sx-cyan-rgb),.5);
  z-index:0;
}
.iso-seal-top, .iso-seal-main, .iso-seal-num, .iso-seal-bot{ position:relative; z-index:1; }
.iso-seal-top{ font-family:var(--sx-font-body); font-size:clamp(8px,.75vw,10px); font-weight:700; letter-spacing:.18em; color:#7FD3FF; }
.iso-seal-main{ font-family:var(--sx-font-title); font-size:clamp(30px,3.4vw,40px); font-weight:800; color:#fff; line-height:1; letter-spacing:.02em; }
.iso-seal-num{ font-family:var(--sx-font-body); font-size:clamp(12px,1.3vw,15px); font-weight:700; color:var(--sx-cyan); letter-spacing:.04em; }
.iso-seal-bot{ font-family:var(--sx-font-body); font-size:clamp(8px,.75vw,10px); font-weight:700; letter-spacing:.14em; color:#7FD3FF; margin-top:2px; }

.bizmodal{
  position:fixed; inset:0; z-index:1300;
  display:flex; align-items:center; justify-content:center; padding:24px;
}
.bizmodal[hidden]{ display:none; }
.bizmodal-backdrop{
  position:absolute; inset:0; background:rgba(8,16,32,.66);
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
}
.bizmodal-dialog{
  position:relative; z-index:1; width:100%; max-width:420px;
  background:#fff; border-radius:24px; padding:28px 24px 24px;
  box-shadow:0 32px 80px rgba(0,0,0,.4);
  animation:bizmodal-in .3s cubic-bezier(0.165,0.84,0.44,1);
}
@keyframes bizmodal-in{ from{opacity:0; transform:translateY(16px) scale(.97)} to{opacity:1; transform:none} }
@media (prefers-reduced-motion:reduce){ .bizmodal-dialog{ animation:none; } }
.bizmodal-close{
  position:absolute; top:16px; right:16px;
  width:34px; height:34px; border-radius:50%;
  background:#F3F4F6; color:#6B7280;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition:background .2s ease;
}
.bizmodal-close:hover{ background:#E5E7EB; }
.bizmodal-title{ font-family:var(--sx-font-title); font-weight:700; font-size:22px; color:#111827; margin:0 4px 4px 0; letter-spacing:-.01em; }
.bizmodal-sub{ font-family:var(--sx-font-body); font-size:14px; color:#6B7280; margin:0 0 20px; }
.bizcard{
  display:flex; align-items:center; gap:14px;
  padding:14px 16px; margin-top:12px;
  border:1.5px solid #E8ECF1; border-radius:16px;
  text-decoration:none;
  transition:border-color .2s ease, box-shadow .2s ease, transform .12s ease;
}
.bizcard:hover{ border-color:#BBF7D0; box-shadow:0 8px 22px rgba(16,121,57,.12); transform:translateY(-1px); }
.bizcard-avatar{
  flex-shrink:0; width:52px; height:52px; border-radius:50%;
  background:#CCF8DE; color:#0F7839;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--sx-font-title); font-weight:700; font-size:22px;
}
.bizcard-info{ flex:1; display:flex; flex-direction:column; }
.bizcard-info strong{ font-family:var(--sx-font-body); font-weight:700; font-size:17px; color:#111827; }
.bizcard-info span{ font-family:var(--sx-font-body); font-size:14px; color:var(--sx-text-muted); }
.bizcard-chevron{ color:#9CA3AF; flex-shrink:0; }

@media (max-width:820px){
  .promo-inner{ max-width:82%; }
  .promo-inner--biz{ max-width:66%; }
  .promo-inner--sorteo{ max-width:74%; }
  .iso-seal{ width:clamp(120px,15vw,150px); height:clamp(120px,15vw,150px); }
}
@media (max-width:560px){
  .promo-slide{ min-height:0; padding:26px 22px; }
  .promo-inner{ max-width:100%; }
  .promo-slide::after{ background:linear-gradient(90deg, rgba(8,17,33,.92) 0%, rgba(8,17,33,.55) 100%); }
  .promo-slide--sorteo::before{ background-size:cover; background-position:center right; }
  .promo-slide--sorteo::after{
    background:linear-gradient(160deg, rgba(7,13,36,.92) 0%, rgba(7,13,36,.84) 55%, rgba(7,13,36,.66) 100%);
  }
  .promo-btn{ width:100%; justify-content:center; }
}

@media (max-width:920px){
  .promo-inner--app{ max-width:58%; }
  .promo-phone{ width:clamp(140px,19vw,178px); right:clamp(14px,2vw,32px); }
}
@media (max-width:720px){
  .promo-qr{ display:none; }
  .promo-dl-btn{ display:inline-flex; }
}
@media (max-width:600px){
  .promo-inner--app{ max-width:100%; }
  .promo-phone{ display:none; }
  .promo-inner--biz{ max-width:100%; }
  .promo-biz-art{ display:none; }
}
@media (prefers-reduced-motion:reduce){
  .promo-track{ transition:none; }
  .promo-slide.is-live::before{ animation:none; }
}

.how{
  position:relative;
  overflow-x:clip;
  background:var(--sx-white);

  --how-cyan:var(--sx-cyan);
  --how-amber:#B45309;
  --how-sub:var(--sx-text-muted);
  --how-heading-sub:var(--sx-text-muted);
  --how-line-track:#F0F0F0;
  --how-line-grad:linear-gradient(180deg,var(--sx-blue),var(--how-cyan));
  --how-card-divider:#EEF2F7;
  --how-bank-now-bg:#F8FAFF;   --how-bank-now-bd:#E0EAFF;
  --how-bank-inter-bg:#FFFBF5; --how-bank-inter-bd:#FDE8C8;
  --how-card-shadow:0 2px 24px rgba(16,80,180,.08),0 0 0 1px rgba(var(--sx-blue-rgb),.07);
  --how-badge-shadow:0 4px 12px rgba(var(--sx-blue-rgb),.30);
}

.how-step--1,
.how-step--2{ --how-glow:var(--sx-blue); }
.how-step--3{ --how-glow:var(--how-cyan); }

.how-intro{ text-align:center; padding:60px 20px 48px; }
.how-intro h2{
  font-family:var(--sx-font-title); font-weight:700;
  line-height:1.05; letter-spacing:-.03em;
  font-size:clamp(2.4rem,4.5vw,64px);
  color:var(--sx-text); margin-bottom:20px;
}
.how-intro p{
  font-family:var(--sx-font-body); font-weight:300;
  font-size:22px; line-height:1.5;
  color:var(--how-heading-sub);
  max-width:560px; margin:0 auto;
}

.how-timeline{ position:relative; padding-bottom:40px; }

.how-line{ display:none; }
.how-line-fill{
  width:100%; height:0;
  background:var(--how-line-grad);
  border-radius:var(--sx-r-pill);
}

.how-step{ position:relative; padding:0 16px 60px; }
.how-grid{
  max-width:640px; margin:0 auto;
  background:var(--sx-white);
  border-radius:24px;
  box-shadow:var(--how-card-shadow);
  overflow:hidden;
  display:grid;
  grid-template-columns:1fr;
  grid-template-areas:"head" "media" "copy";
}

.how-dot{ display:none; }
.how-glow{ display:none; }
.how-numbg{ display:none; }

.how-head{
  grid-area:head;
  display:flex; align-items:center; gap:14px;
  padding:24px 24px 16px;
  border-bottom:1px solid var(--how-card-divider);
}
.how-badge{
  width:40px; height:40px; border-radius:12px; flex-shrink:0;
  background:var(--sx-grad-securex);
  display:flex; align-items:center; justify-content:center;
  box-shadow:var(--how-badge-shadow);
  font-family:var(--sx-font-title); font-weight:800; font-size:16px; color:var(--sx-white);
}
.how-title-step{
  font-family:var(--sx-font-title); font-weight:700;
  font-size:26px; color:var(--sx-text);
  line-height:1; letter-spacing:-.02em; margin:0;
}

.how-media{
  grid-area:media;
  position:relative; display:flex; align-items:center; justify-content:center;
  padding:28px 0 20px;
  background:radial-gradient(ellipse 80% 70% at 50% 50%,
            color-mix(in srgb,var(--how-glow) 7%,transparent) 0%,transparent 70%);
}
.how-ill{ position:relative; z-index:1; animation:how-float 5.5s ease-in-out infinite; }
.how-step--1 .how-ill{ animation-delay:0s; }
.how-step--2 .how-ill{ animation-delay:.7s; }
.how-step--3 .how-ill{ animation-delay:1.4s; }

@keyframes how-float{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-12px); } }

.how-copy{ grid-area:copy; padding:0 24px 28px; }
.how-desc{
  font-family:var(--sx-font-body); font-weight:400;
  font-size:17px; line-height:1.65; color:var(--sx-text); margin-bottom:8px;
}
.how-sub{
  font-family:var(--sx-font-body); font-weight:300;
  font-size:15px; line-height:1.5; color:var(--how-sub);
}

.how-banks{ margin-top:28px; display:flex; flex-direction:column; gap:12px; }
.how-bankrow{
  display:flex; align-items:center; gap:12px;
  border-radius:14px; padding:12px 16px; border:1.5px solid transparent;
}
.how-bankrow--now{   background:var(--how-bank-now-bg);   border-color:var(--how-bank-now-bd); }
.how-bankrow--inter{ background:var(--how-bank-inter-bg); border-color:var(--how-bank-inter-bd); }
.how-bankmeta{ min-width:130px; }
.how-banklabel{
  font-family:var(--sx-font-body); font-weight:600;
  font-size:13px; color:var(--sx-text); margin:0;
}
.how-banktime{
  display:inline-flex; align-items:center; gap:5px; margin-top:3px;
  font-family:var(--sx-font-body); font-weight:600; font-size:12px;
  color:var(--sx-blue-texto);
}
.how-banktime--amber{ color:var(--how-amber); }
.how-banktime svg{
  width:13px; height:13px; flex-shrink:0;
  fill:none; stroke:currentColor; stroke-width:1.3;
  stroke-linecap:round; stroke-linejoin:round;
}
.how-banklogos{ display:flex; gap:6px; }
.how-banklogos img{
  width:32px; height:32px; border-radius:50%; flex-shrink:0; display:block;
}

.how .sx-reveal.how-from-left,
.how .sx-reveal.how-from-right{ transform:translateY(24px); }
.how .sx-reveal.how-from-left.is-visible,
.how .sx-reveal.how-from-right.is-visible{ transform:none; }

.how-bankrow .how-banklogos img{
  opacity:0; transform:scale(.55);
  transition:opacity .32s var(--sx-ease),transform .32s var(--sx-ease);
}
.how-bankrow.is-visible .how-banklogos img{ opacity:1; transform:none; }
.how-bankrow.is-visible .how-banklogos img:nth-child(1){ transition-delay:.06s; }
.how-bankrow.is-visible .how-banklogos img:nth-child(2){ transition-delay:.13s; }
.how-bankrow.is-visible .how-banklogos img:nth-child(3){ transition-delay:.20s; }
.how-bankrow.is-visible .how-banklogos img:nth-child(4){ transition-delay:.27s; }

@media (min-width:768px){
  .how-intro{ padding:80px 40px 64px; }
  .how-timeline{ padding-bottom:60px; }
  .how-step{ padding-bottom:72px; }
}

@media (min-width:1280px){
  .how-intro{ padding:100px 40px 80px; }
  .how-timeline{ padding-bottom:100px; }

  .how-line{
    display:block; position:absolute; left:49px; top:0; bottom:0; width:2px;
    background:var(--how-line-track);
  }

  .how-step{ max-width:1160px; margin:0 auto; padding:0 40px 100px 120px; }

  .how-grid{
    max-width:none; margin:0; background:none; border-radius:0;
    box-shadow:none; overflow:visible;
    grid-template-columns:1fr 1fr;
    gap:0 clamp(40px,6vw,100px);
    align-items:center;
  }
  .how-step--left  .how-grid{ grid-template-areas:"media head" "media copy"; }
  .how-step--right .how-grid{ grid-template-areas:"head media" "copy media"; }

  .how-dot{
    display:block; position:absolute; left:39px; top:40px;
    width:22px; height:22px; border-radius:50%;
    background:var(--sx-white); border:3px solid var(--how-glow);
    box-shadow:0 0 0 6px color-mix(in srgb,var(--how-glow) 12%,transparent);
    z-index:2;
  }
  .how-dot::after{
    content:""; position:absolute; inset:4px; border-radius:50%;
    background:var(--how-glow);
  }

  .how-media{ padding:0; background:none; }
  .how-glow{
    display:block; position:absolute; width:380px; height:380px; border-radius:50%;
    background:radial-gradient(circle,
              color-mix(in srgb,var(--how-glow) 16%,transparent) 0%,transparent 70%);
    filter:blur(50px);
  }

  .how-head{
    position:relative; display:block; padding:0; border-bottom:0;
  }
  .how-badge{ display:none; }
  .how-numbg{
    display:block; position:absolute; top:-20px; left:-10px;
    font-family:var(--sx-font-title); font-weight:800;
    font-size:clamp(6rem,10vw,140px);
    color:var(--sx-blue-texto); opacity:.14; line-height:1; letter-spacing:-.04em;
    user-select:none; pointer-events:none;
  }
  .how-title-step{
    position:relative;
    font-size:clamp(2rem,3.8vw,56px);
    letter-spacing:-.03em; margin-bottom:20px;
  }

  .how-copy{ padding:0; }
  .how-desc{ font-size:clamp(1rem,1.3vw,20px); line-height:1.6; margin-bottom:12px; }
  .how-sub{ font-size:clamp(.85rem,1vw,17px); }

  .how .sx-reveal.how-from-left{ transform:translateX(-48px); }
  .how .sx-reveal.how-from-right{ transform:translateX(48px); }
  .how .sx-reveal.how-from-left.is-visible,
  .how .sx-reveal.how-from-right.is-visible{ transform:none; }

  .how-dot.sx-reveal{ transform:scale(.4); }
  .how-dot.sx-reveal.is-visible{ transform:none; }
}

@media (prefers-reduced-motion:reduce){
  .how .sx-reveal.how-from-left,
  .how .sx-reveal.how-from-right,
  .how-dot.sx-reveal{ transform:none !important; opacity:1; }
  .how-bankrow .how-banklogos img{ opacity:1; transform:none; }
  .how-ill{ animation:none; }
}

.comp-section{
  --comp-blue-rgb:16,119,253;
  --comp-cyan:var(--sx-cyan);
  --comp-shadow-rgb:16,80,180;
  --comp-green:#22C55E;
  --comp-red:#EF4444;
  --comp-amber:#F59E0B;
  --comp-muted:var(--sx-text-muted);
  --comp-muted-2:var(--sx-text-muted);
  --comp-ink-2:#374151;
  --comp-line:#EEF2F7;
  --comp-line-2:#F3F4F6;
  --comp-head-a:#FAFCFF;
  --comp-head-b:#F7FAFF;

  position:relative;
  overflow:hidden;
  background:var(--sx-white);
  padding:96px 0 92px;
  font-family:var(--sx-font-title);
}

.comp-orb{
  position:absolute;border-radius:50%;pointer-events:none;z-index:0;
}
.comp-orb--blue{
  top:-8%;left:-10%;width:560px;height:560px;
  background:radial-gradient(circle, rgba(var(--comp-blue-rgb),0.07) 0%, transparent 70%);
  filter:blur(64px);
  animation:comp-float-a 11s ease-in-out infinite;
}
.comp-orb--cyan{
  bottom:-12%;right:-8%;width:500px;height:500px;
  background:radial-gradient(circle, rgba(var(--sx-cyan-rgb),0.06) 0%, transparent 70%);
  filter:blur(60px);
  animation:comp-float-b 14s ease-in-out 2s infinite;
}
.comp-dotgrid{
  position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.04;
  background-image:radial-gradient(circle, rgba(var(--comp-blue-rgb),0.12) 1px, transparent 1px);
  background-size:28px 28px;
}
@keyframes comp-float-a{0%,100%{transform:translate(0,0)}50%{transform:translate(36px,-28px)}}
@keyframes comp-float-b{0%,100%{transform:translate(0,0)}50%{transform:translate(-30px,24px)}}

.comp-container{
  position:relative;z-index:1;
  max-width:1060px;margin:0 auto;padding:0 24px;
}

.comp-header{
  text-align:center;margin-bottom:56px;
  opacity:0;transform:translateY(24px);
  transition:opacity .6s var(--sx-ease), transform .6s var(--sx-ease);
}
.comp-section.is-in .comp-header{opacity:1;transform:none}
.comp-title{
  font-family:var(--sx-font-title);font-weight:700;line-height:1.05;letter-spacing:-0.03em;
  font-size:clamp(2rem,4vw,48px);color:var(--sx-text);margin-bottom:16px;
}
.comp-title-grad{
  background:linear-gradient(90deg, var(--sx-blue) 0%, var(--comp-cyan) 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.comp-subtitle{
  font-family:var(--sx-font-title);font-weight:300;font-size:18px;
  color:var(--comp-muted);line-height:1.65;max-width:520px;margin:0 auto;
}

.comp-table{
  display:none;
  background:var(--sx-white);
  border-radius:28px;
  overflow:hidden;
  box-shadow:
    0 0 0 1px rgba(var(--comp-blue-rgb),0.08),
    0 4px 20px rgba(var(--comp-shadow-rgb),0.07),
    0 24px 64px rgba(var(--comp-shadow-rgb),0.09);
  opacity:0;transform:translateY(48px);
  transition:opacity .7s var(--sx-ease) .06s, transform .7s var(--sx-ease) .06s;
}
.comp-section.is-in .comp-table{opacity:1;transform:none}

.comp-accent-track{position:relative;height:3px;background:var(--comp-head-b)}
.comp-accent-bar{
  position:absolute;right:0;top:0;height:100%;
  width:calc(100% / 5.05 * 1.1);
  background:linear-gradient(90deg, var(--sx-blue), var(--comp-cyan));
  transform:scaleX(0);transform-origin:right;
  transition:transform .8s var(--sx-ease) .4s;
}
.comp-section.is-in .comp-accent-bar{transform:scaleX(1)}

.comp-thead{
  display:grid;grid-template-columns:1.8fr 1fr 1.15fr 1.1fr;align-items:center;
  padding:20px 0 18px 28px;
  border-bottom:1px solid var(--comp-line);
  background:linear-gradient(180deg, var(--comp-head-a) 0%, var(--comp-head-b) 100%);
}
.comp-collabel{
  font-family:var(--sx-font-title);font-weight:600;font-size:12px;
  color:var(--comp-muted-2);text-transform:uppercase;letter-spacing:0.06em;
}

.comp-badge{
  display:flex;flex-direction:column;align-items:flex-start;gap:4px;
  opacity:0;transform:translateY(-8px) scale(.8);transform-origin:left center;
  transition:opacity .5s var(--sx-ease) .35s,
             transform .5s cubic-bezier(0.34,1.56,0.64,1) .35s;
}
.comp-section.is-in .comp-badge{opacity:1;transform:none}
.comp-badge-pill{
  position:relative;overflow:hidden;display:inline-flex;align-items:center;
  background:var(--sx-white);border-radius:var(--sx-r-pill);padding:8px 20px;
  box-shadow:0 2px 14px rgba(var(--comp-blue-rgb),0.16), 0 0 0 1.5px rgba(var(--comp-blue-rgb),0.14);
}
.comp-logo{display:block}
.comp-shimmer{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(105deg, transparent 30%, rgba(var(--comp-blue-rgb),0.08) 50%, transparent 70%);
  transform:translateX(-120%);
  animation:comp-shimmer 6.2s ease-in-out infinite;
}
@keyframes comp-shimmer{
  0%{transform:translateX(-120%)}
  35%{transform:translateX(220%)}
  100%{transform:translateX(220%)}
}
.comp-badge-note{
  font-family:var(--sx-font-title);font-weight:600;font-size:11px;
  color:var(--sx-blue-texto);letter-spacing:0.03em;padding-left:12px;
}

.comp-row{
  position:relative;
  display:grid;grid-template-columns:1.8fr 1fr 1.15fr 1.1fr;align-items:center;
  padding-left:28px;
  border-bottom:1px solid var(--comp-line);
  opacity:0;transform:translateX(-28px);
  transition:opacity .55s var(--sx-ease) calc(var(--i)*0.07s + 0.1s),
             transform .55s var(--sx-ease) calc(var(--i)*0.07s + 0.1s),
             background .2s ease;
}
.comp-row:last-child{border-bottom:none}
.comp-section.is-in .comp-row{opacity:1;transform:none}
.comp-row:hover{background:rgba(var(--comp-blue-rgb),0.018)}

.comp-accent-left{
  position:absolute;left:0;top:18%;bottom:18%;width:3px;border-radius:999px;
  background:linear-gradient(180deg, var(--sx-blue), var(--comp-cyan));
  opacity:0;transform:scaleY(.3);
  transition:opacity .16s ease, transform .16s ease;
}
.comp-row:hover .comp-accent-left{opacity:1;transform:scaleY(1)}

.comp-cell{display:flex;align-items:center}
.comp-cell--factor{padding:18px 0}
.comp-cell--factor span{
  font-family:var(--sx-font-title);font-size:15px;font-weight:500;color:var(--sx-text);
}
.comp-cell--comp{gap:7px;padding:18px 0}
.comp-txt{font-family:var(--sx-font-title);font-size:14px;font-weight:400;color:var(--comp-muted)}

.comp-cell--securex{
  align-self:stretch;padding:18px 20px;
  border-left:1px solid rgba(var(--comp-blue-rgb),0.10);
  background:rgba(var(--comp-blue-rgb),0.075);
  opacity:0;transform:translateX(16px);
  transition:opacity .5s var(--sx-ease) calc(var(--i)*0.07s + 0.28s),
             transform .5s var(--sx-ease) calc(var(--i)*0.07s + 0.28s),
             background .2s ease;
}
.comp-section.is-in .comp-cell--securex{opacity:1;transform:none}
.comp-row:first-child .comp-cell--securex{border-radius:0 12px 0 0}
.comp-row:last-child  .comp-cell--securex{border-radius:0 0 12px 0}
.comp-row:hover .comp-cell--securex{background:rgba(var(--comp-blue-rgb),0.13)}
.comp-securex-inner{
  display:flex;align-items:center;gap:7px;
  transition:transform .18s ease-out;
}
.comp-row:hover .comp-securex-inner{transform:translateX(3px)}
.comp-txt-sx{font-family:var(--sx-font-title);font-size:14px;font-weight:600;color:var(--sx-blue-texto)}

.comp-tfoot{
  text-align:center;padding:16px 28px 20px;
  border-top:1px solid var(--comp-line);
  background:linear-gradient(180deg, var(--comp-head-a) 0%, var(--comp-head-b) 100%);
  opacity:0;transition:opacity .5s ease .5s;
}
.comp-section.is-in .comp-tfoot{opacity:1}
.comp-tfoot p{font-family:var(--sx-font-title);font-weight:400;font-size:14px;color:var(--comp-muted)}
.comp-strong-blue{font-weight:700;color:var(--sx-blue-texto)}
.comp-strong-dark{font-weight:600;color:var(--comp-ink-2)}

.comp-ico{flex-shrink:0}
.comp-ico--check .comp-ico-c{fill:var(--comp-green);fill-opacity:.12;transform-box:fill-box;transform-origin:center}
.comp-ico--check .comp-ico-p{fill:none;stroke:var(--comp-green);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.comp-ico--x .comp-ico-bg{fill:var(--comp-red)}
.comp-ico--x .comp-ico-mark{stroke:var(--sx-white);stroke-width:1.8;stroke-linecap:round}
.comp-ico--n .comp-ico-bg{fill:var(--comp-amber)}
.comp-ico--n .comp-ico-mark{stroke:var(--sx-white);stroke-width:2;stroke-linecap:round}

.comp-ico--check .comp-ico-c{transform:scale(0);opacity:0}
.comp-ico--check .comp-ico-p{stroke-dasharray:14;stroke-dashoffset:14;opacity:0}
.comp-section.is-in .comp-ico--check .comp-ico-c{
  animation:comp-pop .3s var(--sx-ease) calc(var(--i,0)*0.06s + 0.2s) both;
}
.comp-section.is-in .comp-ico--check .comp-ico-p{
  animation:comp-draw .38s ease-out calc(var(--i,0)*0.06s + 0.32s) both;
}
@keyframes comp-pop{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes comp-draw{from{stroke-dashoffset:14;opacity:1}to{stroke-dashoffset:0;opacity:1}}

.comp-mobile{display:block}
.comp-mcard{
  background:var(--sx-white);border-radius:18px;overflow:hidden;margin-bottom:10px;
  box-shadow:0 2px 16px rgba(var(--comp-shadow-rgb),0.07), 0 0 0 1px rgba(var(--comp-blue-rgb),0.06);
  opacity:0;transform:translateY(44px) scale(.97);
  transition:opacity .55s var(--sx-ease) calc(var(--i)*0.08s),
             transform .55s var(--sx-ease) calc(var(--i)*0.08s);
}
.comp-section.is-in .comp-mcard{opacity:1;transform:none}
.comp-mcard-head{padding:14px 16px 12px;border-bottom:1px solid var(--comp-line)}
.comp-mcard-head p{font-family:var(--sx-font-title);font-weight:600;font-size:14px;color:var(--sx-text);margin:0}
.comp-mcard-body{padding-bottom:4px}
.comp-mrow{display:flex;align-items:center;justify-content:space-between;padding:10px 16px}
.comp-mrow--bordered{border-top:1px solid var(--comp-line-2)}
.comp-mrow-label{font-family:var(--sx-font-title);font-size:12px;font-weight:500;color:var(--comp-muted-2)}
.comp-mrow-val{display:flex;align-items:center;gap:6px}
.comp-mrow-val .comp-txt{font-size:13px}
.comp-mrow--securex{
  padding:12px 16px;
  background:linear-gradient(90deg, rgba(var(--comp-blue-rgb),0.06) 0%, rgba(var(--sx-cyan-rgb),0.04) 100%);
  border-top:1px solid rgba(var(--comp-blue-rgb),0.10);
}
.comp-mrow-label-sx{
  font-family:var(--sx-font-title);font-size:12px;font-weight:700;color:var(--sx-blue-texto);letter-spacing:0.02em;
}
.comp-mrow--securex .comp-txt-sx{font-size:13px;font-weight:700}
.comp-mnote{
  font-family:var(--sx-font-title);font-weight:300;font-size:14px;color:var(--comp-muted-2);
  text-align:center;margin-top:16px;
  opacity:0;transform:translateY(12px);
  transition:opacity .45s ease .3s, transform .45s ease .3s;
}
.comp-section.is-in .comp-mnote{opacity:1;transform:none}

@media (min-width:768px){
  .comp-table{display:block}
  .comp-mobile{display:none}
}

@media (prefers-reduced-motion:reduce){
  .comp-orb,.comp-shimmer{animation:none}
  .comp-header,.comp-table,.comp-row,.comp-cell--securex,
  .comp-badge,.comp-tfoot,.comp-mcard,.comp-mnote{opacity:1;transform:none}
  .comp-accent-bar{transform:scaleX(1)}
  .comp-ico--check .comp-ico-c{transform:none;opacity:1}
  .comp-ico--check .comp-ico-p{stroke-dashoffset:0;opacity:1}
}

.promopop {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.promopop[hidden] { display: none; }

.promopop-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(8, 16, 32, .66);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}

.promopop-dialog {
  position: relative;
  z-index: 1;
  width: auto;
  max-width: min(650px, 92vw);
  max-height: 88vh;
  animation: promopop-in .34s cubic-bezier(0.165, 0.84, 0.44, 1);
}
@keyframes promopop-in {
  from { opacity: 0; transform: translateY(18px) scale(.96); }
  to   { opacity: 1; transform: none; }
}

.promopop-link { display: block; line-height: 0; }

.promopop-img {
  display: block;
  width: auto;
  height: auto;
  max-width: min(650px, 92vw);
  max-height: 88vh;
  border-radius: 18px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .5);
}

.promopop-img--movil { display: none; }
@media (max-width: 640px) {
  .promopop-img { display: none; }
  .promopop-img--movil { display: block; }
}

.promopop-texto {
  margin: 0; padding: 48px 40px; text-align: center;
  font-family: var(--sx-font-title); font-size: clamp(18px, 4vw, 24px);
  line-height: 1.4; color: var(--sx-text);
}

.promopop-close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 2;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  background: none;
  color: var(--sx-cyan-medio);
  cursor: pointer;
  transition: transform .15s ease, opacity .2s ease;
}
.promopop-close::before {
  content: "";
  position: absolute;
  inset: -3px;
}
.promopop-close:hover { transform: scale(1.08); }
.promopop-close:active { opacity: .75; }

@media (max-width: 480px) {
  .promopop { padding: 16px; }
  .promopop-close { top: 8px; right: 8px; width: 34px; height: 34px; }
  .promopop-close svg { width: 34px; height: 34px; }
}

@media (prefers-reduced-motion: reduce) {
  .promopop-dialog { animation: none; }
}

.how-ill--cotiza, .how-ill--transfiere, .how-ill--recibe{ width:min(58vw,260px); }

.cotiza-esc{ position:relative; width:100%; aspect-ratio:26/25; }

.cotiza-fono{
  position:absolute; left:0; top:4%; width:56%; height:92%;
  background:var(--sx-white); border:2px solid var(--sx-blue);
  border-radius:22px; box-shadow:0 4px 24px rgba(15,23,41,.06);
}
.cotiza-notch{
  position:absolute; left:50%; top:5%; transform:translateX(-50%);
  width:34%; height:5%; border-radius:999px; border:1.5px solid var(--sx-blue);
}
.cotiza-vivo{
  position:absolute; left:12%; top:14%; width:30%; height:6%;
  border-radius:999px; background:var(--sx-blue-light);
  display:flex; align-items:center; justify-content:flex-start; padding-left:6%;
}
.cotiza-vivo i{
  width:5px; height:5px; border-radius:50%; background:#E85252;
  animation:cotiza-latido 1.6s ease-in-out infinite;
}
.cotiza-tabs{
  position:absolute; left:8%; top:24%; width:118%; height:10%;
  border-radius:999px; border:2px solid var(--sx-blue);
  background:var(--sx-white); overflow:hidden;
}
.cotiza-tabs-fill{
  position:absolute; inset:0 auto 0 0; width:50%;
  background:var(--sx-blue); border-radius:999px;
  animation:cotiza-toggle 7s cubic-bezier(0.16,1,0.3,1) infinite;
}
.cotiza-campo{
  position:absolute; left:8%; width:84%; height:15%;
  border-radius:12px; background:var(--sx-blue-light);
  display:flex; align-items:center; justify-content:space-between; padding:0 8%;
}
.cotiza-campo--envias { top:41%; }
.cotiza-campo--recibes{ top:60%; }
.cotiza-barra{
  height:6px; border-radius:999px; background:var(--sx-blue);
  animation:cotiza-monto 7s cubic-bezier(0.16,1,0.3,1) infinite;
}
.cotiza-campo--recibes .cotiza-barra{ animation-delay:.18s; }
.cotiza-disco{ width:22%; aspect-ratio:1; border-radius:50%; }
.cotiza-disco--usd{ background:var(--sx-blue-mid); }
.cotiza-disco--pen{ background:var(--sx-blue); }
.cotiza-swap{
  position:absolute; right:-7%; top:53%; width:20%; aspect-ratio:1;
  border-radius:12px; background:var(--sx-blue); color:var(--sx-white);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 18px rgba(var(--sx-blue-rgb),.35);
  animation:cotiza-swap 7s cubic-bezier(0.16,1,0.3,1) infinite;
}
.cotiza-swap svg{ width:58%; height:58%; }
.cotiza-cta{
  position:absolute; left:8%; top:80%; width:84%; height:11%;
  border-radius:999px; background:var(--sx-blue);
}
.cotiza-persona{
  position:absolute; right:-4%; bottom:0; width:44%; height:auto;
  z-index:2; pointer-events:none;
}

@keyframes cotiza-latido{ 0%,100%{opacity:1} 50%{opacity:.25} }
@keyframes cotiza-toggle{
  0%,38%   { transform:translateX(0); }
  50%,88%  { transform:translateX(100%); }
  100%     { transform:translateX(0); }
}
@keyframes cotiza-swap{
  0%,38%   { transform:rotate(0deg); }
  50%,88%  { transform:rotate(180deg); }
  100%     { transform:rotate(360deg); }
}
@keyframes cotiza-monto{
  0%,34%   { width:34%; }
  50%,84%  { width:52%; }
  100%     { width:34%; }
}

@media (prefers-reduced-motion:reduce){
  .cotiza-vivo i, .cotiza-tabs-fill, .cotiza-swap, .cotiza-barra{ animation:none; }
  .cotiza-barra{ width:42%; }
}

.transf-esc{ position:relative; width:100%; aspect-ratio:26/25; }

.transf-fono{
  position:absolute; left:0; top:4%; width:56%; height:92%;
  background:var(--sx-white); border:2px solid var(--sx-blue);
  border-radius:22px; box-shadow:0 4px 24px rgba(15,23,41,.06);
}
.transf-notch{
  position:absolute; left:50%; top:5%; transform:translateX(-50%);
  width:34%; height:5%; border-radius:999px; border:1.5px solid var(--sx-blue);
}
.transf-chip{
  position:absolute; left:12%; top:14%; width:38%; height:6%;
  border-radius:999px; background:var(--sx-blue-light);
}
.transf-monto{
  position:absolute; left:12%; top:24%; width:52%; height:9%;
  border-radius:8px; background:var(--sx-blue);
}
.transf-cuenta{
  position:absolute; left:8%; top:38%; width:84%; height:13%;
  border-radius:12px; background:var(--sx-blue-light);
  display:flex; align-items:center; justify-content:space-between; padding:0 7%;
}
.transf-barra{ width:44%; height:6px; border-radius:999px; background:var(--sx-blue); }
.transf-copiar{
  width:20%; aspect-ratio:1; border-radius:8px;
  background:var(--sx-blue); color:var(--sx-white);
  display:flex; align-items:center; justify-content:center;
  animation:transf-copiar 7s ease-in-out infinite;
}
.transf-copiar svg{ width:58%; height:58%; }
.transf-zona{
  position:absolute; left:8%; top:56%; width:84%; height:20%;
  border-radius:12px; border:2px dashed var(--sx-blue-mid); overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  animation:transf-zona 7s cubic-bezier(0.16,1,0.3,1) infinite;
}
.transf-voucher{
  width:46%; height:62%; border-radius:6px; background:var(--sx-blue-mid);
  animation:transf-voucher 7s cubic-bezier(0.16,1,0.3,1) infinite;
}
.transf-check{
  position:absolute; width:26%; height:26%; color:var(--sx-blue-texto);
  stroke-dasharray:30; stroke-dashoffset:30;
  animation:transf-check 7s ease-out infinite;
}
.transf-cta{
  position:absolute; left:8%; top:81%; width:84%; height:10%;
  border-radius:999px; background:var(--sx-blue);
}
.transf-persona{
  position:absolute; right:-2%; bottom:0; width:40%; height:auto;
  z-index:2; pointer-events:none;
}

@keyframes transf-copiar{
  0%,8%    { transform:scale(1);    box-shadow:0 0 0 0 rgba(var(--sx-blue-rgb),.45); }
  14%      { transform:scale(1.12); box-shadow:0 0 0 7px rgba(var(--sx-blue-rgb),0); }
  22%,100% { transform:scale(1);    box-shadow:0 0 0 0 rgba(var(--sx-blue-rgb),0); }
}
@keyframes transf-voucher{
  0%,24%   { transform:translateY(140%); opacity:0; }
  46%,88%  { transform:translateY(0);    opacity:1; }
  100%     { transform:translateY(140%); opacity:0; }
}
@keyframes transf-zona{
  0%,44%   { border-color:var(--sx-blue-mid); background:rgba(223,237,255,0); }
  56%,88%  { border-color:var(--sx-blue);     background:rgba(223,237,255,1); }
  100%     { border-color:var(--sx-blue-mid); background:rgba(223,237,255,0); }
}
@keyframes transf-check{
  0%,52%   { stroke-dashoffset:30; opacity:0; }
  58%      { opacity:1; }
  72%,88%  { stroke-dashoffset:0;  opacity:1; }
  100%     { stroke-dashoffset:30; opacity:0; }
}

.recibe-esc{ position:relative; width:100%; aspect-ratio:26/25; }

.recibe-fono{
  position:absolute; left:0; top:4%; width:56%; height:92%;
  background:var(--sx-white); border:2px solid var(--sx-blue);
  border-radius:22px; box-shadow:0 4px 24px rgba(15,23,41,.06);
}
.recibe-notch{
  position:absolute; left:50%; top:5%; transform:translateX(-50%);
  width:34%; height:5%; border-radius:999px; border:1.5px solid var(--sx-blue);
}
.recibe-ok{
  position:absolute; left:50%; top:14%; transform:translateX(-50%);
  width:26%; aspect-ratio:1; border-radius:50%;
  background:var(--sx-blue); color:var(--sx-white);
  display:flex; align-items:center; justify-content:center;
  animation:recibe-ok 7s cubic-bezier(0.16,1,0.3,1) infinite;
}
.recibe-ok svg{
  width:56%; height:56%;
  stroke-dasharray:30; stroke-dashoffset:30;
  animation:recibe-check 7s ease-out infinite;
}
.recibe-titulo{
  position:absolute; left:50%; top:35%; transform:translateX(-50%);
  width:46%; height:5%; border-radius:999px; background:var(--sx-blue-mid);
}
.recibe-monto{
  position:absolute; left:50%; top:43%; transform:translateX(-50%);
  height:9%; border-radius:8px; background:var(--sx-blue);
  animation:recibe-monto 7s cubic-bezier(0.16,1,0.3,1) infinite;
}
.recibe-cuenta{
  position:absolute; left:8%; top:57%; width:84%; height:13%;
  border-radius:12px; background:var(--sx-blue-light);
  display:flex; align-items:center; justify-content:space-between; padding:0 7%;
}
.recibe-barra{ width:46%; height:6px; border-radius:999px; background:var(--sx-blue); }
.recibe-disco{ width:20%; aspect-ratio:1; border-radius:50%; background:var(--sx-blue-mid); }
.recibe-luka{
  position:absolute; left:8%; top:75%; width:84%; height:12%;
  border-radius:12px; background:var(--sx-blue-light);
  display:flex; align-items:center; gap:8%; padding:0 7%;
}
.recibe-moneda{
  width:22%; height:auto;
  animation:recibe-moneda 7s cubic-bezier(0.16,1,0.3,1) infinite;
}
.recibe-barra--luka{ width:40%; background:var(--sx-blue-mid); }
.recibe-persona{
  position:absolute; right:-3%; bottom:0; width:42%; height:auto;
  z-index:2; pointer-events:none;
}
.recibe-vuela{
  position:absolute; right:22%; top:2%; width:13%; height:auto;
  z-index:3; pointer-events:none;
  animation:recibe-vuela 7s ease-in-out infinite;
}

@keyframes recibe-ok{
  0%,10%   { transform:translateX(-50%) scale(.4); opacity:0; }
  24%,92%  { transform:translateX(-50%) scale(1);  opacity:1; }
  100%     { transform:translateX(-50%) scale(.4); opacity:0; }
}
@keyframes recibe-check{
  0%,20%   { stroke-dashoffset:30; }
  40%,92%  { stroke-dashoffset:0; }
  100%     { stroke-dashoffset:30; }
}
@keyframes recibe-monto{
  0%,26%   { width:28%; opacity:.35; }
  46%,92%  { width:56%; opacity:1; }
  100%     { width:28%; opacity:.35; }
}
@keyframes recibe-moneda{
  0%,46%   { transform:scale(0);   opacity:0; }
  60%      { transform:scale(1.18);opacity:1; }
  68%,92%  { transform:scale(1);   opacity:1; }
  100%     { transform:scale(0);   opacity:0; }
}
@keyframes recibe-vuela{
  0%,44%   { transform:translateY(14px); opacity:0; }
  62%      { transform:translateY(-6px); opacity:1; }
  86%      { transform:translateY(-14px);opacity:1; }
  100%     { transform:translateY(-26px);opacity:0; }
}

@media (prefers-reduced-motion:reduce){
  .transf-copiar, .transf-zona, .transf-voucher, .transf-check,
  .recibe-ok, .recibe-ok svg, .recibe-monto, .recibe-moneda, .recibe-vuela{ animation:none; }
  .transf-voucher{ opacity:1; }
  .transf-check, .recibe-ok svg{ stroke-dashoffset:0; }
  .recibe-monto{ width:56%; }
  .recibe-vuela{ opacity:0; }
}

@media (min-width:1280px){
  .how-ill--cotiza, .how-ill--transfiere, .how-ill--recibe{ width:clamp(220px,26vw,360px); }
}