@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Allura&display=swap');
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --bg-primary:    #F3EFEA;
    --bg-secondary:  #E7DED1;

    --primary:       #2f4a3c;
    --primary-800:   #3b6654;
    --primary-700:   #427661;
    --primary-600:   #49866f;
    --primary-500:   #4f937b;
    --primary-400:   #5aa48b;
    --primary-300:   #6fb49e;
    --primary-200:   #93c9b9;
    --primary-100:   #bbded4;
    --primary-50:   #bbded4;
    --primary-dark:  #1F3228;

    --accent:        #B47602;
    --accent-light:  #D09A33;

    --text-dark:     #1F1F1F;
    --text-light:    #6F6A64;

    --white:         #FFFFFF;

    --primary-family: 'Jost', sans-serif;
    --secondary-family: 'Montserrat', sans-serif;
}

/* BUTTON PRIMARY */
.btn-primary { background: var(--primary-500); color:var(--white); border:none; padding:14px 32px; border-radius:50px; transition:.3s; text-decoration: none; font-size: 14px; text-transform: uppercase; letter-spacing: 1px; font-weight: 500; transition: 0.3s; transform: translateY(0); position: relative;}
.btn-primary span { position: relative; z-index: 1;}
.btn-primary::before {    content: ''; background: var(--accent-light); width: 0%; height: 100%; position: absolute; left: 0; top: 0; inset-block: -0.1rem; inset-inline-start: -0.1rem; z-index: 0; transition: width .4s ease; border-radius: 50px; }
.btn-primary:hover{ transform: translateY(20px); background:var(--primary-dark);}
.btn-primary:hover::before { width: calc(100% + 1px); height: calc(100% + 1px);}

/* BUTTON ACCENT */
.btn-accent{ background: var(--accent); color: var(--white); padding: 10px; text-decoration: none; font-size: 14px; text-transform: uppercase; letter-spacing: 2px; border-radius: 2px; display: inline-flex; gap: 8px; transition: 0.3s; transform: translateY(0);}
.btn-accent:hover{ background:var(--accent-light); transform: translateY(5px);}

.btn-accent i,
.btn-accent span { font-size: 18px;}

.py-60 { padding-top: 6rem; padding-bottom: 6rem; }
.pt-60 { padding-top: 6rem }
.pb-60 { padding-bottom: 6rem }
.text-center { text-align: center;}

html {
    font-size: 62.5%;
}

.container {max-width: 90%; margin: auto; padding: 0 20px;}
.container-fluid { max-width: 95%; margin: auto; padding: 0 20px;}

img {
    max-width: 100%;
    height: auto;
}

body {
    font-family: var(--primary-family);
    background-color: var(--white);
    color: var(--text-dark);
    font-size: 15px;
    background:var(--bg-primary);
}

/* .gradient {
        background: radial-gradient(50% 50% at 50% 50%, rgba(209, 155, 74, 0.12) 0%, rgba(255, 243, 209, 0.12) 100%);
    position: absolute;
    height: 660px;
    width: 100%;
    right: -50%;
    top: 0;
    border-radius: 960px;
    -webkit-filter: blur(82px);
    filter: blur(82px);
} */


/* NAV */

/* ==========================
   NAVIGATION
========================== */

.mobile_menu { display: none;}

.main-nav { height:100%; display:flex; align-items:center;}
.main-nav > ul{ list-style:none; display:flex; align-items:center; gap:calc(15px, 2rem, 3rem);}
.main-nav ul li{ position:relative;}
.main-nav ul li>a{ display:flex; align-items:center; gap:4px; text-decoration:none; color:var(--text-dark); padding:12px 14px; font-size:13px; font-weight:500; transition:.3s;}
.main-nav ul li>a:hover{ color:var(--primary);}
.main-nav .material-symbols-outlined{ font-size:18px; transition:.3s;}

/* ==========================
   MEGA MENU
========================== */

.mega-menu{ position:absolute; top:100%; left:50%; transform:translateX(-50%) translateY(15px); min-width:950px; display:flex; gap:50px; background:#fff; padding:35px; border-radius:24px;    box-shadow:0 15px 50px rgba(0,0,0,.08);  opacity:0; visibility:hidden; transition:.35s ease; z-index:999;}
.has-mega:hover .mega-menu{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0);}
.has-mega:hover>a .material-symbols-outlined{ transform:rotate(180deg);}
.mega-col{ min-width:180px;}
.mega-col h4{ margin-bottom:15px; color:var(--primary); font-size:15px; font-weight:600;}
.mega-col a{ display:block; margin-bottom:10px; color:var(--text-light); text-decoration:none; transition:.3s;}
.mega-col a:hover{ color:var(--primary); padding-left:5px;}

