:root{--teal:#02A294;--teald:#028074;--orange:#EC7016;--navy:#072233;--ink:#0C222B;--soft:#3c4a52;--muted:#697680;--line:rgba(11,34,43,.1);--bg:#F7F9FA;--card:#fff;--navy2:#0e3040;--t10:rgba(2,162,148,.12);--dp:'Archivo',sans-serif;--bd:'Inter',sans-serif;--mono:'Space Mono',monospace}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto}
body{font-family:var(--bd);background:var(--bg);color:var(--ink);line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--dp);letter-spacing:-.02em;line-height:1.08;font-weight:800}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
::selection{background:var(--teal);color:#fff}
/* ============ PRELOADER ============ */
#preloader{position:fixed;inset:0;z-index:200;background:var(--navy);display:flex;align-items:center;justify-content:center;transition:opacity .5s}
#preloader.done{opacity:0;pointer-events:none}
.pl-in{text-align:center}
.pl-logo{font-family:var(--dp);font-weight:900;font-size:52px;color:#fff;letter-spacing:-.03em}
.pl-logo b{color:var(--teal)}
.pl-bar{width:200px;height:2px;background:rgba(255,255,255,.15);margin:22px auto 12px;overflow:hidden;border-radius:2px}
.pl-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--teal),#5ac8fa);transform:scaleX(0);transform-origin:left}
.pl-count{font-family:var(--mono);font-size:12px;color:rgba(255,255,255,.5)}
/* ============ REVEAL ============ */
.rv{opacity:0;transform:translateY(34px);will-change:transform,opacity}
html.no-motion .rv,html.rm .rv{opacity:1;transform:none}
[data-split] .word{display:inline-block;overflow:hidden;vertical-align:top}
[data-split] .char{display:inline-block;transform:translateY(110%);will-change:transform}
html.no-motion [data-split] .char,html.rm [data-split] .char{transform:none}
/* ============ botones ============ */
.btn{display:inline-flex;align-items:center;gap:9px;background:var(--teal);color:#fff;font-weight:700;font-size:15px;padding:14px 24px;border-radius:10px;border:none;cursor:pointer;font-family:var(--bd);white-space:nowrap;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s}
.btn:hover{background:var(--teald);transform:translateY(-2px);box-shadow:0 10px 24px rgba(2,162,148,.3)}
.btn:active{transform:translateY(0)}
.btn.o{background:var(--orange)}.btn.o:hover{filter:brightness(.95)}
.btn.gh{background:transparent;border:1.5px solid rgba(255,255,255,.45);color:#fff}
.btn.gh:hover{background:rgba(255,255,255,.1)}
.btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;transition:transform .25s}
.btn:hover svg{transform:translateX(3px)}
/* ============ topbar + nav ============ */
.topbar{background:var(--navy);color:#fff;font-size:13px;padding:8px 0;position:relative;z-index:5}
.topbar .wrap{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.topbar a{opacity:.9}.topbar a:hover{opacity:1;color:#8fe3d9}
.topbar .sep{opacity:.4}
.nav{position:sticky;top:0;z-index:80;background:rgba(247,249,250,.85);backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--line);transition:box-shadow .3s,background .3s}
.nav.scrolled{background:rgba(247,249,250,.97);box-shadow:0 6px 24px rgba(11,34,43,.08)}
.nav-in{display:flex;align-items:center;gap:26px;padding:15px 0}
.logo{font-family:var(--dp);font-weight:900;font-size:24px;color:var(--ink);letter-spacing:-.02em}.logo b{color:var(--teal)}
.nav-links{display:flex;gap:24px;font-size:14.5px;font-weight:600;color:var(--soft)}
.nav-links a{padding:6px 0;border-bottom:2px solid transparent;transition:color .2s,border-color .2s}
.nav-links a:hover,.nav-links a.on{color:var(--teald);border-color:var(--teal)}
.nav-cta{margin-left:auto}
.burger{display:none;margin-left:auto;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:6px}.burger i{width:24px;height:2px;background:var(--ink);transition:.3s}
.mmenu{display:none;flex-direction:column;gap:2px;padding:10px 24px 18px;border-top:1px solid var(--line);background:var(--bg)}
.mmenu.on{display:flex}.mmenu a{padding:11px 0;font-weight:600;color:var(--soft);border-bottom:1px solid var(--line)}
/* ============ HERO (video) ============ */
.hero{position:relative;overflow:hidden;background:var(--navy);color:#fff;min-height:min(88vh,820px);display:flex;align-items:center}
.hero.intern{min-height:0;padding:78px 0}
.hero-media{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-media video,.hero-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);will-change:transform}
.hero-media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,34,43,.72) 0%,rgba(7,34,43,.5) 45%,rgba(7,34,43,.88) 100%)}
.hero .wrap{position:relative;z-index:2;padding:70px 24px}
.crumb{font-size:13px;color:#9fe3da;margin-bottom:18px}.crumb a{opacity:.85}.crumb a:hover{color:#fff}
.hero h1{font-size:clamp(32px,5.6vw,60px);font-weight:900;max-width:19ch;text-shadow:0 4px 30px rgba(0,0,0,.3)}
.hero h1 .em{color:#5ac8fa}
.hero .lead{font-size:clamp(15px,2vw,18.5px);color:rgba(255,255,255,.85);max-width:56ch;margin-top:18px}
.hero .cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.promise{display:flex;align-items:center;gap:9px;margin-top:26px;font-size:14px;color:#bfeee7;font-weight:600;flex-wrap:wrap}
.promise svg{width:17px;height:17px;fill:none;stroke:#5ac8fa;stroke-width:2}
.promise .pill{background:var(--teal);color:#fff;border-radius:99px;padding:4px 12px;font-size:11px;font-weight:700}
.scroll-cue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:3;width:26px;height:42px;border:2px solid rgba(255,255,255,.5);border-radius:14px}
.scroll-cue:after{content:"";position:absolute;left:50%;top:8px;width:4px;height:9px;background:var(--teal);border-radius:3px;transform:translateX(-50%);animation:cue 1.6s ease-in-out infinite}
@keyframes cue{0%{transform:translateX(-50%) translateY(0);opacity:1}70%{transform:translateX(-50%) translateY(14px);opacity:0}100%{opacity:0}}
/* ============ logos ============ */
.logos{background:#fff;border-bottom:1px solid var(--line);padding:36px 0}
.logos .lt{text-align:center;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:22px}
.logos .lrow{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 36px}
.lg{font-family:var(--dp);font-weight:800;font-size:22px;color:#b4bec4;transition:color .25s,transform .25s;letter-spacing:-.02em}
.lg:hover{color:var(--navy);transform:translateY(-3px)}
/* ============ secciones ============ */
.sec{padding:84px 0}
.sec.alt{background:#fff}
.eyebrow{color:var(--teal);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:12px;display:flex;align-items:center;gap:10px}
.eyebrow:before{content:"";width:26px;height:2px;background:var(--teal)}
.sec-t{font-size:clamp(27px,4.2vw,40px);margin-bottom:12px}
.sec-d{color:var(--muted);font-size:16px;max-width:64ch;margin-bottom:40px}
/* ============ servicios ============ */
.svc-g{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.svc{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:26px;transition:transform .25s,border-color .25s,box-shadow .25s;display:flex;flex-direction:column;position:relative;overflow:hidden}
.svc:before{content:"";position:absolute;left:0;top:0;right:0;height:3px;background:linear-gradient(90deg,var(--teal),#5ac8fa);transform:scaleX(0);transform-origin:left;transition:transform .35s}
.svc:hover{border-color:var(--teal);transform:translateY(-6px);box-shadow:0 18px 40px rgba(11,34,43,.12)}
.svc:hover:before{transform:scaleX(1)}
.svc .i{width:48px;height:48px;border-radius:13px;background:var(--t10);color:var(--teal);display:flex;align-items:center;justify-content:center;margin-bottom:16px;transition:transform .3s}
.svc:hover .i{transform:scale(1.1) rotate(-4deg)}
.svc .i svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.svc h3{font-size:17px;margin-bottom:8px}.svc p{font-size:13.5px;color:var(--muted);flex:1}
.svc a.more{margin-top:14px;font-size:13px;font-weight:700;color:var(--teald);display:inline-flex;align-items:center;gap:5px}
/* ============ stats ============ */
.stats{background:linear-gradient(150deg,#0e3040,var(--navy));color:#fff;position:relative;overflow:hidden}
.stats:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(115deg,rgba(255,255,255,.03) 0 40px,transparent 40px 80px)}
.stats .g{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center;padding:60px 0;position:relative}
.stnum{font-family:var(--dp);font-weight:900;font-size:clamp(32px,4.6vw,50px);color:#5ac8fa;line-height:1}
.stlab{font-size:13px;opacity:.68;margin-top:8px}
/* ============ cuerpo de contenido ============ */
.body-wrap{max-width:800px}
.body-wrap h2{font-size:clamp(21px,3vw,28px);margin:50px 0 14px;color:var(--navy)}
.body-wrap h3{font-size:19px;margin:32px 0 12px;color:var(--teald)}
.body-wrap p{margin:14px 0;color:var(--soft)}
.body-wrap ul{margin:18px 0 18px 4px;list-style:none}
.body-wrap ul li{padding:9px 0 9px 30px;position:relative;color:var(--soft);border-bottom:1px dashed var(--line)}
.body-wrap ul li:before{content:"";position:absolute;left:0;top:15px;width:16px;height:16px;background:var(--t10);border-radius:4px;border:1.5px solid var(--teal)}
.body-wrap img{border-radius:14px;margin:26px 0;border:1px solid var(--line);box-shadow:0 10px 30px rgba(11,34,43,.08)}
.lead-b{font-size:18.5px;color:var(--ink);border-left:4px solid var(--teal);padding:2px 0 2px 18px;margin:22px 0 28px}
.ckl{list-style:none;margin:18px 0;display:grid;gap:4px}
.ckl li{display:flex;gap:10px;padding:9px 0;color:var(--soft);align-items:flex-start}
.ckl li:before{content:"✓";color:var(--teal);font-weight:800;flex:none;font-size:17px;margin-top:-2px}
/* ============ CTA ============ */
.ctab{background:linear-gradient(135deg,#0e3040,var(--navy));color:#fff;border-radius:18px;padding:52px;text-align:center;margin:64px 0;position:relative;overflow:hidden}
.ctab:before{content:"";position:absolute;top:-50%;right:-15%;width:320px;height:320px;background:radial-gradient(circle,rgba(2,162,148,.35),transparent 65%)}
.ctab h2{font-size:clamp(25px,4vw,36px);margin-bottom:12px;position:relative}
.ctab p{opacity:.8;margin:0 auto 28px;max-width:52ch;position:relative}
.ctab .row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;position:relative}
/* ============ relacionadas ============ */
.rel-g{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.rel{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px;transition:transform .2s,border-color .2s}
.rel:hover{border-color:var(--teal);transform:translateY(-4px)}
.rel h4{font-size:15px;margin-bottom:5px}.rel span{font-size:12.5px;color:var(--teald);font-weight:700}
/* ============ footer ============ */
.foot{background:var(--navy);color:#fff;padding:64px 0 30px;margin-top:40px}
.foot-g{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px;margin-bottom:36px}
.foot .logo{color:#fff}.foot p{font-size:13.5px;opacity:.72;margin-top:14px;max-width:320px}
.foot h5{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;opacity:.55;margin-bottom:14px;font-family:var(--bd);font-weight:700}
.foot a,.foot li{font-size:13.5px;opacity:.82;list-style:none;margin:8px 0;display:block}.foot a:hover{color:#8fe3d9}
.foot-bot{border-top:1px solid rgba(255,255,255,.12);padding-top:22px;font-size:12.5px;opacity:.55;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
/* ============ wa fab ============ */
.fab{position:fixed;right:22px;bottom:22px;width:58px;height:58px;border-radius:50%;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 22px rgba(37,211,102,.5);z-index:95;transition:transform .2s}
.fab:hover{transform:scale(1.08)}
.fab svg{width:29px;height:29px;fill:currentColor}
/* ============ responsive ============ */
@media(max-width:900px){.svc-g,.rel-g{grid-template-columns:1fr 1fr}.stats .g{grid-template-columns:1fr 1fr}.nav-links,.nav-cta{display:none}.burger{display:flex}.foot-g{grid-template-columns:1fr 1fr}.hero{min-height:0}}
@media(max-width:560px){.svc-g,.rel-g{grid-template-columns:1fr}.ctab{padding:32px 20px}.sec{padding:60px 0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001s!important;transition-duration:.001s!important}}