/*
Theme Name:   Movedo Child
Theme URI:    http://themeforest.net/user/greatives
Description:  Movedo Child Theme
Version:      3.5.4
Author:       Greatives Team
Author URI:   http://greatives.eu
Template:     movedo
*/
:root {
  --color-principal: #1e3a8a; /* azul oscuro */
  --color-secundario: #0ea5e9; /* azul claro */
  --color-terciario: #3b82f6; /* azul medio */
  --color-cuaternario: #eff6ff; /* azul muy claro, casi blanco */
	--color-quinto: #2f5ab3; /* azul muy oscuro */
	--color-sexto: #000017; /* azul casi negro */
  --color-white: #fff;
  --color-black: #000;
  --color-gris-boton: #737373;
  --color-gris-claro: #7c7c7c;
  --color-gris-medio: #bbb;
  --color-gris-oscuro: #d8d8d8;
  --color-gris-label: #605f5f;
  --color-gris-fondo: #f7f7f5;
}

html {
	font-size: 16px;
}
a:focus,
form input:focus,
form select:focus,
form button:focus {
  outline-style: dotted!important; /* Tipo de borde punteado */
  outline-color: var(--color-principal)!important;    /* Color del borde */
  outline-width: 2px!important;     /* Grosor del borde */
}

li::marker {
  color: var(--color-secundario);
}
ul.items-grey li {
	background: #f9fafc;
	display: block;
	margin: 0.5rem 0;
	padding: 0.5rem 1rem;
}
ul.list-two-column {
	display: grid;
  grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
}
ul.items-grey.list-two-column li {
	margin: 0;
}
ul.list-three-column {
	display: grid;
  grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
}
ul.list-two-column li h3 {
	margin: 0.5rem 0;
	padding: 0;
}
h2 {
	display: inline-block;
	line-height: normal;
	padding: 0 0 0 1.5rem;
	position: relative;
	}
h2.title-icon,
h2.bloque-title {
	padding: 0;
}
	h2::after {
		background-color: var(--color-principal);
		border-radius: 6px;
		content: "";
		height: 100%;
    left: 0;
    position: absolute;
    bottom: 0;
    width: 0.5rem;
	}
h2.title-icon::after,
h2.bloque-title::after,
.box-guia .grve-row h2::after,
.box-white h2::after {
	content: none;
}
h3 {
	margin: 0 0 0.5rem;
}
h2 i.fa-solid,
h2 i.fa-regular,
h3 i.fa-solid,
h3 i.fa-regular,
.box-white .grve-wrapper-icon i {
	background: var(--color-cuaternario);
	border-radius: 10px;
	color: var(--color-quinto);
	display: inline-block;
	padding: 0.65rem 0.75rem;
}
h3.azul {
	color: var(--color-principal);
}
h3.azul i.fa-solid,
h3.azul i.fa-regular {
	background: none;
	padding: 0 1rem 0 .85rem;
}
.text-title {
	color: var(--color-principal);
	font-size: .85rem;
	font-weight: 600;
	text-transform: uppercase;
}
.btn-white {
	background: var(--color-white);
	border-radius: 6px;
	color: var(--color-principal);
	display: inline-block;
	font-weight: bold;
	padding: .4rem 1rem;
	}
	.btn-white:hover {
		text-decoration: none!important;
	}
a.grve-btn.grve-btn-medium {
	border-radius: 20px !important;
  display: inline-block;
  font-weight: bold !important;
  padding: .8rem 2rem;
  text-transform: none;
  font-size: 0.875rem !important;
	}
	a.grve-btn.grve-btn-medium i {
    margin: 0 0 0 0.923em;
	}
.box-blue .btn-white i {
	background: none;
	color: var(--color-principal);
	border-radius: 0;
	font-weight: bold;
	padding: 0;
}
.grve-element.grve-text a {
	color: var(--color-principal);
	}
	.grve-element.grve-text a:hover {
		text-decoration: underline;
	}

