:root{
  --mp-white: #ffffff;
  --mp-ink: #371c62;
  --mp-ink-2: #3d1c63;
  --mp-pink: #aa1482;
  --mp-pink-2: #c8479c;
  --mp-gray: #101014;
  --mp-muted: #c9d6de;
  --mp-gradient-diag: linear-gradient(
    135deg,
    var(--mp-ink) 0%,
    var(--mp-ink-2) 35%,
    var(--mp-pink) 70%,
    var(--mp-pink-2) 100%
  );

  --bg-page: #05030a;
  --bg-ink: var(--mp-ink);
  --bg-ink-2: var(--mp-ink-2);
  --texto: var(--mp-white);
  --muted: var(--mp-muted);
  --acento: var(--mp-pink);
  --acento-2: var(--mp-pink-2);
  --btn-oscuro: var(--mp-ink);
  --contenedor: 1240px;
  --claro: #f7f7f9;
  --gris: #eceff3;
}

/* scroll suave nativo */
html{
  scroll-behavior: smooth;
}

html,body{
  height: 100%;
  margin: 0;
  overflow-x: hidden;
}

body{
  color: var(--texto);
  background: var(--bg-page);
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", Arial, sans-serif;
}

h1,h2,h3,h4{
  font-family: Poppins, system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", Arial, sans-serif;
}

.contenedor{
  width: 100%;
  max-width: var(--contenedor);
  margin-inline: auto;
  padding-inline: 24px;
}

.acento{ color: var(--acento); }

body.bloqueo_scroll{ overflow: hidden; }

/* que las secciones no queden tapadas por el header */
#hero,
#acerca,
#servicios,
#proceso,
#equipo,
#testimonios,
#contacto{
  scroll-margin-top: 100px;
}

/* BOTONES */
.boton{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  font-weight: 700;
  text-decoration: none;
  border-radius: 999px;
  padding: .9rem 1.4rem;
  border: 2px solid transparent;
  transition:
    transform .1s ease,
    border-color .2s ease,
    background-color .2s ease,
    color .2s ease,
    box-shadow .2s ease;
  font-size: 14px;
}
.boton:active{ transform: translateY(1px); }

.boton_principal{
  background: var(--mp-ink);
  color: var(--mp-white);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .35);
  border: 1px solid var(--mp-pink);
}
.boton_principal:hover{
  background: var(--mp-pink);
  border-color: var(--mp-ink);
  color: var(--mp-white);
}

.boton_secundario{
  background: var(--mp-white);
  color: var(--mp-ink);
  border-color: var(--mp-ink);
}
.boton_secundario:hover{
  color: var(--mp-pink);
  border-color: var(--mp-pink);
}

.boton_borde{
  background: transparent;
  color: var(--mp-white);
  border-color: rgba(255, 255, 255, .4);
}
.boton_borde:hover{ border-color:#fff; }

/* HEADER FIJO CON COLOR Y SOMBRA (no transparente) */
.encabezado{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 60;

  background: transparent;
  transition: background 0.3s, box-shadow 0.3s;
}

.encabezado--solido {
  background: #05030f !important;
  background-image: radial-gradient(circle at 0% 0%, #291446 0%, #05030f 50%, #05030f 100%) !important;
  backdrop-filter: blur(10px) saturate(130%) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.16) !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.55) !important;
}

/* cuando el header está sólido, asegurar legibilidad de links y botones */
.encabezado--solido .nav_item a{ color: #fff !important; }
.encabezado--solido .nav_cta--desktop .boton{ border-color: rgba(255,255,255,0.12) !important; }
.encabezado--solido .marca_logo{ filter: none; }

/* sin pseudo-elementos */
.encabezado::before{ content:none; }

/* fila interior */
.encabezado_fila{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:20px;
  min-height:88px;
}

.marca_logo{
  width:170px;
  height:auto;
  display:block;
}

/* nav escritorio */
.nav_principal{ justify-self:center; }

.nav_lista{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  list-style:none;
  padding:0;
  margin:0;
}

.nav_item a{
  position:relative;
  color:var(--muted);
  text-decoration:none;
  font-weight:600;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  text-shadow:0 0 8px rgba(0,0,0,.7);
  white-space:nowrap;
}

.nav_item a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-10px;
  height:2px;
  background:var(--mp-gradient-diag);
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .25s ease;
  opacity:.95;
}

