/* VARIABLES */
:root {
    --fontPrimary: "Poppins", sans-serif;    
    --colorBlue:#038DBB;     
    --colorPrimary:#3E3D3D; 
    --colorWhite:#FFFFFF;
    --colorGrey:#D6D6D6;
    --colorYellow: #EED531;
    --gradient:linear-gradient(to top, rgba(0, 0, 0, 0.4), transparent);
    --gradient-2:linear-gradient(to bottom, rgba(0, 0, 0, 0.4), transparent);
    --font-family-title: "Dancing Script", cursive;
    --font-weight-title: 700;
}
/* ESTILOS GENERICOS */
html{
    overflow-x:hidden;
}
.center{
    text-align: center; 
}
.left{
    text-align: left;
}
.right{
    text-align: right; 
}
.fontPrimary{
    font-family: var(--fontPrimary);
}
.fontTitle{
    font-family: var(--font-family-title);
    font-optical-sizing: auto;
    font-weight: var(--font-weight-title);
    font-style: normal;
}
.fontSecondary{
    font-family: var(--fontSecondary);
}
.colorPrimary{
    color:var(--colorPrimary);
}
.colorSecondary{
    color:var(--colorSecondary);
}
.colorYellow {
    color: var(--colorYellow);
}
.colorWhite {
    color: var(--colorWhite);
}
.white{
    color: var(--colorWhite);
}
.white:hover{
    color: #97c1f8;
}
a{
    text-decoration:none;
    color:var(--colorPrimary);
}
a:hover {
    color:var(--colorSecondary);
}
.img-responsive{
    width:100%;
    object-fit: cover;
    height: auto;
    filter: saturate(0.9);
}
/* Margins & Paddings */
.m0Auto{
    margin:0 auto;
}
.mTop10{
    margin-top: 10px;
}
.mTop20{
    margin-top: 20px;
}
.mTop40{
    margin-top: 40px;
}
.mTop60{
    margin-top: 60px;
}
.mTop120{
    margin-top: 120px;
}
.mTop240{
    margin-top: 120px;
}
.mBT20{
    margin-bottom:20px;
}
.mBT30{
    margin-bottom:30px;
}
.mBT40{
    margin-bottom: 40px;
}
.mBT60{
    margin-bottom: 60px;
}
.mBT120{
    margin-bottom: 120px;
}
.mBT240{
    margin-bottom: 240px;
}
.paddTop20{
    padding-top: 20px;
}
.paddBT20{
    padding-bottom: 20px;
}
.paddBT40{
    padding-bottom: 40px;
}
.paddTop40{
    padding-top: 40px;
}
.paddBT40{
    padding-bottom: 40px;
}
.paddTop60{
    padding-top: 60px;
}
.paddBT60{
    padding-bottom: 60px;
}
.paddTop120{
    padding-top: 120px;
}
.paddBT120{
    padding-bottom: 120px;
}
.paddTop200{
    padding-top:200px;
}
.paddBT200{
    padding-bottom:200px;
}
.paddR10{
    padding-right:10px !important;
}