/* Menu */
#grve-header .grve-horizontal-menu.grve-position-right ul.grve-menu > li > a {
    padding: 0 .5rem!important;
}

/* ==========================================================================
   LOGOS MÚLTIPLES EN CABECERA (3 logos con enlaces personalizados)
   ==========================================================================
   Estilos para mostrar 3 logos en la cabecera en lugar del logo único.
   Las alturas se adaptan a las opciones del tema (logo_height, etc.)
   mediante variables CSS definidas en functions.php.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Ocultar logo por defecto
   --------------------------------------------------------------------------
   Cuando hay logos múltiples activos, ocultamos el logo estándar del tema
   que aparece justo después del contenedor .grve-logo-multi.
   Afecta: cabecera principal, responsive y menú split.
   -------------------------------------------------------------------------- */
.movedo-child-multi-logos .grve-logo-multi + .grve-logo:not(.grve-logo-multi) {
	display: none !important;
}

/* --------------------------------------------------------------------------
   Contenedor de los 3 logos - centrado vertical y espacio ampliado
   --------------------------------------------------------------------------
   Layout flex para alinear los logos horizontalmente con separación.
   Los logos usan la altura completa de la cabecera (fullsize) y se centran
   verticalmente mediante align-items: center.
   IMPORTANTE: Anular top: 50% del tema (.grve-logo .grve-wrapper) que
   recorta los logos a la mitad.
   -------------------------------------------------------------------------- */
.grve-logo-multi {
	display: flex;
	align-items: center;
}

.grve-logo-multi .grve-wrapper-multi-logos {
	position: relative;
	top: 0; /* Anula top: 50% del tema que cortaba los logos */
	display: flex;
	align-items: center;
	gap: 1.5rem;
	flex-wrap: wrap;
}

.grve-logo-multi .grve-wrapper-multi-logos a {
	display: flex;
	align-items: center;
}

.grve-logo-multi .grve-wrapper-multi-logos img {
	width: auto;
	object-fit: contain;
	vertical-align: middle;
}

#grve-main-header .grve-logo .grve-wrapper img {
	top: 0;
}

/* --------------------------------------------------------------------------
   Altura del wrapper y logos según opciones del tema
   --------------------------------------------------------------------------
   grve-wrapper-multi-logos usa la altura configurada en Opciones del tema
   (Header > Layout). Las variables vienen de functions.php.
   -------------------------------------------------------------------------- */





/* Home */
#grve-theme-wrapper .banda-portada-destacada .grve-bg-primary-1 {
	background: linear-gradient(
    to right,
    rgba(15, 30, 46, 0.95) 0%,
    rgba(15, 30, 46, 0.8) 30%,
    rgba(15, 30, 46, 0.7) 55%,
    rgba(15, 30, 46, 0.6) 75%,
    rgba(15, 30, 46, 0.5) 100%
  );
	opacity: 1;
}
.banda-portada-destacada h1 strong {
	color: var(--color-secundario);
}
.banda-portada-destacada .grve-btn {
	margin-top: 1.5rem;
	text-transform: none;
	}
	.banda-portada-destacada .grve-btn span {
		display: flex;
    flex-direction: row-reverse;
		}

.banda-cajas-montadas .grve-container {
	position: relative;
	margin-top: -8rem;
}
.banda-cajas-montadas .grve-box-icon .grve-wrapper-icon {
	margin: 0;
	}
	.banda-cajas-montadas .grve-box-icon .grve-wrapper-icon i {
		background: var(--color-cuaternario);
		border-radius: 15px;
    color: #0A7DB2 !important;
    padding: 0;
    height: 60px;
    width: 54px;
    vertical-align: middle;
    line-height: 60px;
    font-size: 2rem;
    margin-bottom: .65rem;
		}
	.banda-cajas-montadas .grve-box-icon .grve-box-content h2 {
		margin: 0 0 0.5rem;
		padding: 0;
		}
		.banda-cajas-montadas .grve-box-icon .grve-box-content h2::after {
			content: none;
		}

		/* Igualar alturas por fila */
		.banda-cajas-montadas .grve-row-inner {
		  display: flex;
		  align-items: stretch;
		}

		/* Columnas */
		.banda-cajas-montadas .grve-column-inner.box-portada {
		  display: flex;
		}

		/* Tarjeta */
		.banda-cajas-montadas .grve-column-inner.box-portada .grve-column-wrapper-inner {
		  background: #ffffff;
		  display: flex;
		  flex-direction: column;
		  height: 100%;
		  padding: 24px;
		}


