@font-face {
    font-family: 'Platini';      /* Nombre que asignas a la fuente */
    src: url('../assets/fonts/PlantinMTProBold.TTF') format('truetype');
    font-weight: bold;                       /* Peso normal de la fuente */
    font-style: bold;                        /* Estilo normal (sin cursiva) */
}

@font-face {
    font-family: 'Effra';      /* Nombre que asignas a la fuente */
    src: url('../assets/fonts/Effra_Std_Rg.ttf') format('truetype');  /* Ruta y formato de la fuente */
    font-weight: normal;                       /* Peso normal de la fuente */
    font-style: normal;                        /* Estilo normal (sin cursiva) */
}
body{
    background: #f9f9f6 !important;
    font-family: 'Effra', sans-serif; 
}

h1, h2, h3, h4, h5, h6{
    font-family: 'Platini', sans-serif !important; 
}

.conciergeServicesLogo{
    width: 200px;
    margin:auto;
    display: block;
}


.mt-50{
    margin-top: 50px;
}

.mt-10{
    margin-top: 10px;
}

.mt-20{
    margin-top: 20px;
}

.mt-30{
    margin-top: 30px;
}

.enlaceConciergeServices {
    width: 50%;
    text-decoration: none;      /* Sin subrayado */
    color: #010101;               /* Texto en color negro */
    border: 2px solid #010101;    /* Borde en color negro */
    padding: 15px 20px;         /* Espaciado dentro del enlace */
    border-radius:25px;        /* Bordes redondeados */
    background-color: transparent; /* Sin fondo */
    transition: background-color 0.8s ease; /* Efecto de transición suave */
    display: inline-block; /* Asegura que el enlace se comporte como un bloque en línea */
    margin-bottom: 20px;
}

.enlaceConciergeServices:hover {
    background-color: #ede8de;  /* Color de fondo al hacer hover (ajusta el color según prefieras) */
    text-decoration: none;
    color:#010101;
}

.social-icons {
    display: flex;
    justify-content: center;      /* Centra horizontalmente todo el grupo */
    gap: 20px;                    /* Espacio entre los iconos */
}



.icon-item {
    display: flex;
    flex-direction: column;       /* Coloca el ícono encima del texto */
    align-items: center;          /* Centra los íconos y el texto verticalmente */
}
  

