html, body {
    overflow-x: hidden;
    width: 100vw;
    max-width: 100%;
}


 .h1{
    font-size: 42px;
    font-weight: 700;
  }
  .h2{
    font-size: 36px;
    font-weight: 700;
  }
  .container{
    max-width: 540px!important
  }

  .carrusel {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    width: 100vw; /* Ocupa el ancho de la pantalla */
    height: 100%; /* Altura del carrusel */
  }
  ::-webkit-scrollbar{
    display: none; /* Oculta la barra de desplazamiento en Chrome, Safari y Opera */
  }

  .elemento {
    /*flex: 0 0 66%;*/ /* Cada elemento ocupa el 66% de la pantalla */
    /*scroll-snap-align: start;*/ /* Alineación al hacer scroll */
    color: white; /* Color del texto */
    /*display: flex;*/
    justify-content: center;
    align-items: center;
    margin-right: 20px;
    font-size: 2em; /* Tamaño del texto */
  }

  .modal-content{
    border-radius: 15px!important;
  }

  .full-height{
    height: 100%;
  }
.primary-text{
  color:#8032f4;
}
.border-radius{
  border-radius: 10px;
}
.overlay-custom{
  position: absolute;top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: linear-gradient(to right, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.0) 60%, rgba(0, 0, 0, 0) 40%);
  border-radius: 10px;
}

.height-160{
  height:190px
}

.card-title{
  margin-bottom: 0px;
  color:white;font-weight:800
}

.card-image{
  background-position: center;background-size: cover;height:100%;border-radius: 10px;width:100%
}

.card-btn-custom{
  background-color:#efde0f;font-weight:bold;font-size:16px;color:black;border:none;padding:10px 15px
}

  /* Mobile: Bottom Sheet desde abajo */
  @media (max-width: 767px) {
    .modal-dialog-bottom {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 0;
      width: 100%;
      max-width: 100%;
    }
    
    .modal.fade .modal-dialog-bottom {
      transform: translateY(100%);
      transition: transform 0.3s ease-out;
    }

    .modal.show .modal-dialog-bottom {
      transform: translateY(0);
    }
  }

  /* Desktop: Modal centrado estilo Bootstrap */
  @media (min-width: 768px) {
    .modal-dialog-bottom {
      position: relative;
      max-width: 600px;
      margin: 1.75rem auto;
    }
    
    .modal.fade .modal-dialog-bottom {
      transform: scale(0.9);
      opacity: 0;
      transition: transform 0.3s ease-out, opacity 0.3s ease-out;
    }

    .modal.show .modal-dialog-bottom {
      transform: scale(1);
      opacity: 1;
    }

    .modal-dialog-bottom .modal-content {
      border-radius: 15px;
      box-shadow: 0 5px 15px rgba(0,0,0,.3);
    }
  }

  
      @keyframes shake {
        0% { transform: translate(0, 0); }
        10% { transform: translate(-2px, 0); }
        20% { transform: translate(2px, 0); }
        30% { transform: translate(-2px, 0); }
        40% { transform: translate(2px, 0); }
        50% { transform: translate(-2px, 0); }
        60% { transform: translate(2px, 0); }
        70% { transform: translate(-2px, 0); }
        80% { transform: translate(2px, 0); }
        90% { transform: translate(-2px, 0); }
        100% { transform: translate(0, 0); }
      }

      .shake-now {
        animation: shake 0.8s;
      }

/* Galería álbum: flechas e indicadores visibles sobre cualquier foto */
.album-carousel .carousel-control-prev,
.album-carousel .carousel-control-next { width: 18%; opacity: 1; }
.album-carousel .carousel-control-prev-icon,
.album-carousel .carousel-control-next-icon {
  width: 38px; height: 38px; border-radius: 50%;
  background-color: rgba(0,0,0,.55); background-size: 45%;
  box-shadow: 0 1px 4px rgba(0,0,0,.4);
}
.album-carousel .carousel-indicators li {
  width: 8px; height: 8px; border-radius: 50%; margin: 0 4px;
  background-color: #fff; opacity: .6; border: 1px solid rgba(0,0,0,.35);
}
.album-carousel .carousel-indicators .active { opacity: 1; }

/* Foto en grande (lightbox) */
#galleryLightbox { background: #000; border-radius: 15px; overflow: hidden; }
#galleryLightbox .carousel-item img { max-height: 80vh; object-fit: contain; background: #000; }
.gallery-lightbox-close {
  position: absolute; top: 10px; right: 10px; z-index: 20;
  width: 36px; height: 36px; border: none; border-radius: 50%;
  background: rgba(0,0,0,.6); color: #fff; font-size: 24px; line-height: 36px; padding: 0;
}