/* Serter — sitio público */
:root{--primary:#1A2A82;--secondary:#B71C1C;--text:#423C44;--cyan:#5FC8D9;--violet:#662CD3;--dark:#0E102B;--white:#fff}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;font-family:Roboto,sans-serif;font-weight:400;font-size:clamp(17px,1.47vw,20px);line-height:1.7;color:var(--text);background:#fff;overflow-x:hidden}
img{max-width:100%;height:auto;border:0}
a{color:inherit;text-decoration:none}
h1,h2,h3,p{margin:0}
.wrap{width:100%;max-width:1140px;margin:0 auto;position:relative}
.cols{display:flex;flex-wrap:wrap}
.col{width:50%;padding:10px;position:relative}
.bar{height:4.5px;width:100px;background:var(--cyan);margin:15px 0}
.bar.violet{background:var(--violet)}
main{overflow-x:hidden}

/* Botones */
.btn-serter{display:inline-block;background:var(--cyan);color:#fff;font:400 18px/1.2 Roboto,sans-serif;padding:18px 38px;border-radius:50px;box-shadow:0 6px 18px rgba(95,200,217,.45);transition:transform .25s,box-shadow .25s,background .25s}
.btn-serter i{margin-left:10px;font-size:15px}
.btn-serter:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 10px 24px rgba(95,200,217,.6);background:#4bbbd0}
.btn-serter.sm{font-size:15px;font-weight:500;padding:15px 30px;text-transform:uppercase;letter-spacing:.4px}
.btn-serter:focus-visible{outline:3px solid var(--primary);outline-offset:3px}

/* Header */
.site-header{position:absolute;top:0;left:0;right:0;height:90px;z-index:10}
.site-header.stuck{position:fixed;animation:hdrIn .35s ease}
@keyframes hdrIn{from{transform:translateY(-100%)}to{transform:none}}
.header-bg{position:absolute;inset:0;background:center/cover no-repeat}
.header-in{position:relative;display:flex;align-items:center;height:90px;padding-left:6.8%}
.brand{display:block;width:11%;min-width:110px}
.brand img{display:block;width:100%;max-width:151px;height:auto}
.menu{width:60%;margin-left:.7%}
.menu ul{display:flex;justify-content:flex-end;list-style:none;margin:0;padding:0}
.menu a{display:block;position:relative;padding:35px 24.5px;font:300 15px/20px "Varela Round",sans-serif;color:#fff}
.menu li:last-child a{padding-right:0}
.menu li:first-child a{padding-left:24.5px}
.menu a::after{content:"";position:absolute;left:24.5px;right:24.5px;bottom:0;height:3px;background:var(--cyan);transform:scaleX(0);transition:transform .25s}
.menu li:last-child a::after{right:0}
.menu a:hover::after,.menu a.active::after{transform:scaleX(1)}
.menu-toggle{display:none;background:none;border:0;color:#fff;font-size:25px;line-height:1;padding:8px 12px;margin-left:auto;cursor:pointer}

/* Portada */
.hero{position:relative;padding:13% 0 5%;background:#000 center/cover no-repeat;color:#fff;overflow:hidden}
.hero-video{position:absolute;inset:0;overflow:hidden}
.hero-video iframe{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border:0;pointer-events:none}
.hero-overlay{position:absolute;inset:0;background:center/cover no-repeat}
.hero .wrap{padding-top:20px}
.hero-text{margin:0 0 0 10px;width:min(100% - 20px,690px)}
.hero-text .t1{font:400 clamp(24px,2.3vw,32px)/1.45 Roboto,sans-serif;margin:0}
.hero-text .t2{font-size:clamp(19px,1.75vw,24px);line-height:1.5}
.hero-text .bar{margin:35px 0 35.5px}
.hero b,.hero strong{font-weight:700}
.hero-mobile-video{display:none;width:100%;margin-bottom:20px}

/* Tarjetas de cifras de la portada */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:clamp(48px,7vw,96px) 10px 0}
.stat{background:rgba(255,255,255,.93);color:var(--dark);border-radius:16px;padding:16px 18px 14px;box-shadow:0 10px 30px rgba(0,0,0,.18);backdrop-filter:blur(6px)}
.stat-top{display:flex;justify-content:space-between;align-items:center;gap:8px;font:500 12px/1.2 Montserrat,sans-serif;letter-spacing:.8px;text-transform:uppercase;color:#4a4553;min-height:30px}
.stat-top i{font-size:14px;color:var(--primary);opacity:.8}
.stat-num{font:500 clamp(40px,4.2vw,58px)/1.1 Montserrat,sans-serif;color:var(--dark);margin-top:8px;letter-spacing:-1px}
.stat-num sup{font-size:.5em;font-weight:500;color:var(--secondary);margin-left:2px;vertical-align:top;position:relative;top:.1em}

/* Efecto máquina de escribir (la frase más larga reserva el ancho: el resto del texto no se mueve) */
.tw{position:relative;display:inline-block;white-space:nowrap;vertical-align:baseline}
.tw .ghost{visibility:hidden}
.tw .live{position:absolute;left:0;top:0;white-space:nowrap}
.tw .live::after{content:"";display:inline-block;width:2px;height:.95em;margin-left:2px;background:currentColor;vertical-align:-.12em;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}

/* Somos */
.about,.services,.clients,.contact{padding-top:5%;padding-bottom:5%}
.about .col{padding:10px}
.about-text{padding-left:10px}
.a-title,.a-sub{display:block;font:300 clamp(32px,3.15vw,43px)/1.7 Montserrat,sans-serif}
.a-title{margin-bottom:20px}
.a-sub{color:var(--violet);margin:-1.09em 0 57px}
.a-body{font-weight:300;margin-bottom:60px;max-width:480px}
.a-body b{font-weight:700}
.about-img{padding:20px 10px}
.about-img img{display:block;width:100%;max-width:540px;height:auto;border-radius:0 10% 0 10%}

/* Títulos de sección */
.h-light{display:block;font:300 clamp(26px,2.86vw,39px)/1 Montserrat,sans-serif;color:var(--text);margin-bottom:20px}
.h-bold{display:block;font:700 clamp(32px,3.51vw,48px)/1 Montserrat,sans-serif;color:var(--primary);margin-bottom:20px}
.head .col:first-child{padding-left:10px}
.head-img img{display:block;width:100%;max-width:550px;margin-left:auto}
.anchor{height:50px}

/* Servicios */
.services{background:#fff}
.svc-grid{display:flex;flex-wrap:wrap}
.svc{width:50%;padding:10px 10px 10px 20px;margin-bottom:20px}
.svc-n{font:300 clamp(32px,3.51vw,48px)/1 Montserrat,sans-serif;color:var(--text);margin-bottom:20px}
.svc-t{font:700 clamp(20px,1.83vw,25px)/1.1 Montserrat,sans-serif;color:var(--violet);margin-bottom:20px}
.svc-sub{font:500 16px/1.4 Roboto,sans-serif;color:#6a6371;margin:-10px 0 16px}
.svc-p{font-weight:300;margin-bottom:20px}
.svc-cta{display:flex;align-items:center;justify-content:center;padding-top:10px}

/* Clientes */
.clients{background:#fff}
.logos{display:flex;flex-wrap:wrap;margin-top:30px}
.logo-cell{width:25%;height:154px;padding:0 10px;display:flex;align-items:center;justify-content:center}
.logo-cell a{display:flex;align-items:center;justify-content:center;width:100%;height:100%;transition:transform .25s}
.logo-cell a:hover{transform:scale(1.06)}
.logo-cell img{width:154px;max-width:100%;max-height:154px;height:auto;object-fit:contain}

/* Referencias laborales */
.refs{margin:50px 10px 0;padding-top:30px;border-top:1px solid #e3e1e8}
.refs-t{font:700 clamp(22px,2vw,28px)/1.2 Montserrat,sans-serif;color:var(--primary);margin-bottom:22px}
.refs-list{list-style:none;margin:0;padding:0;columns:3 260px;column-gap:40px}
.refs-list li{break-inside:avoid;position:relative;padding:5px 0 5px 22px;font:300 clamp(16px,1.25vw,18px)/1.45 Roboto,sans-serif;color:var(--text)}
.refs-list li::before{content:"";position:absolute;left:2px;top:.85em;width:8px;height:8px;border-radius:50%;background:var(--cyan)}

/* Contacto */
.contact{background:center left/auto no-repeat;color:#fff}
.contact .h-light,.contact .h-bold{color:#fff}
.contact .head{margin-bottom:-19px}
.contact .head .col:first-child,.contact .c-info{padding-left:0}
.tagline{font:300 clamp(17px,1.54vw,21px)/1.1 Montserrat,sans-serif;color:#fff;margin:53px 0 20px}
.c-info{font-weight:300}
.c-info p{margin-bottom:20px}
.c-info b{font-weight:700}
.c-info a:hover{text-decoration:underline}
.soc-label{margin-bottom:10px!important}
.socials{display:flex;gap:5px}
.socials a{display:flex;align-items:center;justify-content:center;width:50px;height:50px;font-size:25px;color:#fff;border-radius:10%}
.c-form form{display:flex;flex-direction:column;gap:10px;margin-top:0}
.c-form input,.c-form textarea{width:100%;font:400 15px/1.4 Montserrat,sans-serif;color:var(--dark);background:#fff;border:1px solid #69727d;border-radius:0;padding:10px;height:48px}
.c-form textarea{height:96px;border-radius:3px;padding:5px 14px;resize:vertical}
.c-form .row2{display:flex;gap:14px}
.c-form .row2 .fld{flex:1;min-width:0}
.c-form .fld{display:block}
.c-form .err{display:block;min-height:0;font:500 13px/1.3 Montserrat,sans-serif;color:#ffd0d0;margin-top:5px}
.c-form .err:empty{display:none}
.c-form [aria-invalid=true]{border-color:#ff6b6b;box-shadow:0 0 0 2px rgba(255,107,107,.45)}
.c-form .is-ok:not([aria-invalid=true]){border-color:#5fd39a}
.c-form button{font:700 15px/1 Montserrat,sans-serif;text-transform:uppercase;color:#fff;background:#421D89;border:0;border-radius:3px;height:40px;cursor:pointer}
.c-form button:disabled{opacity:.6;cursor:wait}
.c-form .hp{position:absolute;left:-9999px;height:0;width:0;opacity:0}
.form-msg{font:400 15px/1.4 Montserrat,sans-serif}
.form-msg:empty{display:none}
.form-msg.err{color:#ffb4b4}

/* Mapa y pie */
.map{position:relative;background:var(--dark)}
.map-btn{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:10px;background:#fff;color:var(--primary);font:600 17px/1.2 Montserrat,sans-serif;padding:16px 30px;border-radius:50px;box-shadow:0 8px 24px rgba(0,0,0,.28);white-space:nowrap;transition:transform .25s,box-shadow .25s,background .25s}
.map-btn i{color:var(--secondary);font-size:20px}
.map-btn:hover{transform:translateX(-50%) translateY(-3px);box-shadow:0 12px 30px rgba(0,0,0,.35);background:#f5f7ff}
.map iframe{display:block}
.site-footer{padding:1% 0 2%;text-align:center;font:300 14px/1.7 Montserrat,sans-serif;color:#fff}
.site-footer p{padding:0 10px}

/* WhatsApp */
.wa{position:fixed;right:20px;bottom:20px;z-index:50;display:flex;align-items:center;gap:8px}
.wa-bubble{background:#fff;color:#000;font:400 11px/1.4 Arial,sans-serif;padding:10px 12px;border-radius:4px;box-shadow:0 2px 8px rgba(0,0,0,.2);max-width:130px}
.wa-btn{display:flex;align-items:center;justify-content:center;width:50px;height:50px;border-radius:50%;background:#2db742;color:#fff;font-size:30px;box-shadow:0 2px 8px rgba(0,0,0,.3)}

/* Revelado al hacer scroll */
.rv{opacity:0;transform:translate3d(0,38px,0);transition:opacity .8s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.rv[data-rv=left]{transform:translate3d(-70px,0,0)}
.rv[data-rv=right]{transform:translate3d(70px,0,0)}
.rv[data-rv=zoom]{transform:scale(.7) translate3d(0,20px,0)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.tw .live::after{animation:none}}

/* Tablet */
@media (max-width:1024px){
  .menu-toggle{display:block}
  .menu{position:absolute;top:100%;left:0;right:0;width:auto;margin:0;background:#fff;display:none}
  .menu.open{display:block}
  .menu ul{flex-direction:column}
  .menu a{color:#3d4459;padding:15px 16px;font-size:15px}
  .menu a::after{left:0;right:0;bottom:auto;top:0;height:0}
  .menu li:last-child a{padding-right:16px}
  .hero-text{width:min(100% - 20px,640px)}
  .stats{grid-template-columns:repeat(2,1fr)}
  .wrap{padding:0 10px}
}
/* Celular */
@media (max-width:767px){
  .site-header{height:75px}
  .header-in{height:75px;padding-left:20px}
  .brand{width:130px}
  .hero{padding:0;margin-top:83px;background-size:cover}
  .hero-video{display:none}
  .hero .wrap{min-height:0;padding:20px 20px 30px}
  .hero-text{width:100%;margin:0}
  .stats{margin:36px 0 0;gap:10px}
  .stat{padding:12px 14px}
  .hero-mobile-video{display:block}
  .col,.svc{width:100%}
  .about{padding-left:5%;padding-right:5%}
  .about-text{padding-left:10px}
  .about-img img{margin:0 auto}
  .head-img img{margin:0}
  .services{padding-left:5%;padding-right:5%}
  .svc{padding-left:10px}
  .logo-cell{width:50%}
  .contact{background-size:cover}
  .c-form .row2{flex-direction:column;gap:10px}
  .c-form .row2 .fld{flex:none}
  .wa-bubble{display:none}
  .btn-serter{font-size:17px;padding:16px 30px}
  }