@charset "UTF-8";
* {
  box-sizing: border-box;
  font-family: "Montserrat", sans-serif;
}

:root {
  --primary-color: #001f60;
  --secondary-color: #5e5e5e;
  --gradient-start: #f5a322;
  --gradient-end: #df015b;
  --bg-gray: #f5f5f5;
  --gray-color: #e2e4ed;
  --azul-uaa: #001f60;
  --amarillo-uaa: #f5a322;
  --rojo-uaa: #df015b;
  --gris-uaa: #5e5e5e;
  --filter-azul: brightness(0) saturate(100%) invert(10%) sepia(44%)
    saturate(4716%) hue-rotate(213deg) brightness(95%) contrast(107%);
  /* Colores de los centros */
  --cca-color: #3dae2b;
  /* Centro de Ciencias Agropecuarias */
  --ccb-color: #00837b;
  /* Centro de Ciencias Básicas */
  --cci-color: #1a5632;
  /* Centro de Ciencias de la Ingeniería */
  --ccs-color: #0075a9;
  /* Centro de Ciencias de la Salud */
  --ccdc-color: #c70000;
  /* Centro de Ciencias del Diseño y la Construcción */
  --ccea-color: #8e1537;
  /* Centro de Ciencias Económicas y Administrativas */
  --cce-color: #1a428a;
  /* Centro de Ciencias Empresariales */
  --ccsh-color: #e65300;
  /* Centro de Ciencias Sociales y Humanidades */
  --cem-color: #f18a00;
  /* Centro de Educación Media */
  --cac-color: #592c82;
  /* Centro de Arte y Cultura */
  --rectoria-color: #6d808d;
  --cu-color: #6d808d;
  --sg-color: #6d808d;
  --color-blue-deep: #2c3e50;
  --color-blue-soft: #5d8aa8;
  --color-gray-medium: #7f8c8d;
  --color-gray-light: #d1d5db;
  --pastel-rose: #edc9af;
  --pastel-yellow: #fef9c3;
  --pastel-peach: #ffdab9;
  --pastel-mint: #bbf7d0;
  --pastel-lavender: #e0e7ff;
  --pastel-aqua: #caf0f8;
  --pastel-beige: #f5f5dc;
  --personalized-1: #4a0404;
  --personalized-2: #001f60;
  --personalized-3: #fcb71f;
  /* Tamaños de fuente */
  --font-size-sm: clamp(0.8rem, 1vw, 0.9rem);
  --font-size-md: clamp(0.9rem, 1.5vw, 1.1rem);
  --font-size-lg: clamp(1rem, 2vw, 1.5rem);
}

h1 {
  font-size: var(--font-size-lg);
  font-weight: 700;
  color: var(--primary-color);
  text-align: center;
}

h2 {
  margin-top: 2rem;
  margin-bottom: 0;
  font-size: var(--font-size-lg);
  font-weight: 700;
  color: var(--primary-color);
  text-align: center;
  line-height: 1.3lh;
}

h3 {
  color: var(--primary-color);
  font-size: var(--font-size-md);
  font-weight: 700;
  text-align: center;
}

p {
  width: clamp(100px, 90%, 900px);
  margin-top: 2rem;
  margin-bottom: 0;
  font-size: var(--font-size-md);
  font-weight: 700;
  color: var(--primary-color);
  line-height: 1.3lh;
}

