/* Base CSS
Lista de estilos:
01. Reset
02. Variables
03. Font sizes
04. Padding system
05. Container system
06. Iconos
07. Image cover
08. Animaciones
09. Preloader
10. Generales
11. Top
12. Footer
13. Notice
//--------------------------------------------------------------------- */

/* CSS RESET */
/*-------------------------------------------------------------------------------------------*/
*{margin:0;padding:0;border:0;box-sizing:border-box}html{font-size:100%;font-family:Arial,sans-serif}body{line-height:1;font-family:inherit;font-family:var(--font-family-principal);color:var(--color-principal)}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}button:focus,input:focus,textarea:focus{outline:0}a{text-decoration:none}ul.inline{font-size:0}ul.inline li{display:inline-block;vertical-align:top}.text-center{text-align:center}.abraxas{display:none!important;width:0!important;height:0!important;opacity:0!important;margin:0!important;padding:0!important}.hidden{display:none !important;}div.modulo .rte a{color:var(--color-teal);}div.modulo .rte a:hover{text-decoration:underline;}
div.item font { font-size: inherit !important; }

/* VARIABLES */
/*-------------------------------------------------------------------------------------------*/
:root {
	--font-family-principal: 'PT Sans', sans-serif;
	--font-family-secundaria: "Forza SSm A", "Forza SSm B", sans-serif;
	--font-size-80: 2.3rem;
	--font-size-72: 2rem;
	--font-size-64: 1.9rem;
	--font-size-56: 1.8rem;
	--font-size-48: 1.6rem;
	--font-size-40: 1.4rem;
	--font-size-36: 1.3rem;
	--font-size-32: 1.2rem;
	--font-size-28: 1.1rem;
	--font-size-24: 1rem;
	--font-size-20: .9rem;
	--font-size-18: .85rem;
	--font-size-14: 12px;
	--color-principal: #333;
	--color-clear: #dfecf2;
	--color-clear-2: #F5FCFF;
	--color-blanco: #fff;
	--color-teal: #14ABB2;
	--color-teal-2: #00d6f3;
	--color-blue: #2E598C;
	--color-dark-blue: #224066;
	--color-dark-blue-2: #264873;
	--color-gris-azulado: #455864;
	--color-gris-azulado-claro: #aec1cd;
	--color-rosa-claro: #ffe7e7;
	--gradient-main: linear-gradient(90deg, #14ABB2 17%, #2E598C 80%);
	--gradient-main-diagonal: linear-gradient(225deg, #14ABB2 17%, #2E598C 80%);
	--gradient-overlay-oscuro-diagonal: linear-gradient(45deg, #000000da 0, #3333331a 85%);
	--overlay-claro: rgba(255,255,255,.8);
}

/* FONT SIZES */
/*-------------------------------------------------------------------------------------------*/
.font-size-14 { font-size: calc(var(--font-size-14) * 1.2); line-height: 110%; }
.font-size-18 { font-size: calc(var(--font-size-18) * 1.2); line-height: 110%; }
.font-size-20 { font-size: var(--font-size-20); line-height: 110%; }
.font-size-24 { font-size: var(--font-size-24); line-height: 110%; }
.font-size-28 { font-size: var(--font-size-28); line-height: 110%; }
.font-size-32 { font-size: var(--font-size-32); line-height: 110%; }
.font-size-36 { font-size: var(--font-size-36); line-height: 110%; }
.font-size-40 { font-size: var(--font-size-40); line-height: 110%; }
.font-size-48 { font-size: var(--font-size-48); line-height: 110%; }
.font-size-56 { font-size: var(--font-size-56); line-height: 110%; }
.font-size-64 { font-size: var(--font-size-64); line-height: 110%; }
.font-size-72 { font-size: var(--font-size-72); line-height: 110%; }
.font-size-80 { font-size: var(--font-size-80); line-height: 110%; }

@media (min-width: 576px) {
    .font-size-14 { font-size: calc(var(--font-size-14) * 1.2); }
    .font-size-18 { font-size: calc(var(--font-size-18) * 1.2); }
    .font-size-20 { font-size: calc(var(--font-size-20) * 1.05); }
    .font-size-24 { font-size: calc(var(--font-size-24) * 1.05); }
    .font-size-28 { font-size: calc(var(--font-size-28) * 1.05); }
    .font-size-32 { font-size: calc(var(--font-size-32) * 1.05); }
    .font-size-36 { font-size: calc(var(--font-size-36) * 1.05); }
    .font-size-40 { font-size: calc(var(--font-size-40) * 1.05); }
    .font-size-48 { font-size: calc(var(--font-size-48) * 1.05); }
    .font-size-56 { font-size: calc(var(--font-size-56) * 1.05); }
    .font-size-64 { font-size: calc(var(--font-size-64) * 1.1); }
    .font-size-72 { font-size: calc(var(--font-size-72) * 1.1); }
    .font-size-80 { font-size: calc(var(--font-size-80) * 1.1); }
}

@media (min-width: 768px) {
    .font-size-14 { font-size: calc(var(--font-size-14) * 1.2); }
    .font-size-18 { font-size: calc(var(--font-size-18) * 1.1); }
    .font-size-20 { font-size: calc(var(--font-size-20) * 1.1); }
    .font-size-24 { font-size: calc(var(--font-size-24) * 1.1); }
    .font-size-28 { font-size: calc(var(--font-size-28) * 1.1); }
    .font-size-32 { font-size: calc(var(--font-size-32) * 1.1); }
    .font-size-36 { font-size: calc(var(--font-size-36) * 1.1); }
    .font-size-40 { font-size: calc(var(--font-size-40) * 1.1); }
    .font-size-48 { font-size: calc(var(--font-size-48) * 1.1); }
    .font-size-56 { font-size: calc(var(--font-size-56) * 1.1); }
    .font-size-64 { font-size: calc(var(--font-size-64) * 1.2); }
    .font-size-72 { font-size: calc(var(--font-size-72) * 1.2); }
    .font-size-80 { font-size: calc(var(--font-size-80) * 1.2); }
}

@media (min-width: 992px) {
    .font-size-14 { font-size: calc(var(--font-size-14) * 1.07); }
    .font-size-18 { font-size: calc(var(--font-size-18) * 1.2); }
    .font-size-20 { font-size: calc(var(--font-size-20) * 1.2); }
    .font-size-24 { font-size: calc(var(--font-size-24) * 1.2); }
    .font-size-28 { font-size: calc(var(--font-size-28) * 1.2); }
    .font-size-32 { font-size: calc(var(--font-size-32) * 1.2); }
    .font-size-36 { font-size: calc(var(--font-size-36) * 1.2); }
    .font-size-40 { font-size: calc(var(--font-size-40) * 1.2); }
    .font-size-48 { font-size: calc(var(--font-size-48) * 1.2); }
    .font-size-56 { font-size: calc(var(--font-size-56) * 1.2); }
    .font-size-64 { font-size: calc(var(--font-size-64) * 1.3); }
    .font-size-72 { font-size: calc(var(--font-size-72) * 1.3); }
    .font-size-80 { font-size: calc(var(--font-size-80) * 1.3); }
}

@media (min-width: 1200px) {
    .font-size-14 { font-size: calc(var(--font-size-14) * 1.1); }
    .font-size-18 { font-size: calc(var(--font-size-18) * 1.3); }
    .font-size-20 { font-size: calc(var(--font-size-20) * 1.3); }
    .font-size-24 { font-size: calc(var(--font-size-24) * 1.3); }
    .font-size-28 { font-size: calc(var(--font-size-28) * 1.3); }
    .font-size-32 { font-size: calc(var(--font-size-32) * 1.3); }
    .font-size-36 { font-size: calc(var(--font-size-36) * 1.3); }
    .font-size-40 { font-size: calc(var(--font-size-40) * 1.3); }
    .font-size-48 { font-size: calc(var(--font-size-48) * 1.3); }
    .font-size-56 { font-size: calc(var(--font-size-56) * 1.3); }
    .font-size-64 { font-size: calc(var(--font-size-64) * 1.4); }
    .font-size-72 { font-size: calc(var(--font-size-72) * 1.4); }
    .font-size-80 { font-size: calc(var(--font-size-80) * 1.4); }
}

/* PADDING */
/*-------------------------------------------------------------------------------------------*/
.padding-top-15 { padding-top: 15px; }
.padding-top-30 { padding-top: 30px; }
.padding-top-45 { padding-top: 45px; }
.padding-top-60 { padding-top: 60px; }
.padding-top-90 { padding-top: 90px; }
.padding-bottom-15 { padding-bottom: 15px; }
.padding-bottom-30 { padding-bottom: 30px; }
.padding-bottom-45 { padding-bottom: 45px; }
.padding-bottom-60 { padding-bottom: 60px; }
.padding-bottom-90 { padding-bottom: 90px; }

@media (min-width: 576px) {
    .padding-top-15 { padding-top: calc(15px * 1.1); }
    .padding-top-30 { padding-top: calc(30px * 1.1); }
    .padding-top-45 { padding-top: calc(45px * 1.1); }
    .padding-top-60 { padding-top: calc(60px * 1.1); }
    .padding-top-90 { padding-top: calc(90px * 1.1); }
    .padding-bottom-15 { padding-bottom: calc(15px * 1.1); }
    .padding-bottom-30 { padding-bottom: calc(30px * 1.1); }
    .padding-bottom-45 { padding-bottom: calc(45px * 1.1); }
    .padding-bottom-60 { padding-bottom: calc(60px * 1.1); }
	.padding-bottom-90 { padding-bottom: calc(90px * 1.1); }
}

@media (min-width: 768px) {
    .padding-top-15 { padding-top: calc(15px * 1.2); }
    .padding-top-30 { padding-top: calc(30px * 1.2); }
    .padding-top-45 { padding-top: calc(45px * 1.2); }
    .padding-top-60 { padding-top: calc(60px * 1.2); }
    .padding-top-90 { padding-top: calc(90px * 1.2); }
    .padding-bottom-15 { padding-bottom: calc(15px * 1.2); }
    .padding-bottom-30 { padding-bottom: calc(30px * 1.2); }
    .padding-bottom-45 { padding-bottom: calc(45px * 1.2); }
    .padding-bottom-60 { padding-bottom: calc(60px * 1.2); }
    .padding-bottom-90 { padding-bottom: calc(90px * 1.2); }
}

@media (min-width: 992px) {
    .padding-top-15 { padding-top: calc(15px * 1.3); }
    .padding-top-30 { padding-top: calc(30px * 1.3); }
    .padding-top-45 { padding-top: calc(45px * 1.3); }
    .padding-top-60 { padding-top: calc(60px * 1.3); }
    .padding-top-90 { padding-top: calc(90px * 1.3); }
    .padding-bottom-15 { padding-bottom: calc(15px * 1.3); }
    .padding-bottom-30 { padding-bottom: calc(30px * 1.3); }
    .padding-bottom-45 { padding-bottom: calc(45px * 1.3); }
    .padding-bottom-60 { padding-bottom: calc(60px * 1.3); }
    .padding-bottom-90 { padding-bottom: calc(90px * 1.3); }
}

@media (min-width: 1200px) {
    .padding-top-15 { padding-top: calc(15px * 1.4); }
    .padding-top-30 { padding-top: calc(30px * 1.4); }
    .padding-top-45 { padding-top: calc(45px * 1.4); }
    .padding-top-60 { padding-top: calc(60px * 1.4); }
    .padding-top-90 { padding-top: calc(90px * 1.4); }
    .padding-bottom-15 { padding-bottom: calc(15px * 1.4); }
    .padding-bottom-30 { padding-bottom: calc(30px * 1.4); }
    .padding-bottom-45 { padding-bottom: calc(45px * 1.4); }
    .padding-bottom-60 { padding-bottom: calc(60px * 1.4); }
    .padding-bottom-90 { padding-bottom: calc(90px * 1.4); }
}

/* CONTAINER */
/*-------------------------------------------------------------------------------------------*/
.container-fluid {
	padding: 0 15px;
	position: relative;
}

.container {
	position: relative;
	width: 1400px;
	margin: 0 auto;
}

@media (max-width: 1500px) { .container { width: 1140px; } }
@media (max-width: 1199px) { .container { width: 960px; } }
@media (max-width: 991px) { .container { width: 737px; } }
@media (max-width: 767px) { .container { width: 100%; padding-left: 15px; padding-right: 15px; } }
@media (min-width: 2500px) { .container { width: 2200px; } }

/* ICONOS */
/*-------------------------------------------------------------------------------------------*/
i.icono {
	display: inline-block;
	font-size: inherit;
}

i.icono svg {
	position: relative;
	top: .125em;
	flex-shrink: 0;
	height: 1em;
	width: 1em;
	fill: currentColor;
	transition: fill .3s;
}

/* IMAGE COVER */
/*-------------------------------------------------------------------------------------------*/
img.bg {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ANIMACIONES */
/*-------------------------------------------------------------------------------------------*/
.animaciones-activado { transition: all .7s ease; }

/* PRELOADER */
/*-------------------------------------------------------------------------------------------*/
#preloader {
	display: block;
	width: 100%;
	height: 100vh;
	background: var(--color-blanco);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 500;
	opacity: 1;
	transition: opacity .3s linear;
}

#preloader .spinner {
	display: inline-block;
	width: 50px;
	height: 50px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
}

#preloader .spinner::after {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	border: 5px solid var(--color-principal);
	border-color: var(--color-principal) transparent var(--color-principal) transparent;
	animation: spinner .7s ease infinite;
	-webkit-animation: spinner .7s ease infinite;
}

@keyframes spinner {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(180deg); }
}

