@import url(vars.css);
@import url(modal/iQue-modal-2026.css);
/*@import url(MsgBox/iQue-msgbox-v1.2020.css);*/

html{
	width:100%;
	margin: 0px;
	padding: 0px;
	background-color: var(--pleca-azul-oscuro);
	scrollbar-width: thin;
	scrollbar-color: #cacaca rgba(0,0,0,0.15);
	scrollbar-height: thin;
	overflow-x:hidden;
	font-size: 16px;
}

body{
	margin: 0px;
	background-color: #fff;
	color: var(--color-texto);
	font-family: "Open Sans", Arial, Helvetica, sans-serif;
	font-style: normal;
	font-variation-settings: "wdth" 100;
	font-size: 0.9rem;
	position:relative;
	width: 100%;
	overflow: hidden;
}

body::-webkit-scrollbar,*::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

body::-webkit-scrollbar-track, *::-webkit-scrollbar-track {
	background: #415c7b;
}
body::-webkit-scrollbar-thumb, *::-webkit-scrollbar-thumb {
	border-radius: 3px;
	background-color: rgba(255,255,255,0.5);
	border: 0px;
}

body * {
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	background-repeat: no-repeat;
	background-position: left center;
	font-family: 'Open-Sans',Arial, Helvetica, sans-serif;
	scrollbar-width: thin;
	scrollbar-color: #cacaca rgba(0,0,0,0.15);
	scrollbar-height: thin;

}



a, a:active, a:visited{
	outline: none;
	text-decoration: none;
	color: var(--color-anclas);
}
a:hover {
	color: var(--color-ancla-hover);
}

p {
	margin: 0;
}
h1,h2,h3,h4,h5,h6{
	font-weight: 800;
	font-family: 'Ubuntu',Arial, Helvetica, sans-serif;
	line-height: normal;
	color: var(--color-titulos);
	margin: 0;
}

h1{
	font-size: 1.6rem;
}

h2{
	font-size: 1.4rem;
}

h3{
	font-size: 1.2rem;
}

h4{
	font-size: 1rem;
}

h5{
	font-size: 1rem;
}

h6{
	font-size: 1rem;
}

p.SubTexto{
	font-size: 1.1rem;
	padding: 0 1.5rem;
	margin: 1.7rem 0;
	color: var(--text-color-high);
	font-style: italic;
}

strong{
	color: var(--text-color-high);
}
li{
	margin: 0.35rem 0;
}
.text-mini, .mini-text{
	font-size: 0.75rem !important;
}
.text-big, .big-text{
	font-size: 1.1rem !important;
}

small, .small-text{
	font-size: 0.8rem !important;
}
.i{
	font-style: italic;
}
.b{
	font-weight: 600;
}
.center{
	text-align:center;
}
.right{
	text-align: right !important;
}
.hidden,.hideMe{
	display: none !important;
}

.dimmed-color{
	color: var(--text-color-dimmed);
}

.highlite{
	color: var(--text-color-high);
}

.border, .borders, .bordes{
	border: 1px solid var(--bordes);
} 
.round-corners{
	border-radius: var(--border-radius);
}

.w100{
	width: 100% !important;
	display: inline-block;
}
.w75{ 
	width: 75% !important;
	display: inline-block;
}
.w50{ 
	width: 50% !important;
	display: inline-block;
}
.w30{
	width: 30% !important;
	display: inline-block;
}
.w20{
	width: 20% !important;
	display: inline-block;
}


.w15rem{ 
	width: 15rem !important;
}
.w10rem{
	width: 10rem !important;
}
.w9rem{ 
	width: 9rem !important;
}
.w8rem{
	width: 8rem !important;
}

.w7rem{
	width: 7rem !important;
}

.w6rem{
	width: 6rem !important;
}

.w5rem{
	width: 5rem !important;
}

.wAuto{ 
	width: auto !important;
}

.wFit{ 
	width: fit-content !important;
}

.p0 {
	padding: 0rem !important;
}
.p1{ 
	padding: 1rem !important;
}
.p05{
	padding: 0.5rem !important;
}
.p1m, .p15 { 
	padding: 1.5rem !important;
}
.p2{
	padding: 2rem !important;
}
.p25 {
	padding: 2.5rem !important;
}
.p3{
	padding: 3rem !important;
}
.FR{
	float:right;
}

.m0{
	margin: 0 !important;
}
.mb05{
	margin-bottom: 0.5rem !important;
}
.mb075{
	margin-bottom: 0.75rem !important;
}
.mb15{
	margin-bottom: 1.5rem !important;
}
.mb1{
	margin-bottom: 1rem !important;
}
.mb2{
	margin-bottom: 2rem !important;
}
.mb3{
	margin-bottom: 3rem !important;
}
.mt05{
	margin-top: 0.5rem !important;
}
.mt075{
	margin-top: 0.75rem !important;
}
.mt15{
	margin-top: 1.5rem !important;
}
.mt1{
	margin-top: 1rem !important;
}
.mt2{
	margin-top: 2rem !important;
}
.mt3{
	margin-top: 3rem !important;
}
.cc{
	width: 100%;
	margin: auto;
	max-width: var(--cc-max-width);
	/* max-width: 1300px; */
	display: block;
}

.sombra{
	box-shadow: var(--box-shadow);
}

body>section{
	padding: 2rem 1rem;
}

.gracias-icono{
	width: 3rem;
	align-self: center;
	margin: 0.5rem;
	vertical-align: middle;
}

/* ==========================================================================
	Flex Columns (Cookens)
	---------------------------------------------------------------------------
	USAGE PATTERNS / PATRONES DE USO
	---------------------------------------------------------------------------
	A) Two equal columns (strict, no gap)
	<div class="flex-cols">
		<div class="col-50">Left</div>
		<div class="col-50">Right</div>
	</div>

	B) Two equal columns with gap (auto-shrink enabled)
	<div class="flex-cols gap-1">
		<div class="col-50">Left</div>
		<div class="col-50">Right</div>
	</div>

	C) Wrap into multiple lines (responsive-like behavior)
	<div class="flex-cols flex-wrap gap-1">
		<div class="col-33">A</div>
		<div class="col-33">B</div>
		<div class="col-33">C</div>
	</div>

	D) Fixed + flexible (explicit shrink on one column)
	<div class="flex-cols gap-1">
		<div class="col-25">Sidebar</div>
		<div class="col-75 col-sh">Content (can shrink if needed)</div>
	</div>

	E) No gap, but still allow shrink on a specific child
	<div class="flex-cols">
		<div class="col-70">Left</div>
		<div class="col-30 col-sh">Right (shrink allowed)</div>
	</div>

/* Flex - columns --------------------------------------------------*/

.flex-cols{
	display: flex;
	flex-direction: row !important;
	flex-wrap: wrap;
	box-sizing: border-box; /* Asegura que el padding no rompa el layout */
	justify-content: space-between;
}
.gap-05{ gap: 0.5rem; }
.gap-1{ gap: 1rem; }
.gap-15{ gap: 1.5rem; }
.gap-2{ gap: 2rem; }
.gap-25{ gap: 2.5rem; }
.gap-3{ gap: 3rem; }

.flex-cols > *{
	flex-grow: 0;
	flex-shrink: 0;
	flex-basis: auto;
	min-width: 0;
	box-sizing: border-box;
	flex-basis: 100%;
}
/* Flex - columns --------------------------------------------------*/