header button img,
img.logo,
img.download,
img.arrow,
.grid-item a img,
.bento-grid a img,
.download-card a img {
  -webkit-user-drag: none;
  -webkit-user-select: none;
  user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

body > header button {
  background-color: transparent;
  border: none;
  cursor: pointer;
  width: 100%;
  height: auto;
  transition: transform 0.2s;
  margin: 0;
  padding: 0;
}
body > header button img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
body > header button span {
  position: absolute;
  left: 0;
  font-size: var(--font-size-md);
  background-color: var(--primary-color);
  color: white;
  padding: 0.5rem 0.8rem;
  transform: translateX(-100%);
  transition: transform 0.2s;
  border-radius: 0 0 0.5rem 0;
}
@media (max-width: 820px) {
  body > header button span {
    transform: translateX(0);
  }
}
body > header button span:hover {
  text-decoration: underline;
}
body > header button:hover span {
  transform: translateX(0);
}

#noEsDireccion {
  width: 100%;
  background-color: white;
  border-radius: 1rem;
  display: flex;
  flex-direction: row;
}
@media (max-width: 1200px) {
  #noEsDireccion {
    flex-direction: column;
  }
}
#noEsDireccion {
  gap: 1rem;
}
#noEsDireccion .no-es-direccion-card {
  --card-width: 33.33%;
}
@media (max-width: 1200px) {
  #noEsDireccion .no-es-direccion-card {
    --card-width: 100%;
  }
  #noEsDireccion .no-es-direccion-card[data-key="2"] .departamentos-list {
    top: 64.5%;
  }
}
#noEsDireccion .no-es-direccion-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  cursor: pointer;
  width: var(--card-width);
}
#noEsDireccion .header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: color-mix(
    in srgb,
    var(--rectoria-color) 10%,
    rgb(255, 255, 255) 90%
  );
  border-radius: 1rem 1rem 0 0;
  padding: 0.5rem;
  min-height: 80px;
  border-bottom: 2px solid transparent;
  transition:
    border-radius 0.2s,
    background-color 0.2s;
}
#noEsDireccion .header .download-btn-header {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 3rem;
  height: 3rem;
  cursor: pointer;
  transition: transform 0.2s;
}
#noEsDireccion .header .download-btn-header:hover {
  transform: scale(1.1);
}
#noEsDireccion .header .download-btn-header .download {
  width: clamp(2.3rem, 5vw, 4rem);
  height: 100%;
  filter: var(--filter-azul);
  transition: transform 0.15s ease-in-out;
}
#noEsDireccion .header .download-btn-header:hover .download {
  transform: scale(1.01);
}
#noEsDireccion .header .logo-container {
  flex-grow: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  padding: 0 0.5rem;
}
#noEsDireccion .header .logo-container .logo {
  height: clamp(50px, 5vw, 65px);
  width: auto;
  max-width: 100%;
}
#noEsDireccion .header .btn-dropdown {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 3rem;
  height: 3rem;
  padding: 0;
}
#noEsDireccion .header .btn-dropdown .arrow {
  width: 70%;
  height: 70%;
  transition: transform 0.3s ease;
  filter: var(--filter-azul);
}
#noEsDireccion .header .btn-dropdown .arrow.rotate {
  transform: rotate(180deg);
}
#noEsDireccion .header .btn-dropdown:hover .arrow {
  transform: scale(1.1);
}
#noEsDireccion .header:hover {
  background-color: color-mix(
    in srgb,
    var(--rectoria-color) 20%,
    rgb(255, 255, 255) 80%
  );
}
#noEsDireccion.expanded .header {
  border-radius: 1rem 1rem 0 0;
}
#noEsDireccion {
  position: relative;
}
#noEsDireccion .departamentos-list {
  position: absolute;
  top: 100%;
  width: calc(var(--card-width) - 0.65rem);
  display: flex;
  flex-direction: column;
  gap: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-out;
  z-index: 10;
  transition: all 0.3s ease-out;
}
@media (max-width: 1200px) {
  #noEsDireccion .departamentos-list {
    width: 100%;
  }
}
#noEsDireccion .departamentos-list.active {
  max-height: 500px;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.3);
  border-radius: 0 0 1rem 1rem;
}
#noEsDireccion .departamentos-list .dept-link {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  gap: 0.5rem;
  align-items: center;
  padding: 0.8rem;
  background-color: color-mix(
    in srgb,
    var(--rectoria-color) 10%,
    rgb(255, 255, 255) 90%
  );
  border-top: 1px solid rgba(0, 0, 0, 0.05);
  text-decoration: none;
  color: var(--primary-color);
  font-weight: 600;
  font-size: var(--font-size-sm);
  transition: background-color 0.2s;
}
#noEsDireccion .departamentos-list .dept-link:last-child {
  border-radius: 0 0 1rem 1rem;
}
#noEsDireccion .departamentos-list .dept-link:hover {
  background-color: color-mix(
    in srgb,
    var(--rectoria-color) 20%,
    rgb(255, 255, 255) 80%
  );
}
#noEsDireccion .departamentos-list .dept-link .download-icon {
  width: 1.6rem;
  height: 1.6rem;
  filter: var(--filter-azul);
}

*:focus-visible {
  outline-offset: -3px;
  outline: 6px solid var(--amarillo-uaa);
  border-radius: 1.2rem;
}

body {
  margin: 0;
  padding: 0;
}