/* Width */
.w35{
    width:35%;
}
.w40{
    width:40%;
}
.w50{
    width:50%;
}
.w60{
    width:60%;
}
.w70{
    width:70%;
}
.w80{
    width:80%;
}
.w90{
    width:90%;
}
.w100{
    width:100%;
}
.uppercase{
    text-transform: uppercase;
}
.bgGrey{
   border-bottom: 1px solid #f5f5f5;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}
.centered{
    justify-content:center;
}
/* Body & Headings */
body, .data-protection table {
    font-family:var(--fontPrimary);
    font-size:18px;
    font-weight:400;
    position:relative;
    overflow-x:hidden;
    color:var(--colorPrimary);
}

p{
   margin-bottom:0;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{
    margin-bottom: 0;
    text-wrap: balance;
}

h1, p.title{
    font-size:42px;
    font-weight:500;
    line-height: 42px;
    font-family: var(--fontPrimary);
    color: var(--colorBlue);
}
h2{
    font-size:30px;
    font-weight:500;
    line-height:normal;
    font-family: var(--fontPrimary);
    color: var(--colorBlue);
}
h3{
    font-size:24px;
    font-weight:500;
    line-height: normal;
    font-family: var(--fontPrimary);
}
.subtitle {
    font-size: 24px;
    font-weight:400;
    line-height: normal;
}

.container, .container-fluid, .row {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.editMode .header{
    position:relative;
}


/*BREADCRUMB*/
.breadcrumb{
    padding:10px 20px 0px 20px;
}

.breadcrumb-item {
    font-size:14px;
    font-family: var(--fontPrimary);
    color: var( --colorPrimary);
}
.breadcrumb-item.active{
    
    color: var(--colorBlue);
}



/* ZOOM IMAGES */
.zoom-hover {
    overflow: hidden;
    display: inline-block;
  
}

.zoom-hover img {
    display: block;
    width: 100%;
    height: auto;
    transition: transform 0.4s ease;
}

.zoom-hover:hover img {
    transform: scale(1.1);
}

/* INICIO - NAV CUSTOM DESKTOP */
 
    
.nav-bar-log .col {
    display: -webkit-box;        
    display: -ms-flexbox;        
    display: flex;   
    align-items: center;
}
.offcanvas.w-100 {
    width: 50% !important; 
}
.offcanvas-header {
    background-color: white;
}
.offcanvas-body {
    display: -webkit-box;        
    display: -ms-flexbox;        
    display: flex;   
    align-items: center;
    background-color: white;
}
.offcanvas-body .navbar-nav::before {
    content: "";
    display: block;
    width: 400px;
    height: 200px; /* ajusta según tu imagen */
    background-image: url('/dam/multiHotel-mariant/home/icons/logo-mariant-menu.svg');
    background-size: cover;
    background-position: center;
    margin-bottom: 120px;
    z-index: 1;
}
.offcanvas::before {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 1600px; /* ajusta según tu imagen */
    background-image: url('/dam/multiHotel-mariant/home/menu-mariant-hotels.webp');
    background-size: cover;
    background-position: center;
    z-index: 0;
    opacity: 0.8;
}


.offcanvas-header .btn-close {
    z-index: 3;
}
.offcanvas-body .dropdown.htt-language-selector{
    position:absolute;
    top:60px;
    right:20px;
}
.offcanvas-body .group-languages-texts .btn-secondary.open-selector-language,
.offcanvas-body .open-selector-language span:after{
    color:var(--colorBlue);
}
.navbar-nav {
	list-style-type: none;
	margin: 0;
	padding: 0;
    display: flex;
    justify-content: center !important;
    align-items: center;
}
.navbar-nav section {
    display: -webkit-box;        
    display: -ms-flexbox;        
    display: flex;   
    flex-direction: column;
    gap: 30px;
}
.navbar-toggler-icon {
    width: 2em;
    height: 2em;
}

.navbar-nav .nav-item {
	position: relative;
    display: -webkit-box;        
    display: -ms-flexbox;        
    display: flex;
    -webkit-box-pack: center;   
    -ms-flex-pack: center;      
    justify-content: center; 
    line-height: normal;
}
.menu-desktop .nav-item.dropdown{
    display:flex;
    flex-direction:column;
    align-items:center;
}
.menu-desktop .nav-item.dropdown ul{
    text-align:center;
}

.navbar-nav .nav-link {
	font-family: 'Poppins', sans-serif;
    font-size: 32px;
    font-weight: normal;
    color: #002554 !important;
    line-height: 80px;
	position: relative;
	z-index: 2;
	border: none;
	background: none;
	padding: 0;
    letter-spacing: 4px;
    font-weight: 500;
}

.navbar-nav .nav-link:hover {
	color: #000;
}

.navbar-nav .nav-link span a {
	text-decoration: none;
	color: inherit;
	position: relative;
	display: inline-block;
}

.navbar-nav .nav-link span a::before {
	content: '';
	width: 0%;
	height: 5px;
	background: var(--colorBlue);
	position: absolute;
	top: 37px;
	left: -5px;
	z-index: -1;
	transition: all 600ms cubic-bezier(1, 0, 0, 1);
}

.navbar-nav .nav-link:hover span a::before {
	width: 100%;
}

/*toogle submenu Hotel */

.offcanvas-body .dropdown .dropdown-toggle{
    background:none !important;
}

.offcanvas-body .dropdown-menu {
--bs-dropdown-border-color:none !important;
--bs-dropdown-link-hover-bg: none !important;
--bs-dropdown-bg: transparent !important;
font-family: 'Poppins', sans-serif !important;
text-transform: uppercase;


}
.dropdown-item {
    color: #002554 !important;
    margin-bottom:10px !important;
    letter-spacing: 2px;
    font-weight: 500;
}
.dropdown-item:hover {
    color: #002554 !important;
    font-weight: 700;
    background-color:transparent;
}

/*----end toogle submenu hotel-----*/


/*** Menu externo Desktop ***/
.menu-container {
    display: flex;
    align-items: center; 
    justify-content: center; 
    width: 100%;
    padding: 10px 20px;
}

.menu-externo{
     display: flex;
     gap: 32px; 
     justify-content: center;
     position: relative;
     top: 0;
     width: 100%;
     transition: all 0.3s ease-in-out;
}
.menu-externo > a,
.dropdown-hoteles > a {
    font-size: 20px;
}

.menu-externo > a:hover,
.dropdown-hoteles > a:hover {
    color:white;
}
.dropdown-hoteles a i {
    font-size: 12px; 
    margin-left: 5px; 
}

.dropdown-hoteles {
  position: relative;
  display: inline-block;
}

.dropdown-content-hoteles {
  display: none;
  position: absolute;
  background-color:rgba(252, 252, 252, 0.9);
  border-radius:12px;
  min-width: 300px;
  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
  z-index: 1;
}

.dropdown-content-hoteles a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  font-size: 14px;
  position:relative;
  transition: transform 0.3s ease-in-out;
  border-bottom: 1px solid #ccc; 
}

.dropdown-content-hoteles a:last-child {
  border-bottom: none;
}

.dropdown-content-hoteles a:hover {
 background-color: rgba(0, 153, 204, 0.4);
 
}
.dropdown-content-hoteles a:hover span {
    transform: translateX(10px);
    transition: transform 0.3s ease-in-out;
    display: inline-block; 
}

.dropdown-hoteles:hover .dropdown-content-hoteles {
  display: block;
}

.stars{
    color: gold;
}

/*sticky Menu Externo*/

.menu-container.sticky {
    justify-content: space-between; /* Ahora imagen izquierda y menú a la derecha */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: white;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
    padding: 10px 20px;
    z-index: 1000;
}

.menu-container.sticky a{
    color:black;
    font-size: 16px;
}

.menu-container.sticky .menu-externo > a,
.menu-container.sticky .dropdown-hoteles > a {
  font-size: 16px;
  margin-top:2px;
}


.menu-container.sticky .imagotipo {
    display: block;
}

.imagotipo {
    display: none;
}

.menu-container.sticky .menu-externo {
    justify-content: flex-end; /* Alinea el menú a la derecha */
}


/*end Menu externo Desktop*/

@media (max-width: 767px) {
    .navbar-nav .nav-item{
        flex-direction:column;
        
    }
    .menu-interno{
        margin-top:10px;
    }
 }


/* FIN - NAV CUSTOM DESKTOP */


/* INICIO - HEADER */
.header{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    background:transparent !important;
    z-index:4;
    padding: 5px 60px 0 60px;
}
.header .row {
    align-items: center;
    margin-top: -40px;
}
.editMode .header .row{
    margin-top:0;
}
#buttonShowSearcherMobile {
    background-color: var(--colorBlue) !important;
    color: #FFFFFF !important;
    border-radius: 50px;
    
}
#buttonShowSearcherScroll {
    background-color: var(--colorBlue) !important;
    top:10% !important;
}
/* 1 - Menu Hamburguesa */
.navbar {
    --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.open-selector-language span:after{
    position: absolute;
    top: 8px;
    right: 0;
    font-size: 8px;
    content: "\f078";
    font-family: 'FontAwesome';
    color:var(--colorWhite);
}
.dropdown.htt-language-selector {
    display: inline;
}
/* 3 - Logo Hotel */
.logo-navbar img {
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    transform-origin: center; /* Asegura que el crecimiento sea desde el centro */
    image-rendering: optimizeSpeed;
    background-size: contain;
    background-repeat: no-repeat;
    height: 250px;
    width: 300px;
}

/* FIN - HEADER */

/* INICIO - HERO BANNER CABECERA */
.grid-motor{
    position:absolute;
    bottom:-20px;
    width:100%;
    z-index:3;
}

.cabecera-motor {
    position: relative;
}
.container-hero img.img-responsive{
    height: 100vh;
}
.container-hero video {
    width: 100%;
    height: 100vh;
    object-fit: cover;
    display: block; 
    margin: 0;
    padding: 0;
}
.cabecera-motor.home .container-hero img.img-responsive{
    height: 100vh;
}

.container-hero::before {
    content: "";
    position: absolute;
    background: var(--gradient-2);
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.containerTxtSlide p{
    font-size: 52px; /* Edit:  Font Size*/
    font-style: normal;
    line-height:1.2em;
    padding-top:40px;
}
.containerTxtSlide {
    position: absolute;
    top: 30%; /* Edit:  Posicion Titulo Hero*/
    width:100%;
    z-index:2;
}
@media (max-width: 767px) {
    .containerTxtSlide p{
        font-size: 32px; /* Edit:  Font Size*/
    }
    .header{
        background-color: var(--colorBlue);
    }
    .offcanvas-body .navbar-nav::before {
        width: 200px;
        height: 100px; 
        margin-bottom: 30px;
    }
    .navbar-nav .nav-link {
        font-size: 24px;
        line-height: 60px;
    }
    
    row  .personLogin {
    --bs-gutter-x: 0rem;
    }
    .personLogin-content::after {
        content: "";
    }
    .personLogin-content{
        border: none;
    }
}
/* FIN - HERO BANNER CABECERA */

/* VENTAJAS */

.ventajas-wrapper {
    background-color: #f0f0f0;
    padding: 30px 20px;
    font-family: Arial, sans-serif;
}

.ventajas-inner {
   max-width: 1440px;
   overflow: hidden;
   margin: 0 auto;
}
.ventajas-scroll-wrapper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;

  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE */
  
}

.ventajas-scroll-wrapper::-webkit-scrollbar {
  display: none; /* Chrome, Safari */
  
  }
.ventajas-contenido {
  display: flex;
  gap: 20px;
  width: max-content;
  min-width: 100%;
  scroll-snap-align: start;
  margin: 0;
  padding: 0;
}

.ventajas-contenido::-webkit-scrollbar {
  display: none; /* Chrome, Safari y Edge */
}

.ventaja-mensaje {
  flex: 0 0 auto;
  min-width: 250px;
  margin-right: 40px;
}

.ventaja-mensaje p {
  margin: 0;
  color: #111;
  font-size:15px;
  
}

.ventaja-mensaje strong {
    display: block;
    font-size:15px;
 }

.ventaja-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  flex: 0 0 auto;
  min-width: 200px;
  color: #111;
  scroll-snap-align: start;
}
.ventaja-item p{
   font-size:15px; 
}