#preloader img {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
}

/* GENERALES */
/*-------------------------------------------------------------------------------------------*/
.fondo-blanco { background: var(--color-blanco) !important; }

.rte * {
	line-height: 135%;
	margin-bottom: 1em;
}

.rte *:last-child { margin-bottom: 0; }

.rte.tabla-simple {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	text-align: center;
	grid-gap: 30px;
}

@media (max-width: 767px) { .rte.tabla-simple { grid-template-columns: 1fr; } }

a.boton {
	display: inline-block;
	padding: 10px 20px;
	border: 1px solid var(--color-blanco);
	color: var(--color-blanco);
	border-radius: 50px;
	position: relative;
	overflow: hidden;
	letter-spacing: 1px;
}

a.boton::before {
	content: '';
	display: block;
	width: 0;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: var(--gradient-main);
	z-index: -1;
	transition: width .3s ease;
}

a.boton:hover::before { width: 100%; }
a.boton i svg { top: 0; }

a.boton-oscuro {
	border: none;
	background: var(--gradient-main);
}

a.boton-oscuro::before { display: none; }
a.boton-oscuro:hover { background: var(--color-dark-blue-2); }

a.boton i.icono {
	display: inline-block;
	margin-left: 5px;
	font-size: .75em;
}

hr {
	display: block;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: auto;
    margin-inline-end: auto;
    overflow: hidden;
    border: none;
	height: 1px;
	background: var(--color-gris-azulado-claro);
	margin: 15px 0;
}