.menu-product-grid {display: flex; flex-wrap: wrap; gap: 2rem;}
.menu-product-grid .menu_product_card { background-color: #f3efea; border: solid 1px #e4dbcf; padding: 5px; flex: 0 0 160px; text-decoration: none; transition: all 0.4s ease;}
.menu-product-grid .menu_product_card .menu_product_image { aspect-ratio: 8/5; border-radius: 10px; overflow: hidden; border-bottom: solid 4px; border-color: var(--accent);} 
.menu-product-grid .menu_product_card .menu_product_image img { width: 100%; height: 100%; object-fit: cover; transition: all 1.1s ease; }
.menu-product-grid .menu_product_card h5 { font-size: 14px; margin: 5px 0; text-align: center; font-weight: 500; letter-spacing: 0.5px; color: var(--primary-dark);}

.menu-product-grid .menu_product_card:hover { box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;}
.menu-product-grid .menu_product_card:hover .menu_product_image img { transform: scale(1.2);}

/* ==========================
   MEGA BANNER
========================== */
.mega-banner{ width:260px; overflow:hidden; border-radius:20px; position:relative;}
.mega-banner img{ width:100%; height:100%; object-fit:cover;}
.mega-banner-content{ position:absolute; inset:0; background:linear-gradient(transparent, rgba(0,0,0,.65)); padding:20px; display:flex; flex-direction:column; justify-content:flex-end;}
.mega-banner-content h3{ color:#fff; margin-bottom:10px;}
.mega-banner-content a{ color:#fff; text-decoration:none;}

/* ==========================
   DROPDOWN MENU
========================== */

.dropdown-menu{ position:absolute; top:100%; left:0; min-width:200px; background:#fff; border-radius:18px; padding:10px 0; box-shadow:0 15px 40px rgba(0,0,0,.08); opacity:0; visibility:hidden;
transform:translateY(15px); transition:.3s; z-index:999; flex-direction: column; list-style: none;}
.has-dropdown:hover .dropdown-menu{ opacity:1; visibility:visible; transform:translateY(0); }
.has-dropdown:hover>a .material-symbols-outlined{ transform:rotate(180deg);}
.dropdown-menu li{ width:100%;}
.dropdown-menu a{ display:block; padding:12px 20px; text-decoration:none; color:var(--text-dark); transition:.3s;}
.dropdown-menu a:hover{ background:#f8f5f1; color:var(--primary);}



/* ==========================
   MOBILE
========================== */
.nav-close { display: none; background-color: var(--primary-dark); color: white; width: 30px; height: 30px; position: absolute; top: 10px; right: 10px; cursor: pointer; border: none; }
.nav-close:hover { background-color: var(--primary-800);}
@media(max-width:1155px){
    .main-nav{ position: fixed; left: 0; height: 100vh; background: #ffffff; max-width: 342px; width: 100%; top: 0; box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px; padding: 0 4rem;
    align-items: flex-start; opacity:0; visibility:hidden; transform:translateX(-342px); transition:.35s ease; z-index: 9; padding-top: 5rem; }

    .nav-close { display: block;}
    
    .main-nav.active{ opacity:1; visibility:visible; transform:translateX(0);}
    .main-nav ul{ flex-direction:column; align-items:flex-start; width:100%; gap:0; }
    .main-nav ul li{ width:100%; }
    .main-nav ul li>a{ width:100%; justify-content:space-between; padding:14px 0; }

    .mega-menu,
    .dropdown-menu{ display:none; position:static; opacity:1; visibility:visible; transform:none; min-width:100%; width:100%; box-shadow:none; border-radius:0; padding:15px 0;background:transparent; }

    .mega-menu{flex-direction:column; gap:20px;    }
    .mega-banner{ width:100%; height:200px; }

    .has-mega.active .mega-menu,
    .has-dropdown.active .dropdown-menu{ display:flex; }

    .has-dropdown.active>a .material-symbols-outlined,
    .has-mega.active>a .material-symbols-outlined{ transform:rotate(180deg); }

    .has-mega:hover .mega-menu{ opacity:1; visibility:visible; transform: none;}

    .main-nav>ul>li> a { border-bottom: solid 1px #ccc;}
}



/* ----------------------------------------------------------- */


.header_container { background: var(--white); max-width: 90%; display: flex; justify-content: space-between; align-items: center; margin: 20px auto 0; border-radius: 50px;box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 8px;
width: 100%; position: relative; padding: 8px 20px; z-index: 1; transition:all .4s ease;}
.header_container .logo img { width: 180px; height: auto;}


header.sticky-header{ position:fixed; top:20px; left:0; right:0; max-width:95%; margin:auto; z-index:9999; animation:headerSlide .4s ease;}

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

.header_right { display: flex; align-items: center; gap: 20px; }
.user-actions { display: flex; align-items: center; gap: 8px; border: none; cursor: pointer; }
.user-actions button {background: none; font-size: 12px; display: flex; align-items: center; gap: 5px; border: none; cursor: pointer; font-family: var(--secondary-family); color: var(--text-dark); transition: color 0.3s ease;}
.user-actions button span {font-size: 20px; color: var(--text-dark);}
.header_right .divider { color: var(--bg-secondary)}

/* cart dropdonw */
.cart-wrapper{ position:relative;}

/* DROPDOWN */
.cart-wrapper .cart-dropdown::before{ content:''; position:absolute; top:-8px; right:40px; width:16px; height:16px; background:#fff; transform:rotate(45deg);}
.cart-wrapper .cart-dropdown{ position:absolute; top:calc(100% + 20px); right:0; width:340px; background:#fff; border-radius:20px; padding:20px; box-shadow:0 15px 40px rgba(0,0,0,.12); opacity:0;
visibility:hidden; transform:translateY(15px); transition:.35s ease; z-index:999;}
.cart-wrapper.active .cart-dropdown{ opacity:1; visibility:visible; transform:translateY(0);}

/* ITEM */
.cart-wrapper .cart-item{ display:flex; align-items:center; gap:15px; padding-bottom:15px; margin-bottom:15px; border-bottom:1px solid #eee;}
.cart-wrapper .cart-item img{ width:70px; height:70px; border-radius:12px; object-fit:cover; flex-shrink:0;}
.cart-wrapper .cart-info{ flex:1;}
.cart-wrapper .cart-info h5{ font-size:14px; margin-bottom:5px; line-height:1.4;}
.cart-wrapper .cart-info span{ display:block; color:#777; font-size:12px; margin-bottom:5px;}
.cart-wrapper .cart-info strong{ color:var(--primary); font-size:15px;}
.cart-wrapper .remove-item{ background:none; border:none; cursor:pointer;}
.cart-wrapper .remove-item span{ font-size:18px;}

/* FOOTER */
.cart-wrapper .cart-footer{ margin-top:10px;}
.cart-wrapper .cart-total{ display:flex; justify-content:space-between; margin-bottom:15px; font-size:15px;}
.cart-wrapper .view-cart-btn{ display:flex; align-items:center; justify-content:center; width:100%; height:48px; background:var(--primary); color:#fff; border-radius:12px; text-decoration:none;
 font-weight:500;}

/* COUNT */
.cart-wrapper .cart-count{ width:18px; height:18px; background:#B47602; color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center;  font-size:10px !important;
}

.hero { max-width: 98%; margin: -20px auto 0; border-radius: 50px; overflow: hidden; height: 80vh;}
.hero_slider { position: relative; height: 100%;}
.slides { height: 100%;}
.slide { position: relative; height: 100%; overflow: hidden;}
.slide img { width: 100%; height: 100%; object-fit: cover; display: block;}
.hero_slider .slick-dots { position: absolute; bottom: 22px; left: 50%; transform: translateX(-50%); display: flex !important; gap: 10px; margin: 0; padding: 0; justify-content: center;}
.hero_slider .slick-dots li { display: inline-block; margin: 0;}
.hero_slider .slick-dots button { width: 24px; height: 5px; border: none; border-radius: 999px; background: rgba(255, 255, 255, 0.55); padding: 0; cursor: pointer; transition: all 0.25s ease;}
.hero_slider .slick-dots .slick-active button { background: var(--primary);}
.hero_slider .slick-dots button:before { display: none;}


/* SEARCH--------------- */
.search_icon button {background: white; border: none; cursor: pointer; color: #a38e74; font-size: 16px; padding: 5px; border-radius: 20px; line-height: normal; width: 30px; height: 30px; display: flex;
    align-items: center; justify-content: center; box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 8px; border: solid 1px var(--bg-secondary); position: relative; z-index: 1; }
.nav_logo_container { display: flex; align-items: center; gap: 20px; }
.search_icon button span { font-size: 18px; }


.search-overlay { position:absolute; left:0; top:102%; width:100%; border-radius: 50px; background:#fff; z-index:9999; opacity:0; visibility:hidden; transform:translateY(-30px); transition:.4s ease; overflow: hidden; border-left: solid 1px #c9c9c9;}


.search-overlay.active{ opacity:1; visibility:visible; transform:none;}

/* Header */
.search-header{display:flex; align-items:center; border-bottom:1px solid #e5e5e5; padding:20px 4rem;}
.search-header input{ flex:1; border:none; outline:none; font-size:16px; font-family: var(--primary-family);}
.close-search{ border:none; background:none; cursor:pointer;}

/* Content */
.search-content{ display:grid; grid-template-columns:300px 1fr;}

/* Left */
.popular-searches{ padding:3rem; border-right:1px solid #eee; background-color: #2f4a3c14;}
.popular-searches h4{ font-size:14px; margin-bottom:20px; letter-spacing:2px;}
.popular-searches a { display:inline-block; padding:10px 16px; background: var(--bg-secondary); transition: all 0.4s ease-in-out; border-radius:8px; margin:0 10px 10px 0; text-decoration:none; color:#222; font-size:14px;}
.popular-searches a:hover { background-color: var(--accent-light)}

/* Right */
.search-products { padding:3rem; display:flex; flex-wrap: nowrap; overflow-x: auto; gap:20px;}
.search-products .product-card { min-width: 280px;}






/* categories */
.fw_categories{ overflow:hidden;}
.fw_categories .container { max-width: 95%; }
.fw_category_grid{ display:grid; grid-template-columns:repeat(7,minmax(140px, 1fr)); gap:3rem; padding-bottom: 3rem;}

/* Card Design + Initial Position */
.fw_category_card {background: #FFFFFF; box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1); border-radius: 20px; padding: 10px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; text-align:center; text-decoration:none; overflow:hidden; transition: transform 1500ms cubic-bezier(0.4,0,0.2,1), border-color .35s ease, box-shadow .35s ease; will-change:transform;}

.fw_category_card .fw_category_image { width: 100%; aspect-ratio: 1/1; border-radius: 12px 12px 0 0; overflow: hidden;}
.fw_category_card .fw_category_image img { aspect-ratio: 1/1; object-fit: cover; transition:transform .95s ease;}


/* Start Split */
.fw_category_card:nth-child(odd){
    transform:translateX(calc(100% + 25px));
}

.fw_category_card:nth-child(even){
    transform:translateX(calc(-100% - 25px));
}

/* Animate To Center */
.fw_categories[data-inview="true"] .fw_category_card{
    transform:translateX(0);
}

/* Hover */
.fw_category_card:hover .fw_category_image img {
    transform:scale(1.05);
    transition:transform .95s ease;
}



/* Title */
.fw_category_card h3{
    margin:0;
    font-size:15px;
    font-weight:400;
    color:#1F1F1F;
    line-height:1.4;
}

/* Responsive */
@media(max-width:1199px){
    .fw_category_grid{
        grid-template-columns:repeat(4,1fr);
    }
}

@media(max-width:767px){
    .fw_category_grid{
        grid-template-columns:repeat(2,1fr);
        gap:15px;
    }

    .fw_category_card{
        min-height:120px;
        padding:20px 10px;
    }

    .fw_category_card .material-symbols-outlined{
        font-size:34px;
    }
}

/* -------------SHOP BY CATEGORY------------------ */
.fw_refresh_room { background:#F3EFEA; overflow:hidden;}
.fw_refresh_wrap{ display:flex; align-items:center; gap:6rem;}
.fw_refresh_content{ width:320px; flex-shrink:0;}
.fw_subtitle{ display:inline-block; margin-bottom:10px; color:#B47602; letter-spacing:2px; text-transform:uppercase; font-size:clamp(12px, 1.3rem, 14px);}
.fw_title{ font-size:clamp(3rem, 4rem, 4.1rem); line-height:1; margin-bottom:25px; font-weight:600; color:#111;}
.fw_content { color:#666; line-height:1.8; margin-bottom:40px; max-width: 600px; margin: auto; font-size: clamp(15px, 1.8rem, 2rem);}
.fw_refresh_arrows{ display:flex; gap:12px; margin-top: 2rem;}
.fw_refresh_arrows button{ width:4rem; height:4rem; border-radius:50%; border:1px solid #ddd; background:#fff; cursor:pointer; transition:.3s; display: flex; align-items: center; justify-content: center;}
.fw_refresh_arrows button span { font-size: 2.4rem;}
.fw_refresh_arrows button:hover{ background:var(--primary); color:#fff; border-color:var(--primary);}
.fw_collection_card{ position:relative; height:320px; overflow:visible; border-radius:10px; margin:0 12px;}

.fw_collection_card .image { height: 300px; border-radius: 18px; overflow: hidden;}
.fw_collection_card .image img{ width:100%; height:100%; object-fit:cover; transition:1s;}

.fw_collection_card:hover img{ transform:scale(1.05);}

.fw_collection_card h3{ font-size: clamp(19px, 2.2rem, 2.5rem); font-weight: 500; color: #111; background: linear-gradient(45deg, #ffffff, transparent); padding: 5px 10px; border-radius: 20px 0 0 20px; position: absolute; inset: 0; top: 2rem; height: 42px; left: 2rem;}

.fw_collection_card a.btn{color: white; text-decoration: none; font-weight: 600; text-transform: uppercase; font-size: 14px; letter-spacing: 1px; display: inline-block; background: #483925; align-self: anchor-center;  padding: 4px 8px; border-radius: 4px; margin: 5px; border: none; margin: 5px auto; position: absolute;  top: 80%; transform: translateY(10px); transition: 0.4s ease-in-out;}
.fw_collection_card:hover a.btn { transform: translateY(0); background-color: var(--primary); }

.fw_refresh_slider{
    flex:1;
    min-width:0;
}


.fw_refresh_slider .slick-track{
    display:flex;
}

.fw_refresh_slider .slick-slide{
    height:inherit;
    margin:0 12px;
}



/*  sub category------------------------------------------- */

.fw_subcategories .container-fluid { max-width: 98%}
.fw_subcategory_grid { display:flex; gap:25px; margin-top: 4rem;}
.fw_home_furnishing  .fw_title { margin-bottom: 8px;}

.fw_subcategory_grid_left, .fw_subcategory_grid_right { flex: 1 1 590px; display: flex; flex-direction: column; gap: 25px;}
.fw_subcategory_grid_center { gap: 25px; display: flex; flex-direction: column;}
.fw_subcategories .border { border: solid 1px; border-color: var(--accent); padding: 5px; border-radius: 23px;}


.fw_subcat_card { position:relative; overflow:hidden; border-radius:18px; display:block; aspect-ratio:1/0.86;}
.fw_subcat_large { aspect-ratio: 1/1.8;}
.fw_subcat_wide{ grid-column:1/-1; aspect-ratio:2/0.97;}

.fw_subcat_card img{width:100%; height:100%; object-fit:cover; transition:0.8s;}
.fw_subcat_card:hover img{ transform:scale(1.08);}
.fw_subcat_content{ position:absolute; inset:0; padding:2.5rem; display:flex; flex-direction:column; justify-content:flex-end; background:linear-gradient( to top, rgba(0,0,0,.55), rgba(0,0,0,0) );}
.fw_subcat_content h3{ color:#fff; font-size:2.7rem; margin:0 0 8px; font-weight: 500;}
.fw_subcat_content span{ color:#fff; font-size:14px; letter-spacing:1px; text-transform:uppercase;}

/* HOME DECOR--------------------------------- */


.fw_home_frunishing_grid {display: flex;  gap: 3rem; margin-top: 4rem;}
.fw_home_frunishing_product_grid { display: flex;  gap: 2rem; flex-wrap: wrap; align-content: start;}
.fw_home_furnishing .product_card { background-color: #fbfbfb; padding: 1.2rem; box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px, rgb(209, 213, 219) 0px 0px 0px 1px inset; flex: 0 1 250px; transition: all 0.5s ease;}
.fw_home_furnishing .product_card .product_card_image { aspect-ratio: 1/0.8; margin-bottom: 8px; overflow: hidden;}
.fw_home_furnishing .product_card .product_card_image img { width: 100%; height: 100%; object-fit: cover; transition: all 1.1s ease-in-out;}
.fw_home_furnishing .product_content {
        display: flex;
    flex-direction: column;
    gap: 3px;
    align-items: center;
}
.fw_home_furnishing .product_card .product_price { opacity: 0.8;}
.fw_home_furnishing .product_card:hover img { scale: 1.1;}
.fw_home_furnishing .product_card:hover {box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;}

.fw_home_frunishing_grid_banner_image { aspect-ratio: 1/1.2; max-width: 400px; position: relative; width: 100%; }
.fw_home_frunishing_grid_banner_image img { height: 100%; object-fit: cover; width: 100%;}
.fw_home_frunishing_grid_banner_image .border { position: absolute; inset: 20px; border: 1px solid rgba(255, 255, 255, 0.85); transition: 0.5s ease; pointer-events: none; z-index: 1; top: 26px; bottom: 26px;}

.tittle_new {font-size: 6rem; text-transform: uppercase; text-align: center; position: absolute; top: 50%; left: 50%; margin: 5px; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border: 4px solid transparent; outline: 1px solid #fff; padding: 10px 4rem; mix-blend-mode: lighten; font-weight: 900; z-index: 2; font-family: var(--primary-family);
}

.tittle_new::before { z-index: -1; content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff;}
.tittle_new::after { content: ''; height: 100%; width: 25%; position: absolute; top: 0; left: 75%; background-color: rgba(0, 0, 0, 0.5); z-index: 1;-webkit-transition: all 0.7s ease-in-out; -o-transition: all 0.7s ease-in-out;
    transition: all 0.7s ease-in-out;}

/* OFFER AD STRIP_______________________________________________________________ */


.fw_offer_strip { padding:15px; background-color: white; max-width: 100%; margin: auto; max-width: 1400px; border-radius: 15px; box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;}
.fw_offer_strip .container { max-width: 100%; padding: 0; }
.fw_offer_strip .left-column { display: flex; background-color: var(--bg-primary); padding: 6px 1rem; border-radius: 10px; box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 3px 0px; flex-direction: column; justify-content: center; align-items: center;}
.fw_offer_strip .right-column {  background-color: #d09a3333; padding: 6px 2rem; border-radius: 10px; box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 3px 0px; align-items: center; justify-content: center; display: flex;}
.fw_ads_one { display: flex;}

.fw_offer_grid {display:grid; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); gap:20px;}

.fw_offer_box { border-radius:20px; display:flex; align-items:center;}
.fw_offer_box.fw_countdown_box { max-width: 400px; gap: 3rem;}
.fw_offer_box .feature_icon { padding: 8px; width: 40px;height: 40px; border-radius: 40px; background: #f7efe5; display: flex; align-items: center; justify-content: center;}

.fw_offer_label{ font-size:13px; font-weight:600; letter-spacing:2px; text-transform:uppercase;}
.fw_offer_label span { font-size: 3rem; font-weight: 700; color: var(--accent);}
.fw_countdown_box{ justify-content:space-between;}
.fw_timer{ display:flex; gap:20px;}
.fw_timer div{ text-align:center;}
.fw_timer strong{ display:block; font-size:2.4rem; color:#B47602;}
.fw_timer span{ font-size:12px; color:#666;}
.fw_features{ justify-content:space-between; gap: 1rem; flex-wrap: wrap;}
.fw_feature{  text-align:center; display: flex; gap: 10px; align-items: center; justify-content: center;}
.fw_feature .material-symbols-outlined{ color:#B47602; font-size:2.8rem;}
.fw_feature p{ margin:0; font-size:14px;}



/* PRODUCT LISTING--------------------- */
.fw_section_head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:30px;}
.fw_section_head h2{  margin:0; font-size:3.2rem; font-weight:600; color:#1f1f1f;}
.fw_view_all{ color:var(--accent-light); text-decoration:none; font-weight:500; position: relative; transition: all 0.5s ease-in-out;}
.fw_view_all::after { content: ''; position: absolute; height: 1px; background-color: var(--accent); width: 20%; transition: width 0.2s ease-in-out; bottom: 0;  left: 0; right: 0; margin: auto;}
.fw_view_all:hover { color: var(--accent);}
.fw_view_all:hover::after { width: 100%;}
.fw_product_grid{  gap:24px;}

.product-card { border-radius:24px; overflow:hidden; position:relative; background:#fff; margin-right: 24px;}
.product-card .product-image{position:relative; overflow:hidden; aspect-ratio:4/5;}
.product-card .product-image img,
.product-card .product-image img.default
{ width:100%; object-fit:cover; display:block; transition:1s; aspect-ratio: 1/1;}

.product-card .product-image img.hover { aspect-ratio: 1/1; display: none;}
.product-card .product-image:hover img.hover { display: block;}
.product-card .product-image:hover img.default { display: none;}

/* WISHLIST */
.product-card .wishlist-btn{ width:4rem; height:4rem; border:none; border-radius:50%; background:rgba(255,255,255,.95); border: solid 1px #c9c9c9; backdrop-filter:blur(10px); display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:5;}
.product-card .wishlist-btn .material-symbols-outlined{ font-size:2.2rem;}

/* HOVER PANEL */
.product-card .hover-panel{ position:absolute; left:0; right:0; bottom:0; padding:0 2rem 2rem; background:rgba(255,255,255,.88); backdrop-filter:blur(20px); transform:translateY(52%); transition:.5s ease;}
.product-card:hover .hover-panel{ transform:translateY(0); padding: 1rem;}

/* CONTENT */
.product-card .hover-content h3{ font-size: 16px; line-height:1.4; margin-bottom:2px; color:var(--text-dark); font-weight: 500; white-space: nowrap; text-overflow: ellipsis; max-width: 100%;
    overflow: hidden;}
.product-card .price-wrap{ display:flex; align-items:center; gap:10px; margin-bottom:2px;}
.product-card .price{ font-size: 16px; font-weight:700; color:var(--primary);}
.product-card .old-price{ color:#999; text-decoration:line-through;}

/* ACTIONS */
.product-card .product-actions{ display:flex; gap:12px; opacity: 0;}
.product-card:hover .product-actions { opacity: 1;}
.product-card .action-btn{ height:4rem; border-radius:50px; display:flex; align-items:center; justify-content:center; text-decoration:none;}
.product-card .add_to_cart_btn{ flex:1; background: var(--primary-500); color:#fff; font-weight:500; text-transform: uppercase; font-size: clamp(13px, 1.5rem, 1.9rem);}
.product-card .add_to_cart_btn:hover{ background:var(--primary-dark);}
.product-card .icon-btn{ width:48px; background:#fff; color:var(--primary); border:1px solid rgba(0,0,0,.08);}

/* PREMIUM SHADOW */
.product-card{ box-shadow: 0 10px 30px rgba(0,0,0,.05);}
.product-card:hover{box-shadow: 0 25px 60px rgba(0,0,0,.12);}



.material-symbols-outlined.filled{
    font-variation-settings:
    'FILL' 1,
    'wght' 300,
    'GRAD' 0,
    'opsz' 24;
}

/* CATEGORY SECTION------------------------------------------------------------------ */



.fw_category_section { overflow: hidden;}
.fw_category_section .container-fluid { position: relative;}
.room-layout { display:grid; grid-template-columns:420px 1fr; gap:8rem; align-items:center;}

/* LEFT */

.section-tag{ display:block; color:#b98b4a; letter-spacing:3px; margin-bottom:15px; font-size:14px;}
.room-content h2{ font-size:4rem; line-height:1.1; margin-bottom:20px;}
.room-content p{ color:#666; margin-bottom:25px;}

/* RIGHT */

.room-showcase{ display:flex; flex-direction:column; align-items:center;}
.cube-scene{ width:100%; max-width:900px; width: 100%; height:480px; position:relative; perspective:2500px; overflow:visible;}
.room-carousel{  width:100%; height:100%; position:relative; overflow:visible;transform-style:preserve-3d;}
.room-card{ position:absolute; top:50%; left:50%; max-width:500px; aspect-ratio:5/4; border-radius:24px; overflow:hidden; transition:all .8s ease; box-shadow: 0 25px 50px rgba(0,0,0,.15);}

.room-card img{ width:100%; height:100%; object-fit:cover; display:block;}

.overlay{ position:absolute; inset:0; display:flex; justify-content:center; align-items:flex-end; padding:30px; background: linear-gradient( to top, rgba(0,0,0,.75), transparent);}
.overlay h3{ color:#fff; font-size:3.4rem; margin:0;}

/* CENTER */
.room-card.center{ transform: translate(-50%,-50%) scale(1); z-index:5;}

/* LEFT */
.room-card.left{ transform: translate(-120%,-42%) rotate(-10deg) scale(.82); z-index:2;}

/* RIGHT */
.room-card.right{ transform: translate(20%,-42%) rotate(10deg) scale(.82); z-index:2;}

/* HIDDEN */

.room-card.hidden-left{ opacity:0; transform: translate(-180%,-50%) scale(.55);}

.room-card.hidden-right{ opacity:0; transform: translate(80%,-50%) scale(.55);}

/* NAV */

.nav_btn_container{ display:flex; gap:15px; margin-top:25px;}

.nav-btn { width:4rem; height:4rem;border:none; border-radius:50%; margin-bottom: 3rem; background:#fff; cursor:pointer;  box-shadow:0 10px 25px rgba(0,0,0,.08); display: flex; align-items: center; justify-content: center;transition: all 0.5 ease-in-out;}
.nav-btn span { font-size: 18px;}
.nav-btn:hover { background-color: var(--primary);}
.nav-btn:hover span { color: white;}

/* CATEGORY */

.room-categories { display:flex; column-gap:4rem; margin-top:30px; flex-wrap:wrap; row-gap: 2rem; justify-content: center; max-width: 900px; background: linear-gradient(45deg, #2f4a3c78, #c190538c); border-radius: 3rem; padding: 3rem;}
.room-categories span {background: linear-gradient(86deg, #f3efea, #ffffff); color: #2f4a3c; min-width: 5rem; height: 5rem; display: flex; align-items: center; justify-content: center; border-radius: 3rem;
    margin-left: -50px; border-right: solid; box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;}

.room-categories a{ width:14rem; height:5rem; flex-direction: row; gap: 15px; display:flex; align-items:center; justify-content:center; border-radius:16px; text-decoration:none; color:#222; background:#fff;
    border:1px solid #eee; transition:.3s;}

.room-categories a.active,
.room-categories a:hover{ border-color:var(--primary); transform:translateY(-5px);}

.room-categories .material-symbols-outlined{ font-size:32px; font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;}
.room-categories a.active .material-symbols-outlined{ font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;}
.room-categories a.active span { background: var(--primary); border-right: none; color: white;}

/* MOBILE */

@media(max-width:991px){
    .room-layout{ grid-template-columns:1fr; gap:5rem;}
    .room-content{ text-align:center; }
    .room-card{ width:320px;}
}


/* PRODUCT GALLRY */
.fw_product_gallery { overflow: hidden;}
.fw_product_gallery .nav_btn_container { justify-content: center;}

.product_card_swiper {width: 100%;}
.product_card_swiper .swiper-slide {background-position: center;background-size: cover; width: 400px;height: 500px; border-radius: 10px;	overflow: hidden;}
.product_card_swiper .swiper-container-3d .swiper-slide-shadow-left {background-image: linear-gradient(to left, #000, #fff0); border-right: 1px solid #000; border-radius: 10px;}
.product_card_swiper .swiper-container-3d .swiper-slide-shadow-right {background-image: linear-gradient(to right, #000, #fff0); box-shadow: 0 0 0 1px #000; border-radius: 10px;}
.product_card_swiper .swiper-pagination-bullet {	background: #696969; transition: all 0.5s ease 0s;	border-radius: 8px;}
.product_card_swiper .swiper-pagination-bullet-active {background: #ffc107;	width: 30px;}
.product_card_swiper .info {position: absolute; width: calc(100% + 2px);	height: calc(50% + 2px); background: linear-gradient(180deg, #fff0 0, #0008 50px), linear-gradient(180deg, #fff0 , #0009);padding: 15px; padding-top: 70px; left: calc(-100% - 3px);	left: 0; bottom: calc(-100% - 3px);	box-sizing: border-box;	transition: var(--tst); text-align: center;}

.product_card_swiper .swiper-slide-active .info {bottom: 0; transition: var(--tst);}
.product_card_swiper .info span {width: 100%; margin: 0.25em 0 0.25em 0;	display: inline-block; padding: 0.55em 0.5em 0.55em 1em; box-sizing: border-box; color: var(--bg-primary); text-align: left; position: relative; text-transform: uppercase;	font-size: 15px; border-radius: 2em; display: flex; align-items: center; gap: 15px;}
.product_card_swiper .info span i { font-size: 20px;}
.product_card_swiper .info span:hover {background: #0008;filter: invert(1);}
.product_card_swiper .info span:before,
.product_card_swiper .info span:after {content: ""; position: absolute;	left: 0;top: 0;	background: #fff8;	height: 100%; max-width: 2em;}
.product_card_swiper .btn-accent {margin-top: 2rem;}

/* INSTA GALLERY */
.instagram-section {overflow:hidden; }
.instagram-section .fw_title { margin-bottom: 10px;}

.instagram-slider{ overflow:hidden; position:relative; margin-top: 4rem;}

.instagram-track{ display:flex; gap:25px; width:max-content;}

.insta-card { flex: 0 0 clamp(240px, 22vw, 380px); aspect-ratio: 4/5; overflow:hidden; border-radius:24px; position:relative; text-decoration:none; display: block; margin-right: 20px;}

/* if image are landscap use this */
/* .insta-card{ flex: 0 0 clamp(280px, 28vw, 500px); aspect-ratio: 5/4;} */

.insta-card img{ width:100%; height:100%; object-fit:cover; transition:.6s;}
.insta-card:hover img{ transform:scale(1.08);}
.insta-overlay{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.35); opacity:0; transition:.4s;}
.insta-card:hover .insta-overlay{ opacity:1;}
.insta-overlay i{ color:#fff; font-size:42px;}


/* FOOTER------------------------------------------- */

.footer { height: 500px; background-color: #394740;}

/* ==================================================
   FOOTER
================================================== */

.site-footer{ position:relative; margin-top:12rem;background:var(--primary); color:#fff;}
.site-footer::before{ content: ''; position: absolute; top: 0; left: 50%; width: 100%; height: 6px; transform: translateX(-50%); background: linear-gradient(45deg, #2f4a3c, #b47602); z-index: 0; border-bottom: solid 2px #e7ded1;}

/* ==================================================
   NEWSLETTER
================================================== */

.footer-newsletter{ max-width:1200px; margin:0 auto; transform:translateY(-70px); padding:3rem; border-radius:30px; background:var(--bg-secondary); display:flex; align-items:center; justify-content:space-between;   gap:4rem;}

.footer-tag{ display:block; color:var(--accent); letter-spacing:3px; font-size:13px; margin-bottom:15px;}
.footer-newsletter h2{ color:var(--text-dark); font-size:3rem; line-height:1.1; margin-bottom:15px;}
.footer-newsletter p{color:var(--text-light); margin:0;}
.newsletter-form{ display:flex; min-width:450px;}

.newsletter-form input{ flex:1; height:6rem; border:none; outline:none; padding:0 20px; border-radius:14px 0 0 14px; font-family: var(--secondary-family); font-weight: 500; color: var(--primary-dark); min-height: 40px;}
.newsletter-form button{ border: none; padding: 0 30px; background: var(--accent); color: #fff; font-weight: 500; border-radius: 0 14px 14px 0; transition: .3s; font-size: 14px; text-transform: uppercase;letter-spacing: 1px; font-family: var(--primary-family);}
.newsletter-form button:hover{ background:var(--primary);}

/* ==================================================
   MAIN FOOTER
================================================== */

.footer-grid { display:grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap:6rem; padding:0 0 7rem;}
.footer-logo{ max-width:250px; margin-bottom:20px;}
.footer-about p{ color:rgba(255,255,255,.75); line-height:1.8;}
.footer-grid h4{ margin-bottom:25px; font-size:20px;}
.footer-grid ul{ margin:0; padding:0; list-style:none;}
.footer-grid li{ margin-bottom:14px;}
.footer-grid a{ color:rgba(255,255,255,.70); text-decoration:none; transition:.3s;}
.footer-grid a:hover{ color: rgb(255,255,255);}
.footer-contact li{ color:rgba(255,255,255,.75);}
.footer-social{ display:flex; gap:12px; margin-top:25px;}
.footer-social a{ width:42px; height:42px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.08); color:#fff;}
.footer-social a:hover{ background:var(--accent); transform:translateY(-3px); color: white;}

/* ==================================================
   BOTTOM BAR
================================================== */

.footer-bottom { padding:25px 0; border-top: 1px solid rgba(255,255,255,.08); display:flex; justify-content:space-between; align-items:center;}
.footer-bottom p{ margin:0; color:rgba(255,255,255,.7);}
.footer-links{  display:flex; gap:25px;}
.footer-links a{ color:rgba(255,255,255,.7); text-decoration:none;}
.site-footer .footer-bottom:first-child { padding-top: 0; border: none;}

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

@media(max-width:991px){

    .footer-newsletter{flex-direction:column; text-align:center; padding:4rem 25px; }
    .newsletter-form{ min-width:100%; width:100%; }
    .footer-grid{ grid-template-columns:1fr 1fr; }
    .footer-bottom{ flex-direction:column; gap:15px; text-align:center;  }
}

@media(max-width:767px){

    .footer-grid{ grid-template-columns:1fr; }
    .footer-newsletter h2{ font-size:34px; }
    .newsletter-form{ flex-direction:column; }
    .newsletter-form input{ border-radius:14px; }
    .newsletter-form button{ height:5.5rem; margin-top:10px; border-radius:14px;    }
}


/* TESTIMONIAL---------------------------------------------------------- */

.fw_testimonials{ padding:6rem 0; background:#F3EFEA; overflow:hidden;}
.fw_testimonials .fw_refresh_arrows { justify-content: center; margin-bottom:5rem}

.fw_testimonials .fw_refresh_arrows {
    display: flex;
    gap: 12px;
    margin-top: 2rem;
    background: linear-gradient(45deg, #283f331c, transparent);
    max-width: 105px;
    margin: auto;
    padding: 5px;
    border-radius: 10px;
    justify-content: space-between;
    border: solid 1px #c0b5a8;
    box-shadow: 0 2px 2px #00000024;
}

.fw_testimonials .fw_refresh_arrows button {
        width: 4rem;
    height: 3rem;
    border-radius: 50%;
    border: none;
    background: none;
    cursor: pointer;
    transition: .3s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fw_testimonials .fw_refresh_arrows button span { transition: .2s ease-in;}
.fw_testimonials .fw_refresh_arrows button:hover { color: inherit; }
.fw_testimonials .fw_refresh_arrows button:last-child:hover span {transform: translateX(+5px);}
.fw_testimonials .fw_refresh_arrows button:first-child:hover span {transform: translateX(-5px);}

/* SECTION TITLE */
.section-head{ text-align:center; ;}
.section-head span{ color:#B47602; font-size:14px; text-transform:uppercase; letter-spacing:2px;}
.section-head h2{ font-size:4rem; margin-top:10px; color:#1f3228;}




/* STACK WRAPPER */
.testimonial-stack{
    position:relative;
    max-width:1200px;
    height:580px;
    margin:auto;
}

/* CARD */
.testimonial-card{
    position:absolute;
    width:320px;
    background:#fff;
    border-radius:24px;
    padding:35px;
    box-shadow:0 20px 60px rgba(0,0,0,.08);
    transition:.6s ease;
    cursor:pointer;
}

/* STARS */
.stars{
    color:#B47602;
    font-size:20px;
    letter-spacing:3px;
    margin-bottom:20px;
}

.testimonial-card p{
    color:#666;
    line-height:1.8;
    margin-bottom:25px;
}

/* USER */
.user{
    display:flex;
    align-items:center;
    gap:15px;
}

.user img{
    width:55px;
    height:55px;
    border-radius:50%;
    object-fit:cover;
}

.user h4{
    font-size:16px;
    color:#1f3228;
    margin-bottom:3px;
}

.user span{
    font-size:13px;
    color:#777;
}

/* ACTIVE CARD */
.card-active{
    background:linear-gradient(135deg,#2f4a3c,#1f3228);
    z-index:10;
}

.card-active .stars,
.card-active p,
.card-active h4,
.card-active span{
    color:#fff;
}

/* ================= */
/* SCATTERED STATE   */
/* ================= */

.card-1{
    left:0;
    top:210px;
    transform:rotate(-14deg);
    z-index:1;
}

.card-2{
    left:170px;
    top:40px;
    transform:rotate(-8deg);
    z-index:2;
}

.card-3{
    left:350px;
    top:260px;
    transform:rotate(-3deg);
    z-index:3;
}

.card-active{
    left:50%;
    top:120px;
    transform:translateX(-50%);
}

.card-5{
    right:170px;
    top:40px;
    transform:rotate(8deg);
    z-index:2;
}

.card-6{
    right:0;
    top:210px;
    transform:rotate(14deg);
    z-index:1;
}

/* ================= */
/* HOVER SPREAD      */
/* ================= */

.testimonial-stack:hover .testimonial-card{
    transform:none;
}

.testimonial-stack:hover .card-1{
    left:0;
    top:150px;
}

.testimonial-stack:hover .card-2{
    left:180px;
    top:150px;
}

.testimonial-stack:hover .card-3{
    left:360px;
    top:150px;
}

.testimonial-stack:hover .card-active{
    left:50%;
    top:150px;
    transform:translateX(-50%);
}

.testimonial-stack:hover .card-5{
    right:180px;
    top:150px;
}

.testimonial-stack:hover .card-6{
    right:0;
    top:150px;
}

/* CARD HOVER */
.testimonial-card:hover{
    transform:translateY(-20px) scale(1.03) !important;
    z-index:50;
}

/* MOBILE */
@media(max-width:991px){

    .testimonial-stack{
        height:auto;
        display:grid;
        gap:20px;
    }

    .testimonial-card{
        position:relative;
        width:100%;
        left:auto !important;
        right:auto !important;
        top:auto !important;
        transform:none !important;
    }

    .testimonial-card:hover{
        transform:none !important;
    }
}