.ventaja-item img {
  width: 54px;
  height: 54px;
  object-fit: contain;
  margin-top: 2px;
  flex-shrink: 0;
}

.ventaja-item p {
  margin: 0;
  line-height: 1.4;
}

/* No se necesita media query porque ya se adapta con scroll */




/* End VENTAJAS */

/* INICIO - HOME CORPORATIVA*/

/* Banner circle yellow (Hotel Section V2) */
.srr-hero {
      position: relative;
      width: 100%;
      height: 100vh;
      background: url('/dam/multiHotel-mariant/home/banner-hotels-mariant-hotels.webp') no-repeat center center/cover;
      overflow: hidden;
    }

    .circle-overlay {
      position: absolute;
      top: -350px; 
      left: 50%;
      transform: translateX(-50%);
      width: 700px;
      height: 700px;
      border-radius: 50%;
      background-color: rgb(238, 213, 49, 0.7);
      display: flex;
      align-items: flex-end;
      justify-content: center;
      text-align: center;
      padding:50px 80px;
      transition: background-color 0.3s ease;
    }

   .circle-overlay p {
      color: #333;
      font-size: 18px;
      line-height: 1.7;
      margin: 0;
      transition: transform 0.3s ease, color 0.3s ease;
    }

    .circle-overlay:hover p {
      transform: translateY(-8px);
      color: #111;
    }

    @media (max-width: 767px) {
      .circle-overlay {
        top: 0;
        transform: none;
        left: 0;
        width: 100%;
        height: auto;
        border-radius: 0 0 30px 30px;
        padding: 20px;
        align-items: center;
      }

      .circle-overlay:hover p {
        transform: none; /* Eliminar la animación vertical en móviles */
      }
    }

.vertical-line {
    border-left: 1px solid #7070707a;
    height: 100px;
    position: relative;
    left: 50%;
    top: 0;
    margin-bottom: 16px;
}

.swiper-button-prev, .swiper-button-next{
    color:white !important;
}

/* 1 - Welcome */
.title-between {
    display: -webkit-box; 
    display: -ms-flexbox;  
    display: flex;

    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;

    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.title-center {
    display: -webkit-box; 
    display: -ms-flexbox;  
    display: flex;

    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;

    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;

    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: center;
}
.title-center p:nth-of-type(2) {
     margin-top: 16px;
}

.title-fix{
    align-items: flex-start;
}

@media (max-width: 767px) {
    .title-between {
      display: block;
    }
    .title-fix{
     justify-content: center;
    }
    .title-between-fix h2 {
      text-align: center;
      align-self: center !important;
      margin-bottom: 20px;
    }

    .title-between p {
      text-align: justify;
    }
    .title-center h2 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      margin-bottom:20px;
    }
    .title-between > .w70,
    .title-between > .w60,
    .title-between > .w50 {
        width: 100%;
    }
    .title-center .w80,
    .title-center .w70,
    .title-center .w60 {
        width: 100%;
        
    }
  
}

