footer .footer-logo img {
    max-height: 90px!important;
}

.bg-base-color{
    background-color: #FFDD21!important;

}

.bg-base-color2 {
    background-color: #B1DDDC!important;

}
.color-base-3 {
    color: #135EA5!important;

}

.bg-dark-gray, .bg-dark-gray:focus{
    background-color: #135EA5!important;
}

.bg-dark-gray2, .bg-dark-gray2:focus{
    background-color: #FFF2C8!important;
}


.custom-logo{
  padding: 10px!important;
  max-width: 190px;
}


/* Hero desktop (default) */
#home {
    background-image: url("../images/reset/baner-pc.jpg");
    background-size: cover;
    background-position: center top;
}

/* Hero mobile */
@media (max-width: 767px) {
    #home {
        background-image: url("../images/reset/baner-movil.jpg") !important;
        background-size: cover;
        background-position: center center;
    }

    .movil{
      display:none!important;
    }
}


/* ====== BASE ====== */
.front{
  position: relative;
  width: 100%;
  height: 350px;
  overflow: hidden;
  border-radius: 4px;
}

/* ====== SVG MASK ====== */
.svgMaskFrame{
  width: 100%;
  height: 100%;
}

.svgMaskFrame__svg{
  width: 100%;
  height: 100%;
  display: block;
}

.svgMaskFrame__stroke{
  fill: none;
  stroke: rgba(255,255,255,0.9);
  stroke-width: 8;
  vector-effect: non-scaling-stroke;
  pointer-events: none;
}

/* Accesibilidad */
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.wipe-title{
  --bg: #FFDD21!importante;        /* color del fondo */
  --bar: #ffe600;       /* color de la "línea" (barra) */
  --dur: 1.7s;

  position: relative;
  display: inline-block;
 
}

.wipe-title span{
  position: relative;
  display: inline-block;
  line-height: 1;          /* clave: el alto del texto */
  overflow: hidden;         /* recorta el overlay */
}

/* 1) El texto arranca “tapado” con el color de fondo */
.wipe-title span::after{
  content:"";
  position:absolute;
  inset:0;
  background: var(--bg);
  transform: translateX(0);
  animation: reveal var(--dur) ease forwards;
}

/* 2) La barra que pasa por arriba */
.wipe-title span::before{
  content:"";
  position:absolute;
  inset:0;
  background: var(--bar);
  transform: translateX(-110%);
  animation: barPass var(--dur) ease forwards;
}

/* Desfasaje para la segunda línea */
.wipe-title span:nth-child(2)::before,
.wipe-title span:nth-child(2)::after{
  animation-delay: .12s;
}





@keyframes barPass{
  0%   { transform: translateX(-110%); }
  50%  { transform: translateX(0%); }
  100% { transform: translateX(110%); }
}

@keyframes reveal{
  0%   { transform: translateX(0%); }
  50%  { transform: translateX(0%); }
  100% { transform: translateX(110%); } /* al final “destapa” */
}



  .sitteam-section{
    background:#bfe3e7; /* celeste verdoso similar */
    padding:52px 0 62px;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  }
  .sitteam-container{ width:min(1180px, calc(100% - 48px)); margin:0 auto; }

  

  .sitteam-title{
    text-align:center;
    margin:0 0 28px;
  }

  .sitteam-titleSticker{
    position:relative;
    display:inline-block;
    padding:14px 26px 15px;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    font-weight:900;
    font-size:48px;
    letter-spacing:-0.6px;
    color:#1d57c5; /* azul del texto */
    line-height:1;
    z-index:0;
  }

  /* rectángulo blanco inclinado (sticker) */
