* {
  box-sizing: border-box;
}
:root{

  --leiva-acento1:#B9B2D6;
  --leiva-acento2:#82C9BF;
  --leiva-acento3:#F08279;
  --leiva-acento4:#F6F6F6;
  --leiva-acento5:#F9C900;

  --color-azul-menu:#1F1D3E;

  --color-anteriores-2015:#DBDCDC;
  --color-anteriores-2016:#8CBB9A;
  --color-anteriores-2017:#EDB59C;
  --color-anteriores-2018:#F298BA;
  --color-anteriores-2020:#F298BA;
  --color-anteriores-2021:#53B57F;
  --color-anteriores-2022:#8DCFD9;

  
  --font-titulos:1.5rem;
  --font-subtitulos:1.5rem;
  --font-resalte:1.3rem;
  --font-botones: 1.3rem;
  --font-general:1.2rem;
  --font-footer:1rem;
}
body {
  margin: 0;
  background: url("./img/degradado_leiva.svg") center / cover no-repeat;
  font-family: "Noto Sans", sans-serif;
  overflow: hidden;
}
#particles {
  position: absolute;
  inset: 0;
  z-index:0;
  opacity: 0.5;
}/* ==========================================
TAMAÑOS PARA ETIQUETAS Y SECCIONES DE TEXTO
========================================== */
p{
  font-size: var(--font-general); 
  line-height: 2;
  font-family: "Noto Sans", sans-serif;
  font-weight: 250;
  text-size-adjust: 90%;
  letter-spacing: 1px;
}
h2{
  font-size: var(--font-titulos);
  margin: 0;
  font-family: "Noto Sans", sans-serif;
  text-size-adjust: 90%;
  letter-spacing: 1px;
}
h1{
  font-size: var(--font-subtitulos);
  margin-top: 1rem;
  font-family: "Noto Sans", sans-serif;
  text-size-adjust: 90%;
  letter-spacing: 1px;
}
h3{
  font-size: var(--font-subtitulos);
  margin-top: 1rem;
  font-family: "Noto Sans", sans-serif;
  text-size-adjust: 90%;
  letter-spacing: 1px;
}
li{
  font-size: var(--font-general);
  margin: 0;
  font-family: "Noto Sans", sans-serif;
  font-weight: 250;
  line-height: 2;
  letter-spacing: 1px;
}
strong{
  font-size: var(--font-resalte);
  font-family: "Noto Sans", sans-serif;
  font-weight: 600;
  letter-spacing: 2px;
}
/* 
============================================
COLORES PARA TITULOS, SUBTITULOS Y TEXTOS GENERALES 
===========================================*/
.acento-lila{
  color: var(--leiva-acento1);
}
.acento-verde{
  color: var(--leiva-acento2);
}
.acento-naranja{
  color: var(--leiva-acento3);
}
.acento-amarillo{
  color: var(--leiva-acento5);
}
.acento-blanco{
  color: var(--leiva-acento4);
}
.link {
  color: var(--leiva-acento5);
  cursor: pointer;
  text-decoration: none; 
  background-image: linear-gradient(var(--leiva-acento5), var(--leiva-acento5));
  background-position: 0% 100%;
  background-repeat: no-repeat;
  background-size: 100% 2px; /* La línea inicial */
  transition: background-size 0.3s;
}

.link:hover {
  background-size: 100% 100%;
  color: #000; 
}
/* ESTILOS PARA LAS SECCIONES INTERIORES/ CLASES COMPARTIDAS */
.espacio-interno{
  width: 60%;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  flex-direction: column;
  margin: 0 auto;
  padding-bottom: 3rem;
}
.espacio-interno-anteriores{
  padding-bottom: 3rem;
}
/* ===============================
SECCIONES Y ESTILO DE CAMARA
============================== */
.game-world {
  width: 100vw;
  height: 100dvh;
  perspective: 2000px;
  overflow: hidden;
  position: relative;
}
.edificios{
  position: absolute;
  right:-5rem;
  bottom: 9rem;
  opacity: .4;

}
.edificios-izq{
  position: absolute;
  left:-5rem;
  top: 4rem;
  opacity: .4;

}
/* ANIMACION PARA LOS EDIFICIOS DE FONDO */
@keyframes flotar {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-15px); 
  }
  100% {
    transform: translateY(0px);
  }
}

