/*********************************
    REGLAS GENERALES
**********************************/

main {
	background-color: var(--marronRGBAso);
}

main > div {
	padding: 4.5rem 0;
}

main > .preguntasFrecuentes {
	margin: 0 5rem;
	background-color: #fff;
	background-image: url("./../png/preguntas-frecuentes_banner.png");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top right;
}

/*********************************
    BANNER
**********************************/

main .banner {
	padding-inline: 1rem;
}

main .banner > div {
	width: 55%;
	margin: 5rem auto;
}

main .banner > div > h1 {
	font-family: var(--fontMSR);
	font-size: clamp(2rem, 4vw, 3.5rem);
	text-align: center;
	color: var(--marron);
	margin-bottom: 0;
}

/*********************************
    PREGUNTAS
**********************************/

main .preguntas {
	padding-inline: 1rem;
	margin: 0 5rem;
}

main .preguntas li {
	margin-bottom: 1rem;
}

main .preguntas li::marker {
	color: var(--naranja);
	font-weight: 700;
}

main .preguntas .pregunta {
	font-family: var(--fontBM);
	color: var(--naranja);
}

main .preguntas .pregunta::before {
	content: '¿';
}

main .preguntas .pregunta::after {
	content: '?';
}

main .preguntas .repuesta {
	font-family: var(--fontBL);
	color: var(--marron);
}

/*********************************
    MEDIA QUERIES
**********************************/

@media (max-width: 1060px) {
	main > .preguntasFrecuentes {
		margin: 0 2rem;
		background-size: contain;
		padding: 1px 0;
		padding-bottom: 2rem;
	}
	main .preguntas {
		margin: 0 1rem;
	}
}

/* Tablet grande */
@media (max-width: 900px) {
}

/* Tablet */
@media (max-width: 760px) {
}

@media (max-width: 700px) {
}