/*--- PAGINAS DE ERROR -----------------------------------------------------------------*/
#err-container{
	width: 100%;
	display: flex;
	flex-direction: column;
	height: 100vh;
}
#err-logo{
	width: 100%;
	flex: 0 0 25%;
	padding: 5%;
	text-align:center;
	background-color: var(--pleca-clara1);
}
#err-logo img{
	width: 70%;
	max-width: 12rem;
}
#err-txt{
	width: 100%;
	flex: 0 1 100%;
	padding: 5%;
	text-align:center;
}
#err-ique{
	width: 100%;
	flex: 0 0 4rem;
	padding: 0%;
	text-align:center;
	background-color: var(--pleca-azul-oscuro);
	line-height: 4rem;
	color: #fff;
}
#err-container a{
	color: var(--ct-azul);
}
/* Header ---------------------------------------------------------------------*/

#header{
	margin: 0 !important;
}

.head-box{
	width: 100%;
	display: flex;
	gap: 5%;
	flex-wrap:wrap;
	/* animation: moverDerecha 0.5s ease-out forwards; */
}

.head-logo{
	display: flex;
	flex-direction: column;
	flex: 0 0 100%;
	text-align:center;
	padding: 0.8rem 1rem;
	border-radius: var(--border-radius);
	background: linear-gradient(to right, #081b2e, #15355c);
	margin-bottom: 1rem;
}

.head-logo img{
	width: 65%;
}
.head-logo small{
	color: #e7e7e7;
	font-size: 0.7rem !important;
	padding: 0.5rem 10%;
}
.head-menu{
	display:flex;
	gap: 1rem;
	flex-direction: row;
	flex: 0 0 100%;
}
.head-menu a{
	flex: 0 1 50%;
	border-radius: var(--border-radius);
	font-size: 0.9rem;
	padding: 0 1rem;
	display: flex;
	align-items: center;
	text-align: center;
	height: 3rem;
	justify-content: center;
	box-shadow: var(--box-shadow);
}
.head-menu a:hover{
	box-shadow: none;
}
.mediakit{
	background-color: var(--boton-naranja);
	color: #fff !important;
	border: 1px solid var(--boton-naranja);
}
.suscribirme{
	border: 1px solid var(--bordes);
}


/* HERO ----------------------------------------------------------------------*/


.hero-box{
	display: flex;
	flex-direction: column;
	animation: moverIzquierda 1s ease-out forwards;
}
.hero-image{
	flex: 0 0 12rem;
	height:12rem;
	border-radius:var(--border-radius);
	overflow:hidden;
	box-shadow: var(--box-shadow);
	border: 10px solid #fff;
}

.hero-image picture,
.hero-image img{
	width: 100%;
	height:inherit;
	object-fit:cover;
}

.hero-textos{
	flex: 0 0 auto;
	margin: 1rem 0;
	text-align:center;
	animation: moverIzquierda 1.5s ease-out forwards;
}

.hero-textos h1{
	margin: 0.5rem;
}


.hero-metricas{
	display:flex;
	gap: 0.5rem;
}

.hero-metricas>div{
	flex: 0 1 33.33%;
	border: 1px solid var(--bordes);
	border-radius: var(--border-radius);
	display: flex;
	flex-direction: column;
	overflow: hidden;
	box-shadow: var(--box-shadow);
}
.hero-metricas span{
	font-weight: bold;
	font-size: 1.5rem;
	flex: 0 0 3.3rem;
	color: var(--color-titulos);
	line-height: 3.5rem;
	overflow: hidden;
	box-shadow: var(--box-shadow);
	font-family: 'Ubuntu';
	letter-spacing: -0.05rem;
}

.hero-metricas span.hot{
	color: var(--boton-naranja);
}

.hero-metricas small{
	font-size: 0.75rem !important;
	flex: 0 0 3rem;
	background-color: var(--pleca-clara1);
	display: flex;
	align-items: center;
	width: 100%;
	text-align: center;
	justify-content: center;
	padding: 0 0.25rem;
}


/*Comunidad -------------------------------------------------------------*/

#comunidad{
	background-color: #fafdfd;
	padding: 5rem 2rem 0rem 2rem;
}
.comunidad-box{
	width: 100%;
	display: block;
}


.comunidad-textos .SubTexto{
	margin: 1.5rem 0;
}
.comunidad-textos h2{
	font-size: 1.6rem;
}

.comunidad-textos p{
	padding: 0 1rem;
}

.comunidad-textos{
	text-align:center;
	display:flex;
	flex-direction:column;
	margin-bottom: 2rem;
}

.comunidad-metricas h6{
	text-align: center;
	margin-bottom: 0.8rem;
}

.comunidad-metricas-par {
	display:flex;
	flex-direction:column;
	gap: 1rem;
	padding: 0.5rem 0;
}

.comunidad-metricas-cu{
	margin: 0 6%;
	border-radius: var(--border-radius);
	width: 88%;
	padding: 1rem;
	background-color: var(--pleca-clara2);
	border: 1px solid var(--pleca-clara2);
	background-color: var(--pleca-clara1);
	border: 1px solid var(--bordes);
}
.comunidad-metricas-cu span{
	width: 100%;
	font-family: 'Ubuntu';
	font-size: 1.5rem;
	color: var(--color-titulos);
	font-weight: 700;
	display: block;
}
.comunidad-metricas-cu p{
	width: 100%;
	margin-top: 0.35rem;
	display: block;
}


.comunidad-metricas-cu.hot{
	border-color: var(--bordes);
	background-color: #fff;
	position: relative;
	box-shadow: var(--box-shadow);
	background-color: transparent;
}

.comunidad-metricas-cu.hot span{
	color: var(--boton-naranja);
}
.comunidad-metricas-cu.hot img{
	position:absolute;
	right: -0.5rem;
	top: -1rem;
	width: 2.5rem;
}

.comunidad-mapa {
	height: 8rem;
	text-align: center;
	margin: 2rem 0;
	position: relative;
}
.comunidad-mapa .mapa{
	height: 100%;
}

.comunidad-mapa .cafe{
	display: none;
}


.comunidad-estados{
	padding: 0 0.5rem;
}
.comunidad-estados-top{
	width: 100%;
	display: inline-block;
	margin-bottom: 1rem;
	position: relative;
	padding-right: 7rem;
	height: 7rem;
}
.comunidad-estados-top	h4{
	font-size: 1.4rem;
	margin-bottom: 1rem;
}
.comunidad-estados-top small{
	white-space: nowrap;
}
.comunidad-estados-top img{
	position: absolute;
	right: -0.5rem;
	width: 7rem;
	bottom: 1rem;
}

.comunidad-estados-tabla{
	padding: 0.8rem;
	border: 1px solid var(--bordes);
	border-radius:var(--border-radius);
	box-shadow: var(--box-shadow);
	font-size: 0.7rem;
}
.comunidad-estados-tabla table{
	border-collapse: separate;
	border-spacing: 3px;
	width: 100%;
}

.comunidad-estados-tabla th{
	font-weight: normal;
	font-size: 0.7rem;
	padding: 0.25rem;
	background-color: var(--pleca-clara2);
	border-radius: 0.5rem;
}
.comunidad-estados-tabla td{
	font-size: 0.8rem;
	padding: 0.5rem 0.2rem;
	border-bottom: 1px solid var(--bordes);
}

.comunidad-estados-tabla tr:last-child  td{
	padding-bottom: 0;
	border-bottom: 0;
}

/*------ HEADER SCROLLED -----------------------------------*/