.icon-item a {
    text-decoration: none;
    color: black;              /* Color del ícono en su estado normal */
    border: 2px solid black;
    padding: 10px;
    border-radius: 50%;        /* Redondear los bordes alrededor del ícono */
    display: inline-flex;       /* Hacer que los enlaces sean flexibles */
    align-items: center;
    justify-content: center;
    width: 50px;               /* Ajustar el tamaño del botón */
    height: 50px;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.icon-item a:hover {
    background-color: #ede8de; /* Color de fondo al pasar el cursor */
    color: white;              /* Cambiar el color del ícono en hover */
}

.icon {
    width: 24px;               /* Tamaño del ícono */
    height: 24px;
}

/* Estilo del contenedor de las tabs */
.tabsConciergeServices {

    border-bottom: 2px solid #ddd;  /* Línea que separa las tabs del contenido */

}

/* Estilo de cada tab */
.tabConciergeServices {
    background: none;
    border: none;
    padding: 10px 20px;
    font-size: 16px;
    cursor: pointer;
    border-bottom: 2px solid transparent; /* Borde inferior transparente por defecto */
    transition: border-color 0.3s ease;
}

/* Estilo para la tab activa */
.tabConciergeServices.active {
    border-bottom: 2px solid #010101; /* Borde inferior visible para la tab activa */
}

/* Efecto hover para las tabs */
.tabConciergeServices:hover {
    border-bottom: 2px solid #ede8de; /* Borde inferior claro al hacer hover */
}



/* Estilo para el contenido de las tabs */
.tab-contentConciergeServices {
    padding: 20px;
}

.contentConciergeServices {
    display: none;
}

.contentConciergeServices.active {
    display: block;
}

.conciergeServicesLineHeight{
    line-height: .5;
}


.pxp-posts-1-item{
    text-decoration: none;
    color:#010101;
}

.pxp-posts-1-item:hover{
    text-decoration: none;
    color:#010101;
}

.central-copy{
    line-height: 1;
}

.text-table-pricing{
    font-size: 1rem;
}

table{
    width: 100%;
}

.modal-content{
    background: #f9f9f6 !important;
}

.img-details-experiences{
    width: 100%;
    height: 60%;
    object-fit: cover;
}

.whatsapp-concierge-services{
    position: fixed;
    height: 60px;
    top: 50%;
    right: 10px;
    border-radius: 50px;
    font-size: 30px;
    z-index: 100;
    display: flex;
    justify-content: center;
    align-items: center;
   
}.whatsapp-concierge-services > a{
    background-color: #ede8de;
}

.image-container {
    padding: 0;
    height: 350px; 
    overflow: hidden;
}

.image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
  
  .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center; /* Centrado vertical */
    justify-content: center; /* Centrado horizontal */
    /*background: rgba(0, 0, 0, 0.2);*/ /* Fondo semitransparente */
  }
  
  .overlay p {
    color: #fff;
    font-size: 1.5rem; /* Ajusta según el diseño */
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7); /* Texto más legible */
    margin: 0;
    text-align: center;
  }

  .div-movil{
    display: none;
  }

  .div-desktop{
    display: block;
  }

  .social-media-footer{
    position: fixed;
    z-index: 1000000000000;
    bottom: 0px;
    background: white;
    height: 80px;
    width: 100%;
    padding-top: 25px;
  }

  .image-container{
    padding: 5px;
  }

/* Media query para tablets (pantallas de 768px a 1024px) */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .enlaceConciergeServices {
        width: 80%;
    }
    .icon-item a{
        width: 40px;
        height: 40px;
    }
    .whatsapp-concierge-services{
        top: 90%;
    }

    .div-desktop{
        display: none;
    }

    .div-movil{
        display: block;
        z-index: 1;
    }
}
  
  /* Media query para móviles (pantallas de 320px a 767px) */
@media only screen and (max-width: 767px) {
    .enlaceConciergeServices {
        width: 100%;
        font-size: 1rem;
    }
    .icon-item a{
        width: 40px;
        height: 40px;
    }
    .whatsapp-concierge-services{
        top:90%;
    }

    .div-desktop{
        display: none;
    }

    .div-movil{
        display: block;
        z-index: 1;
    }

    
}

@media (min-width: 576px) {
    .modal-dialog {
        max-width: 850px;
        margin: 1.75rem auto;
        z-index: 100000000;
    }
}


.video-modal-dialog {
    width: 70vw; /* 70% del ancho de la pantalla */
    height: 70vh; /* 70% del alto de la pantalla */
    max-width: none; /* Evita que Bootstrap limite el tamaño */
    display: flex;
    align-items: center;
    justify-content: center;
}

@media only screen and (max-width: 767px) {
    .video-modal-dialog{
        width: 100vw;
        height: 100vh;
    }
}

.video-modal-content {
    background: transparent;
    border: none;
}
.video-modal-body {
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.close-btn {
    position: absolute;
    top: -10px;
    right: 10px;
    background: #000;
    color: #fff;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    font-size: 18px;
    cursor: pointer;
    z-index: 10;
}
video {
    max-width: 100%;
    height: auto;
}

#unmuteBtn {
    position: absolute;
    top: -10px;
    right: 55px; /* Posiciona a la izquierda del botón de cerrar */
    background: rgba(0, 0, 0, 0.7);
    color: white;
    border: none;
    padding: 8px;
    border-radius: 50%;
    cursor: pointer;
    display: none;
    width: 35px;
    height: 35px;
    text-align: center;
    font-size: 18px;
    z-index: 10;
}