:root{
  --azul:#000F76;
  --azul-medio:#4472C4;
  --terracota:#DA906E;
  --texto:#383838;
  --claro:#EFF3FA;
  --oscuro:#1B1917;
  --blanco:#ffffff;
  /* Toque argentino */
  --pais:#74ACDF;
  --pais-suave:#EAF4FC;
  --sol:#F6B40E;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Manrope',sans-serif;color:var(--texto);font-size:16px;line-height:1.7;background:var(--blanco)}
h1,h2,h3,h4{font-family:'Urbanist',sans-serif;color:var(--azul);line-height:1.25}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
.contenedor{max-width:1140px;margin:0 auto;padding:0 20px}
section{padding:80px 0}

/* ===== Cinta país (toque argentino) ===== */
.cinta-pais{height:6px;background:linear-gradient(90deg,var(--pais) 0 33%,#fff 33% 50%,var(--sol) 50% 52%,#fff 52% 67%,var(--pais) 67% 100%);position:sticky;top:0;z-index:901}

/* ===== Barra superior ===== */
.barra-top{background:var(--azul);color:#fff;font-size:13.5px;padding:8px 0}
.barra-top .contenedor{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.barra-top .datos{display:flex;gap:22px;flex-wrap:wrap}
.barra-top .datos span{display:flex;align-items:center;gap:7px;opacity:.92}
.barra-top svg{flex:none}

/* ===== Selector de país ===== */
.selector-pais{position:relative;font-family:'Urbanist',sans-serif;font-weight:700}
.selector-pais>button{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.35);color:#fff;padding:5px 12px;border-radius:99px;cursor:pointer;font:inherit;font-size:13px;transition:background .2s}
.selector-pais>button:hover{background:rgba(255,255,255,.25)}
.selector-pais .bandera{width:20px;height:20px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 1.5px rgba(255,255,255,.8);flex:none}
.selector-pais .bandera svg{width:100%;height:100%;display:block}
.selector-pais .flecha{transition:transform .2s}
.selector-pais.abierto .flecha{transform:rotate(180deg)}
.menu-paises{position:absolute;top:calc(100% + 10px);right:0;background:#fff;border-radius:14px;box-shadow:0 12px 35px rgba(0,15,118,.22);padding:8px;min-width:210px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:all .22s;z-index:1000}
.selector-pais.abierto .menu-paises{opacity:1;visibility:visible;transform:translateY(0)}
.menu-paises a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;color:var(--texto);font-size:14px;transition:background .15s}
.menu-paises a:hover{background:var(--claro)}
.menu-paises a.actual{background:var(--pais-suave);color:var(--azul);pointer-events:none}
.menu-paises .bandera{box-shadow:0 0 0 1.5px rgba(0,0,0,.08)}
.menu-paises small{display:block;font-family:'Manrope',sans-serif;font-weight:500;font-size:11.5px;color:#8a8f9d;line-height:1.2}

/* ===== Header ===== */
header{background:#fff;position:sticky;top:6px;z-index:900;box-shadow:0 2px 18px rgba(0,15,118,.08)}
header .contenedor{display:flex;align-items:center;justify-content:space-between;height:82px;gap:20px}
.marca{display:flex;align-items:center;gap:12px}
.marca img{width:56px;height:auto}
.marca .nombre{font-family:'Urbanist',sans-serif;font-weight:900;font-size:21px;color:var(--azul);letter-spacing:.5px;line-height:1.1}
.marca .lema{font-size:11.5px;color:var(--terracota);font-weight:600;letter-spacing:.2px}
nav.principal{display:flex;align-items:center;gap:28px}
nav.principal>a, nav.principal .desplegable>a{font-family:'Urbanist',sans-serif;font-weight:700;font-size:15px;color:var(--texto);padding:8px 0;transition:color .2s}
nav.principal>a:hover, nav.principal .desplegable:hover>a{color:var(--azul)}
.desplegable{position:relative}
.desplegable>a::after{content:"▾";font-size:11px;margin-left:5px;color:var(--terracota)}
.submenu{position:absolute;top:100%;left:-14px;background:#fff;border-radius:12px;box-shadow:0 14px 40px rgba(0,15,118,.16);padding:10px;min-width:280px;opacity:0;visibility:hidden;transform:translateY(8px);transition:all .22s}
.desplegable:hover .submenu{opacity:1;visibility:visible;transform:translateY(0)}
.submenu a{display:block;padding:9px 14px;border-radius:8px;font-size:14px;font-weight:600;color:var(--texto)}
.submenu a:hover{background:var(--claro);color:var(--azul)}
.btn-wsp-header{display:flex;align-items:center;gap:8px;background:var(--azul);color:#fff;font-family:'Urbanist',sans-serif;font-weight:700;font-size:14px;padding:11px 20px;border-radius:99px;transition:background .2s;white-space:nowrap}
.btn-wsp-header:hover{background:var(--azul-medio)}
.hamburguesa{display:none;background:none;border:none;cursor:pointer;padding:6px}
.hamburguesa span{display:block;width:26px;height:3px;background:var(--azul);margin:5px 0;border-radius:2px;transition:.25s}

/* ===== Hero (slider con zoom lento tipo Ken Burns, como la web de España) ===== */
.hero{background:var(--azul);color:#fff;padding:110px 0;position:relative}
.hero-slides{position:absolute;inset:0;overflow:hidden;z-index:0}
.hero-slides .slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity 2s ease}
.hero-slides .slide.activa{opacity:1;animation:kenburns 9s ease-out forwards}
@keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.18)}}
.hero-slides::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(0,15,118,.88),rgba(0,15,118,.72))}
.hero .contenedor{position:relative;z-index:2;max-width:900px;text-align:center}
.insignia-pais{display:inline-flex;align-items:center;gap:9px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.35);padding:7px 18px;border-radius:99px;font-family:'Urbanist',sans-serif;font-weight:700;font-size:14px;margin-bottom:26px;backdrop-filter:blur(4px)}
.insignia-pais .bandera{width:22px;height:22px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 1.5px rgba(255,255,255,.7)}
.insignia-pais .bandera svg{width:100%;height:100%}
.hero h1{color:#fff;font-size:clamp(34px,5.4vw,64px);font-weight:900;margin-bottom:10px}
.hero .sub{font-family:'Urbanist',sans-serif;font-size:clamp(17px,2.2vw,22px);color:var(--terracota);font-weight:700;margin-bottom:22px}
.hero p.bajada{max-width:760px;margin:0 auto 38px;font-size:16.5px;opacity:.94}
.hero .botones{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.btn{display:inline-block;font-family:'Urbanist',sans-serif;font-weight:800;font-size:15px;padding:16px 42px;border-radius:99px;transition:all .22s;letter-spacing:.3px}
.btn-primario{background:var(--terracota);color:#fff}
.btn-primario:hover{background:#c67a58;transform:translateY(-2px)}
.btn-borde{border:2px solid rgba(255,255,255,.7);color:#fff}
.btn-borde:hover{background:#fff;color:var(--azul)}
/* Tarjeta "Soporte 24/7" — ahora vive dentro del collage de Quiénes somos, como en España */
.tarjeta-soporte{background:var(--azul);color:#fff;border-radius:18px;padding:26px 24px;box-shadow:0 16px 40px rgba(0,15,118,.22)}
.tarjeta-soporte .cabecera{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.tarjeta-soporte .icono{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;flex:none}
.tarjeta-soporte h3{color:#fff;font-size:18px}
.tarjeta-soporte p{font-size:13.5px;opacity:.92;line-height:1.6}

/* ===== Secciones genéricas ===== */
.etiqueta{display:inline-block;font-family:'Urbanist',sans-serif;font-weight:800;font-size:13px;letter-spacing:2.5px;text-transform:uppercase;color:var(--terracota);margin-bottom:10px}
.titulo{font-size:clamp(26px,3.6vw,38px);font-weight:800;margin-bottom:18px}
.centrado{text-align:center}
.centrado .titulo{max-width:720px;margin-left:auto;margin-right:auto}
.intro{max-width:780px;margin:0 auto 20px;color:#5a5f6d}

/* ===== Quiénes somos (collage de dos fotos, como la web de España) ===== */
.quienes .contenedor{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center}
.collage{display:grid;grid-template-columns:1.1fr .9fr;gap:20px;align-items:start}
.collage .col{display:flex;flex-direction:column;gap:20px}
.collage img{width:100%;border-radius:18px;box-shadow:0 16px 40px rgba(0,15,118,.14);object-fit:cover}
.collage .col-a img{height:300px}
.collage .col-b img{height:430px}
.contador{background:var(--claro);border-radius:16px;padding:26px 20px;text-align:center}
.contador .num{font-family:'Urbanist',sans-serif;font-weight:900;font-size:44px;line-height:1.1;color:var(--azul)}
.contador .txt{font-size:14.5px;color:var(--texto)}
.quienes p{margin-bottom:16px;color:#5a5f6d}

/* ===== Servicios ===== */
.servicios{background:var(--claro)}
.grilla-servicios{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:50px}
.tarjeta-servicio{background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 8px 26px rgba(0,15,118,.07);transition:transform .25s,box-shadow .25s;display:flex;flex-direction:column;text-align:left}
.tarjeta-servicio:hover{transform:translateY(-7px);box-shadow:0 18px 44px rgba(0,15,118,.14)}
.tarjeta-servicio .imagen{height:180px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--claro),#fff)}
.tarjeta-servicio .imagen img{width:auto;height:auto;max-height:135px;max-width:65%;object-fit:contain;transition:transform .4s}
.tarjeta-servicio:hover .imagen img{transform:scale(1.06)}
.tarjeta-servicio .cuerpo{padding:26px 26px 30px;display:flex;flex-direction:column;flex:1}
.tarjeta-servicio h3{font-size:19px;margin-bottom:10px}
.tarjeta-servicio p{font-size:14px;color:#5a5f6d;flex:1;margin-bottom:18px}
.ver-mas{font-family:'Urbanist',sans-serif;font-weight:800;font-size:13px;letter-spacing:1.5px;color:var(--terracota)}
.ver-mas:hover{color:var(--azul)}

/* ===== CTA (con parallax: la imagen queda fija y se revela al scrollear) ===== */
.cta{background:linear-gradient(rgba(0,15,118,.62),rgba(0,15,118,.55)),url('https://mimayben.com/wp-content/uploads/2025/11/1.jpg') center/cover;background-attachment:fixed;color:#fff;text-align:center;border-radius:0;padding:110px 0;text-shadow:0 1px 10px rgba(0,15,118,.5)}
.cta .etiqueta{color:var(--sol)}
.cta h2{color:#fff;font-size:clamp(24px,3.4vw,36px);font-weight:800;max-width:760px;margin:0 auto 14px}
.cta p{max-width:640px;margin:0 auto 34px;opacity:.92}

/* ===== Pasos ===== */
.pasos-grilla{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;margin-top:50px}
.paso{background:#fff;border:1.5px solid #e4e9f5;border-radius:18px;padding:32px 26px;position:relative;transition:border-color .2s,transform .2s}
.paso:hover{border-color:var(--pais);transform:translateY(-5px)}
.paso .numero{width:46px;height:46px;border-radius:50%;background:var(--azul);color:#fff;font-family:'Urbanist',sans-serif;font-weight:900;font-size:19px;display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.paso h3{font-size:17px;margin-bottom:8px}
.paso p{font-size:14px;color:#5a5f6d}

/* ===== Por qué elegirnos ===== */
.porque{background:var(--claro)}
.porque-grilla{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;margin-top:50px}
.razon{background:#fff;border-radius:18px;padding:34px 26px;text-align:center;box-shadow:0 8px 26px rgba(0,15,118,.06)}
.razon .icono{width:62px;height:62px;margin:0 auto 18px;border-radius:16px;background:var(--pais-suave);display:flex;align-items:center;justify-content:center}
.razon h3{font-size:16.5px;margin-bottom:8px}
.razon p{font-size:13.5px;color:#5a5f6d}

/* ===== Secciones de dos columnas (texto izquierda, grilla derecha) como España ===== */
.dos-col{display:grid;grid-template-columns:.9fr 1.1fr;gap:54px;align-items:center}
.dos-col .col-texto .intro{margin:0}
.dos-col .pasos-grilla,.dos-col .porque-grilla{grid-template-columns:repeat(2,1fr);margin-top:0}

/* ===== Contacto ===== */
.contacto-grilla{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;margin-top:46px;align-items:start}
.dato-contacto{display:flex;gap:16px;margin-bottom:24px}
.dato-contacto .icono{width:48px;height:48px;border-radius:12px;background:var(--claro);display:flex;align-items:center;justify-content:center;flex:none}
.dato-contacto h4{font-size:15.5px;margin-bottom:2px}
.dato-contacto p{font-size:14.5px;color:#5a5f6d}
.formulario{background:#fff;border-radius:20px;box-shadow:0 16px 44px rgba(0,15,118,.1);padding:38px}
.formulario .fila{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.formulario label{font-family:'Urbanist',sans-serif;font-weight:700;font-size:13.5px;color:var(--azul);display:block;margin:14px 0 6px}
.formulario input,.formulario textarea{width:100%;border:1.5px solid #dde3f0;border-radius:10px;padding:12px 14px;font-family:'Manrope',sans-serif;font-size:14.5px;color:var(--texto);transition:border-color .2s;background:#fbfcff}
.formulario input:focus,.formulario textarea:focus{outline:none;border-color:var(--azul-medio)}
.formulario textarea{min-height:120px;resize:vertical}
.formulario button{margin-top:22px;width:100%;border:none;cursor:pointer}

/* ===== Footer ===== */
footer{background:var(--oscuro);color:#c9ccd6}
.footer-arriba{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:50px;padding:70px 0 50px}
.footer-arriba .marca .nombre{color:#fff}
.footer-arriba p{font-size:14px;margin-top:16px;color:#a7abb8}
.footer-arriba h4{color:#fff;font-size:16px;margin-bottom:18px}
.footer-arriba ul{list-style:none}
.footer-arriba li{margin-bottom:10px}
.footer-arriba li a{font-size:14px;color:#a7abb8;transition:color .2s}
.footer-arriba li a:hover{color:var(--terracota)}
.footer-contacto span{display:block;font-size:13px;color:#8a8f9d}
.footer-contacto strong{color:#fff;font-weight:600;font-size:14.5px}
.footer-paises{display:flex;gap:10px;margin-top:22px}
.footer-paises a{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);padding:7px 14px;border-radius:99px;font-size:13px;font-weight:600;transition:background .2s}
.footer-paises a:hover{background:rgba(255,255,255,.16)}
.footer-paises .bandera{width:18px;height:18px;border-radius:50%;overflow:hidden}
.footer-paises .bandera svg{width:100%;height:100%}
.footer-abajo{border-top:1px solid rgba(255,255,255,.1);padding:20px 0;font-size:13px}
.footer-abajo .contenedor{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* ===== WhatsApp flotante ===== */
.wsp-flotante{position:fixed;bottom:26px;right:26px;width:58px;height:58px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 28px rgba(37,211,102,.45);z-index:950;transition:transform .2s}
.wsp-flotante:hover{transform:scale(1.1)}

/* ===== Animaciones de aparición al hacer scroll (como la web de España) =====
   Las clases las asigna animaciones.js; sin JavaScript todo queda visible. */
.anim{opacity:0;transition:opacity .9s ease,transform .9s ease;transition-delay:var(--anim-delay,0s)}
.anim-izq{transform:translateX(-70px)}
.anim-der{transform:translateX(70px)}
.anim-sube{transform:translateY(46px)}
.anim-baja{transform:translateY(-46px)}
.anim-fade{transform:none}
.anim.visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.anim{opacity:1;transform:none;transition:none}}

/* ===== Aviso de geolocalización ===== */
.aviso-geo{position:fixed;bottom:26px;left:26px;max-width:350px;background:#fff;border-left:4px solid var(--pais);border-radius:14px;box-shadow:0 14px 40px rgba(0,15,118,.22);padding:16px 42px 16px 18px;font-size:13.5px;color:#5a5f6d;line-height:1.5;z-index:980;animation:aviso-entra .4s ease}
.aviso-geo strong{color:var(--azul);display:block;margin-bottom:3px;font-family:'Urbanist',sans-serif;font-size:14.5px}
.aviso-geo button{position:absolute;top:8px;right:10px;border:none;background:none;font-size:17px;color:#8a8f9d;cursor:pointer;line-height:1}
@keyframes aviso-entra{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* ===== Responsive ===== */
@media(max-width:960px){
  .grilla-servicios{grid-template-columns:repeat(2,1fr)}
  .pasos-grilla,.porque-grilla{grid-template-columns:repeat(2,1fr)}
  .quienes .contenedor,.contacto-grilla,.dos-col{grid-template-columns:1fr}
  .footer-arriba{grid-template-columns:1fr 1fr}
  nav.principal{position:fixed;inset:0 0 0 auto;width:300px;background:#fff;flex-direction:column;align-items:flex-start;padding:90px 30px 30px;gap:6px;box-shadow:-10px 0 40px rgba(0,0,0,.15);transform:translateX(100%);transition:transform .3s;z-index:960}
  nav.principal.abierta{transform:translateX(0)}
  nav.principal>a,nav.principal .desplegable>a{font-size:17px;padding:10px 0}
  .submenu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;padding:0 0 0 14px;min-width:0}
  .btn-wsp-header{display:none}
  .hamburguesa{display:block;z-index:970}
  .barra-top .datos span:nth-child(n+2){display:none}
}
@media(max-width:960px){
  /* En móviles/tablets el parallax fijo no funciona bien (iOS): la imagen scrollea normal */
  .cta{background-attachment:scroll}
}
@media(max-width:600px){
  section{padding:60px 0}
  .grilla-servicios,.pasos-grilla,.porque-grilla,.footer-arriba,.dos-col .pasos-grilla,.dos-col .porque-grilla{grid-template-columns:1fr}
  .collage{gap:14px}
  .collage .col{gap:14px}
  .collage .col-a img{height:170px}
  .collage .col-b img{height:250px}
  .contador{padding:18px 12px}
  .contador .num{font-size:32px}
  .tarjeta-soporte{padding:20px 18px}
  .hero{padding:80px 0}
  .formulario{padding:26px}
  .formulario .fila{grid-template-columns:1fr}
}

/* ===== Páginas interiores ===== */
.banner-pagina{background:linear-gradient(rgba(0,15,118,.9),rgba(0,15,118,.82)),url('https://mimayben.com/wp-content/uploads/2025/11/9.jpg') center/cover;color:#fff;padding:70px 0 60px}
.banner-pagina h1{color:#fff;font-size:clamp(30px,4vw,46px);font-weight:900;margin-bottom:10px}
.migas{font-size:14px;opacity:.9}
.migas a{color:var(--terracota);font-weight:700}
.migas a:hover{color:#fff}
.detalle-grilla{display:grid;grid-template-columns:1.3fr .8fr;gap:56px;align-items:start}
.detalle p{margin-bottom:16px;color:#5a5f6d}
.detalle h2{margin:10px 0 6px}
.lista-checks{list-style:none;margin:18px 0;padding:0}
.lista-checks li{padding-left:36px;position:relative;margin-bottom:12px;color:#454a57}
.lista-checks li::before{content:"✓";position:absolute;left:0;top:1px;width:24px;height:24px;border-radius:50%;background:var(--pais-suave);color:var(--azul);font-weight:800;display:flex;align-items:center;justify-content:center;font-size:13px}
.caja-experiencia{background:var(--azul);color:#fff;border-radius:18px;padding:38px 30px;text-align:center;position:sticky;top:130px;box-shadow:0 18px 44px rgba(0,15,118,.25)}
.caja-experiencia .num{font-family:'Urbanist',sans-serif;font-size:54px;font-weight:900;color:var(--terracota);line-height:1.1}
.caja-experiencia .txt{font-size:15px;opacity:.92;margin-bottom:18px}
.caja-experiencia .icono-servicio{width:110px;height:110px;border-radius:20px;background:#fff;margin:0 auto 20px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.caja-experiencia .icono-servicio img{max-width:80%;max-height:80%;object-fit:contain}
.faq{background:var(--claro)}
.faq-lista{max-width:840px;margin:44px auto 0;text-align:left}
.faq-lista details{background:#fff;border-radius:14px;margin-bottom:14px;box-shadow:0 6px 20px rgba(0,15,118,.06);overflow:hidden}
.faq-lista summary{cursor:pointer;padding:18px 22px;font-family:'Urbanist',sans-serif;font-weight:800;font-size:15.5px;color:var(--azul);list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px}
.faq-lista summary::-webkit-details-marker{display:none}
.faq-lista summary::after{content:"+";font-size:24px;color:var(--terracota);flex:none;line-height:1}
.faq-lista details[open] summary::after{content:"−"}
.faq-lista .faq-cuerpo{padding:0 22px 20px;color:#5a5f6d;font-size:14.5px}
.mision-grilla{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:46px}
@media(max-width:960px){.detalle-grilla{grid-template-columns:1fr}.caja-experiencia{position:static}.mision-grilla{grid-template-columns:1fr}}