.nav_item a:hover,
.nav_item.activo a{
  color:#fff;
}

.nav_item a:hover::after,
.nav_item.activo a::after{
  transform:scaleX(1);
}

.nav_cta{ margin-left:0; }

/* CTA desktop / mobile */
.nav_cta--mobile{ display:none; }
.nav_cta--desktop{ display:block; }

/* logo dentro del panel lateral (oculto en desktop) */
.nav_panel_header{ display:none; }
.nav_logo_mobile{
  width:150px;
  height:auto;
  display:block;
}

/* toggle móvil */
.nav_toggle{
  width:40px;
  height:32px;
  padding:0;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.7);
  background:#05030f;
  display:none;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
}

.nav_toggle span{
  width:70%;
  height:2px;
  border-radius:999px;
  background:#fff;
  display:block;
}

/* overlay del menú lateral */
.nav_overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease-out;
  z-index:65;
}

.encabezado.menu_abierto + .nav_overlay{
  opacity:1;
  pointer-events:auto;
}

/* Asegurar que el panel del menú siempre se pinte por encima del overlay
   y que el overlay quede entre el contenido y el menú. Reglas muy específicas
   (con !important) para evitar conflictos de cascada en diferentes breakpoints. */
.encabezado.menu_abierto .nav_principal{
  z-index:1001 !important;
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  height:100vh !important;
}

.encabezado.menu_abierto + .nav_overlay{
  z-index:-2 !important;
}

/* HERO */
.hero{
  position:relative;
  height:100vh;
  min-height:640px;
  display:grid;
  place-items:center;
  overflow:hidden;
}
.hero_video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  pointer-events:none;
  z-index:0;
}
.hero_capa{
  position:absolute;
  inset:0;
  background:#00000083;
  z-index:1;
}
.hero_contenido{
  position:relative;
  z-index:2;
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  padding-inline: min(32px, 5vw);
}
.hero_ceja{
  font-weight:700;
  letter-spacing:.22em;
  color:#d1d7e0;
  text-transform:uppercase;
  font-size:13px;
  margin-bottom:18px;
}
.hero_titulo{
  line-height:1.04;
  font-weight:800;
  font-size:clamp(32px,5.4vw,68px);
  letter-spacing:-.5px;
  max-width:20ch;
  margin:0;
  color:#fff;
}
.hero_resaltado{ color:var(--acento); }
.hero_bajada{
  max-width:60ch;
  margin:12px 0 0;
  color:#d6dee6;
  font-size:15px;
}
.hero_acciones{
  margin-top:28px;
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  justify-content:center;
}

