html {
margin-top: 0 !important;
scroll-behavior: smooth;
overflow-x: clip;
}
:focus-visible {
outline: 3px solid var(--color-amarillo);
}
body {
margin: 0;
padding: 0;
padding-top: 80px;
overflow-x: clip;
background-color: var(--color-blanco-hueso);
}
.oculto-visualmente {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip-path: inset(50%);
white-space: nowrap;
border: 0;
}
.cargando__mensaje {
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-500);
font-weight: 500;
color: var(--color-azul-verde-oscuro);
margin: 0 auto;
text-align: center;
}
:root {
--color-blanco: #ffffff;
--color-negro: #000000;
--color-rojo: #FF5631;
--color-azul-verde-oscuro: #14313A;
--color-amarillo: #FFBB10;
--color-violeta: #64264D;
--color-blanco-hueso: #FFFCF0;
--color-naranja: #FF9429;
--color-azul: #73A8EA;
--color-gris-claro: #f7f7f7;
--color-gris: #EFEFE5;
--color-gris-oscuro: #606160;
--color-agregar: #2ECC71;
--color-editar: #3498DB;
--color-eliminar: #E74C3C;
--fs-1400: clamp(4.5rem, 9vw, 5rem);
--fs-1300: clamp(4rem, 7.5vw, 4.5rem);
--fs-1200: clamp(3.5rem, 6vw, 4rem);
--fs-1100: clamp(3rem, 5vw, 3.5rem);
--fs-1000: clamp(2.25rem, 4vw, 3rem);
--fs-900: clamp(1.8rem, 3.6vw, 2.2rem);
--fs-800: clamp(1.75rem, 3vw, 2rem);
--fs-700: clamp(1.5rem, 2.6vw, 1.75rem);
--fs-600: clamp(1.25rem, 2vw, 1.5rem);
--fs-500: clamp(1.125rem, 1.6vw, 1.25rem);
--fs-400: clamp(1rem, 1.3vw, 1.125rem);
--fs-300: clamp(0.95rem, 1.1vw, 1rem);
--fs-200: clamp(0.8rem, 0.9vw, 0.875rem);
--fs-100: clamp(0.7rem, 0.75vw, 0.75rem);
--hero-ease: cubic-bezier(.2,.8,.2,1);
--hero-dur: 3000ms;
}
@font-face {
font-family: 'Elza Text';
src:
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/elza-text-light.woff2) format('woff2'),
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/elza-text-light.woff) format('woff'),
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/elza-text-light.otf) format('opentype');
font-weight: 300; font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Elza Text';
src:
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/elza-text-regular.woff2) format('woff2'),
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/elza-text-regular.woff) format('woff'),
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/elza-text-regular.otf) format('opentype');
font-weight: 400; font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Elza Text';
src:
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/elza-text-medium.woff2) format('woff2'),
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/elza-text-medium.woff) format('woff'),
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/elza-text-medium.otf) format('opentype');
font-weight: 500; font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Elza Text';
src:
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/elza-text-semibold.woff2) format('woff2'),
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/elza-text-semibold.woff) format('woff'),
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/elza-text-semibold.otf) format('opentype');
font-weight: 600; font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Elza Text';
src:
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/elza-text-bold.woff2) format('woff2'),
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/elza-text-bold.woff) format('woff'),
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/elza-text-bold.otf) format('opentype');
font-weight: 700; font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Moranga';
src:
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/moranga-light.woff2) format('woff2'),
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/moranga-light.woff) format('woff'),
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/moranga-light.otf) format('opentype');
font-weight: 300; font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Moranga';
src:
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/moranga-medium.woff2) format('woff2'),
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/moranga-medium.woff) format('woff'),
url(https://trees.uniandes.edu.co/wp-content/themes/trees/assets/fonts/moranga-medium.otf) format('opentype');
font-weight: 500; font-style: normal;
font-display: swap;
}.menu__color-inicio,
.menu__color-divulgacion,
.menu__color-trees-en-medios,
.menu__color-especiales,
.menu__color-blog,
.menu__color-oportunidades-y-eventos,
.menu__color-repositorio-publicaciones {
--color-fondo: var(--color-violeta);
--color-texto: var(--color-blanco);
--color-resaltado: var(--color-amarillo);
--color-fondo-secundario: var(--color-gris);
--color-texto-secundario: var(--color-azul-verde-oscuro);
--color-resaltado-secundario: var(--color-amarillo);
}
.menu__color-quienes-somos {
--color-fondo: var(--color-rojo);
--color-texto: var(--color-blanco);
--color-resaltado: var(--color-azul-verde-oscuro);
--color-fondo-secundario: var(--color-gris);
--color-texto-secundario: var(--color-azul-verde-oscuro);
--color-resaltado-secundario: var(--color-amarillo);
}
.menu__color-investigacion,
.menu__color-repositorio-investigaciones {
--color-fondo: var(--color-naranja);
--color-texto: var(--color-blanco);
--color-resaltado: var(--color-azul-verde-oscuro);
--color-fondo-secundario: var(--color-gris);
--color-texto-secundario: var(--color-azul-verde-oscuro);
--color-resaltado-secundario: var(--color-amarillo);
}
.menu__color-enseñanza,
.menu__color-banco-de-recursos {
--color-fondo: var(--color-azul);
--color-texto: var(--color-blanco);
--color-resaltado: var(--color-azul-verde-oscuro);
--color-fondo-secundario: var(--color-gris);
--color-texto-secundario: var(--color-azul-verde-oscuro);
--color-resaltado-secundario: var(--color-amarillo);
}
.menu {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 10;
height: 80px;
padding: 0 30px;
display: flex;
justify-content: space-between;
align-items: center;
background-color: var(--color-fondo);
box-sizing: border-box;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
.menu__logotipos {
display: flex;
align-items: center;
width: clamp(200px, 60vw, 250px);
text-decoration: none;
}
.menu__logotipos svg { --color-figura: var(--color-texto); }
.menu__logotipos:hover svg,
.menu__logotipos:focus-visible svg {
--color-figura: var(--color-texto);
}
.menu__logotipos:focus-visible {
outline: 2px solid var(--color-resaltado);
outline-offset: 4px;
}
.menu__logotipos-borde {
width: 2px;
height: clamp(35px, 12vw, 45px);
background-color: var(--color-texto);
margin-left: 5px;
margin-right: 10px;
}
.menu__lista {
display: flex;
padding: 0;
margin: 0;
}
.menu__lista-elemento {
position: relative;
padding: 0 15px;
display: flex;
justify-content: center;
white-space: nowrap;
list-style: none;
}
.menu__lista-elemento:not(:last-child) {
border-right: 2px solid var(--color-resaltado);
}
.menu__lista-elemento a,
.menu__lista-elemento button,
.menu__lista-elemento span {
padding: 0;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-400);
font-weight: 400;
color: var(--color-texto);
transition: color 0.3s ease;
text-decoration: none;
border: none;
cursor: pointer;
background-color: transparent;
-webkit-tap-highlight-color: transparent;
}
.menu__lista-elemento a:hover,
.menu__lista-elemento a:focus-visible,
.menu__lista-elemento button:hover,
.menu__lista-elemento button:focus-visible {
color: var(--color-resaltado);
}
.menu__contenedor-elemento-sublista {
display: flex;
align-items: center;
gap: 5px;
}
.menu__contenedor-flechas {
display: flex;
}
.menu__flecha {
width: 10px;
margin-top: 2.5px;
--color-figura: var(--color-texto);
transition: opacity 0.4s ease, transform 0.4s ease;
}
.menu__flecha:hover,
.menu__flecha:focus-visible {
--color-figura: var(--color-resaltado);
}
.menu__flecha-abajo {
position: absolute;
}
.menu__flecha-abajo,
.menu__sublista_abierta .menu__flecha-arriba { 
opacity: 1;
transform: scale(1);
}
.menu__flecha-arriba,
.menu__sublista_abierta .menu__flecha-abajo { 
opacity: 0;
transform: scale(0);
}
.menu__sublista {
position: absolute;
top: 35px;
padding: 0 20px;
opacity: 0;
visibility: hidden;
max-height: 0;
pointer-events: none;
background-color: var(--color-fondo-secundario);
transition: max-height 0.4s ease, opacity 0.3s ease, visibility 0.3s ease;
}
.menu__sublista::before {
content: "";
position: absolute;
top: -15px;
left: 0;
width: 100%;
height: 15px;
background-color: transparent;
}
.menu__sublista_abierta .menu__sublista {
opacity: 1;
visibility: visible;
max-height: 500px;
pointer-events: auto;
}
.menu__sublista-elemento {
padding: 10px 5px;
list-style: none;
display: flex;
align-items: center;
gap: 5px;
background-color: var(--color-fondo-secundario);
}
.menu__sublista-elemento:not(:last-child) {
border-bottom: 2px solid var(--color-fondo);
}
.menu__sublista-elemento a {
width: fit-content;
color: var(--color-texto-secundario);
}
.menu__sublista-elemento a:hover,
.menu__sublista-elemento a:focus-visible {
color: var(--color-resaltado-secundario);
}
.menu__sublista-elemento-svg { 
width: 25px;
} .menu__hamburguesa {
display: none;
}
@media (max-width: 1500px) {
.menu {
transition: transform 0.35s ease;
will-change: transform;
}
.menu.menu--oculto {
transform: translateY(-100%);
}
.menu:focus-within {
transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
.menu {
transition: none;
}
}
.menu__hamburguesa {
display: flex;
position: relative;
flex-direction: column;
justify-content: space-around;
margin-left: auto;
flex: 0 0 auto;
width: 30px;
height: 25px;
background: transparent;
border: none;
cursor: pointer;
padding: 0;
z-index: 12;
}
.menu__hamburguesa span {
height: 3px;
background-color: var(--color-texto);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.menu__hamburguesa.menu__movil-abierto span:nth-child(1) {
transform: translateY(8.5px) rotate(45deg);
}
.menu__hamburguesa.menu__movil-abierto span:nth-child(2) {
opacity: 0;
transform: translateX(20px);
}
.menu__hamburguesa.menu__movil-abierto span:nth-child(3) {
transform: translateY(-8.5px) rotate(-45deg);
}
.menu__nav {
position: fixed;
top: 0;
right: 0;
height: 100dvh;
width: fit-content;
max-width: 100vw;
transform: translateX(100%);
transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
background-color: var(--color-fondo);
box-shadow: -4px 0 20px rgba(0, 0, 0, 0.3);
box-sizing: border-box;
overflow-x: hidden;
overflow-y: auto;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
z-index: 11;
}
.menu__nav.menu__movil-abierto { 
transform: translateX(0);
}
.menu__lista {
flex-direction: column;
padding: 80px 30px 0 30px;
}
.menu__lista-elemento {
padding: 15px 0;
flex-direction: column;
border-right: none !important;
border-bottom: 2px solid var(--color-resaltado);
}
.menu__lista-elemento:last-child {
border-bottom: none;
}
.menu__contenedor-elemento-sublista {
width: 100%;
justify-content: space-between;
}
.menu__contenedor-flechas {
flex: 1 1 auto;
margin-left: 10px;
padding-right: 2px;
justify-content: flex-end;
align-items: center;
}
.menu__sublista_abierta {
display: flex;
flex-direction: column;
gap: 10px;
}
.menu__sublista {
padding: 0;
padding-top: 0;
position: static;
overflow: hidden;
transform-origin: top;
transition: opacity 0.25s ease, visibility 0.25s ease;
}
.menu__sublista-elemento {
padding: 10px;
}
.menu__sublista-elemento a,
.menu__contenedor-flechas,
.menu__hamburguesa {
-webkit-tap-highlight-color: transparent;
}
}
.menu__lista a[aria-current="page"] {
color: var(--color-resaltado);
font-weight: 600;
}
.menu__sublista a[aria-current="page"] {
color: var(--color-resaltado-secundario) !important;
font-weight: 600;
}
.menu__sublista[data-no-translation] a[aria-current="page"],
.menu__sublista[data-no-translation] a[aria-current="page"]:hover,
.menu__sublista[data-no-translation] a[aria-current="page"]:focus-visible,
.menu__sublista[data-no-translation] a[aria-current="page"]:active {
color: var(--color-texto-secundario) !important;
}
.menu__sublista[data-no-translation] a.is-disabled-current-lang,
.menu__sublista[data-no-translation] a.is-disabled-current-lang:hover,
.menu__sublista[data-no-translation] a.is-disabled-current-lang:focus-visible,
.menu__sublista[data-no-translation] a.is-disabled-current-lang:active {
color: var(--color-texto-secundario) !important;
pointer-events: none;
cursor: default;
}
.redes-sociales__lista {
display: none;
}
.menu__color-quienes-somos + .redes-sociales__lista {
display: none;
}
@media (min-width: 1501px) {
.redes-sociales__lista {
position: fixed;
top: 100px;
right: 20px;
z-index: 9;
margin: 0;
padding: 0;
list-style: none;
display: flex;
flex-direction: column;
gap: 5px;
}
.menu__color-quienes-somos + .redes-sociales__lista {
display: none;
}
.redes-sociales__lista a {
display: inline-flex;
padding: 7px;
background-color: var(--color-gris);
border: 2.4px solid var(--color-azul-verde-oscuro);
border-radius: 5px;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.redes-sociales__lista a:hover,
.redes-sociales__lista a:focus-visible {
transform: scale(1.15);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.redes-sociales__lista a:active {
transform: scale(1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
opacity: 0.5;
}
.redes-sociales__lista svg {
display: block;
width: 23px;
height: 23px;
overflow: visible;
--color-figura: var(--color-azul-verde-oscuro);
}
}.footer {
margin-top: 80px;
display: flex;
justify-content: center;
align-items: center;
padding: 30px 0;
background-color: var(--color-azul-verde-oscuro);
}
.footer-contenedor {
display: flex;
flex-direction: column;
gap: 30px;
padding: 0 60px;
max-width: 500px;
}
.footer-contenedor-2 {
border-left: 2px solid var(--color-rojo);
border-right: 2px solid var(--color-rojo);
}
@media (max-width: 1500px) and (min-width: 901px) {
.footer { flex-wrap: wrap; }
.footer-contenedor-2 { border-right: none; }
.footer-contenedor-3 { margin-top: 60px; }
}
@media (max-width: 900px) {
.footer {
flex-direction: column;
padding: 0 30px;
}
.footer-contenedor {
padding: 30px 0;
width: 100%;
}
.footer-contenedor-1 { border-bottom: 2px solid var(--color-rojo); }
.footer-contenedor-2 {
border-right: none;
border-left: none;
align-items: center;
}
.footer-contenedor-3 { border-top: 2px solid var(--color-rojo); }
}
.footer-contenedor svg {
--color-figura: var(--color-blanco);
--color-figura-1: var(--color-blanco);
--color-figura-2: var(--color-blanco);
--color-figura-3: var(--color-blanco);
--color-figura-secundario: var(--color-blanco);
--color-letras: var(--color-blanco)
}
.footer-contenedor address {
font-style: normal;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-300);
font-weight: 400;
color: var(--color-blanco);
}
.footer-contenedor h3 {
margin: 0;
color: var(--color-rojo);
}
.footer-contenedor a {
color: var(--color-blanco);
transition: color 0.25s ease;
}
.footer-contenedor a:hover,
.footer-contenedor a:focus-visible {
color: var(--color-amarillo);
}
.footer-contenedor p {
margin: 0 auto;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-300);
font-weight: 400;
color: var(--color-blanco);
}
.footer-logos {
display: flex;
justify-content: center;
align-items: center;
}
.footer-svg-uniandes,
.footer-svg-cede,
.footer-svg-trees {
width: 200px;
}
.footer-borde-uniandes-facultad {
width: 1.5px;
height: 75px;
background-color: var(--color-blanco);
}
.footer-svg-facultad-economia {
padding-left: 10px;
width: 140px;
}
.footer-redes-sociales {
margin: auto;
padding: 0;
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 20px;
list-style: none;
}
.footer-redes-sociales a {
display: inline-flex;
border: 3px solid var(--color-blanco);
border-radius: 10px;
padding: 10px;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.footer-redes-sociales a:hover,
.footer-redes-sociales a:focus-visible {
transform: scale(1.1);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.footer-redes-sociales a:active {
transform: scale(1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
opacity: 0.5;
}
.footer-redes-sociales svg {
width: 20px;
height: 20px;
}.suscribirse__primer-contenedor {
width: 100%;
}
.suscribirse__franja {
padding: 80px 0;
clip-path: polygon(
0 clamp(10%, 4vw, 30%),
100% 0,
100% 100%,
0 calc(100% - clamp(10%, 4vw, 25%)));
background-color: var(--color-azul-verde-oscuro);
transition: clip-path 0.45s ease;
}
.suscribirse__franja.suscribirse__franja--expandida {
clip-path: polygon(
0 clamp(3%, 3vw, 30%),
100% 0,
100% 100%,
0 calc(100% - clamp(3%, 3vw, 25%)));
}
.suscribirse__contenido {
margin: auto;
padding: 0 30px;
display: flex;
justify-content: center;
align-items: center;
gap: 30px;
max-width: 730px;
text-align: right;
}
.suscribirse-1__contenido { text-align: left; }
.suscribirse-2__contenido { text-align: right; }
.suscribirse-2__contenido button { order: 1; }
.suscribirse-2__contenido > div { order: 2; }
@media (max-width: 700px) {
.suscribirse__contenido {
flex-direction: column;
text-align: center;
align-items: center;
}
.suscribirse__contenido button { order: 2; }
.suscribirse__contenido > div { order: 1; }
}
.suscribirse__contenido h2 {
margin: 0px;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-600);
font-weight: 700;
color: var(--color-rojo);
}
.suscribirse__contenido p {
margin: 0px;
margin-top: 5px;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-500);
font-weight: 500;
color: var(--color-blanco);
}
.suscribirse__contenido button {
padding: 10px 20px;
white-space: nowrap;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-500);
font-weight: 600;
color: var(--color-blanco);
background-color: var(--color-rojo);
border: none;
border-radius: 13px;
cursor: pointer;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.suscribirse__contenido button:hover,
.suscribirse__contenido button:focus-visible {
transform: scale(1.1);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.suscribirse__contenido button:active {
transform: scale(1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
opacity: 0.5;
}
.suscribirse__segundo-contenedor {
display: flex;
justify-content: center;
gap: 70px;
padding: 0 30px;
max-height: 0px;
visibility: hidden;
transition: max-height 0.5s ease;
}
.suscribirse__segundo-contenedor.visible {
margin-top: 40px;
max-height: 1000px;
visibility: visible;
}   
.suscribirse__recurso {
max-width: 320px;            
display: flex;
flex-direction: column;
--suscribirse-h3-color: var(--color-amarillo);
opacity: 0;
transform: translateY(-30px);
transition: opacity 0.5s ease, transform 0.5s ease;
transition-delay: 0s;
}
.suscribirse__recurso:nth-child(1) { --suscribirse-h3-color: var(--color-naranja); }
.suscribirse__recurso:nth-child(2) { --suscribirse-h3-color: var(--color-azul); }
.suscribirse__recurso:nth-child(3) { --suscribirse-h3-color: var(--color-rojo); }
.suscribirse__segundo-contenedor.visible .suscribirse__recurso {
opacity: 1;
transform: translateY(0);
}
.suscribirse__segundo-contenedor.visible .suscribirse__recurso:nth-child(1)  { transition-delay: 0s; }
.suscribirse__segundo-contenedor.visible .suscribirse__recurso:nth-child(2)  { transition-delay: 0.25s; }
.suscribirse__segundo-contenedor.visible .suscribirse__recurso:nth-child(3)  { transition-delay: 0.5s; }
@media (max-width: 900px) {
.suscribirse__segundo-contenedor {
flex-direction: column;
gap: 30px;
}
.suscribirse__recurso { max-width: 100%; }
}
.suscribirse__figura-1 { --color-figura: var(--color-naranja); width: 100px; }
.suscribirse__figura-2 { --color-figura: var(--color-azul); width: 100px; }
.suscribirse__figura-3 { --color-figura: var(--color-rojo); width: 100px; }
.suscribirse__recurso h3 {
margin: 0px;
margin-top: 10px;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-500);
font-weight: 700;
color: var(--suscribirse-h3-color);
}
.suscribirse__recurso p {
margin: 0px;
margin-top: 15px;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-400);
font-weight: 400;
color: var(--color-gris);
}
.suscribirse__resaltado {
font-weight: 700;
color: var(--color-blanco-hueso);
}
.suscribirse__boton {
display: block;
width: fit-content;
white-space: nowrap;
margin-top: 20px;
padding: 10px 10px;
text-decoration: none;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-300);
font-weight: 600;
color: var(--color-blanco);
background-color: var(--color-rojo);
border-radius: 10px;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.suscribirse__boton:hover,
.suscribirse__boton:focus-visible {
transform: scale(1.1);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.suscribirse__boton:active {
transform: scale(1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
opacity: 0.5;
}.dialog {
padding: 0;
width: min(720px, calc(100% - 40px));
border: 5px solid var(--color-azul-verde-oscuro);
background-color: var(--color-gris-claro);
}
.dialog::backdrop {
background: rgba(0,0,0,.45);
}
.dialog-formulario {
padding: 20px;
}
.dialog-titulo {
margin: 0;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-500);
font-weight: 600;
color: var(--color-azul-verde-oscuro);
}
.dialog-seccion {
margin-top: 15px;
display: flex;
flex-wrap: wrap;
gap: 15px;
}
.dialog-seccion > div {
display: flex;
flex-direction: column;
gap: 5px;
min-width: 0;
}
.dialog-label {
display: block;
font-family: 'Elza Text', serif;
font-size: var(--fs-300);
font-weight: 400;
color: var(--color-azul-verde-oscuro);
}
.dialog-input {
padding: 0 10px;
font-family: 'Elza Text', serif;
font-size: var(--fs-200);
font-weight: 300;
color: var(--color-azul-verde-oscuro);
box-sizing: border-box;
border: 2px solid var(--color-azul-verde-oscuro);
min-height: 45px;
}
.dialog-input-image {
padding: 10px;
font-family: 'Elza Text', serif;
font-size: var(--fs-200);
font-weight: 300;
color: var(--color-azul-verde-oscuro);
box-sizing: border-box;
border: 2px solid var(--color-azul-verde-oscuro);
background-color: var(--color-blanco);
display: flex;
align-items: center;
justify-content: center;
min-height: 45px;
}
.dialog-imagen-preview {
margin-top: 15px;
border: 2px dashed var(--color-azul-verde-oscuro);
padding: 5px;
box-sizing: border-box;
}
.dialog-imagen-preview img {
display: block;
object-fit: contain;
width: 100%;
height: auto;
}
.dialog-textarea {
min-height: 100px;
max-height: 200px;
padding: 12px 10px;
font-family: 'Elza Text', serif;
font-size: var(--fs-200);
font-weight: 300;
color: var(--color-azul-verde-oscuro);
resize: vertical;
box-sizing: border-box;
border: 2px solid var(--color-azul-verde-oscuro);
}
.dialog-select {
padding: 0 10px;
font-family: 'Elza Text', serif;
font-size: var(--fs-200);
font-weight: 700;
color: var(--color-azul-verde-oscuro);
border: 2px solid var(--color-azul-verde-oscuro);
min-height: 45px;
}
.dialog-menu {
margin: 20px 0 0 0;
display: flex;
gap: 10px;
justify-content: flex-end;
}
.dialog-boton {
padding: 8px 10px;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-200);
font-weight: 600;
color: var(--color-azul-verde-oscuro);
cursor: pointer;
border: 2px solid var(--color-azul-verde-oscuro);
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.dialog-boton:hover,
.dialog-boton:focus-visible {
transform: scale(1.15);
}
.dialog-boton:active {
transform: scale(1);
opacity: 0.5;
}
.dialog-boton-cancelar {
background: var(--color-gris);
color: var(--color-azul-verde-oscuro);
}
.dialog-boton-guardar {
background: var(--color-rojo);
color: var(--color-blanco);
}
.dialog-mensaje {
margin: 20px 0 0 0;
font-family: 'Elza Text', serif;
font-size: var(--fs-300);
font-weight: 600;
opacity: 0;
}
.dialog-mensaje[data-type="1"] {
color: var(--color-azul-verde-oscuro);
opacity: 1;
}
.dialog-mensaje[data-type="2"] {
color: var(--color-rojo);
opacity: 1;
}
.dialog-embed__primera-seccion > div:nth-child(1) { flex: 1 1 auto; }  .dialog-medio__primera-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-medio__primera-seccion > div:nth-child(2) { flex: 1 1 auto; }
.dialog-medio__segunda-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-medio__tercera-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-medio__tercera-seccion > div:nth-child(2) { flex: 1 1 auto; }
.dialog-medio__cuarta-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-medio__imagen-preview {
width: min(125px, 100%);
}
.dialog-comunidad-investigacion__primera-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-comunidad-investigacion__segunda-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-comunidad-investigacion__segunda-seccion > div:nth-child(2) { flex: 1 1 auto; }
.dialog-comunidad-investigacion__tercera-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-comunidad-investigacion__cuarta-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-comunidad-investigacion__imagen-preview {
width: min(400px, 100%);
}
.dialog-investigacion__primera-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-investigacion__primera-seccion > div:nth-child(2) { flex: 3 1 auto; }
.dialog-investigacion__segunda-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-investigacion__segunda-seccion > div:nth-child(2) { flex: 3 1 auto; }
.dialog-investigacion__tercera-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-investigacion__cuarta-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-investigacion__cuarta-seccion > div:nth-child(2) { flex: 1 1 auto; }
.dialog-investigacion__quinta-seccion > div:nth-child(1) { flex: 1 1 auto; } 
.dialog-investigacion__imagen-preview {
width: min(400px, 100%);
}
.dialog-recurso__primera-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-recurso__primera-seccion > div:nth-child(2) { flex: 1 1 auto; }
.dialog-recurso__segunda-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-recurso__segunda-seccion > div:nth-child(2) { flex: 1 1 auto; }
.dialog-recurso__tercera-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-recurso__tercera-seccion > div:nth-child(2) { flex: 1 1 auto; }
.dialog-recurso__tercera-seccion > div:nth-child(3) { flex: 1 1 auto; }
.dialog-recurso__cuarta-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-recurso__quinta-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-recurso__sexta-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-recurso__imagen-preview {
width: min(400px, 100%);
}
.dialog-publicacion__primera-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-publicacion__primera-seccion > div:nth-child(2) { flex: 3 1 auto; }
.dialog-publicacion__segunda-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-publicacion__segunda-seccion > div:nth-child(2) { flex: 1 1 auto; }
.dialog-publicacion__tercera-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-publicacion__tercera-seccion > div:nth-child(2) { flex: 1 1 auto; }
.dialog-publicacion__cuarta-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-publicacion__quinta-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-publicacion__sexta-seccion > div:nth-child(1) { flex: 1 1 auto; }
.dialog-publicacion__septima-seccion > div:nth-child(1) { flex: 1 1 auto; }.trees-medios {
--trees-medios-list-max-width: 1000px;
--trees-medios-filters-max-width: 850px;
--trees-medios-card-width: 250px;
--trees-medios-card-gap: 50px;
--trees-medios-image-height: 125px;
--trees-medios-button-bg: var(--color-azul-verde-oscuro);
--trees-medios-date-clip: polygon(2% 0, 100% 0, 98% 100%, 0 100%);
--trees-medios-date-radius: 0;
}
.trees-medios__filtros {
max-width: var(--trees-medios-filters-max-width);
padding: 0 20px;
margin: 28px auto 0;
display: flex;
justify-content: center;
gap: 12px;
flex-wrap: wrap;
}
.trees-medios__filtro {
padding: 7px 10px;
border: 1px solid var(--color-azul-verde-oscuro);
border-radius: 5px;
cursor: pointer;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-300);
font-weight: 600;
color: var(--color-azul-verde-oscuro);
background-color: var(--color-blanco);
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.08);
transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}
.trees-medios__filtro span {
color: var(--color-rojo);
}
.trees-medios__filtro:hover,
.trees-medios__filtro:focus-visible {
transform: translateY(-2px);
box-shadow: 0 10px 18px rgba(0, 0, 0, 0.12);
}
.trees-medios__filtro.is-active {
color: var(--color-blanco);
background-color: var(--color-azul-verde-oscuro);
box-shadow: 0 10px 18px rgba(0, 0, 0, 0.18);
}
.trees-medios__filtro.is-active span {
color: var(--color-amarillo);
}
.trees-medios__listado {
padding: 0 20px;
margin: 50px auto;
display: flex;
justify-content: center;
gap: var(--trees-medios-card-gap);
flex-wrap: wrap;
max-width: var(--trees-medios-list-max-width);
}
.trees-medios__elemento {
position: relative;
width: var(--trees-medios-card-width);
display: flex;
flex-direction: column;
gap: 10px;
}
.trees-medios__elemento picture {
order: 1;
display: block;
width: auto;
max-width: 100%;
height: var(--trees-medios-image-height);
align-self: flex-start;
}
.trees-medios__elemento picture img,
.trees-medios__elemento img {
display: block;
width: auto;
max-width: 100%;
height: var(--trees-medios-image-height);
object-fit: contain;
object-position: center;
border: 1px solid var(--color-azul-verde-oscuro);
}
.trees-medios__elemento-fecha {
order: 2;
margin: 10px 0 5px;
padding: 5px 10px;
background-color: var(--color-rojo);
width: fit-content;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-400);
font-weight: 500;
color: var(--color-blanco);
clip-path: var(--trees-medios-date-clip);
border-radius: var(--trees-medios-date-radius);
}
.trees-medios__elemento-titulo {
order: 3;
margin: 0;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-400);
font-weight: 500;
}
.trees-medios__elemento-titulo a,
.trees-medios__elemento-titulo a:link,
.trees-medios__elemento-titulo a:visited,
.trees-medios__elemento-titulo a:hover,
.trees-medios__elemento-titulo a:focus-visible {
transition: color 0.25s ease;
color: var(--color-gris-oscuro);
}
.trees-medios__elemento-titulo a:hover,
.trees-medios__elemento-titulo a:focus-visible {
color: var(--color-amarillo);
}
.trees-medios__elemento-icono-redireccion {
width: 0.78em;
height: 0.78em;
margin-left: 0.18em;
vertical-align: middle;
--color-figura: currentColor;
display: none;
}
.trees-medios__elemento-fuente {
order: 4;
margin: 0;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-400);
font-weight: 600;
color: var(--color-violeta);
transform: skew(-5deg);
display: inline-block;
}
.trees-medios__boton-principal,
.trees-medios__cta {
display: block;
width: fit-content;
margin: 0 auto;
padding: 10px 20px;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-500);
font-weight: 600;
color: var(--color-blanco);
background-color: var(--trees-medios-button-bg);
border-radius: 10px;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
text-decoration: none;
}
.trees-medios__boton-principal {
border: none;
cursor: pointer;
}
.trees-medios__boton-principal:hover,
.trees-medios__boton-principal:focus-visible,
.trees-medios__cta:hover,
.trees-medios__cta:focus-visible {
transform: scale(1.1);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.trees-medios__boton-principal:active,
.trees-medios__cta:active {
transform: scale(1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
opacity: 0.5;
}
.trees-medios__boton-principal--oculto {
display: none;
}
.trees-medios__botones-admin {
margin: 20px auto 0;
display: flex;
gap: 8px;
width: fit-content;
}
.trees-medios__botones-admin > button:nth-child(1) { background: var(--color-agregar); }
.trees-medios__botones-admin > button:nth-child(2) { background: var(--color-editar); }
.trees-medios__botones-admin > button:nth-child(3) { background: var(--color-eliminar); }
.trees-medios__botones-admin button {
width: 40px;
height: 40px;
border: 3px solid var(--color-gris-claro);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.trees-medios__botones-admin button:hover,
.trees-medios__botones-admin button:focus-visible {
transform: scale(1.15);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.trees-medios__botones-admin button:active {
transform: scale(1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
opacity: 0.5;
}
.trees-medios__botones-admin button:disabled {
transform: scale(1);
opacity: 0.3;
cursor: not-allowed;
}
.trees-medios__botones-admin button svg {
width: 20px;
--color-figura: var(--color-blanco);
}
.trees-medios__seleccionar {
position: absolute;
left: -10px;
top: -10px;
}
.trees-medios__seleccionar input {
width: 25px;
height: 25px;
cursor: pointer;
}
@media (max-width: 640px) {
.trees-medios__filtros {
gap: 10px;
}
.trees-medios__filtro {
width: 100%;
max-width: 260px;
text-align: center;
}
}.trees-separador {
position: relative;
display: grid;
width: 100%;
max-width: 1400px;
margin: auto;
}
.trees-separador--izquierdo { grid-template-columns: auto 1fr; }
.trees-separador--derecho { grid-template-columns: 1fr auto; }
.trees-separador::before {
content: "";
position: absolute;
width: 100vw;
height: 100%;
}
.trees-separador--izquierdo::before { left: 100%; }
.trees-separador--derecho::before { right: 100%; }
.trees-separador__franja {
grid-row: 1;
}
.trees-separador--izquierdo .trees-separador__franja {
grid-column: 2 / 3;
margin-left: -30px;
clip-path: polygon(
101% 0,
0 clamp(15%, 4vw, 30%),
0 calc(100% - clamp(15%, 4vw, 25%)),
101% 100%
);
}
.trees-separador--derecho .trees-separador__franja {
grid-column: 1 / 2;
margin-right: -35px;
clip-path: polygon(
-1px 0,
100% clamp(15%, 4vw, 30%),
100% calc(100% - clamp(15%, 4vw, 25%)),
-1px 100%
);
}
.trees-separador__triangulos {
grid-row: 1;
z-index: 1;
height: 100%;
}
.trees-separador--izquierdo .trees-separador__triangulos {
grid-column: 1 / 2;
padding-left: 20px;
}
.trees-separador--derecho .trees-separador__triangulos {
grid-column: 2 / 3;
padding-right: 20px;
}
.trees-separador__texto {
grid-column: 1 / 3;
grid-row: 1;
z-index: 1;
margin: auto;
padding: 50px 20px;
font-family: 'Moranga', serif;
font-size: var(--fs-900);
font-weight: 300;
text-align: center;
}
.trees-separador__texto svg {
margin-bottom: -2px;
width: clamp(95px, 20vw, 120px);
}
@media (max-width: 1000px) {
.trees-separador__franja {
grid-column: 1 / 3;
}
.trees-separador__triangulos {
display: none;
}
}.contenedor-tarjetas {
padding: 0 20px;
max-width: 1000px;
display: flex;
justify-content: center;
gap: 20px;
flex-wrap: wrap;
}
.tarjeta {
max-width: 300px;
height: 100%;
border-radius: 35px;
overflow: hidden;
display: flex;
flex-direction: column;
}
.tarjeta picture {
display: block;
width: 100%;
height: 150px;
}
.tarjeta picture img,
.tarjeta img {
display: block;
width: 100%;
height: 150px;
object-fit: cover;
filter: grayscale(100%);
}
.tarjeta-info {
padding: 20px;
display: flex;
flex-direction: column;
gap: 10px;
}
.tarjeta-titulo {
margin: 0;
font-family: 'Moranga', serif;
font-size: var(--fs-400);
font-weight: 300;
line-height: 1.1;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 4;
line-clamp: 4;
overflow: hidden;
min-height: calc(4 * 1.1em);
}
.tarjeta-separador {
width: 100%;
height: 1.5px;
}
.tarjeta-autores {
margin: 0;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-300);
font-weight: 500;
min-height: calc(4 * 1.2em);
}
.tarjeta-autores span {
display: block;
}
.tarjeta-descripcion {
margin: 0 0 10px;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-300);
font-weight: 400;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 5;
line-clamp: 5;
overflow: hidden;
min-height: calc(5 * 1.2em);
}
.tarjeta-boton {
display: block;
width: fit-content;
margin: auto auto 0;
padding: 10px 20px;
text-decoration: none;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-200);
font-weight: 600;
border-radius: 10px;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.tarjeta-boton:hover,
.tarjeta-boton:focus-visible {
transform: scale(1.1);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.tarjeta-boton:active {
transform: scale(1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
opacity: 0.5;
}.inicio-kjh {
margin-top: 50px;
}
.inicio-kjh__diseño-escritorio {
display: grid;
grid-template-columns: 100%;
grid-template-rows: 30% 68% 2%;
}
.inicio-kjh__franja {
grid-column: 1;
grid-row: 2;
clip-path: polygon(
100% clamp(10%, 4vw, 27%),
0 0,
0 100%,
100% calc(100% - clamp(10%, 4vw, 30%)));
background-color: var(--color-gris);
}
.inicio-kjh__contenido {
grid-column: 1;
grid-row: 1 / span 3;
z-index: 1;
display: flex;
justify-content: center;
gap: 30px;
}
.inicio-kjh__mapa {
max-height: 400px;
--color-figura: var(--color-rojo);
--color-figura-secundario: var(--color-violeta);
}
.inicio-kjh__texto {
display: grid;
grid-template-rows: 30% 68% 2%;
}
.inicio-kjh__trees {
max-width: 220px;
--color-figura: var(--color-rojo);
}
.inicio-kjh__titulo {
margin: 0;
margin-top: 5px;
width: fit-content;
margin-left: 10px;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-300);
font-weight: 500;
color: var(--color-rojo);
}
.inicio-kjh__descripcion {
grid-row: 2;
margin: auto 0;
max-width: 800px;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-500);
font-weight: 500;
color: var(--color-azul-verde-oscuro);
}
.inicio-kjh__diseño-movil {
display: none;
}
@media (max-width: 1200px) {
.inicio-kjh__diseño-escritorio {
display: none;
}
.inicio-kjh__diseño-movil {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: auto 1fr;
row-gap: 20px;
}
.inicio-kjh__contenedor-titulo {
grid-column: 1;
grid-row: 1;
margin: auto;
padding: 0 30px;
width: min(800px, 100%);
display: flex;
align-items: center;
gap: 5px;
}
.inicio-kjh__diseño-movil .inicio-kjh__mapa{
display: block;
max-height: 100px;
}
.inicio-kjh__diseño-movil .inicio-kjh__trees {
max-width: 150px;
}
.inicio-kjh__diseño-movil .inicio-kjh__titulo {
font-size: var(--fs-200);
}
.inicio-kjh__diseño-movil .inicio-kjh__franja {
grid-column: 1;
grid-row: 2;
}
.inicio-kjh__diseño-movil .inicio-kjh__descripcion {
grid-column: 1;
grid-row: 2;
z-index: 1;
margin: auto;
padding: 60px 30px;
}
} .inicio-kjh__diseño-escritorio,
.inicio-kjh__diseño-movil{
opacity: 0;
}
.inicio-kjh__franja{
opacity: 0;
transform: translateY(18px);
}
.inicio-kjh__mapa{
opacity: 0;
transform: translateX(-18px) scale(.98);
}
.inicio-kjh__contenedor-titulo{
opacity: 0;
transform: translateY(-16px);
}
.inicio-kjh__descripcion{
opacity: 0;
transform: translateY(16px);
}
.inicio-kjh.is-hero-ready .inicio-kjh__diseño-escritorio,
.inicio-kjh.is-hero-ready .inicio-kjh__diseño-movil{
opacity: 1;
transition: opacity 400ms var(--hero-ease);
}
.inicio-kjh.is-hero-ready .inicio-kjh__diseño-escritorio .inicio-kjh__franja{
opacity: 1;
transform: none;
transition: opacity var(--hero-dur) var(--hero-ease), transform var(--hero-dur) var(--hero-ease);
transition-delay: 120ms;
}
.inicio-kjh.is-hero-ready .inicio-kjh__diseño-escritorio .inicio-kjh__mapa{
opacity: 1;
transform: none;
transition: opacity var(--hero-dur) var(--hero-ease), transform var(--hero-dur) var(--hero-ease);
transition-delay: 160ms;
}
.inicio-kjh.is-hero-ready .inicio-kjh__diseño-escritorio .inicio-kjh__contenedor-titulo{
opacity: 1;
transform: none;
transition: opacity var(--hero-dur) var(--hero-ease), transform var(--hero-dur) var(--hero-ease);
transition-delay: 220ms;
}
.inicio-kjh.is-hero-ready .inicio-kjh__diseño-escritorio .inicio-kjh__descripcion{
opacity: 1;
transform: none;
transition: opacity var(--hero-dur) var(--hero-ease), transform var(--hero-dur) var(--hero-ease);
transition-delay: 320ms;
}
@media (max-width: 1200px) {
.inicio-kjh.is-hero-ready .inicio-kjh__diseño-movil .inicio-kjh__contenedor-titulo{
opacity: 1;
transform: none;
transition: opacity var(--hero-dur) var(--hero-ease), transform var(--hero-dur) var(--hero-ease);
transition-delay: 120ms;
}
.inicio-kjh.is-hero-ready .inicio-kjh__diseño-movil .inicio-kjh__franja{
opacity: 1;
transform: none;
transition: opacity var(--hero-dur) var(--hero-ease), transform var(--hero-dur) var(--hero-ease);
transition-delay: 220ms;
}
.inicio-kjh.is-hero-ready .inicio-kjh__diseño-movil .inicio-kjh__mapa{
opacity: 1;
transform: none;
transition: opacity var(--hero-dur) var(--hero-ease), transform var(--hero-dur) var(--hero-ease);
transition-delay: 140ms;
}
.inicio-kjh.is-hero-ready .inicio-kjh__diseño-movil .inicio-kjh__descripcion{
opacity: 1;
transform: none;
transition: opacity var(--hero-dur) var(--hero-ease), transform var(--hero-dur) var(--hero-ease);
transition-delay: 300ms;
}
}
@media (prefers-reduced-motion: reduce) {
.inicio-kjh__diseño-escritorio,
.inicio-kjh__diseño-movil,
.inicio-kjh__franja,
.inicio-kjh__mapa,
.inicio-kjh__contenedor-titulo,
.inicio-kjh__descripcion{
transition: none !important;
transform: none !important;
opacity: 1 !important;
}
}.inicio-carrusel {
width: min(900px, 100%);
margin: auto;
margin-top: 80px;
}
.inicio-carrusel__titulo {
margin: 0 0 10px 0;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-600);
font-weight: 500;
padding: 5px 20px;
color: var(--color-blanco);
background-color: var(--color-rojo);
clip-path: polygon(4% 0, 100% 0, 96% 100%, 0% 100%);
width: fit-content;
}
.inicio-carrusel__area{
position: relative;
}
.inicio-carrusel__ventana {
position: relative;
width: 100%;
aspect-ratio: 16 / 9;
overflow: visible;
}
.inicio-carrusel__clip {
width: 100%;
height: 100%;
overflow: hidden;
}
.cinta {
display: flex;
width: 100%;
height: 100%;
transition: transform .55s ease;
}
.inicio-carrusel__destacado {
flex: 0 0 100%;
height: 100%;
}
.inicio-carrusel__destacado picture {
width: 100%;
height: 100%;
display: block;
}
.inicio-carrusel__destacado picture .inicio-carrusel__img,
.inicio-carrusel__img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.inicio-carrusel__flecha,
.inicio-carrusel__indicador {
margin: 0;
cursor: pointer;
padding: 0;
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.inicio-carrusel__flecha {
position: absolute;
top: 50%;
z-index: 11;
width: clamp(24px, 4.2vw, 28px);
height: clamp(24px, 4.2vw, 28px);
border-radius: 50%;
border: none;
background: transparent;
appearance: none;
background: rgba(255, 252, 240);
display: inline-flex;
align-items: center;
justify-content: center;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.2);
transform: translateY(-50%);
opacity: 0.8;
}
.inicio-carrusel__flecha:not(:disabled):hover,
.inicio-carrusel__flecha:not(:disabled):focus-visible {
transform: translateY(-50%) scale(1.1);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.25);
}
.inicio-carrusel__indicador:hover,
.inicio-carrusel__indicador:focus-visible {
transform: scale(1.15);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.34), 0 12px 22px rgba(0, 0, 0, 0.22);
}
.inicio-carrusel__flecha:not(:disabled):active {
transform: translateY(-50%) scale(1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
opacity: 0.7;
}
.inicio-carrusel__indicador:active {
transform: scale(1);
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.32), 0 9px 18px rgba(0, 0, 0, 0.2);
opacity: 0.5;
}
.inicio-carrusel__indicador {
border: none;
background: var(--color-gris);
appearance: none;
}
.inicio-carrusel__flecha svg {
width: 40%;
height: 40%;
display: block;
--color-figura: var(--color-azul-verde-oscuro);
pointer-events: none;
overflow: visible;
filter: none;
}
.inicio-carrusel__flecha:disabled {
opacity: 0.35;
cursor: not-allowed;
pointer-events: none;
}
.inicio-carrusel__flecha:disabled svg {
filter: grayscale(1) opacity(0.7);
}
.inicio-carrusel__flecha-izquierda { left: 20px; }
.inicio-carrusel__flecha-derecha { right: 20px; }
.inicio-carrusel__flecha-izquierda svg { padding-right: 2px; }
.inicio-carrusel__flecha-derecha svg { padding-left: 2px; }
.inicio-carrusel__contenido {
position: absolute;
left: clamp(62%, 76vw, 84%);
right: auto;
transform: translateX(-45%);
bottom: -100px;
display: grid;
width: clamp(400px, 60vw, 450px);
z-index: 8;
}
.inicio-carrusel__contenido-svg {
grid-area: 1 / 1;
width: 100%;
height: auto;
display: block;
--color-figura: var(--color-azul-verde-oscuro);
}
.inicio-carrusel__contenido-texto {
grid-area: 1 / 1;
margin: auto;
text-align: center;
width: clamp(200px, 35vw, 280px);
padding-right: 30px;
}
.inicio-carrusel__subtitulo {
margin: 0;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-300);
font-weight: 500;
color: var(--color-blanco);
}
.inicio-carrusel__fecha {
margin: 0;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-300);
font-weight: 700;
color: var(--color-blanco);
}
.inicio-carrusel__leer-mas {
display: inline-block;
margin: 0;
margin-top: 10px;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-300);
font-weight: 700;
color: var(--color-amarillo);
text-decoration: underline;
text-underline-offset: 2px;
transition: color 0.25s ease;
}
.inicio-carrusel__leer-mas:hover,
.inicio-carrusel__leer-mas:focus-visible {
color: var(--color-rojo);
}
.inicio-carrusel__indicadores {
position: absolute;
left: 50%;
bottom: clamp(5px, 1vw, 14px);
transform: translateX(-50%);
z-index: 3;
display: flex;
justify-content: center;
align-items: center;
gap: 5px;
opacity: 0.8;
}
.inicio-carrusel__puntos {
display: flex;
gap: 5px;
}
.inicio-carrusel__indicador {
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--color-blanco-hueso);
}
.inicio-carrusel__indicador[aria-current="true"] {
background: var(--color-azul-verde-oscuro);
}
@media (max-width: 1100px) {
.inicio-carrusel__titulo {
margin: 0 0 10px 10px;
}
.inicio-carrusel__area {
display: flex;
flex-direction: column;
}
.inicio-carrusel__ventana {
order: 1;
}
.inicio-carrusel__contenido {
order: 2;
position: static;
left: auto;
right: auto;
transform: none;
display: block;
width: 100%;
margin-top: 0;
background: var(--color-azul-verde-oscuro);
}
.inicio-carrusel__contenido-svg {
display: none;
}
.inicio-carrusel__contenido-texto {
width: 100%;
margin: 0;
padding: 14px 16px 16px;
text-align: left;
}
.inicio-carrusel__leer-mas { margin-top: 0px; }
.inicio-carrusel__indicadores {
order: 3;
position: static;
left: auto;
bottom: auto;
transform: none;
margin: 12px auto 0;
display: flex;
}
.inicio-carrusel__indicador {
background: var(--color-gris);
}
.inicio-carrusel__indicador[aria-current="true"] {
background: var(--color-azul-verde-oscuro);
}
.inicio-carrusel__flecha-izquierda { left: 7px; }
.inicio-carrusel__flecha-derecha { right: 7px; }
}.inicio-red {
margin-top: 130px;
}
@media (max-width: 1100px) {
.inicio-red {
margin-top: 80px;
}
}
.inicio-red__titulo::before,
.inicio-red__titulo-franja {
background-color: var(--color-rojo);
}
.inicio-red__titulo-triangulos {
--color-triangulo-izquierdo: var(--color-azul-verde-oscuro);
--color-triangulo-medio: var(--color-rojo);
--color-triangulo-derecho: var(--color-violeta);
}
.inicio-red__titulo-texto {
color: var(--color-blanco);
}
.inicio-red__contenido {
--inicio-red-card-width: 340px;
margin: 60px auto 0;
max-width: 1100px;
min-height: 320px;
padding: 0 20px;
display: flex;
justify-content: center;
gap: 20px;
flex-wrap: wrap;
}
.inicio-red__publicacion-wrap {
position: relative;
flex: 0 1 var(--inicio-red-card-width);
width: var(--inicio-red-card-width);
max-width: 100%;
}
.inicio-red__publicacion-wrap > div {
width: 100%;
}
.inicio-red__publicacion-wrap .twitter-tweet,
.inicio-red__publicacion-wrap .twitter-timeline,
.inicio-red__publicacion-wrap iframe {
display: block;
width: 100% !important;
max-width: 100%;
border: 0;
}
.inicio-red__publicacion-wrap iframe[src*="linkedin.com"] {
height: 842px;
}
.inicio-red__acciones {
display: flex;
gap: 8px;
margin-top: 10px;
width: 100%;
}
.inicio-red__acciones[hidden] {
display: none;
}
.inicio-red__accion {
flex: 1 1 0;
min-width: 0;
display: inline-grid;
grid-template-columns: 18px minmax(0, auto);
align-items: center;
justify-content: center;
column-gap: 8px;
padding: 10px 12px;
border-radius: 6px;
text-decoration: none;
font-family: 'Elza Text', sans-serif;
font-size: 0.875rem;
font-weight: 700;
line-height: 1.1;
color: var(--color-blanco);
background: var(--color-azul-verde-oscuro);
box-shadow: 0 5px 12px rgba(0, 0, 0, 0.16);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.inicio-red__accion:hover,
.inicio-red__accion:focus-visible {
transform: translateY(-1px);
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}
.inicio-red__accion:active {
transform: translateY(0);
opacity: 0.72;
}
.inicio-red__accion svg {
width: 18px;
height: 18px;
flex: 0 0 auto;
display: block;
align-self: center;
justify-self: center;
--color-figura: currentColor;
}
.inicio-red__accion span {
display: block;
align-self: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.inicio-red__accion--linkedin {
background: #0a66c2;
}
.inicio-red__accion--x {
background: #111111;
}
.inicio-red__editar {
position: absolute;
top: -10px;
right: -10px;
width: 35px;
height: 35px;
padding: 5px;
background: var(--color-rojo);
border: 3px solid var(--color-blanco);
cursor: pointer;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.inicio-red__editar:hover,
.inicio-red__editar:focus-visible {
transform: scale(1.15);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.inicio-red__editar:active {
transform: scale(1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
opacity: 0.5;
}
.inicio-red__editar svg {
--color-figura: var(--color-blanco);
}.inicio-gqr {
margin-top: 80px;
}
.inicio-gqr__titulo::before,
.inicio-gqr__titulo-franja {
background-color: var(--color-amarillo);
}
.inicio-gqr__titulo-triangulos {
--color-triangulo-izquierdo: var(--color-azul-verde-oscuro);
--color-triangulo-medio: var(--color-rojo);
--color-triangulo-derecho: var(--color-azul-verde-oscuro);
}
.inicio-gqr__titulo-texto { color: var(--color-azul-verde-oscuro); }
.inicio-gqr__titulo-texto svg { --color-figura: var(--color-azul-verde-oscuro); }
.inicio-gqr__componentes {
margin-top: 50px;
padding: 0 20px;
display: flex;
justify-content: center;
gap: 20px;
flex-wrap: wrap;
}
.inicio-gqr__componente {
max-width: 300px;
display: block;
position: relative;
border-radius: 35px;
overflow: hidden;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.inicio-gqr__componente:hover,
.inicio-gqr__componente:focus-visible {
transform: scale(1.05);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.inicio-gqr__componente:active {
transform: scale(1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
opacity: 0.5;
}
.inicio-gqr__borde-amarillo { border: 5px solid var(--color-amarillo); }
.inicio-gqr__borde-azul { border: 5px solid var(--color-azul); }
.inicio-gqr__borde-morado { border: 5px solid var(--color-violeta); }
.inicio-gqr__componente h3 {
position: absolute;
left: 50%;
transform: translate(-50%, 0);
margin: auto;
font-family: 'Moranga', serif;
font-size: var(--fs-800);
font-weight: 300;
background-color: var(--color-blanco-hueso);
width: 100%;
text-align: center;
}
.inicio-gqr__titulo-investigacion {
top: 65%;
color: var(--color-amarillo);
}
.inicio-gqr__titulo-enseñanza {
top: 40%;
color: var(--color-azul);
}
.inicio-gqr__titulo-divulgacion {
top: 15%;
color: var(--color-violeta);
}
.inicio-gqr__componente img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}.inicio-wef {
margin-top: 80px;
}
.inicio-wef__titulo::before,
.inicio-wef__titulo-franja {
background-color: var(--color-naranja);
}
.inicio-wef__titulo-triangulos {
--color-triangulo-izquierdo: var(--color-azul-verde-oscuro);
--color-triangulo-medio: var(--color-naranja);
--color-triangulo-derecho: var(--color-azul-verde-oscuro);
}
.inicio-wef__titulo-texto { color: var(--color-azul-verde-oscuro); }
.inicio-wef__investigaciones { margin: 60px auto; }
.inicio-wef__investigacion { background-color: var(--color-naranja); }
.inicio-wef__investigacion-titulo { color: var(--color-azul-verde-oscuro); }
.inicio-wef__investigacion-separador { background-color: var(--color-azul-verde-oscuro); }
.inicio-wef__investigacion-autores { color: var(--color-blanco); }
.inicio-wef__investigacion-descripcion { color: var(--color-azul-verde-oscuro); }
.inicio-wef__investigacion-boton {
color: var(--color-blanco);
background-color: var(--color-azul-verde-oscuro);
}
.inicio-wef__boton-principal {
display: block;
width: fit-content;
margin: auto;
padding: 10px 20px;
text-decoration: none;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-500);
font-weight: 600;
color: var(--color-blanco);
background-color: var(--color-azul-verde-oscuro);            
border-radius: 10px;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.inicio-wef__boton-principal:hover,
.inicio-wef__boton-principal:focus-visible {
transform: scale(1.1);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.inicio-wef__boton-principal:active {
transform: scale(1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
opacity: 0.5;
}.inicio-reg {
margin-top: 80px;
}
.inicio-reg__titulo::before,
.inicio-reg__titulo-franja {
background-color: var(--color-azul);
}
.inicio-reg__titulo-triangulos {
--color-triangulo-izquierdo: var(--color-azul-verde-oscuro);
--color-triangulo-medio: var(--color-azul);
--color-triangulo-derecho: var(--color-azul-verde-oscuro);
}
.inicio-reg__titulo-texto { color: var(--color-azul-verde-oscuro); }
.inicio-reg__recursos {
margin: 60px auto;
min-height: 420px;
}
.inicio-reg__recurso { background-color: var(--color-azul); }
.inicio-reg__recurso-titulo { color: var(--color-azul-verde-oscuro); }
.inicio-reg__recurso-separador { background-color: var(--color-azul-verde-oscuro); }
.inicio-reg__recurso-autores { color: var(--color-blanco); }
.inicio-reg__recurso-descripcion { color: var(--color-azul-verde-oscuro); }
.inicio-reg__recurso-boton {
color: var(--color-blanco);
background-color: var(--color-azul-verde-oscuro);
}
.inicio-reg__boton-principal {
display: block;
width: fit-content;
margin: auto;
padding: 10px 20px;
text-decoration: none;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-500);
font-weight: 600;
color: var(--color-blanco);
background-color: var(--color-azul-verde-oscuro);            
border-radius: 10px;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.inicio-reg__boton-principal:hover,
.inicio-reg__boton-principal:focus-visible {
transform: scale(1.1);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.inicio-reg__boton-principal:active {
transform: scale(1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
opacity: 0.5;
}.inicio-qms {
margin-top: 80px;
}
.inicio-qms__titulo::before,
.inicio-qms__titulo-franja {
background-color: var(--color-violeta);
}
.inicio-qms__titulo-triangulos {
--color-triangulo-izquierdo: var(--color-rojo);
--color-triangulo-medio: var(--color-violeta);
--color-triangulo-derecho: var(--color-rojo);
}
.inicio-qms__titulo-texto { color: var(--color-blanco); }
.inicio-qms__lista-recursos {
margin: 60px 0;
padding: 0 20px;
display: flex;
justify-content: center;
gap: 20px;
flex-wrap: wrap;
}
.inicio-qms__recurso {
max-width: 300px;
display: block;
position: relative;
border-radius: 35px;
border: 5px solid var(--color-rojo);
overflow: hidden;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.inicio-qms__recurso:hover,
.inicio-qms__recurso:focus-visible {
transform: scale(1.05);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.inicio-qms__recurso:active {
transform: scale(1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
opacity: 0.5;
}
.inicio-qms__recurso h3 {
position: absolute;
left: 50%;
top: 4%;
transform: translate(-50%, 0);
margin: 0;
font-family: 'Moranga', serif;
font-size: var(--fs-700);
font-weight: 300;
color: var(--color-blanco);
display: flex;
flex-direction: column;
align-items: center;
gap: 5px;
}
.inicio-qms__recurso span {
padding: 0px 20px;
clip-path: polygon(5% 0, 100% 0, 95% 100%, 0% 100%);
background-color: var(--color-rojo);
width: fit-content;
}
.inicio-qms__recurso img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.inicio-qms__boton-principal {
display: block;
margin: auto;
padding: 10px 20px;
width: fit-content;
text-decoration: none;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-500);
font-weight: 600;
color: var(--color-blanco);
background-color: var(--color-rojo);
border-radius: 10px;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.inicio-qms__boton-principal:hover,
.inicio-qms__boton-principal:focus-visible {
transform: scale(1.1);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.inicio-qms__boton-principal:active {
transform: scale(1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
opacity: 0.5;
}.inicio-eko {
margin-top: 80px;
}
.inicio-eko__titulo::before,
.inicio-eko__titulo-franja {
background-color: var(--color-azul-verde-oscuro);
}
.inicio-eko__titulo-triangulos {
--color-triangulo-izquierdo: var(--color-rojo);
--color-triangulo-medio: var(--color-azul-verde-oscuro);
--color-triangulo-derecho: var(--color-amarillo);
}
.inicio-eko__titulo-texto { color: var(--color-blanco); }
.inicio-eko__componentes {
display: flex;
justify-content: center;
align-items: center;
margin: 42px auto 0;
padding: 0 20px;
}
.inicio-eko__componente {
position: relative;
display: flex;
align-items: center;
justify-content: center;
--inicio-eko-componente-max-width: 450px;
--inicio-eko-componente-aspect-ratio: 1 / 1;
width: min(100%, var(--inicio-eko-componente-max-width));
aspect-ratio: var(--inicio-eko-componente-aspect-ratio);
--inicio-eko-componente-offset-x: 0px;
--inicio-eko-triangulo-color: var(--color-azul);
--inicio-eko-texto-color: var(--color-azul-verde-oscuro);
transform: translateX(var(--inicio-eko-componente-offset-x));
}
.inicio-eko__componente--izquierdo {
--inicio-eko-componente-max-width: 380px;
--inicio-eko-componente-aspect-ratio: 696 / 584;
--inicio-eko-componente-offset-x: 100px;
--inicio-eko-contenido-offset-x: -75px;
--inicio-eko-contenido-offset-y: -50px;
}
.inicio-eko__componente--medio {
--inicio-eko-componente-max-width: 450px;
--inicio-eko-componente-aspect-ratio: 924 / 538;
--inicio-eko-componente-offset-x: 0px;
--inicio-eko-contenido-offset-x: 0px;
--inicio-eko-contenido-offset-y: -10px;
}
.inicio-eko__componente--derecho {
--inicio-eko-componente-max-width: 380px;
--inicio-eko-componente-aspect-ratio: 876 / 843;
--inicio-eko-componente-offset-x: -100px;
--inicio-eko-contenido-offset-x: 0px;
--inicio-eko-contenido-offset-y: -55px;
}
.inicio-eko__componente[data-tipo="investigacion"] {
--inicio-eko-triangulo-color: var(--color-naranja);
--inicio-eko-texto-color: var(--color-azul-verde-oscuro);
}
.inicio-eko__componente[data-tipo="ensenanza"] {
--inicio-eko-triangulo-color: var(--color-azul);
--inicio-eko-texto-color: var(--color-azul-verde-oscuro);
}
.inicio-eko__componente[data-tipo="divulgacion"] {
--inicio-eko-triangulo-color: var(--color-violeta);
--inicio-eko-texto-color: var(--color-blanco);
}
.inicio-eko__componente-triangulo {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
fill: var(--inicio-eko-triangulo-color);
transition: fill 420ms ease;
}
.inicio-eko__componente-contenido {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 8px;
max-width: 210px;
text-align: center;
color: var(--inicio-eko-texto-color);
opacity: 1;
transform: translate(
var(--inicio-eko-contenido-offset-x, 0px),
var(--inicio-eko-contenido-offset-y, 0px)
);
transition: color 420ms ease, opacity 280ms ease, transform 280ms ease;
}
.inicio-eko__componente-icono {
width: 34px;
height: 34px;
flex-shrink: 0;
--color-figura: currentColor;
}
.inicio-eko__componente-titulo,
.inicio-eko__componente-texto {
margin: 0;
font-family: "Elza Text", sans-serif;
}
.inicio-eko__componente-titulo {
font-size: var(--fs-500);
font-weight: 600;
line-height: 1;
}
.inicio-eko__componente-texto {
font-size: var(--fs-400);
font-weight: 400;
line-height: 1.08;
opacity: 1;
transition: opacity 280ms ease;
}
.inicio-eko__componente.is-transitioning .inicio-eko__componente-contenido {
opacity: 0;
}
@media (max-width: 900px) {
.inicio-eko__componentes {
flex-wrap: wrap;
}
.inicio-eko__componente {
width: min(100%, 300px);
}
}
@media (max-width: 700px) {
.inicio-eko__componentes {
margin-top: 32px;
}
.inicio-eko__componente {
width: min(100%, 280px);
}
.inicio-eko__componente-contenido {
max-width: 188px;
}
.inicio-eko__componente-icono {
width: 30px;
height: 30px;
}
}
@media (prefers-reduced-motion: reduce) {
.inicio-eko__componente-triangulo,
.inicio-eko__componente-contenido,
.inicio-eko__componente-texto {
transition: none !important;
}
}.inicio-qam {
margin-top: 80px;
--trees-medios-button-bg: var(--color-rojo);
--trees-medios-date-clip: polygon(3% 0, 100% 0, 97% 100%, 0 100%);
--trees-medios-date-radius: 0;
}
.inicio-qam__titulo::before,
.inicio-qam__titulo-franja {
background-color: var(--color-rojo);
}
.inicio-qam__titulo-triangulos {
--color-triangulo-izquierdo: var(--color-azul-verde-oscuro);
--color-triangulo-medio: var(--color-rojo);
--color-triangulo-derecho: var(--color-violeta);
}
.inicio-qam__titulo-texto {
color: var(--color-blanco);
}
.inicio-qam__titulo-texto svg {
--color-figura: var(--color-blanco);
}
.inicio-qam__texto {
max-width: 700px;
margin: 50px auto 0;
padding: 0 30px;
font-family: 'Elza Text', serif;
font-size: var(--fs-600);
font-weight: 500;
color: var(--color-azul-verde-oscuro);
text-align: center;
}.inicio-ame {
margin-top: 80px;
}
.inicio-ame__titulo::before,
.inicio-ame__titulo-franja {
background-color: var(--color-violeta);
}
.inicio-ame__titulo-triangulos {
--color-triangulo-izquierdo: var(--color-rojo);
--color-triangulo-medio: var(--color-violeta);
--color-triangulo-derecho: var(--color-rojo);
}
.inicio-ame__titulo-texto { color: var(--color-blanco); }
.inicio-ame__titulo-texto svg { --color-figura: var(--color-blanco); }
.inicio-ame__disclaimer {
margin: auto;
margin-top: 50px;
padding: 0 30px;
font-family: 'Elza Text', serif;
font-size: var(--fs-400);
font-weight: 500;
color: var(--color-gris-oscuro);
text-align: center;
}
.inicio-ame__resultados {
margin-top: 40px;
}
.inicio-ame__resultado {
display: flex;
margin: auto;
justify-content: center;
align-items: center;
padding: 30px;
gap: 40px;
}
.inicio-ame__resultado img {
width: 200px;
height: 100%;
object-fit: contain;
display: block;
}
@media (max-width: 650px) {
.inicio-ame__resultado {
flex-direction: column;
}
.inicio-ame__resultado img {
width: 150px;
}
.inicio-ame__resultado picture { order: 1; }
.inicio-ame__resultado .inicio-ame__texto { order: 2; }
}
.inicio-ame__texto {
max-width: 650px;
}
.inicio-ame__texto h3 {
margin: 0;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-700);
font-weight: 500;
color: var(--color-blanco);
text-align: center;
display: inline-block;
padding: 0px 20px;
clip-path: polygon(2% 0, 100% 0, 98% 100%, 0% 100%);
}
.inicio-ame__texto  ul {
list-style: none;
padding: 0;
}
.inicio-ame__texto li {
margin: 0;
margin-top: 20px;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-500);
font-weight: 500;
color: var(--color-azul-verde-oscuro);
}
.inicio-ame__texto span {
font-size: var(--fs-600);
}
.inicio-ame__titulo-1 { background-color: var(--color-violeta); }
.inicio-ame__titulo-2 { background-color: var(--color-amarillo); }
.inicio-ame__titulo-3 { background-color: var(--color-azul); }
.inicio-ame__titulo-4 { background-color: var(--color-rojo); }
.inicio-ame__franja-gris { background-color: var(--color-gris); }
.inicio-ame__franja-gris:last-of-type {
position: relative;
}
.inicio-ame__franja-gris:last-of-type::after {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: -80px;
height: 80px;
background-color: var(--color-gris);
}.inicio-cza {
margin-top: 80px;
}
.inicio-cza__titulo::before,
.inicio-cza__titulo-franja {
background-color: var(--color-rojo);
}
.inicio-cza__titulo-triangulos {
--color-triangulo-izquierdo: var(--color-amarillo);
--color-triangulo-medio: var(--color-azul-verde-oscuro);
--color-triangulo-derecho: var(--color-rojo);
}
.inicio-cza__titulo-texto { color: var(--color-blanco); }
.html-inicio-cza__texto {
max-width: 800px;
margin: auto;
margin-top: 50px;
padding: 0 30px;
font-family: 'Elza Text', serif;
font-size: var(--fs-600);
font-weight: 500;
color: var(--color-azul-verde-oscuro);
text-align: center;
}
.html-inicio-cza__aliados {
padding: 0;
margin: 60px auto;
padding: 0 30px;
max-width: 1000px;
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 40px;
}
.html-inicio-cza__aliado {
flex: 0 1 200px;
display: flex;
justify-content: center;
align-items: center;
height: 60px;
}
.html-inicio-cza__aliado img {
max-width: 90%;
height: auto;
}
@media (max-width: 900px) {
.html-inicio-cza__aliados {
gap: 25px;
}
.html-inicio-cza__aliado {
flex-basis: 160px;
}
}
@media (max-width: 600px) {
.html-inicio-cza__aliados {
gap: 15px;
}
.html-inicio-cza__aliado {
flex-basis: 120px;
}
}
.inicio-cza-apoyo-ford {
display: grid;
margin: 0;
}
.inicio-cza-apoyo-ford__franja {
grid-area: 1 / 1;
clip-path: polygon(
0 clamp(15%, 4vw, 27%), 
100% 0, 
100% 100%, 
0 calc(100% - clamp(15%, 4vw, 30%)));
background-color: var(--color-gris);
}
.inicio-cza-apoyo-ford__texto {
grid-area: 1 / 1;
z-index: 1;
padding: clamp(60px, 5vw, 100px) 0;
display: flex;
justify-content: center;
align-items: center;
gap: 20px;
}
@media (max-width: 500px) {
.inicio-cza-apoyo-ford__texto {
flex-direction: column;
gap: 5px;
}
}
.inicio-cza-apoyo-ford__titulo {
margin: 0;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-600);
font-weight: 500;
color: var(--color-rojo);
}
.inicio-cza-apoyo-ford__svg-ford-foundation {
width: clamp(150px, 20vw, 250px);
--color-figura: var(--color-negro);
}.inicio-qle {
margin-top: 80px;
padding: 0 20px;
}
.inicio-qle__titulo {
margin: 0;
margin-bottom: 50px;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-800);
font-weight: 500;
color: var(--color-azul-verde-oscuro);
text-align: center;
}
.inicio-qle__svg-trees {
margin-bottom: -2px;
width: clamp(80px, 15vw, 100px);
--color-figura: var(--color-azul-verde-oscuro);
}
.inicio-qle__contenedor {
margin: auto;
padding: 30px clamp(20px, 6vw, 50px);
max-width: 700px;
background-color: var(--color-violeta);
border-radius: 20px;
}
.inicio-qle__subtitulo {
margin: 0;
margin-bottom: 20px;
text-align: center;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-600);
font-weight: 700;
color: var(--color-blanco);
}
.inicio-qle__fieldset {
border: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 20px;
}
.inicio-qle__fila {
display: flex;
gap: 20px;
}
@media (max-width: 800px) {
.inicio-qle__fila {
flex-direction: column;
}
}
.inicio-qle__div-input {
position: relative;
flex: 1;
display: flex;
flex-direction: column;
gap: 10px;
}
.inicio-qle__label-input {
padding-left: 10px;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-300);
font-weight: 500;
color: var(--color-blanco);
}
.inicio-qle__input,
.inicio-qle__select,
.inicio-qle__textarea {
width: 100%;
padding: 15px;
border-radius: 10px;
border: none;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-200);
font-weight: 400;
box-sizing: border-box;
}
.inicio-qle__textarea {
min-height: 100px;
resize: vertical;
}
.inicio-qle__boton {
margin: auto;
margin-top: 15px;
padding: 10px 20px;
font-family: 'Elza Text', sans-serif;
font-size: var(--fs-400);
font-weight: 600;
color: var(--color-blanco);
background: var(--color-rojo);
border-radius: 10px;
border: none;
cursor: pointer;
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.08);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.inicio-qle__boton:hover,
.inicio-qle__boton:focus-visible {
transform: scale(1.15);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.inicio-qle__boton:active {
transform: scale(1);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
opacity: 0.5;
}.trp-floating-switcher {
display: flex;
flex-direction: column-reverse;
position: fixed;
z-index: 99999;
overflow: hidden;
padding: var(--switcher-padding, 10px);
border: var(--border, none);
border-radius: var(--border-radius, 8px);
background: var(--bg, #fff);
width: var(--switcher-width, auto);
top: var(--top, unset);
right: var(--right, unset);
bottom: var(--bottom, unset);
left: var(--left, unset);
box-shadow: 0 10px 20px 0 #0000000D;
}
.trp-floating-switcher .trp-switcher-dropdown-list {
flex-direction: column-reverse;
}
.trp-switcher-position-top.trp-floating-switcher {
flex-direction: column;
top: var(--wp-admin--admin-bar--height, 0);
}
.trp-floating-switcher.trp-switcher-position-top:not(.trp-ls-inline) .trp-language-switcher-inner,
.trp-floating-switcher.trp-switcher-position-top .trp-switcher-dropdown-list {
flex-direction: column;
} nav.trp-ls-inline .trp-language-switcher-inner {
flex-direction: row;
}
.trp-ls-inline.trp-opposite-language .trp-language-item {
width: 100%;
} #trp-floater-powered-by {
color: var(--text, #b3b3b3);
font-size: 12px;
text-align: center;
padding: 0 5px;
opacity: 70%;
}
#trp-floater-powered-by a {
color: var(--text, #b3b3b3);
}
.trp-switcher-position-bottom #trp-floater-powered-by {
border-top: 1px solid var(--border-color, #747474);
padding-top: 5px;
margin-top: 5px;
}
.trp-switcher-position-top #trp-floater-powered-by {
border-bottom: 1px solid var(--border-color, #747474);
padding-bottom: 5px;
margin-bottom: 5px;
} .trp-shortcode-switcher__wrapper {
position: relative;
border: none;
}
.trp-shortcode-switcher {
position: static;
display: inline-block;
overflow: hidden;
padding: 10px 0;
border: var(--border, none);
border-radius: var(--border-radius, 5px);
background: var(--bg, #fff);
width: auto;
box-shadow: none;
} .trp-shortcode-anchor:not(.trp-opposite-button) {
visibility: hidden;
}
.trp-shortcode-switcher.trp-open-on-click {
cursor: pointer;
}
.trp-shortcode-overlay {
position: absolute;
left: 0;
top: 0;
z-index: 9999;
} .trp-current-language-item__wrapper:not(.trp-hide-arrow) {
display: flex;
align-items: center;
padding-right: 10px;
justify-content: space-between;
} .trp-language-switcher-inner {
display: flex;
}
.trp-floating-switcher .trp-language-switcher-inner {
flex-direction: column-reverse;
}
.trp-shortcode-switcher .trp-language-switcher-inner {
flex-direction: column;
}
.trp-switcher-dropdown-list {
display: flex;
overflow-y: hidden; transition: max-height 0.2s ease-in-out;
max-height: 0;
transition-duration: var(--transition-duration);
}
.trp-shortcode-switcher .trp-switcher-dropdown-list {
flex-direction: column;
} .trp-ls-dropdown.is-open .trp-switcher-dropdown-list,
.trp-ls-dropdown[aria-expanded="true"] .trp-switcher-dropdown-list,
.trp-shortcode-switcher.trp-open-on-hover.is-open .trp-switcher-dropdown-list,
.trp-shortcode-switcher[aria-expanded="true"] .trp-switcher-dropdown-list {
overflow-y: auto;
max-height: min(350px, 70vh);
-webkit-overflow-scrolling: touch;
scrollbar-width: thin;
scrollbar-color: var(--text) transparent;
}
.trp-ls-dropdown.is-transitioning .trp-switcher-dropdown-list,
.trp-shortcode-switcher.is-transitioning .trp-switcher-dropdown-list {
overflow-y: hidden !important;
}
.trp-shortcode-arrow {
pointer-events: none;
}
.trp-shortcode-switcher.is-open .trp-shortcode-arrow {
transform: rotate(180deg);
} .trp-language-item:focus { outline: none; }
.trp-language-item:focus-visible {
outline: 2px solid var(--text);
outline-offset: -2px;
} .trp-language-item {
display: flex;
align-items: center;
gap: 8px;
padding: 7px 16px;
text-decoration: none;
min-height: 19px;
box-sizing: content-box;
}
.trp-language-item:hover {
background: var(--bg-hover, #f3f3f3);
}
.trp-language-item:hover .trp-language-item-name {
color: var(--text-hover, #000);
}
.trp-language-item__current {
pointer-events: none;
cursor: default;
}
.trp-language-item-name {
display: inline-block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: var(--text, #000);
font-size: var(--font-size, 14px);
line-height: 1.2;
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
font-weight: 400;
}
.trp-flag-image {
border-radius: var(--flag-radius, 0) !important;
aspect-ratio: var(--aspect-ratio, 4/3) !important;
width: var(--flag-size, 18px) !important;
display: inline-block !important;
height: auto !important;
}
.trp-menu-ls-label .trp-flag-image {
margin: -2px 3px;
}
.trp-custom-flag {
object-fit: cover;
} .trp-switcher-dropdown-list::-webkit-scrollbar { width: 6px; }
.trp-switcher-dropdown-list::-webkit-scrollbar-track { background: transparent; }
.trp-switcher-dropdown-list::-webkit-scrollbar-thumb {
background-color: var(--text);
border-radius: 4px;
}
.trp-switcher-dropdown-list::-webkit-scrollbar-thumb:hover {
background-color: var(--text-hover);
} .trp-flag-rounded {
border-radius: 9999px !important;
aspect-ratio: 1 / 1 !important;
}
.trp-ls-name {
padding-left: 5px;
}
@media (prefers-reduced-motion: reduce) {
.trp-switcher-dropdown-list {
transition: none !important; }
} .trp_ald_ls_container img.trp-flag-image{
padding-top: 0 !important;
}
.trp_ald_ls_container .trp-language-switcher{
position: relative;
display: inline-block;
padding: 0;
border: 0;
box-sizing: border-box;
}
.trp_ald_ls_container .trp-language-switcher > div {
box-sizing: border-box;
padding-right: 20px;
padding-bottom: 3px;
padding-left: 13px;
border: 1px solid #c1c1c1;
border-radius: 3px;
background-color: #fff;
}
.trp_ald_ls_container .trp-language-switcher > div > a {
display: block;
padding: 2px;
border-radius: 3px;
color: rgb(7, 105, 173);
}
.trp_ald_ls_container .trp-language-switcher > div > a:hover {
background: #f1f1f1;
}
.trp_ald_ls_container .trp-language-switcher > div > a.trp-ls-shortcode-disabled-language {
cursor: default;
}
.trp_ald_ls_container .trp-language-switcher > div > a.trp-ls-shortcode-disabled-language:hover {
background: none;
}
.trp_ald_ls_container .trp-language-switcher > div > a > img{
display: inline;
margin: 0 3px;
width: 18px;
height: 12px;
border-radius: 0;
}
.trp_ald_ls_container .trp-language-switcher .trp-ls-shortcode-current-language{
display: inline-block;
}
.trp_ald_ls_container .trp-language-switcher:focus .trp-ls-shortcode-current-language,
.trp_ald_ls_container .trp-language-switcher:hover .trp-ls-shortcode-current-language{
visibility: hidden;
}
.trp_ald_ls_container .trp-language-switcher .trp-ls-shortcode-language{
display: inline-block;
height: 1px;
overflow: hidden;
visibility: hidden;
z-index: 1;
max-height: 250px;
overflow-y: auto;
left: 0;
top: 0;
min-height: auto;
}
.trp_ald_ls_container .trp-language-switcher:focus .trp-ls-shortcode-language,
.trp_ald_ls_container .trp-language-switcher:hover .trp-ls-shortcode-language{
visibility: visible;
max-height: 250px;
height: auto;
overflow-y: auto;
position: absolute;
left: 0;
top: 0;
display: inline-block !important;
min-height: auto;
}
#trp_ald_x_button{
z-index: 0 !important;
}