{} *{} #IE-warning { display: none; position: fixed; width: 100%; height: 100%; z-index: 9999; background: white; } .IE-warning-message { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; } :root{ --azul:#031f2b; --azul2:#062f3c; --turquesa:#00b8c4; --verde:#25d366; --blanco:#fff; --claro:#f2f7f8; --texto:#24343b; --sombra:0 18px 50px rgba(3,31,43,.12); } *{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--texto);background:#fff} img{max-width:100%;display:block} a{text-decoration:none} .contenedor{width:min(92%,1180px);margin:auto} .mst-header{ position:fixed;top:0;left:0;width:100%;z-index:9999; color:#fff;background:rgba(3,31,43,.92); border-bottom:1px solid rgba(255,255,255,.12); backdrop-filter:blur(12px) } .mst-header-inner{width:min(95%,1450px);min-height:88px;margin:auto;display:flex;align-items:center;gap:22px} .mst-brand{display:flex;align-items:center;gap:12px;color:#fff;flex:0 0 auto} .mst-brand img{width:66px;height:66px;object-fit:contain} .mst-brand-text{display:flex;flex-direction:column;line-height:1} .mst-brand-main{font-weight:700;font-size:20px;letter-spacing:.055em} .mst-brand-sub{margin-top:7px;color:var(--turquesa);font-size:12px;font-weight:700;letter-spacing:.24em} .mst-nav{display:flex;align-items:center;gap:clamp(14px,1.4vw,27px);margin-left:auto} .mst-nav a{min-height:88px;display:flex;align-items:center;color:#fff;font-size:14px;font-weight:700;white-space:nowrap} .mst-nav a:hover,.mst-nav a.active{color:var(--turquesa)} .mst-wa{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border-radius:8px;background:var(--verde);color:#fff;font-weight:700;white-space:nowrap} .mst-menu-toggle{display:none;margin-left:auto;width:46px;height:46px;border:0;background:transparent;color:#fff;cursor:pointer} .mst-menu-toggle span{display:block;width:28px;height:2px;margin:6px auto;background:currentColor} main{padding-top:88px} section{padding:76px 0} .hero-herramientas{ min-height:620px;display:flex;align-items:center;color:#fff; background:linear-gradient(rgba(3,31,43,.74),rgba(3,31,43,.74)), url("https://images.pexels.com/photos/14606488/pexels-photo-14606488.jpeg?auto=compress&cs=tinysrgb&w=1920") center/cover } .hero-contenido{max-width:850px} .etiqueta,.sobre-titulo{color:var(--turquesa);font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:13px} h1{font-size:clamp(42px,6vw,74px);line-height:1.05;margin:18px 0} h2{font-size:clamp(31px,4vw,48px);line-height:1.15;margin:14px 0 20px;color:var(--azul)} h3{color:var(--azul)} .hero-contenido p{font-size:20px;line-height:1.7;max-width:800px} .botones{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px} .boton{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 24px;border-radius:8px;font-weight:700} .boton-principal{background:var(--turquesa);color:#fff} .boton-secundario{border:1px solid rgba(255,255,255,.7);color:#fff} .franja{background:var(--azul);color:#fff} .franja-contenido{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:26px 0} .franja-contenido div{font-weight:700}.franja-contenido span{color:var(--turquesa);margin-right:8px} .introduccion{max-width:900px;text-align:center} .introduccion p,.herramienta p,.ecosistema p,.contacto p{font-size:17px;line-height:1.75} .fondo-claro{background:var(--claro)} .herramienta{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center;margin:0 0 90px} .herramienta-invertida .herramienta-imagen{order:2} .herramienta-imagen img{width:100%;height:480px;object-fit:cover;border-radius:16px;box-shadow:var(--sombra)} .numero-herramienta{font-size:60px;font-weight:800;color:rgba(0,184,196,.18)} .destacado{font-size:20px!important;font-weight:700;color:var(--azul)} .lista-datos{display:grid;grid-template-columns:1fr 1fr;gap:10px 22px;padding-left:20px;margin:26px 0} .ecosistema{background:var(--azul);color:#fff} .ecosistema h2,.ecosistema h3{color:#fff} .ecosistema-contenido{display:grid;grid-template-columns:1.2fr .8fr;gap:50px;align-items:center} .ecosistema-tarjetas{display:grid;gap:18px} .ecosistema-tarjeta{padding:24px;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12)} .contacto{text-align:center;max-width:820px;margin:auto;padding:38px;border-radius:18px;background:var(--claro)} .mst-footer{padding:68px 0 25px;color:rgba(255,255,255,.78);background:linear-gradient(135deg,var(--azul2),var(--azul))} .mst-footer-inner{width:min(92%,1180px);margin:auto} .mst-footer-grid{display:grid;grid-template-columns:1.3fr .8fr 1fr 1fr;gap:42px;margin-bottom:44px} .mst-footer-logo{display:flex;align-items:center;gap:15px;margin-bottom:20px;color:#fff} .mst-footer-logo img{width:88px;height:88px;object-fit:contain} .mst-footer-name{display:flex;flex-direction:column;line-height:1} .mst-footer-main{font-size:20px;font-weight:700;letter-spacing:.055em} .mst-footer-sub{margin-top:7px;color:var(--turquesa);font-size:12px;font-weight:700;letter-spacing:.24em} .mst-footer-column h3{color:#fff} .mst-footer-links{display:grid;gap:10px} .mst-footer-links a,.mst-footer-contact a{color:rgba(255,255,255,.78)} .mst-footer-links a:hover,.mst-footer-contact a:hover{color:var(--turquesa)} .mst-footer-bottom{padding-top:24px;border-top:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.62);font-size:14px} @media(max-width:1050px){ .mst-wa{display:none}.mst-menu-toggle{display:block} .mst-nav{position:absolute;top:88px;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;padding:14px 5% 24px;background:var(--azul)} .mst-nav.open{display:flex}.mst-nav a{min-height:auto;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.1)} .herramienta,.ecosistema-contenido{grid-template-columns:1fr} .herramienta-invertida .herramienta-imagen{order:0} .mst-footer-grid{grid-template-columns:1fr 1fr} } @media(max-width:700px){ main{padding-top:78px}.mst-header-inner{min-height:78px}.mst-brand img{width:54px;height:54px} .mst-nav{top:78px}.franja-contenido{grid-template-columns:1fr 1fr} .herramienta-imagen img{height:330px}.lista-datos{grid-template-columns:1fr} .mst-footer-grid{grid-template-columns:1fr} }