/* ACERCA */
.acerca{
  background:var(--claro);
  padding:80px 0;
  color:#14202a;
}
.acerca_grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:56px;
  align-items:center;
}
.acerca_media{ position:relative; }
.acerca_imagen{
  width:90%;
  height:auto;
  display:block;
  border-radius:12px;
  box-shadow:0 18px 36px rgba(0,0,0,.14);
}
.acerca_estadisticas{
  position:absolute;
  left:30px;
  right:0;
  bottom:30px;
  display:flex;
  border-radius:12px;
  overflow:hidden;
  width:80%;
}
.acerca_item_estadistica{
  flex:1;
  display:flex;
  align-items:center;
  gap:12px;
  padding:18px;
  color:#fff;
}
.acerca_est_izq{ background:var(--bg-ink); }
.acerca_est_der{ background:var(--acento); }
.acerca_icono{
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  border-radius:8px;
  background:rgba(255,255,255,.12);
  color:currentColor;
}
.acerca_texto h3{
  margin:0;
  font-size:22px;
  line-height:1;
  font-weight:800;
}
.acerca_texto p{
  margin:2px 0 0;
  font-size:12px;
  opacity:.9;
  font-weight:600;
}
.acerca_ceja{
  display:inline-block;
  font-size:12px;
  letter-spacing:.28em;
  text-transform:uppercase;
  font-weight:800;
  color:var(--bg-ink);
  opacity:.8;
  margin-bottom:12px;
}
.acerca_titulo{
  margin:0 0 16px;
  font-weight:800;
  line-height:1.12;
  font-size:clamp(26px,3.4vw,40px);
  color:var(--bg-ink);
}
.acerca_resaltado{ color:var(--acento); }
.acerca_parrafo{
  color:#445;
  line-height:1.7;
  font-size:15.2px;
}
.acerca_contenido{
  max-width:520px;
  margin-left:auto;
}
.acerca_features{
  margin-top:28px;
  display:flex;
  flex-direction:column;
  gap:22px;
}
.acerca_feature{
  display:flex;
  align-items:flex-start;
  gap:18px;
}
.acerca_feature_num{
  position:relative;
  flex-shrink:0;
  width:44px;
  height:44px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  font-size:15px;
  color:#fff;
  background:var(--mp-gradient-diag);
  box-shadow:0 12px 26px rgba(0,0,0,.18);
}
.acerca_feature_body{
  flex:1;
  padding-top:4px;
}
.acerca_feature_title{
  margin:0 0 4px;
  font-size:16px;
  font-weight:700;
  color:var(--bg-ink);
}
.acerca_feature_text{
  margin:0;
  font-size:14px;
  line-height:1.7;
  color:#4b5563;
}

/* SERVICIOS carrusel */
.servicios{
  color:var(--texto);
  background:radial-gradient(circle at top,#251543 0%,#080513 55%,#05030a 100%);
  padding:64px 0 80px;
}
.servicios_cabecera{
  max-width:var(--contenedor);
  margin:0 auto 22px;
  padding:0 20px;
  display:flex;
  justify-content:center;
}
.servicios_etiqueta{
  font-weight:700;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  background:rgba(255,255,255,.05);
  color:#e3e9ee;
  border-radius:999px;
  padding:8px 14px;
  border:1px solid rgba(255,255,255,.12);
}
.servicios_carrusel{
  position:relative;
  max-width:var(--contenedor);
  margin:0 auto;
  padding:0 20px;
}
.servicios_vista{
  overflow:visible;
  padding:30px 0 40px;
}
.servicios_pista{
  display:flex;
  gap:28px;
  will-change:transform;
  transition:transform .6s ease;
  align-items:stretch;
}
.servicios_diapositiva{
  position:relative;
  flex:0 0 64%;
  aspect-ratio:3/2;
  border-radius:20px;
  overflow:hidden;
  transform-origin:center;
  transform:scale(.88);
  opacity:.55;
  transition:
    transform .45s ease,
    opacity .45s ease,
    box-shadow .45s ease;
}
.servicios_media{
  position:absolute;
  inset:0;
  background:#123 center/cover no-repeat;
}
.servicios_diapositiva::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    0deg,
    rgba(5,4,14,.85),
    rgba(5,4,14,.35)
  );
  opacity:.75;
  transition:opacity .45s ease;
}
.servicios_tarjeta{
  position:absolute;
  left:28px;
  right:28px;
  bottom:28px;
  background:#fff;
  color:#0b1f3a;
  border-radius:18px;
  box-shadow:0 24px 44px rgba(0,0,0,.24);
  padding:28px 28px 24px;
}
.servicios_tag{
  position:absolute;
  top:-20px;
  right:26px;
  background:var(--acento);
  color:#1a2233;
  font-weight:800;
  font-size:16px;
  line-height:1;
  padding:10px 13px;
  border-radius:999px;
  box-shadow:0 10px 22px rgba(0,0,0,.16);
}
.servicios_titulo{
  font-weight:700;
  font-size:24px;
  line-height:1.22;
  margin:0 0 8px;
}
.servicios_texto{
  margin:0 0 12px;
  color:#4b5563;
  font-size:14px;
}
.servicios_enlace{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:800;
  color:var(--mp-ink);
  text-decoration:none;
  font-size:14px;
}
.servicios_diapositiva.activo{
  transform:scale(1);
  opacity:1;
  box-shadow:0 26px 60px rgba(0,0,0,.3);
}
.servicios_diapositiva.activo::after{ opacity:.2; }

