/* ===== Identidad de marca - Superando y Educando S.A.S. ===== */
:root{
  --marca-azul:#295c88;
  --marca-azul-osc:#214c70;
  --marca-verde:#a6ca46;
  --marca-gris:#5b6573;
  --marca-fondo:#eef1f6;
  --wa:#25d366;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--marca-fondo);color:#0f1620}
a{text-decoration:none}

/* ---- Topbar ---- */
.m-topbar{background:var(--marca-azul-osc);color:#e3ebf4;font-size:.82rem}
.m-topbar .m-wrap{max-width:1180px;margin:0 auto;padding:7px 20px;display:flex;flex-wrap:wrap;gap:18px;align-items:center}
.m-topbar a{color:#e3ebf4;display:inline-flex;align-items:center;gap:6px}
.m-topbar a:hover{color:#fff}
.m-topbar svg{width:15px;height:15px}

/* ---- Cabecera: blanco + franja verde diagonal + azul ---- */
.m-header{position:relative;background:#fff;height:92px;overflow:hidden}
.m-header .m-logo{position:absolute;left:26px;top:50%;transform:translateY(-50%);z-index:4;display:flex;align-items:center;gap:12px}
.m-header .m-logo img{height:74px;width:auto;display:block}
.m-header .m-logo .m-wordmark{display:none}
.m-slant-blue{position:absolute;top:0;bottom:0;left:30%;right:-60px;background:var(--marca-azul);transform:skewX(-20deg);z-index:2}
.m-slant-green{position:absolute;top:0;bottom:0;left:calc(30% - 46px);width:70px;background:var(--marca-verde);transform:skewX(-20deg);z-index:1}
.m-nav{position:absolute;right:30px;top:0;height:100%;display:flex;align-items:center;gap:4px;z-index:4}
.m-nav a,.m-nav button{color:#fff;background:none;border:0;font:inherit;text-transform:uppercase;font-size:.8rem;letter-spacing:.5px;padding:9px 12px;border-radius:8px;cursor:pointer;display:inline-flex;align-items:center;gap:5px}
.m-nav a:hover,.m-nav button:hover{background:rgba(255,255,255,.14)}
.m-drop{position:relative}
.m-drop-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:235px;background:var(--marca-azul-osc);border-radius:10px;padding:6px;box-shadow:0 14px 34px rgba(0,0,0,.3);display:none;z-index:60}
.m-drop-menu a{display:block;text-transform:none;letter-spacing:0;font-size:.86rem;padding:9px 12px;border-radius:7px}
.m-drop.abierto .m-drop-menu{display:block}
.m-drop-menu a:hover{background:rgba(255,255,255,.16)}
.m-caret{transition:transform .15s}
.m-drop.abierto .m-caret{transform:rotate(180deg)}

/* ---- Pie ---- */
.m-footer{background:var(--marca-azul);color:#dbe5f0;margin-top:48px}
.m-footer .m-wrap{max-width:1180px;margin:0 auto;padding:42px 20px 18px;display:grid;grid-template-columns:1.4fr 1fr 1.4fr 1.2fr;gap:30px}
.m-footer h4{color:#fff;font-size:1rem;margin:0 0 16px}
.m-footer img{height:96px;margin-bottom:16px;display:block}
.m-footer ul{list-style:none;margin:0;padding:0}
.m-footer li{margin-bottom:10px;font-size:.88rem;display:flex;align-items:center;gap:9px}
.m-footer a{color:#dbe5f0}
.m-footer a:hover{color:#fff}
.m-footer svg{width:16px;height:16px;flex-shrink:0;color:var(--marca-verde)}
.m-cita-box{display:flex;max-width:230px;border-radius:6px;overflow:hidden}
.m-cita-box input{flex:1;border:0;padding:10px;font-size:.9rem}
.m-cita-box button{border:0;background:#3270fc;color:#fff;padding:0 16px;font-size:1.1rem;cursor:pointer}
.m-copy{background:var(--marca-azul-osc);color:#c4d2e2;font-size:.82rem;text-align:center;padding:15px 20px}
.m-copy b{color:var(--marca-verde);font-weight:700}

/* ---- WhatsApp flotante ---- */
.m-wa{position:fixed;right:18px;bottom:18px;z-index:90;background:var(--wa);color:#fff;display:inline-flex;align-items:center;gap:8px;padding:11px 16px;border-radius:30px;font-size:.9rem;font-weight:600;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.m-wa:hover{filter:brightness(1.05)}
.m-wa svg{width:20px;height:20px;fill:#fff}

@media(max-width:860px){.m-footer .m-wrap{grid-template-columns:1fr 1fr}}
@media(max-width:600px){
  .m-topbar .m-wrap{gap:12px;justify-content:center}
  .m-header{height:auto;background:var(--marca-azul)}
  .m-header .m-logo{position:static;transform:none;justify-content:center;background:#fff;margin:12px 16px 0;border-radius:10px;padding:8px}
  .m-slant-blue,.m-slant-green{display:none}
  .m-nav{position:static;justify-content:center;flex-wrap:wrap;height:auto;padding:8px 0}
  .m-drop-menu{position:static}
  .m-footer .m-wrap{grid-template-columns:1fr;gap:24px}
  .m-wa span{display:none}
  .m-wa{padding:13px;border-radius:50%}
}
