:root{
  --navy:#0B2453; --blue:#1D63ED; --blue2:#6FA5FF; --sky:#7FB0FF;
  --ink:#0B2453; --muted:#51617F; --bg:#F7F6F2; --line:#DCE6F7;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#FFFFFF;color:var(--ink);font-family:'Public Sans',sans-serif;line-height:1.6}
h1,h2,h3,h4{font-family:Sora,sans-serif;font-weight:700;margin:0;line-height:1.15;text-wrap:balance}
p{margin:0;text-wrap:pretty}
a{color:var(--blue);text-decoration:none}
a:hover{color:var(--navy)}
img{max-width:100%}

/* motion */
@keyframes waveDrift{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes waveDriftR{from{transform:translateX(-50%)}to{transform:translateX(0)}}
@keyframes blobFloat{from{transform:translate(0,0) scale(1)}to{transform:translate(60px,40px) scale(1.15)}}
@keyframes shimmer{from{background-position:0% 50%}to{background-position:200% 50%}}
@keyframes auroraSpin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes heroDawn{0%{opacity:0;filter:brightness(.6);transform:scale(1.04)}100%{opacity:1;filter:brightness(1);transform:scale(1)}}
@keyframes heroIn{from{opacity:0;transform:translateY(30px);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
.reveal{opacity:0;transform:translateY(42px);filter:blur(7px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1),filter .9s}
.reveal.in{opacity:1;transform:none;filter:none}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none;filter:none}}

.progress{position:fixed;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--blue),var(--blue2));transform-origin:0 50%;transform:scaleX(0);z-index:70}