.servicios_boton{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:44px;
  height:44px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:#fff;
  color:#0b1f3a;
  box-shadow:0 10px 25px rgba(0,0,0,.18);
  border:none;
  cursor:pointer;
  z-index:3;
}
.servicios_prev{ left:0; }
.servicios_sig{ right:0; }

.servicios_puntos{
  display:flex;
  justify-content:center;
  gap:8px;
  margin-top:6px;
}
.servicios_puntos button{
  width:8px;
  height:8px;
  border-radius:999px;
  background:rgba(255,255,255,.45);
  border:none;
  cursor:pointer;
}
.servicios_puntos button.activo{ background:var(--acento); }

/* PROCESO */
.proceso{
  background:#fff;
  color:#0b2431;
  padding:80px 0;
}
.proceso_interno{
  margin:0 auto;
  padding:0 20px;
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:48px;
  align-items:start;
}
.proceso_ceja{
  font-weight:800;
  font-size:12px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--acento);
}
.proceso_titulo{
  margin:10px 0 10px;
  font-weight:800;
  font-size:36px;
  line-height:1.1;
}
.proceso_resaltado{ color:var(--acento); }
.proceso_texto{
  max-width:520px;
  color:#5b6873;
  margin:0 0 18px;
  font-size:14px;
}
.proceso_cuadricula{
  display:grid;
  grid-template-columns:1fr 1fr;
  border:1px solid #eceff3;
  border-radius:10px;
  overflow:hidden;
  background:#fff;
}
.proceso_celda{
  padding:32px 24px;
  border-right:1px solid #eceff3;
  border-bottom:1px solid #eceff3;
  background:#fff;
  transition:
    background-color .35s ease,
    color .35s ease,
    box-shadow .25s ease,
    transform .25s ease;
}
.proceso_celda:nth-child(2n){ border-right:none; }
.proceso_celda:nth-last-child(-n+2){ border-bottom:none; }
.proceso_numero{
  font-weight:900;
  font-size:26px;
  line-height:1;
  color:#0e2b3a;
  margin-bottom:6px;
}
.proceso_etiqueta{
  color:#293645;
  font-weight:800;
  font-size:15px;
}
.proceso_desc{
  margin:6px 0 0;
  color:#5b6873;
  font-size:14px;
}
.proceso_celda:hover{
  background:var(--acento);
  color:#fff;
  box-shadow:0 10px 24px rgba(0,0,0,.12);
  transform:translateY(-2px);
}
.proceso_celda:hover .proceso_numero,
.proceso_celda:hover .proceso_etiqueta,
.proceso_celda:hover .proceso_desc{
  color:#fff;
}