i { font-style: italic; }

/* TOP */
/*-------------------------------------------------------------------------------------------*/
#top {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 80px;
	background: var(--color-blanco);
	z-index: 101;
	border-bottom: 1px solid var(--color-gris-azulado-claro);
}

#top div.menu-trigger {
	position: absolute;
	top: 0;
	left: 0;
	width: 80px;
	height: 80px;
	background: var(--gradient-main);
}

#top div.menu-trigger span {
	display: block;
	width: 50%;
	height: 4px;
	background: var(--color-blanco);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	transition: all .3s ease;
}

#top div.menu-trigger span::after,
#top div.menu-trigger span::before {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	background: var(--color-blanco);
	transition: all .3s ease;
}

#top div.menu-trigger span::after {
	top: -12px;
	transform: none;
}

#top div.menu-trigger span::before {
	top: 12px;
	transform: none;
}

#top div.menu-trigger.activo span { transition: background 0s .2s; }

#top div.menu-trigger.activo span::after {
	transition: all .3s ease;
	transform: rotate(-45deg);
	top: -6px;
	left: -5px;
	width: 50%;
}

#top div.menu-trigger.activo span::before {
	transition: all .3s ease;
	transform: rotate(45deg);
	top: 6px;
	left: -5px;
	width: 50%;
}

