@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

 :root {
     --teal: #00a0a8;
     --coral: #f36a46;
     --dark: #222;
     --light-bg: #f4fbfb;
     --white: #ffffff;
 }

 * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
     font-family: 'Poppins', sans-serif;
 }

 body {
     background: #fff;
     color: var(--dark);
     overflow-x: hidden;
 }

 /* --- Logo Styling (Naya Add Kiya Gaya) --- */
 .logo {
     display: flex;
     align-items: center;
     text-decoration: none;
 }

 .logo img {
     max-height: 80px;
     /* Logo ki height yahan se kam ya zyada karein */
     width: auto;
     margin-right: 10px;
 }

 error {
     color: #e63946;
     font-size: 13px;
 }

 .custom-pagination {
     display: flex;
     justify-content: center;
     gap: 6px;
     margin-top: 25px;
 }

 .custom-pagination a,
 .custom-pagination span {
     display: flex;
     align-items: center;
     justify-content: center;
     min-width: 40px;
     height: 40px;
     padding: 0 14px;
     border-radius: 8px;
     font-size: 14px;
     font-weight: 500;
     background: #fff;
     border: 1px solid #e5e7eb;
     color: #374151;
     cursor: pointer;
     transition: all 0.2s ease;
 }

 .custom-pagination a:hover {
     background: #eef2ff;
     border-color: #6366f1;
     color: #4338ca;
 }

 .custom-pagination .active {
     background: #4f46e5 !important;
     border-color: #4f46e5 !important;
     color: #fff !important;
     cursor: default;
 }

 .custom-pagination .disabled {
     opacity: 0.4;
     cursor: not-allowed;
 }

 @media (max-width: 480px) {

     .custom-pagination a,
     .custom-pagination span {
         min-width: 32px;
         height: 32px;
         font-size: 13px;
     }
 }


 /* Tablets and Mobile screens (max-width: 768px) */
 @media (max-width: 768px) {
     .logo img {
         max-height: 40px;
     }
 }

 /* --- Top Bar --- */
 /* ===== TOP BAR BASE ===== */
 .top-bar {
     background: #00a0a8;
     color: #fff;
     font-size: 12px;
     letter-spacing: .5px;
 }

 /* ===== CONTACT BUTTON ===== */
 .top-contact-link {
     position: relative;
     overflow: hidden;
     background: rgba(255, 255, 255, 0.18) !important;
     backdrop-filter: blur(6px);
     border: 1px solid rgba(255, 255, 255, 0.25);
     transition: all .35s ease;
 }

 /* Hover luxury feel */
 .top-contact-link:hover {
     background: #fff !important;
     color: #00a0a8 !important;
     box-shadow: 0 6px 18px rgba(0, 0, 0, .18);
 }

 /* ===== PHONE ICON ANIMATION ===== */
 .top-contact-link i {
     display: inline-block;
     animation: callRing 1.8s infinite ease-in-out;
     transform-origin: center;
 }

 /* Ring animation (soft – premium) */
 @keyframes callRing {
     0% {
         transform: rotate(0deg) scale(1);
     }

     10% {
         transform: rotate(12deg) scale(1.1);
     }

     20% {
         transform: rotate(-12deg);
     }

     30% {
         transform: rotate(10deg);
     }

     40% {
         transform: rotate(-8deg);
     }

     50% {
         transform: rotate(0deg) scale(1);
     }

     100% {
         transform: rotate(0deg) scale(1);
     }
 }

 /* ===== GIRL / CALL AGENT FEEL (Pulse Glow) ===== */
 .top-contact-link::after {
     content: '';
     position: absolute;
     inset: 0;
     border-radius: 50px;
     box-shadow: 0 0 0 0 rgba(255, 255, 255, .5);
     animation: softPulse 2.2s infinite;
 }

 @keyframes softPulse {
     0% {
         box-shadow: 0 0 0 0 rgba(255, 255, 255, .6);
     }

     70% {
         box-shadow: 0 0 0 14px rgba(255, 255, 255, 0);
     }

     100% {
         box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
     }
 }

 /* ===== SOCIAL ICONS ===== */
 .hover-scale {
     transition: transform .3s ease, opacity .3s ease;
 }

 .hover-scale:hover {
     transform: scale(1.25);
     opacity: .85;
 }

 /* ===== RESPONSIVE FIX ===== */
 @media (max-width: 768px) {
     .top-bar {
         text-align: center;
     }

     .top-contact-link {
         font-size: 13px;
         padding: 6px 14px;
     }

     .top-contact-link::after {
         display: none;
         /* mobile pe clean */
     }
 }

 /* --- Header Desktop --- */
 /*header { padding: 15px 5%; display: flex; justify-content: space-between; align-items: center; background: #fff; border-bottom: 1px solid #eee; }*/
 /*.logo { font-size: 28px; font-weight: 800; letter-spacing: 1px; color: var(--teal); cursor: pointer; text-transform: uppercase; }*/
 /*.logo span { color: var(--coral); }*/

 /*.search-area { flex: 0.45; display: flex; border: 2px solid var(--teal); border-radius: 5px; overflow: hidden; }*/
 /*.search-area select { border: none; padding: 10px; background: #f8f8f8; border-right: 1px solid #ddd; outline: none; font-size: 13px; }*/
 /*.search-area input { border: none; padding: 10px; flex: 1; outline: none; }*/
 /*.search-area button { background: var(--teal); color: white; border: none; padding: 0 20px; cursor: pointer; transition: 0.3s; }*/
 /*.search-area button:hover { background: var(--dark); }*/


 header {
     position: -webkit-sticky;
     position: sticky;
     top: 0;
     z-index: 1000;
     /*padding: 15px 5%; */
     display: flex;
     justify-content: space-between;
     align-items: center;
     background: #fff;
     border-bottom: 1px solid #eee;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
 }

 .search-area {
     flex: 0.45;
     display: flex;
     border: 2px solid #00a0a8;
     border-radius: 5px;
     overflow: hidden;
 }

 .search-area select {
     border: none;
     padding: 10px;
     background: #f8f8f8;
     border-right: 1px solid #ddd;
     outline: none;
     font-size: 13px;
 }

 .search-area input {
     border: none;
     padding: 10px;
     flex: 1;
     outline: none;
 }

 .search-area button {
     background: #00a0a8;
     color: white;
     border: none;
     padding: 0 20px;
     cursor: pointer;
     transition: 0.3s;
 }

 .user-actions {
     display: flex;
     gap: 20px;
     align-items: center;
     font-weight: 500;
     font-size: 14px;
 }

 .user-actions {
     display: flex;
     gap: 20px;
     align-items: center;
     font-weight: 500;
     font-size: 14px;
 }

 .user-actions div {
     cursor: pointer;
     display: flex;
     align-items: center;
     gap: 8px;
 }

 .user-actions div:hover {
     color: var(--teal);
 }

 /* --- Double Row Navbar (Screenshot Style) --- */
 .nav-wrapper {
     background: #fff;
     border-bottom: 1px solid #eee;
 }

 nav {
     display: flex;
     flex-direction: column;
     align-items: center;
     padding: 5px 0;
 }

 nav ul {
     list-style: none;
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     gap: 15px;
 }

 .nav-item {
     position: relative;
     padding: 10px 12px;
 }

 .nav-link {
     text-decoration: none;
     color: #444;
     font-size: 13px;
     font-weight: 500;
     display: flex;
     align-items: center;
     gap: 5px;
     transition: 0.3s;
 }

 /* HOVER EFFECTS */
 .nav-item:hover .nav-link {
     color: var(--teal);
 }

 .nav-link i {
     font-size: 9px;
 }

 /* Dropdown Menu */
 .dropdown {
     position: absolute;
     top: 100%;
     left: 0;
     background: #fff;
     width: 220px;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
     display: none;
     flex-direction: column;
     border-top: 3px solid var(--teal);
     z-index: 1000;
 }

 .dropdown a {
     padding: 12px 20px;
     text-decoration: none;
     color: #444;
     font-size: 13px;
     border-bottom: 1px solid #f5f5f5;
 }

 .dropdown a:hover {
     background: var(--light-bg);
     color: var(--teal);
     padding-left: 25px;
 }

 .nav-item:hover .dropdown {
     display: flex;
 }

 .row-2 {
     border-top: 1px solid #f9f9f9;
     width: 100%;
     display: flex;
     justify-content: center;
     margin-top: 5px;
 }

 /* --- Mobile Header --- */
 .mobile-header {
     display: none;
     justify-content: space-between;
     align-items: center;
     padding: 15px 5%;
     background: #fff;
     border-bottom: 1px solid #eee;
     position: sticky;
     top: 0;
     z-index: 1100;
 }

 .hamburger {
     font-size: 26px;
     color: var(--teal);
     cursor: pointer;
 }

 body.modal-open .mobile-header {
     display: none !important;
 }


 #quickViewModal .modal-dialog {
     height: calc(100vh - 2rem);
 }

 #quickViewModal .modal-content {
     height: 100%;
     overflow: hidden;
 }


 #quickViewModal .modal-body>.row {
     /*height: 100%;*/
     display: flex;
     flex-wrap: nowrap;
 }


 #quickViewModal .col-md-6.bg-light {
     display: flex;
     align-items: center;
     justify-content: center;
     height: 100%;
     padding: 2rem;
 }

 #quickViewModal .col-md-6.bg-light img {
     max-height: 100%;
     max-width: 100%;
     object-fit: contain;
 }

 #quickViewModal .col-md-6.p-5 {
     height: 100%;
     overflow-y: auto;
 }


 @media (max-width: 991px) {

     #quickViewModal .modal-dialog {
         height: 100vh;
         margin: 0;
     }

     #quickViewModal .modal-body>.row {
         flex-direction: column;
     }

     #quickViewModal .col-md-6 {
         width: 100%;
         height: auto;
     }

     #quickViewModal .col-md-6.bg-light {
         padding: 1rem;
     }

     #quickViewModal .col-md-6.bg-light img {
         max-height: 260px;
     }

     #quickViewModal .col-md-6.p-5 {
         padding: 1.25rem !important;
         overflow: visible;
     }
 }


 @media (max-width: 420px) {
     #quickViewModal h3 {
         font-size: 1.1rem;
     }

     #quickViewModal .btn {
         font-size: 0.9rem;
     }
 }


 /* --- Mobile Sidebar --- */
 .side-drawer {
     position: fixed;
     top: 0;
     left: -280px;
     width: 280px;
     height: 100%;
     background: #fff;
     z-index: 2000;
     transition: 0.4s;
     padding: 25px;
     box-shadow: 10px 0 30px rgba(0, 0, 0, 0.1);
     overflow-y: auto;
 }

 .side-drawer.active {
     left: 0;
 }

 .side-drawer ul {
     list-style: none;
     margin-top: 30px;
 }

 .side-drawer li {
     padding: 15px 0;
     border-bottom: 1px solid #f0f0f0;
 }

 .side-drawer a {
     text-decoration: none;
     color: #333;
     font-weight: 500;
 }

 .drawer-overlay {
     position: fixed;
     inset: 0;
     background: rgba(0, 0, 0, 0.5);
     z-index: 1999;
     display: none;
 }

 .drawer-overlay.active {
     display: block;
 }

 /* --- Ultra HD Carpet Slider --- */
 .hero-container {
     padding: 20px 5%;
     max-width: 1500px;
     margin: 0 auto;
 }

 .slider-wrapper {
     position: relative;
     width: 100%;
     height: 500px;
     border-radius: 20px;
     overflow: hidden;
     background: #000;
     box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
 }

 .slide {
     position: absolute;
     inset: 0;
     opacity: 0;
     transition: opacity 1.2s ease-in-out;
     background-size: cover;
     background-position: center;
     display: flex;
     align-items: center;
 }

 .slide.active {
     opacity: 1;
 }

 .slide::after {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(to right, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0) 100%);
 }

 .hero-text {
     position: relative;
     z-index: 10;
     padding-left: 8%;
     width: 55%;
 }

 .hero-text h3 {
     color: var(--teal);
     font-size: 22px;
     margin-bottom: 10px;
     font-weight: 500;
 }

 .hero-text h2 {
     font-size: 55px;
     line-height: 1.1;
     color: var(--dark);
     margin-bottom: 25px;
     font-weight: 700;
 }

 .promo-badge {
     background: var(--coral);
     color: white;
     padding: 15px 35px;
     display: inline-block;
     font-size: 22px;
     font-weight: 600;
     border-radius: 4px;
     box-shadow: 0 10px 20px rgba(243, 106, 70, 0.3);
 }

 /* --- Floating Widgets --- */
 .wa-float {
     position: fixed;
     bottom: 30px;
     left: 30px;
     background: #25d366;
     color: white;
     width: 60px;
     height: 60px;
     border-radius: 50%;
     display: flex;
     justify-content: center;
     align-items: center;
     font-size: 30px;
     z-index: 1000;
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
     text-decoration: none;
 }

 .chat-float {
     position: fixed;
     bottom: 30px;
     right: 30px;
     background: var(--dark);
     color: white;
     padding: 12px 25px;
     border-radius: 5px;
     display: flex;
     align-items: center;
     gap: 10px;
     font-weight: 600;
     z-index: 1000;
     cursor: pointer;
 }

 /* --- Responsive Queries --- */
 @media (max-width: 1024px) {

     header,
     .nav-wrapper {
         display: none;
     }

     .mobile-header {
         display: flex;
     }

     .hero-container {
         padding: 10px;
     }

     .slider-wrapper {
         height: 380px;
         border-radius: 12px;
     }

     .hero-text {
         width: 90%;
         text-align: center;
         padding-left: 0;
         margin: 0 auto;
     }

     .hero-text h2 {
         font-size: 32px;
     }

     .slide::after {
         background: rgba(255, 255, 255, 0.8);
     }
 }

 /* ===============================
   CONTACT PAGE – PREMIUM DESIGN
   =============================== */

 .contact-page {
     padding: 90px 5%;
     background: #fff;
 }

 .contact-header {
     text-align: center;
     margin-bottom: 70px;
 }

 .contact-header h1 {
     font-size: 44px;
     color: var(--dark);
     font-weight: 700;
     margin-bottom: 15px;
 }

 .contact-header h1 span {
     color: var(--teal);
 }

 .contact-header p {
     max-width: 820px;
     margin: 0 auto;
     font-size: 16px;
     color: #555;
     line-height: 1.7;
 }

 /* Layout */
 .contact-wrapper {
     max-width: 1200px;
     margin: 0 auto;
     display: grid;
     grid-template-columns: 1fr 1.1fr;
     gap: 60px;
 }

 /* Left Info */
 .contact-info {
     background: var(--light-bg);
     padding: 45px;
     border-radius: 16px;
 }

 .contact-info h3 {
     color: var(--teal);
     margin-bottom: 25px;
     font-size: 22px;
 }

 .contact-info p {
     margin-bottom: 18px;
     color: #444;
     line-height: 1.7;
 }

 .contact-highlights {
     margin-top: 30px;
 }

 .contact-highlights div {
     margin-bottom: 10px;
     font-size: 14px;
     color: #333;
 }

 /* Right Form */
 .contact-form h3 {
     font-size: 24px;
     margin-bottom: 10px;
     color: var(--dark);
 }

 .contact-form p {
     margin-bottom: 25px;
     color: #555;
     font-size: 14px;
 }

 .form-group {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 15px;
 }

 .contact-form input,
 .contact-form textarea {
     width: 100%;
     padding: 14px;
     border: 1px solid #ddd;
     border-radius: 8px;
     font-size: 14px;
 }

 .contact-form textarea {
     height: 130px;
     resize: none;
     margin-top: 15px;
 }

 a {
     color: #343a40;
     text-decoration: none;
 }

 .contact-form button {
     margin-top: 20px;
     background: var(--coral);
     color: #fff;
     border: none;
     padding: 15px 35px;
     font-size: 15px;
     font-weight: 600;
     border-radius: 8px;
     cursor: pointer;
     transition: 0.3s;
 }

 .contact-form button:hover {
     background: var(--teal);
 }

 /* Responsive */
 @media (max-width: 900px) {
     .contact-wrapper {
         grid-template-columns: 1fr;
     }

     .form-group {
         grid-template-columns: 1fr;
     }
 }

 /* ===============================
   QUICK QUERY FORM
   =============================== */

 .quick-query-btn {
     position: fixed;
     right: 25px;
     bottom: 25px;
     background: var(--teal);
     color: #fff;
     padding: 14px 20px;
     border-radius: 50px;
     font-size: 14px;
     font-weight: 600;
     cursor: pointer;
     display: flex;
     align-items: center;
     gap: 8px;
     box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
     z-index: 1200;
     transition: 0.3s;
 }

 .quick-query-btn:hover {
     background: var(--coral);
 }

 /* Overlay */
 .query-overlay {
     position: fixed;
     inset: 0;
     background: rgba(0, 0, 0, 0.5);
     display: none;
     z-index: 1199;
 }

 /* Popup Form */
 .query-form {
     position: fixed;
     top: 0;
     right: -380px;
     width: 360px;
     height: 100%;
     background: #fff;
     z-index: 1200;
     transition: 0.4s ease;
     display: flex;
     flex-direction: column;
 }

 .query-form.active {
     right: 0;
 }

 /* Header */
 .query-header {
     background: var(--dark);
     color: #fff;
     padding: 18px;
     display: flex;
     justify-content: space-between;
     align-items: center;
 }

 .query-header span {
     font-size: 26px;
     cursor: pointer;
 }

 /* Form */
 .query-form form {
     padding: 25px;
 }

 .query-form input,
 .query-form textarea {
     width: 100%;
     padding: 12px;
     margin-bottom: 14px;
     border: 1px solid #ddd;
     border-radius: 6px;
     font-size: 14px;
 }

 .query-form textarea {
     height: 110px;
     resize: none;
 }

 .query-form button {
     width: 100%;
     background: var(--coral);
     color: #fff;
     border: none;
     padding: 14px;
     font-size: 15px;
     font-weight: 600;
     border-radius: 6px;
     cursor: pointer;
 }

 .query-form button:hover {
     background: var(--teal);
 }

 /* Mobile */
 @media (max-width: 480px) {
     .query-form {
         width: 100%;
     }
 }


 /* Title box using your Teal/Brown shade */
 .chc-title-box {
     background-color: #008080;
     /* Teal shade from your site */
     color: white;
     padding: 12px 45px;
     display: inline-block;
     border-radius: 6px;
     font-size: 1.6rem;
     font-weight: 600;
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
 }

 /* Card styling */
 .chc-feature-card {
     background: #ffffff;
     border-radius: 12px;
     padding: 35px 20px;
     transition: all 0.4s ease;
     border: 1px solid #eee;
     box-shadow: 0 5px 15px rgba(0, 0, 0, 0.02);
 }

 /* Hover effect using your Orange branding */
 .chc-feature-card:hover {
     transform: translateY(-8px);
     border-color: #ff7043;
     /* Your Orange color */
     box-shadow: 0 12px 30px rgba(0, 0, 0, 0.1);
 }

 /* Icons relevant to Carpets */
 .chc-icon-box i {
     font-size: 3.2rem;
     color: #008080;
     /* Teal */
     transition: 0.3s;
 }

 .chc-feature-card:hover .chc-icon-box i {
     color: #ff7043;
     /* Hover par Orange */
 }

 .chc-feature-card h5 {
     font-weight: 700;
     font-size: 1.1rem;
     margin-top: 15px;
     color: #333;
 }

 .chc-feature-card p {
     font-size: 0.9rem;
     line-height: 1.6;
 }

 /* Heading Logic */
 .header-line {
     height: 2px;
     width: 60px;
     background-color: var(--chc-teal);
     opacity: 0.5;
 }

 .chc-section-header {
     font-weight: 700;
     color: #333;
     font-size: 1.6rem;
 }

 /* Card Styling */
 .product-card {
     background: white;
     border-radius: 15px;
     overflow: hidden;
     transition: 0.4s;
     border: 1px solid #f0f0f0;
 }

 .product-card:hover {
     transform: translateY(-8px);
     box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
 }

 .img-wrapper {
     position: relative;
     overflow: hidden;
 }

 .img-wrapper img {
     width: 100%;
     aspect-ratio: 1/1;
     object-fit: cover;
 }

 /* + Button Logic */
 .plus-btn {
     position: absolute;
     top: 15px;
     right: 15px;
     background: white;
     border: none;
     width: 35px;
     height: 35px;
     border-radius: 50%;
     opacity: 0;
     transition: 0.3s;
     box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .product-card:hover .plus-btn {
     opacity: 1;
 }


 /*    .a {*/
 /*    color: #343a40 !important;*/
 /*    text-decoration: none!important;*/
 /*}*/


 /*  a {*/
 /*    color: #343a40!important;*/
 /*    text-decoration: none!important;*/
 /*}*/

 /* Badges */
 .sale-badge {
     position: absolute;
     top: 15px;
     left: 15px;
     background: #e63946;
     color: white;
     padding: 2px 10px;
     font-size: 10px;
     font-weight: bold;
     border-radius: 4px;
     text-transform: uppercase;
 }

 .save-badge {
     padding: 3px 12px;
     font-size: 11px;
     font-weight: bold;
     border-radius: 4px;
 }

 .product-name {
     font-size: 0.9rem;
     font-weight: 600;
     height: 40px;
     overflow: hidden;
     color: #222;
 }

 .old-p {
     text-decoration: line-through;
     color: #999;
     font-size: 0.85rem;
     display: block;
 }

 .new-p {
     color: #000;
     font-weight: 800;
     font-size: 1rem;
 }

 /* View More Button Custom Style */
 .btn-view-more {
     background-color: #008080;
     color: white !important;
     border: 2px solid #008080;
     transition: 0.3s;
     border-radius: 50px;
 }

 .btn-view-more:hover {
     background-color: transparent;
     color: #008080;
     transform: translateY(-3px);
 }

 .cart-wrapper {
     display: flex;
     align-items: center;
     text-decoration: none;
     gap: 10px;
     color: #333;
     padding: 5px 10px;
     border-radius: 8px;
     transition: 0.3s;
 }

 .cart-icon-container {
     position: relative;
     display: inline-block;
 }

 .cart-icon-container i {
     font-size: 22px;
     color: #14a0a4;
     /* Aapka Theme Color */
 }

 /* Red Bubble Design */
 .cart-count {
     position: absolute;
     top: -7px;
     right: -9px;
     background-color: #ff4747;
     color: white;
     font-size: 10px;
     font-weight: 700;
     min-width: 18px;
     height: 18px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     border: 2px solid #fff;
     padding: 2px;
 }

 /* Price Section */
 .cart-info {
     display: flex;
     flex-direction: column;
     line-height: 1.2;
 }

 .cart-label {
     font-size: 11px;
     color: #777;
     font-weight: 600;
     text-transform: uppercase;
 }

 .cart-amount {
     font-size: 13px;
     font-weight: 700;
     color: #333;
 }

 .cart-wrapper:hover {
     background-color: rgba(20, 160, 164, 0.05);
 }


 /* Scope Styles to prevent overwriting other pages */


 .banner-overlay {
     position: relative;
     z-index: 2;
     background: rgba(139, 0, 0, 0.85);
     height: 100%;
     width: 100%;
 }

 .sale-box-border {
     border-top: 4px solid white;
     border-bottom: 4px solid white;
     padding: 5px 30px;
 }

 .ls-5 {
     letter-spacing: 5px;
 }

 .bg-chc-teal {
     background-color: #008080 !important;
     color: white;
 }

 .clearance-card {
     background: white;
     border: 1px solid #eee;
     padding: 10px;
     border-radius: 12px;
     transition: 0.3s;
     height: 100%;
 }

 .clearance-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
 }

 .clearance-card img {
     aspect-ratio: 1/1.2;
     object-fit: cover;
 }

 /* Plus Button Hover Effect */
 .quick-plus-btn {
     position: absolute;
     top: 10px;
     right: 10px;
     background: white;
     border: none;
     width: 32px;
     height: 32px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     opacity: 0;
     transition: 0.3s;
     z-index: 5;
     color: #333;
 }

 .clearance-card:hover .quick-plus-btn {
     opacity: 1;
 }

 .quick-plus-btn:hover {
     background: #008080;
     color: white;
 }

 /* Custom Pills Styling */
 .custom-clearance-pills .nav-link {
     color: #333;
     border: 1px solid #ddd;
     margin-left: 5px;
     border-radius: 20px;
     font-weight: bold;
     font-size: 0.85rem;
 }

 .custom-clearance-pills .nav-link.active {
     background-color: #008080 !important;
     color: white !important;
 }

 /* Hide Number Spinners */
 input[type=number]::-webkit-inner-spin-button,
 input[type=number]::-webkit-outer-spin-button {
     -webkit-appearance: none;
     margin: 0;
 }

 @media (max-width: 991px) {
     .clearance-banner {
         min-height: 350px;
         margin-bottom: 20px;
     }
 }

 .reel-card {
     background: #fff;
     border-radius: 15px;
     cursor: pointer;
     transition: 0.3s;
     overflow: hidden;
     border: 1px solid #eee;
 }

 .reel-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
 }

 .video-container {
     position: relative;
     width: 100%;
     aspect-ratio: 9/16;
     background: #000;
 }

 .reel-video-preview {
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

 .play-overlay {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     background: rgba(255, 255, 255, 0.2);
     border-radius: 50%;
     width: 50px;
     height: 50px;
     display: flex;
     align-items: center;
     justify-content: center;
     backdrop-filter: blur(5px);
 }

 /* Modal Customization */
 .modal-content {
     border-radius: 20px;
     border: none;
     overflow: hidden;
 }

 .video-box {
     background: #000;
     display: flex;
     align-items: center;
     min-height: 500px;
 }

 #mainModalVideo {
     width: 100%;
     max-height: 80vh;
 }

 .btn-chc {
     background-color: var(--primary-color);
     color: white;
     font-weight: bold;
     border-radius: 8px;
     transition: 0.3s;
 }

 .btn-chc:hover {
     background-color: #006666;
     color: white;
 }

 .size-btn {
     border: 1px solid #ddd;
     padding: 5px 10px;
     font-size: 12px;
     border-radius: 4px;
     background: #fff;
     min-width: 45px;
 }

 .size-btn.active {
     background: #000;
     color: #fff;
     border-color: #000;
 }

 /* Image Wrapper for fixed aspect ratio and rounded corners */
 .cat-img-wrapper {
     width: 100%;
     aspect-ratio: 1 / 1;
     /* Makes images square */
     overflow: hidden;
     border-radius: 12px;
     /* Matches the 6th.jpg style */
     box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
 }

 .cat-img-wrapper img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: transform 0.4s ease;
 }

 /* Hover effect */
 .cat-card:hover .cat-img-wrapper img {
     transform: scale(1.08);
 }

 .cat-name {
     color: #333;
     font-weight: 600;
     font-size: 0.85rem;
     margin-top: 10px;
     line-height: 1.3;
     transition: color 0.3s ease;
 }

 .cat-card:hover .cat-name {
     color: #5c727d;
 }

 /* Gradient header style adjustment */
 .category-header {
     border-radius: 4px;
 }


 .text-teal {
     color: #008080;
 }

 /* Styled Heading with Teal dot */
 .footer-title-styled {
     color: #fff;
     font-weight: 700;
     text-transform: uppercase;
     font-size: 0.9rem;
     letter-spacing: 1px;
     margin-bottom: 30px;
     position: relative;
 }

 .footer-title-styled::after {
     content: '';
     position: absolute;
     bottom: -10px;
     left: 0;
     width: 40px;
     height: 3px;
     background: #008080;
 }

 /* List Hover Effect */
 .custom-footer-list li {
     margin-bottom: 12px;
 }

 .custom-footer-list a {
     color: #bdc3c7;
     text-decoration: none;
     font-size: 0.9rem;
     transition: 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
     display: inline-block;
 }

 .custom-footer-list a:hover {
     color: #008080;
     transform: scale(1.1) translateX(5px);
 }

 /* Social Buttons - Teal Border Look */
 .custom-social-btn {
     width: 40px;
     height: 40px;
     border: 1px solid rgba(0, 128, 128, 0.3);
     border-radius: 50%;
     display: inline-flex;
     align-items: center;
     justify-content: center;
     color: #fff;
     text-decoration: none;
     transition: 0.3s;
 }

 .custom-social-btn:hover {
     background: #008080;
     border-color: #008080;
     box-shadow: 0 0 15px rgba(0, 128, 128, 0.5);
 }

 /* Smart Newsletter UI */
 .smart-newsletter {
     display: flex;
     background: rgba(255, 255, 255, 0.05);
     padding: 5px;
     border-radius: 50px;
     border: 1px solid rgba(0, 128, 128, 0.2);
 }

 .smart-newsletter input {
     background: transparent;
     border: none;
     color: white;
     padding-left: 20px;
     width: 100%;
     font-size: 0.85rem;
 }

 .smart-newsletter input:focus {
     outline: none;
 }

 .smart-newsletter button {
     background: #008080;
     color: white;
     border: none;
     padding: 10px 25px;
     border-radius: 50px;
     font-weight: bold;
     font-size: 0.75rem;
     transition: 0.3s;
 }

 .smart-newsletter button:hover {
     background: #fff;
     color: #008080;
 }

 /* Payment Badges */
 .payment-badges img {
     height: 30px;
     margin-left: 15px;
     filter: brightness(0) invert(1);
     opacity: 0.5;
 }

 @media (max-width: 768px) {
     .smart-newsletter {
         border-radius: 5px;
     }

     .smart-newsletter button {
         border-radius: 5px;
     }
 }

 /* Styling for the #00a0a8 Top Bar */
 .top-bar {
     box-shadow: 0 2px 10px rgba(0, 160, 168, 0.2);
 }

 .top-contact-link {
     transition: all 0.3s ease;
     border: 1px solid transparent;
 }

 .top-contact-link:hover {
     background: #ffffff !important;
     color: #00a0a8 !important;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
 }

 .hover-scale {
     transition: transform 0.3s ease;
     display: inline-block;
 }

 .hover-scale:hover {
     transform: scale(1.2);
 }

 /* Vertical line separator fix */
 .vr {
     width: 1px;
     min-height: 15px;
     background-color: white;
     display: inline-block;
 }

 @media (max-width: 576px) {
     .top-bar {
         padding-top: 10px !important;
         padding-bottom: 10px !important;
     }

     .top-contact-link {
         font-size: 0.9rem !important;
         padding: 8px 20px !important;
     }
 }

 .featured-section {
     max-width: 1200px;
     margin: auto;
     padding: 30px 10px;
 }

 .tabs .tab {
     background: none;
     border: none;
     padding: 8px 14px;
     font-size: 14px;
     cursor: pointer;
     color: #777;
 }

 .tabs .tab.active {
     color: #000;
     border-bottom: 2px solid #000;
 }

 .products {
     display: none;
 }

 .products.active {
     display: block;
 }

 .product-grid {
     display: grid;
     grid-template-columns: repeat(5, 1fr);
     gap: 15px;
 }

 .product-card {
     position: relative;
     text-align: center;
 }

 .product-card img {
     width: 100%;
     height: 230px;
     object-fit: cover;
     border-radius: 10px;
 }

 .sale {
     position: absolute;
     top: 8px;
     left: 8px;
     background: #c62828;
     color: #fff;
     font-size: 11px;
     padding: 3px 6px;
     border-radius: 4px;
 }

 .icon {
     position: absolute;
     top: 8px;
     right: 8px;
     background: #fff;
     width: 26px;
     height: 26px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-weight: bold;
 }

 .price {
     font-size: 14px;
 }

 .price del {
     color: #999
 }

 /* Responsive */
 @media(max-width:1200px) {
     .product-grid {
         grid-template-columns: repeat(3, 1fr);
     }
 }

 @media(max-width:768px) {
     .product-grid {
         grid-template-columns: repeat(2, 1fr);
     }
 }

 .custom-carpets-v2 {
     padding: 90px 0;
     background: linear-gradient(120deg, #f7ffff 0%, #ffffff 60%);
     overflow: hidden;
 }

 .cc-wrap {
     max-width: 1250px;
     margin: auto;
     padding: 0 20px;
     display: grid;
     grid-template-columns: 1.1fr 0.9fr;
     align-items: center;
     gap: 60px;
 }

 /* LEFT CONTENT */
 .cc-tag {
     display: inline-block;
     font-size: 12px;
     letter-spacing: 2px;
     color: #00a0a8;
     font-weight: 600;
     margin-bottom: 14px;
 }

 .cc-content h1 {
     font-size: 54px;
     line-height: 1.1;
     font-weight: 700;
     color: #0f3c40;
 }

 .cc-content h1 span {
     color: #00a0a8;
 }

 .cc-content p {
     margin: 22px 0 36px;
     font-size: 17px;
     line-height: 1.7;
     color: #5f6f73;
     max-width: 520px;
 }

 /* BUTTON */
 .cc-btn {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     padding: 14px 32px;
     border-radius: 50px;
     background: #f36a46;
     color: #fff !important;
     font-size: 14px;
     font-weight: 600;
     text-decoration: none;
     box-shadow: 0 18px 35px rgba(243, 106, 70, .35);
     transition: .35s ease;
 }

 .cc-btn span {
     font-size: 18px;
     transition: .35s ease;
 }

 .cc-btn:hover {
     transform: translateY(-3px);
     box-shadow: 0 25px 45px rgba(243, 106, 70, .45);
 }

 .cc-btn:hover span {
     transform: translateX(4px);
 }

 /* RIGHT VISUAL */
 .cc-visual {
     position: relative;
     height: 520px;
 }

 .cc-shape {
     position: absolute;
     width: 520px;
     height: 520px;
     background: #00a0a8;
     border-radius: 50% 40% 60% 50%;
     opacity: .12;
     top: -40px;
     right: -120px;
 }

 .cc-img {
     position: absolute;
     overflow: hidden;
     border-radius: 30px;
     box-shadow: 0 30px 60px rgba(0, 0, 0, .15);
 }

 .cc-img img {
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

 .img-main {
     width: 420px;
     height: 420px;
     top: 40px;
     right: 0;
 }

 .img-float {
     width: 220px;
     height: 220px;
     bottom: 0;
     right: 300px;
     border: 6px solid #fff;
 }

 /* RESPONSIVE */
 @media(max-width:992px) {
     .cc-wrap {
         grid-template-columns: 1fr;
         text-align: center;
     }

     .cc-content p {
         margin-left: auto;
         margin-right: auto;
     }

     .cc-visual {
         height: 420px;
         margin-top: 50px;
     }

     .img-float {
         right: 50%;
         transform: translateX(50%);
     }
 }

 @media(max-width:576px) {
     .cc-content h1 {
         font-size: 38px;
     }

     .img-main {
         width: 300px;
         height: 300px;
     }

     .img-float {
         width: 170px;
         height: 170px;
         bottom: -20px;
     }
 }

 .space-carpet-section {
     padding: 70px 0;
     background: #ffffff;
 }

 .space-wrap {
     max-width: 1250px;
     margin: auto;
     padding: 0 20px;
 }

 .space-wrap h2 {
     text-align: center;
     font-size: 34px;
     margin-bottom: 45px;
     color: #0e3e42;
 }

 /* GRID */
 .space-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 25px;
 }

 /* CARD */
 .space-card {
     position: relative;
     overflow: hidden;
     border-radius: 16px;
     cursor: pointer;
     box-shadow: 0 15px 35px rgba(0, 0, 0, .12);
     transition: .4s ease;
 }

 .space-card img {
     width: 100%;
     height: 330px;
     object-fit: cover;
     transition: .5s ease;
 }

 /* LABEL */
 .space-label {
     position: absolute;
     bottom: 16px;
     left: 16px;
     background: #00a0a8;
     color: #fff;
     padding: 8px 16px;
     font-size: 14px;
     font-weight: 600;
     border-radius: 30px;
     box-shadow: 0 8px 20px rgba(0, 160, 168, .35);
 }

 /* HOVER */
 .space-card:hover {
     transform: translateY(-6px);
 }

 .space-card:hover img {
     transform: scale(1.08);
 }

 .space-card:hover .space-label {
     background: #f36a46;
 }

 /* RESPONSIVE */
 @media(max-width:992px) {
     .space-grid {
         grid-template-columns: repeat(2, 1fr);
     }
 }

 @media(max-width:576px) {
     .space-wrap h2 {
         font-size: 26px;
     }

     .space-grid {
         grid-template-columns: 1fr;
     }

     .space-card img {
         height: 260px;
     }
 }

 .carpet-colour-section {
     padding: 80px 0;
     background: #fff;
 }

 .section-title {
     font-size: 34px;
     font-weight: 600;
     color: #0e3e42;
 }

 /* CARD */
 .colour-card {
     position: relative;
     overflow: hidden;
     border-radius: 16px;
     box-shadow: 0 15px 35px rgba(0, 0, 0, .12);
     transition: .4s ease;
 }

 .colour-card img {
     width: 100%;
     height: 280px;
     object-fit: cover;
     transition: .5s ease;
 }

 /* LABEL */
 .colour-name {
     position: absolute;
     bottom: 16px;
     left: 50%;
     transform: translateX(-50%);
     background: #00a0a8;
     color: #fff;
     padding: 8px 22px;
     border-radius: 30px;
     font-size: 14px;
     font-weight: 600;
     box-shadow: 0 10px 25px rgba(0, 160, 168, .4);
     transition: .3s ease;
 }

 /* HOVER */
 .colour-card:hover {
     transform: translateY(-8px);
 }

 .colour-card:hover img {
     transform: scale(1.1);
 }

 .colour-card:hover .colour-name {
     background: #f36a46;
     box-shadow: 0 12px 30px rgba(243, 106, 70, .45);
 }

 /* VIEW MORE */
 .view-more-btn {
     display: inline-block;
     padding: 14px 38px;
     background: #f36a46;
     color: #fff;
     border-radius: 50px;
     text-decoration: none;
     font-weight: 600;
     letter-spacing: .5px;
     box-shadow: 0 15px 35px rgba(243, 106, 70, .4);
     transition: .35s ease;
 }

 .view-more-btn:hover {
     background: #00a0a8;
     box-shadow: 0 18px 40px rgba(0, 160, 168, .45);
 }

 .grass-section {
     padding: 80px 0;
     background: #fff;
 }

 .grass-title {
     font-size: 32px;
     font-weight: 600;
     margin-bottom: 15px;
     color: #0e3e42;
 }

 /* Tabs */
 .grass-tabs {
     display: flex;
     justify-content: center;
     gap: 25px;
 }

 .grass-tab {
     background: none;
     border: none;
     font-size: 14px;
     color: #777;
     padding-bottom: 6px;
     cursor: pointer;
 }

 .grass-tab.active {
     color: #000;
     border-bottom: 2px solid #000;
 }

 /* Products */
 .grass-products {
     display: none;
 }

 .grass-products.active {
     display: block;
 }

 /* Card */
 .grass-card {
     position: relative;
     background: #fff;
     border-radius: 16px;
     padding: 10px;
     box-shadow: 0 12px 30px rgba(0, 0, 0, .1);
 }

 .grass-card img {
     width: 100%;
     height: 260px;
     object-fit: cover;
     border-radius: 12px;
 }

 .sale-badge {
     position: absolute;
     top: 12px;
     left: 12px;
     background: #d32f2f;
     color: #fff;
     font-size: 11px;
     padding: 4px 7px;
     border-radius: 4px;
 }

 .plus-icon {
     position: absolute;
     top: 12px;
     right: 12px;
     background: #fff;
     width: 26px;
     height: 26px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-weight: bold;
 }

 .grass-card h5 {
     font-size: 14px;
     margin: 12px 0 6px;
 }

 .price {
     font-size: 14px;
 }

 .price del {
     color: #999;
     margin-right: 6px;
 }

 .save {
     display: inline-block;
     margin-top: 4px;
     font-size: 11px;
     background: #e3f2fd;
     padding: 3px 6px;
     border-radius: 4px;
 }

 .new-arrivals-section {
     padding: 80px 0;
     background: #fff;
 }

 .section-title {
     font-size: 32px;
     font-weight: 600;
     color: #0e3e42;
 }

 /* 5 column support */
 @media (min-width:992px) {
     .col-lg-2-4 {
         flex: 0 0 20%;
         max-width: 20%;
     }
 }

 /* CARD */
 .product-card {
     position: relative;
     background: #fff;
     border-radius: 16px;
     padding: 10px;
     box-shadow: 0 12px 30px rgba(0, 0, 0, .1);
     height: 100%;
     transition: .3s ease;
 }

 .product-card img {
     width: 100%;
     height: 260px;
     object-fit: cover;
     border-radius: 12px;
 }

 .product-card h5 {
     font-size: 13px;
     margin: 12px 0 6px;
     line-height: 1.4;
 }

 /* BADGES */
 .sale-badge {
     position: absolute;
     top: 12px;
     left: 12px;
     background: #d32f2f;
     color: #fff;
     font-size: 11px;
     padding: 4px 6px;
     border-radius: 4px;
 }

 .plus-icon {
     position: absolute;
     top: 12px;
     right: 12px;
     background: #fff;
     width: 26px;
     height: 26px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-weight: bold;
     cursor: pointer;
 }

 /* PRICE */
 .price {
     font-size: 14px;
 }

 .price del {
     color: #999;
     margin-right: 6px;
 }

 .save {
     display: inline-block;
     margin-top: 4px;
     font-size: 11px;
     background: #e6f4f5;
     color: #007a80;
     padding: 3px 6px;
     border-radius: 4px;
 }

 /* HOVER */
 .product-card:hover {
     transform: translateY(-6px);
 }

 .heritage-section {
     padding: 90px 0;
     background: #fff;
 }

 /* Tabs */
 .heritage-tabs {
     display: flex;
     justify-content: center;
     gap: 35px;
     flex-wrap: wrap;
 }

 .h-tab {
     background: none;
     border: none;
     font-size: 13px;
     letter-spacing: 1px;
     color: #777;
     padding-bottom: 6px;
     cursor: pointer;
     position: relative;
 }

 .h-tab.active {
     color: #000;
 }

 .h-tab.active::after {
     content: "";
     position: absolute;
     left: 0;
     bottom: 0;
     width: 100%;
     height: 2px;
     background: #c8a27a;
 }

 /* Content */
 .h-content {
     display: none;
 }

 .h-content.active {
     display: block;
 }

 .heritage-image {
     border-radius: 18px;
     overflow: hidden;
     box-shadow: 0 20px 45px rgba(0, 0, 0, .15);
 }

 .heritage-image img {
     width: 100%;
     height: 360px;
     object-fit: cover;
 }

 .heritage-text {
     padding-left: 30px;
 }

 .line {
     display: inline-block;
     width: 40px;
     height: 2px;
     background: #c8a27a;
     margin-bottom: 18px;
 }

 .heritage-text h2 {
     font-size: 32px;
     font-weight: 600;
     margin-bottom: 18px;
 }

 .heritage-text p {
     font-size: 15px;
     line-height: 1.8;
     color: #666;
     max-width: 480px;
 }

 /* Responsive */
 @media(max-width:991px) {
     .heritage-text {
         padding-left: 0;
         text-align: center;
     }

     .line {
         margin: auto;
     }

     .heritage-text p {
         margin: auto;
     }
 }

 .apart-compact {
     padding: 60px 0;
     background: #fff;
 }

 .apart-title {
     font-size: 24px;
     font-weight: 600;
     color: #0e3e42;
 }

 /* Item */
 .apart-item {
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 12px;
 }

 /* Image icon */
 .apart-item img {
     width: 70px;
     height: 70px;
     border-radius: 50%;
     object-fit: cover;
     border: 2px solid #00a0a8;
     transition: .3s ease;
 }

 /* Text */
 .apart-item h6 {
     font-size: 14px;
     font-weight: 500;
     color: #333;
     margin: 0;
 }

 /* Hover */
 .apart-item:hover img {
     transform: scale(1.1);
     border-color: #f36a46;
 }

 .product-card {
     position: relative;
 }

 .product-card img {
     width: 100%;
     height: 260px;
     object-fit: cover;
 }

 .product-card h6 {
     font-size: 14px;
     margin: 10px 0 4px;
 }

 .price {
     font-size: 14px;
 }

 .price del {
     color: #999;
     margin-right: 5px;
 }

 /* BADGES */
 .badge-sale {
     position: absolute;
     top: 10px;
     left: 10px;
     background: #dc3545;
     color: #fff;
     font-size: 11px;
     padding: 3px 6px;
 }

 .quick-btn {
     position: absolute;
     top: 10px;
     right: 10px;
     background: #fff;
     width: 26px;
     height: 26px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
 }

 @media (max-width: 576px) {

     /* modal full screen on mobile */
     .modal-fullscreen-sm-down .modal-content {
         height: 70vh;
         border-radius: 0;
     }

     /* body scroll inside modal */
     .modal-fullscreen-sm-down .modal-body {
         overflow-y: auto;
         padding-top: 60px;
         /* close button space */
     }

     /* close button always visible */
     #quickViewModal .btn-close {
         position: fixed;
         top: 12px;
         right: 12px;
         z-index: 1060;
         background-color: #fff;
         border-radius: 50%;
     }
 }

 .product-title {
     font-size: 32px;
     font-weight: 600;
 }

 .product-brand {
     color: #777;
 }

 .product-brand span {
     color: #00a0a8;
     font-weight: 500;
 }

 .product-price del {
     color: #999;
     margin-right: 10px;
 }

 .current-price {
     font-size: 26px;
     font-weight: 600;
 }

 /* IMAGE */
 .product-image-box {
     position: relative;
 }

 .sale-badge {
     position: absolute;
     top: 15px;
     left: 15px;
 }

 /* SIZE */
 .size-btn {
     border: 1px solid #ccc;
     padding: 8px 16px;
     background: #fff;
     border-radius: 6px;
 }

 .size-btn.active {
     border-color: #00a0a8;
     color: #00a0a8;
 }

 /* QTY */
 .qty-box {
     display: flex;
     border: 1px solid #ccc;
     border-radius: 6px;
 }

 .qty-box button {
     border: none;
     background: none;
     padding: 8px 12px;
 }

 .qty-box input {
     width: 50px;
     text-align: center;
     border: none;
 }

 /* CART */
 .add-cart-btn {
     background: #4a6670;
     color: #fff;
     padding: 14px;
     font-weight: 600;
 }

 /* DESCRIPTION */
 .product-desc {
     margin-top: 30px;
 }

 .product-desc h5 {
     font-weight: 600;
 }

 /* FAQ */
 .accordion-button {
     font-weight: 500;
 }

 .checkout-box {
     background: #fff;
     padding: 15px;
     border-radius: 6px;
 }

 .address-preview {
     display: flex;
     justify-content: space-between;
     border: 1px solid #00a0a8;
     padding: 10px;
     border-radius: 6px;
 }

 .row-line {
     display: flex;
     justify-content: space-between;
     font-size: 14px;
     margin-bottom: 8px;
 }

 .btn-teal {
     background: #00a0a8;
     color: #fff;
 }

 .btn-outline-teal {
     border: 1px solid #00a0a8;
     color: #00a0a8;
 }

 .btn-coral {
     background: #f36a46;
     color: #fff;
     font-weight: 600;
 }

 .text-teal {
     color: #00a0a8;
 }

 /* Desktop View Logic: Force Expand */
 @media (min-width: 992px) {
     .ck-checkout-section .accordion-collapse.collapse {
         display: block !important;
         height: auto !important;
         visibility: visible !important;
     }

     .ck-checkout-section .accordion-button {
         pointer-events: none;
         /* Disable clicking on desktop headings */
     }
 }

 /* Step Numbers styling */
 .ck-checkout-section .step-num,
 .ck-checkout-section .step-num-lg {
     background: var(--ck-teal);
     color: white;
     width: 28px;
     height: 28px;
     display: inline-flex;
     align-items: center;
     justify-content: center;
     border-radius: 50%;
     font-size: 14px;
     margin-right: 12px;
 }

 /* Buttons & Colors */
 .text-teal {
     color: var(--ck-teal) !important;
 }

 .btn-teal {
     background-color: #00a0a8;
     color: #fff;
     border: none;
 }

 .btn-outline-teal {
     background-color: #00a0a8;
     border: 1.5px solid var(--ck-teal);
     color: #fff;
     font-weight: 600;
 }

 .btn-outline-teal:hover {
     background: #f36a46;
     color: #fff;
 }

 .btn-coral {
     background: #e65a16;
     color: #fff;
     border: none;
     letter-spacing: 0.5px;
     transition: 0.3s;
 }

 .btn-coral:hover {
     background: #e65a16;
     transform: translateY(-2px);
 }

 .bg-light-success {
     background-color: #e6f7ef;
 }

 /* Mobile Accordion Tweak */
 .ck-checkout-section .accordion-button:not(.collapsed) {
     background-color: #fff;
     color: var(--ck-teal);
     box-shadow: none;
 }

 /* open today add css signup,login,profile,order */

 .ck-signup-section .text-teal {
     color: var(--ck-teal);
 }

 .ck-signup-section .card {
     border-radius: 1.2rem;
 }

 /* Floating labels styling */
 .ck-signup-section .form-control {
     border: 1.5px solid #eee;
     border-radius: 8px;
     padding: 1rem 0.75rem;
 }

 .ck-signup-section .form-control:focus {
     border-color: var(--ck-teal);
     box-shadow: 0 0 0 0.25rem rgba(20, 160, 164, 0.1);
 }

 /* Primary Button */
 .btn-teal-full {
     background-color: var(--ck-teal);
     color: white;
     border-radius: 8px;
     transition: 0.3s;
     border: none;
 }

 .btn-teal-full:hover {
     background-color: var(--ck-teal-dark);
     color: white;
     transform: translateY(-2px);
 }

 /* Responsive adjustments */
 @media (max-width: 991px) {
     .ck-signup-section .card {
         border-radius: 0;
         margin-top: -3rem;
         /* Better positioning on mobile */
     }
 }


 .ck-login-section .text-teal {
     color: var(--ck-teal);
 }

 .ck-login-section .form-control {
     border: 1.5px solid #eee;
     border-radius: 8px;
     padding: 1rem 0.75rem;
 }

 .ck-login-section .form-control:focus {
     border-color: var(--ck-teal);
     box-shadow: 0 0 0 0.25rem rgba(20, 160, 164, 0.1);
 }

 .btn-teal-full {
     background-color: #FF5722;
     color: white;
     border-radius: 8px;
     border: none;
     transition: 0.3s;
 }

 .btn-teal-full:hover {
     background-color: #FF5722;
     color: white;
     transform: translateY(-2px);
 }

 .cursor-pointer {
     cursor: pointer;
 }

 @media (max-width: 991px) {
     .ck-login-section .card {
         border-radius: 1rem;
     }
 }

 .ckp-main-wrapper {
     background-color: #f8fafc;
     min-height: 80vh;
     font-family: 'Segoe UI', Roboto, sans-serif;
 }

 .ckp-card {
     border-radius: 12px;
     background: #fff;
     overflow: hidden;
 }

 .text-teal {
     color: var(--ck-teal) !important;
 }

 .border-teal {
     border-color: var(--ck-teal) !important;
     border-width: 2px !important;
 }

 /* Navigation Styling */
 .ckp-nav-tabs .list-group-item {
     padding: 18px 25px;
     border: none;
     transition: 0.3s;
     color: #555;
     cursor: pointer;
 }

 .ckp-nav-tabs .list-group-item.active {
     background-color: #f0fdfa !important;
     color: var(--ck-teal) !important;
     border-left: 4px solid var(--ck-teal) !important;
     font-weight: bold;
 }

 /* Buttons (Unique Namespace) */
 .ckp-btn-primary {
     background-color: #FF5722;
     color: white;
     border: none;
     border-radius: 8px;
     font-weight: 700;
     transition: 0.3s;
     border: 1px solid var(--ck-teal);
 }

 .ckp-btn-primary:hover {
     background-color: #FF5722;
     transform: translateY(-2px);
     box-shadow: 0 5px 15px rgba(20, 160, 164, 0.2);
 }

 .ckp-btn-outline {
     border: 2px solid var(--ck-teal);
     color: var(--ck-teal);
     background: transparent;
     border-radius: 8px;
     font-weight: 700;
     transition: 0.3s;
     font-size: 13px;
 }

 .ckp-btn-outline:hover {
     background-color: #FF5722;
     color: white;
 }

 .ckp-btn-danger {
     background: #ff4747;
     color: #fff;
     border: none;
     border-radius: 8px;
     font-weight: 700;
     transition: 0.3s;
 }

 .ckp-btn-danger:hover {
     background: #d12e2e;
     color: #fff;
 }

 .ckp-btn-link {
     background: none;
     border: none;
     padding: 0;
     text-transform: uppercase;
     font-size: 12px;
 }

 /* Order UI */
 .ckp-order-card {
     transition: 0.3s;
     border: 1px solid #edf2f7 !important;
 }

 .ckp-order-header {
     background-color: #fcfdfd !important;
 }

 .ckp-small-label {
     font-size: 10px;
     font-weight: 800;
     color: #888;
     letter-spacing: 0.8px;
 }

 .ckp-status-dot {
     height: 10px;
     width: 10px;
     border-radius: 50%;
     display: inline-block;
 }

 /* Inputs */
 .ckp-input {
     padding: 12px;
     border: 1px solid #e2e8f0;
     border-radius: 8px;
 }

 .ckp-input:focus {
     border-color: var(--ck-teal);
     box-shadow: 0 0 0 3px rgba(20, 160, 164, 0.1);
 }

 .cko-details-wrapper {
     background-color: #f8fafc;
     font-family: 'Inter', sans-serif;
 }

 .cko-card {
     border-radius: 12px;
     background: #fff;
 }

 .text-teal {
     color: var(--ck-teal) !important;
 }

 .bg-teal-subtle {
     background-color: #f0fdfa !important;
 }

 .bg-success-subtle {
     background-color: #dcfce7 !important;
     color: #166534 !important;
 }

 .extra-small {
     font-size: 12px;
 }

 .border-dashed {
     border-top: 1px dashed #ddd;
 }

 /* Stepper Styling */
 .cko-stepper::before {
     content: "";
     position: absolute;
     top: 18px;
     left: 0;
     width: 100%;
     height: 3px;
     background: #eee;
     z-index: 0;
 }

 .cko-step {
     position: relative;
     z-index: 1;
     text-align: center;
     width: 25%;
 }

 .cko-step-icon {
     width: 36px;
     height: 36px;
     background: #fff;
     border: 3px solid #eee;
     border-radius: 50%;
     margin: 0 auto;
     display: flex;
     align-items: center;
     justify-content: center;
     color: #ccc;
 }

 .cko-step.active .cko-step-icon {
     background: var(--ck-teal);
     border-color: var(--ck-teal);
     color: #fff;
 }

 .cko-step.active p {
     color: var(--ck-teal);
 }

 /* Timeline Styling */
 .cko-timeline-list {
     position: relative;
     padding-left: 20px;
 }

 .cko-timeline-list::before {
     content: "";
     position: absolute;
     left: 5px;
     top: 0;
     height: 100%;
     width: 2px;
     background: #f0f0f0;
 }

 .cko-timeline-item {
     position: relative;
     padding-bottom: 20px;
     padding-left: 15px;
 }

 .cko-timeline-dot {
     position: absolute;
     left: -19px;
     top: 5px;
     width: 10px;
     height: 10px;
     border-radius: 50%;
     background: #ddd;
     border: 2px solid #fff;
 }

 .cko-timeline-item.active .cko-timeline-dot {
     background: var(--ck-teal);
 }

 /* Custom Buttons */
 .cko-btn-primary {
     background: var(--ck-teal);
     color: #fff;
     border: none;
     border-radius: 8px;
     font-weight: 700;
     transition: 0.3s;
 }

 .cko-btn-primary:hover {
     background: var(--ck-teal-dark);
     transform: translateY(-2px);
 }

 .cko-btn-outline {
     border: 2px solid var(--ck-teal);
     color: var(--ck-teal);
     background: transparent;
     border-radius: 8px;
     font-weight: 700;
     transition: 0.3s;
 }

 .cko-btn-outline:hover {
     background: #ff4747;
     color: #fff;
 }

 /* close today add css signup,login,profile,order */

 .cks-success-wrapper {
     background-color: #f8fafc;
     min-height: 85vh;
     display: flex;
     align-items: center;
 }

 .cks-success-card {
     position: relative;
     overflow: hidden;
 }

 .text-teal {
     color: var(--ck-teal) !important;
 }

 .extra-small {
     font-size: 11px;
 }

 /* Success Icon Animation */
 .animate-bounce {
     animation: bounceIn 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55);
 }

 @keyframes bounceIn {
     0% {
         transform: scale(0);
         opacity: 0;
     }

     60% {
         transform: scale(1.2);
         opacity: 1;
     }

     100% {
         transform: scale(1);
     }
 }

 /* Buttons */
 .cks-btn-primary {
     background: var(--ck-teal);
     color: #fff;
     border-radius: 10px;
     font-weight: 700;
     border: none;
     transition: 0.3s;
 }

 .cks-btn-primary:hover {
     background: var(--ck-teal-dark);
     transform: translateY(-3px);
     box-shadow: 0 10px 20px rgba(20, 160, 164, 0.2);
     color: #fff;
 }

 .cks-btn-outline {
     border: 2px solid #e2e8f0;
     color: #64748b;
     background: #fff;
     border-radius: 10px;
     font-weight: 700;
     transition: 0.3s;
 }

 .cks-btn-outline:hover {
     border-color: var(--ck-teal);
     color: var(--ck-teal);
     background: #f0fdfa;
 }

 .filter-grayscale {
     filter: grayscale(1);
 }

 .cursor-pointer {
     cursor: pointer;
 }



 .product-card {
     background: #fff;
     padding: 5px;
     border-radius: 12px;
     text-align: center;
     transition: all 0.3s ease;
     border: 1px solid #f0f0f0;
     position: relative;
 }

 .product-card:hover {
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);
     transform: translateY(-5px);
 }


 .product-card h6 {
     font-size: 15px;
     font-weight: 600;
     color: #333;
     margin: 15px 0 8px;
     line-height: 1.4;
     height: 42px;
     /* Fixed height taaki cards align rahein */
     overflow: hidden;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     transition: color 0.3s;
 }

 .product-card a {
     text-decoration: none;
 }

 .product-card a:hover h6 {
     color: #14a0a4;
     /* Teal color on hover */
 }


 .product-card .price {
     font-size: 18px;
     font-weight: 800;
     color: #14a0a4;
     /* Main Price Highlight */
     margin: 0;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 8px;
 }

 .product-card .price del {
     font-size: 14px;
     font-weight: 500;
     color: #999;
     text-decoration: line-through;
 }


 .badge-sale {
     position: absolute;
     top: 10px;
     left: 10px;
     background: #ff4747;
     color: #fff;
     padding: 4px 10px;
     font-size: 11px;
     font-weight: 700;
     border-radius: 4px;
     z-index: 1;
 }

 .quick-btn {
     position: absolute;
     top: 10px;
     right: 10px;
     background: #14a0a4;
     color: #fff;
     width: 28px;
     height: 28px;
     line-height: 28px;
     border-radius: 50%;
     font-weight: bold;
     cursor: pointer;
     z-index: 1;
     transition: 0.3s;
 }

 .quick-btn:hover {
     background: #0e7b7e;
     transform: rotate(90deg);
 }

 .product-card img {
     border-radius: 8px;
     /*max-width: 100%;*/
     /*height: auto;*/
 }

 .btn:hover {
     color: #fff !important;
     background-color: #f32d00 !important;
     border-color: var(--bs-btn-hover-border-color);
 }




 /* CSS Prefix: chc (Carpet Hi Carpet) - Isolated to prevent header/footer conflicts */
 .chc-policy-wrapper {
     font-family: 'Segoe UI', Roboto, sans-serif;
     line-height: 1.8;
     color: #444;
     max-width: 1100px;
     margin: 50px auto;
     padding: 40px;
     background: #ffffff;
     box-shadow: 0 5px 25px rgba(0, 0, 0, 0.05);
     border-radius: 12px;
 }

 .chc-header {
     text-align: center;
     margin-bottom: 40px;
     padding-bottom: 20px;
     border-bottom: 2px solid #f1f1f1;
 }

 .chc-header h1 {
     color: #00a0a8;
     /* Primary Theme Color */
     font-size: 2.2rem;
     margin-bottom: 10px;
 }

 .chc-header p {
     color: #f36a46;
     /* Secondary Theme Color */
     font-weight: 600;
 }

 .chc-section {
     margin-bottom: 30px;
 }

 .chc-section h2 {
     color: #00a0a8;
     font-size: 1.5rem;
     border-left: 4px solid #f36a46;
     padding-left: 15px;
     margin-bottom: 15px;
 }

 .chc-section ul {
     list-style: none;
     padding-left: 5px;
 }

 .chc-section ul li::before {
     content: "•";
     color: #f36a46;
     font-weight: bold;
     display: inline-block;
     width: 1em;
 }

 .chc-highlight-box {
     background: #e6f6f7;
     border: 1px dashed #00a0a8;
     padding: 20px;
     border-radius: 8px;
     margin: 25px 0;
 }

 .chc-contact-card {
     background: linear-gradient(135deg, #00a0a8 0%, #008288 100%);
     color: white;
     padding: 30px;
     border-radius: 10px;
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-top: 40px;
 }

 .chc-contact-btn {
     background: #f36a46;
     color: white !important;
     padding: 12px 25px;
     text-decoration: none;
     border-radius: 5px;
     font-weight: bold;
     transition: 0.3s;
 }

 .chc-contact-btn:hover {
     background: #d95634;
 }

 @media (max-width: 768px) {
     .chc-contact-card {
         flex-direction: column;
         text-align: center;
         gap: 20px;
     }
 }

 /* CSS for Shop Collections Page */
 .chc-collection-container {
     font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
     color: #333;
     margin-bottom: 50px;
 }

 .chc-hero-section {
     background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('https://images.unsplash.com/photo-1542475713-33e144a1e941?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w1NjU4MzZ8MHwxfHNlYXJjaHw3fHxjYXJwZXQlMjBjb2xsZWN0aW9uJTIwYmFubmVyfGVufDB8fHx8MTcwNzY5NTUwMXww&ixlib=rb-4.0.3&q=80&w=1080');
     /* Placeholder image, replace with your own! */
     background-size: cover;
     background-position: center;
     color: white;
     text-align: center;
     padding: 100px 20px;
     position: relative;
     overflow: hidden;
     margin-bottom: 50px;
 }

 .chc-hero-section::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     background: rgba(0, 160, 168, 0.4);
     /* Overlay with your primary color */
     z-index: 1;
 }

 .chc-hero-content {
     position: relative;
     z-index: 2;
     max-width: 800px;
     margin: 0 auto;
 }

 .chc-hero-content h1 {
     font-size: 3.5rem;
     margin-bottom: 20px;
     color: #fff;
     text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
 }

 .chc-hero-content p {
     font-size: 1.2rem;
     margin-bottom: 30px;
     line-height: 1.8;
 }

 .chc-hero-button {
     background-color: #f36a46;
     /* Secondary Color */
     color: white;
     padding: 15px 30px;
     border-radius: 5px;
     text-decoration: none;
     font-weight: bold;
     transition: background-color 0.3s ease;
     box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
 }

 .chc-hero-button:hover {
     background-color: #d95634;
     /* Darker secondary on hover */
 }

 .chc-main-content {
     max-width: 1200px;
     margin: 0 auto;
     padding: 0 20px;
 }

 .chc-heading {
     text-align: center;
     font-size: 2.5rem;
     color: #00a0a8;
     /* Primary Color */
     margin-bottom: 40px;
     position: relative;
     padding-bottom: 10px;
 }

 .chc-heading::after {
     content: '';
     position: absolute;
     bottom: 0;
     left: 50%;
     transform: translateX(-50%);
     width: 80px;
     height: 4px;
     background-color: #f36a46;
     /* Secondary Color */
     border-radius: 2px;
 }

 .chc-category-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
     gap: 30px;
     margin-bottom: 50px;
 }

 .chc-category-card {
     background: #fff;
     border-radius: 10px;
     box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
     overflow: hidden;
     text-align: center;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
     border: 1px solid #eee;
 }

 .chc-category-card:hover {
     transform: translateY(-10px);
     box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
 }

 .chc-category-card img {
     width: 100%;
     height: 250px;
     object-fit: cover;
     display: block;
     border-bottom: 1px solid #eee;
 }

 .chc-category-info {
     padding: 25px;
 }

 .chc-category-info h3 {
     font-size: 1.8rem;
     color: #00a0a8;
     /* Primary Color */
     margin-bottom: 15px;
 }

 .chc-category-info p {
     font-size: 1rem;
     color: #666;
     margin-bottom: 20px;
 }

 .chc-view-button {
     background-color: #00a0a8;
     /* Primary Color */
     color: white;
     padding: 10px 20px;
     border-radius: 5px;
     text-decoration: none;
     font-weight: bold;
     transition: background-color 0.3s ease;
 }

 .chc-view-button:hover {
     background-color: #008288;
     /* Darker primary on hover */
 }

 .chc-cta-banner {
     background-color: #f36a46;
     /* Secondary Color */
     color: white;
     text-align: center;
     padding: 60px 20px;
     border-radius: 10px;
     margin-top: 50px;
 }

 .chc-cta-banner h2 {
     font-size: 2.5rem;
     margin-bottom: 20px;
 }

 .chc-cta-banner p {
     font-size: 1.1rem;
     margin-bottom: 30px;
     max-width: 800px;
     margin-left: auto;
     margin-right: auto;
 }

 @media (max-width: 768px) {
     .chc-hero-section {
         padding: 80px 15px;
     }

     .chc-hero-content h1 {
         font-size: 2.5rem;
     }

     .chc-hero-content p {
         font-size: 1rem;
     }

     .chc-heading {
         font-size: 2rem;
     }

     .chc-cta-banner h2 {
         font-size: 2rem;
     }
 }


 /* CSS Prefix: chc-bs (Carpet Hi Carpet Bestsellers) */
 .chc-bs-wrapper {
     font-family: 'Playfair Display', serif;
     /* Elegant font for luxury feel */
     background-color: #ffffff;
     color: #333;
 }

 /* Luxury Hero Banner */
 .chc-bs-hero {
     background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
         url('https://images.unsplash.com/photo-1575414003591-ece8d0416c7a?auto=format&fit=crop&q=80&w=1600');
     background-size: cover;
     background-position: center;
     height: 450px;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     text-align: center;
     color: #fff;
     padding: 0 20px;
 }

 .chc-bs-hero h1 {
     font-size: 4rem;
     margin: 0;
     text-transform: uppercase;
     letter-spacing: 5px;
 }

 .chc-bs-hero p {
     font-size: 1.4rem;
     font-style: italic;
     margin-top: 15px;
     max-width: 700px;
     font-family: 'Poppins', sans-serif;
 }

 /* Section Styling */
 .chc-bs-section {
     max-width: 1300px;
     margin: 80px auto;
     padding: 0 20px;
 }

 .chc-bs-title {
     text-align: center;
     margin-bottom: 60px;
 }

 .chc-bs-title h2 {
     font-size: 2.5rem;
     color: #00a0a8;
     position: relative;
     display: inline-block;
     padding-bottom: 15px;
 }

 .chc-bs-title h2::after {
     content: '';
     position: absolute;
     width: 60%;
     height: 3px;
     background: #f36a46;
     bottom: 0;
     left: 20%;
 }

 /* Product Grid */
 .chc-bs-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
     gap: 40px;
 }

 .chc-bs-card {
     background: #fff;
     border-radius: 0;
     overflow: hidden;
     transition: 0.5s;
     position: relative;
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
 }

 .chc-bs-card:hover {
     box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
     transform: translateY(-10px);
 }

 .chc-bs-img-box {
     position: relative;
     height: 350px;
     overflow: hidden;
 }

 .chc-bs-img-box img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: 0.8s;
 }

 .chc-bs-card:hover .chc-bs-img-box img {
     transform: scale(1.1);
 }

 .chc-bs-label {
     position: absolute;
     top: 20px;
     right: 20px;
     background: #f36a46;
     color: white;
     padding: 5px 20px;
     font-family: 'Poppins', sans-serif;
     font-size: 0.8rem;
     font-weight: bold;
     text-transform: uppercase;
 }

 .chc-bs-info {
     padding: 25px;
     text-align: center;
     font-family: 'Poppins', sans-serif;
 }

 .chc-bs-info h3 {
     font-size: 1.5rem;
     margin: 0 0 10px;
     color: #00a0a8;
 }

 .chc-bs-price {
     font-size: 1.3rem;
     font-weight: bold;
     color: #333;
     margin-bottom: 20px;
 }

 .chc-bs-btn {
     display: inline-block;
     border: 2px solid #00a0a8;
     color: #00a0a8;
     padding: 10px 30px;
     text-decoration: none;
     font-weight: bold;
     transition: 0.3s;
 }

 .chc-bs-btn:hover {
     background: #00a0a8;
     color: white;
 }

 /* Testimonial Section */
 .chc-bs-trust {
     background: #fcfcfc;
     padding: 80px 20px;
     text-align: center;
 }

 .chc-bs-trust blockquote {
     font-size: 1.8rem;
     font-style: italic;
     max-width: 900px;
     margin: 0 auto 30px;
     color: #555;
 }

 /* Responsive */
 @media (max-width: 768px) {
     .chc-bs-hero h1 {
         font-size: 2.5rem;
     }

     .chc-bs-hero p {
         font-size: 1.1rem;
     }
 }

 /* CSS Prefix: chc-h (Carpet Hi Carpet Heritage) */
 .chc-h-wrapper {
     font-family: 'Playfair Display', serif;
     background-color: #fff;
     color: #222;
     overflow-x: hidden;
 }

 /* Heritage Hero */
 .chc-h-hero {
     background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),
         url('https://images.unsplash.com/photo-1576020488411-26298acb5114?auto=format&fit=crop&q=80&w=1600');
     background-size: cover;
     background-position: center;
     height: 500px;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     text-align: center;
     color: #fff;
 }

 .chc-h-hero h1 {
     font-size: 4.5rem;
     margin-bottom: 10px;
     letter-spacing: 3px;
 }

 .chc-h-hero p {
     font-family: 'Poppins', sans-serif;
     font-size: 1.2rem;
     letter-spacing: 5px;
     text-transform: uppercase;
     color: #f36a46;
     /* Secondary Theme Color */
 }

 /* Introduction Section */
 .chc-h-intro {
     max-width: 900px;
     margin: 100px auto;
     text-align: center;
     padding: 0 20px;
 }

 .chc-h-intro h2 {
     font-size: 2.8rem;
     color: #00a0a8;
     /* Primary Theme Color */
     margin-bottom: 30px;
 }

 .chc-h-intro p {
     font-family: 'Poppins', sans-serif;
     font-size: 1.1rem;
     line-height: 2;
     color: #555;
 }

 /* Heritage Timeline */
 .chc-h-timeline {
     position: relative;
     max-width: 1200px;
     margin: 100px auto;
     padding: 40px 0;
 }

 .chc-h-timeline::after {
     content: '';
     position: absolute;
     width: 2px;
     background: #00a0a8;
     top: 0;
     bottom: 0;
     left: 50%;
     margin-left: -1px;
 }

 .chc-h-container {
     padding: 10px 40px;
     position: relative;
     background-color: inherit;
     width: 50%;
 }

 .chc-h-container::after {
     content: '';
     position: absolute;
     width: 20px;
     height: 20px;
     right: -10px;
     background-color: white;
     border: 4px solid #f36a46;
     top: 15px;
     border-radius: 50%;
     z-index: 1;
 }

 .chc-h-left {
     left: 0;
     text-align: right;
 }

 .chc-h-right {
     left: 50%;
 }

 .chc-h-right::after {
     left: -10px;
 }

 .chc-h-content {
     padding: 20px 30px;
     background-color: #f9f9f9;
     position: relative;
     border-radius: 6px;
 }

 .chc-h-content h3 {
     color: #00a0a8;
     font-size: 1.8rem;
     margin-top: 0;
 }

 .chc-h-content p {
     font-family: 'Poppins', sans-serif;
     font-size: 1rem;
     color: #666;
 }

 /* Craftsmanship Section */
 .chc-h-craft {
     background: #00a0a8;
     color: white;
     padding: 100px 20px;
     text-align: center;
 }

 .chc-h-craft h2 {
     font-size: 3rem;
     margin-bottom: 40px;
 }

 .chc-h-img-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
     gap: 20px;
     max-width: 1200px;
     margin: 0 auto;
 }

 .chc-h-img-grid img {
     width: 100%;
     height: 300px;
     object-fit: cover;
     border: 5px solid rgba(255, 255, 255, 0.2);
     transition: 0.3s;
 }

 .chc-h-img-grid img:hover {
     border-color: #f36a46;
 }

 @media screen and (max-width: 768px) {
     .chc-h-timeline::after {
         left: 31px;
     }

     .chc-h-container {
         width: 100%;
         padding-left: 70px;
         padding-right: 25px;
         text-align: left;
     }

     .chc-h-container::after {
         left: 21px;
     }

     .chc-h-right {
         left: 0%;
     }

     .chc-h-hero h1 {
         font-size: 3rem;
     }
 }

 /* CSS Prefix: chc-cr (Carpet Hi Carpet Custom Rugs) */
 .chc-cr-wrapper {
     font-family: 'Poppins', sans-serif;
     color: #333;
     background: #fff;
 }

 /* Hero Section */
 .chc-cr-hero {
     background: linear-gradient(rgba(0, 160, 168, 0.85), rgba(0, 160, 168, 0.85)),
         url('https://images.unsplash.com/photo-1594913785162-e67866763427?auto=format&fit=crop&q=80&w=1600');
     padding: 100px 20px;
     text-align: center;
     color: white;
 }

 .chc-cr-hero h1 {
     font-size: 3.5rem;
     font-weight: 700;
     margin-bottom: 20px;
 }

 .chc-cr-hero p {
     font-size: 1.2rem;
     max-width: 700px;
     margin: 0 auto;
     opacity: 0.9;
 }

 /* The Process Steps */
 .chc-cr-steps {
     padding: 80px 20px;
     max-width: 1200px;
     margin: 0 auto;
 }

 .chc-cr-step-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
     gap: 40px;
     margin-top: 50px;
 }

 .chc-cr-step-card {
     text-align: center;
     padding: 30px;
     border: 1px solid #f1f1f1;
     border-radius: 10px;
     transition: 0.3s;
 }

 .chc-cr-step-card:hover {
     border-color: #f36a46;
     transform: translateY(-5px);
 }

 .chc-cr-step-num {
     font-size: 3rem;
     font-weight: 800;
     color: rgba(0, 160, 168, 0.1);
     margin-bottom: -20px;
     display: block;
 }

 .chc-cr-step-card h3 {
     color: #00a0a8;
     margin-bottom: 15px;
 }

 /* Form & Image Section */
 .chc-cr-main {
     background: #f9f9f9;
     padding: 80px 20px;
 }

 .chc-cr-flex {
     display: flex;
     max-width: 1200px;
     margin: 0 auto;
     gap: 50px;
     align-items: flex-start;
 }

 .chc-cr-form-box {
     flex: 1;
     background: white;
     padding: 40px;
     border-radius: 10px;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
 }

 .chc-cr-form-box h2 {
     color: #00a0a8;
     margin-bottom: 30px;
     border-bottom: 2px solid #f36a46;
     padding-bottom: 10px;
 }

 .chc-cr-input-group {
     margin-bottom: 20px;
 }

 .chc-cr-input-group label {
     display: block;
     margin-bottom: 8px;
     font-weight: 600;
 }

 .chc-cr-input-group input,
 .chc-cr-input-group select,
 .chc-cr-input-group textarea {
     width: 100%;
     padding: 12px;
     border: 1px solid #ddd;
     border-radius: 5px;
     font-family: inherit;
 }

 .chc-cr-submit {
     background: #f36a46;
     color: white;
     border: none;
     padding: 15px 40px;
     font-weight: bold;
     text-transform: uppercase;
     border-radius: 5px;
     cursor: pointer;
     width: 100%;
     transition: 0.3s;
 }

 .chc-cr-submit:hover {
     background: #00a0a8;
 }

 .chc-cr-info {
     flex: 1;
 }

 .chc-cr-info img {
     width: 100%;
     border-radius: 10px;
     margin-bottom: 20px;
 }

 @media (max-width: 992px) {
     .chc-cr-flex {
         flex-direction: column;
     }

     .chc-cr-hero h1 {
         font-size: 2.5rem;
     }
 }


 /* CSS Prefix: chc-sp (Carpet Hi Carpet Shipping Policy) */
 .chc-sp-wrapper {
     font-family: 'Poppins', sans-serif;
     line-height: 1.8;
     color: #444;
     max-width: 1000px;
     margin: 60px auto;
     padding: 40px;
     background: #fff;
     border-radius: 8px;
     box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
 }

 .chc-sp-header {
     text-align: center;
     margin-bottom: 50px;
 }

 .chc-sp-header h1 {
     color: #00a0a8;
     font-size: 2.8rem;
     text-transform: uppercase;
     margin-bottom: 10px;
 }

 .chc-sp-header div {
     width: 100px;
     height: 4px;
     background: #f36a46;
     margin: 0 auto;
 }

 .chc-sp-section {
     margin-bottom: 40px;
 }

 .chc-sp-section h2 {
     color: #00a0a8;
     font-size: 1.5rem;
     margin-bottom: 15px;
     display: flex;
     align-items: center;
 }

 .chc-sp-section h2::before {
     content: "🚢";
     margin-right: 15px;
     font-size: 1.2rem;
 }

 .chc-sp-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
     gap: 20px;
     margin-top: 30px;
 }

 .chc-sp-card {
     background: #fcfcfc;
     padding: 20px;
     border-top: 3px solid #f36a46;
     border-radius: 5px;
 }

 .chc-sp-card h3 {
     color: #333;
     font-size: 1.1rem;
     margin-bottom: 10px;
 }

 .chc-sp-footer {
     background: #f0fbfc;
     padding: 30px;
     border-radius: 10px;
     text-align: center;
     margin-top: 50px;
 }

 .chc-sp-highlight {
     color: #f36a46;
     font-weight: bold;
 }

 @media (max-width: 768px) {
     .chc-sp-wrapper {
         padding: 20px;
         margin: 20px;
     }

     .chc-sp-header h1 {
         font-size: 2rem;
     }
 }

 /* CSS Prefix: chc-rr (Carpet Hi Carpet Returns & Refunds) */
 .chc-rr-wrapper {
     font-family: 'Poppins', sans-serif;
     line-height: 1.8;
     color: #333;
     max-width: 1100px;
     margin: 60px auto;
     padding: 40px;
     background: #fff;
 }

 .chc-rr-header {
     text-align: center;
     margin-bottom: 60px;
 }

 .chc-rr-header h1 {
     color: #00a0a8;
     font-size: 3rem;
     font-weight: 700;
     margin-bottom: 10px;
 }

 .chc-rr-header p {
     color: #f36a46;
     font-weight: 600;
     text-transform: uppercase;
     letter-spacing: 2px;
 }

 .chc-rr-section {
     margin-bottom: 50px;
 }

 .chc-rr-section h2 {
     color: #00a0a8;
     font-size: 1.6rem;
     border-left: 5px solid #f36a46;
     padding-left: 20px;
     margin-bottom: 20px;
 }

 /* Process Flow */
 .chc-rr-flow {
     display: flex;
     justify-content: space-between;
     gap: 20px;
     margin: 40px 0;
     text-align: center;
 }

 .chc-rr-step {
     flex: 1;
     padding: 20px;
     background: #f9fbfb;
     border-radius: 10px;
     position: relative;
 }

 .chc-rr-step span {
     display: block;
     font-size: 2rem;
     font-weight: 800;
     color: rgba(0, 160, 168, 0.2);
     margin-bottom: 10px;
 }

 /* Info Box */
 .chc-rr-info-box {
     background: #fff3f0;
     border: 1px solid #f36a46;
     padding: 25px;
     border-radius: 8px;
     margin: 30px 0;
 }

 .chc-rr-info-box h3 {
     color: #f36a46;
     margin-top: 0;
 }

 /* Contact Card */
 .chc-rr-contact {
     background: #00a0a8;
     color: white;
     padding: 40px;
     border-radius: 15px;
     text-align: center;
     margin-top: 60px;
 }

 .chc-rr-btn {
     display: inline-block;
     background: #f36a46;
     color: white;
     padding: 15px 40px;
     text-decoration: none;
     font-weight: bold;
     border-radius: 5px;
     margin-top: 20px;
     transition: 0.3s;
 }

 .chc-rr-btn:hover {
     background: #d95634;
     transform: scale(1.05);
 }

 @media (max-width: 768px) {
     .chc-rr-flow {
         flex-direction: column;
     }

     .chc-rr-wrapper {
         padding: 20px;
     }

     .chc-rr-header h1 {
         font-size: 2.2rem;
     }
 }

 /* CSS Prefix: chc-dc (Carpet Hi Carpet Disclaimer) */
 .chc-dc-wrapper {
     font-family: 'Poppins', sans-serif;
     line-height: 1.8;
     color: #444;
     max-width: 900px;
     margin: 60px auto;
     padding: 40px;
     background: #fff;
     border: 1px solid #eee;
 }

 .chc-dc-header {
     text-align: center;
     margin-bottom: 50px;
 }

 .chc-dc-header h1 {
     color: #00a0a8;
     font-size: 3rem;
     margin-bottom: 10px;
 }

 .chc-dc-header p {
     color: #f36a46;
     font-weight: bold;
 }

 .chc-dc-section {
     margin-bottom: 35px;
     padding-bottom: 20px;
     border-bottom: 1px solid #f9f9f9;
 }

 .chc-dc-section h2 {
     color: #00a0a8;
     font-size: 1.4rem;
     margin-bottom: 15px;
     text-transform: uppercase;
 }

 .chc-dc-notice {
     background: #fff8f6;
     border-left: 4px solid #f36a46;
     padding: 20px;
     margin: 30px 0;
     font-style: italic;
 }

 .chc-dc-footer {
     text-align: center;
     margin-top: 50px;
     padding: 30px;
     background: #f0fbfc;
     border-radius: 8px;
 }

 @media (max-width: 768px) {
     .chc-dc-wrapper {
         padding: 20px;
         margin: 20px;
     }

     .chc-dc-header h1 {
         font-size: 2.2rem;
     }
 }

 @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,700;1,400&family=Poppins:wght@300;400;600&display=swap');

 .chc-grand-wrapper {
     font-family: 'Poppins', sans-serif;
     color: #222;
     background: #fff;
 }

 /* --- 1. LUXURY HERO SECTION --- */
 .chc-hero-v2 {
     height: 80vh;
     background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
         url('https://carpet-hi-carpet.com/storage/products/591/591-1-3d6e05592e.jpg');
     background-attachment: fixed;
     /* Parallax effect */
     background-size: cover;
     background-position: center;
     display: flex;
     align-items: center;
     justify-content: center;
     text-align: center;
     color: #fff;
 }

 .chc-hero-v2-content h1 {
     font-family: 'Playfair Display', serif;
     font-size: clamp(3rem, 8vw, 5rem);
     margin-bottom: 20px;
 }

 .chc-hero-v2-content p {
     font-size: 1.2rem;
     letter-spacing: 4px;
     text-transform: uppercase;
     color: #f36a46;
     /* Accent Color */
     font-weight: 600;
 }

 /* --- 2. STATS BAR --- */
 .chc-stats-bar {
     display: flex;
     justify-content: space-around;
     padding: 40px 10%;
     background: #00a0a8;
     /* Primary Color */
     color: white;
     text-align: center;
 }

 .stat-item h2 {
     font-size: 2.5rem;
     margin-bottom: 5px;
 }

 .stat-item p {
     font-size: 0.9rem;
     opacity: 0.8;
     text-transform: uppercase;
 }

 /* --- 3. DETAILED SERVICE BLOCKS --- */
 .chc-detailed-service {
     padding: 100px 5%;
 }

 .service-row {
     display: flex;
     align-items: center;
     gap: 60px;
     margin-bottom: 120px;
 }

 .service-row:nth-child(even) {
     flex-direction: row-reverse;
 }

 .service-img {
     flex: 1;
     position: relative;
 }

 .service-img img {
     width: 100%;
     height: 500px;
     object-fit: cover;
     box-shadow: 30px 30px 0px #f0fbfc;
 }

 .service-text {
     flex: 1;
 }

 .service-text span {
     color: #f36a46;
     font-weight: bold;
     font-size: 0.9rem;
     letter-spacing: 2px;
 }

 .service-text h2 {
     font-family: 'Playfair Display', serif;
     font-size: 3rem;
     color: #00a0a8;
     margin: 15px 0;
 }

 .service-text p {
     line-height: 1.9;
     color: #555;
     font-size: 1.1rem;
 }

 /* --- 4. THE PROCESS STEPS --- */
 .chc-process-section {
     background: #fcfcfc;
     padding: 100px 10%;
     text-align: center;
 }

 .process-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 20px;
     margin-top: 60px;
 }

 .process-card {
     padding: 40px 20px;
     background: white;
     border: 1px solid #eee;
     transition: 0.3s;
 }

 .process-card:hover {
     border-top: 5px solid #f36a46;
     transform: translateY(-10px);
 }

 .process-card i {
     font-size: 2.5rem;
     color: #00a0a8;
     margin-bottom: 20px;
     display: block;
 }

 /* --- 5. PREMIUM TESTIMONIAL PARALLAX --- */
 .chc-testimonial-parallax {
     background: linear-gradient(rgba(0, 160, 168, 0.8), rgba(0, 160, 168, 0.8)),
         url('https://carpet-hi-carpet.com/storage/products/618/618-1-4a5575e5c4.jpg');
     background-attachment: fixed;
     padding: 120px 20px;
     text-align: center;
     color: white;
 }

 .chc-testimonial-parallax blockquote {
     font-family: 'Playfair Display', serif;
     font-size: 2.5rem;
     max-width: 1000px;
     margin: 0 auto;
     font-style: italic;
 }

 /* --- 6. CALL TO ACTION --- */
 .chc-final-cta {
     padding: 100px 20px;
     text-align: center;
     background: #fff;
 }

 .cta-button {
     background: #f36a46;
     color: white;
     padding: 20px 50px;
     font-size: 1.2rem;
     text-decoration: none;
     font-weight: bold;
     display: inline-block;
     margin-top: 30px;
     border-radius: 5px;
     transition: 0.3s;
 }

 .cta-button:hover {
     background: #00a0a8;
     transform: scale(1.05);
 }

 /* Responsive */
 @media (max-width: 992px) {
     .service-row {
         flex-direction: column !important;
         text-align: center;
     }

     .process-grid {
         grid-template-columns: repeat(2, 1fr);
     }

     .chc-stats-bar {
         flex-wrap: wrap;
         gap: 20px;
     }
 }


 #cp-kids-store-wrapper {
     font-family: 'Assistant', sans-serif;
     padding: 20px 4%;
     color: var(--cp-text);
 }

 /* --- TOPBAR & SORTING --- */
 .cp-topbar {
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding-bottom: 15px;
     border-bottom: 1px solid var(--cp-border);
     margin-bottom: 30px;
 }

 .filter-bar__sort-group {
     position: relative;
 }

 .filter-topbar__sort-toggle {
     display: flex;
     align-items: center;
     gap: 10px;
     background: #fff;
     border: 1px solid var(--cp-border);
     padding: 8px 16px;
     cursor: pointer;
     font-size: 14px;
     font-weight: 500;
 }

 .filter-bar__sort-values {
     position: absolute;
     right: 0;
     top: 110%;
     background: #fff;
     border: 1px solid var(--cp-border);
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
     z-index: 1000;
     width: 240px;
     display: none;
 }

 .filter-bar__sort-group:hover .filter-bar__sort-values {
     display: block;
 }

 .filter-bar__sort-list {
     list-style: none;
     padding: 10px 0;
     margin: 0;
 }

 .filter-item__content {
     padding: 10px 20px;
     display: flex;
     align-items: center;
     cursor: pointer;
     font-size: 13px;
     transition: background 0.2s;
 }

 .filter-item__content:hover {
     background: #f9f9f9;
 }

 .visually-hidden {
     display: none;
 }

 /* --- MAIN LAYOUT --- */
 .cp-layout-container {
     display: flex;
     gap: 40px;
 }

 /* --- SIDEBAR FILTERS --- */
 .cp-sidebar {
     width: 280px;
     flex-shrink: 0;
 }

 .filter-form__group {
     margin-bottom: 25px;
     padding-bottom: 20px;
     border-bottom: 1px solid var(--cp-border);
 }

 .filter-form__group-toggle {
     display: flex;
     justify-content: space-between;
     width: 100%;
     background: none;
     border: none;
     padding: 0;
     cursor: pointer;
     font-weight: bold;
     text-transform: uppercase;
     font-size: 14px;
     margin-bottom: 15px;
 }

 /* Price Range (Capture-1.PNG style) */
 .filter-form__price-range-input-wrapper {
     display: flex;
     align-items: center;
     gap: 10px;
 }

 .filter-form__price-range-input {
     background: #f4f4f4;
     padding: 10px;
     display: flex;
     align-items: center;
     border-radius: 2px;
     flex: 1;
 }

 .filter-form__price-range-input input {
     border: none;
     background: transparent;
     width: 100%;
     text-align: right;
     outline: none;
     font-size: 14px;
 }

 .filter-form__slider {
     height: 3px;
     background: #000;
     margin: 25px 10px;
     position: relative;
 }

 .filter-form__slider::before,
 .filter-form__slider::after {
     content: '';
     position: absolute;
     top: -7px;
     width: 16px;
     height: 16px;
     background: #fff;
     border: 2px solid #000;
     border-radius: 50%;
 }

 .filter-form__slider::after {
     right: 10%;
 }

 /* Color Swatches */
 .filter-form__list {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .filter-item {
     display: flex;
     align-items: center;
     margin-bottom: 12px;
     cursor: pointer;
 }

 .filter-item__swatch {
     width: 22px;
     height: 22px;
     border: 1px solid #ddd;
     margin-right: 12px;
     border-radius: 2px;
 }

 /* --- PRODUCT GRID --- */
 .cp-product-main {
     flex-grow: 1;
 }

 .cp-grid {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
     gap: 30px;
 }

 .cp-card {
     position: relative;
     text-align: center;
 }

 .cp-img-box {
     background: #f9f9f9;
     aspect-ratio: 1;
     overflow: hidden;
     margin-bottom: 15px;
 }

 .cp-img-box img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: 0.5s;
 }

 .cp-card:hover img {
     transform: scale(1.05);
 }

 .cp-sale-badge {
     position: absolute;
     top: 12px;
     left: 12px;
     background: var(--cp-coral);
     color: #fff;
     padding: 3px 10px;
     font-size: 11px;
     font-weight: bold;
     z-index: 2;
 }

 .cp-title {
     font-size: 14px;
     margin: 10px 0;
     font-weight: 500;
     height: 32px;
     overflow: hidden;
 }

 .cp-old-price {
     text-decoration: line-through;
     color: var(--cp-light-text);
     font-size: 13px;
 }

 .cp-new-price {
     color: var(--cp-teal);
     font-weight: bold;
     font-size: 16px;
     margin-left: 8px;
 }

 .cp-save-percent {
     display: block;
     color: var(--cp-teal);
     font-weight: bold;
     font-size: 11px;
     margin-top: 5px;
 }

 @media (max-width: 1024px) {
     .cp-layout-container {
         flex-direction: column;
     }

     .cp-sidebar {
         width: 100%;
     }
 }

 /* 1. Dono buttons ka common base style upgrade */
 #codBtn,
 #rzpBtn {
     position: relative;
     height: 55px;
     border-radius: 10px !important;
     font-family: 'Poppins', sans-serif;
     font-weight: 700 !important;
     letter-spacing: 1px;
     overflow: hidden;
     border: none !important;
     transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
     display: flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
 }

 /* 2. Coral Button (COD) - Gradient & Animation */
 .btn-coral {
     background: linear-gradient(135deg, #f36a46 0%, #ff8e71 100%) !important;
     box-shadow: 0 4px 15px rgba(243, 106, 70, 0.3) !important;
     color: white !important;
 }

 /* 3. Dark Button (Online) - Premium Look */
 .btn-dark {
     background: linear-gradient(135deg, #232f3e 0%, #445363 100%) !important;
     box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
     color: white !important;
 }

 /* 4. Shiny 'Light Sweep' Animation (The 'Smart' Touch) */
 #codBtn::after,
 #rzpBtn::after {
     content: "";
     position: absolute;
     top: 0;
     left: -100%;
     width: 50%;
     height: 100%;
     background: linear-gradient(to right,
             rgba(255, 255, 255, 0) 0%,
             rgba(255, 255, 255, 0.4) 50%,
             rgba(255, 255, 255, 0) 100%);
     transform: skewX(-25deg);
     transition: none;
 }

 #codBtn:hover::after,
 #rzpBtn:hover::after {
     left: 150%;
     transition: all 0.8s ease;
 }

 /* 5. Hover Effects */
 #codBtn:hover,
 #rzpBtn:hover {
     transform: translateY(-3px) scale(1.01);
     filter: brightness(1.1);
 }

 .btn-coral:hover {
     box-shadow: 0 8px 25px rgba(243, 106, 70, 0.4) !important;
 }

 .btn-dark:hover {
     box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3) !important;
 }

 /* 6. Active (Click) Effect */
 #codBtn:active,
 #rzpBtn:active {
     transform: scale(0.95);
 }

 /* 7. Adding a subtle pulse to COD button to make it catch eye */
 @keyframes pulse-soft {
     0% {
         box-shadow: 0 0 0 0 rgba(243, 106, 70, 0.4);
     }

     70% {
         box-shadow: 0 0 0 10px rgba(243, 106, 70, 0);
     }

     100% {
         box-shadow: 0 0 0 0 rgba(243, 106, 70, 0);
     }
 }

 #codBtn {
     animation: pulse-soft 2s infinite;
 }