/* CONTACTO */
.contacto{
  position:relative;
  padding:80px 0;
  color:#fff;
  background-image:url("../../Hero.jpg");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  background-attachment:fixed;
  overflow:hidden;
}
.contacto::before{
  content:"";
  position:absolute;
  inset:0;
  background:#0000008f;
  pointer-events:none;
  z-index:0;
}
.contacto_interno{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:center;
}
.contacto_copia{
  text-align:center;
  max-width:860px;
}
.contacto_ceja{
  display:inline-block;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-size:12px;
  color:#c6d2db;
  margin-bottom:10px;
}
.contacto_titulo{
  margin:0 0 10px;
  font-weight:800;
  font-size:clamp(26px,3.2vw,42px);
}
.contacto_texto{
  margin:0 0 18px;
  color:#d0dde6;
  font-size:14px;
}
.contacto_acciones{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  justify-content:center;
}

/* EQUIPO */
.equipo{
  background:#fff;
  color:#0b2431;
  padding:80px 0;
}
.equipo_cabecera{
  text-align:center;
  margin-bottom:28px;
}
.equipo_etiqueta{
  display:inline-block;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-size:12px;
  color:var(--acento);
  margin-bottom:10px;
}
.equipo_titulo{
  margin:0 0 8px;
  font-weight:800;
  font-size:clamp(26px,3.2vw,40px);
  color:#0b2431;
}
.equipo_grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  align-items:stretch;
}
.equipo_card{
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:16px;
  padding:22px;
  text-align:center;
  box-shadow:0 10px 24px rgba(15,23,42,.06);
}
.equipo_foto{
  width:96px;
  height:96px;
  border-radius:999px;
  object-fit:cover;
  margin:0 auto 10px;
  display:block;
}
.equipo_nombre{
  margin:6px 0 2px;
  font-weight:800;
  color:#0b2431;
}
.equipo_cargo{
  margin:0;
  color:#5b6873;
  font-size:14px;
}

/* TESTIMONIOS carrusel */
.testi{
  position:relative;
  padding:80px 0;
  color:#0b2431;
  background-image:url("../../Testimonios.jpg");
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center;
  background-attachment:fixed;
  overflow:hidden;
}
.testi::before{
  content:"";
  position:absolute;
  inset:0;
  background:#0000008f;
  pointer-events:none;
  z-index:0;
}
.testi>.contenedor{
  position:relative;
  z-index:1;
}
.testi_cabecera{
  text-align:center;
  margin-bottom:20px;
}
.testi_etiqueta{
  display:inline-block;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-size:12px;
  color:var(--acento);
  margin-bottom:10px;
}
.testi_titulo{
  margin:0 0 8px;
  font-weight:800;
  font-size:clamp(26px,3.2vw,42px);
  line-height:1.12;
  color:#fff;
}
.testi_sub{
  margin:0;
  color:#dfdfdf;
}
.testi_carrusel{
  position:relative;
  max-width:var(--contenedor);
  margin:0 auto;
  padding:0 20px 40px;
}
.testi_vista{
  overflow:visible;
  padding:10px 0 0;
}
.testi_pista{
  display:flex;
  gap:24px;
  will-change:transform;
  transition:transform .6s ease;
  align-items:stretch;
}
.testi_slide{
  position:relative;
  flex:0 0 54%;
  max-width:640px;
  min-width:260px;
  aspect-ratio: 5 / 2.2;
  display:flex;
  align-items:center;
  margin-inline:auto;
  transform-origin:center;
  transform:scale(.9);
  opacity:.7;
  transition:
    transform .45s ease,
    opacity .45s ease,
    box-shadow .45s ease;
}
.testi_tarjeta{
  position:relative;
  background:#fff;
  color:#0b2431;
  border-radius:16px;
  box-shadow:0 24px 44px rgba(0,0,0,.12);
  padding:28px;
  width:100%;
}
.testi_texto{
  margin:16px 0 14px;
  color:#3b4a56;
  font-size:15px;
  line-height:1.6;
}
.testi_rating{
  font-weight:800;
  color:var(--acento);
  letter-spacing:1px;
  margin-bottom:12px;
}
.testi_rating span{
  font-weight:800;
  color: var(--mp-muted);
  letter-spacing:0;
}
.testi_persona{
  display:flex;
  align-items:center;
  gap:12px;
}
.testi_foto{
  width:46px;
  height:46px;
  border-radius:999px;
  object-fit:cover;
}
.testi_nombre{
  display:block;
  font-weight:800;
  color:#0e2b3a;
}
.testi_cargo{
  font-size:13px;
  color:#607381;
}
.testi_slide.activo{
  transform:scale(1);
  opacity:1;
  box-shadow:0 26px 60px rgba(0,0,0,.3);
}
.testi_btn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:44px;
  height:44px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:#fff;
  color:#0b1f3a;
  box-shadow:0 10px 25px rgba(0,0,0,.18);
  border:none;
  cursor:pointer;
  z-index:3;
}
.testi_prev{ left:0; }
.testi_next{ right:0; }