#top div.logo {
	position: absolute;
	height: 100%;
	top: 0;
	left: 80px;
	padding: 0 15px;
}

#top div.logo a {
	padding: 5px;
	display: block;
	height: 100%;
}

#top div.logo a img {
	display: block;
	height: 100%;
}

#top div.sticky-titles {
	position: absolute;
	top: 0;
	right: 80px;
	padding: 15px 20px;
	height: 100%;
}

#top div.sticky-titles ul {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
}

#top div.sticky-titles ul li { margin: 0 15px; }
#top div.sticky-titles ul li:first-child { margin-left: 0; }
#top div.sticky-titles ul li:last-child { margin-right: 0; }

#top div.sticky-titles ul li a {
	display: block;
	position: relative;
	padding: 10px 5px;
	font-family: var(--font-family-secundaria);
	font-size: 14px;
	font-weight: 500;
	color: var(--color-principal);
}

#top div.sticky-titles ul li a::after {
	content: '';
	display: block;
	width: 0;
	height: 2px;
	position: absolute;
	bottom: 0;
	left: 5px;
	background: var(--gradient-main);
	transition: .3s ease;
}

#top div.sticky-titles ul li a:hover::after { width: calc(100% - 10px); }

#top div.search-trigger {
	width: 80px;
	height: 80px;
	background: var(--color-clear);
	position: absolute;
	top: 0;
	right: 0;
	font-size: 20px;
	text-align: center;
	cursor: pointer;
	transition: background .3s ease;
	border-bottom: 1px solid var(--color-gris-azulado-claro);
}

#top div.search-trigger:hover { background: var(--color-clear-2); }

#top div.search-trigger i.icono {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}

#top div.main-search-bar {
	position: absolute;
	top: 0;
	right: 0;
	height: 100%;
	width: 0;
	background: var(--color-blanco);
	overflow: hidden;
	transition: width .6s ease;
}

#top div.main-search-bar.activo {
	width: calc(100% - 270px);
	overflow: visible;
}

#top div.main-search-bar button {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 80px;
	height: 80px;
	background: var(--color-clear-2);
	border: none;
	padding: 0;
	font-size: 20px;
	cursor: pointer;
	transition: all .3s ease;
	padding-top: 2px;
}

#top div.main-search-bar button:hover {
	background: var(--color-blue);
	color: var(--color-blanco);
}

#top div.main-search-bar span.close {
	display: block;
	position: absolute;
	top: 0;
	right: 80px;
	width: 40px;
	height: 80px;
	font-size: 20px;
	cursor: pointer;
	color: var(--color-principal);
	transition: all .3s ease;
}

#top div.main-search-bar span.close:hover { color: var(--color-blue); }

#top div.main-search-bar span.close i.icono{
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}

#top div.main-search-bar input[type=text] {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: calc(100% - 120px);
	height: 100%;
	font-size: 18px;
	border: none;
	padding: 15px;
	color: var(--color-principal);
	border-left: 1px solid var(--color-gris-azulado-claro);
}

#top div.main-search-bar ul {
	position: absolute;
	top: 100%;
	width: min-content;
	min-width: 200px;
}

#top div.main-search-bar ul li {
	white-space: nowrap;
	background: var(--color-blanco);
	overflow: hidden;
}

#top div.main-search-bar ul li:last-child { border-radius: 0 0 10px 10px; }

#top div.main-search-bar ul li a {
	display: block;
	padding: 10px 15px;
	border-top: 1px solid var(--color-gris-azulado-claro);
	color: var(--color-principal);
}

#top div.main-search-bar ul li a:hover { background: var(--color-clear); }

#top div.main-menu {
	background: var(--color-clear-2);
	position: absolute;
	top: 100%;
	left: -100%;
	width: 100%;
	display: grid;
	grid-template-columns: 271px 1fr;
	height: calc(100vh - 80px);
	opacity: 0;
	transition: opacity .3s 0s linear, left .6s .3s;
}

#top div.main-menu.activo {
	left: 0;
	opacity: 1;
	transition: opacity .6s linear;
}