#heder-sticky-box{
	position: fixed;
	height: auto;
	top: 0;
	left: 0;
	width: 100%;
	margin: 0;
	z-index: 100;
	padding: 0 1rem;
}

.header-stiky{
	max-height: 3.5rem;
	height: 0;
	border-radius: 0 0 var(--border-radius) var(--border-radius);
	background: linear-gradient(to right, #081b2e, #15355c);
	transition: height 0.5s ease , opacity 0.1s ease;
	display:flex;
	justify-content: space-between;
	overflow: hidden;
	width: 100%;
	opacity:0;
}

.header-stiky.visible{
	height: 100vh;
	opacity: 1;
	box-shadow: var(--box-shadow);
}


.header-stiky-logo{
	height: inherit;
	flex: 0 0 3.5rem;
	height: 3.5rem;
	
}
.header-stiky-logo a{
	height: inherit;
	display: flex;
	align-items: center;
	background-image: url(ct-pin-azul.svg);
	background-position: center;
	background-size: 50%;
}
.header-stiky-logo img {
	height: 60%;
	width: auto;
	max-width: 8rem;
}
.header-stiky-botones{
	height: 100%;
	display: flex;
	align-items: center;
	flex: 0 0 auto;
	justify-content: flex-end;
}

.header-stiky-botones a{
	font-size: 0.8rem;
	padding: 0.25rem 0.35rem;
	border-radius: 1rem;
}
.header-stiky-botones .suscribirme{
	color: #fff !important;
	background-color: #063462;
	border: 0;
}
.header-stiky-botones .mediakit{
	margin: 0 0.5rem;
}

/*------ BENEFICIOS -----------------------------------*/

#beneficios{
	padding: 5rem 0;
	background-color: var(--pleca-azul-oscuro);
	background-image: url(fondo-beneficios.webp);
	background-position: center;
	background-size: auto 100%;
	margin-bottom: 0;
}
.beneficios-content{
	width: 100%;
	display:flex;
	flex-direction: column;
	gap: 2rem;
	
}
.beneficios-top{
	display:flex;
	flex-direction: column;
	gap: 1rem;
	text-align: center;
}


#beneficios-title{
	color: var(--boton-naranja);
	font-size: 1.6rem;
	padding: 0 15%;
	text-align: center;
}
#beneficios-description{
	color:#fff;
	padding: 0 10%;
	margin-bottom: 0.5rem;
	text-align: center;
}

.beneficios-cards{
	display: flex;
	flex-wrap: wrap;

}

.beneficios-cards-cu{
	background-color: #fff;
	border-radius: var(--border-radius);
	box-shadow: var(--box-shadow);
	display: flex;
	flex-direction: column;
	width: 80%;
	margin: 1.2rem 10%;
	overflow: hidden;
}

.beneficios-cards-cu:first-child{
	margin-top: 0;
}

.beneficios-cards-cu-top, .beneficios-cards-cu-bot{
	padding: 1.5rem;
}

.beneficios-cards-cu-top{
	flex: 0 0 40%;
	display: flex;
	align-items: center;
}
.beneficios-cards-cu-top h3{
	font-family: 'Open Sans';
	font-weight: 600;
	flex: 0 1 100%;
	padding-right: 2rem;
	font-size: 1.1rem;
	line-height: 1.4rem;
}
.beneficios-cards-cu-top img{
	width: 3rem;
	flex: 0 0 3rem;
}
.beneficios-cards-cu-bot{
	flex: 0 0 60%;
	background-color: var(--pleca-clara1);
}
.beneficios-cards-cu-bot p{
	color:var(--color-texto);
}

#beneficios-cta-title{
	padding: 0 10%;
	text-align: center;
	color: #fff;
	font-size: 1.4rem;
	margin-top: 1rem;
}
.beneficios-bottom p{
	padding: 0 10%;
	text-align: center;
	color: #fff;
}

.beneficios-bottom-botones{
	display: inline-block;
	margin: 0 auto;
	width: 75%;
	flex-wrap: nowrap;
	flex-direction: column;
}

.beneficios-bottom-btn{
	width: 100%;
	background-color: var(--boton-naranja);
	border-radius: 3rem;
	padding: 0.7rem 0.5rem 0.7rem 0.5rem;
	color: #fff;
	margin: 1rem auto;
	display: flex;
	align-items: center;
	gap: 0.7rem;
	font-size: 0.95rem;
	justify-content: center;
	white-space: nowrap;
	border: 0;
	box-shadow: var(--box-shadow);
}

.beneficios-bottom-btn img{
	width: 1rem;
}

.beneficios-bottom{
	display:flex;
	flex-direction: column;
	gap: 2rem;
}

/* Quien ------------------------------------*/

#quien{
	padding: 3rem 1rem 0rem 1rem;
	background-image: url(fondo-quien.svg);
	margin-bottom: 3rem;
	background-position: center;
}

.quien-contenido{
	width: 100%;
	
}

#quien-title{
	padding-left: 1.5rem;
	font-size: 1.7rem;
	padding-right: 2rem;
}

.quien-txtos, #quien-title, #quien-description{
	width: 100%;
}

.quien-txtos-h3{
	padding-left: 1.5rem;
	font-size: 1rem;
	margin: 0.5rem 0 1rem 0;
	width: 100%;
	display: block;
}

#quien-description{
	font-size: 0.9rem;
	padding: 1.5rem;
}

.ul-bullet-n li{
	font-size: 1.1rem;
	padding-left: 1.5rem;
	position: relative;
	margin: 0.5rem 0;
	color: var(--color-titulos);
}
.ul-bullet-n{
	list-style: none;
	padding-left: 1.8rem;
	margin: 0;
}
.ul-bullet-n li::before{
	content: "";
	width: 11px;
	background-image: url('quien-bullet.svg');
	background-size: 100%;
	display:block;
	/* background-color: red; */
	position: absolute;
	left: 0;
	top: 5px;
	height: 11px;
}
.ct-card-image {
	-webkit-mask-image: url('masks/card-turismo.svg');
	mask-image: url('masks/card-turismo.svg');
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
}
.card-wrapper{
	filter: drop-shadow(3px 3px 3px rgba(0,0,0,1));
	filter: drop-shadow(var(--box-shadow));
}


.quien-imagen{
	width: 100%;
	padding: 1.5rem;
	margin-top: 1rem;
}

.quien-img-1{
	width: 100%;
	padding-right: 25%;
}

.quien-img-1 .card-wrapper,
.quien-img-1 .card-wrapper img{
	width: 100%;
}

.quien-img-2{
	width: 52%;
	border-radius: var(--border-radius);
	overflow: hidden;
	border:8px solid #fff;
	margin: -20% -1rem 0 auto;
	z-index: 1;
	position: relative;
	box-shadow: var(--box-shadow);
	aspect-ratio: 1 / 1;
}

.quien-img-2 img{
	width: 100%;
	object-fit: cover;
	height: 100%;
}

.quien-img-metrica{
	width: fit-content;
	padding: 0.5rem 1rem;
	border-radius: var(--border-radius);
	background-color: #fff;
	box-shadow: var(--box-shadow);
	margin: -25% 0 0 8%;
	z-index: 1;
	position: relative;
	border: 1px solid #e7e7e7;
}
.quien-img-metrica span{
	font-family: 'Ubuntu';
	font-size: 1.2rem;
	font-weight: bold;
	color: var(--color-titulos);
}
.quien-img-metrica p{
	font-size: 0.8rem;;
}

