/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*
    Add your custom styles here
*/

/* CSS CAMBIAR COLOR HEADER */

/* Modo por defecto (oscuro) */
.header-matterplace {
  transition: color 0.3s, fill 0.3s, border-color 0.3s;
}

.header-matterplace .logotipo-matterplace svg path {
  fill: #431123;
  transition: fill 0.3s;
}

.header-matterplace .menu-matterplace a {
  color: #431123;
  transition: color 0.3s;
}

.header-matterplace .menu-matterplace .elementor-widget-container {
  border-color: #431123;
  transition: border-color 0.3s;
}

.header-matterplace .menu-matterplace a:hover,
.header-matterplace .menu-matterplace a.elementor-item:focus,
.header-matterplace .menu-matterplace a.elementor-item.elementor-item-active {
  color: #f5eee8;
}

/* Puntero en modo oscuro */
.header-matterplace .e--pointer-background .elementor-item:before {
  background-color: #431123 !important;
  transition: background-color 0.3s;
}

/* Modo claro cuando el header está justo encima de .secciones-oscuras */
.header-matterplace.modo-claro .logotipo-matterplace svg path {
  fill: #f5eee8;
}

.header-matterplace.modo-claro .menu-matterplace a {
  color: #f5eee8;
}

.header-matterplace.modo-claro .menu-matterplace .elementor-widget-container {
  border-color: #f5eee8;
}

.header-matterplace.modo-claro .menu-matterplace a:hover,
.header-matterplace.modo-claro .menu-matterplace a.elementor-item:focus,
.header-matterplace.modo-claro .menu-matterplace a.elementor-item.elementor-item-active {
  color: #431123;
}

/* Puntero en modo claro */
.header-matterplace.modo-claro .e--pointer-background .elementor-item:before {
  background-color: #f5eee8 !important;
}


/* FOOTER */

/* Enlace correo footer */

a.enlace-footer:hover {
  color: #fb5e4d !important;
}

/* Estilo formulario newsletter footer */

.formulario-newsletter-footer button.elementor-button.elementor-size-sm {
  position: absolute;
  margin: 0px 0px 60px 0px;
}

/* En escritorio: reducir el margen inferior */
@media (min-width: 768px) {
  .formulario-newsletter-footer button.elementor-button.elementor-size-sm {
    margin-bottom: 54px;
  }
}


.formulario-newsletter-footer input#form-field-name {
    padding: 0px 0px 16px 0px;
    opacity: 1;
}

/* ESTILOS PERSONALIZADOS */

/* Estilo texto sobre background y rotado */

.texto-background {
  background-color: #FB5E4D;
  border-radius: 100px;
  padding: 11px 47px;
  display: inline-block;
  transform: rotate(-4.42deg);
  font-family: 'Inter', sans-serif;
}

.texto-background-inici {
  background-color: #431123;
color: #431123 !important;
  border-radius: 100px;
border: solid 1px #FB5E4D;
  padding: 11px 47px;
  display: inline-block;
  transform: rotate(-4.42deg);
  font-family: 'Inter', sans-serif;
}


.texto-background-inici:hover {
  background-color: #FB5E4D;
color: #FB5E4D !important;
  border-radius: 100px;
border: solid 1px #FB5E4D;
  padding: 11px 47px;
  display: inline-block;
  transform: rotate(-4.42deg);
  font-family: 'Inter', sans-serif;
}

/* Estilo personalizado alineacion texto "en lo" titulo principal */

/* Texto con margen manual */

span.alineacion {
    margin-left: 3%;
    margin-right: 1%;
}

/* Estilo personalizado flechas carrusel (Opacidad de la flecha siguiente y anterior) */

/* Flechas dentro del carrusel con clase flechas-carrusel */
.flechas-navegacion {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-top: 1rem;
}