/* 2 - Hotel Section */
.offer-section .button-hotel,
.hotel-section .button-hotel {
    position: absolute;
    width: 100%;
    bottom: 10%;
    display: -webkit-box;      
    display: -ms-flexbox;      
    display: flex;             
    -webkit-box-pack: center;  
    -ms-flex-pack: center;     
    justify-content: center;
    z-index: 2;
}
.offer-section .card-hotel,
.hotel-section .card-hotel {
    position: relative;
    overflow: hidden;
}
.offer-section .card-hotel::after,
.hotel-section .card-hotel::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50%;
    background: var(--gradient); /* Gradiente aplicado correctamente */
    pointer-events: none;
    z-index: 1;
}
.experience .more-experience a.link-more,
.offer-section a.link-more,
.destination-section a.link-more,
.hotel-section .button-hotel a.link-hotel {
    position: relative; /* Añadido para que z-index funcione */
    text-decoration: none;
    font-size: 16px;
    color: var(--colorWhite);
    background: transparent;
    border: 1px solid var(--colorWhite);
    border-radius: 50px;
    padding: 8px 64px;
    letter-spacing: 0.5px;
    transition: background 0.3s ease-in-out, border 0.3s ease-in-out, color 0.3s ease-in-out;
    z-index: 5; /* El enlace por encima del contenedor */
    display:flex;
    justify-content: center;
    align-items: center;
    width: 270px;
}
a.link-more:hover, 
.offer-section a.link-more:hover,
.experience .more-experience a.link-more:hover,
.destination-section a.link-more:hover,
.hotel-section .button-hotel a.link-hotel:hover {
    color: var(--colorWhite);
    background: var(--colorBlue);
    border: 1px solid var(--colorBlue);
}
.hotel-section h3 {
    font-family: var(--fontPrimary);
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -1.2px;
}
.hotel-section .fa-star {
    color: var(--colorYellow);
}
/* 3 - Offers Section */
a.link-more, 
.offer-section a.link-more,
.transfer-section a.link-more {
    text-decoration: none;
    font-size: 16px;
    color: var(--colorBlue);
    background: transparent;
    border: 1px solid var(--colorBlue);
    border-radius: 50px;
    padding: 8px 64px;
    letter-spacing: .5px;
  transition: background .3s ease-in-out,
              border-color .3s ease-in-out,
              color .3s ease-in-out;
}
a.link-more:hover,
a.link-more:focus-visible {
  background: var(--colorBlue);   
  color: #fff;
  border-color: var(--colorBlue); 
}


.room-section a.btn-book,
.offer-section a.btn-book {
    background: var(--colorBlue);
    color: var(--colorWhite);
    font-size: 16px;
    border: 1px solid var(--colorBlue);
    border-radius: 50px;
    padding: 8px 64px;
    letter-spacing: 0.5px;
    transition: background 0.3s ease-in-out, border 0.3s ease-in-out, color 0.3s ease-in-out;
    display:flex;
    width:250px;
    align-items: center;
    justify-content: center
}


.offer-section a.btn-book:hover {
    transform: scale(1.1);
}

/* 5 - Experience Section */
.experience {
    position: relative;
    cursor: pointer;
    overflow: hidden;
}

.experience .img-experience {
    position: relative;
    height: 100%;
}

.experience .img-experience img {
    object-fit: cover;
    height: 100%;
    transition: transform 0.4s ease-in-out;
}

.experience:hover .img-experience img {
    transform: scale(1.1);
}

.img-experience::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
    transition: background 0.4s ease-in-out;
}

.experience:hover .img-experience::after {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0));
}

.experience .text-experience {
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: -webkit-box;        
    display: -ms-flexbox;        
    display: flex;               

    -webkit-box-orient: vertical; 
    -webkit-box-direction: normal; 
    flex-direction: column;      

    -webkit-box-pack: end;       
    -ms-flex-pack: end;          
    justify-content: flex-end;
    padding: 60px;
    transition: .3s all;
}
@media (max-width: 1250px) {
    .experience .text-experience {
        padding: 40px 20px;
    }
}

/* Titular y texto siempre visibles */
/* Titular y texto siempre visibles */
.experience .text-experience h3 {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 10px;
    transform: translateY(0);
    transition: transform 0.3s ease-in-out;
}
.experience .text-experience h2{
    font-size: 30px;
    font-weight: 600;
    margin-bottom: 10px;
    transform: translateY(0);
    transition: transform 0.3s ease-in-out;
}

.experience .text-experience p {
    font-size: 16px;
    font-weight: 300;
    margin-bottom: 0;
    letter-spacing: 0.3px;
    transform: translateY(0);
    transition: transform 0.3s ease-in-out;
}
.experience .text-experience i {
    font-size: 45px;
    color: var(--colorWhite);
    transform: translateY(0);
    transition: transform 0.3s ease-in-out;
}
.experience:hover .text-experience i {
    color: var(--colorBlue);
}
/* El botón oculto inicialmente */
.experience .more-experience {
    display: none;
    transform: translateY(10px);
    transition: transform 0.3s ease-in-out;
}

/* En hover, el título y el texto suben y aparece el botón */
.experience:hover .text-experience i,
.experience:hover .text-experience h2,
.experience:hover .text-experience h3,
.experience:hover .text-experience p {
    transform: translateY(-30px);
}

.experience:hover .more-experience {
    display: block;
    transform: translateY(0);
}
.experience-section .row .htt-text-image,
.service-section .row .htt-text-image {
    margin-bottom: 20px;
}
.swiper.hidden-bullets .swiper-pagination,
.swiper.hidden-bullets .swiper-pagination-bullets,
.swiper.hidden-bullets .swiper-pagination-custom,
.swiper.hidden-bullets .swiper-pagination-fraction {
  display: none !important;
}

@media (max-width: 767px) {
    .transfer-section .row .htt-text-image,
    .destination-section .row .htt-text-image,
    .offer-section .row .htt-text-image,
    .experience-section .row .htt-text-image,
    .service-section .row .htt-text-image {
        margin-bottom: 20px;
    }
  a.link-more{
      margin-top:20px;
  }  
    
}
/* FIN - HOME CORPORATIVA */

/* INICIO - PAGINA FICHA HOTEL */
/* 1 - Custom menu */
.logo-hotel {
    width: 200px;
}
.custom-menu {
    background-color: #E5F7FD;
    border-radius: 8px;
}