.quien-img-metrica p::before{
	content: "Correos entregados último año";
}
.clientes {
	padding: 0 2rem 3rem 2rem;
	text-align: center;
	overflow: hidden;
}


.clientes-contenido h2{
	font-size: 1.1rem;
	font-family: 'Open Sans';
	font-weight: 600;
	/* color: var(--color-texto); */
}


.clientes-slider {
	width: 100%;
	overflow: hidden;
	position: relative;
}

.clientes-track {
	display: flex;
	align-items: center;
	width: max-content;
	animation: logosScroll 47s linear infinite;
	will-change: transform;
	margin: 2rem 0;
}

.clientes-logo img {
	max-width: 200px;
	max-height: 90px;
	width: auto;
	height: auto;
	object-fit: contain;
	filter: grayscale(100%);
	opacity: 0.6;
	transform: scale(0.9);
	transition:
		filter .3s ease,
		opacity .3s ease,
		transform .3s ease;
}

.clientes-logo:hover img {
	filter: grayscale(0%);
	opacity: 1;
	transform: scale(1);
}

/*.clientes-slider:hover .clientes-track {
	animation-play-state: paused;
}*/

.clientes-logo {
	width: 280px;
	height: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	border-right: 1px solid var(--bordes);
	margin: 0;
	
}

/* FAQS ------------------------------------*/

#faq-anunciantes{
	padding: 2rem 2rem;
	margin-bottom: 2rem;
}

#faq-suscriptores{
	padding: 2rem 2rem 4rem 2rem;
	margin-bottom: 0rem;
	background-color: var(--pleca-clara1);
}
.faq-contenido{
	width: 100%;
}
.faq-textos{
	padding: 2rem 0;
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}
#faq-anunciantes-title,#faq-suscriptores-title{
	font-size: 1.2rem;
	font-family: 'Open Sans';
	color: var(--ct-azul);
	font-weight: 500;
}
#faq-anunciantes-description, #faq-suscriptores-description{
	font-size: 1.6rem;
	font-family: 'Ubuntu';
	color: var(--color-titulos);
	font-weight: 600;
}
#faq-anunciantes-description strong, #faq-suscriptores-description strong{
	font-size: 1.6rem;
	font-family: 'Ubuntu';
	font-weight: 600;
}
.faq-textos .beneficios-bottom-btn{
	width: fit-content;
	padding: 0.8rem 1rem;
	margin: 0.5rem 0;
	height: 3rem;
}

.faq-preguntas-chd{
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	width: 100%;
}
article.faq {
	padding: 0.7rem;
	background-color: #fff;
	border-radius: 0.5rem;
	border: 1px solid var(--bordes);
	cursor: pointer;
}

article.faq:hover {
	box-shadow: var(--box-shadow);
}

article.faq button{
	display: flex;
	background: transparent;
	border: 0;
	width: 100% !important;
	cursor: pointer;
	color: var(--color-titulos);
}

article.faq button .pregunta{
	font-size: 0.9rem;
	font-weight: 500;
	font-family: 'Open Sans';
	flex: 0 1 100%;
	text-align: left;
}
.faq-toggle{
	flex: 0 0 1.5rem;
	
}
.faq-toggle::before{
	content:"+";
	font-size: 1.4rem;
	text-align: center;
	display: block;
	color: var(--color-anclas);
}
article.faq p{
	height: 0px;
	overflow: hidden;
	transition: opacity 0.65s ease, height 0.75s ease;
	max-height:fit-content;
	opacity: 0;
	font-size: 0.85rem;
	line-height: 1.2rem;
}

article.faq p span{
	display: block;
}

article.faq.oppened p{
	height: 100vh;
	opacity: 1;
}

article.faq.oppened .faq-toggle::before{
	content:"-";
}

/* Suscriptores ------------------------------------*/

#suscriptores{
	padding: 2rem 1rem;
	background-color: var(--pleca-azul-oscuro);
}

.suscriptores-box{
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding: 0 1rem;
}
.suscriptores-textos{
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	padding: 1rem 2rem;
}
#suscriptores-title{
	font-family: 'Open Sans';
	font-size: 1.2rem;
	color: var(--ct-azul);
	font-weight: 500;
}

#suscriptores-description{
	color: #fff;
	font-size: 2rem !important;
	font-family: 'Ubuntu';
	margin: 0.8rem 0;
	font-weight: 600;
}
.suscriptores-textos p{
	color: #fff;
	font-size: 0.9rem;
}
.suscriptores-textos ul{
	list-style: none;
	list-style: none;
	padding-left: 0rem;
	margin: 0;
}
.suscriptores-textos li{
	font-size: 0.9rem;
	margin: 0.8rem 0;
	color: #fff;
	padding-left: 1.5rem;
	position: relative;
	line-height: 1rem;
}

.suscriptores-textos li::before {
	content: "";
	width: 12px;
	background-image: url('quien-bullet.svg');
	background-size: 100%;
	display: block;
	position: absolute;
	left: 0;
	top: 2px;
	height: 12px;
}

.suscriptores-formulario{
	display: flex;
	flex-direction: column;
	/* gap:1rem; */
	border-radius: var(--border-radius);
	box-shadow: var(--box-shadow);
	overflow: hidden;
	/* padding: 0 1rem; */
	box-shadow: var(--box-shadow);
}
.suscriptores-formulario img{
	width: 100%;
}
.suscriptores-formulario h3{
	width: 100%;
	background-color: rgb(8 27 46 / 50%);
	color: #fff;
	text-align: center;
	height: 2.4rem;
	margin-top: -2.4rem;
	line-height: 2.4rem;
	backdrop-filter: blur(2px);
}
.suscriptores-formulario form{
	padding: 1.5rem;
	background-color: #fff;

}

/* FORMAS ------------------------------------*/

.field-container{
	width: 100%;
	margin: 1rem 0;
	display: block;
	position: relative;
}

.field-container.ob label::before{
	content: "* ";
	color: red;
	
}
.field-container label{
	padding-bottom: 0.3rem;
	display: block;
}
.fld{
	width: 100%;
}

.label-cond{
	display: flex !important;
	align-items: flex-start;
}

.label-cond span{
	flex: 0 1 100%;
	padding-left: 0.5rem;
}

input, select, textarea{
	border: 1px solid var(--bordes);
	border-radius: 0.5rem;
	padding: 0 0.7rem;
	width: 100%;
	outline: none;
	line-height: 1.5rem;
	height: 2.3rem;
	font-size: 1rem;
}

textarea{
	height: auto;
}

option{
	font-size: 1rem;
}

input[type="checkbox"]{
	width: 1rem;
	height:auto;
}

input[type="tel"]{
	max-width: 15rem;
}

button{
	border: 1px solid var(--boton-naranja);
	border-radius: 2rem;
	padding: 0.9rem 1rem;
	width: 100%;
	outline: none;
	line-height: 1.2rem;
	color: #fff;
	background-color: var(--boton-naranja);
	font-size: 1rem;
	cursor:pointer;
	white-space: nowrap;
}

button:disabled{
	opacity: 0.5;
	cursor: not-allowed;
}

button img{
	width: 1rem !important;
	margin: 0 0.3rem;
	vertical-align: middle;
}

.field-container .etqErr {
	font-size: 0.8rem;
	color: var(--boton-naranja) ;
	position: absolute;
	right: 0;
	top: 0; /* Align with label or field top depending on preference */
}