.box-portada .grve-column-wrapper-inner,
.bloque-recursos,
.box-white {
	background: var(--color-white);
  border-radius: 24px;              /* bordes grandes y suaves */
  padding: 32px;
  max-width: 420px;
  box-shadow:
    0 20px 40px rgba(0, 0, 0, 0.06),
    0 8px 16px rgba(0, 0, 0, 0.07);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
	}
	.box-portada .grve-column-wrapper-inner:hover {
		transform: translateY(-4px);
  box-shadow:
    0 25px 50px rgba(0, 0, 0, 0.08),
    0 12px 24px rgba(0, 0, 0, 0.05);
	}
	.box-portada .grve-column-wrapper-inner h2 {
		color: var(--color-black);
		margin: 1rem 0 0.2rem 0;
	}
	.box-portada .grve-column-wrapper-inner p {
		margin: 0 0 0.75rem;
	}
	.box-portada .grve-column-wrapper-inner a {
		color: #0A7DB2;
		display: block;
		font-weight: 500;
		}
		.box-portada .grve-column-wrapper-inner a:hover {
			text-decoration: none;
		}
	.box-white {
		padding: 1.5rem 2rem !important;
	  max-width: 100%;
	}
	.box-white .grve-box-icon .grve-box-title {
		padding: 0;
	}
/****** Presentacion *******/
/* Columna derecha */
.banda-presentacion .grve-column-1-2:last-child .grve-column-wrapper {
  background: #ffffff;
  padding: 40px;
  border-radius: 20px;

  box-shadow:
    0 25px 60px rgba(0, 0, 0, 0.06),
    0 10px 25px rgba(0, 0, 0, 0.04);
}
.banda-presentacion h2::after {
	content: none;
}
.banda-presentacion h2 + h3,
.banda-presentacion .grve-column-1-2:last-child h2 {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 20px;
	padding: 0;
}
.banda-presentacion .grve-column-1-2:last-child h3,
.banda-presentacion .grve-column-1-2:last-child h4 {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 10px;
}
.banda-presentacion .grve-column-1-2:last-child p br {
  display: block;
  content: "";
  margin-bottom: 12px;
}
.banda-representante {
  background: var(--color-cuaternario);
  padding: 60px 0;
}
.banda-representante .grve-column-wrapper {
  background: var(--color-cuaternario);
	border: 2px solid #e5effd;
  padding: 3rem;
  border-radius: 20px;

  box-shadow:
    0 20px 40px rgba(16, 24, 40, 0.06),
    0 8px 20px rgba(16, 24, 40, 0.04);
}
.banda-representante h3 {
  font-size: 22px;
  font-weight: 700;
  color: #1e3a8a;
  margin-bottom: 20px;
}
.box-blue-border {
	background-color: var(--color-cuaternario);
	font-size: 0.9rem;
	font-style: italic;
	padding: 1rem 1rem 1rem 2rem;
	position: relative;
	}
	.box-blue-border::before {
		background: var(--color-principal);
		content: "";
		height: 100%;
		left: 0;
		position: absolute;
		top: 0;
		width: 3px;
	}
	.box-blue-border a {
		color: var(--color-principal);
		text-decoration: underline;
		}
		.box-blue-border a:hover {
			text-decoration: none;
		}