#top div.main-menu::after {
	content: '';
	display: block;
	width: 100%;
	height: 1px;
	position: absolute;
	top: 0;
	left: 0;
	background: transparent;
}

#top div.main-menu div.sidebar {
	background: var(--color-blue);
	padding: 15px 0;
	overflow: auto;
}

#top div.main-menu div.sidebar a {
	position: relative;
	display: block;
	padding: 15px;
	font-family: var(--font-family-secundaria);
	font-weight: 500;
	font-size: 15px;
	color: var(--color-blanco);
}

#top div.main-menu div.sidebar a:hover {
	background: var(--color-dark-blue-2);
	color: var(--color-teal-2);
}

#top div.main-menu div.sidebar a.activo {
	background: var(--color-dark-blue);
	color: var(--color-blanco);
}

#top div.main-menu div.sidebar a i.icono{
	display: block;
	font-size: 10px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 15px;
}

#top div.main-menu div.main { overflow: scroll; }

#top div.main-menu div.main div.pod {
	padding: 22px;
	display: none;
	opacity: 0;
}

#top div.main-menu div.main div.pod.activo {
	display: block;
	opacity: 1;
	transition: opacity .3s linear;
}

#top div.main-menu div.main div.pod .heading {
	display: block;
	font-family: var(--font-family-secundaria);
	font-weight: 500;
	color: var(--color-teal);
}

#top div.main-menu div.main div.pod .subheading {
	display: block;
	font-family: var(--font-family-secundaria);
	font-weight: 500;
	color: var(--color-principal);
	max-width: 800px;
	margin-top: 5px;
}

#top div.main-menu div.main div.pod.tiles div.pod-x {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-gap: 15px;
	padding-top: 7px;
}

#top div.main-menu div.main div.pod.tiles div.pod-x div.item {
	position: relative;
	padding-top: 56.25%;
	background: var(--color-principal);
	overflow: hidden;
	border: 1px solid var(--color-gris-azulado-claro);
}

#top div.main-menu div.main div.pod.tiles div.pod-x div.item img.bg {
	opacity: .8;
	transform: scale(1);
	transition: all .3s ease;
}

#top div.main-menu div.main div.pod.tiles div.pod-x div.item:hover img.bg { 
	transform: scale(1.1);
	opacity: .5;
}

#top div.main-menu div.main div.pod.tiles div.pod-x div.item a {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	color: var(--color-blanco);
}

#top div.main-menu div.main div.pod.tiles div.pod-x div.item a::before {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: var(--gradient-overlay-oscuro-diagonal);
	opacity: .75;
	transition: opacity .3s ease;
}

#top div.main-menu div.main div.pod.tiles div.pod-x div.item a:hover::before { opacity: 1; }

#top div.main-menu div.main div.pod.tiles div.pod-x div.item a div.txt {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: calc(100% - 30px);
	left: 15px;
	padding: 15px 0;
}

#top div.main-menu div.main div.pod.tiles div.pod-x div.item a div.txt::before {
	content: '';
	display: block;
	height: 1px;
	width: 0;
	position: absolute;
	bottom: 0;
	left: 0;
	background: var(--color-blanco);
	transition: width .3s ease;
}

#top div.main-menu div.main div.pod.tiles div.pod-x div.item a:hover div.txt::before { width: 100%; }

#top div.main-menu div.main div.pod.tiles div.pod-x div.item a div.txt .tile-heading {
	font-family: var(--font-family-secundaria);
	font-weight: 400;
	display: block;
	transition: color .3s ease;
}

#top div.main-menu div.main div.pod.tiles div.pod-x div.item a:hover div.txt .tile-heading { color: var(--color-teal-2); }

#top div.main-menu div.main div.pod.tiles div.pod-x div.item a div.txt .tile-subheading {
	margin-top: 5px;
	display: block;
}

#top div.main-menu div.main div.pod.authors div.pod-x {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-gap: 15px;
	padding-top: 7px;
}

#top div.main-menu div.main div.pod.authors div.pod-x div.item {
	border: 1px solid var(--color-gris-azulado-claro);
	display: grid;
	grid-template-columns: 200px 1fr;
	background: var(--color-blanco);
}

#top div.main-menu div.main div.pod.authors div.pod-x div.item div.img { position: relative; }

#top div.main-menu div.main div.pod.authors div.pod-x div.item div.txt div.rte {
	padding: 15px;
	color: var(--color-gris-azulado);
	position: relative;
}

#top div.main-menu div.main div.pod.authors div.pod-x div.item div.txt div.rte span.authors-heading {
	display: block;
	font-family: var(--font-family-secundaria);
	font-weight: 500;
	color: var(--color-teal);
	margin-bottom: 5px;
}

#top div.main-menu div.main div.pod.authors div.pod-x div.item div.txt div.rte span.authors-heading a { color: var(--color-teal); }
#top div.main-menu div.main div.pod.authors div.pod-x div.item div.txt div.rte span.authors-heading a:hover { color: var(--color-blue); }
#top div.main-menu div.main div.pod.authors div.pod-x div.item div.txt div.rte ul.social-media { min-height: 30px; }
#top div.main-menu div.main div.pod.authors div.pod-x div.item div.txt div.rte ul.social-media li { margin: 5px 5px 5px 0; }