.sitteam-titleSticker::before {
    content: "";
    position: absolute;
    inset: -1px -16px -1px -16px;
    background: #ffffff;
    transform: rotate(358deg);
    z-index: -2;
    box-shadow: 0 2px 0 rgba(0, 0, 0, .08);
}

  /* faja amarilla principal */
  .sitteam-titleSticker::after{
    content:"";
    position:absolute;
    left:-10px;
    right:-10px;
    top:50%;
    height:1.25em;              /* alto de la banda */
    transform: translateY(-50%);
    background:#ffd24a;         /* amarillo */
    z-index:-1;
  }

  .sitteam-titleStrong{ font-weight:1000; }

  @media (max-width: 650px){
    .sitteam-titleSticker{ font-size:30px; padding:12px 18px 13px; }
    .sitteam-titleSticker::before{ inset:-8px -12px -8px -12px; }
  }




  .sitteam-grid{ display:grid; gap:26px 34px; justify-items:center; }
  .sitteam-grid--5{ grid-template-columns:repeat(5, 1fr); margin-bottom:34px; }
  .sitteam-grid--4{ grid-template-columns:repeat(4, 1fr); width:min(920px, 100%); margin:0 auto; }

  .sitteam-card{ width:100%; max-width:200px; text-align:center; }

  /* ===== Foto (swap A/B) ===== */
  .sitteam-photo{
    position:relative;
    width:100%;
    aspect-ratio:1/1;
    border:4px solid #bfe3e7;
    border-radius:2px;
    overflow:hidden;
    background:#e9f3f5;
    cursor:pointer;
    transform:translateZ(0);
  }
  .sitteam-img{
    position:absolute; inset:0;
    width:100%; height:100%;
    object-fit:cover;
    transition:opacity .22s ease, transform .22s ease;
    will-change:opacity, transform;
  }
  .sitteam-img--a{ opacity:1; }
  .sitteam-img--b{ opacity:0; }

  .sitteam-photo:hover .sitteam-img--a,
  .sitteam-photo:focus .sitteam-img--a{ opacity:0; transform:scale(1.01); }
  .sitteam-photo:hover .sitteam-img--b,
  .sitteam-photo:focus .sitteam-img--b{ opacity:1; transform:scale(1.01); }

  /* ===== Tipografía debajo ===== */
  .sitteam-meta{ margin-top:12px; }
  .sitteam-name{
    color:#1d57c5;
    font-weight:900;
    font-size:18px;
    line-height:1.15;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
    margin-bottom:8px;
  }

  /* ===== BAJADA: aparece en hover/focus (desktop) y visible en mobile ===== */
  .sitteam-rolewrap{
    display:inline-block;

    border-radius:2px;
    padding:6px 10px;
    max-width: 100%;
  }
  .sitteam-role{
    color:#1d57c5;
    font-size:12.5px;
    line-height:1.15;
    font-weight:800;
  }

  /* Desktop con hover: ocultar bajada por defecto y mostrar en hover/focus */
  @media (hover:hover) and (pointer:fine){
    .sitteam-rolewrap{
      opacity:0;
      transform: translateY(-4px);
      transition: opacity .18s ease, transform .18s ease;
      pointer-events:none;
    }
    .sitteam-card:hover .sitteam-rolewrap,
    .sitteam-card:focus-within .sitteam-rolewrap{
      opacity:1;
      transform: translateY(0);
      pointer-events:auto;
    }
  }

  /* En dispositivos sin hover (mobile/tablet táctil): visible siempre */
  @media (hover:none), (pointer:coarse){
    .sitteam-rolewrap{ opacity:1; transform:none; }
  }

  /* ===== Responsive grillas ===== */
  @media (max-width: 1100px){
    .sitteam-grid--5{ grid-template-columns:repeat(3, 1fr); }
    .sitteam-grid--4{ grid-template-columns:repeat(2, 1fr); width:100%; }
    .sitteam-card{ max-width:220px; }
  }
  @media (max-width: 650px){
    .sitteam-title-highlight{ font-size:34px; }
    .sitteam-grid--5, .sitteam-grid--4{ grid-template-columns:repeat(2, 1fr); }
  }
  @media (max-width: 420px){
    .sitteam-grid--5, .sitteam-grid--4{ grid-template-columns:1fr; }
  }




/* Cada paso tiene una altura base idéntica */
.process-step-style-02{
  position: relative;
  min-height: 520px; /* CLAVE – ajustable */
  padding-bottom: 140px; /* reserva espacio para el número */
}

/* Texto libre, no empuja el número */
.process-step-style-02 > p{
  margin-bottom: 0;
}

/* Bloque del número: anclado */
.process-step-style-02 .process-step-icon-box{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding-bottom: 10px;
}

/* Separador estable */
.process-step-style-02 .progress-step-separator{
  display: block;
  margin: 0 auto 18px auto;
}

/* Círculo fijo */
.process-step-style-02 .process-step-icon{
  width: 70px;
  height: 70px;
}

/* 1) estructura: cada card usa flex y el número se empuja abajo */
#somosmas .process-step-style-02{
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* 2) misma “caja de texto” para que el wrap en 1366 no cambie alturas */
#somosmas .process-step-style-02 > p{
  flex: 0 0 auto;
  margin-bottom: 0;
  line-height: 1.6;
  min-height: 96px; /* base */
}

/* 3) el bloque del número siempre abajo */
#somosmas .process-step-icon-box{
  margin-top: auto;
  padding-top: 28px;  /* separación uniforme desde el texto */
  min-height: 118px;  /* reserva uniforme para separador + círculo */
}

/* 4) separador consistente */
#somosmas .progress-step-separator{
  display: block;
  margin: 0 auto 18px auto;
}

/* 5) círculo fijo */
#somosmas .process-step-icon{
  width: 70px;
  height: 70px;
}

/* 6) AJUSTE ESPECÍFICO para el rango donde se rompe (1366×768 cae acá) */
@media (min-width: 1200px) and (max-width: 1399.98px){
  #somosmas .process-step-style-02 > p{
    min-height: 112px; /* sube un poco la reserva por el wrap */
  }
}