.edificios, 
.edificios-izq {
  display: block; 
  will-change: transform;
}

.edificios {
  animation: flotar 10s ease-in-out infinite;
}

.edificios-izq {
  animation: flotar 10s ease-in-out infinite;
  animation-delay: 1s;
}
.camera {
  width: 100%;
  height: 100%;
  position: relative;
  transform-style: preserve-3d;
  transition: transform 1.2s cubic-bezier(.7,0,.2,1);
}
/*
===================================
 Posiciones espaciales optimizadas 
 ==================================
 */

/* Centro */
[data-room="inicio"] { transform: translate3d(0, 0, 0); }

/* Abajo (como un sótano) */
[data-room="bases"] { transform: translate3d(0, 100dvh, 0); }

/* Derecha (Nivel 1) */
[data-room="actividades"] { transform: translate3d(100vw, 0, 0); }

/* Más a la derecha (Nivel 2) */
[data-room="formulario"] { transform: translate3d(200vw, 0, 0); }

/* Izquierda */
[data-room="anteriores"] { transform: translate3d(-100vw, 0, 0); }

/* Fondo Lejano */
[data-room="informes"] { 
  transform: translate3d(100vw, 100dvh, 0); 
}

/* 
============================
MENU STYLES CSS 
============================
*/
/* contenedor general para las ventans de información */
.room {
  position: absolute;
  width: calc(100vw - 30vw);
  height: calc(100vh - 25vh);
  top: 1dvh;
  left: 15vw;
  background: rgba(40, 38, 90, 0.85); 
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  border-radius: 20px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.4);
  color: white;
  display: block; 
  overflow-y: auto;  
  overflow-x: hidden;
  padding: 0;
}
/* clase para el menu general. Nota: esta incrustado en todas las ventanas con javascript */
.hud-menu {
  width: 100%;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  padding: 1rem 0;
  background: var(--color-azul-menu);
  z-index: 10;
  position: sticky;  
  top: 0;            
  left: 0;
  box-sizing: border-box;
  font-family: "Noto Sans", sans-serif;
}
/* espacio interior del menu */
.espacio-int-menu{
  width: 60%;
}
.menu-links{
  display: flex ;
  flex-direction: row;
  justify-content: space-between;
  flex-wrap: nowrap;
  width:100%;
  font-family: "Noto Sans", sans-serif;
}
.hud-menu button {
  background: transparent;
  font-family: "Noto Sans", sans-serif;
  cursor: pointer;
  font-size: var(--font-general);
  transition: all 0.3s ease;
  box-shadow: none !important;
  border: none;
  text-decoration: none;
  font-weight: bold;
  padding: .5rem;
}
/* colores de texto para el menu */
.hud-menu  button:nth-child(1) {
  color: var(--leiva-acento2);
}
.hud-menu  button:nth-child(2) {
  color: var(--leiva-acento3);
}
.hud-menu  button:nth-child(3) {
  color: var(--leiva-acento1);
}
.hud-menu  button:nth-child(4) {
  color: var(--leiva-acento2);
}
.hud-menu  button:nth-child(5) {
  color: var(--leiva-acento3);
}
/* hovers para el menu  */
.menu-links button:nth-child(1):hover {
  background-color: var(--leiva-acento2);
  color:rgba(40, 38, 90, 0.9); 
  filter: brightness(1.2); 
}
.menu-links  button:nth-child(1):hover {
  background-color: var(--leiva-acento2);
  color:rgba(40, 38, 90, 0.9); 
  filter: brightness(1.2); 
}
.menu-links  button:nth-child(2):hover {
  background-color: var(--leiva-acento3);
  color:rgba(40, 38, 90, 0.9); 
  filter: brightness(1.2); 
}
.menu-links  button:nth-child(3):hover {
  background-color: var(--leiva-acento1);
  color:rgba(40, 38, 90, 0.9); 
  filter: brightness(1.2); 
}
.menu-links  button:nth-child(4):hover {
  background-color: var(--leiva-acento2);
  color:rgba(40, 38, 90, 0.9); 
  filter: brightness(1.2); 
}
.menu-links  button:nth-child(5):hover {
  background-color: var(--leiva-acento3);
  color:rgba(40, 38, 90, 0.9); 
  filter: brightness(1.2); 
}
.btn-muestras:hover {
  background-color: var(--leiva-acento1);
  color:rgba(40, 38, 90, 0.9) !important; 
  filter: brightness(1.2); 
}
/* estilos unicos para el boton de menu "muestras" */
.btn-muestras{
  text-decoration: none;
  color: var(--leiva-acento1);
  padding: .5rem;
}
.menu-toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 10px;
}
.menu-toggle:hover{
  transform: scale(1.2);
}
.menu-toggle span:nth-child(1) {
  background-color: var(--leiva-acento2);
}
.menu-toggle span:nth-child(2) {
  background-color: var(--leiva-acento5);
}
.menu-toggle span:nth-child(3) {
  background-color:var(--leiva-acento3);
}
/* ============================
EL LOGO ENCIMA DEL HEADER, LOGO DE CULTURA
============================ */
.logo-cultura{
  width: 100%;
  height: 6rem;
  display:flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 1.5rem;
  margin-top: 2rem;

}
.logo-cultura img{
  height: 4rem;
}
/* ============================
SECCIÓN INICIO STYLES
============================ */
/* logos para las imagenes de LEIVA-INVITACIÓN
estan en la parte de inicio ya que se encuentran en la misma ventana */
.contenedor-inicio-imagen{
  width: 100%;
  height: 100vh;
  padding: 4rem 0 4rem 0 ;
  display: flex;
  justify-content: center;
}
.logo-escritorio {
  display: block;
  height: clamp(300px, 50vw, 480px);
  width: auto;
}
.logo-movil{
  display: none;
}
.seccion-inicio{
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  overflow: hidden;
  overflow-y: scroll;
  position: relative;
}
.seccion-inicio::-webkit-scrollbar {
  width: .45rem;
}
.seccion-inicio::-webkit-scrollbar-thumb {
  background: var(--leiva-acento2);
  border-radius: 1rem;
}

