/*=========================================================
                    GALLERY HERO
=========================================================*/

.gallery-hero{
    padding:60px 0 30px;
    background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%);
}

/*=========================================================
                    HERO CONTAINER
=========================================================*/

.gallery-heading{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    max-width:900px;
    margin:0 auto;
    animation:fadeUp .6s ease;
}

/*=========================================================
                    EYEBROW
=========================================================*/

.gallery-heading .eyebrow{
    display:inline-block;
    padding:8px 18px;
    border-radius:50px;
    background:#eaf7e8;
    color:#0b1f3a;
    font-size:13px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:1px;
    margin-bottom:18px;
}

/*=========================================================
                    TITLE
=========================================================*/

.gallery-heading .section-heading{
    font-size:46px;
    font-weight:700;
    color:#0b1f3a;
    line-height:1.2;
    margin-bottom:12px;
}

/*=========================================================
                    ANIMATION
=========================================================*/

@keyframes fadeUp{
    from{
        opacity:0;
        transform:translateY(30px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/*=========================================================
                    RESPONSIVE
=========================================================*/

@media (max-width:992px){

    .gallery-heading .section-heading{
        font-size:38px;
    }

    .gallery-hero{
        padding:50px 0 25px;
    }
}

@media (max-width:768px){

    .gallery-heading .section-heading{
        font-size:32px;
    }

    .gallery-heading .eyebrow{
        font-size:12px;
        padding:6px 14px;
    }
}

@media (max-width:576px){

    .gallery-heading .section-heading{
        font-size:26px;
        line-height:1.3;
    }

    .gallery-hero{
        padding:40px 0 20px;
    }
}