.field-container.error :is(input, textarea, select, .field-mask, .lang-input) {
	border-color: var(--boton-naranja) !important;
}

.forma-modal{
	position: relative;
	display: flex;
	flex-direction: column;
	width: 94%;
	height: 94%;
	margin: 3%;
	border: 1px solid var(--borders);
	background: #fff;
	border-radius: 0.3rem;
}

.forma-modal-head{
	flex: 0 0 auto;
	flex-basis: min-content;
	padding: 1rem;
}
.forma-modal-campos{
	flex: 0 1 100%;
	overflow: hidden;
	overflow-y: auto;
	padding: 0 1rem;
}

.forma-modal-head-title{
	padding-right: 15%;
	font-size: 1.7rem;
}
.forma-modal-head-subtext{
	font-size: 1rem;
	margin: 0.7rem 0 0.3rem 0;
}


.modal-botones{
	display: flex;
	gap: 1rem;
}
.modal-botones-secundario{
	flex: 0 1 auto;
}
.modal-botones-principal{
	flex: 0 1 100%;
}

.modal-botones button{
	padding: 0.5rem 0.75rem;
}

.forma-modal-paso{
	width: 100%;
	margin: 0.5rem 0 1rem 0;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--bordes);
}

.forma-modal-paso:last-child{
	padding-bottom: 0.5rem;
	border-bottom: 0;
}


.forma-modal-paso.actual{

}

.forma-modal-paso-titulo{
	width: 100%;
	font-family: 'Open Sans';
	font-weight: 500;
	color: var(--color-texto);
}
.forma-modal-paso-titulo span{
	background-color: var(--pleca-clara2);
	color: var(--color-titulos);
	width: 1.5rem;
	height: 1.5rem;
	display: inline-block;
	text-align: center;
	font-size: 0.7rem;
	line-height: 1.4rem;
	border-radius: 2rem;
	margin-right: 0.3rem;
	border: 1px solid var(--bordes);
	background-color: #fff;
}
.modal-paso-forma{
	height: 0px;
	overflow: hidden;
	max-height: fit-content;
	opacity: 0;
	transition: opacity 0.3s ease, height 0.5s ease;
}
button.forma-modal-paso-continuar{
	padding: 0.3rem 1rem;
	font-size: 0.9rem;
	width: auto;
	float: right;
}

.forma-modal-paso.actual .modal-paso-forma{
	height: 90vh;
	opacity: 1;
}

.forma-modal-paso.actual .forma-modal-paso-titulo span{
	background-color: var(--boton-naranja);
	color:  #fff;
	border-color: var(--boton-naranja);
}

.modal-textarea {
	height: 4rem;
	max-height: 4rem;
}

.modal-boton-enviar{
	width: auto;
	padding: 0.5rem 1rem;
}
/* FOOTER ------------------------------------*/

#footer{
	background-color: var(--pleca-azul-oscuro);
	margin: 0;
}

.footer-cols{
	padding: 1rem;
}

.footer-col-contactos{
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	align-items: center;
	text-align: center;
	padding: 1rem 0;
}
#footer-title{
	color: #fff;
}
#footer-description{
	color: #fff;
}

.footer-contact-label{
	color: #fff;
}
.footer-anclas{
	display: flex;
	flex-direction: row;
	gap: 0.5rem;
}
.footer-anclas a{
	border-radius: 2rem;
	padding: 0.7rem 1rem;
	background-color: #063462;
	color:#fff !important;
}
.footer-anclas img{
	width: 1rem;
	margin-right: 0.5rem;
	vertical-align: middle;
}



.footer-col-conds{
	padding: 1rem 15% 2rem;
	text-align: center;
}

.footer-col-conds ul{
	padding: 0;
	margin: 0;
	list-style: none;
}



.footer-col-conds a{
	margin: 2rem 0;
	width: 100%;
	display: block;
	font-size: 0.8rem;
}



.footer-col-conds li a{
	color: #fff;
	font-size: 1rem;
	margin: 0.5rem 0;
	
}

.footer-col-conds li a::before {
	content: "";
	width: 1.2rem;
	background-image: url('quien-bullet.svg');
	background-size: 12px;
	height: 12px;
	display: inline-block;
	background-repeat: no-repeat;
	
}

.footer-col-logo{
	padding: 1rem 15% 2rem 15%;
	text-align: center;;
}
.footer-col-logo img{
	width: 70%;
	margin: auto;
	margin-bottom: 1rem;
}

.footer-col-logo .slogan{
	margin: 1rem 0;
	text-align: inherit;
	font-family: 'Ubuntu';
	font-size: 1rem;
	color: #fff;
}

/* CONTACTO -------------------------*/

#contacto-description{
	padding: 0;
	margin-bottom: 0;
}

#btn-contacto-cerrar{
	width: 10rem !important;
}

.compButtons{
	display: flex;
	gap: 0.25rem;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
}

.compButtons button{
	white-space: nowrap;
	text-overflow: unset;
	/* flex-basis: auto; */
	padding: 0.3rem 0.7rem;
}

.compButtons.bottom{
	border-top: 1px solid var(--borders);
	margin-top: 0.5rem;
	padding-top: 1rem;
}

.compButtons.top{
	border-bottom: 1px solid var(--borders);
	margin-bottom: 0.5rem;
	padding-bottom: 1rem;
}


.compButtons .spacer{
	flex: 0 1 100%;
}
.compButtons .btn-secondary{
	flex: 0 0 min-content;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	/* flex-basis: auto; */
	background-color: #fff;
	border-color: var(--bordes);
	color: var(--color-anclas);
}

@keyframes logosScroll {

	from {
		transform: translateX(0);
	}

	to {
		transform: translateX(calc(-50%));
	}

}
@media (min-width: 640px) {
	h1{
		font-size: 2.3rem;
	}
	
	h2{
		font-size: 2rem;
	}

	h3{
		font-size: 1.75rem;
	}

	h4{
		font-size: 1.5rem;
	}

	h5{
		font-size: 1.25rem;
	}

	h6{
		font-size: 1.1rem;
	}
	
	
	.hero-metricas span{
		font-size: 1.8rem;
		flex: 0 0 3.5rem;
		line-height: 3.7rem;
	}
	
	.hero-metricas small{
		font-size: 0.9rem !important;
		flex: 0 0 3rem;
		padding: 0 1rem;
	}
	.hero-metricas{
		width: 86%;
		margin: 0 7%;
	}
	.hero-textos h1{
		margin: 0.5rem 0;
		line-height: 2.3rem;
		padding: 0 3rem;
	}
	p.SubTexto{
		font-size: 1.3rem;
		padding: 0 10%;
	}
	.hero-image{
		flex: 0 0 16rem;
		height:16rem;
	}
	
	.head-box{
		width: 100%;
		display: flex;
		gap: 0.5rem;
		flex-wrap: nowrap;
		border-radius: var(--border-radius);
		background: linear-gradient(to right, #081b2e, #15355c);
		align-items: center;
	}
	
	.head-logo{
		flex: 0 1 100%;
		text-align:left;
		padding: 0.8rem 1rem;
		border-radius: 0;
		background: none;
		margin-bottom: 0;
	}
	
	.head-logo img{
		width: 90%;
		max-width: 14rem;
	}
	.head-logo small{
		padding: 0.5rem 0;
	}
	.head-menu{
		gap: 0.7rem;
		flex-direction: column-reverse;
		flex: 0 0 auto;
		padding-right: 1rem;
		/* background-color: red; */
		display: flex;
		align-items: flex-end;
	}
	.head-menu a{
		flex: 0 1 auto;
		border-radius: var(--border-radius);
		font-size: 0.9rem;
		padding: 0.4rem 1rem;
		display: block;
		height: auto;
		/* box-shadow: none; */
		width: 100%;
		border: 0 !important;
	}
	
	.suscribirme{
		color: #fff !important;
		background-color: #063462;
	}
	.head-menu a:hover{
		background-color:rgba(255,255,255,0.2);
		background-color:rgba(0,0,0,0.5);
	}

	#faq-anunciantes,#faq-suscriptores {
		padding: 3rem 6rem;
	}

	.suscriptores-box {
		padding: 4rem 22%;
	}

	#suscriptores-description {
		font-size: 2.6rem !important;
		margin: 1rem 0;
	}
	#suscriptores-title {
		font-size: 1.4rem;
	}

	.suscriptores-textos li {
		font-size: 1rem;
	}
	.suscriptores-formulario form {
		padding: 1rem 2rem 1.5rem 2rem;
	}
	.suscriptores-formulario h3 {
		height: 2.8rem;
		margin-top: -2.8rem;
		line-height: 2.9rem;
		font-size: 1.5rem;
	}

	.footer-cols{
		padding: 3rem 25%;
	}
}