.custom-menu.clients{
    display:flex;
    justify-content: center;
    padding-top:10px;
}
.custom-menu ul {
    display: flex;
    flex-direction: row;
    list-style: none;
    justify-content: space-between;
    padding: 12px 6px;
    transition: opacity 0.3s;
}
.custom-menu__item {
    padding: 16px 36px;
}
.custom-menu__item.active {
    color: #ffffff;
    background-color: var(--colorBlue);
    padding: 8px 32px;
    border-radius: 8px;
}
.custom-menu__item.active:hover {
    color: #ffffff;
}
.custom-menu ul a:hover {
    color: var(--colorBlue);
}
.custom-menu:hover a:not(:hover) {
    opacity: 0.5;
}

/* 1 - Custom menu versión 2 */

.menu-mariant {
    border-radius: 0;
    padding-top: 10px;
    display: flex;
    justify-content: center;
    background-color: white;  
    transition: box-shadow 0.3s ease;
    position: relative;
    z-index: 10;
}

.menu-mariant.sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
    padding-bottom:20px;
    padding-top:20px;
}


.menu-mariant ul {
    display: flex;
    flex-direction: row;
    list-style: none;
    padding: 0;
    margin: 0;
    align-items: center;
}

.menu-mariant__item {
    padding: 12px 24px;
    color: var(--colorPrimary);
    text-decoration: none;
    font-size: 16px;
    font-weight: 500;
    position: relative;
    white-space: nowrap;
    border: 2px solid transparent;
    border-radius: 0;
    transition: color 0.3s, border 0.3s, border-radius 0.3s;
}
.menu-mariant li {
    position: relative;
    padding-right: 8px;
    padding-left: 8px;
}
/* Línea vertical entre ítems */
.menu-mariant li:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 25%;
    height: 50%;
    width: 1px;
    background-color: var(--colorPrimary);
}

/* Hover */
.menu-mariant__item:hover {
    color: var(--colorBlue);
    border: 2px solid var(--colorBlue);
    border-radius: 50px;
}

/* Activo */
.menu-mariant__item--active {
    color: #038dbb;
    border-radius: 50px;
    font-weight: 500;
    border: solid 2px #038dbb;
}

/*COMO LLEGAR*/

 .location-wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
  max-width: 900px;
  margin: 0 auto;
  padding: 40px 20px;
  text-align: center;
  justify-content: center;
}

.location-item {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.location-item img {
  max-width: 60px;
  margin-bottom: 10px;
}

.location-title {
  font-size: 16px;
  color: var(--colorPrimary);
  margin: 0;
  font-weight:600;
}

.location-distance {
  font-size: 16px;
  font-weight: 500;
  color: var(--colorPrimary);
  margin: 4px 0 0;
}


@media (max-width: 2400px) {
    .tab-section .container-fluid.w50 {
        width: 60%;
        transition: width .5s ease;
    }
}
@media (max-width: 2000px) {
    .tab-section .container-fluid.w50 {
        width: 70%;
        transition: width .5s ease;
    }
}
@media (max-width: 1700px) {
    .tab-section .container-fluid.w50 {
        width: 90%;
        transition: width .5s ease;
    }
}
@media (max-width: 1300px) {
    .custom-menu__item {
        padding: 0;
        transition: width .5s ease;
    }
}

/* Style Dropdown Menu Multi Hotel*/
.dropdown .dropdown-toggle {
    width: 100%;
    border-radius: 20px;
    background: var(--colorBlue);
    transition: border-radius 0.3s ease-in-out;
}
.dropdown-menu.show {
    display: block;
    width: 100%;
    /*border-radius: 20px;*/
    margin-top: 4px;
    text-align: center;
    /*transition: border-radius 0.3s ease-in-out;*/
}
.dropdown-menu {
    padding: 20px 0;
}
.dropdown-menu.item-active {
    background-color: var(--colorBlue);
}
.menu-select-mobile .dropdown-menu{
    width:100%;
}
@media (max-width: 767px) {
    .custom-menu {
        background-color: transparent;
    }
}
/* 2 - Room card */
.card-room {
    display: grid;
    grid-template-columns: 2fr 1fr; /* 2 partes + 1 parte = 3 partes */
    align-items: center;
    gap: 40px;
    margin-right: 1px;
    margin-left: 1px;
}

.swiper-rooms .swiper-button-prev, 
.swiper-rooms .swiper-button-next {
   color: var(--colorBlue) !important;
   
}

@media (max-width: 1024px){
 .swiper-rooms .swiper-button-prev, 
 .swiper-rooms .swiper-button-next {
  top: var(--swiper-navigation-top-offset, 25%) !important;
   
  }
}

.img-room {
    flex: 2;
}

.text-room {
    flex: 1;
}
.grid-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 2 columnas */
    list-style: none;
    padding: 0;
    gap: 4px;
    margin: 10px 0 6px 0;
    width: 100%; /* Hace que la lista ocupe solo 2 de 4 columnas */
}
.grid-list li {
    list-style: none;
    position: relative;
    padding-left: 10px;
}
.grid-list li.custom-icon::before {
    content: "›";
    position: absolute;
    left: 0;
    color: var(--colorPrimary);
    font-weight: bold;
    transition: background-color 0.3s ease-in-out;
}

.grid-list li.ver-servicios::after {
    content: "▼"; /* Flecha apuntando hacia abajo */
    margin-left:5px;
    vertical-align: 2px;
    font-size: 10px; /* Tamaño más pequeño */
    color: var(--colorBlue);
    font-weight: bold;
    transition: transform 0.3s ease-in-out;
}

.grid-list li.ver-servicios:hover::after {
    animation: bounce 0.6s 3 alternate ease-in-out;
}
.generating-payments-list {
    list-style-type: none;
}

.generating-payments-list li {
    position: relative;
}

.generating-payments-list li:before {
    position: absolute;
    top: 0;
    left: -33px;
    margin: auto;
    font-size: 18px;
    font-family: FontAwesome;
}

.generating-payments-list .loading:before {
    content: '\f110';
    color: var(--colorYellow);
    animation: loading 1.2s linear infinite;
}

.generating-payments-list .success:before {
    content: '';
    left: -56px;
    width: 64px;
    height: 44px;
    top: -8px;
    animation: tickPop 0.4s;
    background: url(/dam/multiHotel-mariant/home/icons/check.png) no-repeat left top / 2900%;
    animation: tickPop 1s steps(28) forwards;
}

