/*ALL-----------------------------------------------------------------------*/
        body {
          margin: 0;
          font-family: "Montserrat", serif ,'Arial', sans-serif;
          color: #333;
            }
            * {
                box-sizing: border-box;
            }
            a {
                text-decoration: none;
                color: #333;
            }
            html {
                scroll-behavior: smooth;
            }
/*MENU-----------------------------------------------------------------------*/
      nav {
          position: absolute;
          top: 0;
          width: 100%;
          display: flex;
          justify-content: space-around;
          align-items: center;
          background-color: #ffffff6c;
          padding: 1rem 2rem;
          color: #000000;
          z-index: 1000;
      }
  /*    .logo a img {
        filter: drop-shadow(1px 1px 0px rgb(255, 255, 255))
      }----------------------------------------------------------------------*/
      .nav-links {
          list-style: none;
          display: flex;
          gap: 2rem;
          justify-content: center;
          margin-top: 20px;
 
      }
      .nav-links li {
          display: inline;
         /*  filter: drop-shadow(1px 1px 1px rgb(255, 255, 255))-*/
      }
    .nav-links a {
        margin: 0 10px;
        text-decoration: none;
        color: #333;
        /*color: rgb(66, 66, 66);*/
        font-weight: bold;
        cursor: pointer;
        transition: all 0.3s ease-in-out; 
    }
    .nav-links a:hover {
        color: #000000;
    }
    
/*SLIDE HERO-----------------------------------------------------------------------*/
      .hero {
          position: relative;
          height: 100vh;
          
          overflow: hidden;
          justify-content: center;
          align-items: center;
          overflow: hidden;
      }
 
      .hero .slide {
            position: absolute;
            width: 100%;
            height: 100%;
            margin: auto;
            display: flex;
            justify-content: center;
            align-items: flex-end;
            opacity: 0;
            transition: opacity 1s ease-in-out;
        }
        .hero .slide img {
           position: absolute;
           width: 100%;
            height: 100%;
           object-fit: cover;
        }

        .hero .slide.active {
            opacity: 1;
        }

        .hero .slide-text {
            position: relative;
            width: 100%; 
            color: white;
            font-size: 2rem;
            background-color: rgba(0, 0, 0, 0.5);
            padding: 1rem;

            border-radius: 1px;
            text-align: center;
        }
        .slider-container {
            overflow: hidden;
            width: 100%;
            max-width: 800px;
            margin: auto;
        }
        .slider {
            display: flex;
            transition: transform 0.5s ease-in-out;
        }
        .slide {
            min-width: 200px;
            margin-right: 10px;
            background-color: #e0e0e0;
            
            text-align: center;

        }
/*SLIDE RECOMENDACIONES--------------------------------------------------------------*/
      .recommendations {
        padding-top: 2rem;
        background-image: url(..//img/ex_recom.webp);
        background-blend-mode: lighten;
        background-color: rgba(255,255,255,0.9);
        background-attachment: fixed;
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
          display: flex;
          align-items: center;
          justify-content: center;
          
      }
      .recommendations img{
        height: 20vh;
        padding: 0.5rem;
        margin: 0.5rem;
        background-color: white;
        box-shadow: 0px 10px 15px -3px rgba(0,0,0,0.1);
    }
    

      .recommendations .slide {
          display: inline-block;
          padding: 1rem;
          background-color: #e0e0e0;
          border-radius: 8px;
          min-width: 200px;
      }
      .carousel-container {
        overflow: hidden;
        width: 100%;
        max-width: 1240px;
        margin: auto;
    }
    .carousel {
        display: flex;
        transition: transform 0.5s ease-in-out;
    }
    .carousel-item {
        min-width: 200px;
        margin-right: 10px;
        
        text-align: center;
        
    }
    .carousel-item p {
        padding-bottom: 5px;
        font-weight: 600;
    }

/*SECTIONS       --------------------------------------------------------------*/
.section {
    height: 100vh;
    padding: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    
}
.section h2 {
    font-size: 2.5rem;
    margin-bottom: 1rem;
}

h4 {
    font-size: 1rem;
    margin-bottom: 1rem;
    color: rgb(26, 135, 172);
}

.section-content {
    display: flex;
    gap: 2rem;
    align-items: center;
    flex-wrap: wrap;
    flex-direction: row; 
    justify-content: center;
    
}
.section-content .text-block {
    flex: 1;
    text-align: left;
    min-width: 350px;
    max-width: 500px;
    padding: 2rem;
}


form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-width: 500px;
    margin: 0 auto;
}
form input, form textarea {
    font-family: "Montserrat", serif ,'Arial', sans-serif;
    padding: 0.5rem;
    border: 1px solid #ccc;
    border-radius: 4px;
}
form button {
    padding: 0.7rem;
    background-color: rgb(26, 135, 172);
    color: #fff;
    border: none;
    cursor: pointer;
    border-radius: 4px;
}