@media (min-width: 768px) {
	html{
		font-size: 16px;
	}
	body {
		font-size: 1rem;
	}
	h1{
		font-size: 2.6rem;
	}
	
	h2{
		font-size: 2.3rem;
	}

	h3{
		font-size: 2rem;
	}

	h4{
		font-size: 1.75rem;
	}

	h5{
		font-size: 1.5rem;
	}

	h6{
		font-size: 1.25rem;
	}
	.hero-metricas span{
		font-size: 1.8rem;
		flex: 0 0 3.5rem;
		line-height: 3.7rem;
	}
	
	.hero-metricas small{
		font-size: 0.8rem !important;
		padding: 0 1rem;
	}
	.hero-metricas{
		width: 80%;
		margin: 3rem 10%;
		gap: 1rem;
	}
	.hero-textos h1{
		margin: 2rem 0;
		line-height: 2.8rem;
		padding: 0 10%;
	}
	p.SubTexto{
		font-size: 1.5rem;
		padding: 0 15%;
		margin: 2.5rem 0;
	}
	.hero-image{
		flex: 0 0 18rem;
		height:18rem;
	}
	.head-logo img{
		width: 100%;
		max-width: 16rem;
		margin-top: 0.3rem;
	}
	
	
	.comunidad-textos h2 {
		font-size: 2.6rem;
	}
	
	.comunidad-textos p {
		padding: 0 10%;
		margin: 1rem;
	}
	
	.comunidad-textos .SubTexto{
		margin: 1.5rem 3rem;
	}

	.comunidad-textos p{
		padding: 0 1rem;
	}
	
	.comunidad-metricas{
		display: flex;
		gap: 1rem;
		flex-direction: row-reverse;
		flex-wrap: wrap;
		justify-content: center;
	}
		
	.comunidad-metricas-par{
		flex: 0 1 48%;
	}
	
	.comunidad-metricas-cu {
		margin: 0.5rem 0;
		width: 100%;
	}
	.comunidad-metricas h6 {
		flex: 0 0 100%;
	}

	.comunidad-mapa {
		height: 11rem;
	}
	
	.comunidad-box {
		padding: 0 10%;
	}
	
	.comunidad-metricas-cu p {
		font-size: 0.9rem;
	}


	.comunidad-estados-top{
		width: 100%;
		padding-right: 30%;
		height: 8rem;
	}
	.comunidad-estados-top	h4{
		font-size: 1.8rem;
		
	}
	
	.comunidad-estados-top img{
		width: 10rem;
		bottom: 0;
		right: -0.5rem;
	}

	.comunidad-estados-tabla{
		padding: 1.3rem;
	}
	.comunidad-estados-tabla table{
		border-spacing: 3px;
	}

	.comunidad-estados-tabla th{
		font-size: 0.9rem;
		padding: 0.5rem 1rem;
	}
	.comunidad-estados-tabla td{
		font-size: 1rem;
		padding: 0.8rem 0.5rem;
		border-bottom: 1px solid var(--bordes);
	}
	.header-stiky-logo{
		flex: 0 0 10rem;
		padding-left: 1rem;
	}
	.header-stiky-logo a{
		background-image: url(logo-h-w.svg);
		background-size: 100%;
	}
	
	.header-stiky-botones a{
		font-size: 0.9rem;
		padding: 0.25rem 0.5rem;
	}
	
	.header-stiky-botones .mediakit{
		margin: 0 0.75rem;
	}
	
	.comunidad-estados-tabla td.center{
		width: 28%;
	}
	
	#beneficios-description {
		font-size: 1.5rem;
		padding: 0 15%;
	}


	#beneficios-title{
		padding: 0 10%;
		font-size: 2.6rem;
	}

	.beneficios-cards {
		padding: 0 5%;
		display: flex;
		justify-content: space-around;
		align-items: center;
		flex-wrap: wrap;
	}

	.beneficios-cards-cu {
		width: auto;
		flex: 0 1 18rem;
		margin: 0;
		margin-bottom: 2.5rem;
	}
	
	.beneficios-cards-cu-top{
		flex: 0 0 7rem;
	}
	.beneficios-cards-cu-bot{
		flex: 0 0 10rem;
		display: flex;
		align-items: flex-start;
	}

	.beneficios-top,.beneficios-bottom {
		gap: 3rem;
	}
	#beneficios-cta-title{
		padding: 0 15%;
		font-size: 1.8rem;
	}

	.beneficios-bottom p{
		padding: 0 15%;
	}

	.beneficios-bottom-botones{
		margin: 0 auto;
		width: 70%;
		display: flex;
		flex-direction: row;
		justify-content: center;
	}

	.beneficios-bottom-btn{
		width: auto;
		flex: 0 1 50%;
		margin: 0;
		padding: 1rem;
	}

	.beneficios-bottom-btn img{
		width: 1rem;
	}

	.quien-contenido{
		display: flex;
	}

	.quien-textos{
		flex: 0 1 100%;
	}
	.quien-imagen{
		flex-grow: 0;
		flex-shrink: 0;
		flex-basis: 45%;
		padding: 1rem 2rem;
	}

	.forma-modal-paso-titulo {
		font-size: 1.1rem
	}

	.forma-modal {
		max-width: 30rem;
		
	}

}

