.questions {
    text-align: center;
}

.questions__container {
    display: grid;
    gap: 2em;
    padding: 50px 20px; /* Ajuste del padding para adaptarse a pantallas pequeñas */
    /* padding-bottom: 100px; */
    /* Eliminado padding horizontal fijo para mayor flexibilidad */
}

.questions__container h3 {
    font-size: 2rem; /* Ajusta el tamaño de la fuente usando unidades relativas */
}

.questions__padding {
    padding: 0;
    transition: padding 0.3s;
    border: 5px solid #1450A3;
    border-radius: 100px;
}

.questions__padding--add {
    padding-bottom: 100px;
}

.questions__answer {
    padding: 0 20px; /* Reducción del padding para pantallas más pequeñas */
    overflow: hidden;
}

.questions__title {
    text-align: left;
    display: flex;
    font-size: 1.25rem; /* Ajusta el tamaño de la fuente usando unidades relativas */
    padding: 20px 0; /* Ajuste del padding para pantallas más pequeñas */
    cursor: pointer;
    color: var(--color-title);
    justify-content: space-between;
}

.questions__arrow {
    border-radius: 50%;
    background-color: var(--color-title);
    width: 40px; /* Reducción del tamaño del botón para pantallas más pequeñas */
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 10px;
    transition: transform 0.3s;
}

.questions__arrow--rotate {
    transform: rotate(180deg);
}

.questions__show {
    text-align: justify;
    height: 0;
    overflow: hidden; /* Añadido overflow hidden para asegurar que el contenido no se desborde */
    transition: height 0.3s ease; /* Ajustado a una transición más suave */
}

.questions__img {
    display: block;
    max-width: 100%; /* Asegura que la imagen no se desborde */
    height: auto; /* Mantiene la proporción de la imagen */
}

/* Ajustes para dispositivos móviles */
@media (max-width: 768px) {
    .questions__container {
        padding: 50px 10px; /* Ajusta el padding horizontal en pantallas más pequeñas */
    }

    .questions__container h3 {
        font-size: 1.5rem; /* Ajusta el tamaño de la fuente en pantallas más pequeñas */
    }

    .questions__answer {
        padding: 0 10px; /* Reduce el padding en dispositivos móviles */
    }

    .questions__title {
        font-size: 1rem; /* Ajusta el tamaño de la fuente para móviles */
        padding: 15px 0; /* Ajusta el padding para móviles */
    }

    .questions__arrow {
        width: 35px; /* Ajusta el tamaño del botón en móviles */
        height: 35px;
    }
}

@media (max-width: 480px) {
    .questions__container h3 {
        font-size: 1.25rem; /* Ajusta el tamaño de la fuente para pantallas muy pequeñas */
    }

    .questions__arrow {
        width: 30px; /* Ajusta el tamaño del botón en pantallas muy pequeñas */
        height: 30px;
    }
}
/* .questions__copy{
    width: 60%;
    margin: 0 auto;
    margin-bottom: 30px;
} */





/* CARDS  MISION VISION VALORES*/

.cards-container {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 0 2%; /* Ajustado el padding para mayor flexibilidad */
}

.cards {
    width: calc(33.33% - 20px); /* Ajusta el ancho de las tarjetas */
    height: 420px;
    margin-bottom: 20px; /* Añadido margen inferior para espacio entre filas */
    position: relative;
    overflow: hidden;
    transform: translateY(0);
    transition: transform 0.5s ease; /* Ajustado la transición para suavizar el efecto de hover */
    object-fit: cover;
    border-radius: 20px;
}

/* Información dentro de la tarjeta */
.cards .info {
    position: absolute;
    top: 0; /* Ajustado para que se alinee correctamente */
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    color: #FFFFFF; /* Asegura buen contraste */
    padding: 20px;
    background: linear-gradient(to bottom, rgba(69, 194, 255, 0.8), rgba(0, 13, 91, 0.8)); /* Ajuste de opacidad para mejor legibilidad */
}

/* Estilos para el título dentro de la tarjeta */
.cards .info h1 {
    margin: 1;
}