.text-block * {
    padding-left: 2rem;
    padding-right: 2rem;
    
}
.section-content .image-block {
    flex: 1;
    max-width: 500px;
    min-width: 300px;
    text-align: center;
}
.image-polygon {
    clip-path: polygon(25% 0%, 100% 0%, 100% 100%, 25% 100%, 0% 50%);
    max-width: 500px;
    min-width: 300px;
    max-height:80vh;
}

.image-polygon2{
    clip-path: polygon(0% 0%, 75% 0%, 100% 50%, 75% 100%, 0% 100%);
    max-width: 500px;
    min-width: 300px;
    max-height:80vh;
}
.section-content img {
    height: auto;

}
.services-section {
    height: 100vh;
    padding: 2rem;
    background-color: #fafafa;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-image: url(..//img/ex_services.webp);
    background-blend-mode: lighten;
    background-color: rgba(255,255,255,0.9);
    margin: 2rem;
    background-attachment: scroll;
    background-position: 25% 25%;
    background-repeat: no-repeat;
    background-size: 70%;
    
}

.contact-section {
    height: 100vh;
    padding: 2rem;
    background-color: #fafafa;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-image: url(..//img/ex_contact.webp);
    background-blend-mode: lighten;
    background-color: rgba(255,255,255,0.9);
    margin: 2rem;
    background-attachment: scroll;
    background-position: 25% 25%;
    background-repeat: no-repeat;
    background-size: 30%;
}

.about-section {
    height: 100vh;
    padding: 2rem;
    background-image: url(..//img/ex_about.webp);
    background-blend-mode: lighten;
    background-color: rgba(255,255,255,0.9);
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    
}

/*SECTION CREAMOS       --------------------------------------------------------------*/
      .design-trip {
          height: 100vh;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          background-color: #f0f0f0;
          background-attachment: fixed;
          background-position: center;
          background-repeat: no-repeat;
          background-size: cover;
      }
    .design-trip {
        background-image: url(..//img/ex_create.webp);
        background-blend-mode: lighten;
        background-color: rgba(255,255,255,0.9);
    }
      .design-trip h2, .design-trip p {
          margin: 1rem 0;
      }
    .contenedor_img_super {
        position: relative;

    }
    .image-super1 img {
        height: 80%;
        width: 80%;
        margin-right:50% ;
        z-index: 1;
        position: relative;

        transition: all 0.3s ease-in-out; 
    }
    .image-super2  img{
        height: 80%;
        width: 80%;
        position: relative;
        margin-top:-70% ;
        z-index: 2;

        transition: all 0.3s ease-in-out; 

    }
    .image-super3 img {
        height: 80%;
        width: 80%;
        position: relative;

        margin-top:-70%;
        margin-right:-30% ;
        z-index: 1;
        transition: all 0.3s ease-in-out; 
    }

    .image-super1 img:hover, .image-super2  img:hover, .image-super3  img:hover {
        transition: all 0.3s ease-in-out; 
        z-index: 3;    
    }
    

/*SECTION SERVICIOS       --------------------------------------------------------------*/
    .listaservicios{
        list-style-image:url("..//img/ok.webp");
    }

 

/*SECTION NOSOTROS       --------------------------------------------------------------*/
    .gallery {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }
    
    .image-container {
        width: 150px;
        height: 150px;
        border: 1px solid #ccc;
        overflow: hidden;
        position: relative; 

    }
    
    .image-container img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        transition: transform 0.5s ease-in-out;
        filter: grayscale(90%);
        border: 5px solid rgb(26, 135, 172);

        box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2);
    }
    .image-container img:hover {
        transform: scale(1.1);
        filter: grayscale(0%);
    }
    .tooltip {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;

        background-color: #f1f1f1;
        color: #333;
        border: 1px solid #ddd;

        z-index: 1;
        visibility: hidden;
        opacity: 0;
        transition: opacity 0.3s;
        text-align: center;
      }
    .image-container:hover .tooltip {
        visibility: visible;
        opacity: 1;
      }