@keyframes tickPop {
    from { background-position: left top; }
    to { background-position: right top; }
}

@keyframes loading {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes tick {
    0% { -webkit-transform: scale(1.4) rotate(-35deg); }
    30% { -webkit-transform: rotate(30deg); }
    60% { -webkit-transform: scale(1) rotate(-20deg); }
    70% { -webkit-transform: rotate(10deg); }
    100% { -webkit-transform: rotate(0deg); }
}


@keyframes bounce {
    0% { transform: translateY(0); }
    100% { transform: translateY(3px); }
}
@media (max-width: 1200px) {
    .card-room {
        display: flex;
        -webkit-flex-direction: column; 
        -ms-flex-direction: column;   
        flex-direction: column; 
    }
    /*.swiper-rooms .swiper-wrapper{
        max-height:none !important;
    }*/
}

/* FIN - PAGINA FICHA HOTEL */
/* INICIO - PAGINA EXPERIENCIA */
.offer-section .container-fluid.w60 .row,
.offer-section .container-fluid.w70 .row,
.offer-section .container-fluid.w80 .row,
.room-section .container-fluid.w60 .row,
.room-section .container-fluid.w70 .row,
.room-section .container-fluid.w80 .row,
.service-section .container-fluid.w60 .row,
.service-section .container-fluid.w70 .row,
.service-section .container-fluid.w80 .row,
.experience-section .container-fluid.w60 .row,
.experience-section .container-fluid.w70 .row,
.experience-section .container-fluid.w80 .row {
    align-items: stretch;
}
.offer-section .col-12.col-sm-12.col-md-6.col-lg-6.col-xl-7.col-xxl-7,
.offer-section .col-12.col-sm-12.col-md-6.col-lg-6.col-xl-5.col-xxl-5,
.service-section .col-12.col-sm-12.col-md-6.col-lg-6.col-xl-7.col-xxl-7,
.service-section .col-12.col-sm-12.col-md-6.col-lg-6.col-xl-5.col-xxl-5,
.experience-section .col-12.col-sm-12.col-md-6.col-lg-6.col-xl-7.col-xxl-7,
.experience-section .col-12.col-sm-12.col-md-6.col-lg-6.col-xl-5.col-xxl-5,
.room-section .col-12.col-sm-12.col-md-6.col-lg-6.col-xl-5.col-xxl-5 {
    display: flex;
}
.offer-section .htt-text-image,
.service-section .htt-text-image,
.experience-section .htt-text-image,
.room-section .htt-text-image {
    flex: 1;
}
.offer-section .info-experience,
.service-section .info-experience,
.experience-section .info-experience,
.experience-section .info-experience {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}
/* 6 - Destination Section */
.destination-section .text-destination {
    position: absolute;
    padding: 60px;
    width: 100%;
    top: 0;
    z-index: 2;
}
.destination-section .card-destination::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--gradient-2); /* Gradiente aplicado correctamente */
    pointer-events: none;
    z-index: 1;
}
.destination-section h3 {
    font-size: 40px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.no-grow {
    flex: 0 1 auto; /* No permite que el botón crezca ni se reduzca */
    width: fit-content; 
}
@media (max-width: 767px) {
    .destination-section .text-destination {
        padding: 20px;
    }
    .destination-section .card-destination {
        height: 70vh;
    }
    .destination-section .card-destination img {
        height: 100%;
    }
    .destination-section p.w50 {
        width: 100%;
    }
    .img-ratio {
        aspect-ratio: 4 / 5;
    }
}
/* FIN - PAGINA EXPERIENCIA */
/* INICIO - PAGINA SERVICIOS */
.service-section a.link-services {
    text-decoration: none;
    font-size: 16px;
    color: var(--colorBlue);
    position: relative;
    display: inline-block;
    padding: 0;
    border: none;
}
.service-section a.link-services::after {
    content: ' >';
    display: inline-block;
    transition: transform 0.3s ease;
    margin-left: 4px;
}

.service-section a.link-services:hover::after {
    animation: bounce-right 0.5s ease forwards;
}

@keyframes bounce-right {
    0% {
        transform: translateX(0);
    }
    30% {
        transform: translateX(4px);
    }
    60% {
        transform: translateX(2px);
    }
    100% {
        transform: translateX(6px);
    }
}
/* FIN - PAGINA SERVICIOS */
/* INICIO - PAGINA GALERIA */
.nav-tabs {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}
.nav-link {
    color: var(--colorBlue);
    transition: width .5s ease;
}
.nav-link:hover {
    color: var(--colorBlue);
    font-weight: 600;
}
.lightbox .image {
    transition: .3s all;
}

/* FIN - PAGINA GALERIA */
/* INICIO - PAGINA CONTACTO */
.contact-section .card-contact::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    pointer-events: none;
    z-index: 1;
}
.contact-section .text-contact {
    position: absolute;
    padding: 60px;
    width: 100%;
    top: 0;
    z-index: 2;
    width: 50%;
    left: 50%;
    transform: translateX(-50%);
}
.contact-section .card-icon {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: center;
    gap: 10px;
}
.contact-section .card-content {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.form-wrapper .form-row {
    display:flex;
    flex-direction:column;
}
.form-wrapper .form-row label{
    color:var(--colorPrimary);
    margin:5px 0;
}
.grecaptcha-logo{
    margin-top:20px;
}
/* Clases formulario */
.form-wrapper .form-item:has(.user-success){
    margin-top:12px;
}
.form-wrapper .form-row input:not(.form-wrapper .form-row input[type=checkbox]),.form-wrapper .form-row textarea{
    width:100%;
    border:none;
    border-bottom:1px solid var(--colorBlue);
    background:transparent;
}
.form-wrapper select {
    width:100%;
    border:none;
    border-bottom:1px solid var(--colorBlue);
    background:transparent;
    margin-top: 20px;
    margin-bottom: 20px;
}
.form-wrapper .button-wrapper{
    min-width:350px;
    display:inline-block;
}
.form-wrapper .button-wrapper input[type=submit]{
    width:100%;
    background:var(--colorBlue);
    color:#fff;
    padding:16px;
    margin-top:30px;
    border:none;
}
.form-wrapper label[for=aceptar]:first-child{
    display:block;
    margin-top:20px;
    opacity:0;
}
@media (max-width: 767px) {
    .contact-section .text-contact {
        padding: 20px;
        width: 100%;
    }
    .text-contact.gap-5 {
        gap: 0.5rem !important;
    }
    .card-contact img {
        height: 400px;
    }
}
/* FIN - PAGINA CONTACTO */
/* INICIO - PAGINA HABITACIONES */
.swiper-rooms .swiper-wrapper {
    margin-bottom: 50px;
    max-height: 675px;
}

.swiper-rooms .swiper-pagination {
    position:relative !important;
    margin-top:20px;
}

@media (max-width: 1440px) {
    .swiper-rooms .swiper-pagination {
        position: relative !important;
        /*top: -200px;*/
    }
}
.swiper-img-rooms {
    height: 100%;
}
.swiper-img-rooms{
   max-height: 521px; 
}
.swiper-img-rooms .swiper-slide {
    height: auto;
}
.swiper-img-rooms .img-responsive {
    height:100%;
}
.room-section h2 {
    letter-spacing: -1px;
}
.offer-section .row>*, 
.service-section .row>*, 
.experience-section .row>*, 
.room-section .row>* {
    padding-right: calc(var(--bs-gutter-x)* 1);
    padding-left: calc(var(--bs-gutter-x)* 1);
}
.offer-section.home .row>*, 
.service-section.home .row>*, 
.experience-section.home .row>*, 
.room-section.home .row>* {
    padding-right: calc(var(--bs-gutter-x)* .5);
    padding-left: calc(var(--bs-gutter-x)* .5);
}
.swiper-img-rooms .swiper-pagination-fraction {
    color: var(--colorBlue);
}
.swiper-img-rooms .swiper-button-prev:after,
.swiper-img-rooms .swiper-button-next:after {
    font-size: 35px !important;
    color: var(--colorBlue);
}
.info-room {
    display: flex;
    flex-direction: column;
    gap: 1rem; /* Espaciado entre elementos */
    justify-content: center;
    height: 100%;
}
.price-btn-book {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    gap: 1rem; /* Espaciado entre elementos */
    transition: gap 0.3s ease-in-out;
}
/* ----> VER MAS HABITACIONES */

@media (max-width: 1500px) {
  .grid-list li:not(.ver-servicios) {
    display: none;
    cursor: pointer;
    margin-bottom: 5px;
  }

    .grid-list.open-list{
      display:block;
   } 
   
  .grid-list li.active {
    display: block;
  }
 

  .grid-list li.ver-servicios {
    cursor: pointer;
    color: var(--colorBlue); 
    font-weight: 500;
    position: relative;
  }

  .grid-list li.ver-servicios::after {
    content: "▼";
    margin-left: 5px
    vertical-align: 2px;
    font-size: 10px;
    color: var(--colorBlue);
    font-weight: bold;
    transition: transform 0.3s ease-in-out;
  }

  .grid-list li.ver-servicios:hover::after {
    animation: bounce 0.6s 3 alternate ease-in-out;
  }
}

@media (min-width: 1501px) {
  .grid-list li {
    display: list-item !important; 
  }
  .grid-list li.ver-servicios{display:none !important;}
   
  .grid-list li.ver-servicios::after {
    display: none !important; /* Ocultamos la flecha */
  }
}



/* Cambiar a fila en pantallas más grandes */
@media (max-width: 1300px) {
    .grid-list,
    .info-room {
        gap: 0;
    } 
}
@media (max-width: 767px) {
    .offer-section .row>*, 
    .service-section .row>*, 
    .experience-section .row>*, 
    .room-section .row>* {
        padding-right: calc(var(--bs-gutter-x)* .5);
        padding-left: calc(var(--bs-gutter-x)* .5);
    }
    .swiper-img-rooms {
        max-height: 266px;
    }
}
@media (min-width: 767px) {
    .price-btn-book {
        flex-direction: row;
    }
}
/* FIN - PAGINA HABITACIONES */
/* INICIO - PAGINA FAQS */
.accordion-button:not(.collapsed) {
    background-color: #038dbb4d;
}
.accordion-body {
    background-color: #f8f8f8;
}
/* FIN - PAGINA FAQS */
/* INICIO - FOOTER */
.footer {
    background-color: var(--colorPrimary);
}
/* 1 - Logo footer */
.logo-footer {
    max-width: 450px;
}
/* 2 - Listado links footer */
.list-footer {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.footer-section ul li:first-child {
    font-weight: 600;
    color: rgba(255, 255, 255,1);
}
.footer-section a,
.footer-section ul li a,
.footer-section ul li {
    color: rgba(255, 255, 255,0.8);
    transition: color 0.3s ease-in-out;
    text-align: center;
    list-style: none;
    line-height: 30px;
}
.contact-section a:hover, 
.footer-section a:hover,
.footer-section ul li a:hover {
    color: var(--colorBlue);
}
.nap {
    color: rgba(255, 255, 255,0.8);
    line-height: 30px;
}
.nap span {
    color: rgba(255, 255, 255,1);
    font-weight: 600;
}
a .fa-envelope,
a .fa-phone {
    margin-right: 8px;
}
a:hover .fa-phone {
    animation: fa-shake 1s infinite;
}

a:hover .fa-envelope {
    animation: fa-bounce 1s infinite;
}
/* 3 - Pie Copyright Hotetec */
.fa-heart {
    color: var(--colorBlue);
}
.social-container {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
  }
  .social-links {
    display: flex;
  }
  
.social-links a {
    width: 40px;
    height: 40px;
    text-align: center;
    text-decoration: none;
    color: white;
    background: rgba(255, 255, 255, .1);
    box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.05);
    margin: 0 30px;
    border-radius: 50%;
    position: relative;
    overflow: hidden;
    transition: transform 0.5s;
  }
  
  .social-links a .fab {
    font-size: 20px;
    line-height: 40px;
    position: relative;
    z-index: 10;
    transition: color 0.5s;
  }
  
  .social-links a::after {
    content: '';
    width: 100%;
    height: 100%;
    top: -90px;
    left: 0;
    background: #000;
    background: linear-gradient(-45deg,#FBDE52, #c3a825);
    position: absolute;
    transition: 0.5s;
  }
  
  .social-links a:hover::after {
    top: 0;
  }
  
  .social-links a:hover .fab {
    color: #fff;
  }
  
  .social-links a:hover {
    transform: translateY(-10px);
  }
  
@media (max-width: 767px) {
    .footer-section ul {
        padding: 0;
    }
}
/* FIN - FOOTER */

/* CODIGO ESPECIFICO DE MARIANT - SOL AMARILLO */
.fa-circle,
.fa-star{
    color: var(--colorYellow);
}
.fa-circle {
    margin-top: 14px;
    margin-right: 8px;
}
@media (max-width: 767px) {
    .fa-circle {
        margin-top: 8px;
    }
}
.swiper-welcome,
.swiper-welcome  swiper-wrapper {
    max-height: 900px;
}
.swiper-welcome .swiper-pagination-fraction {
    color: var(--colorWhite);
}
.swiper-welcome .swiper-button-prev:after,
.swiper-welcome .swiper-button-next:after {
    font-size: 20px !important;
    color: var(--colorWhite);
}
.swiper-welcome .htt-swiper-buttons-wrapper {
    position: absolute;
    bottom: var(--swiper-pagination-bottom, 31px);
    top: var(--swiper-pagination-top, auto);
    width: 6%;
    right: 26%;
}
.swiper-welcome .swiper-pagination-fraction {
    bottom: var(--swiper-pagination-bottom, 20px);
    top: var(--swiper-pagination-top, auto);
    width: 100%;
    left: -22%;
}
.swiper-welcome .swiper-slide::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%; /* Ajusta si quieres que la sombra cubra solo una parte */
    background: linear-gradient(to top, rgba(0, 0, 0, 0.4) 0%, transparent 30%);
    pointer-events: none; /* Para que no afecte la interacción con la imagen */
}

.grid-swiper-mobile {
    padding-bottom: 20px !important;
}
.swiper-img-rooms .swiper-pagination-bullets {
    bottom: 0 !important;
}

.swiper-img-rooms .swiper-pagination-bullet{
   
    opacity: var(--swiper-pagination-bullet-inactive-opacity, .8);
}


.swiper-scrollbar {
    display: none;
}
/* Animación contacto */
.pulsating-circle {
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    width: 15px;
    height: 15px;
  }
  
  .pulsating-circle::before {
    content: '';
    position: relative;
    display: block;
    width: 300%;
    height: 300%;
    box-sizing: border-box;
    margin-left: -100%;
    margin-top: -100%;
    border-radius: 45px;
    background-color: rgba(238, 213, 49, 0.4); /* Transparente */
    animation: pulse-ring 1.25s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;
  }
  
  .pulsating-circle::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    width: 100%;
    height: 100%;
    background-color: #EED531; /* Color sólido */
    border-radius: 15px;
    /* box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);*/
    animation: pulse-dot 1.25s cubic-bezier(0.455, 0.03, 0.515, 0.955) -0.4s infinite;
  }
  
  @keyframes pulse-ring {
    0% {
      transform: scale(0.33);
    }
    80%,
    100% {
      opacity: 0;
    }
  }
  
  @keyframes pulse-dot {
    0% {
      transform: scale(0.8);
    }
    50% {
      transform: scale(1);
    }
    100% {
      transform: scale(0.8);
    }
  }