/* Estilo base para las flechas */
.flechas-navegacion .flecha {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

/* VERSIÓN MÓVIL: separar a los lados */

@media (max-width: 768px) {
  .flechas-navegacion {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    justify-content: space-between;
    padding: 0 1rem;
    z-index: 10;
    pointer-events: none; /* para que no tape clics del slider */
  }

  .flechas-navegacion .flecha {
    pointer-events: all;
  }
}



/* Ocultar switcher de mucho ruido y pocas respuestas */

.ocultar-switch .jet-switcher__control-wrapper {
  display: none !important;
}

/* Ocultar footer pagina Inici */

.page-id-189 footer {
  display: none;
}

/** AJUSTES CSS PARA HOVER EN PAGINA SERVICIOS TU VIAJE, TU RITMO **/

/* Contenedor de icono y texto alineados en fila */
.hover-flex-box {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

/* Icono oculto inicialmente */
.hover-icon {
  opacity: 0;
  margin-right: 0;
  width: 0;
  overflow: hidden;
  transition: all 0.3s ease;
}

/* Texto base */
.hover-label {
  transition: all 0.3s ease;
  color: #320c1a;
  transform: translateX(-5px); /* opcional */
}

/* Texto secundario oculto */
.hover-text {
  opacity: 0;
  transition: opacity 0.3s ease;
}

/* Hover - mostrar icono */
.hover-box:hover .hover-icon {
  opacity: 1;
  width: auto;
  margin-right: 10px;
  overflow: visible;
}

/* Hover - cambiar color del texto principal */
.hover-box:hover .hover-flex-box .hover-label {
  color: #673CF9 !important;
  transform: translateX(0); /* opcional */
}

/* Hover - mostrar texto secundario */
.hover-box:hover .hover-text {
  opacity: 1;
}

/* Eliminar margen sobre acordeon servicios */

.margin-acordeon .jet-accordion__item.jet-toggle.jet-toggle-fade-effect {
    margin: -1px !important;
}



/* ESTILO FORMULARIO NEWSLETTER */

/* Estilos generales */
.formulario-newsletter {
  position: relative;
}

/* Botón base */
.formulario-newsletter .e-form__buttons {
  display: flex;
  justify-content: flex-end;
  margin-top: 0;
}

/* Escritorio: botón sobre el input a la derecha */
@media (min-width: 768px) {
  .formulario-newsletter .elementor-field-group-name {
    position: relative;
  }

  .formulario-newsletter .e-form__buttons {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-60%);
    margin: 0;
    margin-bottom: 60px !important;
    z-index: 2;
  }
	
	button.elementor-button.elementor-size-sm {
    margin-bottom: 60px;
}

  .formulario-newsletter .elementor-field-group-name {
    padding-right: 150px; /* Deja hueco para el botón */
  }
}

/* Móvil: botón debajo y centrado */
@media (max-width: 767px) {
  .formulario-newsletter .e-form__buttons {
    position: static;
    justify-content: center;
    margin-top: 1em;
    transform: none;
  }

  .formulario-newsletter .elementor-field-group-name {
    padding-right: 0;
  }
}

/* Flecha y hover */
.formulario-newsletter .elementor-button svg path {
  stroke: #431123;
  transition: stroke 0.3s ease;
}

.formulario-newsletter .elementor-button:hover svg path {
  stroke: #f5eee8;
}

.formulario-newsletter .elementor-button:hover .elementor-button-text {
  color: #f5eee8;
}



/** EFECTO DISOLVER BOTON **/

.jet-button__plane,
.jet-button__state {
  transition-duration: 1s !important;
}

/* MOSTRAR POINTER ICONO MAS SECCION "MUCHO RUIDO..." */

.activar-switch {
  cursor: pointer;
}

.activar-switch .elementor-icon {
  cursor: pointer;
}

/* SCROLL BLOQUEADO */

.scroll-bloqueado,
.scroll-bloqueado body,
.scroll-bloqueado html {
  overflow: hidden !important;
  height: 100vh !important;
  position: fixed !important;
  width: 100%;
}

/* FLECHAS NAVEGACION SCROLL BLOQUEADO */

.flechas-navegacion {
  position: absolute;
  bottom: 40px;
  left: 0px;
  z-index: 999;
  display: flex;
  gap: 20px;
}

.flechas-navegacion a {
  display: inline-block;
  width: 38px;
  height: 38px;
}

.flechas-navegacion .inactiva {
  pointer-events: none;
  opacity: 0.3;
  cursor: default;
}

/** PAGINA SERVICIOS **/

/* Alineacion texto hover cajas "Nuestro enfoque" */

.justificacion-texto-hover .jet-animated-box__content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}

.justificacion-texto-hover .jet-animated-box__title--back {
  margin-bottom: 1rem;
}

.justificacion-texto-hover .jet-animated-box__description--back {
  margin-top: auto;
  padding-bottom: 1rem;
  transition: opacity 0.3s ease;
}

/* Lista personalizada caja 1 "Nuestro enfoque" */

.lista-personalizada {
  list-style-position: inside;
  padding-left: 0;
  margin-bottom: 40px;
}

.lista-personalizada li {
  border-bottom: 1px solid rgba(67, 17, 35, 0.23); /* #431123 al 23% */
  padding: 0.75rem 0;
  margin: 0;
}

.lista-personalizada li:last-child {
  border-bottom: none;
}


/** PAGINA SOBRE NOSOTROS **/

/* Tipografia texto Matterplace */

span.texto-matterplace {
    font-family: 'Inter';
}

/* Ajuste css texto on scroll */

.scroll-parrafo-container {
  max-height: 500px;
  overflow-y: scroll;
  padding-top: 150px;
  padding-bottom: 500px;
  box-sizing: border-box;

  scrollbar-width: none;
}
.scroll-parrafo-container::-webkit-scrollbar {
  display: none;
}

.scroll-parrafo {
  color: rgba(245, 238, 232, 0.3);
  transition: color 0.4s ease;
}

.scroll-parrafo.visible {
  color: #FB5E4D;
}

@media (max-width: 768px) {
  .scroll-parrafo-container {
    max-height: 80vh;
    overflow-y: auto;
    scroll-behavior: smooth;
    padding-right: 16px; /* para evitar cortes */
  }
}