* {
    box-sizing: border-box;
    font-family: "Montserrat", sans-serif;
    color: #000;
}

html,
body {
    margin: 0;
    padding: 0;
}

body {
    background: #dbdbd7;
    font-weight: 300;
    -webkit-font-smoothing: antialiased;
}

img {
    display: block;
    width: 100%;
    height: auto;
}

a {
    color: #000;
    text-decoration: none;
}

a:hover {
    text-decoration: line-through;
}


/* CABECERA */

.section--top {
    width: 100%;
    height: 100vh;
    padding: 2.5vw 6vw 0;
    position: relative;
}


/* CONTENEDOR */

.top__inner {
    width: 100%;
    height: 100%;
    position: relative;
}


/* LOGO */

.img--logo {
    width: 25vw;
    max-width: 360px;

    position: fixed;

    top: 2.5vw;
    left: 3vw;

    z-index: 10;

    pointer-events: none;
}


/*  TEXTO DE PRESENTACIÓN */

.about__text {
    position: absolute;

    width: 48em;

    max-width: 118vw;

    left: 0;
    bottom: 3vw;

    z-index: 1;
}

.about__text p {
    margin: 0;

    font-size: 22px;

    line-height: 1.5;

    letter-spacing: 0;
}


/* =========================================================
   NAVEGACIÓN
   ========================================================= */

   .section--contact {
     width: 100%;

     padding-left: 6vw;
     padding-right: 6vw;

     padding-bottom: 0;
 }


 .contact__inner {
     display: flex;
 }


 .contact__links {
     width: 50%;

     margin-left: 50%;

     display: flex;
     flex-direction: column;
     align-items: flex-end;

     font-size: 22px;
     line-height: 1.5;
 }


 .contact__links a {
     font-size: 22px;

     text-decoration: underline;
     text-underline-offset: 3px;
 }


 .contact__links a:hover {
     text-decoration: line-through;
 }


/* EMAIL */

.email {
    position: fixed;

    right: 6vw;
    bottom: 2.5vw;

    width: 50%;

    text-align: right;

    z-index: 100;

    font-size: 22px;
}


.email a {
    font-size: 22px;

    text-decoration: underline;
    text-underline-offset: 3px;
}

.sticky {
    position: -webkit-sticky;
    position: sticky;

    top: 3.5vw;

    width: 100%;

    text-align: right;

    padding-left: 6vw;
    padding-right: 6vw;

    padding-bottom: 8vw;
}


.sticky a {
    font-size: 22px;

    text-decoration: underline;
    text-underline-offset: 3px;
}


.sticky a:hover {
    text-decoration: line-through;
}

/* =========================================================
   GALERÍA
   ========================================================= */

.gallery {
    width: 100%;

    padding-left: 6vw;
    padding-right: 6vw;
    padding-bottom: 50px;

    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 1.5rem;
}


/* CADA IMAGEN */

.gallery__item {
    width: 100%;
    display: flex;
   align-items: center;
   min-height: 500px;
}


/* IMÁGENES A DOS COLUMNAS */

.gallery__item--wide {
    grid-column: 1 / -1;
}


/* IMÁGENES */

.gallery__item img {
    display: block;

    width: 100%;
    height: auto;

    margin: 0;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

    .section--top {
        padding-left: 6vw;
        padding-right: 6vw;
    }


    .img--logo {
        width: 28vw;
    }


    .about__text {
        width: 34em;
    }


    .about__text p {
        font-size: 20px;
    }


    .contact__links,
    .contact__links a {
        font-size: 20px;
    }


    .sticky,
    .sticky a {
        font-size: 20px;
    }


    .gallery {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .gallery__item,
    .gallery__item--wide {
        grid-column: 1;
    }


    .gallery img {
        margin-bottom: 1rem;
    }

}

.intro-container {
    width: 100%;
}

/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 600px) {

    /* CABECERA */

    .intro-container {
        height: 100vh;
        min-height: 100vh;

        display: flex;
        flex-direction: column;

        overflow: hidden;
    }

    .section--top {
        height: auto;
        flex: 1;
        padding: 25px 6vw 0;
    }

    .top__inner {
        height: auto;
    }


    /* LOGO */

    .img--logo {
        width: 42vw;

        top: 25px;
        left: 6vw;
    }


    /* TEXTO */

    .about__text {
        position: relative;

        width: auto;
        max-width: 100%;

        left: 0;
        bottom: auto;

        padding-top: 40%;
    }


    .about__text p {
        font-size: 18px;
        line-height: 1.45;
    }


    /* CONTACTO */

    .section--contact {
        padding-left: 6vw;
        padding-right: 6vw;
        padding-bottom: 0;
    }


    .contact__inner {
        display: flex;
        flex-direction: column;
    }


    .contact__links {
        width: 100%;
        margin-left: 0;

        font-size: 18px;
    }


    .contact__links a {
        font-size: 18px;
    }


    /* EMAIL */

    .sticky {
        width: auto;

        top: 9vw;

        padding: 0;

        margin: 0 6vw 15vw;

        font-size: 18px;
    }


    .sticky a {
        font-size: 18px;
    }


    /* GALERÍA */

    .gallery {
        padding-left: 3vw;
        padding-right: 3vw;
        gap: 20px;
    }


    .gallery__item {
        height: auto;
        min-height: 0;
    }


    .gallery__item img {
        height: auto;
        margin: 0;
    }

}