#top div.main-menu div.main div.pod.authors div.pod-x div.item div.txt div.rte ul.social-media li a {
	font-size: 12px;
	background: var(--color-teal);
	color: var(--color-blanco);
	width: 20px;
	height: 20px;
	display: block;
	border-radius: 3px;
	line-height: 20px;
	text-align: center;
	transition: all .3s ease;
}

#top div.main-menu div.main div.pod.authors div.pod-x div.item div.txt div.rte ul.social-media li a:hover { background: var(--color-dark-blue); }

#top div.main-menu div.main div.pod.authors div.pod-x div.item div.txt div.rte a.link-posts {
	display: block;
	position: absolute;
	bottom: 20px;
	right: 15px;
	height: 20px;
	line-height: 20px;
	color: var(--color-teal);
	font-size: 12px;
}

#top div.main-menu div.main div.pod.authors div.pod-x div.item div.txt div.rte a.link-posts i.icono{
	display: inline-block;
	font-size: 10px;
	margin-left: 5px;
	position: relative;
}

#top div.main-menu div.main div.pod.authors div.pod-x div.item div.txt div.rte a.link-posts:hover { color: var(--color-dark-blue); }
#top div.main-menu div.main div.pod.authors div.botones { margin-top: 25px; }

span.barra-de-lectura {
	display: block;
	width: 0;
    position: fixed;
    top: 80px;
	left: 0;
	height: 5px;
	background: var(--gradient-main);
	transition: width .3s ease;
	z-index: 10;
}

@media (max-width: 1199px) {
	#top div.main-menu div.main div.pod.tiles div.pod-x { grid-template-columns: 1fr 1fr; }
	#top div.main-menu div.main div.pod.tiles div.pod-x div.item { padding-top: 45%; }
	#top div.main-menu div.main div.pod.authors div.pod-x { grid-template-columns: 1fr; }
}

@media (max-width: 991px) {
	#top div.sticky-titles ul li { display: none; }
	#top div.sticky-titles ul li:last-child { display: block; }
	#top div.main-menu div.main div.pod.tiles div.pod-x { grid-template-columns: 1fr; }
	#top div.main-menu div.main div.pod.tiles div.pod-x div.item { padding-top: 25%; }
}

@media (max-width: 767px) {
	#top { height: 60px; }
	#top div.menu-trigger { width: 60px; height: 60px; }
	#top div.logo { left: 60px; padding: 0 5px; }
	#top div.logo a { padding: 5px; }
	#top div.sticky-titles { right: 60px; padding: 15px; }
	#top div.search-trigger { width: 60px; height: 60px; }
	#top div.main-search-bar.activo { width: calc(100vw - 190px); }
	#top div.main-search-bar span.close { height: 60px; right: 60px; }
	#top div.main-search-bar button { width: 60px; height: 60px; }
	#top div.main-search-bar input[type=text] { width: calc(100% - 100px); }
	#top div.main-menu { height: calc(100vh - 60px); grid-template-columns: 191px 1fr; }
	#top div.main-menu div.sidebar a { line-height: 150%; }
	#top div.main-menu div.main div.pod.tiles div.pod-x div.item { padding-top: 0; }
	#top div.main-menu div.main div.pod.tiles div.pod-x div.item a { position: relative; padding: 30px 0; }
	#top div.main-menu div.main div.pod.tiles div.pod-x div.item a div.txt { position: relative; top: 0; transform: none; }
	#top div.main-menu div.main div.pod.authors div.pod-x div.item { grid-template-columns: 100px 1fr; }
	#top div.main-menu div.main div.pod.authors div.botones a { display: block; text-align: center; margin-bottom: 15px; }
	#top div.main-menu div.main div.pod.authors div.botones a:last-child { margin-bottom: 0; }
	#top div.menu-trigger.activo span::after { top: -4px; }
	#top div.menu-trigger.activo span::before { top: 4px; }
	span.barra-de-lectura { top: 60px; }
}

@media (max-width: 575px) {
	#top div.main-search-bar.activo { width: calc(100vw - 60px); }
	#top div.main-menu { grid-template-columns: 1fr; }
	#top div.main-menu div.sidebar { padding: 0; }
	#top div.main-menu div.sidebar a i.icono { display: none; }
	#top div.main-menu div.main div.pod { padding: 15px; }
	#top div.sticky-titles ul li a { font-size: 13px; }
	#splash-v2 div.txt .heading p { line-height: 135%; }
}

/* FOOTER */
/*-------------------------------------------------------------------------------------------*/
#footer {
	background: var(--color-blanco);
	border-top: 1px solid var(--color-gris-azulado-claro);
}

#footer span.clear { color: var(--color-gris-azulado-claro); }
#footer span.clear a { color: var(--color-gris-azulado-claro); }

#footer div.pod {
	display: grid;
	grid-template-columns: 350px 1fr;
	grid-gap: 45px;
}

#footer div.pod div.formulario a.logo {
	display: block;
	max-width: 120px;
}

#footer div.pod div.formulario a.logo img {
	display: block;
	width: 100%;
}

