/* ========================================
   MAPA DEL SITIO — una fila por sección: título a la izquierda y los
   links en 3 columnas a la derecha; en mobile, todo en una columna.

   Todo antepone #inacoop-mapa-sitio (ver
   [[feedback_elementor_css_specificity]]). Tipografía en rem (ver
   [[feedback_css_units]]).

   Medidas según Figma (archivo "Web-INACOOP", node 1412-6651 desktop /
   1412-6933 mobile). Ancho de contenido 1160px aunque el Figma muestre
   1239 (ver [[feedback_container_width]]).
   ======================================== */

#inacoop-mapa-sitio {
  max-width: 1160px;
  margin: 0 auto;
  padding: 2.5rem 0 5rem;
  font-family: Asap, sans-serif;
}

#inacoop-mapa-sitio .inacoop-mapa-sitio__seccion {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 40px;
  align-items: start;
  /* Figma: 24px de los links a la línea y 32 + 32 de la línea a la
     sección siguiente. */
  padding: 32px 0 24px;
  margin-bottom: 32px;
  border-bottom: 1px solid #d6dee0;
}

#inacoop-mapa-sitio .inacoop-mapa-sitio__seccion:first-child {
  padding-top: 0;
}

#inacoop-mapa-sitio .inacoop-mapa-sitio__titulo {
  margin: 0;
  font-family: Asap, sans-serif;
  font-weight: 600;
  font-size: 1.375rem;
  line-height: 1.8125rem;
  color: #00556d;
}

/* Links en 3 columnas que se llenan de arriba hacia abajo; la cantidad de
   filas la pone el PHP en --inacoop-mapa-filas. */
#inacoop-mapa-sitio .inacoop-mapa-sitio__links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(var(--inacoop-mapa-filas, 1), auto);
  grid-auto-flow: column;
  column-gap: 28px;
  margin: 0;
  padding: 0;
  list-style: none;
}

#inacoop-mapa-sitio .inacoop-mapa-sitio__links li {
  margin: 0;
}

#inacoop-mapa-sitio .inacoop-mapa-sitio__links .inacoop-mapa-sitio__link {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 0;
  font-family: Asap, sans-serif;
  font-weight: 600;
  font-size: 1rem;
  line-height: 1.5rem;
  color: #00556d;
  text-decoration: none;
}

#inacoop-mapa-sitio .inacoop-mapa-sitio__links .inacoop-mapa-sitio__link--hijo {
  font-weight: 400;
}

#inacoop-mapa-sitio .inacoop-mapa-sitio__links .inacoop-mapa-sitio__link:hover,
#inacoop-mapa-sitio .inacoop-mapa-sitio__links .inacoop-mapa-sitio__link:focus-visible {
  color: #00556d;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ========================================
   Responsive
   ======================================== */

/* Tablet: el título pasa arriba de los links. */
@media (max-width: 1024px) {
  #inacoop-mapa-sitio .inacoop-mapa-sitio__seccion {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

/* Mobile (Figma node 1412-6933): una sola columna de links. */
@media (max-width: 767px) {
  #inacoop-mapa-sitio {
    padding: 3rem 1.5rem;
  }

  #inacoop-mapa-sitio .inacoop-mapa-sitio__seccion {
    padding: 24px 0 16px;
    margin-bottom: 24px;
  }

  #inacoop-mapa-sitio .inacoop-mapa-sitio__titulo {
    font-size: 1.3125rem;
    line-height: 1.75rem;
  }

  #inacoop-mapa-sitio .inacoop-mapa-sitio__links {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    grid-auto-flow: row;
  }

  #inacoop-mapa-sitio .inacoop-mapa-sitio__links .inacoop-mapa-sitio__link {
    line-height: 1.4375rem;
  }
}
