:root{
  --nexa-green:#0043A9;
  --nexa-green-dark:#0043A9;
  --nexa-coral:#ef7c63;
  --landing-blue:#0b48b9;
  --landing-ink:#070d1d;
  --landing-muted:#5d6678;
  --landing-soft:#f4f6fb;
  --landing-line:#e5eaf3;
  --landing-white:#fff;
  --landing-success:#22b663;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-width:320px;
  font-family:Roboto,"Segoe UI",Arial,sans-serif;
  color:var(--landing-ink);
  background:#fff;
  -webkit-font-smoothing:antialiased;
}
button,input{font:inherit}
button{touch-action:manipulation}

/* Header: ancho amplio como la referencia; el contenido principal usa un ancho menor. */
.landing-header{
  height:72px;
  background:#fff;
  border-bottom:1px solid var(--landing-line);
  position:sticky;
  top:0;
  z-index:20;
}
.landing-header__inner{
  width:min(1310px,calc(100% - 56px));
  height:100%;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.landing-brand{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--nexa-green-dark);
  text-decoration:none;
  font-weight:700;
  font-size:20px;
}
.landing-brand__mark{
  width:30px;
  height:30px;
  border-radius:9px;
  display:grid;
  place-items:center;
  color:#fff;
  font-weight:700;
  background:linear-gradient(135deg,var(--nexa-green),var(--nexa-coral));
}
.landing-menu{
  width:52px;
  min-height:52px;
  border:0;
  background:none;
  color:var(--nexa-green);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  cursor:pointer;
}
.landing-menu span{
  width:23px;
  height:3px;
  border-radius:3px;
  background:currentColor;
}
.landing-menu small{font-size:10px;font-weight:700;margin-top:2px}