#footer div.pod div.formulario form { margin-top: 30px; }

#footer div.pod div.formulario form label {
	font-family: var(--font-family-secundaria);
	color: var(--color-principal);
	font-weight: 500;
	margin-bottom: 10px;
	display: block;
}

#footer div.pod div.formulario form div.input { position: relative; }

#footer div.pod div.formulario form div.input-mitad {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-gap: 5px;
}

#footer div.pod div.formulario form input[type=email],
#footer div.pod div.formulario form input[type=text] {
	display: block;
	width: 100%;
	border: none;
	background: var(--color-clear);
	padding: 15px;
	height: 45px;
	margin-bottom: 5px;
}

#footer div.pod div.formulario form button {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	border: none;
	padding: 15px;
	font-family: var(--font-family-secundaria);
	font-weight: 500;
	background: var(--color-teal);
	color: var(--color-blanco);
	cursor: pointer;
	height: 45px;
}

#footer div.pod div.formulario form button:hover { background: var(--color-dark-blue-2); }

#footer div.pod div.formulario form label.marketing {
	position: relative;
	padding-left: 20px;
	font-size: 13px;
}

#footer div.pod div.formulario form label.marketing input {
	display: block;
	width: 14px;
	height: 14px;
	background-color: var(--color-blanco);
	border: 1px solid var(--color-teal);
	margin: 0;
    position: absolute;
    top: 0;
    left: 0;
}

#footer div.pod div.formulario div.txt {
	margin-top: 30px;
	color: var(--color-gris-azulado);
}

#footer div.pod div.main div.menu-principal ul {
	text-align: right;
	margin-top: 30px;
	font-size: 0;
}

#footer div.pod div.main div.menu-principal ul li a {
	font-family: var(--font-family-secundaria);
	color: var(--color-principal);
	display: block;
	padding: 5px 0;
	font-weight: 500;
	border-bottom: 2px solid transparent;
	transition: all .3s ease;
	font-size: 13px;
}

#footer div.pod div.main div.menu-principal ul li a:hover {
	color: var(--color-teal);
	border-color: var(--color-teal);
}

#footer div.pod div.main div.menu-principal ul li a i { font-size: 18px; }

#footer div.pod div.main div.menu-principal ul li {
	margin-left: 15px;
	display: inline-block;
	vertical-align: top;
}

#footer div.pod div.main div.menus {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-gap: 45px;
	margin-top: 30px;
}

#footer div.pod div.main div.menus ul li:first-child {
	font-family: var(--font-family-secundaria);
	display: block;
	padding: 5px 0;
	font-weight: 500;
	color: var(--color-teal);
}

#footer div.pod div.main div.menus ul li {
	margin-bottom: 2px;
	text-align: right;
}

#footer div.pod div.main div.menus ul li a {
	color: var(--color-gris-azulado);
	display: inline-block;
	padding: 2px 0;
	border-bottom: 1px solid transparent;
}

#footer div.pod div.main div.menus ul li a:hover {
	color: var(--color-teal);
	border-color: var(--color-teal);
}

#footer div.pod div.main div.menus ul li:first-child a { color: var(--color-teal); }

@media (max-width: 767px) {
	#footer div.pod { grid-template-columns: 1fr; grid-gap: 15px; }
	#footer div.pod div.formulario form { max-width: 600px; margin-left: auto; margin-right: auto; }
	#footer div.pod div.formulario div.txt { display: none; }
	#footer div.pod div.main div.item { display: none; }
	#footer div.pod div.main div.menus { grid-gap: 15px; }
	#footer div.pod div.main div.menus ul li { text-align: center; }
	#footer div.pod div.main div.menu-principal ul { text-align: center; }
	#footer div.pod div.main div.menus ul li a { padding: 10px 0; }
}

/* NOTICE */
/*-------------------------------------------------------------------------------------------*/
div.notice {
	position: fixed;
	bottom: 15px;
	left: 50%;
	transform: translateX(-50%);
	background: var(--color-dark-blue);
	border: 1px solid var(--color-dark-blue);
	color: var(--color-blanco);
	padding: 15px 30px;
	max-width: 600px;
	text-align: center;
	font-family: var(--font-family-secundaria);
	font-weight: 400;
	z-index: 100;
	border-radius: 50px;
}

div.notice strong {
	color: var(--color-teal);
	font-weight: 500;
}

/* LAZY FADE IN */
/*-------------------------------------------------------------------------------------------*/
.lazy-fade-in {
    opacity: 0;
    transition: opacity 0.5s ease;
}

.lazy-fade-in.loaded { opacity: 1; }

/* CTA Compendium
---------------------------------------------------------------- */
div.cta-compendium {
	background: var(--color-clear);
	position: relative;
	z-index: 10;
}

div.cta-compendium div.pod {
	display: grid;
	grid-template-columns: min-content 1fr;
	grid-gap: 30px;
}

div.cta-compendium div.pod div.titulo {
	font-family: var(--font-family-secundaria);
	color: var(--color-teal);
	font-weight: 500;
	padding: 30px 0;
}

div.cta-compendium div.pod div.txt {
	color: var(--color-gris-azulado);
	border-left: 3px solid var(--color-blue);
	padding: 30px 0 30px 30px;
}

