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

.gallery-hero{

    position:relative;

    min-height:70vh;

    display:flex;

    align-items:center;

    justify-content:center;

    text-align:center;

    background:url("../images/galeria/gallery1.jpg") center/cover;

}

.hero-overlay{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.55);

}

.gallery-hero .container{

    position:relative;

    z-index:2;

}

.gallery-hero h1{

    font-family:'Cinzel',serif;

    font-size:4rem;

    color:white;

    margin:20px 0;

}

.gallery-hero p{

    max-width:700px;

    margin:auto;

    color:#eee;

    line-height:1.8;

}

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

.gallery{

    padding:120px 0;

    background:#F8F4EE;

}

.gallery h2{

    text-align:center;

    font-family:'Cinzel', serif;

    font-size:3rem;

    color:#121212;

    margin:20px 0 30px;

}

.gallery-description{

    text-align:center;

    max-width:700px;

    margin:0 auto 70px;

    color:#555;

    line-height:1.9;

}

.gallery-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:25px;

}

.gallery-grid img{

    width:100%;

    height:320px;

    object-fit:cover;

    border-radius:18px;

    cursor:pointer;

    transition:.4s;

    box-shadow:0 15px 35px rgba(0,0,0,.15);

    opacity:0;

    transform:translateY(25px);

    animation:fadeGallery .8s forwards;

}

.gallery-grid img:hover{

    transform:scale(1.05);

    box-shadow:0 25px 50px rgba(0,0,0,.25);

}

.gallery-grid img:nth-child(2){

    animation-delay:.1s;

}

.gallery-grid img:nth-child(3){

    animation-delay:.2s;

}

.gallery-grid img:nth-child(4){

    animation-delay:.3s;

}

.gallery-grid img:nth-child(5){

    animation-delay:.4s;

}

.gallery-grid img:nth-child(6){

    animation-delay:.5s;

}

.gallery-grid img:nth-child(7){

    animation-delay:.6s;

}

.gallery-grid img:nth-child(8){

    animation-delay:.7s;

}

.gallery-grid img:nth-child(9){

    animation-delay:.8s;

}

.gallery-grid img:nth-child(10){

    animation-delay:.9s;

}

.gallery-grid img:nth-child(11){

    animation-delay:1s;

}

.gallery-grid img:nth-child(12){

    animation-delay:1.1s;

}

@keyframes fadeGallery{

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/*==========================
     INTRODUCCIÓN
==========================*/

.gallery-intro{

    padding:110px 0;

    background:#F8F4EE;

    text-align:center;

}

.gallery-intro h2{

    font-family:'Cinzel', serif;

    font-size:3rem;

    color:#121212;

    margin:20px 0 30px;

}

.gallery-intro p{

    max-width:800px;

    margin:auto;

    line-height:2;

    color:#555;

}

/*==========================
        LIGHTBOX
==========================*/

.lightbox{

    position:fixed;

    inset:0;

    background:rgba(0,0,0,.92);

    display:none;

    justify-content:center;

    align-items:center;

    z-index:5000;

    padding:40px;

}

.lightbox.active{

    display:flex;

}

.lightbox-img{

    max-width:90%;

    max-height:85vh;

    border-radius:18px;

    box-shadow:0 25px 60px rgba(0,0,0,.5);

    animation:lightboxFade .25s ease;

}

.lightbox-close{

    position:absolute;

    top:20px;

    right:30px;

    color:white;

    font-size:3rem;

    cursor:pointer;

    transition:.3s;

}

.lightbox-close:hover{

    color:#E67E22;

    transform:scale(1.1);

}

.lightbox-prev,
.lightbox-next{

    position:absolute;

    top:50%;

    transform:translateY(-50%);

    width:56px;

    height:56px;

    border:none;

    border-radius:50%;

    background:rgba(255,255,255,.12);

    color:white;

    font-size:1.8rem;

    cursor:pointer;

    transition:.3s;

}

.lightbox-prev:hover,
.lightbox-next:hover{

    background:#E67E22;

}

.lightbox-prev{

    left:25px;

}

.lightbox-next{

    right:25px;

}

@keyframes lightboxFade{

    from{

        opacity:0;

        transform:scale(.95);

    }

    to{

        opacity:1;

        transform:scale(1);

    }

}

/* Mobile */

@media (max-width:768px){

    .lightbox{

        padding:20px;

    }

    .lightbox-img{

        max-width:100%;

        max-height:75vh;

    }

    .lightbox-prev,
    .lightbox-next{

        width:48px;

        height:48px;

        font-size:1.5rem;

    }

    .lightbox-prev{

        left:10px;

    }

    .lightbox-next{

        right:10px;

    }

}

/*==========================
      NUESTRO EQUIPO
==========================*/

.team{

    padding:120px 0;

    background:white;

}

.team h2{

    font-family:'Cinzel', serif;

    font-size:3rem;

    text-align:center;

    margin:20px 0;

    color:black;

}

.team-intro{

    max-width:760px;

    margin:0 auto 70px;

    text-align:center;

    color:#666;

    line-height:1.9;

}

.team-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

}

.team-card{

    background:#fff;

    border-radius:20px;

    overflow:hidden;

    text-align:center;

    box-shadow:0 15px 35px rgba(0,0,0,.08);

    transition:.35s;

}

.team-card:hover{

    transform:translateY(-10px);

    box-shadow:0 25px 45px rgba(0,0,0,.15);

}

.team-card img{

    width:100%;

    height:340px;

    object-fit:cover;

    display:block;

}

.team-card h3{

    font-family:'Cinzel',serif;

    font-size:1.5rem;

    padding:25px;

    color:#121212;

}