@media (max-width: 767px) {
    .logo-navbar img{
        width:150px;
        height:100px;
    }
    .mBT60 {
        margin-bottom: 30px;
    }
    .mTop60{
        margin-top: 30px;
    }
    .mBT240,
    .mBT120 {
        margin-bottom: 30px;
    }
    .mTop240,
    .mTop120 {
        margin-top: 30px;
    }
    .swiper-welcome .swiper-pagination-fraction {
        left: -30%;
    }
    .swiper-welcome .htt-swiper-buttons-wrapper {
        width: 18%;
        right: 10%;
    }
   
   
}




/* INICIO - AJUSTES WIDTH RESPONSIVE GRIDSYSTEM */
@media(max-width: 1970px) {
    section .container-fluid.w50,
    section .container-fluid.w60,
    section .container-fluid.w70 {
        width: 80%;
        transition: width .5s ease;
    }
}

@media(max-width: 1366px) {
    section .container-fluid.w50,
    section .container-fluid.w60,
    section .container-fluid.w70,
    section .container-fluid.w80 {
        width: 90%;
        transition: width .5s ease;
    }
}
@media(max-width:1199px){
    .header{
        padding:0  !important;
    }
}
@media (max-width: 767px) {
    .header{
        padding:0  20px  !important;
    }
    h1 {
        font-size: 40px;
    }
    h2, h3 {
        font-size: 28px;
    }
    .subtitle {
        font-size: 20px;
        width: 100%;
    }
}
@media(max-width:1024px){
    .header .row>div.col-12:last-child{
        position:absolute;
        top:20px;
        right:15px;
        width:40%;
    }
}
@media(max-width:991px){
    .personLogin-content .person-login-text, .mybooking-content .mybooking-content-text{
        display:none;
    }
    .personLogin-content, .mybooking-content{
        border:none;
        padding:0;
        flex-direction:column;
    }
    .header .row > div:nth-child(3) .col{
        display: flex;
        min-width:auto;
        justify-content: end;
        padding-right:0px;
    }
    .personLogin-content:before, .mybooking-content:before {
        transform: scale(1.5);
    }
    .header .row{
        margin-top:0;
    }
}
.flex-sm-row{
    flex-direction: column !important;
}

/*cms-btn-up-mov*/
.cms-btn-up-mov{
    position: fixed;
    width: 48px;
    height: 48px;
    opacity: 0.8;
    bottom: 100px;
    right: 20px;
    background: var(--colorBlue);
    border-radius: 50% !important;
    border:3px solid #fff;
    text-align: center;
    padding: 10px;
    transition: .5s all;
    display:none;
    z-index:9999;
    color:#fff;
    cursor: pointer;
}
.cms-btn-up-mov i{
    font-size:21px;
   transition:.5s all;
}
.cms-btn-up-mov:hover i{
    font-size:23px;
}
@media(max-width:767px){
.cms-btn-up-mov{
  bottom:180px;
}
}