/* Estilos para el párrafo dentro de la tarjeta */
.cards .info p {
    letter-spacing: 1px;
    font-size: 15px;
    margin-top: 8px;
    margin-bottom: 20px;
    text-align: justify;
}

/* Efecto hover en la tarjeta */
.cards:hover {
    transform: translateY(-10px); /* Ajusta el movimiento para que no sea tan grande */
    transition: transform 0.3s ease; /* Suaviza la transición */
}

/* Ajustes para dispositivos móviles */
@media (max-width: 768px) {
    .cards {
        width: calc(50% - 20px); /* Ajusta el ancho para pantallas más pequeñas */
    }
}

@media (max-width: 480px) {
    .cards {
        width: calc(100% - 20px); /* Ajusta el ancho para pantallas muy pequeñas */
    }
}






/* 3D Slideshow */
* {
	margin: 0;
	padding: 0;
}

html, body {
	max-width: 100%;
	/* overflow-x: hidden;
	overflow-y: hidden; */
	background-color: #ffffff;
}

#slideshow {
	margin: 0;
	padding-top: 30px;
	height: 200px;
	width: 100%;
	background-color: #ffffff;
	box-sizing: border-box;
}

.slideshow-title {
	font-family: 'Allerta Stencil';
	font-size: 30px;
	color: #050505;
	margin: 0 ;
	text-align: center;
	margin-top: 0%;
	letter-spacing: 3px;
	/* font: weight 300px;; */
}

.sub-heading {
	padding-top: 50px;
	font-size: 18px;
} .sub-heading-two {
	font-size: 15px;
} .sub-heading-three {
	font-size: 13px;
} .sub-heading-four {
	font-size: 11px;
} .sub-heading-five {
	font-size: 9px;
} .sub-heading-six {
	font-size: 7px;
} .sub-heading-seven {
	font-size: 5px;
} .sub-heading-eight {
	font-size: 3px;
} .sub-heading-nine {
	font-size: 1px;
}

.entire-content {
	margin: auto;
	width: 90px;
	perspective: 2000px;
	position: relative;
	padding-top: 20px;
}

.content-carrousel {
    width: 70%;
    position: absolute;
    float: right;
    animation: rotar 80s infinite linear forwards; /* Aumenta la duración a 30s o más */
    transform-style: preserve-3d;
  }

/* .content-carrousel:hover {
	animation-play-state: paused;
	cursor: pointer;
} */

.content-carrousel figure {
	width: 100%;
	height: 50px;
	border: 0px solid #191D88;
	/* overflow: hidden; */
	position: absolute;
}

.content-carrousel figure:nth-child(1) {
	transform: rotateY(0deg) translateZ(550px);
} .content-carrousel figure:nth-child(2) {
	transform: rotateY(18deg) translateZ(550px);
} .content-carrousel figure:nth-child(3) {
	transform: rotateY(36deg) translateZ(550px);
} .content-carrousel figure:nth-child(4) {
	transform: rotateY(54deg) translateZ(550px);
} .content-carrousel figure:nth-child(5) {
	transform: rotateY(72deg) translateZ(550px);
} .content-carrousel figure:nth-child(6) {
	transform: rotateY(90deg) translateZ(550px);
} .content-carrousel figure:nth-child(7) {
	transform: rotateY(108deg) translateZ(550px);
} .content-carrousel figure:nth-child(8) {
	transform: rotateY(126deg) translateZ(550px);
} .content-carrousel figure:nth-child(9) {
	transform: rotateY(144deg) translateZ(550px);
} .content-carrousel figure:nth-child(10) {
	transform: rotateY(162deg) translateZ(550px);
} .content-carrousel figure:nth-child(11) {
    transform: rotateY(180deg) translateZ(550px);
}
.content-carrousel figure:nth-child(12) {
    transform: rotateY(198deg) translateZ(550px);
}

.content-carrousel figure:nth-child(13) {
    transform: rotateY(216deg) translateZ(550px);
}