section {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
section .panel {
  margin-top: 2rem;
  width: clamp(200px, 80%, 1300px);
  height: 80%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 1.5rem 1.5rem 0 0;
  background-color: var(--bg-gray);
}
@media (max-width: 820px) {
  section .panel {
    width: 100%;
    margin-top: -0.3rem;
  }
}
section .panel .panel-header {
  width: 100%;
  height: clamp(2rem, 3.5lh, 4.2rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 1.5rem 1.5rem 0 0;
  background-color: var(--primary-color);
}
@media (max-width: 820px) {
  section .panel .panel-header {
    border-radius: 0;
  }
}
section .panel .panel-header h1 {
  font-size: clamp(1.3rem, 2vw, 1.6rem);
  font-weight: 700;
  color: var(--bg-gray);
  text-align: center;
}
section .panel .panel-header h1 span {
  display: block;
}
section .panel .panel-body {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
section .panel .panel-body p {
  text-align: center;
}
section .panel .panel-body .download-cards {
  width: 100%;
  padding: 2rem;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  justify-items: center;
  align-items: center;
  gap: clamp(1rem, 2vw, 1.5rem);
}
@media (max-width: 600px) {
  section .panel .panel-body .download-cards {
    flex-direction: column;
  }
}
section .panel .panel-body .download-cards .download-card {
  width: 40%;
  height: -webkit-fill-available;
  min-height: 13rem;
}
@media (max-width: 600px) {
  section .panel .panel-body .download-cards .download-card {
    width: 100%;
    height: 8rem;
    min-height: inherit;
  }
}
section .panel .panel-body .download-cards .download-card a {
  width: 100%;
  height: 100%;
  padding: 3rem 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 1.2rem;
  cursor: pointer;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
  position: relative;
  text-decoration: none !important;
}
@media (max-width: 820px) {
  section .panel .panel-body .download-cards .download-card a {
    width: 100%;
  }
}
section .panel .panel-body .download-cards .download-card a:hover {
  transform: translateY(-0.3rem);
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.2);
}
section .panel .panel-body .download-cards .download-card a:focus-visible {
  outline: 6px solid var(--amarillo-uaa);
  outline-offset: 3px;
  border-radius: 1.2rem;
}
section .panel .panel-body .download-cards .download-card a img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 1.2rem;
  position: absolute;
  top: 0;
  left: 0;
}
@media (max-width: 820px) {
  section .panel .panel-body .download-cards .download-card a {
    min-height: clamp(6rem, 20vw, 12rem);
    padding: 2rem 1rem;
  }
}
section .panel .panel-body .download-cards .download-card a span {
  color: var(--bg-gray);
  font-size: clamp(1rem, 2.3vw, 1.5rem);
  font-weight: 700;
  text-align: center;
  position: relative;
  z-index: 1;
  width: 100%;
}
section .panel .panel-body .imagotypes-cards {
  width: 100%;
  height: 100%;
  padding: clamp(1rem, 3vw, 2rem) clamp(1rem, 2vw, 1.5rem) 0;
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: flex-start;
  gap: clamp(1rem, 3vw, 2rem);
}
@media (max-width: 1200px) {
  section .panel .panel-body .imagotypes-cards {
    flex-direction: column;
  }
}
section .panel .panel-body .imagotypes-cards .imagotype-card {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(2rem, 3vw, 3rem);
  gap: clamp(1rem, 2vw, 1.5rem);
  align-items: center;
  background-color: white;
  border-radius: 1.2rem;
}
section .panel .panel-body .imagotypes-cards .imagotype-card h3 {
  color: var(--primary-color);
  font-size: var(--font-size-lg);
  font-weight: 700;
  text-align: center;
  margin: 0;
}
section .panel .panel-body .imagotypes-cards .imagotype-card #centros,
section .panel .panel-body .imagotypes-cards .imagotype-card #direcciones {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: clamp(1rem, 2vw, 1.5rem);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 1rem 1rem 0;
  color: var(--primary-color);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container[data-centro="cca"],
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container[data-centro="cca"] {
  --current-color: var(--cca-color);
  --text-color: var(--bg-gray);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container[data-centro="cca"]
  .dropdown-title
  span,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container[data-centro="cca"]
  .dropdown-title
  h4,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container[data-centro="cca"]
  .dropdown-title
  span,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container[data-centro="cca"]
  .dropdown-title
  h4 {
  color: var(--text-color);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container[data-centro="cca"]
  .departamento-container
  .departamento
  h5,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container[data-centro="cca"]
  .departamento-container
  .departamento
  h5 {
  color: var(--text-color);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container[data-centro="ccb"],
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container[data-centro="ccb"] {
  --current-color: var(--ccb-color);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container[data-centro="cci"],
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container[data-centro="cci"] {
  --current-color: var(--cci-color);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container[data-centro="ccs"],
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container[data-centro="ccs"] {
  --current-color: var(--ccs-color);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container[data-centro="ccdc"],
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container[data-centro="ccdc"] {
  --current-color: var(--ccdc-color);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container[data-centro="ccea"],
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container[data-centro="ccea"] {
  --current-color: var(--ccea-color);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container[data-centro="cce"],
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container[data-centro="cce"] {
  --current-color: var(--cce-color);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container[data-centro="ccsh"],
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container[data-centro="ccsh"] {
  --current-color: var(--ccsh-color);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container[data-centro="cem"],
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container[data-centro="cem"] {
  --current-color: var(--cem-color);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container[data-centro="cac"],
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container[data-centro="cac"] {
  --current-color: var(--cac-color);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container[data-centro="rectoria"],
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container[data-centro="rectoria"] {
  --current-color: var(--rectoria-color);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .download,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .download {
  width: clamp(2.3rem, 5vw, 4rem);
  height: clamp(2.3rem, 5vw, 3rem);
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--bg-gray);
  font-size: clamp(1rem, 2vw, 1.5rem);
  font-weight: 700;
  text-align: center;
  transition: transform 0.15s ease-in-out;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .download:hover,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .download:hover {
  transform: scale(1.1);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .departamento-container
  > a
  > div
  > img,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  > a
  > div
  > img {
  width: clamp(2rem, 4vw, 3.5rem);
  height: clamp(2rem, 4vw, 2.5rem);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title {
  width: 100%;
  height: 100%;
  padding: 0.5rem 0.5rem 0.5rem 0.3rem;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  border-radius: 1rem 1rem 0;
  cursor: pointer;
  transition:
    border-radius 0.2s linear,
    background-color 0.2s linear;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title.ccsh
  a:focus-visible,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title.ccsh
  button:focus-visible,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title.cem
  a:focus-visible,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title.cem
  button:focus-visible,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title.ccsh
  a:focus-visible,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title.ccsh
  button:focus-visible,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title.cem
  a:focus-visible,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title.cem
  button:focus-visible {
  outline: 5px solid var(--bg-gray);
  outline-offset: 0px;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title:has(+ .departamento-container.active),
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title:has(+ .departamento-container.active) {
  border-radius: 1rem 1rem 0 0;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title
  h4,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title
  h4 {
  color: var(--bg-gray);
  font-size: clamp(1rem, 2vw, 1.3rem);
  font-weight: 700;
  text-align: center;
  width: 100%;
  margin: 1rem auto;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title
  .download-logo,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title
  .download-logo {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title
  .btn-dropdown,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title
  .btn-dropdown {
  border: none;
  background-color: transparent;
  cursor: pointer;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title
  .btn-dropdown
  .arrow,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title
  .btn-dropdown
  .arrow {
  color: var(--bg-gray);
  width: clamp(2.3rem, 5vw, 4rem);
  height: clamp(2.3rem, 5vw, 3rem);
  font-size: clamp(1rem, 2vw, 1.5rem);
  font-weight: 700;
  text-align: center;
  transition: transform 0.15s ease-in-out;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title
  .btn-dropdown
  .arrow:hover,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title
  .btn-dropdown
  .arrow:hover {
  transform: scale(1.1);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title
  .btn-dropdown
  .arrow.rotate,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title
  .btn-dropdown
  .arrow.rotate {
  transform: rotate(180deg);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title
  .btn-dropdown
  .arrow.rotate:hover,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title
  .btn-dropdown
  .arrow.rotate:hover {
  transform: rotate(180deg) scale(1.1);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title
  .logo,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title
  .logo {
  height: clamp(50px, 5vw, 65px);
  font-weight: 700;
  text-align: center;
  transition: transform 0.15s ease-in-out;
  color: white;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title:hover,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title:hover {
  background-color: color-mix(in srgb, var(--current-color) 100%, black 20%);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .dropdown-title:has(+ .departamento-container.active),
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title:has(+ .departamento-container.active) {
  background-color: color-mix(in srgb, var(--current-color) 100%, black 20%);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .departamento-container,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container {
  width: 100%;
  max-height: 0;
  display: flex;
  overflow: hidden;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 1rem 0 0 1rem;
  overflow: hidden;
  transition:
    border-radius 0.2s linear,
    max-height 0.2s linear;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .departamento-container.active,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container.active {
  max-height: 1300px;
  border-radius: 0 0 0 1rem;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .departamento-container
  .departamento,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .departamento {
  color: white;
  font-size: var(--font-size-md);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .departamento-container
  .download-dep-btn,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .download-dep-btn {
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: transform 0.15s ease-in-out;
  visibility: hidden;
  text-decoration: none !important;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .departamento-container
  .download-dep-btn.active,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .download-dep-btn.active {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  visibility: visible;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento {
  width: 100%;
  height: 100%;
  padding: clamp(0.5rem, 1vw, 0.6rem);
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-around;
  align-items: center;
  cursor: pointer;
  gap: 1rem;
  transition:
    max-height 0.2s linear,
    background-color 0.2s linear,
    border-radius 0.2s linear;
  border-bottom: 1px solid
    color-mix(in srgb, var(--current-color) 100%, black 10%);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento:hover,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento.highlight-temp,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento:hover,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento.highlight-temp {
  background-color: color-mix(in srgb, var(--current-color) 80%, black 20%);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento:hover
  h5,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento.highlight-temp
  h5,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento:hover
  h5,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento.highlight-temp
  h5 {
  transform: translateX(0.5rem);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento:has(+ .departamento-container.active),
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento:has(+ .departamento-container.active) {
  background-color: color-mix(in srgb, var(--current-color) 100%, black 10%);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento
  h5,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento
  h5 {
  color: var(--bg-gray);
  font-size: var(--font-size-md);
  font-weight: 700;
  text-align: left;
  width: 100%;
  margin: clamp(0.5rem, 1vw, 1rem) 0;
  transition: transform 0.15s ease-in-out;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento
  span,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento
  span {
  color: var(--bg-gray);
  font-size: var(--font-size-md);
  font-weight: 700;
  text-align: center;
  transition: transform 0.15s ease-in-out;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #centros
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento
  span.rotate,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento
  span.rotate {
  transform: rotate(180deg);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title {
  background-color: color-mix(
    in srgb,
    var(--rectoria-color) 10%,
    rgb(255, 255, 255) 90%
  );
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title:hover {
  background-color: color-mix(
    in srgb,
    var(--rectoria-color) 20%,
    rgb(255, 255, 255) 80%
  );
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title:has(+ .departamento-container.active) {
  background-color: color-mix(
    in srgb,
    var(--rectoria-color) 20%,
    rgb(255, 255, 255) 80%
  );
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title.no-apartados {
  position: relative;
  padding-bottom: 0.5rem 0.5rem 0.5rem 0.3rem;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title.no-apartados
  a.full-download-area::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  top: 0;
  right: 0;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title.no-apartados
  a.full-download-area {
  display: block;
  width: 100%;
  align-items: center;
  color: inherit;
  text-decoration: none !important;
  cursor: pointer;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title.no-apartados
  a.full-download-area
  .download-logo {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title.no-apartados
  a.full-download-area
  .download-logo
  .download {
  width: 10%;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .dropdown-title.no-apartados
  a.full-download-area
  .download-logo
  .logo {
  width: 90%;
  padding-right: 10%;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  a:not(:last-child) {
  border-bottom: 1px solid
    color-mix(in srgb, var(--rectoria-color) 30%, rgb(255, 255, 255) 70%);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .download,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .arrow {
  filter: var(--filter-azul);
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container {
  background-color: color-mix(
    in srgb,
    var(--rectoria-color) 10%,
    rgb(255, 255, 255) 90%
  );
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento:hover,
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento.highlight-temp {
  background-color: color-mix(
    in srgb,
    var(--rectoria-color) 20%,
    rgb(255, 255, 255) 80%
  );
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento:has(+ .departamento-container.active) {
  background-color: color-mix(
    in srgb,
    var(--rectoria-color) 20%,
    rgb(255, 255, 255) 80%
  );
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  #direcciones
  .imagotypes-container
  .departamento-container
  .download-dep-btn
  .departamento
  h5 {
  color: var(--primary-color);
}
section .panel .panel-body .imagotypes-cards .imagotype-card .grid-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 200px;
  gap: clamp(1rem, 2vw, 1rem);
  border-radius: 1rem;
}
@media (min-width: 2000px) {
  section .panel .panel-body .imagotypes-cards .imagotype-card .grid-container {
    grid-template-columns: repeat(6, 1fr);
  }
}
@media (max-width: 767px) {
  section .panel .panel-body .imagotypes-cards .imagotype-card .grid-container {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 480px) {
  section .panel .panel-body .imagotypes-cards .imagotype-card .grid-container {
    grid-template-columns: repeat(1, 1fr);
  }
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  .grid-container
  .grid-item {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  cursor: pointer;
  background-color: color-mix(
    in srgb,
    var(--rectoria-color) 10%,
    rgb(255, 255, 255) 90%
  );
  border-radius: 1rem;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  .grid-container
  .grid-item
  a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: inherit;
  background-color: color-mix(
    in srgb,
    var(--rectoria-color) 10%,
    rgb(255, 255, 255) 90%
  );
  border-radius: 1rem;
  transition: background-color 0.15s ease-in-out;
  padding: 0.5rem;
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  .grid-container
  .grid-item
  a
  img {
  height: 100%;
  object-fit: contain;
  object-position: center;
}
@media (min-width: 1200px) {
  section
    .panel
    .panel-body
    .imagotypes-cards
    .imagotype-card
    .grid-container
    .grid-item
    a
    img {
    width: 80%;
  }
}
@media (max-width: 1200px) {
  section
    .panel
    .panel-body
    .imagotypes-cards
    .imagotype-card
    .grid-container
    .grid-item
    a
    img {
    width: 95%;
  }
}
@media (max-width: 767px) {
  section
    .panel
    .panel-body
    .imagotypes-cards
    .imagotype-card
    .grid-container
    .grid-item
    a
    img {
    width: 90%;
  }
}
@media (max-width: 480px) {
  section
    .panel
    .panel-body
    .imagotypes-cards
    .imagotype-card
    .grid-container
    .grid-item
    a
    img {
    width: 80%;
  }
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card
  .grid-container
  .grid-item
  a:hover {
  background-color: color-mix(
    in srgb,
    var(--rectoria-color) 20%,
    rgb(255, 255, 255) 80%
  );
}
section
  .panel
  .panel-body
  .imagotypes-cards
  .imagotype-card:has(#noEsDireccion) {
  padding: clamp(1rem, 2vw, 1.5rem);
}
section .panel .panel-body .extra-downloads {
  width: 100%;
  height: 100%;
  padding: clamp(1rem, 3vw, 2rem) clamp(1rem, 2vw, 1.5rem);
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: flex-start;
  gap: clamp(1rem, 2vw, 1.5rem);
}
@media (max-width: 1200px) {
  section .panel .panel-body .extra-downloads {
    flex-direction: column;
  }
}
section .panel .panel-body .extra-downloads .bento-grid {
  --background-color: color-mix(
    in srgb,
    var(--rectoria-color) 10%,
    rgb(255, 255, 255) 90%
  );
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background-color: var(--background-color);
  grid-auto-rows: 200px;
  gap: clamp(1rem, 2vw, 1rem);
  padding: clamp(2rem, 3vw, 3rem) clamp(1rem, 4vw, 8rem);
  border-radius: 1rem;
}
@media (max-width: 1200px) {
  section .panel .panel-body .extra-downloads .bento-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 767px) {
  section .panel .panel-body .extra-downloads .bento-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 480px) {
  section .panel .panel-body .extra-downloads .bento-grid {
    grid-template-columns: repeat(1, 1fr);
  }
}
section .panel .panel-body .extra-downloads .bento-grid .card {
  view-timeline-name: --reveal-card;
  animation-name: show-card;
  animation-fill-mode: both;
  animation-timeline: --reveal-card;
  animation-range: entry 30% cover 50%;
  background-color: white;
  border-radius: 1rem;
  padding: 1rem;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: background-color 0.15s ease-in-out;
  cursor: pointer;
  overflow: hidden;
}
section .panel .panel-body .extra-downloads .bento-grid .card:has(.cover) {
  padding: 0;
}
section .panel .panel-body .extra-downloads .bento-grid .card:hover img {
  transform: scale(1.03);
}
section .panel .panel-body .extra-downloads .bento-grid .card.large {
  grid-column: span 2;
  grid-row: span 2;
}
section .panel .panel-body .extra-downloads .bento-grid .card.small {
  grid-column: span 1;
  grid-row: span 1;
}
section .panel .panel-body .extra-downloads .bento-grid .card.wide {
  grid-column: span 2;
}
section .panel .panel-body .extra-downloads .bento-grid .card.wider {
  grid-column: span 3;
  grid-row: span 2;
}
section .panel .panel-body .extra-downloads .bento-grid .card.tall {
  grid-row: span 2;
}
section .panel .panel-body .extra-downloads .bento-grid .card.taller {
  grid-row: span 3;
  grid-column: span 2;
}
section .panel .panel-body .extra-downloads .bento-grid .card.half-width {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 1rem;
}
section .panel .panel-body .extra-downloads .bento-grid .card.half-width img {
  width: 50%;
  height: auto;
}
@media (max-width: 1200px) {
  section .panel .panel-body .extra-downloads .bento-grid .card.large {
    grid-column: span 1;
    grid-row: span 1;
  }
  section .panel .panel-body .extra-downloads .bento-grid .card.small {
    grid-column: span 1;
    grid-row: span 1;
  }
  section .panel .panel-body .extra-downloads .bento-grid .card.wide {
    grid-column: span 2;
  }
  section .panel .panel-body .extra-downloads .bento-grid .card.wide.important {
    grid-column: span 1;
  }
  section .panel .panel-body .extra-downloads .bento-grid .card.wider {
    grid-column: span 1;
    grid-row: span 1;
  }
  section .panel .panel-body .extra-downloads .bento-grid .card.tall {
    grid-row: span 1;
  }
  section .panel .panel-body .extra-downloads .bento-grid .card.taller {
    grid-row: span 2;
    grid-column: span 1;
  }
  section .panel .panel-body .extra-downloads .bento-grid .card .cover {
    object-fit: contain !important;
  }
}
@media (max-width: 767px) {
  section .panel .panel-body .extra-downloads .bento-grid .card.wide {
    grid-column: span 1;
  }
}
@media (max-width: 480px) {
  section .panel .panel-body .extra-downloads .bento-grid .card.taller {
    grid-row: span 1;
  }
}
section .panel .panel-body .extra-downloads .bento-grid .card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 1rem;
  transition: transform 0.15s ease-in-out;
  padding: 1rem;
}
section .panel .panel-body .extra-downloads .bento-grid .card img.contain {
  object-fit: contain;
}
section .panel .panel-body .extra-downloads .bento-grid .card img.cover {
  object-fit: cover;
}
section .panel .panel-body .extra-downloads .bento-grid .card img.cover.active,
section
  .panel
  .panel-body
  .extra-downloads
  .bento-grid
  .card
  img.contain.active {
  transition: transform 0.15s ease-in-out;
}
section
  .panel
  .panel-body
  .extra-downloads
  .bento-grid
  .card
  img.cover.active:hover,
section
  .panel
  .panel-body
  .extra-downloads
  .bento-grid
  .card
  img.contain.active:hover {
  transform: scale(1.03);
}
@media (max-width: 900px) {
  section .panel .panel-body .extra-downloads .bento-grid .card img.hide-900 {
    display: none;
  }
}
section .panel .panel-body .extra-downloads .bento-grid .card span {
  font-weight: bold;
  text-align: center;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  color: white;
  background-color: rgba(0, 0, 0, 0.5);
  padding: 1rem;
  border-radius: 0 0 1rem 1rem;
  backdrop-filter: blur(10px);
  z-index: 10;
  transform: translateY(30%);
  transition:
    transform 0.15s ease-in-out,
    opacity 0.15s ease-in-out;
  opacity: 0;
}
section .panel .panel-body .extra-downloads .bento-grid .card:hover span {
  opacity: 1;
  transform: translateY(0);
}
@media screen and (max-width: 480px) {
  section .panel .panel-body .extra-downloads .bento-grid .card span {
    background-color: rgba(0, 0, 0, 0.75);
    backdrop-filter: blur(0px);
    transform: translateY(0);
    opacity: 1;
  }
}
section .panel .panel-body .extra-downloads .bento-grid .card.slide-left {
  position: relative;
  overflow: hidden;
}
section .panel .panel-body .extra-downloads .bento-grid .card.slide-left img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transform: translateX(100%);
  filter: blur(10px);
  transition:
    opacity 0.5s ease-in-out,
    transform 2s ease-in-out,
    filter 0.3s ease-in-out;
  z-index: 0;
}
section
  .panel
  .panel-body
  .extra-downloads
  .bento-grid
  .card.slide-left
  img.active {
  opacity: 1;
  transform: translateX(0);
  z-index: 1;
  filter: blur(0px);
}
section .panel .message-container {
  width: 90%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: white;
  border-radius: 1rem;
  margin-bottom: 2rem;
  padding: 1rem 2rem;
}
section .panel .message-container .message {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
section .panel .message-container .message .message-bold {
  font-weight: bold;
  margin-top: 1rem;
  line-height: 1.1lh;
}
section .panel .message-container .message p {
  width: 100%;
  font-weight: 500;
  text-align: justify;
  font-size: clamp(0.9rem, 1.2vw, 1rem);
  margin-top: 1rem;
}
section .panel .message-container .message p span,
section .panel .message-container .message p a {
  text-align: center;
  display: block;
  line-height: 1.2lh;
}
section .panel .message-container .message p a:hover {
  color: var(--azul-uaa);
  text-decoration: underline;
}
section .panel .message-container .message:last-child {
  margin-bottom: 1rem;
}
section .panel .copyright {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: var(--bg-gray);
  font-weight: 700;
  text-align: center;
  padding: 1rem;
}
section .panel .copyright p {
  margin: 0;
  font-size: var(--font-size-sm);
}

.back-button-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: var(--azul-uaa);
}
.back-button-container button {
  border: none;
  background-color: transparent;
  width: 100%;
  font-size: var(--font-size-md);
  margin: 1rem;
  color: var(--bg-gray);
  line-height: 1.3lh;
  cursor: pointer;
}
.back-button-container button:hover {
  text-decoration: underline;
}

.rectoria {
  background-color: var(--rectoria-color, black);
}

.cac {
  background-color: var(--cac-color, black);
}

.cem {
  background-color: var(--cem-color, black);
}

.cca {
  background-color: var(--cca-color, black);
}

.ccb {
  background-color: var(--ccb-color, black);
}

.cci {
  background-color: var(--cci-color, black);
}

.ccs {
  background-color: var(--ccs-color, black);
}

.ccdc {
  background-color: var(--ccdc-color, black);
}

.ccea {
  background-color: var(--ccea-color, black);
}

.cce {
  background-color: var(--cce-color, black);
}

.ccsh {
  background-color: var(--ccsh-color, black);
}

.cem {
  background-color: var(--cem-color, black);
}

.toast-container {
  bottom: 20px;
  right: 20px;
  position: fixed;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.toast-container .toast {
  width: clamp(200px, 60vw, 500px);
  height: 3lh;
  border-radius: 0.5rem;
  padding: 1rem;
  box-shadow: 0 0 1rem rgba(0, 0, 0, 0.5);
  z-index: 1000;
  color: var(--bg-gray);
  font-size: var(--font-size-md);
  font-weight: 700;
  text-align: center;
  transition: transform 0.15s ease-in-out;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.toast-container .toast.error {
  background-color: red;
  color: white;
}
.toast-container .toast.direccion {
  background-color: var(--primary-color);
  color: var(--bg-gray);
}
.toast-container .toast.active {
  animation: slideIn 0.3s ease-in-out;
  display: flex;
}
.toast-container .toast.hide {
  animation: slideOut 0.3s ease-in-out;
  display: none;
}

@keyframes slideIn {
  from {
    transform: translateX(100%);
    display: none;
  }
  to {
    transform: translateX(0);
    display: flex;
  }
}
@keyframes slideOut {
  from {
    transform: translateX(0);
    display: flex;
  }
  to {
    transform: translateX(100%);
    display: none;
  }
}
@keyframes show-card {
  from {
    transform: translateY(15%);
    opacity: 0.9;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

/* Context Menu */
#custom-context-menu {
  position: absolute;
  z-index: 10000;
  background-color: white;
  border-radius: 0.5rem;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  padding: 0.5rem 0;
  min-width: 150px;
}
#custom-context-menu ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
#custom-context-menu li {
  padding: 0.5rem 1rem;
  cursor: pointer;
  color: var(--primary-color);
  font-size: var(--font-size-sm);
  font-weight: 500;
  transition: background-color 0.2s;
  display: flex;
  align-items: center;
}
#custom-context-menu li:hover {
  background-color: var(--bg-gray);
}
#custom-context-menu li svg {
  color: var(--primary-color);
  opacity: 0.7;
}

/* Estilos añadidos sin SCSS */

/* Animaciones de pulso */
@keyframes pulse-brightness {
  0% {
    filter: brightness(1);
  }
  50% {
    filter: brightness(1.3);
  }
  100% {
    filter: brightness(1);
  }
}

@keyframes pulse-focus {
  0% {
    outline-offset: -3px !important;
  }
  50% {
    outline-offset: -6px !important;
  }
  100% {
    outline-offset: -3px !important;
  }
}

.highlight-pulse {
  animation: pulse-brightness 0.6s ease-in-out 3;
}

.highlight-focus {
  /* animation: pulse-focus 0.6s ease-in-out 3; */
  outline-offset: -3px !important;
  outline: 6px solid var(--amarillo-uaa) !important;
  border-radius: 1.2rem !important;
  transition: outline 0.3s ease;
}

/* Reglas añadidas para el hover simulado programático a través de JS */
html {
  scroll-behavior: smooth;
}

section .panel .panel-body .download-cards .download-card a.simulated-hover {
  transform: translateY(-0.3rem);
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.2);
}

section .panel .panel-body .imagotypes-cards .imagotype-card .grid-container .grid-item a.simulated-hover,
section .panel .panel-body .imagotypes-cards .imagotype-card #direcciones .imagotypes-container .dropdown-title.simulated-hover,
#noEsDireccion .header.simulated-hover,
#noEsDireccion .departamentos-list .dept-link.simulated-hover {
  background-color: color-mix(in srgb, var(--rectoria-color) 20%, rgb(255, 255, 255) 80%);
}

#noEsDireccion .header.simulated-hover .download-btn-header {
  transform: scale(1.1);
}

#noEsDireccion .header.simulated-hover .download-btn-header .download {
  transform: scale(1.01);
}

section .panel .panel-body .extra-downloads .bento-grid .card.simulated-hover img {
  transform: scale(1.03);
}

section .panel .panel-body .extra-downloads .bento-grid .card.simulated-hover span {
  opacity: 1;
  transform: translateY(0);
}

section .panel .panel-body .imagotypes-cards .imagotype-card #centros .imagotypes-container .departamento-container .download-dep-btn .departamento.simulated-hover,
section .panel .panel-body .imagotypes-cards .imagotype-card #direcciones .imagotypes-container .departamento-container .download-dep-btn .departamento.simulated-hover {
  background-color: color-mix(in srgb, var(--current-color) 80%, black 20%);
}

section .panel .panel-body .imagotypes-cards .imagotype-card #centros .imagotypes-container .departamento-container .download-dep-btn .departamento.simulated-hover h5,
section .panel .panel-body .imagotypes-cards .imagotype-card #direcciones .imagotypes-container .departamento-container .download-dep-btn .departamento.simulated-hover h5 {
  transform: translateX(0.5rem);
}

/*# sourceMappingURL=styles.css.map */