@import url('https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@100..900&family=Parkinsans:wght@300..800&display=swap');

:root{
  --bg:#1E1E24;
  --bg-soft:#17171d;
  --panel:#1c1c23;
  --black:#0a0a0c;
  --line: rgba(255,255,255,0.09);
  --white:#F5F5F3;
  --dim: rgba(245,245,243,0.62);
  --dim2: rgba(245,245,243,0.42);
  --gold:#D7A63C;
  --gold-dark:#B98D2C;
}

body{
  background:var(--bg);
  color:var(--white);
  font-family: "Lexend Deca", sans-serif;
  font-size:16px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4{
 font-family: "Parkinsans", sans-serif;
  font-weight:700;
  line-height:1.18;
}

a{ color:inherit; text-decoration:none; }
.container{max-width:1300px;}
.container.big-container{max-width:1450px;}
.text-gold{color:var(--gold);}

/* ---------- Buttons ---------- */
.btn{color:#1a1408; font-weight:500;transition:background .2s, border-color .2s; padding:13px 26px;border-radius:10px;}
.btn-gold{background:var(--gold); }
.btn-gold:hover{ background:#000; }
.btn-light-custom{background:var(--white); transition:opacity .2s;}
.btn-light-custom:hover{background:#000; color:#fff; }
.btn-dark-custom{background:#000;color:#fff;font-weight: 400;}

/* ---------- Top bar ---------- */
.topbar{background: #000;font-size: 14px;padding: 8px 0px;border-top: 5px solid rgb(255 255 255 / 25%);}
.nav-icons button{background:none;border:none;}
header .navbar .navbar-nav .nav-item{padding: 25px 12px;}
header .navbar .navbar-nav .nav-link{color: #fff;}
header{background: rgb(255 255 255 / 10%);}

/* ---------- Hero ---------- */
.hero{ position:relative; min-height:700px; }
.hero-overlay{position:absolute; inset:0;background:linear-gradient(90deg, rgba(10,10,12,0.94) 0%, rgba(10,10,12,0.82) 32%, rgba(10,10,12,0.25) 58%, rgba(10,10,12,0.05) 100%);}
.hero-content{ position:relative; z-index:2; }
.hero-text{max-width: 530px;}
.eyebrow{display:flex; align-items:center; gap:10px;font-size: 14px; letter-spacing:0.06em; color:var(--gold); font-weight:500; margin-bottom:18px;}
.eyebrow::before{ content:''; width:32px; height:2px; background:var(--gold); }
.lede{font-size: 18px;line-height: 28px;margin: 15px 0px 30px;}
.hero h1{ font-size:clamp(32px,4vw,54px); color:var(--white);font-weight: 600; }
.hero-text .btn{min-width: 190px;}
.hero-features{ margin-top:44px; }
.hero-features .hf{display:flex; flex-direction:column; align-items:center; gap:8px;padding:0 30px; border-left:2px solid var(--gold);}
.hero-features .hf:first-child{ padding-left:0; border-left:none; }
.hero-features svg{ width:20px; height:20px; stroke:var(--gold); fill:none; stroke-width:1.5; }
.hero-features span{ font-size:14px; color:#fff;}

/* ---------- Section shell ---------- */
section{ padding:70px 0; }
.section-head h2{ font-size:clamp(24px,2.6vw,30px);font-weight: 600;line-height: 42px;}
.section-head h1{ font-size:clamp(24px,2.6vw,30px);font-weight: 600;line-height: 42px;}
.link-arrow{ font-size:16px; font-weight:500; color:var(--gold); white-space:nowrap;  font-family: "Parkinsans", sans-serif;}

/* ---------- Category cards ---------- */
.cat-card:before{content:'';position: absolute;inset: 0;background: linear-gradient(0deg, rgb(12 12 12 / 70%) 0%, rgb(10 10 12 / 50%) 32%, rgba(10, 10, 12, 0.25) 58%, rgba(10, 10, 12, 0.05) 100%);}
.cat-meta{position: absolute;bottom: 0;left: 0;right: 0;padding: 30px;}
.count_number .count{font-size: 14px;color: rgb(255 255 255 / 80%);}
.cat-meta h3{font-size: 22px;margin-top: 4px;font-weight: 500;margin-bottom: 0;}
.cat-arrow{width: 39px;height: 39px;border-radius: 0px;background: var(--gold);display: flex;align-items: center;justify-content: center;}

/* ---------- Products ---------- */
.collection .section-head h2{font-size: 36px;}
.collection .section-head h1{font-size: 36px;}
.section-head p{font-size: 18px;line-height: 28px;color: rgb(255 255 255 / 80%);}
.fav-btn{position:absolute; top:12px; right:12px; width: 50px;height: 50px; border-radius:50%;background:rgba(255,255,255,0.92); display:flex; align-items:center; justify-content:center; z-index:2;}
.product-info h4{ font-size: 18px;font-weight: 500;margin-bottom: 0;}
.product-info h3{ font-size: 18px;font-weight: 500;margin-bottom: 0;}
.product-info .sub{font-size: 14px;color: rgb(255 255 255 / 60%);margin-top: 2px; }
.product-info .price{margin-top: 8px;font-size: 18px; }
.product-info .price .now{ color:var(--gold); font-weight:600; font-size: 18px;}
.product-info .price .was{ color: rgb(255 255 255 / 60%); text-decoration:line-through; margin-right:8px; font-size:14px; }

/* ---------- Banner ---------- */
.banner{ background:url(../image/middle_banner.png) no-repeat center center/cover; position: relative; min-height:420px; display:flex; align-items:center; }
.banner .ph{ position:absolute; inset:0; }
.banner-overlay{position:absolute; inset:0;background:linear-gradient(90deg, rgba(8,8,10,0.88) 0%, rgba(8,8,10,0.55) 45%, rgba(8,8,10,0.15) 100%);}
.banner-content{ position:relative; z-index:2; max-width:420px; }
.banner h2{ font-size:clamp(28px,3.4vw,55px); margin-top:16px; font-weight: 600;}
.banner p{ max-width:40ch; font-size: 18px;line-height:28px;}

/* ---------- Carousel nav ---------- */
.carpets_carousel{list-style-type: none;padding:0px;}
.slick-arrow:before{display:none;}
.carpets_carousel .slick-track .slick-slide .product-card img{width:100%;}
.carpets_carousel .slick-slide {padding: 0 8px;}
.carpets_carousel {margin: 0 -8px;}
.carpets_carousel .slick-arrow{width: 60px;height: 60px;background-color: #000; left: auto; right: 0;top: -80px;}
.carpets_carousel .slick-prev{right: 70px;background: rgb(255 255 255 / 10%);}

/* ---------- Why Safa ---------- */
.why_safa{background: rgb(255 255 255 / 10%);}
.why-art{ position:relative; }
.badge{position: absolute;right: 20px;bottom: 30px;background: var(--white);color: #101014;padding: 18px 22px;border-radius: 2px;width: 206px;border-left: 4px solid var(--gold);text-align: left;white-space: unset;}
.badge strong{display: block;font-weight: 400;font-size: 30px;color: #000;margin-bottom: 10px;}
.badge span{font-size: 14px;color: #555;display: block;margin-top: 4px;width: 100%;font-weight: 400;line-height: 22px;}
.why-art img{border:10px solid #fff;}
.why_safa_heading{font-size: 45px;font-weight: 600;}
.why_safa p{color: rgb(255 255 255 / 80%);}
.why-item .ico{width: 50px; height: 50px;display: flex;align-items: center;justify-content: center;flex-shrink: 0;border: 1px solid var(--gold);}
.why-item h4{ font-size: 16px;font-weight: 500;}
.why-item h3{ font-size: 16px;font-weight: 500;}
.why-item p{ font-size:14px; margin-top:4px; }

/* ---------- Footer ---------- */
footer{background:#000 url(../image/bg-footer.png) no-repeat center center/cover;    padding-top: 70px;}
.social-label{ font-size:18px; font-weight:600; }
.socials a{width: 44px;height: 44px; border-radius: 8px;display: flex;align-items: center;justify-content: center;background: rgb(255 255 255 / 10%);}
.footer-col h5{ font-size:18px; font-weight:500; margin-bottom:18px; }
.footer-col ul{ list-style:none; padding-left:0; }
.footer-col li{ margin-bottom:13px; display:flex; align-items:center; gap:8px; }
.footer-col li svg{ width: 16px;height: 16px;stroke: #DCDCDC;fill: none;stroke-width: 2;flex-shrink: 0;}
.footer-col a{ font-size: 16px;color: #DCDCDC;transition: color .2s; }
.footer-col a:hover{ color:var(--white); }
.contact{border-top: 1px solid rgb(255 255 255 / 10%);border-bottom: 1px solid rgb(255 255 255 / 10%);padding: 15px 0px;margin-top: 30px;}
.contact .d-flex{gap:50px;}
.footer-bottom .contact span{display: flex;align-items: center;gap: 7px;font-size: 16px;color: #fff;}
.copy_right{padding: 25px 0px;}
/*.product-card img{max-height:420px;overflow: hidden;object-fit: cover;}*/
.product-card > img {
  display: block;
  width: 100%;
  aspect-ratio: 511 / 639;
  height: auto;
  object-fit: scale-down;       
  object-position: center;
  background: rgb(255 255 255 / 10%);
  box-sizing: border-box;
}
/* ---------- Hover ---------- */
a:hover, header .navbar .navbar-nav .nav-link:hover{color:var(--gold);}
.link-arrow:hover{color:#fff;}
.link-arrow:hover img{filter: brightness(0) invert(1);}
.cat-card:hover .cat-arrow{background:#fff;}
/* ---------- Hover ---------- */

.offcanvas-title{font-size: 18px;}
.offcanvas.offcanvas-end{width:460px;}
.sm-item {align-items: center;background-color: #fff;border: 1px solid #ddd;border-radius: 15px;display: flex;flex: 1 1; flex: 0 0 84px;height: 84px;justify-content: center;padding: 4px;}
.sm-item {overflow: hidden;     }
.sm-item a { display: block; width: 100%; height: 100%;}
.sm-item img {width: 100%;height: 100%;object-fit: cover;display: block;border-radius: 10px;}
.card-content h3{font-size: 16px;font-weight: 600;}
.qty-box button{background: none;font-size: 18px;font-weight: 400;padding: 5px 12px;height: auto;line-height: normal;border: none;}
.remove-itme{border: none;background: none;}
.white-card-footer {border-top: 1px solid #ddd;padding: 20px;}
.white-card-footer h3{font-size: 18px;font-weight: 500;text-transform: uppercase;}
.white-card-footer h5{color: #c59328;}

.product_listing{margin-top:50px;}
.breadcrumb-item.active, .breadcrumb-item+.breadcrumb-item::before {color: var(--gold);}
.search-input-with-icon {background-color: rgb(255 255 255 / 10%);border-radius: 0;padding: 9px 15px; border: 1px solid rgb(255 255 255 / 15%);}
.search-input-with-icon span {position: absolute;left: 20px;top: 12px;}
.search-input-with-icon input {border: none;background-color: transparent;width: 100%;padding-left: 36px;color: #fff;}
.search-input-with-icon input:focus{box-shadow: none;border:none;background:transparent;color:#fff;}

.search-input-with-icon input::placeholder{color:#C5C5C9;}
.filter-box{ background-color: rgb(255 255 255 / 10%);border: 1px solid rgb(255 255 255 / 15%);padding: 20px;border-radius: 10px;}
.filter-box-heading h3 {font-size: 16px;font-weight: 500;color: #fff;}
.theme-link {font-size: 16px;font-weight: 500;color: var(--gold);text-decoration: underline;font-family: "Parkinsans", sans-serif;}
.filter-box-heading h3 {font-size: 16px;font-weight: 500;color: #fff;}
.filter-box-heading{padding-bottom: 12px}
.filterbox-inner-part {margin-top: 15px;}
.filterbox-inner-part .accordion .accordion-item{background:transparent;border-bottom: none;}
.filterbox-inner-part .accordion .accordion-item .accordion-header .accordion-button{    background: transparent;
font-size: 16px;color: #fff;padding: 14px 0px;font-weight: 500;box-shadow: 0 1px 0px rgba(255, 255, 255, 0.15);}.accordion-header{box-shadow: 0 1px 0px rgba(255, 255, 255, 0.15);}
.filterbox-inner-part .accordion .accordion-item .accordion-header .accordion-button:after{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m2 5 6 6 6-6'/%3e%3c/svg%3e");background-size: 15px;background-position: center;}
.filterbox-inner-part .accordion .accordion-item .accordion-header .accordion-button:focus{outline:none;box-shadow:none;}
.property-type-checkbox .form-check-input {width: 22px;height: 22px;border: 1px solid rgb(255 255 255 / 20%);background-color: rgb(255 255 255 / 10%);}
.label-font-15 {font-size: 15px;font-weight: 400;font-family: "Parkinsans", sans-serif;color: #C5C5C9}
.property-type-checkbox .form-check-input:checked[type=checkbox] {
    --bs-form-check-bg-image: url(data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Crect%20width%3D%2216%22%20height%3D%2216%22%20rx%3D%224%22%20fill%3D%22%23d7a63c%22/%3E%3C/svg%3E);background-size: 16px 16px;background-color: rgb(255 255 255 / 10%);border-color: var(--gold);}
.show_more{color:var(--gold);display: block;font-size: 14px;font-weight: 500;margin-top: 20px;margin-bottom: 10px;}
.min-price-range {max-width: 124px;padding: 8px 15px;font-size: 16px;font-weight: 400;font-family: "Parkinsans", sans-serif;color: #fff;background: rgb(255 255 255 / 10%);border: 1px solid rgb(255 255 255 / 15%);}
.price-range-main div{color:#fff;padding: 0px 5px;}
.top_products h3{font-size: 18px;font-weight: 600;}
.top_products h3 span{font-size: 15px;font-weight: 400;color:#626D78;}
.form-select{height: 44px;border-radius: 0px;background-color: rgb(255 255 255 / 10%);border-color: rgb(255 255 255 / 15%);color: #C5C5C9;}
.short_by{white-space: nowrap;font-size: 15px;color: #C5C5C9;}
.badge_product{background: var(--gold);font-size: 13px;text-transform: uppercase;position: absolute;top: 15px;left: 15px;z-index: 1;padding: 2px 10px;border-radius: 4px;}
.swatch-circle {display: inline-block;width: 25px;height: 25px;border-radius: 50%;margin-right: 4px;border: 1px solid #ccc;cursor: pointer;transition: border-color 0.3s ease;}

.about_middle img.about_big{max-height: 450px;border-radius: 30px;object-fit: cover;}
.features{margin-top:40px;}
.features_icons{width: 52px;height: 52px;background: rgb(0 0 0 / 30%);margin: 0 auto 15px;}
.features_list:before{content: '';position: absolute;width: 1px;height: 45px;right: -10px;top: 50%;background: rgb(255 255 255 / 16%);}
.features .row .col-lg-2:last-child .features_list:before{display:none;}
.features_list{padding: 0px 5px;font-size: 15px;}
.font-16{font-size: 16px !important;line-height: 24px !important;}
.meet h5{font-family: "Parkinsans", sans-serif;font-size: 18px;font-weight: 600;margin: 30px 0px 20px;}
.list_type p{margin-bottom: 8px;display: flex;align-items: center;gap: 8px;}
.left_img{background:url(../image/meet.png) no-repeat center center/cover;}
.about_supporting{position: absolute;top: 0;left: 0;bottom: 0;right: 0;max-width: 50%;width:100%;}
.right_img{background:url(../image/meet-bellow.png) no-repeat center center/cover;left: auto;}
.beautiful_design{background:url(../image/beautiful.png) no-repeat center center/cover;border-radius: 40px;    padding: 70px 70px;}
.beautiful_design a{min-width:190px;}
.beautiful_design p{margin: 15px 0px 35px;}
.contact_content p{margin-bottom:0px;}
.contact_details{display: flex;flex-direction: column;gap: 30px;margin-top: 40px;}
.contact_form{background: rgb(255 255 255 / 15%);padding: 50px;border-radius: 10px;}
.contact_form h4{font-weight: 500;margin-bottom: 10px;}
.contact_form h3{font-weight: 500;margin-bottom: 10px;}
.contact_form p{margin-bottom:30px;}
.contact_form input:not([type="submit"]), .contact_form textarea{background: rgb(255 255 255 / 15%);border:none;border-radius: 10px; padding: 15px 12px;color:#fff;}
.contact_form input::placeholder, .contact_form textarea::placeholder{color:#fff;}

.blog-card {background: rgb(255 255 255 / 10%);border-radius: 30px;overflow: hidden;height: 100%;}
.blog_content {padding: 40px 30px 20px;}
.blog-date {background: var(--gold);color: #fff;border-radius: 8px;padding: 4px 14.4px;font-size: 13.6px;display: inline-block;}
.blog_content h6 {font-size: 20px;line-height: 28px;margin: 10px 0px 10px;}
.blog_content p {color: rgb(255 255 255 / 70%);font-size: 15px;}
.learn-link {color: var(--gold);font-weight: 400;font-size: 15px;text-decoration: underline;display: flex;gap: 8px;align-items: center;}
.blog_img {padding: 15px;}
.blog_img img {width: 100%;height: 230px;object-fit: cover;border-radius: 30px;}

.discover-machine-made h1{font-size: 44px;line-height: 53px;}
.machine_middle{background:url(../image/masterpiece-carpet.png) no-repeat center center/cover;max-width: 1500px;margin: 0 auto;border-radius: 30px;padding: 0px 80px;min-height: 410px;display: flex;flex-direction: column;gap: 10px;justify-content: center;margin-bottom:50px;}
.small_heading{font-size:13px;}
.numbers_blocks{border: 1px solid rgb(255 255 255 / 15%);background: rgb(255 255 255 / 8%);border-radius: 20px;padding: 40px 30px;height: 100%;}
.count{font-weight: 500;color: var(--gold);
/*  font-size: 30px;*/
  margin: 0px;}
.numbers_blocks span{display: block;height: 2px;background: var(--gold);max-width: 30px;margin: 20px 0px;}
.numbers_blocks h3{font-weight: 600;font-size: 24px !important;}

.numbers_blocks:before{display:none;}
.machine_bespoke{background: rgb(255 255 255 / 8%);} 
.machine_bespoke .numbers_blocks{padding: 0;border: none;background: transparent;}
.machine_bespoke .numbers_blocks h3{font-size: 36px;}
.machine_bespoke .numbers_blocks h4{font-size: 22px;font-weight: 500;}
.machine_bespoke .features_list span{background: rgb(255 255 255 / 9%);max-width: 100%;}
.artich img{border-radius:20px;}
.points{margin-bottom: 40px;margin-top: 30px;}
.points_description {width: calc(50% - 12px);box-sizing: border-box;border: 1px solid rgb(255 255 255 / 15%);background: rgb(255 255 255 / 8%);border-radius: 10px; padding: 15px;}
.points .points_description span{width: 8px;height: 8px;background: var(--gold);border-radius: 50%;}
.numbers_points h4{font-size: 36px;font-weight: 500;color: var(--gold);margin-bottom: 0;}
.numbers_points h3{font-size: 36px;font-weight: 500;color: var(--gold);margin-bottom: 0;}
.section-head_big h2{font-size: 38px;line-height: 48px;}
.contact_info{gap: 12px;}
.contact_info a{flex: stretch;}
.enquiry-form{border: 1px solid rgb(255 255 255 / 15%);background: rgb(255 255 255 / 8%);border-radius: 30px;padding:40px;}
.enquiry-form .form-group{margin-bottom:18px;}
.enquiry-form .form-group label{font-size: 14px;margin-bottom: 4px;}
.enquiry-form .form-group .form-select{height: auto;border-color: rgb(255 255 255 / 15%);background-color: rgb(255 255 255 / 15%);border: none;border-radius: 10px;padding: 15px 12px;color: #fff;}
.enquiry-form .form-group .form-select, .enquiry-form .form-group .form-control{font-size:15px;}
.enquiry_content p{max-width: 75%;}
/* ---------- Responsive ---------- */
@media (max-width:1500px){
  .cat-meta h3{font-size: 18px;}
  .cat-meta{padding: 20px;}
}

@media (max-width:991.98px){
  .why-art{ margin-bottom:60px; }
}

@media (max-width:767.98px){
  .nav-links{ display:none !important; }
  .hero-overlay{ background:linear-gradient(180deg, rgba(10,10,12,0.55) 0%, rgba(10,10,12,0.94) 70%); }
  .hero-features{ flex-wrap:wrap; row-gap:16px; }
  .badge{ right:8px; bottom:8px; }
}