/* nav */
.nav{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid rgba(11,36,83,.1)}
.nav-in{display:flex;align-items:center;justify-content:space-between;padding:0 40px;height:72px}
.nav-brand{display:flex;align-items:center;gap:12px}
.nav-brand img{height:38px}
.nav-name{font-family:Sora,sans-serif;font-weight:700;font-size:17px}
.nav-name span{color:var(--muted);font-weight:500}
.nav-links{display:flex;align-items:stretch;gap:6px;font-size:14px;font-weight:600;height:72px}
.nav-links a{display:flex;align-items:center;padding:0 16px;color:#33456B;border-bottom:2px solid transparent;transition:.2s}
.nav-links a:hover{color:var(--navy);border-bottom-color:var(--blue)}
.nav-right{display:flex;align-items:center;gap:18px}
.lang{display:flex;align-items:center;gap:2px;font-size:13px;font-weight:600}
.lang button{background:none;border:0;cursor:pointer;font:inherit;color:#8A97AF;padding:4px 6px}
.lang button.on{color:var(--navy);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--blue);text-decoration-thickness:2px}
.lang span{color:#B9C3D6}
.btn-outline{color:var(--navy);font-size:14px;font-weight:600;border:1.5px solid var(--navy);padding:10px 22px;border-radius:99px;transition:.2s}
.btn-outline:hover{background:var(--navy);color:#fff}

/* buttons */
.btn-solid,.btn-navy,.btn-white,.btn-ghost,.btn-outline{white-space:nowrap}
.btn-solid{background:var(--blue);color:#fff;font-size:16px;font-weight:600;padding:15px 28px;border-radius:99px;border:0;cursor:pointer;font-family:inherit;box-shadow:0 10px 26px rgba(13,40,90,.25);transition:.2s;display:inline-block}
.btn-solid:hover{background:#164FC4;color:#fff;transform:translateY(-2px)}
.btn-ghost{border:1.5px solid rgba(255,255,255,.5);color:#fff;font-size:15.5px;font-weight:600;padding:14px 26px;border-radius:99px;transition:.2s;display:inline-block}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.12);color:#fff}
.btn-navy{background:var(--navy);color:#fff;font-size:15px;font-weight:600;padding:14px 28px;border-radius:99px;margin-top:10px;transition:.2s;display:inline-block}
.btn-navy:hover{background:var(--blue);color:#fff;transform:translateY(-2px)}
.btn-white{background:#fff;color:var(--navy);font-size:15px;font-weight:600;padding:14px 28px;border-radius:99px;margin-top:10px;transition:.2s;display:inline-block}
.btn-white:hover{color:var(--navy);transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.3)}

/* hero */
.hero{position:relative;overflow:hidden;min-height:680px;display:flex;align-items:center}
.hero-bg{position:absolute;inset:0;animation:heroDawn 1.8s cubic-bezier(.33,1,.68,1) both}
.hero-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 35%}
.hero-shade{position:absolute;inset:0;background:linear-gradient(92deg,rgba(7,20,44,.9) 0%,rgba(7,20,44,.62) 40%,rgba(7,20,44,.1) 72%,rgba(7,20,44,0) 88%)}
.waves{position:absolute;inset:0;pointer-events:none}
.wave{position:absolute;bottom:0;left:0;width:200%}
.w1{height:170px;opacity:.5;animation:waveDriftR 24s linear infinite}
.w2{height:130px;animation:waveDrift 15s linear infinite}
.hero-txt{position:relative;width:56%;min-width:640px;padding:110px 48px 110px 64px;display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.badge{display:inline-flex;border:1px solid rgba(255,255,255,.5);color:#fff;font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:8px 16px;border-radius:99px;animation:heroIn .9s cubic-bezier(.2,.7,.2,1) .05s both}
.hero h1{font-size:64px;letter-spacing:-2px;color:#fff;animation:heroIn .9s cubic-bezier(.2,.7,.2,1) .18s both}
.hero h1 em{font-style:normal;background:linear-gradient(92deg,#7FB0FF,#B9E8FF);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-txt>p{font-size:18.5px;color:rgba(255,255,255,.82);max-width:540px;animation:heroIn .9s cubic-bezier(.2,.7,.2,1) .3s both}
.hero-cta{display:flex;align-items:center;gap:14px;margin-top:8px;animation:heroIn .9s cubic-bezier(.2,.7,.2,1) .42s both}

/* stats */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:72px 40px 8px;max-width:1280px;margin:0 auto}
.stat{display:flex;align-items:baseline;gap:16px;border-top:2px solid var(--navy);padding-top:20px}
.stat .n{font-family:Sora,sans-serif;font-weight:700;font-size:56px;letter-spacing:-2px;background:linear-gradient(120deg,var(--blue),var(--blue2));-webkit-background-clip:text;background-clip:text;color:transparent}
.stat span:last-child{font-size:16px;font-weight:600;color:var(--muted);line-height:1.35}

/* section scaffolding */
.kicker{font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin-bottom:14px}
.kicker.light-k{color:var(--sky)}
.mini-kicker{font-size:12.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.mini-kicker.light{color:rgba(255,255,255,.65)}
h2{font-size:44px;letter-spacing:-1.2px}
h2.light,h3.light{color:#fff}
.light-sub{color:rgba(255,255,255,.75);font-size:16.5px;max-width:490px}
.brands-intro{max-width:760px;margin:0 auto 72px;padding:0 40px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:0}
.brands-intro h2{font-size:48px;margin-bottom:18px}
.brands-intro p{font-size:17px;color:var(--muted);max-width:560px;margin-bottom:36px}
.brands-intro .brand-logos{gap:48px;padding:0}
.logo-div{width:1px;height:40px;background:var(--line)}
.sec-head{max-width:1280px;margin:0 auto 40px;padding:0 40px;display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.brand-logos{display:flex;align-items:center;gap:40px;padding-bottom:6px}
.brand-logos img{height:40px;opacity:.85}
.brand-logos img:last-child{height:30px}

/* brands */
.brands{padding:128px 0 0;scroll-margin-top:80px}
.cm-panel{position:relative;margin:0 auto 24px;max-width:1400px;background:linear-gradient(120deg,#DCEAFB 0%,#EEF3FE 60%,#F6F9FE 100%);border-radius:32px;overflow:hidden;display:grid;grid-template-columns:1fr 1fr;min-height:580px}
.blob{position:absolute;top:-80px;left:30%;width:340px;height:340px;border-radius:50%;background:#9DBEF7;opacity:.5;filter:blur(60px);animation:blobFloat 14s ease-in-out infinite alternate;pointer-events:none}
.panel-left{position:relative;z-index:2;padding:64px 24px 64px 64px;display:flex;flex-direction:column;align-items:flex-start;gap:18px;justify-content:center}
.brand-mark{height:56px}
.cm-panel h3{font-size:38px;letter-spacing:-1px}
.panel-left p{font-size:16.5px;color:var(--muted);max-width:440px}
.chips{display:flex;flex-wrap:wrap;gap:8px;max-width:470px}
.chips span{background:rgba(255,255,255,.8);color:var(--navy);font-size:13px;font-weight:600;padding:8px 15px;border-radius:99px}
.cm-img{position:relative}
.cm-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top}
.cm-fade{position:absolute;inset:0;background:linear-gradient(90deg,#EEF3FE 0%,rgba(238,243,254,0) 32%)}
.gd-panel{position:relative;margin:0 auto;max-width:1400px;background:var(--navy);border-radius:32px;overflow:hidden;display:grid;grid-template-columns:1fr 1.05fr;min-height:580px}
.gd-img{position:relative}
.gd-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gd-fade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,36,83,0) 55%,#0B2453 100%)}
.gd-right{position:relative;z-index:2;padding:56px 56px 56px 40px;display:flex;flex-direction:column;align-items:flex-start;gap:18px;justify-content:center}
.logo-card{background:#fff;border-radius:12px;padding:10px 16px;display:inline-block}
.logo-card img{height:32px;display:block}
.gd-panel h3{font-size:36px;letter-spacing:-1px}
.gd-prods{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;width:100%;margin-top:6px}
.gd-prods a{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:16px;padding:16px 12px 14px;display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;transition:.2s}
.gd-prods a:hover{background:rgba(255,255,255,.15);transform:translateY(-4px)}
.gd-prods img{height:112px;object-fit:contain;filter:drop-shadow(0 12px 16px rgba(0,0,0,.35))}
.gd-prods strong{font-size:13.5px;font-weight:600;color:#fff;line-height:1.3}
.gd-prods span{font-size:12px;color:rgba(255,255,255,.6);line-height:1.35}

/* portfolio */
.portfolio{padding:104px 40px 8px;max-width:1280px;margin:0 auto;scroll-margin-top:80px}
.port-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:44px;gap:24px}
.port-head p{font-size:15px;color:var(--muted);max-width:340px}
.port-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tile{border-radius:20px;border:1px solid var(--line);padding:32px;transition:transform .25s,box-shadow .25s,border-color .25s}
.tile:hover{transform:translateY(-6px);box-shadow:0 20px 40px rgba(11,36,83,.1);border-color:#B9D0F5}
.t1,.t2,.t3,.t4,.t5,.t6{background:#F4F8FE}
.tile-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:36px}
.num{width:46px;height:46px;background:#FFFFFF;border:1px solid var(--line);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:Sora,sans-serif;font-weight:700;font-size:14px}
.dev{background:#FFFFFF;border:1px solid var(--line);color:#8A97AF;font-size:11.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding:5px 11px;border-radius:99px}
.tile h4{font-size:23px;font-weight:600;letter-spacing:-.3px;margin-bottom:6px}
.tile .by{font-size:12.5px;font-weight:600;color:var(--blue);margin-bottom:8px}
.tile p{font-size:15px;color:rgba(11,36,83,.65)}

/* about */
.about{padding:96px 40px 0;max-width:1280px;margin:0 auto;scroll-margin-top:80px}
.about>.reveal{padding:0 40px}
.about h2{margin-bottom:40px;max-width:680px}
.cols2{display:grid;grid-template-columns:1.2fr .8fr;gap:20px}
.cols2.flip{grid-template-columns:.8fr 1.2fr;margin-top:20px}
.card{border-radius:32px;padding:56px}
.card.blue{background:#EEF3FE}
.card.white{background:#fff;border:1px solid var(--line)}
.card.navy{background:#EEF3FE;display:flex;flex-direction:column;justify-content:center}
.card.navy p{font-size:16px;color:var(--muted);margin-top:12px}
.card .rule,.why-grid .rule{width:36px;height:4px;background:linear-gradient(90deg,var(--blue),var(--blue2));border-radius:2px;margin-bottom:22px}
.card .big{font-family:Sora,sans-serif;font-weight:600;font-size:28px;line-height:1.32;letter-spacing:-.5px;margin-top:16px}
.six{font-family:Sora,sans-serif;font-weight:700;font-size:64px;letter-spacing:-2px;line-height:1;color:var(--blue)}
.img-card{padding:0;overflow:hidden;position:relative;min-height:320px}
.img-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* reach */
.reach{padding:96px 24px 0;max-width:1448px;margin:0 auto;scroll-margin-top:80px}
.reach-panel{background:var(--navy);border-radius:32px;padding:80px 72px;display:grid;grid-template-columns:400px 1fr;gap:80px;align-items:center}
.reach-map{width:360px;height:524px;background:linear-gradient(115deg,#3E7BFA 25%,#9CC5FF 50%,#3E7BFA 75%);background-size:250% 250%;animation:shimmer 5s linear infinite;-webkit-mask:url('../img/latam-dots.svg') center/contain no-repeat;mask:url('../img/latam-dots.svg') center/contain no-repeat}
.reach h2{margin-bottom:18px}
.reach .light-sub{margin-bottom:36px}
.regions{list-style:none;margin:0;padding:0}
.regions li{display:flex;align-items:baseline;padding:17px 12px;border-top:1px solid rgba(255,255,255,.16);font-family:Sora,sans-serif;font-weight:600;font-size:20px;color:#fff;transition:.2s}
.regions li:hover{background:rgba(255,255,255,.06);padding-left:20px}
.regions li:last-child{border-bottom:1px solid rgba(255,255,255,.16)}

/* why */
.why{padding:104px 40px;max-width:1280px;margin:0 auto;scroll-margin-top:80px}
.why h2{margin-bottom:48px}
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px}
.why-grid .rule{margin-bottom:20px}
.why-grid h4{font-size:19px;font-weight:600;margin-bottom:10px}
.why-grid p{font-size:15px;color:var(--muted)}

/* CTA */
.cta-band{margin:56px auto 0;max-width:1400px;background:#EEF3FE;border-radius:32px;padding:76px 80px;display:flex;align-items:center;justify-content:space-between;gap:48px;position:relative;overflow:hidden}
.aurora{display:none}
.cta-txt{position:relative;max-width:600px}
.cta-txt h2{font-size:40px;letter-spacing:-1px;margin-bottom:14px;color:var(--ink)}
.cta-txt .light-sub{color:var(--muted)}
.cta-txt .light-sub{margin-bottom:30px;max-width:560px}
.cta-photos{position:relative;flex:none;width:460px;height:340px}
.cta-photos img{position:absolute;width:250px;height:300px;object-fit:cover;border-radius:20px;border:4px solid #FFFFFF;box-shadow:0 18px 44px rgba(10,32,66,.18)}
.cta-photos .p1{left:0;top:24px;transform:rotate(-5deg)}
.cta-photos .p2{right:0;top:0;transform:rotate(4deg)}

/* contact */
.contact{display:grid;grid-template-columns:1fr 1.1fr;gap:88px;padding:104px 40px;max-width:1280px;margin:0 auto;align-items:start;scroll-margin-top:80px}
.contact h2{margin-bottom:18px}
.contact-sub{font-size:17px;color:var(--muted);max-width:420px}
.form{background:#fff;border:1px solid var(--line);border-radius:20px;padding:36px;display:flex;flex-direction:column;gap:16px;box-shadow:0 20px 50px rgba(11,36,83,.06)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form input,.form textarea{font-family:'Public Sans',sans-serif;font-size:15px;padding:14px 16px;border:1.5px solid var(--line);border-radius:12px;color:var(--ink);outline:none;width:100%;resize:none;transition:.2s}
.form input:focus,.form textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(29,99,237,.14)}

.form-msg{font-size:14.5px;font-weight:600;margin:0;text-align:center}
.form-msg.ok{color:#1B7F4D}
.form-msg.err{color:#C0392B}

/* footer */
.footer{background:var(--navy);color:#fff;margin-top:96px}
.foot-top{padding:72px 64px 40px;display:flex;justify-content:space-between;align-items:flex-start;gap:48px}
.foot-brand{display:flex;flex-direction:column;gap:16px;max-width:320px}
.foot-brand .logo-card{align-self:flex-start;padding:10px 14px}
.foot-brand .logo-card img{height:38px}
.foot-brand p{font-size:15.5px;color:rgba(255,255,255,.65)}
.foot-cols{display:flex;gap:72px}
.foot-cols div{display:flex;flex-direction:column;gap:14px;font-size:15.5px}
.foot-cols span{font-weight:700;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.foot-cols a{color:#fff}
.foot-cols a:hover{color:var(--sky)}
.foot-bot{display:flex;justify-content:space-between;align-items:center;gap:24px;border-top:1px solid rgba(255,255,255,.15);padding:28px 64px 40px;font-size:14px;color:rgba(255,255,255,.55)}
.foot-bot .site{font-weight:600;color:rgba(255,255,255,.75)}

/* ------- tablet ------- */
@media (max-width:1100px){
  .nav-links{display:none}
  .hero-txt{width:100%;min-width:0;padding:88px 32px}
  .stats{grid-template-columns:1fr;gap:26px;padding:56px 32px 8px}
  .sec-head{padding:0 32px;flex-direction:column;align-items:flex-start;gap:18px}
  .cm-panel,.gd-panel{grid-template-columns:1fr}
  .cm-img{min-height:340px;position:relative}
  .gd-img{min-height:300px}
  .gd-fade{background:linear-gradient(180deg,rgba(11,36,83,0) 55%,#0B2453 100%)}
  .panel-left,.gd-right{padding:44px 28px}
  .cols2,.cols2.flip{grid-template-columns:1fr}
  .port-head{flex-direction:column;align-items:flex-start;gap:14px}
  .port-grid{grid-template-columns:repeat(2,1fr)}
  .reach-panel{grid-template-columns:1fr;gap:48px;padding:48px 32px}
  .reach-map{width:100%;max-width:340px;height:480px;margin:0 auto}
  .why-grid{grid-template-columns:repeat(2,1fr);gap:32px}
  .cta-band{flex-direction:column;align-items:flex-start;padding:48px 32px}
  .contact{grid-template-columns:1fr;gap:44px;padding:72px 32px}
  .portfolio,.why{padding-left:32px;padding-right:32px}
  .foot-top{padding:56px 32px 32px}
  .foot-bot{padding:24px 32px 32px}
}
/* ------- phone ------- */
@media (max-width:640px){
  .nav-name{display:none}
  .nav-in{padding:0 16px}
  .hero{min-height:560px}
  .hero-txt{padding:64px 20px}
  .hero h1{font-size:38px;letter-spacing:-1px}
  h2{font-size:29px;letter-spacing:-.7px}
  .cm-panel h3,.gd-panel h3{font-size:27px}
  .card .big{font-size:22px}
  .card{padding:36px 26px}
  .port-grid,.why-grid,.gd-prods{grid-template-columns:1fr}
  .row2{grid-template-columns:1fr}
  .cta-photos{width:100%;height:300px}
  .cta-photos img{width:44%;height:260px}
  .foot-top{flex-direction:column;gap:36px}
  .foot-cols{flex-wrap:wrap;gap:36px}
  .foot-bot{flex-direction:column;align-items:flex-start;gap:8px}
  .portfolio,.why{padding-left:20px;padding-right:20px}
  .sec-head{padding:0 20px}
  .stats{padding:48px 20px 8px}
  .cm-panel,.gd-panel{margin-left:12px;margin-right:12px}
  .cta-band{margin:40px 12px 0}
  .contact{padding:64px 20px}
  .foot-top{padding:48px 20px 28px}
}