/* Sensibilizacion */
.grve-accordion-wrapper {
    border-radius: 14px;
		box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.1);
	}
	.grve-accordion-wrapper > li {
		border-bottom: 1px solid #e6e8ec;
		margin-bottom: 0;
		}
		.grve-accordion-wrapper > li:last-child  {
			border: 0;
		}
		.grve-accordion-wrapper > li:first-child .grve-title-wrapper {
			border-top-left-radius: 14px;
			border-top-right-radius: 14px;
		}
		.grve-accordion-wrapper > li:last-child .grve-title-wrapper {
			border-bottom-left-radius: 14px;
			border-bottom-right-radius: 14px;
		}
		.grve-accordion-wrapper.grve-style-1 .grve-title-wrapper {
			box-shadow: none;
			padding: 20px 40px 20px 30px;
		}
		.grve-accordion-wrapper.grve-style-1 .grve-title-wrapper.active {
			background-color: var(--color-cuaternario);
		}
		.grve-accordion-wrapper.grve-style-1 .grve-title-wrapper.active .grve-accordion-arrow i {
			color: var(--color-terciario);
		}
		.grve-accordion-wrapper .grve-element p,
		.grve-accordion-wrapper .grve-element ul,
		.grve-accordion-wrapper .grve-element ol {
			line-height: 1.51;
		}
		.grve-accordion-wrapper .grve-element h2 {
			padding: 0;
			}
			.grve-accordion-wrapper .grve-element h2::after {
				content: none;
			}
		.grve-accordion-wrapper .grve-element ul {
			list-style: disc;
		}
		.grve-accordion-wrapper .grve-element ul.list-acordeon {
			margin-bottom: 1rem;
			}
			.grve-accordion-wrapper .grve-element ul.list-acordeon li {
				padding: .25rem 1rem .25rem 1.5rem;
				}
				.grve-accordion-wrapper .grve-element ul.list-acordeon li::before {
					top: .25rem;
				}

.box-blue {
	background: linear-gradient(
    180deg,
    #3a81f5 0%,
    #3170e6 50%,
    #2960d8 100%
  );

  border-radius: 14px;
  padding: 1.5rem 0 1.5rem 1.25rem;
  color: #ffffff;
	margin: 1.5rem 0 0 0!important;
}
.box-blue .grve-column-1-6 {
	padding: 0!important;
}
.box-blue i {
	background: #5e94f3;
	border-radius: 50px;
	padding: 1rem .75rem;
}
.box-blue h3 {
	color: var(--color-white);
}

