/* CSS PORTADA */

.portada {}

.destacados-portada {display: grid; grid-template-columns: 60% 1fr; gap: 40px 40px; margin-bottom: 60px;}
.destacados-portada article.destacado-principal {position:relative; height: fit-content;}
.destacados-portada article.destacado-principal .imagen-post {border-radius: 16px;overflow: hidden;}
.destacados-portada article.destacado-principal .imagen-post img {border-radius: 16px; display:block;}
.destacados-portada article.destacado-principal .titulares {position: absolute; bottom: 0; background: linear-gradient(to bottom, rgba(11, 57, 84, 0) 0%, rgba(4, 21, 31, 0.66) 20%, rgba(2, 11, 16, 0.85) 60%, rgba(0, 0, 0, 0.95) 100%); border-radius: 16px; padding: 60px 30px 40px;}
.destacados-portada article.destacado-principal .meta {}
.destacados-portada article.destacado-principal .titulares h3 {}
.destacados-portada article.destacado-principal .titulares h3 a {color:var(--color-texto-claro);}
.destacados-portada article.destacado-principal .titulares .fecha {color:var(--color-texto-claro); margin: 0 10px 0 0;}
.destacados-portada article.destacado-principal .titulares .tiempo-lectura {color:var(--color-texto-claro); background: url(../img/icono-reloj-blanco.svg) 0 0 no-repeat; background-size: contain;}
.destacados-portada article.destacado-principal .titulares h2 {font-size: 28px; line-height: 1.35em; margin: 0 0 24px;}
.destacados-portada article.destacado-principal .titulares h2 a {color:var(--color-texto-claro);}
.destacados-portada article.destacado-principal .titulares .bajada {color:var(--color-texto-claro);}

.secundarios {}
.secundarios .header-seccion .titulo-seccion {width: 100%; float: none;}
.secundarios article {display: grid; grid-auto-rows: 1fr; grid-template-columns: 180px 1fr; gap: 32px 25px; margin: 0 0 32px;}
.secundarios article .imagen-post {}
.secundarios article .titulares {}
.secundarios article .meta {}
.secundarios article .titulares h3 {}
.secundarios article .titulares h3 a {}
.secundarios article .titulares .fecha {display:none;}
.secundarios article .titulares .tiempo-lectura {}
.secundarios article .titulares h2 {font-size: 20px; margin: 0;}
.secundarios article .titulares h2 a {}