/* 
=========================
SECCIÓN  CALENDARIO DE ACTIVIDADES STYLES 
========================
*/

.seccion-actividades {
  display: flex !important; 
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: stretch;
  overflow-y: auto; 
  overflow-x: hidden;
  padding: 0 !important; 
}

.seccion-actividades .hud-menu {
  position: sticky;
  top: 0;
  width: 100%;
  z-index: 1000;
  flex-shrink: 0; 
}
.container-card, .grid-container {
  height: auto !important;
  min-height: min-content;
  width: 100%;
  margin-top: 1rem;
}
.container-card {
  width: 80%;
  height: auto; 
  display: flex;
  flex-direction: column;
  padding:3rem;
  margin: 0 auto;
}
.container-card h2{
  text-size-adjust: 90%;
}

.grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); 
  gap: 2rem;
  width: 100%;
  margin: 0 auto;
  padding: 20px 0;
}

.card-actividades {
  perspective: 1000px; 
  min-height: 500px;    
}
.card-actividades {
  width: 100%; 
  height: 100%;
  min-height: 300px;
  box-sizing: border-box;
  background-color: #3949ab; 
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;

}

.card-back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #283593; 
  padding: 1rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  opacity: 0; 
  transition: opacity 0.3s ease;
  pointer-events: none;
}
.card-back{
  text-align: start;
}

