/* Start custom CSS for html, class: .elementor-element-1a5ebd0 *//* ===========================
LUXURY GALLERY
=========================== */

.fashion-gallery{

    padding:100px 8%;
    background:#fff;

}

/* Heading */

.gallery-heading{

    text-align:center;
    margin-bottom:60px;

}

.gallery-heading span{

    color:#f7c600;
    font-size:15px;
    font-weight:700;
    letter-spacing:3px;

}

.gallery-heading h2{

    font-size:48px;
    color:#111;
    margin:15px 0;

}

.gallery-heading p{

    max-width:700px;
    margin:auto;
    color:#666;
    line-height:1.8;

}

/* Grid */

.gallery-grid{

    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:25px;

}

/* Large Card */

.large{

    grid-column:span 2;
    height:650px;

}

.gallery-card{

    position:relative;
    overflow:hidden;
    border-radius:20px;
    cursor:pointer;
    height:310px;
    background:#000;

}

.gallery-card img{

    width:100%;
    height:100%;
    object-fit:cover;
    transition:.7s;

}

.gallery-card:hover img{

    transform:scale(1.12);

}

/* Overlay */

.overlay{

    position:absolute;
    inset:0;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    padding:35px;
    background:linear-gradient(to top,
    rgba(0,0,0,.85),
    rgba(0,0,0,.15));
    color:#fff;

}

.overlay small{

    color:#FFD400;
    font-size:14px;
    letter-spacing:2px;
    margin-bottom:10px;

}

.overlay h3{

    font-size:30px;
    margin-bottom:12px;

}

.overlay p{

    color:#ddd;
    margin-bottom:25px;
    line-height:1.7;

}

.overlay a{

    display:inline-block;
    width:max-content;
    padding:13px 30px;
    background:#FFD400;
    color:#111;
    text-decoration:none;
    border-radius:40px;
    font-weight:700;
    transition:.4s;

}

.overlay a:hover{

    background:#fff;
    transform:translateY(-4px);

}

/* Yellow Border Animation */

.gallery-card::after{

    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:0%;
    height:4px;
    background:#FFD400;
    transition:.5s;

}

.gallery-card:hover::after{

    width:100%;

}

/* CTA */

.gallery-cta{

    margin-top:90px;
    background:#111;
    color:#fff;
    border-radius:25px;
    padding:60px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:25px;

}

.gallery-cta h2{

    font-size:40px;
    margin-bottom:10px;

}

.gallery-cta p{

    color:#ddd;
    max-width:600px;
    line-height:1.8;

}

.gallery-cta a{

    background:#FFD400;
    color:#111;
    text-decoration:none;
    padding:18px 42px;
    border-radius:50px;
    font-weight:700;
    transition:.4s;

}

.gallery-cta a:hover{

    background:#fff;
    transform:translateY(-4px);

}

/* Responsive */

@media(max-width:991px){

.gallery-grid{

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

}

.large{

grid-column:span 2;

}

.gallery-cta{

text-align:center;
justify-content:center;

}

}

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

}

.large{

grid-column:span 1;
height:420px;

}

.gallery-card{

height:320px;

}

.gallery-heading h2{

font-size:34px;

}

.gallery-cta{

padding:40px 25px;

}

.gallery-cta h2{

font-size:30px;

}

}/* End custom CSS */