.testi_puntos{
  display:flex;
  justify-content:center;
  gap:8px;
  margin-top:16px;
}
.testi_puntos button{
  width:8px;
  height:8px;
  border-radius:999px;
  background:rgba(148,163,184,.8);
  border:none;
  cursor:pointer;
}
.testi_puntos button.activo{ background:var(--acento); }

/* FOOTER */
.pie{
  position:relative;
  background:var(--mp-gray);
  color:var(--muted);
  font-family:Inter, system-ui, Arial, sans-serif;
  padding-top:60px;
}
.pie::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:4px;
  background:var(--mp-gradient-diag);
  pointer-events:none;
  z-index:1;
}
.pie_interno{
  padding:0 20px 40px;
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:40px;
}
.pie_marca h3{
  color:var(--acento-2);
  font-weight:600;
  font-size:14px;
  line-height:1.2;
  margin-bottom:12px;
}
.pie_marca p{
  margin:0;
  font-size:14px;
}
.pie_nav h4,
.pie_contacto h4{
  color:var(--mp-white);
  font-weight:700;
  font-size:14px;
  margin-bottom:14px;
}
.pie_lista{
  list-style:none;
  padding:0;
  margin:0;
}
.pie_nav a,
.pie_contacto a{
  color:inherit;
  text-decoration:none;
  font-size:14px;
  transition:color .25s;
}
.pie_nav a:hover,
.pie_contacto a:hover{
  color:var(--acento-2);
}
.pie_base{
  background:#05030a;
  padding:10px 20px;
  text-align:center;
  font-size:13px;
  border-top:1px solid rgba(255,255,255,.1);
}
.pie_base strong{ color:var(--acento-2); }