.escaleras{
  position: absolute;
  bottom: 0;
  left: 0;
}
.escaleras-enmedio{
  position: absolute;
  bottom: 0;
  left: 50%; 
  transform: translateX(-50%);
}
.escaleras-arriba{
  position: absolute;
  bottom: 0;
  right: 0;
}
.escaleras-arriba-left{
  position: absolute;
  top: 0;
  left: 0;
}
.escaleras-abajo{
  position: absolute;
  bottom: 0;
  right:0;
}
.escaleras-final{
  position: absolute;
  top: 0;
  right: 0;
}
.img-luminosidad {
    mix-blend-mode: luminosity;
}

.img-exclusion {
    mix-blend-mode: exclusion;
}
.card-back p,.card-back h2, .card-back h3, .card-back strong, .card-back a{
  margin: 0;
  line-height: 1.2;
  letter-spacing: .5px;
  text-size-adjust: 90%;
  
}
.card-back .titulo-actividades{
  font-size: 1.2rem !important;
}
.card-back .acento-verde{
  font-weight: 400 !important;
}
.letras-mini{
  font-size: 1.4rem !important;
}
.card-back strong{
  line-height: 1.2;
  margin-top: .3rem;
  font-size: 1rem !important;
}
.card-back p{
  line-height: 1.2;
  margin-top: .3rem;
  font-size: 1rem !important;
}

.card-actividades:hover .card-back {
  opacity: 1;
  pointer-events: auto;
}
.seccion-actividades::-webkit-scrollbar {
  width: .45rem;
}
.seccion-actividades::-webkit-scrollbar-thumb {
  background: var(--leiva-acento2);
  border-radius: 1rem;
}

/* 
=========================
SECCIÓN ANTERIORES STYLES 
========================
*/
.espacio-interno-anteriores{
  width: 80%;
  height: auto;
  display: flex;
  padding: 3rem;
  margin: 0 auto;
}
.ediciones-anteriores{
  display: flex;
  flex-wrap: wrap;
}
.container-anteriores h2{
  text-size-adjust: 80%;
}
.card-anteriores {
  width: 4rem;
  height: 4rem; 
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  cursor: pointer;
  transition: all 0.3s ease;
}

.card-anteriores:hover {
  background: rgba(180, 150, 255, 0.1);
  box-shadow: inset 0 0 10px rgba(180, 150, 255, 0.2);
}

.card-anteriores .año {
  font-weight: bold;
  font-size: var(--font-general);
  margin: 0;
}

@keyframes slideDown {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}

.display-container {
  display: none; 
  animation: slideDown 0.4s cubic-bezier(0.2, 1, 0.3, 1);
  margin-top: 20px;
}

.info-panel {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 30px;
  padding: 30px;
}

.image-año {
  grid-row: span 2; 
  width: 100%;
  aspect-ratio: 1 / 1;
  background-size: cover;
  background-position: center;
}