/*1024*/
@media (min-width: 1024px){
	h1{
		font-size: 2.5rem;
	}
	
	h2{
		font-size: 2.15rem;
	}

	h3{
		font-size: 1.9rem;
	}

	h4{
		font-size: 1.65rem;
	}

	h5{
		font-size: 1.4rem;
	}

	h6{
		font-size: 1.2rem;
	}
	
	
	.head-menu a{
		white-space:nowrap;
		padding: 0.7rem 1.2rem;
	}
	
	.head-logo{
		flex: 0 1 100%;
		padding: 1rem 2rem;
	}

	.head-menu{
		gap: 0.7rem;
		flex-direction: row;
		flex: 0 0 auto;
		max-width: 40%;
		padding-right: 2rem;
	}
	.head-logo small{
		font-size: 0.8rem !important;
		padding: 0.2rem 0;
	}
	.hero-box{
		display: flex;
		flex-direction: row-reverse;
		flex-wrap: nowrap;
		margin: 2rem 0;
		justify-content: space-between;
	}
	.hero-image{
		flex: 0 0 45%;
		height: fit-content;
		aspect-ratio: 1 / 1;
		border-radius: 20%;
		border-width: 15px;
	}
	.hero-textos{
		flex: 0 0 55%;
		padding: 0 3.5rem 0 2rem;
		display: flex;
		flex-direction: column;
		justify-content: center;
		width: 55%;
		gap: 2rem;
		margin: 0;
	}
	.hero-image picture,
	.hero-image img{
		width: 100%;
		height:100%;
	}
	
	.hero-textos h1{
		margin: 0;
		line-height: 2.4rem;
		text-align: left;
		padding: 0;
		padding-right: 5%;
	}
	p.SubTexto{
		font-size: 1.3rem;
		padding: 0;
		text-align: left;
		margin: 0;
	}
	
	.hero-metricas{
		gap: 1rem;
		width: 100%;
		margin: 0;
	}
	.hero-metricas small{
		font-size: 0.8rem !important;
		padding: 0 1rem;
	}
	
	.comunidad-box {
		display: flex;
		flex-direction: column;
		gap: 1.5rem;
		flex-wrap: wrap;
	}
	
	.comunidad-metricas,
	.comunidad-estados{
		flex: 0 0 48%;
	}

	.comunidad-textos,
	.comunidad-mapa{
		padding: 0 2rem 0 2rem;
		flex: 0 0 52%;
		height: auto;
	}

	.comunidad-textos{
		text-align:left;
		padding-right: 10%;
		margin-bottom: 0;
		justify-content: end;
	}
	
	.comunidad-textos h2 {
		font-size: 2.6rem;
		text-align: left;
	}
	
	.comunidad-textos p {
		padding: 0 10%;
		margin: 1rem;
	}
	
	.comunidad-textos .SubTexto{
		margin: 1.5rem 0 1rem;
		padding: 0;
	}

	.comunidad-textos p{
		padding: 0;
		margin: 1rem 0;
		line-height: 1.5rem;
	}
	
	.comunidad-metricas{
		align-content: flex-start;
		gap: 0.8rem;
	}
		
	.comunidad-metricas-par{
		flex: 0 1 calc(50% - 0.8rem);
		display: flex;
		margin: 0;
		gap: 0.8rem;
	}
	
	.comunidad-metricas-cu {
		margin: 0;
		flex: 0 0 50%;
	}
	.comunidad-metricas h6 {
		margin: 0;
	}
	.comunidad-box {
		padding: 0;
		gap: 0;
		flex-direction: row;
	}
	
	.comunidad-metricas-cu p {
		font-size: 0.9rem;
		padding-right: 10%;
	}


	.comunidad-mapa{
		margin: 0;
		padding: 5rem 3rem 0 3rem;
	}

	.comunidad-mapa .mapa{
		width: 100%;
		height: auto;
	}

	.comunidad-mapa .cafe{
		width: 35%;
		display:block;
		transform: translate(20%, -115%);
	}

	.comunidad-estados{
		padding: 3rem 0.5rem;
	}
	.comunidad-estados-top{
		width: 100%;
		padding-right: 40%;
		height: 8rem;
	}
	.comunidad-estados-top	h4{
		font-size: 1.8rem;
		
	}
	
	.comunidad-estados-top img{
		width: 9rem;
		bottom: 0;
		right: -0.5rem;
	}

	.comunidad-estados-tabla{
		padding: 0.7rem;
	}

	.comunidad-estados-tabla th{
		font-size: 0.8rem;
		padding: 0.5rem 0.2rem;
	}
	.comunidad-estados-tabla td{
		font-size: 0.9rem;
		padding: 0.5rem 0;
		border-bottom: 1px solid var(--bordes);
	}

	.beneficios-content {
		padding: 0 12%;
	}
	
	.quien-textos{
		flex: 0 1 100%;
	}
	.quien-imagen{
		flex-grow: 0;
		flex-shrink: 0;
		flex-basis: 45%;
		padding: 1rem 2rem 0 1rem;
	}

	#quien-title {
		padding-left: 1.5rem;
		font-size: 2.3rem;
		padding-right: 20%;
	}

	#quien-description {
		font-size: 1.1rem;
		padding: 1.5rem;
		padding-right: 7%;
	}

	.quien-txtos-h3 {
		font-size: 1.1rem;
		margin: 0.5rem 0 1rem 0;
	}
	
	.ul-bullet-n {
		margin-left: 2rem;
	}

	.quien-img-metrica {
		padding: 0.5rem 1rem;
		margin: -25% 0 0 7%;
	}
	.quien-img-metrica span {
		font-size: 1.5rem;
	}

	.quien-img-metrica p{
		font-size: 0.8rem;
	}

	.quien-img-metrica p::before{
		content: "Correos entregados en el último año";
	}
	#faq-anunciantes,#faq-suscriptores{
		padding: 4rem 7rem;
		margin: 0;
		margin-bottom: 4rem;
	}
	.faq-textos {
		padding-right: 30%;
	}
		
	#faq-anunciantes-title,#faq-suscriptores-title{
		font-size: 1.3rem;
		
	}
	#faq-anunciantes-description, #faq-suscriptores-description{
		font-size: 2rem;
	}
	#faq-anunciantes-description strong, #faq-suscriptores-description strong{
		font-size: 2rem;
	}

	article.faq{
		padding: 1rem;
		border-radius: var(--border-radius);
	}
	article.faq button .pregunta{
		font-size: 1rem;
	}
	.faq-toggle{
		flex: 0 0 2rem;
	}
	.faq-toggle::before{
		font-size: 1.6rem;
	}
	article.faq p{
		font-size: 0.9rem;
		line-height: 1.3rem;;
	}



	#suscriptores{
		padding: 2rem 0;
		background-color: var(--pleca-azul-oscuro);
		border-bottom: 5rem solid var(--pleca-clara1);
	}
	.suscriptores-box{
		width: 100%;
		padding: 1rem 50% 1rem 1rem;
		display: block;
		position: relative;
	}
	.suscriptores-textos{
		width: 100%;
	}

	.suscriptores-formulario{
		position: absolute;
		right: 1.5rem;
		width: 45%;
		top: -6rem;
	}

	.footer-cols{
		padding: 3rem 2rem;

	}

	#footer-title {
		font-size: 1.2rem;
	}
	.footer-col-contactos{
		order: 1;
		align-items: flex-start;
		text-align: left;
		padding: 0 1rem;
	}
	.footer-col-conds{
		order: 2;
		padding: 0 1rem;
		text-align: left;
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
	}
	.footer-col-conds a {
		margin: 0.5rem 0;
		
	}
	.footer-col-logo{
		order: 3;
		padding: 0px 2rem 0rem 2rem;
		text-align: left;
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
	}

	.footer-col-logo img{
		width: 70%;
		margin: 0;
		margin-bottom: 1rem;
	}
	.footer-col-logo .slogan {
		margin: 0;
		
	}
	
	#contacto-description{
		padding-right:40%;
		
	}

	.flex-cols{
		flex-wrap: nowrap;
	}
	.flex-wrap{
		flex-wrap: wrap;
	}
	.gap-1 > *
	,.gap-05 > *
	,.gap-15 > *
	,.gap-2 > *
	,.gap-25 > *
	,.gap-3 > *
	,.col-sh{
		flex-shrink: 1;
	}
	.col-100{ flex-basis:100%  !important; }
	.col-95{ flex-basis:95%  !important; }
	.col-90{ flex-basis:90%  !important; }
	.col-85{ flex-basis:85%  !important; }
	.col-80{ flex-basis:80%  !important; }
	.col-75{ flex-basis:75%  !important; }
	.col-70{ flex-basis:70%  !important; }
	.col-66{ flex-basis:66.666%  !important; }
	.col-65{ flex-basis:65%  !important; }
	.col-60{ flex-basis:60%  !important; }
	.col-55{ flex-basis:55%  !important; }
	.col-50{ flex-basis:50%  !important; } 
	.col-45{ flex-basis:45%  !important; }
	.col-40{flex-basis:40%  !important; }
	.col-35{ flex-basis:35%  !important; }
	.col-33{ flex-basis:33.333%  !important; }
	.col-30{ flex-basis:30%  !important; }
	.col-25{ flex-basis:25%  !important; }
	.col-20{ flex-basis:20%  !important; }
	.col-15{ flex-basis:15%  !important; }
	.col-10{ flex-basis:10%  !important; }
	.col-5{ flex-basis:5%  !important; }
	
	
}