/* Hero: la copia comienza aproximadamente donde lo hace la referencia de escritorio. */
.landing-hero{
  background:#fff;
  min-height:502px;
}
.landing-hero__inner{
  width:min(995px,calc(100% - 40px));
  min-height:502px;
  margin:0 auto;
  padding-top:61px;
  display:grid;
  grid-template-columns:452px 458px;
  column-gap:85px;
  align-items:start;
  overflow:hidden;
}
.landing-hero__copy{
  padding-top:0;
}
.landing-kicker{
  margin:0 0 14px;
  color:var(--nexa-green);
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
}
.landing-hero h1{
  margin:0 0 22px;
  max-width:440px;
  font-size:44px;
  line-height:1.08;
  letter-spacing:-1.65px;
  font-weight:700;
}
.landing-hero__lead{
  max-width:430px;
  margin:0;
  font-size:17px;
  line-height:1.45;
  color:#20283a;
}
.landing-hero__visual{
  width:458px;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.landing-info-box{
  width:458px;
  min-height:82px;
  padding:13px 16px 13px 42px;
  border-radius:11px;
  position:relative;
  background:#eef3ff;
  color:#1549a0;
  font-size:14px;
  line-height:1.45;
}
.landing-info-box__icon{
  position:absolute;
  left:15px;
  top:15px;
  width:18px;
  height:18px;
  border:2px solid currentColor;
  border-radius:50%;
  display:grid;
  place-items:center;
  font-size:11px;
  font-weight:700;
}
.landing-info-box p{margin:0}

.landing-pass-scene{
  width:100%;
  height:337px;
  position:relative;
}
.landing-pass-card{
  position:absolute;
  width:321px;
  height:207px;
  left:69px;
  top:109px;
  z-index:3;
  padding:23px 23px;
  overflow:hidden;
  border-radius:12px;
  color:#fff;
  background:
    radial-gradient(circle at 86% 74%,rgba(255,255,255,.08) 0 43px,transparent 44px),
    linear-gradient(132deg,#0f2b55,#124574 48%,#0c2e57 49%,#0e3867 100%);
  box-shadow:0 23px 45px rgba(9,43,74,.23);
}
.landing-pass-card:after{
  content:"";
  position:absolute;
  width:260px;
  height:115px;
  right:-85px;
  bottom:-40px;
  border:22px solid rgba(255,255,255,.08);
  border-radius:50%;
  transform:rotate(-25deg);
}
.landing-pass-card__mini{display:block;font-size:11px;letter-spacing:.18em;margin-bottom:2px}
.landing-pass-card strong{font-size:16px;line-height:1.02;letter-spacing:.02em}
.landing-pass-card__chip{
  position:absolute;
  left:31px;
  top:83px;
  width:46px;
  height:34px;
  border-radius:7px;
  background:linear-gradient(135deg,#f2f2f2,#aaa);
}
.landing-pass-card__contactless{
  position:absolute;
  left:84px;
  top:90px;
  font-weight:700;
  transform:rotate(90deg);
}
.landing-pass-card__network{
  position:absolute;
  right:20px;
  top:20px;
  font-size:22px;
  font-weight:700;
}
.landing-pass-hand{
  position:absolute;
  width:110px;
  height:170px;
  right:42px;
  bottom:-23px;
  background:linear-gradient(160deg,#efb08e,#d68768);
  border-radius:55% 40% 18% 24%;
  transform:rotate(18deg);
  z-index:4;
  box-shadow:inset 8px 0 18px rgba(120,62,45,.12);
}
.landing-pass-hand:before{
  content:"";
  position:absolute;
  width:38px;
  height:100px;
  left:-8px;
  top:5px;
  border-radius:45% 45% 30% 30%;
  background:linear-gradient(160deg,#f3b796,#dc9273);
  transform:rotate(-25deg);
}

.landing-config{
  background:var(--landing-soft);
  padding:47px 0 49px;
}
.landing-config__inner{
  width:min(600px,calc(100% - 32px));
  margin:0 auto;
}
.landing-section-title{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:28px;
}
.landing-section-title__icon{
  flex:0 0 48px;
  width:48px;
  height:48px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:var(--nexa-green);
  color:#fff;
  font-size:24px;
}
.landing-section-title h2{margin:0 0 4px;font-size:20px;line-height:1.2}
.landing-section-title p{margin:0;color:var(--landing-muted);font-size:13px}
.landing-amount-label{text-align:center;margin:0;color:#858b98;font-size:14px}
.landing-amount{
  margin:2px 0 9px;
  text-align:center;
  font-size:49px;
  line-height:1.08;
  font-weight:700;
  letter-spacing:-1.4px;
}
.landing-range{
  width:100%;
  height:18px;
  margin:0;
  accent-color:var(--nexa-green);
}
.landing-range-labels{display:flex;justify-content:space-between;color:#8c929d;font-size:12px}
.landing-benefits{
  margin:18px 0 13px;
  border:1px solid var(--landing-line);
  border-radius:13px;
  overflow:hidden;
  background:#fff;
}
.landing-benefits div{
  min-height:51px;
  padding:13px 16px;
  display:flex;
  align-items:center;
  gap:12px;
  border-bottom:1px solid var(--landing-line);
  font-size:14px;
}
.landing-benefits div:last-child{border-bottom:0}
.landing-benefits div>span{
  width:22px;
  height:22px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--landing-success);
  color:#fff;
  font-size:14px;
  font-weight:700;
}
.landing-note{
  min-height:39px;
  margin-bottom:19px;
  padding:9px 13px;
  border-radius:9px;
  display:flex;
  gap:9px;
  align-items:center;
  color:#5d687c;
  background:#edf2ff;
  font-size:12px;
}
.landing-note>span{
  width:15px;height:15px;border-radius:50%;border:1.5px solid var(--nexa-green);color:var(--nexa-green);
  display:grid;place-items:center;font-size:9px;font-weight:700;flex:0 0 15px;
}
.landing-note p{margin:0}
.landing-field-label{display:block;margin-bottom:7px;font-size:13px;font-weight:700}
.landing-field{
  width:100%;
  height:51px;
  border:2px solid #d8e0f2;
  border-radius:12px;
  background:#fff;
  display:flex;
  align-items:center;
  gap:5px;
  padding:0 13px;
}
.landing-field>span{color:var(--nexa-green);font-weight:700}
.landing-field input{
  min-width:0;
  flex:1;
  border:0;
  outline:0;
  color:#1e2738;
  background:transparent;
  font-size:16px;
}
.landing-field input::placeholder{color:#b1b6c0}
.landing-cta{
  width:100%;
  height:53px;
  margin-top:14px;
  border:0;
  border-radius:28px;
  color:#fff;
  background:var(--nexa-green);
  box-shadow:0 9px 18px rgba(23,104,91,.20);
  font-size:16px;
  font-weight:700;
  letter-spacing:.02em;
  cursor:pointer;
}
.landing-cta:hover{background:var(--nexa-green-dark)}
.landing-cta:disabled{opacity:.72;cursor:wait}
.landing-status{min-height:18px;margin:8px 4px 0;color:#a33;font-size:12px;text-align:center}

.landing-facts{
  background:#fff;
  padding:41px 0 31px;
}
.landing-facts__inner{
  width:min(730px,calc(100% - 32px));
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
  text-align:center;
}
.landing-facts article{display:flex;flex-direction:column;align-items:center}
.landing-fact-icon{height:31px;color:var(--nexa-green);font-size:30px;line-height:1}
.landing-facts small{margin-top:5px;color:#838a98;font-size:12px}
.landing-facts strong{margin-top:2px;font-size:16px;line-height:1.15}
.landing-facts__footnote{margin:23px auto 0;text-align:center;color:#a0a5ae;font-size:11px}

.landing-footer{
  min-height:123px;
  background:var(--nexa-green);
  display:flex;
  align-items:center;
}
.landing-footer__inner{
  width:min(520px,calc(100% - 36px));
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:65px;
}
.landing-footer img{display:block;max-width:190px;height:54px;object-fit:contain}

.landing-loader{
  position:fixed;
  inset:0;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(30,61,91,.82);
  opacity:0;
  visibility:hidden;
  transition:opacity .18s ease,visibility .18s ease;
}
.landing-loader.show{opacity:1;visibility:visible}
.landing-loader__dots{position:relative;width:82px;height:56px}
.landing-loader__dots span{position:absolute;width:22px;height:22px;border-radius:50%;top:17px;animation:landing-orbit 1.18s infinite ease-in-out}
.landing-loader__dots span:nth-child(1){background:#ef3d3d;left:7px;animation-delay:0s}
.landing-loader__dots span:nth-child(2){background:#2196ee;left:30px;animation-delay:-.18s}
.landing-loader__dots span:nth-child(3){background:#ffca2e;left:53px;animation-delay:-.36s}
@keyframes landing-orbit{
  0%,100%{transform:translate(0,0) scale(.93)}
  33%{transform:translate(14px,-12px) scale(1)}
  66%{transform:translate(-14px,12px) scale(.88)}
}

@media(max-width:1040px){
  .landing-hero__inner{width:min(900px,calc(100% - 40px));grid-template-columns:1fr 1fr;column-gap:50px}
  .landing-hero__visual,.landing-info-box{width:100%}
  .landing-pass-card{left:50%;transform:translateX(-50%)}
  .landing-pass-hand{right:8%}
}

@media(max-width:760px){
  .landing-header__inner{width:calc(100% - 30px)}
  .landing-hero{min-height:auto}
  .landing-hero__inner{
    width:min(540px,calc(100% - 30px));
    min-height:auto;
    padding:37px 0 0;
    grid-template-columns:1fr;
    row-gap:31px;
  }
  .landing-hero h1{font-size:39px;max-width:430px}
  .landing-hero__lead{font-size:16px}
  .landing-hero__visual{width:100%}
  .landing-info-box{width:100%}
  .landing-pass-scene{height:300px}
  .landing-pass-card{top:68px;width:min(321px,78vw);height:auto;aspect-ratio:1.55}
  .landing-pass-hand{right:5%;bottom:-12px;height:148px}
  .landing-config{padding-top:35px}
  .landing-facts__inner{grid-template-columns:1fr 1fr;row-gap:34px}
}

@media(max-width:480px){
  .landing-header{height:66px}
  .landing-brand{font-size:18px}
  .landing-brand__mark{width:29px;height:29px}
  .landing-hero__inner{width:calc(100% - 28px);padding-top:31px}
  .landing-kicker{font-size:11px}
  .landing-hero h1{font-size:35px;line-height:1.04;letter-spacing:-1.25px;margin-bottom:18px}
  .landing-hero__lead{font-size:15px}
  .landing-info-box{font-size:13px}
  .landing-pass-scene{height:260px}
  .landing-pass-card{top:54px;width:78vw;padding:18px}
  .landing-pass-card__chip{top:72px;left:24px}
  .landing-pass-card__contactless{top:78px;left:75px}
  .landing-pass-hand{width:84px;height:132px;right:2%;bottom:-6px}
  .landing-config__inner{width:calc(100% - 28px)}
  .landing-section-title__icon{width:44px;height:44px;flex-basis:44px}
  .landing-section-title h2{font-size:18px}
  .landing-amount{font-size:39px}
  .landing-benefits div{font-size:13px}
  .landing-facts__inner{grid-template-columns:1fr 1fr;gap:29px 16px}
  .landing-facts strong{font-size:15px}
  .landing-footer__inner{gap:24px}
  .landing-footer img{width:44%;height:auto}
}

/* =========================================================
   v18 — Mobile containment / responsive corrections
   Keeps every landing block inside the viewport without
   changing the desktop composition.
========================================================= */
html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
}

main,
.landing-header,
.landing-hero,
.landing-config,
.landing-facts,
.landing-footer{
  width:100%;
  max-width:100%;
}

.landing-header__inner,
.landing-hero__inner,
.landing-hero__copy,
.landing-hero__visual,
.landing-pass-scene,
.landing-config__inner,
.landing-facts__inner,
.landing-footer__inner{
  min-width:0;
  max-width:100%;
}

.landing-hero__copy > *,
.landing-info-box,
.landing-benefits,
.landing-note,
.landing-field,
.landing-cta{
  max-width:100%;
}

.landing-hero h1,
.landing-hero__lead,
.landing-info-box p,
.landing-section-title h2,
.landing-section-title p,
.landing-benefits div,
.landing-note p,
.landing-facts small,
.landing-facts strong{
  overflow-wrap:anywhere;
  word-break:normal;
}

.landing-pass-scene{
  overflow:hidden;
}

@media(max-width:760px){
  .landing-header__inner{
    width:calc(100% - 28px);
  }

  .landing-hero__inner{
    width:calc(100% - 28px);
    max-width:540px;
    margin-inline:auto;
    padding-top:34px;
    row-gap:28px;
    overflow:visible;
  }

  .landing-hero__copy,
  .landing-hero__visual{
    width:100%;
    min-width:0;
  }

  .landing-kicker,
  .landing-hero h1,
  .landing-hero__lead{
    width:100%;
    max-width:none;
  }

  .landing-hero h1{
    font-size:clamp(31px,9vw,39px);
  }

  .landing-info-box{
    width:100%;
    min-width:0;
    padding-right:14px;
  }

  .landing-pass-scene{
    width:100%;
    height:282px;
    overflow:hidden;
  }

  .landing-pass-card{
    width:min(321px,82%);
    max-width:321px;
    height:auto;
    aspect-ratio:321 / 207;
    left:50%;
    right:auto;
    top:58px;
    transform:translateX(-50%);
  }

  .landing-pass-hand{
    right:max(8px,6%);
    bottom:-10px;
    max-width:28%;
  }

  .landing-config__inner,
  .landing-facts__inner,
  .landing-footer__inner{
    width:calc(100% - 28px);
  }

  .landing-amount{
    font-size:clamp(34px,11vw,49px);
    overflow-wrap:anywhere;
  }
}

@media(max-width:480px){
  .landing-header__inner,
  .landing-hero__inner,
  .landing-config__inner,
  .landing-facts__inner,
  .landing-footer__inner{
    width:calc(100% - 24px);
  }

  .landing-menu{
    width:44px;
    min-width:44px;
  }

  .landing-hero__inner{
    padding-top:28px;
    row-gap:24px;
  }

  .landing-hero h1{
    font-size:clamp(29px,9.2vw,35px);
    letter-spacing:-1px;
  }

  .landing-hero__lead{
    font-size:15px;
    line-height:1.5;
  }

  .landing-info-box{
    min-height:0;
    padding:13px 12px 13px 40px;
    border-radius:10px;
  }

  .landing-info-box__icon{
    left:13px;
  }

  .landing-pass-scene{
    height:236px;
  }

  .landing-pass-card{
    top:38px;
    width:min(302px,88%);
    padding:16px;
    border-radius:10px;
  }

  .landing-pass-card__chip{
    width:40px;
    height:29px;
    top:66px;
    left:22px;
  }

  .landing-pass-card__contactless{
    top:72px;
    left:68px;
  }

  .landing-pass-card__network{
    right:16px;
    top:16px;
    font-size:19px;
  }

  .landing-pass-hand{
    width:74px;
    height:118px;
    right:5%;
    bottom:-7px;
  }

  .landing-section-title{
    align-items:flex-start;
  }

  .landing-section-title > div{
    min-width:0;
  }

  .landing-amount{
    font-size:clamp(32px,10vw,39px);
    letter-spacing:-.8px;
  }

  .landing-benefits div{
    align-items:flex-start;
  }

  .landing-facts__inner{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .landing-facts article{
    min-width:0;
  }

  .landing-footer__inner{
    gap:20px;
  }

  .landing-footer img{
    width:min(44%,180px);
    max-width:44%;
    height:auto;
  }
}

@media(max-width:350px){
  .landing-facts__inner{
    grid-template-columns:1fr;
  }

  .landing-pass-scene{
    height:215px;
  }

  .landing-pass-card{
    width:92%;
  }
}