.info-content {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.resultado,
.actividades{
  display: flex;
  flex-wrap:wrap;
}
.cajas{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.seccion-anteriores::-webkit-scrollbar {
  width: .45rem;
}
.seccion-anteriores::-webkit-scrollbar-thumb {
  background: var(--leiva-acento2);
  border-radius: 1rem;
}
.color-2014, .color-2019, .color-2023,.a2023, .a2014, .a2019{
  color: var(--leiva-acento5);
}
.color-2015, .a2015{
  color: var(--color-anteriores-2015);
}
.color-2016, .a2016{
  color:var(--color-anteriores-2016);
}
.color-2017, .a2017{
  color: var(--color-anteriores-2017);
}
.color-2018, .a2018{
  color: var(--color-anteriores-2018);
}
.color-2020, .a2020{
  color: var(--color-anteriores-2020);
}
.color-2021, .a2021{
  color: var(--color-anteriores-2021);
}
.color-2022, .a2022{
  color: var(--color-anteriores-2022);
}

.datos-anteriores{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 2rem;
  justify-content: flex-start;
  align-items: flex-start;
  margin-left: 1rem;
  color: var(--leiva-acento3);

}
.actividades, .resultados{
  display: flex;
  flex-direction: column;
  width: auto;
}
.cajas{
  display: flex;
  flex-direction: row;
  gap: 1rem;
  align-items: flex-start;
}
.etiqueta{
  color: var(--leiva-acento5);
}
.num-res, .num-act{
  color: var(--leiva-acento4);
  font-weight: 600;
}
/* 
==============================
SECCION-REGISTRO CSS STYLES
============================== */

.container-registro{
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.caja-de-forms{
  width: 90%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
}
.caja-de-forms h2{
  margin-top: 3rem;
}
iframe{
  width: 100%;
  background-color:#fff;
}
/* 
==============================
SECCION-INFORMES CSS STYLES
============================== */
.room .seccion-informes{
  width: 100%;
}
.container-informes{
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  margin-top: 3rem;
  position: relative;
}
.container-informes p{
  line-height: 1.3;
  padding: 0;
  margin: 0;
}
.seccion-informes .espacio-interno img{
  position: absolute;
  bottom: 1rem;
  right: 3rem;
  z-index: 1;
  opacity: .4;
}
.datos-informes h3, .datos-informes strong{
  margin: 0;
  padding: 0;
}
/* =========================
FOOTER STYLES
========================= */
footer {
  width: 100%;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  position: absolute;
  bottom: 0;
}
.contenedor-footer{
  width: 100%;
  margin: 0 auto;
}
.cont-footer-txt{
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  box-sizing: border-box;
  gap: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  box-sizing: border-box;
}
.contendor-redes img{
  width: auto;
  height: 1.5rem;
}
.footer-leiva {
  grid-template-columns: 1fr; 
  grid-template-rows: auto auto; 
  color: var(--leiva-acento4);
  justify-content: center;
  gap: 2rem;
  margin: 0 auto;
}

.contendor-redes{
  display:flex;
  flex-direction: row;
  gap: 1rem;
}
.contendor-redes a, .contendor-redes strong, .contendor-redes p {
  letter-spacing: 1px;
  line-height:1.2;
}
.contenedor-direccion p{
  line-height:1.7;
}
.footer-leiva strong,.footer-leiva p{
  font-size: var(--font-footer) !important;
  margin: 0;
}

.contenedor-cenart img{
  width: 8rem;
}
.contenedor-redes-movil{
  width: 60%;
  display: none;
  justify-content: center;
  align-items: center;
  flex-direction: row;
  gap: 2rem;
  margin: 0 auto;
  padding: 2rem;
}
.caja-logos{
  display: flex;
  flex-direction: row;
  gap: .5rem;
}
.logo-redes img{
  height: 1.3rem;
}
.logo-cenart img{
  height: 2.5rem;
}

@keyframes rebote {
  0% { transform: scale(1); }
  30% { transform: scale(1.3); }
  50% { transform: scale(0.95); }
  100% { transform: scale(1.1); }
}
.facebook a, 
.instagram a, 
.twitter a {
  transition: transform 0.3s ease;
}


.facebook a:hover img, 
.instagram a:hover img, 
.twitter a:hover img {
  animation: rebote 0.5s ease-out forwards;
}


.facebook img, 
.instagram img, 
.twitter img {
  transition: transform 0.3s ease-in-out;
}

.contenedor-cenart a:hover img {
  animation: rebote 0.5s ease-out forwards;
}

.contenedor-cenart img {
  transition: transform 0.3s ease-in-out;
}

/* =========================
  MEDIA QUERIES STYLES 1500px
  ========================= */
@media (max-width: 1500px) {
  .espacio-int-menu {
    width: 90%;
  }
  .menu-links {
    gap: 0;
  }
  .logo-cultura {
    margin-top: 1rem;
  }

  .footer-leiva p,
  .footer-leiva strong {
    text-size-adjust: 80%;
  }
  .contendor-redes img {
    height: 1.5rem;
  }
  .contenedor-cenart {
    width: 10%;
  }
  .contenedor-cenart img {
    width: 7rem;
  }
  /* EDICIONES ANTERIORES */
  .ediciones-anteriores {
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    gap: 5px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(180, 150, 255, 0.2);
  }
  .info-panel{
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 1rem;
  }
  .info-content{
    width: 100%;
  }
}
/* =========================
  MEDIA QUERIES STYLES 1020px
  ========================= */
@media (max-width: 1020px) {
  .info-panel {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    justify-items: center;
    gap: 1rem;
    padding: 0 0 1rem;
  }

  .image-año {
    grid-row: 1;
    width: 150px;
    height: 150px;
    margin: 0 auto;
  }

  .info-content {
    grid-row: 2;
    width: 100%;
    text-align: justify;
  }


  .card-anteriores {
    flex: 0 0 auto;
    width: 50px;
    height: 50px;
    border: 1px solid #444;
    background: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .card-anteriores .año {
    font-size: 0.9rem;
    letter-spacing: 0;
  }

  .menu-toggle {
    display: none;
    flex-direction: column;
    gap: 5px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 10px;
  }

  .menu-toggle span {
    display: block;
    width: 25px;
    height: 3px;
    background-color: white;
    transition: 0.3s;
  }

  .menu-toggle {
    display: flex;
    z-index: 10;
  }

  .hud-menu .menu-toggle {
    border: transparent;
    padding: 1rem;
  }

  .menu-links {
    display: none;
    flex-direction: column;
    width: 100%;
    position: absolute;
    top: 100%;
    left: 0;
    background: rgba(40, 38, 90, 0.95);
  }

  .hud-menu.open .menu-links {
    display: flex;
    height: 70vh;
    justify-content: flex-start;
  }

  .hud-menu {
    align-items: flex-end;
  }

  .hud-menu.open .menu-toggle span:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
  }
  .hud-menu.open .menu-toggle span:nth-child(2) {
    opacity: 0;
  }
  .hud-menu.open .menu-toggle span:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
  }

  .footer-leiva {
    flex-direction: column;
    padding: 0;
  }

  .cont-footer-txt {
    flex-direction: row;
    width: 100%;
  }

  .footer-leiva {
    display: none;
  }

  .contenedor-redes-movil {
    display: flex;
  }

  .contenedor-cenart {
    width: 100%;
    justify-content: center;
  }

  .seccion-informes .espacio-interno img {
    display: none;
  }

  .container-informes p {
    line-height: 1;
  }

  .logo-escritorio {
    height: clamp(300px, 50vw, 350px);
  }
}

/* =========================
MEDIA QUERIES 768px
========================= */
@media (max-width: 768px) {
  .game-world {
    perspective: 1000px;
  }

  .room {
    height: calc(100vh - 28vh);
  }

  .espacio-interno-anteriores,
  .container-card,
  .espacio-interno {
    width: 90%;
    padding: 2rem;
  }

  .edificios,
  .edificios-izq {
    display: none;
  }
}

/* =========================
MEDIA QUERIES 420PX
========================= */
@media (max-width: 420px) {
  .room {
    height: calc(100vh - 30vh);
  }

  .contenedor-inicio-imagen {
    padding: 7rem;
  }

  .logo-escritorio {
    display: none;
  }

  .logo-movil {
    display: flex;
    max-width: 250px;
  }

  .game-world {
    perspective: 800px;
  }

  .logo-cultura {
    margin-top: 1rem;
    padding: 1rem;
  }

  .logo-cultura img {
    height: 3rem;
  }

  .caja-de-forms,
  .container-card {
    width: 100%;
  }

  .seccion-informes .espacio-interno img {
    display: none;
  }
}