div.cta-compendium div.pod div.txt .heading {
	font-family: var(--font-family-secundaria);
	color: var(--color-principal);
	font-weight: 500;
	margin-bottom: 15px;
}

div.cta-compendium div.pod div.txt div.botones { margin-top: 25px; }
div.cta-compendium div.pod div.txt div.botones a { margin-right: 10px; }

@media (max-width: 575px) {
	div.cta-compendium { padding: 30px 0; }
	div.cta-compendium div.pod { grid-template-columns: 1fr; grid-gap: 15px; }
	div.cta-compendium div.pod div.titulo { padding: 0; }
	div.cta-compendium div.pod div.txt { padding: 0; border: none; }
	div.cta-compendium div.pod div.txt div.botones { font-size: 0; }
	div.cta-compendium div.pod div.txt div.botones a { display: block; width: 100%; text-align: center; margin-bottom: 10px; }
	div.cta-compendium div.pod div.txt div.botones a:last-child { margin-bottom: 0; }
}

/* FORM REPORT */

/* ============================================
   LIGHTBOX WRAPPER
============================================ */
.comment-lightbox {
    position: fixed;
    inset: 0;
    display: none;
    z-index: 99999;
}
.comment-lightbox.active {
    display: block;
}

.clb-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.55);
    backdrop-filter: blur(3px);
}

/* ============================================
   MODAL (⚡ UPDATED FOR RESPONSIVE FIX)
============================================ */
.clb-modal {
    position: relative;
    width: 90%;
    max-width: 620px;
    margin: 50px auto;

    background: var(--color-blanco);
    border-radius: 14px;
    padding: 25px 35px;
    box-shadow: 0 10px 28px rgba(0,0,0,0.25);

    /* NEW: Ensures content fits on small screens */
    max-height: 90vh;
    overflow-y: auto;
}

/* Optional: nicer scrollbar */
.clb-modal::-webkit-scrollbar {
    width: 8px;
}
.clb-modal::-webkit-scrollbar-track {
    background: #f1f1f1;
}
.clb-modal::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 4px;
}
.clb-modal::-webkit-scrollbar-thumb:hover {
    background: #aaa;
}

/* ============================================
   CLOSE BUTTON
============================================ */
.clb-close-x {
    position: absolute;
    top: 12px;
    right: 12px;
    background: transparent;
    border: none;
    font-size: 22px;
    color: var(--color-principal);
    cursor: pointer;
}

/* ============================================
   TITLE
============================================ */
.clb-title {
    font-size: 26px;
    margin-bottom: 18px;
    color: var(--color-dark-blue);
}

/* ============================================
   FORM INPUTS
============================================ */
.clb-label {
    display: block;
    margin-top: 12px;
    margin-bottom: 5px;
    font-size: 16px;
    color: var(--color-principal);
}

.clb-input,
.clb-textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--color-gris-azulado-claro);
    border-radius: 6px;
    font-size: 16px;
}

/* ============================================
   SUBMIT BUTTON
============================================ */
.clb-submit {
    width: 100%;
    margin-top: 20px;
    background: var(--color-teal);
    color: var(--color-blanco);
    border: none;
    padding: 14px;
    font-size: 18px;
    border-radius: 6px;
    cursor: pointer;
}
.clb-submit:hover {
    background: var(--color-teal-2);
}

/* ============================================
   DROPZONE
============================================ */
.clb-dropzone {
    border: 2px dashed var(--color-teal);
    background: var(--color-clear-2);
    padding: 20px;
    text-align: center;
    cursor: pointer;
    margin-top: 8px;
    border-radius: 6px;
    transition: 0.25s;
}
.clb-dropzone.dragover {
    border-color: var(--color-blue);
    background: var(--color-clear);
}

.clb-dropzone input {
    display: none;
}

.clb-file-list {
    margin-top: 10px;
    list-style: none;
    padding: 0;
}

.clb-file-list li {
    display: flex;
    justify-content: space-between;
    padding: 6px 0;
    border-bottom: 1px solid var(--color-clear);
}

/* ============================================
   SUCCESS BOX
============================================ */
.clb-success {
    display: none;
    text-align: center;
    padding: 40px 20px;
}
.clb-success h3 {
    color: var(--color-teal);
    margin-bottom: 10px;
}
.clb-success button {
    margin-top: 15px;
    padding: 10px 18px;
    border: none;
    background: var(--color-teal);
    color: #fff;
    border-radius: 6px;
    cursor: pointer;
}

/* ============================================
   LOADER
============================================ */
.clb-loader {
    display: none;
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,0.85);
    backdrop-filter: blur(3px);
}
.clb-loader.active {
    display: block;
}
.clb-loader::after {
    content: "";
    position: absolute;
    top: 50%; left: 50%;
    width: 48px; height: 48px;
    margin-left: -24px; margin-top: -24px;
    border: 4px solid var(--color-teal);
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* ============================================
   MOBILE FIX
============================================ */
@media (max-width: 480px) {
    .clb-modal {
        padding: 20px;
        max-width: 95%;
    }

    .clb-title {
        font-size: 22px;
    }
}