/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Ubuntu:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap');
:root{
    --font-titulares: "Noto Sans", sans-serif;
	--font-lectura: "Open Sans", sans-serif;
	
    --titulares-font: var(--font-titulares);
	--lectura-font: var(--font-lectura);
	
    --titulares-weight: 900;
    --titulares-line: 1.1;
    --titulares-space: -.03em;
    --titulares-color: #0C0C0C;
    --lectura-weight: 400;
    --lectura-line: 1.2;
    --lectura-color: #1d5c84;
	--lectura-negro: #383838;
	--lectura-gris: #262626;
	
	/* colores entrantes */
	--color-entrante-01:#000; 
	--color-entrante-02:#811788;
	--color-entrante-03: #06F;
	
	/* colores salientes */
	--blanco90:#FFF9;
	--blanco50:#FFFFFF61;
	--suavecito:#ECECEC;
	--color-saliente-01:#F4F4F4;
	
	/* links */
	--titulares-link: #0C0C0C;
	--lectura-link: #811788;
	
	--visual-gradiente:linear-gradient(to bottom, rgba(0,0,0,0) 20%, #4a0d4e 80%);
	--visual-gradiente-01:linear-gradient(to bottom, rgba(0,0,0,0) 20%, #384A56 80%);
	--visual-gradiente-02:linear-gradient(to bottom, rgba(0,0,0,0) 20%, #788557 80%);
	
	
	--sombra-texto:  0px 2px 1px rgba(0, 0, 0, 1);
	--sombra-suave: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
	
	
}
body{color:var(--lectura-negro);}
h1,h2,h3,h4,p{margin-top:0;}
h1{margin-bottom:.5rem}
h1 a,h2 a,h3 a{color: var(--titulares-link) !important;}
.columna a {color:var( --lectura-link);}
.nav a{color:var(--blanco90);}

/* cabecera */
nav.claves{display:none;}
header nav > ul li:first-child,header nav > ul li:last-child{padding-left:0;}
header{background:var(--color-entrante-01);color:var(--suavecito)}
header a{color:var(--blanco90)}
/* todas las piezas de la cabecera */
header > div.grid.container{
	grid-template-columns: 60px 1fr 60px;
	grid-template-areas:
		"menu logo tools"
		"secs secs secs";}
div.logo {grid-area: logo;margin: .5rem;justify-content: center;}
nav.tools {grid-area: tools;}
nav.menu {grid-area: menu;}
nav.secciones {grid-area: secs;justify-content: center;}
div.bienvenida {margin: .5rem; display:flex}
nav.institucionales,nav.legales,nav.secciones{font-size:.75rem;text-transform:uppercase;color:var(--blanco50);}
nav.social ul,header nav.tools ul,header nav.institucionales,header nav.tools,header nav.legales {justify-content: flex-end;}

nav.social ul {padding:0;}
nav.social ul li{padding: var(--modulo) 2px;}
nav.social .linkedin{display:none;}

/* pegado */
header #logotipo{width:140px;transition:width .25s;}
header.pegado #logotipo{width:100px !important;}
header nav{opacity:1;visibility:visible;max-height:10rem;transition:opacity .25s,max-height .25s,margin .25s,padding .25s;}
header.pegado [data-scroll="hide"]{opacity:0;visibility:hidden;max-height:0;overflow:hidden;margin:0;padding:0;border:0;pointer-events:none;}
header [data-scroll="sticky"]{opacity:0;visibility:hidden;max-height:0;overflow:hidden;}
header.pegado [data-scroll="sticky"]{opacity:1;visibility:visible;max-height:5rem;}

/* sectores */
main h2 {font-family:var(--font-lectura);}
main h2.defecto {padding-bottom: var(--modulo);border-bottom: 2px solid var(--suavecito);}
main h2.defecto span{color:var(--color-entrante-01);padding-bottom: calc(var(--modulo) - 4px);border-bottom: 4px solid var(--lectura-gris);}

main.color{background: var(--color-entrante-02);padding: 2rem var(--modulo) var(--modulo) 0;margin-bottom: -26px;}
main h2.color {padding-bottom: var(--modulo);border-bottom: 2px solid var(--suavecito);}
main h2.color span{color:var(--suavecito);padding-bottom: calc(var(--modulo) - 4px);border-bottom: 4px solid var(--suavecito);}
section.color{background: var(--color-entrante-02);color: var(--suavecito);}
section.color div.columna h1 a{color:var(--suavecito) !important;text-shadow: var(--sombra-texto);}
section.color div.columna p{color:var(--suavecito) !important;}
section.color h4 {padding: var(--modulo);background: var(--color-entrante-02);color:var(--suavecito); padding-right:26px;}
section.color h4 {clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%);}
section.color .columna.caja {border: 1px solid #0003;}

main.tematico{background: var(--color-saliente-01);padding: 1rem var(--modulo) var(--modulo) 0;margin-bottom: -26px;}
main h2.tematico {padding-bottom: var(--modulo);border-bottom: 2px solid var(--color-entrante-01);}
main h2.tematico span{color:var(--color-entrante-01);padding-bottom: calc(var(--modulo) - 4px);border-bottom: 4px solid var(--color-entrante-01);}
section.tematico {background: var(--color-saliente-01);}
section.tematico h1{font-weight: 700;}
section.tematico h4 {padding: var(--modulo);background: var(--color-entrante-02) !important;color:var(--suavecito);padding-right:26px;}
section.tematico h4 {clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%);}
section.tematico div.columna p{color:var(--blanco90) !important;}

section.tematico div.columna.visual img{filter:grayscale();};
section.tematico div.columna.visual.noticias_mineria article{border: 1px solid #424C55;}
section.tematico div.columna.visual.noticias_mineria .contenido{background: var(--visual-gradiente-01);}
section.tematico div.columna.visual.noticias_mineria h1 a{color:#F5FFFF !important;}

section.tematico div.columna.visual.noticias_agricultura article{border: 1px solid #747B5A;}
section.tematico div.columna.visual.noticias_agricultura .contenido{background: var(--visual-gradiente-02);}
section.tematico div.columna.visual.noticias_agricultura h1 a{color:#FCFFEE !important;}


.splash.container{color: var(--lectura-negro);}
.icono {display: flex;width: 100%;height: 100%;justify-content: center;align-items: end;}
.icono img {aspect-ratio: 1;max-width: 48px;width: 100%;filter: contrast(0%);}


/* caja (con parrafo) */
.columna.caja {border: 1px solid var(--suavecito);}
.columna.caja article * {margin-top: 0 !important; padding-top:0 !important;margin-bottom: 0 !important; padding-bottom:0 !important;} /* reset */
.columna.caja article {gap: 1.5rem;}
.columna.caja article .contenido {gap: .4rem;}
.columna.caja p{display:block;color: var(--lectura-negro);}
.columna.caja h1{position: relative; padding-left:var(--modulo) !important;}
.columna.caja h1::before {content: "";position: absolute;left: -8px;width: 4px;background-color:#ddc2df;top: 10px;bottom: 7px;}
.columna.caja article figure div picture {border-radius: var(--modulo);overflow: hidden;}
.columna .contenido h4{font-size: .75rem; text-transform:uppercase;}

/* normal */
.columna.normal .contenido{padding:8px 0 0 0; position:relative;}
.columna.normal .contenido h4 {position: absolute;top: calc( var(--modulo) * -6);padding: var(--modulo);background: var(--color-entrante-02);font-size: .85rem;}
.columna.normal .contenido h4 a{color:#FFF;}
.columna.normal .contenido h4 span.volanta{display:none;}

/* visual */
.columna.visual article{border: 1px solid #9DABC1;border-radius: var(--modulo);overflow: hidden;box-shadow: var(--sombra-suave);}
.visual .contenido {flex-direction: column;justify-content: flex-end;}
.visual .contenido{background: var(--visual-gradiente);}
.visual h1 a{color:var(--suavecito) !important;text-shadow: var(--sombra-texto);}
.columna.visual h4 {padding: var(--modulo);background: var(--color-entrante-02);color:var(--suavecito); padding-right:26px;}
.columna.visual h4 {  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%);}
.columna.visual h4 span.seccion{display:none;}
.visual p{display: none;}
.visual[size_x="6"]  p,
.visual[size_x="7"]  p,
.visual[size_x="8"]  p,
.visual[size_x="9"]  p,
.visual[size_x="10"]  p,
.visual[size_x="11"]  p,
.visual[size_x="12"]  p{display: block;color:var(--suavecito);}
.visual[size_x="9"]  p,
.visual[size_x="10"]  p,
.visual[size_x="11"]  p,
.visual[size_x="12"]  p{font-size: 19px;}

/* listas */

div.columna[size_x="1"] ol.widget
,div.columna[size_x="2"] ol.widget
,div.columna[size_x="3"] ol.widget
,div.columna[size_x="4"] ol.widget
,div.columna[size_x="5"] ol.widget
,div.columna[size_x="6"] ol.widget{flex-direction: column;}
.widget li {border-bottom: 1px solid var(--suavecito);}
.widget li h4 {font-size: .75rem;text-transform: uppercase;}
.widget li h4 span {font-weight: 400;font-size: 11px;}
.widget li .media {height: 56px;}
.widget li h1 {font-size: 0.938rem !important;font-weight:700;}
.widget li h1{position: relative; padding-left:var(--modulo);}


footer {
  background: var(--color-entrante-01);
  color: var(--blanco90);
  margin: 2rem 0 0 0;
  padding: 1rem 0;
}

.splash {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: .75rem;
}

.marquesina {
  overflow: hidden;
  width: 100%;
  position: relative;
}

.pizarra {
  display: flex;
  width: max-content;
  align-items: center;
  gap: 8px;
  padding-right: 8px;
  
  /* Animación: 20s de duración, velocidad constante, repetición infinita */
  animation: desplazar-marquesina 20s linear infinite;
}

.marquesina:hover .pizarra {animation-play-state: paused;}

.pizarra > div {
  border: 1px solid var(--suavecito);
  background: #fff;
  border-radius: 8px;
  color: var(--lectura-negro);
  display: flex;
  align-items: center;
  flex: 0 0 auto;
}

.pizarra div span {
  text-transform: uppercase;
  background: var(--suavecito);
  padding: 0 20px 0 8px;
  display: flex;
  margin-bottom: 0;
  min-height: 22px;
  line-height: 22px;
  align-items: center;
  word-break: break-all;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%);
}

.pizarra div strong {
  font-size: 1rem;
  padding: 0 8px;
}
.pizarra div em {
  font-size: 10px;
  font-weight: 600;
  font-style: inherit;
  padding: 0px 12px 0px;
}
.pizarra div em.positiva {color:green;}
.pizarra div em.negativa {color:red;}
.pizarra div em.neutra {color:#666;}
/* Fotogramas de la animación CSS */
@keyframes desplazar-marquesina {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%); 
  }
}
	
.Apertura h4 {
    font-family: var(--font-lectura);
    padding-bottom: var(--modulo);
    border-bottom: 2px solid var(--suavecito);
    width: 100%;
}
 .Apertura h4 span a {
    color: var( --lectura-link);
    padding-bottom: calc(var(--modulo) - 4px);
    border-bottom: 4px solid var( --lectura-link);
    font-weight: 500;
    text-decoration: none;
    text-transform: uppercase;
  }
.Texto h2 {color: var( --lectura-link);}
.Texto h3.tagstitulo {margin: 2rem 0;}
/* Exclusivo DESKTOP */
@media (min-width: 768px) {
	h1{font-size: 1.25rem;}
	.columna[size_x="6"] h1,.columna[size_x="7"] h1{ font-size: 1.85rem}
	.columna[size_x="8"] h1,.columna[size_x="9"] h1,.columna[size_x="10"] h1,.columna[size_x="11"] h1{ font-size: 2.35rem}
	.columna[size_x="12"] h1 {font-size: 3rem;}
	
	.bienvenida p,.bienvenida span{font-size: .75rem; margin:0;}
	.bienvenida {gap: .5rem !important;font-size: .75rem;text-align:right;}
	.temperatura {font-size: 22px;}
	.bienvenida .hoy p:first-child{border-bottom:1px solid #FFFFFF5C;padding-bottom: 4px;margin-bottom: 4px;}

	ul.headertags {
	  font-size: .75rem;
	  text-transform: uppercase;
	}
		
	ol.widget {display: flex;}
	#lectura .grid-container ol.widget {
		flex-direction: column;
		min-width: 300px;
	 }

	.contenedor_url {position: absolute;top: 50%;left: 50%;transform: translate(-50% , -50%);width: 100%;}
	
	/* lectura */
	.grid-container {
	  display: grid;
	  grid-template-columns: min-content 2fr 3fr 2fr min-content; /* 2025 */
	  grid-auto-rows: min-content !important;
	  gap: var(--calle);
	  grid-template-areas:
		"Aside0 Aside0 Aside0 Aside0 Aside0"
		"Apert Apert Apert Apert Aside1"
		"Apert Apert Apert Apert Ultimas"
		"Texto Texto Texto Texto Ranking"
		"Texto Texto Texto Texto Aside2"
		"Texto Texto Texto Texto Aside3"
		"Texto Texto Texto Texto Aside4"
		"Aside5 Aside5 Aside5 Aside5 Aside5";
		width: 100%;
		max-width:var(--anchomax);
		margin:0 auto;
	}
	
	.Aside0 {justify-self: center;align-self: flex-start;grid-area: Aside0;}
	.Aside1 {justify-self: center;align-self: flex-start;grid-area: Aside1;}
	.Aside2 {justify-self: center;align-self: flex-start;grid-area: Aside2;}
	.Aside3 {justify-self: center;align-self: flex-start;grid-area: Aside3;}
	.Aside4 {justify-self: center;align-self: flex-start;grid-area: Aside4;}
	.Aside5 {justify-self: center;align-self: flex-start;grid-area: Aside5;}
	.Items {justify-self: center;align-self: flex-start;grid-area: Items;}
	.Ranking {align-self: start;grid-area: Ranking;height: 100%;}
	.Ultimas {align-self: start;grid-area: Ultimas;height: 100%;}
	.Display {align-self: start;grid-area: Display;}
	.Apertura {align-self: start;grid-area: Apert;}
	.Texto {align-self: start;grid-area: Texto;height: 100%; max-width:860px;justify-self: center;}
	
	.Apertura {
	  display: grid;
	  gap: 1rem;
		grid-template-areas:
		"volanta volanta"
		"titulo titulo"
		"bajada bajada"
		"signature primaria"
		"fecha fecha"
		"media media"
		"secundaria secundaria";
	}
	
	.Apertura h1 {grid-area: titulo;font-size: 46px;font-weight: 700;margin: 0 0 16px;}
	.Apertura h4 span a{color: var( --lectura-link);padding-bottom: calc(var(--modulo) - 4px);border-bottom: 4px solid var( --lectura-link);font-weight:500;text-decoration:none;text-transform: uppercase;}
	.Apertura p.bajada {grid-area: bajada;font-size: 24px;font-weight: 300;line-height: 1.3;margin: 0 0 16px;}
	.Apertura .primaria{grid-area: primaria;justify-content: right;}
	.Apertura div.signature{grid-area: signature;}
	.Apertura div.fecha_publica{grid-area: fecha;}
	.Apertura div.media-principal{grid-area: media;}
	.Apertura .secundaria{grid-area: secundaria;}
	
	.Texto p {font-size: 20px;font-weight: 300;margin-bottom: var(--calle);line-height: 1.4;}
	.Texto p strong ,.Texto p b {color: #000;font-weight: bold;}
	.Texto img,.Texto iframe {min-height: 400px;margin: 1.5rem auto;width: 100%;}

	
	/* seccion */
	.layout.seccion {
  	display: grid;
  	grid-template-columns: min-content 2fr 3fr 2fr min-content; /* 2025 */
  	grid-auto-rows: min-content !important;
  	gap: var(--calle);
  	grid-template-areas:
    "Aside0 Aside0 Aside0 Aside0 Aside0"
	"Display Display Display Display Display"
    "Aside1 Items Items Ranking Aside2"
    "Aside1 Items Items Ultimas Aside2"
    "Aside1 Items Items Aside3 Aside2"
	"Aside1 Items Items Aside4 Aside2"
	"Aside5 Aside5 Aside5 Aside5 Aside5";
	width: 100%;
	max-width:var(--anchomax);
	margin:0 auto;
	}
	/* items */
	.Items .item article {display: flex;gap: var(--calle);margin:var(--calle);}
	.Items .item article img{min-width:290px;min-height:200px;}
	.espacio-sntr {position: relative;height: calc(100% - var(--calle)*2);margin: var(--calle);}
	.espacio-sntr > ins {z-index: 10;position: -webkit-sticky;position: sticky;top: calc(var(--calle) + var(--alto-cabecera));}
	.columna {position:relative;}
	.columna > ins {position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}

}
/* fin (Desktop) */







/* Small Devices (Mobile) */
@media (max-width: 767.98px) {
	.columna h1{font-size: 22px;}
	.columna[size_x="8"] h1,.columna[size_x="9"] h1,.columna[size_x="10"] h1,.columna[size_x="11"] h1{ font-size: 25px;}
	.columna[size_x="12"] h1 {font-size: 28px;}
	header > div.grid.container{
	grid-template-columns: min-content 1fr min-content;
	grid-template-areas:
	"tools logo buscador";
	}
	div.logo { grid-area: logo;margin: .5rem;justify-content: center;}
	nav.tools { grid-area: tools;}
	nav.buscador { grid-area: buscador;}
	header #logotipo{width:118px;}
	
	.columna.normal h4 {position: inherit !important;top:0 !important;}
	.columna.foto-izquierda p {display:none;}
	.columna.foto-derecha p {display:none;}
	ol.widget {display: block;margin: 1rem;}
	.widget li {gap: 1rem;}
	.widget li h1 {padding-left: .65rem;}
	
	/* mosaico */
	.container.comportamiento-tematico {display: grid;}
	.comportamiento-tematico {grid-template-columns: repeat(auto-fit, minmax(50%, 1fr)) !important;}
	.comportamiento-tematico {grid-auto-rows: min-content !important;}
	.container.comportamiento-tematico .columna {width:inherit !important;height:inherit !important;}
	.comportamiento-tematico .columna article h4{ display:none;}
	main.tematico {
  margin-bottom: 0;
}
	section.tematico h1 {font-size: 1rem;}
	.comportamiento-tematico .columna article p{ display:none;}
	.comportamiento-tematico .columna article .contenido{background: var(--visual-gradiente);justify-content: flex-end; margin:inherit;}
	.comportamiento-tematico .columna article > * {width: 100%;height: 100%;position: absolute;}
	.comportamiento-tematico .columna article figure:before {display:none;}
	.comportamiento-tematico .columna article {margin:0; background:transparent;width: 100%;}

	.icono {align-items: center;}
	.icono img {max-width: 32px;}
	nav.social {display: none;}
	.splash {gap: .5rem;margin: .5rem;}
	div.bienvenida {display: none;}
	ul.headertags li{font-size: .75rem;text-transform: uppercase;}
	/* li a partir del tercero */
	ul.headertags li:nth-child(n+3) {
		display: none;
	}

}

/* fin (Mobile) */

/* LECTURA Small Devices (Mobile) */
@media (max-width: 767.98px) {
	body {}
	.wrap{/*margin-top: calc(0px - var(--calle));*/}
	p {font-size: 18px;font-weight: 300;line-height: 1.3;margin-bottom: 12px;}
	
	.Items h1 {font-size: 1.1rem !important;line-height: 1.2;}
	
	.grid-container{display:flex; flex-direction:column;}
	.Aside0{order:0;display:none;}
	.Apertura{order:1;}
	.Aside1{order:2;display:none;}
	.Texto{order:3;}
	.Aside2{order:4;display:none;}
	.Aside3{order:5;display:none;}
	.Ranking{order:6;}
	.Aside4{order:7;display:none;}
	.Ultimas{order:8;}
	.Aside5{order:9;display:none;}
	.Apertura {display: grid;gap: var(--calle);margin: var(--calle) 0;}
	.Texto,.Apertura {padding:0 var(--calle);}
	.Apertura p.bajada {color: var(--lectura-negro);font-size: 21px;font-weight: 300;line-height: 1.3;margin-bottom: 12px;}
	.Texto p,.Texto *,.Texto{color: var(--lectura-negro);font-size: 18px;line-height: 1.5;margin: 0 0 16px;}
	.Texto{font-weight: 300;}
	.Texto p strong {color: #000;font-weight: bold;}
	footer {padding: 1rem;}
	footer p{font-size:14px;}
	footer #minilogo{margin:.5rem 0 1rem 0;}





} /* Fin Small Devices (Mobile) */