/*SECTION CONTACTO       --------------------------------------------------------------*/
        .maps-block {
            width: 500px;
            height: 500px;
            margin: 2rem;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }
      iframe {
          width: 100%;
          height: 100%;
          border: 0;
      }
      textarea {
        resize: none;
        height: 100px;
      }
/*SECTION FOOTER       --------------------------------------------------------------*/
      footer {
        background-color: #101010;
        border-top: 2px solid #78787f;
          color: #fff;
          text-align: center;
          padding-top: 3rem;
          padding-bottom: 1rem;
      }
        .hamburger {
            display: none;
            font-size: 2rem;
            background: none;
            border: none;
            cursor: pointer;
            
        }
       
        .footer-links {
            list-style: none;
            display: flex;
            gap: 2rem;
            justify-content: center;
        }
        .footer-links li {
            display: inline;
        }
        .footer-links a {
            text-decoration: none;
            color: rgb(66, 66, 66);
            font-weight: bold;
            cursor: pointer;
                    transition: all 0.3s ease-in-out;
                }
        .footer-links a:hover {
          color: white;
      }
      .footer-block {
        text-align: left;
        margin-bottom: 40px;
      }
      .social-icons{
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .social-icons a img{
        height: 30px;
        padding-left: 10px;
        padding-right: 10px;
        margin: 10px;
        transition: all 0.3s ease-in-out;
      }
      .social-icons a img:hover{
        filter: brightness(145%) contrast(82%);
        -webkit-filter: brightness(145%) contrast(82%);
        -moz-filter: brightness(145%) contrast(82%);
      }
      .footer-general{
        display: flex;
        align-items: center;
        justify-content: space-around;
      }
      .footer-derechos {
        margin: 0;
        color: #333;
        font-weight: bold;

      }

/*SECTION MOBILE       --------------------------------------------------------------*/
        @media (max-width: 1000px) {
            .hamburger {
                display: block;
            }
            .nav-links {
                display: none;
                flex-direction: column;
                position: absolute;
                top: 96px;
                right: 0;
                background-color: #ffffff6c;
                width: 100%;
                text-align: center;
                padding: 0;
                padding-top: 0.5rem;
                padding-bottom: 0.5rem;
            }
            .nav-links.active {
                display: flex;
            }
            .section-content img {
                width: 100%;
                height: 100%;
            }

            .section-content iframe {
                width: 70%;
            }
            .maps-block {
                width: 90vw;
                height: 70vw;
                margin: auto;
                order: 2;
            }
            .text-block {
                padding: 2rem;
            }
            .section {
                height: auto;                
            }
            .hero .slide-text {
                color: white;
                font-size: 1rem;
                background-color: rgba(0, 0, 0, 0.5);
            }
            .text-block {
            order: 1;
            }
            .image-block {
            order: 2;
            }
            .footer-block {
               
                text-align: center;
            }
            .footer-general{
                display: block;
                align-items: center;

            }
            .footer-links {
                display: block;
                padding: 0;
            }
            .footer-links li {
                display: block;
            }

            .services-section, .contact-section {
                
                background-attachment: scroll;
                background-position: 50% 8%;
                background-repeat: no-repeat;
                background-size: 90%;
            }
            .section-content {
                justify-content: center;
            }
            
            .section-content .text-block {
                padding: 0.5rem;
            }
            .image-polygon,.image-polygon2 {
                clip-path: polygon(50% 0%, 100% 38%, 100% 100%, 0 100%, 0% 38%);
            }
            
            .gallery {
                grid-template-columns: repeat(3, 2fr);
            }
 
            .image-super1 img {
                height: 50%;
                width: 50%;
                margin-right:15%;

            }
            .image-super2  img{
                height: 50%;
                width: 50%;
                margin-top:-45%;

            }
            .image-super3 img {
                height: 50%;
                width: 50%;
                margin-top:-45%;
                margin-right:-15%;


            }
            .gallery {
                grid-template-columns: repeat(2, 1fr);
                gap: 20px;
            }

        
        }