/* =====================================
   Bridal Collections Page
===================================== */


/* General */

.bridal-collections {

    background: #faf7f2;
    min-height: 100vh;

}


.container {

    width: min(1200px, 90%);
    margin: auto;

}



/* =====================================
   Hero Section
===================================== */


.collections-hero {
    padding: 150px 0 80px;
    text-align: center;

    h1 {
    font-size: 60px;
    color: #C9A24D;
    margin-bottom: 25px;
    }

    p {
    max-width: 750px;
    margin: auto;
    color: #555;
    font-size: 18px;
    line-height: 1.8;
    }

}


.section-tag {

    display: inline-block;

    color: #C9A24D;

    text-transform: uppercase;

    letter-spacing: 3px;

    font-size: 14px;

    margin-bottom: 20px;

}



/* =====================================
   Category Navigation
===================================== */


.collection-navigation {

    padding: 30px 0;

}


.collection-filters {

    display: flex;

    justify-content: center;

    align-items: center;

    flex-wrap: wrap;

    gap: 15px;

}


.collection-filters a {

    padding: 12px 28px;

    border-radius: 50px;

    background: #fff;

    color: #8E4162;

    text-decoration: none;

    font-size: 15px;

    border: 1px solid #eee;

    transition: .3s;

}


.collection-filters a:hover,
.collection-filters .active {

    background: #8E4162;

    color: #fff;

}



/* =====================================
   Products Heading
===================================== */


.collection-products {

    padding: 50px 0 100px;

}


.collection-heading {

    text-align:center;

    margin-bottom:50px;

}


.collection-heading h2 {

    font-family:"Playfair Display", serif;

    color:#C9A24D;

    font-size:42px;

    margin-bottom:15px;

}


.collection-heading p {

    color:#666;

    font-size:17px;

}



/* =====================================
   Product Grid
===================================== */


.collections-grid {

    display:grid;

    grid-template-columns:repeat(3, 1fr);

    gap:35px;

}



/* =====================================
   Product Card
===================================== */


.dress-card {

    background:#fff;

    overflow:hidden;

    border-radius:12px;

    box-shadow:0 10px 35px rgba(0,0,0,.06);

    transition:.35s;

}


.dress-card:hover {

    transform:translateY(-10px);

    box-shadow:0 20px 50px rgba(0,0,0,.12);

}



/* =====================================
   Image
===================================== */


.dress-image {
    position:relative;
    overflow:hidden;
    height: 280px;

    img {
        width:100%;
        height:100%;
        object-fit:cover;
        transition:.5s;
    }
}

.dress-card:hover .dress-image img {

    transform:scale(1.05);

}



/* =====================================
   Sale Badge
===================================== */


.sale-badge {
    position:absolute;
    top:20px;
    left:20px;
    z-index:2;
    background:#a04a8b;
    color:white;
    padding:8px 18px;
    border-radius:30px;
    text-transform:uppercase;
    font-size:12px;
    letter-spacing:1px;
}



/* =====================================
   Product Details
===================================== */


.dress-info {
    padding: 10px;

    h3 {
        margin-bottom:12px;

        a {
            font-family:"Playfair Display", serif;
            color:#333;
            text-decoration:none;
            font-size:20px;
        }
    }
}

.dress-category {

    color:#8E4162;

    text-transform:uppercase;

    letter-spacing:2px;

    font-size:13px;

    margin-bottom:15px;

}



.dress-price {

    color:#8E4162;

    font-size:22px;

    font-weight:600;

    margin-bottom:15px;

}



/* =====================================
   Availability
===================================== */


.status {

    display:inline-block;

    padding:8px 18px;

    border-radius:50px;

    font-size:13px;

    font-weight:600;

    margin-bottom:20px;

}


.available {

    background:#e8f5e9;

    color:#2e7d32;

}


.sold {

    background:#fdecea;

    color:#c62828;

}



/* =====================================
   Button
===================================== */


.view-details-button {
    display:block;
    text-align:center;
    padding:10px;
    background:#8E4162;
    color:#fff;
    text-decoration:none;
    border-radius:6px;
    transition:.3s;
}


.view-details-button:hover {
    background:#6f314d;
    color:#fff;
}



/* =====================================
   Empty Products
===================================== */


.no-products {

    text-align:center;

    padding:50px;

}



/* =====================================
   Responsive
===================================== */


@media(max-width:900px){


    .collections-grid {

        grid-template-columns:repeat(2,1fr);

    }


}


@media(max-width:600px){


    .collections-grid {

        grid-template-columns:1fr;

    }


    .collections-hero h1 {

        font-size:42px;

    }


    .dress-image img {
        width: 100%;
        height:300px;
        object-fit:cover;

    }


}