/* 1104px */

@media (min-width: 1280px) {
	section{
		margin: 1.5rem 0 2rem 0;
	}
	h1{
		font-size: 3rem;
	}

	h2{
		font-size: 2.68rem;
	}

	h3{
		font-size: 2.36rem;
	}

	h4{
		font-size: 2.04rem;
	}

	h5{
		font-size: 1.72rem;
	}

	h6{
		font-size: 1.4rem;
	}
	
	
	
	.hero-image{
		flex: 0 0 41%;
	}
	.hero-textos{
		flex: 0 0 57%;
		padding: 0 4rem 0 1rem;
		gap: 2.5rem;
		width: 57%;
	}
	.hero-textos h1{
		line-height: 3rem;
		padding-right: 15%;
	}
	p.SubTexto{
		font-size: 1.6rem !important;
	}
	
	.hero-metricas{
		gap: 1.3rem;
	}

	.head-menu a{
		font-size: 1.1rem;
		padding: 0.6rem 1.5rem;
	}
	.hero-metricas span{
		font-size: 2rem;
	}
	.comunidad-metricas-par {
		flex: 0 0 50%;
		gap: 1.2rem;
		padding: 0.5rem;
	}
	.comunidad-metricas {
		gap: 0;
	}
	.comunidad-textos {
		padding-right: 5%;
		justify-content: space-between;
		padding-left: 1rem;
	}
	.comunidad-metricas-cu span {
		font-size: 2rem;
		
	}
	.comunidad-metricas-cu p {
		font-size: 1rem;
		padding-right: 20%;
	}
	.comunidad-metricas h6 {
		display:none;
	}
	.comunidad-metricas-cu {
		padding: 1rem 1.5rem;
		background-color: var(--pleca-clara1);
	}
	.comunidad-textos .SubTexto{
		padding-right: 10%;
	}
	.comunidad-metricas-cu.hot img {
		right: -0.5rem;
		top: -2rem;
		width: 3.5rem;
	}
	
	.comunidad-estados {
		padding: 7rem 0.5rem 0;
	}
	
	.comunidad-estados-top {
		height: 7rem;
		padding-right: 30%;
	}
	.comunidad-estados-top	h4 {
		font-size: 2rem;
	}
	.comunidad-estados-top img {
		width: 11rem;
		bottom: -1rem;
	}
	
	.comunidad-mapa {
		margin: 0;
		padding: 6rem 4rem 0 4rem;
	}

	.beneficios-content {
		padding: 0 0;
	}
	.beneficios-cards {
		padding: 0 0%;
		gap: 0;
	}
	#beneficios-title {
		padding: 0;
		font-size: 3rem;
	}
	.beneficios-top, .beneficios-bottom {
		gap: 3rem;
		padding: 0 20%;
	}
	.beneficios-content {
		gap: 4rem;
	}
	#beneficios-cta-title {
		padding: 0 10%;
		font-size: 2.4rem;
	}

	.beneficios-bottom-botones {
		width: 90%;
		
	}
	.beneficios-bottom-btn {
		font-size: 1.1rem;
		padding: 0.8rem;
	}
	.beneficios-bottom-btn img{
		height: 1rem;
	}

	#quien{
		margin: 5rem 0 5rem;
	}
	#quien-title {
		font-size: 2.6rem;
		padding-right: 25%;
	}
	#faq-anunciantes-description strong, #faq-suscriptores-description strong{
		font-size: 2.6rem;
	}
	.quien-contenido {
		width: 86%;
		margin: 0 7%;
	}
	#faq-anunciantes,#faq-suscriptores{
		padding: 6rem 5rem;
		margin: 0;
	}
	#faq-anunciantes{
		margin-bottom: 8rem;
	}
	.faq-contenido{
		display: flex;
		flex-direction: row;
		align-items: flex-start;
		justify-content: space-around;
		gap: 6rem;
	}
	.faq-textos{
		flex: 0 1 45%;
		padding: 0;
		gap: 2rem;
	}
	.faq-preguntas{
		flex: 0 0 50%;
		padding: 0;
	}
	#faq-anunciantes-title,#faq-suscriptores-title {
		font-size: 1.8rem;
	}
	#faq-anunciantes-description, #faq-suscriptores-description {
		font-size: 2.7rem;
	}
	#faq-anunciantes-description strong, #faq-suscriptores-description strong {
		font-size: 2.7rem;
	}

	#suscriptores-description {
		font-size: 3rem !important;
		margin: 1rem 0;
	}
	#suscriptores-title {
		font-size: 1.8rem;
	}
	.suscriptores-textos p {
		font-size: 1.1rem;
	}

	.suscriptores-box {
		width: 100%;
		margin: 0;
		padding: 1rem 45% 1rem 1rem;
	}

	.suscriptores-formulario {
		right: 7rem;
		width: 33%;
		top: -6rem;
	}
	#suscriptores {
		margin-bottom: 0;
		margin-top: 5rem;
		border-bottom-width: 9rem;
	}
	.suscriptores-textos {
		padding-left: 4rem;
	}
	
	.footer-col-logo{
		padding: 0px 0 0rem 7%;
		justify-content: center;
	}

	.footer-col-logo img{
		width: 60%;
	}

	.footer-col-contactos {
		padding: 0px 7% 0rem 0;
		justify-content: center;
		gap: 1rem;
	}

	.footer-col-conds {
		justify-content: center;
		padding: 0;
		padding-top: 2rem;
	}
	.footer-cols {
		padding: 3rem 0;
	}
	.suscriptores-formulario h3 {
		height: 3.4rem;
		margin-top: -3.4rem;
		line-height: 3.5rem;
		font-size: 2rem;
	}

	.forma-modal {
		display: flex;
		flex-direction: row;
		width: 60rem;
		height: 100%;
		margin: 1rem;
		max-width: unset;
	}

	.forma-modal-head {
		flex: 0 0 45%;
		padding: 2rem;
	}
	.forma-modal-head-title {
		padding-right: 10%;
		font-size: 2.6rem;
		margin-bottom: 1.5rem;
		margin-top: 1rem;
	}

	.forma-modal-head-subtext {
		font-size: 1.2rem;
	}
	.forma-modal-campos {
		flex: 0 1 100%;
		overflow: hidden;
		overflow-y: auto;
		padding: 2rem;
	}

}