/* Objetivo */
.banda-objetivo .grve-row {
	border-radius: 10px;
	box-shadow:
		0 20px 40px rgba(0, 0, 0, 0.06),
		0 8px 16px rgba(0, 0, 0, 0.07);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.banda-objetivo .grve-row .grve-column.grve-column-1-4 .grve-column-wrapper,
.banda-objetivo .grve-row .grve-column.grve-column-1-4 .grve-column-wrapper {
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
	}
	.banda-objetivo .grve-row .grve-column.grve-column-3-4 .grve-column-wrapper{
		border-top-right-radius: 10px;
		border-bottom-right-radius: 10px;
		}
	.banda-objetivo .grve-row .grve-column.grve-column-1-4 .grve-element.grve-text {
		padding: 3rem 2rem;
	}
	.banda-objetivo .grve-row .grve-column.grve-column-1-4 .grve-column-wrapper h2 {
		color: var(--color-white);
		padding: 3rem 2rem;
		}
		.banda-objetivo .grve-row .grve-column.grve-column-1-4 .grve-column-wrapper h2::after {
			background: none;
		}
	.banda-objetivo .grve-row .grve-column.grve-column-3-4 .grve-element.grve-text {
		font-size: 1rem;
		padding: 1rem 2rem;
	}
	.banda-listas-box ul,
	.grve-accordion-wrapper .grve-element ul {
		list-style: none;
		margin: 0;
		padding: 0;
		}
		.banda-listas-box ul.list-two-column {
			margin-top: 1.5rem;
		}
		.banda-listas-box ul li {
			background-color: var(--color-white);
			box-shadow:
				0 20px 40px rgba(0, 0, 0, 0.06),
				0 8px 16px rgba(0, 0, 0, 0.07);
			transition: transform 0.25s ease, box-shadow 0.25s ease;
			border-radius: 10px;
			line-height: 1.5rem;
			margin: 1rem 0;
			padding: 1rem 1.5rem 1rem 3rem;
			position: relative;
		}
		.banda-listas-box ul.list-two-column li {
			margin: 0;
		}
		.grve-accordion-wrapper .grve-element ul li {
			line-height: 1.5rem;
			margin: 0;
			padding: 1rem 1rem 1rem 2rem;
			position: relative;
		}
		.banda-listas-box ul li::before,
		.grve-accordion-content ul li::before  {
			content: "\f058";
			color: var(--color-terciario);
			font-family: 'FontAwesome';
			left: 1.2rem;
			position: absolute;
			top: 1rem;
		}
		.grve-accordion-content ul li::before {
			left: 0;
		}
		.grve-accordion-wrapper .grve-element ul li ul {
			list-style: disc;
			margin: .5rem 0 0 1rem;
		}
		.grve-accordion-wrapper .grve-element ul li ul li {
			 padding: 0 0 0 .5rem;
		}
		.grve-accordion-content ul li ul li::before {
			content: none;
		}

.banda-media-box .grve-box {
	background-color: var(--color-white);
	border-radius: 10px;
	box-shadow:
    0 20px 40px rgba(0, 0, 0, 0.06),
    0 8px 16px rgba(0, 0, 0, 0.07);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
	height: 100%;
	}
	.banda-media-box .grve-box .grve-media {
    margin-bottom: 0;
		}
		.banda-media-box .grve-box .grve-media img {
	    border-top-left-radius: 10px;
			border-top-right-radius: 10px;
			}
	.banda-media-box .grve-media-box-icon {
    width: 40px;
    height: 40px;
    line-height: 40px;
    top: 10px;
    right: 10px;
    -webkit-border-radius: 50%;
    border-radius: 20%;
		}
		.banda-media-box .grve-media-box-icon i {
	    font-size: 1.25rem;
			}
	.banda-media-box .grve-box .grve-box-content {
		padding: 1.5rem;
	}
	.banda-media-box .grve-box .grve-box-content .grve-box-title {
		font-size: 1.125rem;
		margin: 0 0 .5rem;
	}
	.banda-media-box .grve-box .grve-box-content .grve-read-more {
		color: var(--color-principal);
		font-size: .9rem!important;
		margin: 1rem 0 0 0;
		padding-right: 1.25rem;
		position: relative;
		text-transform: none;
		}
		.banda-media-box .grve-box .grve-box-content .grve-read-more::after {
			content: "\f061";
			font-family: 'FontAwesome';
			position: absolute;
			right: 0;
			top: 0;
		}
.bloque-recursos {
	border: 1px solid #eaeef3;
	margin: 0 0 2.5rem;
	max-width: 100%;
	padding: 0;
	}
	.bloque-recursos h2 {
		background-color: var(--color-cuaternario);
		border-top-left-radius: 24px;
		border-top-right-radius: 24px;
		border-bottom: 1px solid #eaeef3;
		display: block;
		margin: 0;
		padding: 1rem 1.5rem;
	}
	.bloque-recursos h3 {
		color: var(--color-quinto);
		margin: 2rem 0 0 0;
		padding: 0 1.25rem;
	}
	.bloque-recursos ul {
		list-style: none;
		margin: 0;
		padding: 1rem 1.25rem;
		}
		.bloque-recursos ul li {
			border: 1px solid #eaeef3;
			border-radius: 10px;
			margin: 0.5rem 0;
			padding: 0.5rem 1rem;
		}
		.bloque-recursos ul.list-two-column li,
		.bloque-recursos ul.list-three-column li {
			line-height: 1.5rem;
			margin: 0;
		}
		.bloque-recursos ul.items-grey li {
			border: 0;
		}
		.bloque-recursos .enlace-musica a,
		.bloque-recursos .enlace-azul a {
			color: var(--color-quinto)!important;
			display: inline-block;
		}
		.bloque-recursos .enlace-musica a:hover,
		.bloque-recursos .enlace-azul a:hover {
			text-decoration: none;
		}
		.bloque-recursos ul li a {
			color: var(--color-quinto);
			font-weight: 500;
		}
		.content-bloque-recursos {
			align-items: flex-start;
			display: flex;
			padding: 2rem;
			gap: 1rem;
			}
			.content-bloque-recursos p.photo-recurso {
				display: flex;
				flex: 0 0 18%;
				margin: 0;
			}
		/* Aplicamos Flexbox al enlace para alinear el icono y el texto */
		.bloque-recursos .enlace-violeta {
			display: block;
		}
		.bloque-recursos .enlace-azul a,
		.bloque-recursos .enlace-azul {
	    display: flex;
	    align-items: center;
	    gap: 10px;
	    text-decoration: none;
	    color: #333;
	    line-height: 1.5;
			}
			.bloque-recursos .enlace-azul a:hover {
				text-decoration: none;
			}
		.bloque-recursos .enlace-azul {
			margin-top: .5rem;
		}

		/* Estilo específico para el icono de Play */
		.bloque-recursos .enlace-azul a i,
		.bloque-recursos .enlace-azul i {
		    color: #0056b3;            /* El azul de tu diseño */
		    font-size: 1.2rem;         /* Tamaño del icono */
		    margin-top: 3px;           /* Ajuste fino para que centre con la primera frase */
		    flex-shrink: 0;            /* IMPORTANTE: Evita que el icono se aplaste si hay mucho texto */
		}
		.bloque-recursos .enlace-azul p {
			margin: 0;
		}
		.bloque-recursos .enlace-azul div {
			display: inline-block;
			line-height: 1.5rem;
			margin: 0.25rem 0 0 2rem;
		}
		.bloque-recursos .enlace-azul a strong,
		.bloque-recursos .enlace-azul {
		  color: var(--color-principal);
		}

.box-guia .grve-row {
	background-color: var(--color-white);
	border-radius: 10px;
	box-shadow:
    0 20px 40px rgba(0, 0, 0, 0.06),
    0 8px 16px rgba(0, 0, 0, 0.07);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
	}
	.box-guia .grve-row .grve-column-1-4 {
		padding: 0;
		}
		.box-guia .grve-row .grve-column-1-4 .grve-column-wrapper {
			border-top-left-radius: 10px;
			border-bottom-left-radius: 10px;
			padding: 3rem;
		}
	.box-guia .grve-row p:first-child {
		margin: 0 0 .5rem;
	}
	.box-guia .grve-row h2 {
		padding: 0;
	}
.box-guia a.grve-btn.grve-btn-medium i,
.box-white a.grve-btn.grve-btn-medium i {
    margin: 0 0.923em 0 0 ;
	}
	.box-white .grve-box-icon.grve-side-icon.grve-align-left .grve-wrapper-icon {
		margin-right: 2rem!important;
	}
	.box-white .grve-align-left .grve-btn {
    margin-left: 5rem;
	}
/****** Footer ******/
#grve-bottom-bar ul {
	list-style: none;
	margin: 0;
	}
	#grve-bottom-bar a {
		color: var(--color-white);
		}
		#grve-bottom-bar a:hover {
			text-decoration: none;
		}


/*******************/
/**  Responsive  **/
/*******************/
@media (max-width: 767px) {
	#grve-responsive-header .grve-logo .grve-wrapper img {
    top: 0;
	}
	.banda-cajas-montadas .grve-container {
    position: relative;
    margin-top: -4rem;
	}
	.banda-cajas-montadas .grve-row-inner {
	    display: block;
		}
	.box-portada .grve-column-wrapper-inner, .bloque-recursos, .box-white {
    max-width: 100%;
    margin: 1rem 0;
	}
	.banda-cajas-montadas .grve-row-inner {
    margin-top: 3rem !important;
	}
	#grve-footer .grve-align-right {
    text-align: left;
	}
}
