@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap);

.gallery-page,
.gallery-tab-list a.active {
    color: #171717
}

.gallery-card img,
.gallery-hero-image img {
    height: 100%;
    width: 100%;
    object-fit: cover
}

.gallery-page,
.gallery-page * {
    box-sizing: border-box;
    font-family: Poppins, sans-serif
}

.gallery-page {
    font-size: 16px;
    font-weight: 500
}

.gallery-page img {
    width: 100%;
    display: block
}

.gallery-hero {
    width: 100%;
    background: #f7f5f0
}

.gallery-hero-content {
    padding: 80px 11%
}

.gallery-label {
    display: block;
    margin-bottom: 18px;
    color: #9b7445;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 3px
}

.cta-content a,
.gallery-btn {
    display: inline-flex;
    background: #987044
}

.gallery-hero-content h1 {
    margin: 0 0 20px;
    color: #171717;
    font-size: 52px;
    line-height: 1.15;
    font-weight: 600
}

.gallery-hero-content p {
    margin-bottom: 30px;
    color: #555;
    font-size: 17px;
    line-height: 1.8
}

.gallery-btn {
    padding: 15px 28px;
    align-items: center;
    gap: 12px;
    color: #fff;
    font-size: 16px;
    font-weight: 500
}

.gallery-btn:hover {
    background: #171717;
    color: #fff
}

.gallery-hero-image {
    height: 520px;
    overflow: hidden
}

.gallery-tabs {
    padding: 25px 0;
    background: #fff;
    border-bottom: 1px solid #e8e8e8
}

.gallery-tab-list {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 45px;
    overflow-x: auto
}

.gallery-tab-list a {
    position: relative;
    padding-bottom: 10px;
    color: #333;
    white-space: nowrap;
    font-size: 16px
}

.gallery-tab-list a.active:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: ;
    height: 2px;
    background: #987044
}

.gallery-heading {
    margin-bottom: 35px
}

.gallery-heading span {
    color: #987044;
    font-size: 14px;
    letter-spacing: 3px
}

.gallery-heading h2 {
    margin: 10px 0;
    font-size: 38px;
    font-weight: 600
}

.gallery-features p,
.gallery-heading p {
    margin: 0;
    color: #666;
    font-size: 16px
}

.gallery-section {
    padding: 70px 0
}

.gallery-card {
    height: 280px;
    position: relative;
    overflow: hidden
}

.gallery-card.big {
    height: 580px
}

.gallery-card img {
    transition: .5s
}

.gallery-card:hover img {
    transform: scale(1.05)
}

.gallery-overlay {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 25px;
    color: #fff;
    background: linear-gradient(transparent, rgba(0, 0, 0, .75))
}

.gallery-overlay h3 {
    margin: 0 0 6px;
    color: #fff;
    font-size: 21px;
    font-weight: 600
}

.gallery-overlay p {
    margin: 0 0 8px;
    color: #eee;
    font-size: 15px
}

.gallery-overlay a {
    color: #fff;
    font-size: 15px
}

.gallery-inspiration {
    padding: 40px 0 70px
}

.idea-card {
    border: 1px solid #e5e5e5;
    background: #fff
}

.idea-card img {
    height: 260px;
    object-fit: cover
}

.idea-card h3 {
    margin: 20px 20px 8px;
    font-size: 20px;
    font-weight: 600
}

.idea-card p {
    margin: 0 20px 20px;
    color: #666;
    font-size: 16px
}

.gallery-features {
    padding: 45px 0;
    background: #f8f6f2
}

.gallery-features h3 {
    margin-bottom: 10px;
    font-size: 20px;
    font-weight: 600
}

.gallery-cta {
    background: #171717
}

.gallery-cta img {
    height: 430px;
    object-fit: cover
}

.cta-content {
    padding: 80px 12%;
    color: #fff
}

.cta-content h2 {
    margin-bottom: 15px;
    color: #fff;
    font-size: 42px;
    font-weight: 600
}

.cta-content p {
    margin-bottom: 30px;
    color: #ddd;
    font-size: 17px
}

.cta-content a {
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    color: #fff;
    font-size: 16px
}

.gallery-seo {
    padding: 60px 0
}

.gallery-seo h2 {
    margin-bottom: 20px;
    font-size: 34px;
    font-weight: 600
}