.destacado-grande {margin-bottom: 50px;}
.destacado-grande article {display: grid; grid-auto-columns: 1fr; grid-auto-rows: 1fr 1fr; grid-template-columns: auto 1fr; grid-template-rows: 1fr; gap: 0px 50px;}
.destacado-grande article .imagen-post {width: 560px;border-radius:20px;}
.destacado-grande article .imagen-post img {border-radius:20px;display:block;}
.destacado-grande article .titulares {}
.destacado-grande article .titulares h3 {float:none;}
.destacado-grande article .titulares h3 a {color:#fff;}
.destacado-grande article .titulares .fecha {float:none;}
.destacado-grande article .titulares h2 {margin: 0 0 30px; font-size: 32px; line-height: 1.35em; width:100%; clear:both;}
.destacado-grande article .titulares h2 a {color:var(--color-negro);}
.destacado-grande article .titulares h2 a:hover {color:var(--color-ppal);}
.destacado-grande article .titulares .bajada {font-family: var(--fuente-texto); font-size: 17px; line-height: 1.5em; color: #252525; margin: 0;}

.destacado-grande-repetible {background: var(--color-enf); padding: 36px; border-radius: 20px; box-sizing: border-box;}
.destacado-grande-repetible article {}
.destacado-grande-repetible article .imagen-post {}
.destacado-grande-repetible article .titulares {}
.destacado-grande-repetible article .titulares h3 {}
.destacado-grande-repetible article .titulares h3 a {}
.destacado-grande-repetible article .titulares .fecha {}
.destacado-grande-repetible article .titulares h2 {}
.destacado-grande-repetible article .titulares h2 a {}
.destacado-grande-repetible article .titulares .bajada {}

.header-seccion {width: 100%; clear: both; margin: 0 0 30px; border-bottom: solid 3px var(--color-ppal); border-image: linear-gradient(45deg, var(--color-ppal), var(--color-sec)) 1; padding: 0 0 5px;}
.titulo-seccion {float: left; width: calc(100% - 82px); position: relative;}
.titulo-seccion h3 {font-size: 32px; font-weight: 700; margin: 0; line-height: 1.35em; text-transform: uppercase;}
.titulo-seccion h3 a {color:var(--color-negro);}
.titulo-seccion p {margin: 0; color: #808080; font-weight: 300; font-size: 16px;}
.titulo-seccion a.ver-mas {position: absolute; display: block; bottom: 0; right: 0; text-transform: uppercase; font-size: 14px; font-weight: 500; color: #444; border: solid 2px #f0f0f0; padding: 3px 5px; background: #f0f0f0; transition:all 300ms;}
.titulo-seccion a.ver-mas:hover {background:#222;color:#fff;}
.autoseccion .bloque-cartas .titulo-seccion {width:100%;}
.autoseccion .bloque-cartas .header-seccion {margin:0; border-bottom:0 none;}


.recientes {width:100%;margin:0 0 60px;}
.recientes .titulo-seccion h3 {background: url(../img/icono-reloj-gradiente.svg) 0 0 no-repeat; background-size: contain; padding: 0 0 0 50px;}
.destacado-recientes {float: left; width: 766px; margin: 0 50px 0 0;}
.destacado-recientes article {display: block; margin: 0; padding: 0;}
.destacado-recientes article .imagen-post {position: relative;border-radius: 20px;overflow: hidden;}
.destacado-recientes article .imagen-post img {width:100%;border-radius: 20px;}
.destacado-recientes article .titulares {position: absolute; bottom: 0; padding: 60px 40px 40px; width: 100%; box-sizing: border-box; background: linear-gradient(to bottom, rgba(11,57,84,0) 0%, rgba(4,21,31,0.66) 20%, rgba(2,11,16,0.85) 60%, rgba(0,0,0,0.95) 100%);}
.destacado-recientes article .titulares h3 {display: inline-block;}
.destacado-recientes article .titulares .tiempo-lectura {color: #fff !important; background: url(../img/icono-reloj-blanco.svg) 0 0 no-repeat !important; background-size: contain !important;}
.destacado-recientes article .titulares amp-timeago {display: inline-block; color: var(--color-texto-claro);}
.destacado-recientes article .titulares h2 {font-size: 30px; line-height: 1.35em; margin: 0;font-weight: 600; clear:both;}
.destacado-recientes article .titulares h2 a {color:#eee;transition:all 300ms;}
.destacado-recientes article .titulares h2 a:hover {color: var(--color-ppal);}

.recientes .mas-recientes {float: left; width: calc(100% - 816px);}
.recientes .mas-recientes article {width: 100%; margin: 0 0 24px 0; border-bottom: solid 1px var(--color-gris-claro); padding: 0 0 10px;}
.recientes .mas-recientes article:last-child {border-bottom: 0 none;}
.recientes .mas-recientes article h3 {font-weight: 500; font-size: 14px; margin: 0 10px 10px 0; padding: 0 8px; height: 26px; line-height: 27px;}
.recientes .mas-recientes article span {display: inline-block; margin: 0 10px 5px; color: #808080;}
.recientes .mas-recientes article amp-timeago {color: var(--color-ppal); font-size: 14px;}
.recientes .mas-recientes article h2 {margin: 0; font-size: 18px; font-weight: 600; line-height: 1.35em;}
.recientes .mas-recientes article h2 a {color:#000;transition:all 300ms;}
.recientes .mas-recientes article h2 a:hover {color: var(--color-ppal);}

.home-historias {margin: 0 0 60px;}
.home-historias .wrapper {background: linear-gradient(45deg, var(--color-ppal), var(--color-sec)); padding: 22px 28px 12px; border-radius: 16px;box-sizing: border-box;}
.home-historias .header-seccion {border-bottom: solid 3px #fff; border-image: unset;}
.home-historias .titulo-seccion h3 {background: url(../img/icono-reels.svg) 0 0 no-repeat; background-size: contain; padding: 0 0 0 50px; color: #fff;}
.home-historias .carrusel-historias {width:100%;clear:both;padding-bottom:20px;}
.home-historias .cuerpo-slide {padding-bottom: 10px;}
.home-historias .main-historia {width: 100%; border-radius: 12px; overflow: hidden; position: relative;}
.home-historias .main-historia iframe.embed-historia {width: 100%; height: auto; aspect-ratio: 280 / 497; margin: 0; padding: 0;}
.home-historias .main-historia a.historia-hashtag {position: absolute; top: 14px; left: 12px; font-size: 18px; color: #fff; transition: all 300ms; background: linear-gradient(45deg, var(--color-ppal), var(--color-sec)); padding: 0 16px; height: 24px; line-height: 24px; border-radius: 24px;}
.home-historias .main-historia a.historia-hashtag span {color: var(--color-enf);}
.home-historias .main-historia h2 {position: absolute; bottom: 0; left: 0; padding: 60px 3% 20px; width: 94%; margin: 0; font-size: 18px; text-shadow: 0 0 2px var(--negro); background: linear-gradient(to bottom, rgba(11, 57, 84, 0) 0%, rgba(4, 21, 31, 0.90) 66%, rgba(0, 0, 0, 0.95) 100%); color:#fff; font-weight: 600;  transition:all 300ms;}
.home-historias .cuerpo-slide .link-historia {display: block; margin: 14px auto 10px; color: var(--color-texto-claro); background: var(--blanco); border-radius: 12px; text-align: center; text-transform: uppercase; width: fit-content; padding: 0 18px; font-weight: 500; font-size: 15px; height: 24px; line-height: 24px; border: solid 1px #fff;}
.home-historias .main-historia:hover h2, .home-historias .main-historia:hover a.historia-hashtag {opacity:0;}
.home-historias .swiper-wrapper {height: auto !important;}
.home-historias .swiper-pagination { position: static !important;}
.home-historias .swiper-pagination .swiper-pagination-bullet {background: #fff; padding: 2px; width: 5px; height: 5px;}

.formulario-newsletter {width: 100%; clear: both; margin: 50px 0 60px; background: var(--color-enf); height: auto;border-radius: 20px; padding: 30px 40px; box-sizing: border-box;}
.formulario-newsletter h3 {background: url(../img/icono-newsletter.svg) 0 0 no-repeat; background-size: contain; padding: 0 0 0 50px;}
.formulario-newsletter .texto-formulario {float: left; width: 45%; margin: 0;}
.formulario-newsletter .texto-formulario p {font-size: 30px; font-weight: 600; line-height: 1.35em; color: var(--color-texto); margin: 15px 0 0 0;}
.formulario-newsletter .optin-nl {float: left; width: 55%; margin: 15px 0 0;}
.formulario-newsletter .optin-nl .wpcf7 {width: 100%; MAX-WIDTH: unset;}
.formulario-newsletter .optin-nl p {position:relative;}
.formulario-newsletter .optin-nl .wpcf7 input.wpcf7-text {width: 55%; border: solid 3px #ddd; height: 60px; color: #333; padding: 0 16px; float: left; border-radius: 8px 0 0 8px;margin: 0 0 0 3%;}
.formulario-newsletter .optin-nl .wpcf7 input.wpcf7-text::placeholder {}
.formulario-newsletter .optin-nl .wpcf7 input.wpcf7-submit {width: 40%; margin: 0 0 0 -3px; position: relative; border-radius: 0 8px 8px 0; height: 60px; border: solid #ddd; border-width: 3px 3px 3px 0; font-weight: 600; color: var(--color-texto-claro);}
.formulario-newsletter .optin-nl .wpcf7-not-valid-tip {position: absolute; top: 43px; width: 300px; right: 40px; color: var(--color-sec); margin: 0; padding: 0;}
.formulario-newsletter .optin-nl .wpcf7-response-output {border: 0 none;font-size: 12px;color: var(--color-sec);margin: -27px 0 0 18px; height: 0;}



/* MOVILES */
@media only screen and (max-width:767px) {
	.portada {}
	
	.destacados-portada {grid-template-columns: 1fr; margin-bottom: 0;}
	.destacados-portada article.destacado-principal {position: static; height: auto;}
	.destacados-portada article.destacado-principal .imagen-post {margin: 0 0 12px;}
	.destacados-portada article.destacado-principal .imagen-post img {}
	.destacados-portada article.destacado-principal .titulares {padding: 0; background: transparent; position: relative;}
	.destacados-portada article.destacado-principal .meta {}
	.destacados-portada article.destacado-principal .titulares h3 {}
	.destacados-portada article.destacado-principal .titulares h3 a {}
	.destacados-portada article.destacado-principal .titulares .fecha {color:var(--color-ppal); vertical-align: top;}
	.destacados-portada article.destacado-principal .titulares .tiempo-lectura {background: url(../img/icono-reloj.svg) 0 0 no-repeat; background-size: contain;color: var(--color-negro);}
	.destacados-portada article.destacado-principal .titulares h2 {font-size: 22px; margin: 0 0 18px;}
	.destacados-portada article.destacado-principal .titulares h2 a {color: var(--color-negro);}
	.destacados-portada article.destacado-principal .titulares .bajada {display: block; color: var(--color-negro); font-size: 16px;}

	.secundarios {}
	.secundarios .header-seccion .titulo-seccion {}
	.secundarios article {grid-template-columns: 100px 1fr; gap: 20px;}
	.secundarios article .imagen-post {}
	.secundarios article .titulares {}
	.secundarios article .meta {}
	.secundarios article .titulares h3 {height: 26px; line-height: 26px; font-size: 12px; margin: 0 12px 8px 0; padding: 0 6px;}
	.secundarios article .titulares h3 a {}
	.secundarios article .titulares .fecha {}
	.secundarios article .titulares .tiempo-lectura {}
	.secundarios article .titulares h2 {font-size: 18px; font-weight: 600;}
	.secundarios article .titulares h2 a {}

	
	
	.destacado-grande {margin-bottom: 30px;}
	.destacado-grande article {display: block; width: 100%;}
	.destacado-grande article .imagen-post { width: 100%; margin: 0 0 10px 0;}
	.destacado-grande article .imagen-post img {}
	.destacado-grande article .titulares {}
	.destacado-grande article .titulares h3 { height: 26px; line-height: 26px;font-size: 12px; margin: 0 12px 10px 0; padding: 0 6px;display: inline-block; float: none;}
	.destacado-grande article .titulares h3 a {}
	.destacado-grande article .titulares .fecha {height: 26px !important; line-height: 26px; font-size: 14px;float: none; display: inline-block; vertical-align: top;}
	.destacado-grande article .titulares .tiempo-lectura {vertical-align: middle;}
	.destacado-grande article .titulares h2 {font-size: 24px;}
	.destacado-grande article .titulares h2 a {}
	.destacado-grande article .titulares h2 a:hover {}
	.destacado-grande article .titulares .bajada {}
	
	.destacados .news-item .imagen-post {margin-bottom: 3px;}
	.destacados .news-item h3 {line-height: 1em; font-size: 13px;}
	.destacados .news-item span {display:none;}
	.destacados .news-item amp-timeago {display:none;}
	.destacados .news-item h2 {font-size: 18px;}
	
	.header-seccion {margin: 0 0 16px; padding: 0;}
	.titulo-seccion {width: 100%;}
	.titulo-seccion h3 {font-size: 24px;}
	.titulo-seccion h3 a {}
	.titulo-seccion p {}
	.titulo-seccion a.ver-mas {}
	.titulo-seccion a.ver-mas:hover {}
	.autoseccion .bloque-cartas .titulo-seccion {}
	.autoseccion .bloque-cartas .header-seccion {}
	
	.destacado-grande-repetible {padding: 4%}
	.destacado-grande-repetible article {}
	.destacado-grande-repetible article .imagen-post {margin: 0 0 20px;}
	.destacado-grande-repetible article .imagen-post img {border-radius: 16px;}
	.destacado-grande-repetible article .titulares h2 {margin:0 0 10px;}


	.recientes {margin: 0 0 30px;}
	.recientes .titulo-seccion h3 {font-size:24px; padding: 0 0 0 36px;} 
	.destacado-recientes {width: 100%; margin: 0 0 30px;}
	.destacado-recientes article {}
	.destacado-recientes article .imagen-post {}
	.destacado-recientes article .imagen-post img {}
	.destacado-recientes article .titulares {padding: 50px 4% 20px;}
	.destacado-recientes article .titulares h3 {margin: 0 11px 10px 0; height: 26px; line-height: 26px; font-size: 12px;}
	.destacado-recientes article .titulares .fecha {font-size: 14px; line-height: 26px; margin: 0; margin: 0 5px 0 0; vertical-align: top;}
	.destacado-recientes article .titulares .tiempo-lectura { vertical-align: text-bottom;}
	.destacado-recientes article .titulares h2 {font-size: 18px;}

	.recientes .mas-recientes {width: 100%; float: none; }
	.recientes .mas-recientes article {margin: 0 0 20px; }
	.recientes .mas-recientes article h3 {font-size: 12px; text-transform: uppercase; margin: 0px 5px 11px 0; height: 26px; line-height: 26px;}
	.recientes .mas-recientes article .fecha {font-size: 14px; line-height: 30px;margin: 0 5px 0 0; vertical-align: middle;}
	.recientes .mas-recientes article .tiempo-lectura {vertical-align: text-top;}
	.recientes .mas-recientes article h2 {font-size: 18px; margin: -3px 0 0 0}
	
	.home-historias {margin: 0 auto 50px;}
	.home-historias .wrapper {background: linear-gradient(45deg, var(--color-ppal), var(--color-sec)); padding: 12px 2% 1px; border-radius: 16px;}
	.home-historias .titulo-seccion {padding-bottom: 3px;}
	.home-historias .titulo-seccion h3 {padding: 0 0 0px 38px;}
	.carrusel-historias .swiper-pagination {margin-top: 5px;}
	.carrusel-historias .swiper-pagination .swiper-pagination-bullet { width: 4px; height: 4px;}
	
	.formulario-newsletter {margin: 40px 0;padding:20px 4%;}
	.formulario-newsletter h3 {padding: 0 0 0 38px;}
	.formulario-newsletter .texto-formulario {width: 100%; float: none; MARGIN-TOP: 20PX;}
	.formulario-newsletter .texto-formulario p {font-size: 22px; padding: 0 30px 0 10px; line-height: 1.16em;}
	.formulario-newsletter .optin-nl {float: none; width: 100%;}
	.formulario-newsletter .optin-nl .wpcf7 {}
	.formulario-newsletter .optin-nl {MARGIN:0;}
	.formulario-newsletter .optin-nl .wpcf7 input.wpcf7-text {width: 100%; border-radius: 6px; float: none; margin: 0 auto 10px; height: 50px;}
	.formulario-newsletter .optin-nl .wpcf7 input.wpcf7-submit {border: 0 none; border-radius: 6px; height: 40px; line-height: 40px; margin: 0 auto; width: auto; float: right;}
	.formulario-newsletter .optin-nl .wpcf7-not-valid-tip {top: 51px;  left: 6px; width: 130px; line-height: 13px;}
	.formulario-newsletter .optin-nl .wpcf7-response-output {margin: 0; height: 0; text-align: right;}

}