.content-carrousel figure:nth-child(14) {
    transform: rotateY(234deg) translateZ(550px);
}
.content-carrousel figure:nth-child(15) {
    transform: rotateY(252deg) translateZ(550px);
}
.content-carrousel figure:nth-child(16) {
    transform: rotateY(270deg) translateZ(550px);
}
.content-carrousel figure:nth-child(17) {
    transform: rotateY(288deg) translateZ(550px);
}
.content-carrousel figure:nth-child(18) {
    transform: rotateY(306deg) translateZ(550px);
}
.content-carrousel figure:nth-child(19) {
    transform: rotateY(324deg) translateZ(550px);
}
.content-carrousel figure:nth-child(20) {
    transform: rotateY(342deg) translateZ(550px);
}
.content-carrousel figure:nth-child(21) {
    transform: rotateY(360deg) translateZ(550px);
}


.shadow {
    position: absolute;
    box-shadow: 0px 0px 5px 0px #191D88;
    border-radius: .5px;
}

.content-carrousel img {
	image-rendering: auto;
	transition: all 400ms;
	width: 100%;
	height: 100%;
}

.content-carrousel img:hover {
	transform: scale(1.9);
	transition: all 500ms;
}

@keyframes rotar {
    0% {
      transform: rotateY(0deg);
    }
    100% {
      transform: rotateY(360deg); /* Cambia a 360deg para una rotación completa */
    }
  }

  @media (max-width: 768px) {

    .content-carrousel figure {
        width: 60px;
        height: 60px;
        border: 0px solid #191D88;
        position: absolute;
    }
    .questions__padding{
   
    }

    
    .questions__answer{
        padding: 0px 25px 0px 25px;
        overflow: hidden;
    }

    .content-carrousel figure:nth-child(1) {
        transform: rotateY(0deg) translateZ(200px);
    } .content-carrousel figure:nth-child(2) {
        transform: rotateY(18deg) translateZ(200px);
    } .content-carrousel figure:nth-child(3) {
        transform: rotateY(36deg) translateZ(200px);
    } .content-carrousel figure:nth-child(4) {
        transform: rotateY(54deg) translateZ(200px);
    } .content-carrousel figure:nth-child(5) {
        transform: rotateY(72deg) translateZ(200px);
    } .content-carrousel figure:nth-child(6) {
        transform: rotateY(90deg) translateZ(200px);
    } .content-carrousel figure:nth-child(7) {
        transform: rotateY(108deg) translateZ(200px);
    } .content-carrousel figure:nth-child(8) {
        transform: rotateY(126deg) translateZ(200px);
    } .content-carrousel figure:nth-child(9) {
        transform: rotateY(144deg) translateZ(200px);
    } .content-carrousel figure:nth-child(10) {
        transform: rotateY(162deg) translateZ(200px);
    } .content-carrousel figure:nth-child(11) {
        transform: rotateY(180deg) translateZ(200px);
    }
    .content-carrousel figure:nth-child(12) {
        transform: rotateY(198deg) translateZ(200px);
    }
    
    .content-carrousel figure:nth-child(13) {
        transform: rotateY(216deg) translateZ(200px);
    }
    
    .content-carrousel figure:nth-child(14) {
        transform: rotateY(234deg) translateZ(200px);
    }
    .content-carrousel figure:nth-child(15) {
        transform: rotateY(252deg) translateZ(200px);
    }
    .content-carrousel figure:nth-child(16) {
        transform: rotateY(270deg) translateZ(200px);
    }
    .content-carrousel figure:nth-child(17) {
        transform: rotateY(288deg) translateZ(200px);
    }
    .content-carrousel figure:nth-child(18) {
        transform: rotateY(306deg) translateZ(200px);
    }
    .content-carrousel figure:nth-child(19) {
        transform: rotateY(324deg) translateZ(200px);
    }
    .content-carrousel figure:nth-child(20) {
        transform: rotateY(342deg) translateZ(200px);
    }
    .content-carrousel figure:nth-child(21) {
        transform: rotateY(360deg) translateZ(200px);
    }
  }









