* {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
        'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
        sans-serif;
      background-color: #ffffff;
      color: #1f2937;
    }
    /* #home h1{color:#14b1e6} */
    /* Menu */
    .nav-link{

    position:relative;
    display:inline-block;
    padding:.5rem 0;
    color:white;
    transition:color .3s;

}
    .nav-link::after{

    content:"";

    position:absolute;

    left:0;
    bottom:-6px;

    width:100%;
    height:2px;

    background:#06bdf9;   /* pink-500 */

    transform:scaleX(0);
    transform-origin:left;

    transition:transform .35s ease;

}

.nav-link:hover::after{

    transform:scaleX(1);

}

.nav-link.active::after{

    transform:scaleX(1);

}
.nav-link.active a, .nav-link a:hover {
  color:#e0368c;
}

.title{color:#1e1e1e;}
.title1{color:#06bdf9;}

.title2{color:#e0368c;}
.btn{background-color:#e0368c;}



    /* Carrusel Hero Automático */
    .hero-slide {
      position: absolute;
      inset: 0;
      opacity: 0;
      transition: opacity 1s ease-in-out;
      z-index: 0;
    }

    .hero-slide.active {
      opacity: 1;
      z-index: 1;
    }

    /* Carousel Dots */
    .dot {
      cursor: pointer;
      transition: all 0.3s ease;
    }

    .dot.active {
      background-color: #06bdf9;
      width: 12px;
      height: 12px;
    }

    /* Mobile Menu */
    .mobile-menu {
      transform: translateX(-100%);
      transition: transform 0.3s ease;
    }

    .mobile-menu.active {
      transform: translateX(0);
    }

    /* Lightbox Modal */
    .lightbox {
      display: none;
      position: fixed;
      inset: 0;
      background-color: rgba(0, 0, 0, 0.95);
      z-index: 1000;
      justify-content: center;
      align-items: center;
    }

    .lightbox.active {
      display: flex;
    }

    .lightbox-content {
      position: relative;
      max-width: 30vw;
      max-height: 90vh;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .lightbox-image {
      max-width: 100%;
      max-height: 100%;
      object-fit: contain;
    }

    .lightbox-close {
      position: absolute;
      top: 20px;
      right: 20px;
      font-size: 40px;
      color: white;
      cursor: pointer;
      z-index: 1001;
    }

    .lightbox-nav {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      font-size: 30px;
      color: white;
      cursor: pointer;
      padding: 10px 20px;
      user-select: none;
    }

    .lightbox-prev {
      left: 20px;
    }

    .lightbox-prev:hover,
    .lightbox-next:hover,
    .lightbox-close:hover {
      color: #06bdf9;
      transition: color 0.3s ease;
    }

    .lightbox-next {
      right: 20px;
    }

    .lightbox-counter {
      position: absolute;
      bottom: 20px;
      left: 50%;
      transform: translateX(-50%);
      color: white;
      font-size: 14px;
    }