.pie_redes{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.pie_red{
  display:inline-flex;
  align-items:center;
  gap:8px;
  text-decoration:none;
  color:#e5e7eb;
  font-size:14px;
}
.pie_red:hover{ color:var(--acento-2); }
.pie_red_icono{
  width:20px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.pie_red_icono svg{
  width:100%;
  height:100%;
  display:block;
  color:#fff;
}

/* ANIMACIONES DE APARICIÓN */
.anim-inicial{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .7s ease-out, transform .7s ease-out;
}
.anim-visible{
  opacity:1;
  transform:translateY(0);
}
.anim-delay-1{ transition-delay:.05s; }
.anim-delay-2{ transition-delay:.12s; }
.anim-delay-3{ transition-delay:.18s; }
.anim-delay-4{ transition-delay:.24s; }
.anim-delay-5{ transition-delay:.30s; }
.anim-delay-6{ transition-delay:.36s; }

/* RESPONSIVE */

/* tablets/telefonos grandes: menú lateral ya entra aquí */
@media (max-width:1024px){
  .encabezado_fila{
    grid-template-columns: auto 1fr auto;
    align-items: center;
    padding-inline:16px;
    gap:12px;
  }

  /* menú lateral */
  .nav_principal{
    position:fixed;
    top:0;
    left:0;
    bottom:0;
    /* ocupar el 85% del ancho para dejar 15% visible a la derecha */
    width: min(85vw, 360px);
    box-sizing: border-box;
    padding: calc(72px + 12px) 18px 24px;
    /* asegurar altura completa en móviles/tablets */
    height: 100vh;
    background:radial-gradient(
      circle at 0% 0%,
      rgba(16,7,40,.98) 0%,
      rgba(5,3,15,.98) 55%,
      rgba(3,1,10,.98) 100%
    );
    border-right:1px solid rgba(255,255,255,.18);
    transform:translateX(-110%);
    opacity:0;
    pointer-events:none;
    transition:transform .28s cubic-bezier(.2,.9,.2,1), opacity .25s ease-out;
    display:flex;
    flex-direction:column;
    gap:18px;
    z-index:70;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .encabezado.menu_abierto .nav_principal{
    transform:translateX(0);
    opacity:1;
    pointer-events:auto;
  }

  .nav_panel_header{
    display:block;
    margin-bottom:6px;
  }

  .nav_lista{
    flex-direction:column;
    align-items:flex-start;
    gap:14px;
    max-width:100%;
    box-sizing:border-box;
  }

  .nav_cta--desktop{ display:none; }
  .nav_cta--mobile{
    display:block;
    margin-top:8px;
  }

  .nav_toggle{ display:inline-flex; }

  .hero{
    min-height:560px;
    overflow: hidden;
  }

  .hero_titulo{
    font-size:clamp(30px, 5vw, 40px);
    max-width:18ch;
  }

  /* asegurar que el contenido principal no se desborde en tablet vertical */
  .hero_contenido,
  .contenedor{
    padding-inline: 20px;
    max-width: 100%;
    box-sizing: border-box;
  }

  /* prevenir desbordes horizontales generales */
  .servicios_pista,
  .testi_pista{
    max-width: 100%;
    overflow: visible;
    box-sizing: border-box;
  }

  /* permitir saltos de línea y guillermets en títulos para móviles */
  .hero_titulo,
  .servicios_titulo,
  .testi_titulo{
    white-space: normal;
    word-break: break-word;
    hyphens: auto;
  }

  .acerca_grid{
    grid-template-columns:1fr;
    gap:40px;
  }
  .acerca_media{ order:2; }
  .acerca_contenido{
    order:1;
    max-width:none;
    margin-left:0;
  }

  .proceso_interno{
    grid-template-columns:1fr;
    gap:28px;
  }

  .equipo_grid{ grid-template-columns:1fr 1fr; }
}

/* carruseles más estrechos en pantallas medias */
@media (max-width:1100px){
  .servicios_diapositiva{ flex:0 0 72%; }
  .testi_slide{ flex:0 0 62%; }
}

/* móviles */
@media (max-width:700px){
  .servicios_diapositiva{
    flex:0 0 100%;
    transform:scale(1);
  }
  .servicios_prev{ left:8px; }
  .servicios_sig{ right:8px; }
  .servicios_titulo{ font-size:22px; }

  .testi_slide{
    flex:0 0 100%;
    max-width:none;
    transform:scale(1);
  }
  .testi_prev{ left:8px; }
  .testi_next{ right:8px; }

  .hero_contenido{
    padding-inline:16px;
  }
}

/* móviles muy pequeños */
@media (max-width:480px){
  .hero_titulo{
    font-size:28px;
  }
  .hero_bajada{
    font-size:14px;
  }
}

/* footer + columnas en stack */
@media (max-width:880px){
  .pie_interno{
    grid-template-columns:1fr;
    text-align:center;
  }
  .pie_marca p{ margin:0 auto 20px; }
}

/* proceso / equipo columna única en móviles pequeños */
@media (max-width:560px){
  .proceso_cuadricula{ grid-template-columns:1fr; }
  .proceso_celda{ border-right:none !important; }
  .equipo_grid{ grid-template-columns:1fr; }
}

/* Ajustes responsivos adicionales para tablets vertical y móviles */
@media (max-width:1024px) and (orientation:portrait){
  :root{ --hero-title-clamp: 34px; }
  .hero_titulo{ font-size: clamp(28px, 6.2vw, 44px); max-width: 20ch; }
  .hero_bajada{ font-size: 15px; max-width: 46ch; }
  .nav_lista{ padding-inline: 6px; }
  .nav_lista .nav_item{ width:100%; }
  .nav_lista .nav_item a{ display:block; width:100%; padding:12px 8px; box-sizing:border-box; }
  .marca_logo{ width:140px; }
}

@media (max-width:900px){
  .hero_titulo{ font-size: clamp(26px, 6.6vw, 40px); }
  .hero_bajada{ font-size:14px; }
  .nav_toggle{
    display:inline-flex;
    margin-left: auto;
    margin-right: 12px;
    position: relative;
    right: 0;
  }
  .nav_cta--desktop{ display:none; }
  .nav_cta--mobile{ display:block; }
}

@media (max-width:700px){
  .hero_titulo{ font-size: clamp(22px, 7.5vw, 34px); max-width: 28ch; }
  .hero_bajada{ font-size:13px; }
  .marca_logo{ width:120px; }
  .encabezado_fila{ min-height:76px; }
  .nav_principal{ width: min(92vw, 320px); padding-left:18px; }
}

@media (max-width:420px){
  .hero_titulo{ font-size: clamp(20px, 8.5vw, 28px); }
  .hero_bajada{ font-size:12px; }
  .nav_lista .nav_item a{ text-align:left; padding-left:6px; }
  .marca_logo{ width:110px; }
}

/* Ajustes finos para pantallas muy pequeñas: reducir botones y espaciados */
@media (max-width:480px){
  .hero_titulo{ font-size: clamp(18px, 7.5vw, 24px); max-width: 30ch; }
  .hero_bajada{ font-size:13px; max-width:40ch; }
  .hero_acciones{ gap:10px; margin-top:18px; }
  .hero_acciones .boton{ padding: .55rem .9rem; font-size:13px; border-radius:28px; }
  .boton_principal{ padding:.5rem .9rem; font-size:13px; }
  .boton_secundario{ padding:.45rem .8rem; font-size:13px; }
  .boton_borde{ padding:.45rem .8rem; font-size:13px; }
  .marca_logo{ width:96px; }
  .encabezado_fila{ min-height:68px; padding-inline:12px; }
  .nav_toggle{ width:36px; height:28px; margin-right:10px; }
  .nav_principal{ width: min(92vw, 300px); padding-top:64px; }
  .nav_lista .nav_item a{ font-size:13px; padding:10px 6px; }
  .servicios_diapositiva{ flex:0 0 92%; }
}

/* Escala ligera global para pantallas muy pequeñas para que todo encaje mejor */
@media (max-width:420px){
  html { font-size: 14px; }
}

@media (max-width:360px){
  html { font-size: 13px; }
}

@media (max-width:360px){
  .hero_titulo{ font-size: clamp(16px, 8.5vw, 20px); }
  .hero_bajada{ font-size:12px; }
  .hero_acciones .boton{ padding:.48rem .7rem; font-size:12px; }
  .marca_logo{ width:88px; }
  .encabezado_fila{ min-height:62px; }
  .nav_principal{ padding-top:56px; }
}

/* reducir texto en pantallas muy grandes para que no ocupe demasiado ancho */
@media (min-width:1400px){
  .hero_titulo{ max-width: 18ch; }
  .hero_bajada{ max-width: 60ch; }
}

/* asegurar que no haya overflow horizontal por contenido inesperado */
html, body{ overflow-x: hidden; }

/* menos movimiento */
@media (prefers-reduced-motion:reduce){
  .hero_video{ display:none; }
  .hero_capa{ background-color:#000000bf; }
  .servicios_pista,
  .testi_pista{ transition:none; }
}
