body{

    margin:0;

}

/*==========================================
ABOUT HERO
==========================================*/

.about-hero{

    position:relative;

    width:100%;

    height:720px;

    overflow:hidden;

}

.about-hero img{

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;

}

.about-overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(
        rgba(0,0,0,.22),
        rgba(0,0,0,.38)
    );

}

.about-content{

    position:absolute;

    top:50%;

    left:50%;

    transform:translate(-50%,-50%);

    width:100%;

    padding:0 20px;

    text-align:center;

}

.about-subtitle{

    display:block;

    margin-bottom:18px;

    color:#C8A96A;

    font-size:14px;

    letter-spacing:4px;

    text-transform:uppercase;

}

.about-content h1{

    font-family:"Cormorant Garamond",serif;

    font-size:108px;

    font-weight:500;

    letter-spacing:8px;

    color:#fff;

    margin-bottom:18px;

}

.about-content p{

    max-width:620px;

    margin:auto;

    color:rgba(255,255,255,.92);

    font-size:20px;

    line-height:1.8;

}

@media(max-width:768px){

.about-hero{

    height:calc(100vh - 75px);

    margin-top:75px;

}

.about-content{

    top:55%;

}

.about-subtitle{

    font-size:11px;

    letter-spacing:3px;

}

.about-content h1{

    font-size:56px;

    letter-spacing:5px;

}

.about-content p{

    max-width:280px;

    font-size:15px;

    line-height:1.8;

}

}

/*==========================================
OUR STORY
==========================================*/

.our-story{

    padding:120px 0;

    background:#fff;

}

.container{

    width:90%;

    max-width:1280px;

    margin:auto;

}

.story-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:80px;

    align-items:center;

}

.story-image{

    overflow:hidden;

    border-radius:22px;

}

.story-image img{

    width:100%;

    display:block;

    border-radius:22px;

    transition:.5s;

}

.story-image:hover img{

    transform:scale(1.05);

}

.story-text span{

    color:#C8A96A;

    letter-spacing:3px;

    font-size:13px;

}

.story-text h2{

    font-family:"Cormorant Garamond",serif;

    font-size:54px;

    font-weight:500;

    line-height:1.2;

    color:#111;

    margin:18px 0 28px;

}

.story-text p{

    color:#666;

    line-height:1.9;

    font-size:17px;

    margin-bottom:22px;

}

@media(max-width:768px){

.story-grid{

    grid-template-columns:1fr;

    gap:40px;

}

.story-text{

    text-align:center;

}

.story-text h2{

    font-size:36px;

}

.story-text p{

    font-size:15px;

}

}

/*==========================================
OUR VALUES
==========================================*/

.our-values{

    padding:120px 0;

    background:#FAF8F5;

}

.values-heading{

    text-align:center;

    margin-bottom:70px;

}

.values-heading span{

    color:#C8A96A;

    letter-spacing:3px;

    font-size:13px;

}

.values-heading h2{

    font-family:"Cormorant Garamond",serif;

    font-size:54px;

    font-weight:500;

    margin:18px 0;

    color:#111;

}

.values-heading p{

    max-width:650px;

    margin:auto;

    color:#666;

    line-height:1.8;

    font-size:17px;

}

.values-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:35px;

}

.value-card{

    background:#fff;

    padding:50px 40px;

    border-radius:22px;

    text-align:center;

    transition:.35s;

    box-shadow:0 10px 30px rgba(0,0,0,.04);

}

.value-card:hover{

    transform:translateY(-10px);

    box-shadow:0 20px 45px rgba(0,0,0,.08);

}

.value-icon{

    width:70px;

    height:70px;

    margin:auto;

    border-radius:50%;

    background:#F7F4EF;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:24px;

    color:#C8A96A;

    margin-bottom:25px;

}

.value-card h3{

    font-family:"Cormorant Garamond",serif;

    font-size:30px;

    margin-bottom:18px;

    color:#111;

}

.value-card p{

    color:#777;

    line-height:1.9;

    font-size:16px;

}

@media(max-width:768px){

    .values-heading h2{

        font-size:34px;

    }

    .values-heading p{

        font-size:14px;

        max-width:300px;

        margin:auto;

    }

    .values-grid{

        display:grid;

        grid-template-columns:repeat(2,1fr);

        gap:16px;

    }

    .value-card{

        padding:24px 16px;

        border-radius:18px;

    }

    .value-icon{

        width:52px;

        height:52px;

        font-size:18px;

        margin-bottom:14px;

    }

    .value-card h3{

        font-size:22px;

        margin-bottom:10px;

        line-height:1.2;

    }

    .value-card p{

        font-size:13px;

        line-height:1.6;

    }

    .value-card:nth-child(3){

        grid-column:1 / 3;

        justify-self:center;

        width:68%;

    }

}

/*==========================================
STATISTICS
==========================================*/

.stats-section{

    padding:110px 0;

    background:#fff;

}

.stats-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

}

.stat-box{

    text-align:center;

}

.stat-box h2{

    font-family:"Cormorant Garamond",serif;

    font-size:72px;

    font-weight:500;

    color:#111;

    margin-bottom:12px;

}

.stat-box p{

    color:#777;

    font-size:16px;

    letter-spacing:.5px;

}

@media(max-width:768px){

.stats-grid{

    grid-template-columns:repeat(2,1fr);

    gap:30px;

}

.stat-box h2{

    font-size:46px;

}

.stat-box p{

    font-size:14px;

}

}

/*==========================================
ABOUT CTA
==========================================*/

.about-cta{

    position:relative;

    width:100%;

    height:620px;

    overflow:hidden;

}

.about-cta img{

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;

    transition:.5s;

}

.about-cta:hover img{

    transform:scale(1.04);

}

.cta-overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(
        rgba(0,0,0,.20),
        rgba(0,0,0,.45)
    );

}

.cta-content{

    position:absolute;

    top:50%;

    left:50%;

    transform:translate(-50%,-50%);

    width:100%;

    max-width:800px;

    padding:0 20px;

    text-align:center;

}

.cta-content span{

    display:block;

    color:#C8A96A;

    font-size:13px;

    letter-spacing:4px;

    margin-bottom:18px;

}

.cta-content h2{

    font-family:"Cormorant Garamond",serif;

    font-size:68px;

    font-weight:500;

    color:#fff;

    margin-bottom:20px;

    line-height:1.15;

}

.cta-content p{

    max-width:560px;

    margin:0 auto 35px;

    color:rgba(255,255,255,.92);

    font-size:18px;

    line-height:1.8;

}

.cta-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    width:180px;

    height:56px;

    background:#C8A96A;

    color:#111;

    text-decoration:none;

    border-radius:40px;

    font-size:13px;

    letter-spacing:2px;

    font-weight:600;

    transition:.35s;

}

.cta-btn:hover{

    background:#fff;

    transform:translateY(-3px);

}

@media(max-width:768px){

.about-cta{

    height:460px;

}

.cta-content span{

    font-size:11px;

    letter-spacing:3px;

}

.cta-content h2{

    font-size:42px;

}

.cta-content p{

    font-size:15px;

    max-width:300px;

    margin-bottom:28px;

}

.cta-btn{

    width:160px;

    height:50px;

    font-size:12px;

}

}

.cart-icon{
    position: relative;
    text-decoration: none;
    color: #111;
}

#cartCount{
    position: absolute;
    top: -8px;
    right: -8px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #111;
    color: #fff;
    font-size: 11px;
    display: flex;
    justify-content: center;
    align-items: center;
}