.gallery-seo p {
    margin-bottom: 20px;
    color: #555;
    font-size: 17px;
    line-height: 1.8
}

@media(max-width:991px) {

    .cta-content,
    .gallery-hero-content {
        padding: 50px 40px
    }

    .gallery-hero-content h1 {
        font-size: 40px
    }

    .gallery-card.big,
    .gallery-hero-image {
        height: 400px
    }

    .gallery-tab-list {
        justify-content: flex-start;
        gap: 25px
    }
}

@media(max-width:767px) {
    .gallery-hero-content {
        padding: 35px 20px
    }

    .gallery-hero-content h1 {
        font-size: 32px
    }

    .gallery-hero-content p,
    .gallery-seo p {
        font-size: 16px
    }

    .gallery-hero-image {
        height: 300px
    }

    .cta-content h2,
    .gallery-heading h2 {
        font-size: 30px
    }

    .gallery-card,
    .gallery-card.big,
    .gallery-cta img {
        height: 280px
    }

    .idea-card img {
        height: 220px
    }

    .gallery-features h3 {
        font-size: 18px
    }

    .cta-content {
        padding: 40px 25px
    }

    .gallery-seo h2 {
        font-size: 28px
    }
}

/* =====================================
   INSPIRATION SECTION
===================================== */


.gallery-inspiration {

    padding:80px 0;

    background:#ffffff;

}



.gallery-heading {

    margin-bottom:40px;

}



.gallery-heading span {

    display:block;

    margin-bottom:12px;

    color:#a07945;

    font-size:14px;

    font-weight:500;

    letter-spacing:4px;

}



.gallery-heading h2 {

    margin:0 0 12px;

    color:#111;

    font-size:40px;

    font-weight:600;

}



.gallery-heading p {

    margin:0;

    color:#666;

    font-size:17px;

    font-weight:500;

}





/* CARD */


.idea-card {

    width:100%;

    background:#fff;

    border:1px solid #e5e5e5;

    overflow:hidden;

    transition:.3s ease;

}



.idea-card:hover {

    transform:translateY(-5px);

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

}





/* IMAGE */


.idea-image {

    width:100%;

    height:270px;

    overflow:hidden;

}



.idea-image img {

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;

    transition:.5s ease;

}



.idea-card:hover img {

    transform:scale(1.05);

}




/* CONTENT */


.idea-content {

    padding:22px;

}



.idea-content h3 {

    margin:0 0 10px;

    color:#111;

    font-size:22px;

    font-weight:600;

}



.idea-content p {

    margin:0;

    color:#666;

    font-size:16px;

    line-height:1.7;

    font-weight:500;

}





/* TABLET */


@media(max-width:991px){


.gallery-heading h2{

    font-size:34px;

}


.idea-image{

    height:240px;

}


}




/* MOBILE */


@media(max-width:767px){


.gallery-inspiration{

    padding:50px 0;

}


.gallery-heading h2{

    font-size:28px;

}


.gallery-heading p{

    font-size:16px;

}


.idea-image{

    height:220px;

}


.idea-content{

    padding:18px;

}


.idea-content h3{

    font-size:20px;

}


}
.gallery-cta {
    background:#171717;
    overflow:hidden;
}


.cta-wrapper {
    display:flex;
    align-items:center;
    height:320px;
}


/* Content */
.cta-content {
    width:50%;
    padding:40px 70px;
}


.cta-content h2 {
    color:#fff;
    font-size:38px;
    font-weight:700;
    margin-bottom:12px;
}


.cta-content p {
    color:#ddd;
    font-size:17px;
    margin-bottom:25px;
}


.cta-btn {
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:#b58a52;
    color:#fff;
    padding:12px 28px;
    font-size:16px;
    text-decoration:none;
}



/* Image */
.cta-image {
    width:50%;
    height:100%;
}


.cta-image img {
    width:100%;
    height:100%;
    object-fit:cover;
}



/* Mobile */
@media(max-width:768px){

    .cta-wrapper{
        height:auto;
        flex-direction:column;
    }


    .cta-content,
    .cta-image{
        width:100%;
    }


    .cta-content{
        padding:35px 25px;
    }


    .cta-content h2{
        font-size:30px;
    }


    .cta-image{
        height:250px;
    }

}