@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100..700;1,100..700&display=swap');
/* Mendoza24 2.0 en Core 10 */
:root{
    --titulares-font: "IBM Plex Sans", sans-serif;
	--titulares-weight: 700;
    --titulares-line: 1.1;
	--titulares-space: -.03em;
    --titulares-color: #0C0C0C;
	
	--lectura-font: "IBM Plex Sans", sans-serif;
	--lectura-weight: 300;
    --lectura-line: 1.4;
	
	/* colores entrantes armonia shade */
	--color-entrante-01:#C00D0D; 
	--color-entrante-02:#8C2626; 
	--color-entrante-03:#592A2A;
	--color-entrante-04:#332222;
	--color-entrante-05:#332C2C;
	
	/* colores entrantes armonia monocromatica de un complementario elegido a ojo */
	--color-entrante-06:#002037; 
	--color-entrante-07:#15476B; 
	--color-entrante-08:#3F779E;
	--color-entrante-09:#7DAED1;
	--color-entrante-10:#CCEAFF;	
	
	/* colores salientes */
	--color-saliente-01:#F9F9F9;
	--color-saliente-02:#DFF2FF;
	--color-saliente-03:#BADEF7;
	
	--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);
	
	--visual-gradiente:linear-gradient(to bottom, rgba(0,0,0,0) 20%, var(--color-entrante-01) 80%);

}

header .logo{flex:1 0 auto;}
header #logotipo {width: 360px;transition: width .5s;padding: .5rem;}
header.pegado #logotipo {width: 230px !important;}
header nav.tools{flex:0 1 300px;}
header nav a {color: var(--color-entrante-02);}
header.pegado {background: var(--gris-100);box-shadow: var(--sombra-suave);}

footer {background: var(--gris-900);color: var(--blanco90);margin: 2rem 0 0 0;padding: 1rem 0;}
footer .datamedio{flex-direction:column; gap:0 !important;}
footer p{color:var(--gris-100); margin-top:0;}
footer p strong{color:var(--gris-50);}

/* lectura */
.Aside0,.Aside1,.Aside2,.Aside3,.Aside4,.Aside5,.Items {justify-self:center;align-self:flex-start;}
.Aside0 {grid-area:Aside0;}
.Aside1 {grid-area:Aside1;}
.Aside2 {grid-area:Aside2;}
.Aside3 {grid-area:Aside3;}
.Aside4 {grid-area:Aside4;}
.Aside5 {grid-area:Aside5;}
.Items  {grid-area:Items;}

.Ranking,.Ultimas,.Display,.Apertura,.Texto {align-self:start;}

.Ranking {grid-area:Ranking;height:100%;}
.Ultimas {grid-area:Ultimas;height:100%;}
.Display {grid-area:Display;}
.Apertura {grid-area:Apertura;position:relative;}
.Texto {grid-area:Texto;height:100%;padding-top:1rem;}

.Apertura p.bajada {color: var(--gris-900);font-size: 21px;font-weight: 300;line-height: 1.3;margin-bottom: 12px;}
.Apertura h4 a, .widget li h1 a {text-decoration:none}
.Apertura h1 {font-weight: var(--titulares-weight);letter-spacing: var(--titulares-space);color: var(--titulares-color);line-height: var(--titulares-line);margin: 0;}

.Texto p{font-weight: var(--lectura-weight); color: var(--gris-700);font-size: 18px;margin: 0 0 1rem;line-height: var(--lectura-line);}
.Texto p strong {color: #000;font-weight: bold;}

/* Desktop */
@media (min-width: 768px) {
	.columna[size_x="1"] h1{font-size: 1rem}
	.columna[size_x="2"] h1,.columna[size_x="3"] h1{ font-size: 1.2rem}
	.columna[size_x="4"] h1,.columna[size_x="5"] 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;}
	
	/* lectura */
	.grid-container {
	  display: grid;
	  grid-template-columns: 360px 2fr 3fr 2fr 360px; /* 2026 */
	  grid-auto-rows: min-content !important;
	  grid-template-areas:
		"Aside0 Aside0 Aside0 Aside0 Aside0"
		"Apertura Apertura Apertura Apertura Ultimas"
		"Texto Texto Texto Texto Aside1"
		"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;
		gap:2rem;
	}
	.Apertura h1{font-size: 2.5rem;}
	.Texto {max-width: 720px;margin: 0 auto;}
}

/* Mobile */
@media (max-width: 767px) {
	h1{font-size: 1.4rem;}
	h1 a{text-shadow:none !important;}
}

/* volantas */
.columna h4{font-weight:400;}
.columna h4 a{color:var(--color-entrante-02);}

/* normal (titulo arriba)*/
.normal article {background:var(--color-saliente-01);box-shadow: var(--sombra-suave);}
.normal .contenido {padding: var(--modulo) var(--calle);row-gap: 0;}
.normal .contenido *{margin-top:0;}
.normal h1 {order:2}
.normal h1 a{color:var(--color-entrante-04);}
.normal h4{order: 1; font-weight:400;}
.normal figure::before {border-left: 40px solid transparent;border-top: 20px solid var(--gris-800);}
.normal h4 span.volanta{display:none;}

/* opinion (titulo abajo)*/
.opinion article {border-radius: var(--calle);}
.opinion article {position: relative;flex-direction: column-reverse;}
.opinion article figure {order:1;overflow: hidden;position: relative;}
.opinion .contenido *{margin:0;}
.opinion .contenido {display: flex;order: 0;flex-direction: column-reverse;padding: var(--calle);row-gap: .35rem; position: relative;background: var(--color-entrante-01);}
.opinion .contenido h1 {order: 2;top: 4px;position: relative;}
.opinion .contenido p{color:var(--gris-50); order:1;}

.opinion .signature {position: absolute;top: var(--modulo);  left: var(--modulo);}
.opinion h1 a{color: #fff;text-shadow: var(--sombra-texto);}
.opinion h4 {position: absolute;z-index: 1;left: 0;top: -20px;color:var(--gris-100);}
.opinion h4 a{color: var(--gris-50);}
.columna.opinion h4 {padding: var(--modulo);background: var(--color-entrante-02); padding-right:26px;clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%);}
.columna.opinion h4 span.seccion{padding-right:var(--modulo);}