/** Shopify CDN: Minification failed

Line 9:3 Unexpected "{"
Line 10:7 Expected identifier but found "%"
Line 18:7 Unexpected "{"
Line 19:7 Expected identifier but found "%"

**/
   {
       % if product.handle contains 'hepa-filter' %
   }

   .product-info-section .key-features-wrapper,
   .product-info-section .key-features-heading {
       display: none !important;
   }

       {
       % endif %
   }

   .desktop-layout {
       display: flex;
       flex-direction: column;
   }


   .product-section {
       padding: 40px 0px;
       background: white;
   }

   .product-info-container {
       max-width: 1300px;
       margin: 0 auto;
       padding: 0 15px;
       box-sizing: border-box;
       background: #fff;
   }

   .product-info-container .right-info {
       border: none;
       border-top: none;
       border-bottom: none;
   }

   .custom-badge {
       display: inline-block;
       background-color: #1f3b2c;
       /* dark green */
       color: #ffffff;
       font-size: 12px;
       letter-spacing: 1px;
       padding: 8px 14px;
       border-radius: 4px;
       font-weight: 500;
       text-transform: uppercase;
   }

   .ratings {
       display: flex;
       gap: 8px;
       flex-wrap: wrap;
       margin-bottom: 10px;
   }

   .pills {
       display: inline-flex;
       align-items: center;
       padding: 5px 11px;
       border-radius: 999px;
       border: 1px solid #000;
       font-size: 12px;
       color: #fff;
       font-weight: 500;
       background: #0D362B;
       white-space: nowrap;
   }

   .badges {
       display: flex;
       gap: 6px;
       flex-wrap: wrap;
       margin-bottom: 12px;
   }


   .badge {
       display: inline-flex;
       align-items: center;
       padding: 5px 11px;
       border-radius: 999px;
       border: 1px solid #ccc;
       font-size: 11px;
       color: #5f5f5f;
       font-weight: 500;
       background: #e3e3e3;
       white-space: nowrap;
   }

   /* ============================================================
   PINCODE V2
   ============================================================ */
   .pincode-v2-card {
       background: #e3e3e3;
       border: 1px solid rgba(255, 255, 255, 0.08);

       padding: 20px;
       margin-top: 16px;
       color: #000;
   }

   .pv2-header {
       display: flex;
       align-items: center;
       gap: 12px;
       margin-bottom: 16px;
   }

   .pv2-pin-icon {
       width: 38px;
       height: 38px;
       background: #0f3f2f;

       display: flex;
       align-items: center;
       justify-content: center;
       color: #fff;
       flex-shrink: 0;
   }

   .pv2-title {
       font-size: 14px;
       font-weight: 600;
       color: #000;
   }

   .pv2-subtitle {
       font-size: 11px;
       color: #000;
       margin-top: 2px;
   }

   .pv2-input-row {
       display: flex;
       gap: 8px;
   }

   .pv2-input {
       flex: 1;
       background: rgba(255, 255, 255, 0.07) !important;
       border: 1px solid #000 !important;
       
       padding: 11px 14px !important;
       color: #000 !important;
       font-size: 15px !important;
       outline: none !important;
       transition: border-color 0.2s;
   }

   .pv2-input:focus {
       border-color: #0f3f2f !important;
   }

   .pv2-input::placeholder {
       color: #000 !important;
   }

   .pv2-check-btn {
       background: #0f3f2f;
       color: #fff;
       border: none;

       padding: 11px 20px;
       font-size: 14px;
       font-weight: 700;
       cursor: pointer;
       transition: opacity 0.2s;
       white-space: nowrap;
   }

   .pv2-check-btn:hover {
       opacity: 0.85;
   }

   .pv2-check-btn:disabled {
       opacity: 0.5;
       cursor: not-allowed;
   }

   #pv2-result {
       margin-top: 12px;
   }

   .pv2-confirmed-row {
       display: flex;
       align-items: center;
       gap: 8px;
       font-size: 13px;
       color: rgba(255, 255, 255, 0.75);
   }

   .pv2-confirmed-check {
       width: 20px;
       height: 20px;
       background: #0f3f2f;
       border-radius: 50%;
       display: flex;
       align-items: center;
       justify-content: center;
       color: #fff;
       font-size: 11px;
       font-weight: 800;
       flex-shrink: 0;
   }

   .pv2-confirmed-text {
       flex: 1;
       color: #000
   }

   .pv2-confirmed-text strong {
       color: #000;
   }

   .pv2-change-btn {
       background: none;
       border: none;
       color: #0f3f2f;
       font-size: 11px;
       font-weight: 700;
       cursor: pointer;
       padding: 0;
       letter-spacing: 0.5px;
   }

   .pv2-divider {
       height: 1px;
       background: rgba(255, 255, 255, 0.07);
       margin: 12px 0;
   }

   .pv2-tags {
       display: flex;
       gap: 8px;
       margin-bottom: 8px;
       margin-top: 7px;
   }

   .pv2-tag {
       font-size: 10px;
       font-weight: 700;
       letter-spacing: 0.9px;
       padding: 3px 9px;

       text-transform: uppercase;
       border: 1px solid #0f3f2f;
       color: #fff;
       background: #0f3f2f;
   }

   .pv2-arrives {
       font-size: 24px;
       font-weight: 700;
       color: #000;
       line-height: 1.2;
       margin-bottom: 10px;
   }

   .pv2-countdown {
       display: inline-flex;
       align-items: center;
       gap: 6px;
       font-size: 12px;
       color: #000;
       background: rgba(255, 255, 255, 0.04);
       border: 1px solid rgba(255, 255, 255, 0.07);
       border-radius: 7px;
       padding: 7px 12px;
       margin-bottom: 12px;
   }

   .pv2-countdown strong {
       color: #A87550;
       font-weight: 700;
   }        
   .pv2-countdown svg {
        stroke: #A87550;
    }
     .pv2-install-countdown {
    font-size: 11px;
    color: rgba(224, 145, 16, 0.75);
  
    border: 1px solid rgba(224, 145, 16, 0.75);
    border-radius: 6px;
    padding: 5px 9px;
    margin: 6px 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.pv2-install-timer {
    color: #A87550;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
   .pv2-install-card {
       display: flex;
       align-items: flex-start;
       gap: 12px;
       background: #0f3f2f;
       border: 1px solid rgba(255, 255, 255, 0.07);

       padding: 12px;
       margin-top: 4px;
   }

   .pv2-install-icon {
       width: 38px;
       height: 38px;
       background: rgba(245, 166, 35, 0.12);
       border-radius: 9px;
       display: flex;
       align-items: center;
       justify-content: center;
       font-size: 18px;
       flex-shrink: 0;
   }

   .pv2-install-title {
       font-size: 13px;
       font-weight: 600;
       color: #fff;
       margin-bottom: 5px;
       display: flex;
       align-items: center;
       gap: 6px;
       flex-wrap: wrap;
   }

   .pv2-old-price {
       font-size: 11px;
       color: rgba(255, 255, 255, 0.35);
       text-decoration: line-through;
       font-weight: 400;
   }

   .pv2-free-badge {
       background: #0f3f2f;
       color: #fff;
       font-size: 10px;
       font-weight: 800;
       padding: 2px 7px;
       border-radius: 4px;
   }

   .pv2-install-desc {
       font-size: 11px;
       color: #f1f1f1;
       line-height: 1.55;
   }

   .pv2-trust-row {
       display: flex;
       gap: 4px 16px;
       margin-top: 12px;
       flex-wrap: wrap;
   }

   .pv2-trust-row span {
       font-size: 11px;
       color: #000;
   }

   .pv2-error-row {
       color: #ff6b6b;
       font-size: 13px;
       padding: 8px 0 0;
   }

   .product-info-container .right-info .hero-wrapper {
       height: 100%;
   }

   .product-info-container .left-info {
       padding: 24px 0px;
   }

   .color-label.description-label {
       margin-bottom: 12px !important;
   }

   .product-wrapper {
       display: flex;
       gap: 40px;
       justify-content: space-between;
       flex-wrap: wrap;
       align-items: flex-start !important;
   }

   .left-info {
       flex: 1;
       min-width: 320px;
       position: relative;
       display: flex !important;
       flex-direction: column !important;
   }

   #features {
       display: block !important;
       height: auto !important;
       min-height: 100px !important;
   }

   .product-title-wrap {
       display: flex;
       flex-direction: column;
       align-items: flex-start;
       gap: 6px;
   }

   .color-label {
       font-size: 18px;
       font-weight: 700;
       color: #1f1f1f;
   }

   .right-info {
       flex: 1;
       min-width: 320px;
       text-align: center;
   }

   .description-label {
       margin-top: 5px;
       margin-bottom: 5px;
   }

   .stars {
       color: #A87550;
       font-size: 30px;
       margin-bottom: 15px;
       display: flex;
       align-items: center;
       gap: 10px;
   }

   .rating-number {
       color: #000;
       font-size: 20px;
       font-weight: 400;
       line-height: 1 !important;
   }

   .price-wrapper {
       display: flex;
       align-items: center;
       gap: 13px;
   }

   .current-price {
       font-size: 32px;
       font-weight: 700;
       color: #1f1f1f;
   }

   .slide-img img {
       width: 100%;
       height: auto;
       object-fit: contain !important;
       display: block;
   }

   .key-feature-item.aqi-feature.is-hidden {
       display: none !important;
   }

   /* Hero product image fix */
   .product-info-container .right-info .slide-img img,
   .hero-image img {
       width: 100% !important;
       height: auto !important;
       max-height: 100% !important;
       object-fit: contain !important;
       display: block;
   }

   .compare-price {
       font-size: 32px;
       font-weight: 500;
       text-decoration: line-through;
       color: #8c8c8c;
   }

   .discount {
       font-size: 20px;
       background: #1f1f1f;
       padding: 3px 8px;
       font-weight: 500;
   }

   .offer-tax {
       margin: 4px 0;
       text-align: left;
       font-size: 12px;
       color: #8c8c8c;
   }

   .key-features-heading {
       font-weight: 700;
       font-size: 18px;
       margin-bottom: 24px;
       text-align: left;
   }

   .key-features-grid {
       display: flex;
       justify-content: space-between;
       align-items: center;
       gap: 20px;
       flex-wrap: nowrap;
       /* IMPORTANT */
   }

   .key-feature-item {
       display: flex;
       flex-direction: column;
       align-items: center;
       min-height: 80px;
   }

   .key-feature-icon {
       max-width: 40px;
       margin-bottom: 12px;
   }

   .key-feature-text {
       font-size: 12px;
       font-weight: 500;
       margin: 0px;
       line-height: 1;
   }

   /* ---  thumbnail column --- */
   .thumbnail-column-wrapper {
       display: flex;
       flex-direction: column;
       align-items: center;
       gap: 10px;
       width: 80px;
       min-width: 80px;
       box-sizing: border-box;
       position: absolute;
       left: 0;
       top: 10px;
       bottom: 0;
       z-index: 2;
   }

   .hero-wrapper {
       position: relative;
       padding-left: 90px;
   }

   .thumb-scroll-btn {
       background: transparent;
       border: 1px solid #ddd;
       width: 40px;
       height: 36px;
       cursor: pointer;
       font-size: 16px;
       display: inline-flex;
       align-items: center;
       justify-content: center;
       border-radius: 6px;
       display: none !important;
   }

   .thumb-strip-viewport {
       display: flex;
       flex-direction: column;
       flex-wrap: nowrap;
       gap: 8px;
       height: 100%;
       max-height: 500px;
       overflow-x: hidden;
       overflow-y: auto;
       width: 80px;
       padding: 4px;
       align-items: center;
       scroll-behavior: smooth;
       -ms-overflow-style: none;
       scrollbar-width: none;
   }

   .thumb-box {
       width: 78px;
       height: 78px;
       min-width: 78px;
       min-height: 78px;
       border: 1px solid #e2e2e2;
       border-radius: 8px;
       overflow: hidden;
       display: inline-flex;
       align-items: center;
       justify-content: center;
       cursor: pointer;
       background: #fff;
       transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
       box-sizing: border-box;
   }

   .thumb-box img.thumb-img {
       width: 100%;
       height: 100%;
       object-fit: contain;
       display: block;
   }

   .thumb-box.active {
       border-color: #000;
       box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);
       transform: translateY(-4px);
   }

   .thumb-box:focus {
       outline: 2px solid rgba(16, 16, 16, 0.12);
       outline-offset: 2px;
   }

   /* AMC plan chips */
   .amc-plan-section {
       margin-top: 16px;
   }

   .amc-plan-options {
       display: flex;
       gap: 8px;
       flex-wrap: wrap;
       margin-top: 8px;
       margin-bottom: 20px;
   }

   .amc-plan-btn {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       min-width: 150px;
       padding: 10px 20px;
       border: 1px solid #0f2b0f;
       background: #f7f7f7;
       font-size: 16px;
       font-weight: 500;
       color: #111;
       cursor: pointer;
       transition: 0.2s ease;
       white-space: nowrap;
       border-radius: 4px;
   }

   .amc-plan-btn.active {
       background: #0D362B;
       color: #fff;
       border-color: #0D362B;
       box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
   }

   .amc-plan-btn:focus {
       outline: 3px solid rgba(13, 54, 43, 0.2);
       outline-offset: 2px;
   }

   @media (min-width: 992px) {
       .product-wrapper {
           align-items: flex-start;
       }

       .right-info {
           position: sticky;
           top: 120px;
           height: fit-content;
       }
   }

   @media (max-width: 480px) {
       .amc-plan-btn {
           min-width: 48px;
           height: 30px;
           padding: 6px 10px;
           font-size: 13px;
       }
   }

   @media (max-width: 767px) {
       .thumbnail-column-wrapper {
           width: 100%;
           gap: 8px;
           min-width: 0;
           flex-direction: row;
           align-items: center;
           justify-content: flex-start;
           position: static;
       }

       .hero-wrapper {
           padding-left: 0;
       }

       .thumb-scroll-btn {
           display: none;
       }

       .thumb-strip-viewport {
           height: auto;
           flex-direction: row;
           overflow-x: auto;
           gap: 10px;
           padding: 8px 0;
           width: 100%;
       }

       .thumb-box {
           width: 80px;
           height: 80px;
           min-width: 80px;
           min-height: 80px;
       }
   }


   .airtype-label.description-label {
       margin: 0 0 8px !important;
   }

   .airtype-label label {
       font-size: 18px;
       font-weight: 700;
       color: #1f1f1f;
   }

   .airtype-buttons {
       display: flex;
       gap: 12px;
       flex-wrap: wrap;
       margin-bottom: 20px;
   }

   .airtype-btn {
       padding: 10px 22px;
       border: 1px solid #0D362B;
       background: transparent;
       color: #1f1f1f;
       font-size: 14px;
       font-weight: 500;
       cursor: pointer;
       transition: all 0.25s ease;
       white-space: nowrap;
   }

   .airtype-btn.active,
   .airtype-btn:hover {
       background: #0D362B;
       color: #fff;
   }

   @media (max-width: 767px) {
       .airtype-btn {
           flex: 1 1 auto;
           text-align: center;
           padding: 8px 16px;
           font-size: 13px;
       }
   }

   .quantity-box-inline {
       display: flex;
       flex-direction: column;
   }

   .qty-box {
       display: flex;
       gap: 10px;
   }

   .qty-box button {
       width: 50px;
       height: 36px;
       padding: 5px 20px;
       font-size: 26px;
       background: none;
       border: 0.5px solid #001D00;
       cursor: pointer;
       display: flex;
       color: #000 !important;
       align-items: center;
   }

   .qty-box input {
       width: 50px;
       height: 36px;
       font-size: 16px;
       text-align: center;
       padding: 5px 20px;
       border: 0.5px solid #001D00;
       color: #001D00;
       font-weight: 500;
       -moz-appearance: textfield;
   }

   .qty-box input::-webkit-outer-spin-button,
   .qty-box input::-webkit-inner-spin-button {
       -webkit-appearance: none;
       margin: 0;
   }

   .pincode {
       display: flex;
       flex-direction: column;
       position: relative;
       width: 100%;
       max-width: 400px;
   }

   .pincode-label {
       font-size: 14px;
       font-weight: bold;
       color: var(--Ash);
       margin: 0px !important;
       line-height: 1;
       margin-bottom: 12px !important;
       margin-top: 12px !important;
   }

   .pincode-input-wrapper {
       display: flex;
       align-items: center;
       border-bottom: 1px solid #ccc;
       padding-bottom: 4px;
   }

   .pincode-input {
       flex: 1;
       border: none;
       outline: none;
       padding: 6px 0;
       font-size: 14px;
       background: transparent;
   }

   .pincode-apply {
       font-size: 14px;
       font-weight: bold;
       cursor: pointer;
       transition: background 0.3s ease;
       background: var(--Forest-dew);
       color: var(--Snow);
       padding: 10px 24px;
       border: 1px solid var(--Forest-dew);
   }

   .pincode-apply:hover {
       background: transparent;
       color: var(--Forest-dew);
   }

   .pincode-message-wrapper {
       margin-top: 6px;
   }

   .pincode-msg {
       display: none;
       font-size: 13px;
   }

   .pincode-success {
       color: green;
       font-size: 12px;
       margin-top: 4px;
   }

   .pincode-error {
       color: red;
       font-size: 12px;
       margin-top: 4px;
   }

   .pincode-invalid {
       color: orange;
       font-size: 12px;
       margin-top: 4px;
   }

   /* Responsive for mobile */
   @media (max-width: 600px) {
       .pincode-input-wrapper {
           gap: 8px;
       }

       .pincode-apply {
           padding: 6px 12px;
           font-size: 12px;
           border: 1px solid var(--Forest-dew);
       }
   }

   /* update pincode */
   .color-section {
       margin-bottom: 20px;
   }


   .pincode-input {
       padding: 10px;

   }

   .pincode-message {
       min-height: 18px;
       font-size: 12px;
       transition: opacity 0.3s ease;
   }

   .pincode-success.show,
   .pincode-error.show {
       display: block;
       letter-spacing: 0;
   }

   .offers-heading.description-label {
       font-weight: 700;
       font-size: 18px;
       line-height: 1;
       margin-bottom: 12px !important;
   }

   .pincode label {
       font-weight: 700;
       font-size: 18px;
       line-height: 1;
       margin-bottom: 12px;
   }

   .color-options {
       display: flex;
       gap: 10px;
       margin-top: 8px;
   }

   .color-swatch {
       width: 30px;
       height: 30px;
       border-radius: 50%;
       cursor: pointer;
       position: relative;
       transition: border 0.3s;
   }

   .color-name {
       font-size: 12px;
   }

   .swatch-red {
       background-color: red;
   }

   .swatch-blue {
       background-color: blue;
   }

   .swatch-green {
       background-color: green;
   }

   .offers-line-wrapper {
       margin-top: 30px;
   }

   .offers-heading {
       margin-bottom: 4px;
   }

   .button-group {
       display: flex;
       gap: 30px;
       margin-top: 40px;
   }

   /* linked product buttons */
   .linked-products-block {
       margin-top: 5px;
   }

   .linked-products-heading {
       font-size: 18px;
       font-weight: 600;
       margin-bottom: 10px;
       color: #1d2d1d;
       border-bottom: 1px solid #ccc;
       padding-bottom: 4px;
   }

   .linked-products-wrapper {
       display: flex;
       flex-wrap: wrap;
       gap: 12px;
   }

   .linked-product-btn {
       background: transparent;
       color: #0f2b0f;
       padding: 10px 20px;
       border: 1px solid #0f2b0f;
       cursor: pointer;
       font-size: 16px;
       font-weight: 500;
       transition: all 0.3s ease;
   }

   .linked-product-btn:hover {
       background: #0f2b0f;
       color: #fff;
   }

   .karban-lite-btn {
       font-size: 26px;
   }

   .hero-wrapper {
       position: relative;
   }

   .share-btn {
       position: absolute;
       top: 40px;
       right: 20px;
       background: transparent;
       border: none;
       padding: 6px;
       cursor: pointer;
       z-index: 2;
   }

   .share-popup {
       display: none;
       position: fixed;
       z-index: 9999;
       left: 0;
       top: 0;
       width: 100%;
       height: 100%;
       background: rgba(0, 0, 0, 0.6);
       justify-content: center;
       align-items: center;
   }

   .share-icon {
       width: 20px;
       height: 20px;
       object-fit: contain;
   }

   .share-popup-content {
       background: #fff;
       padding: 20px 30px;
       border-radius: 10px;
       text-align: center;
       max-width: 350px;
       position: relative;
   }

   .close-share {
       position: absolute;
       top: 10px;
       right: 15px;
       font-size: 24px;
       font-weight: bold;
       cursor: pointer;
   }

   .share-icons {
       display: flex;
       justify-content: center;
       gap: 20px;
       margin-top: 15px;
   }

   .share-icons a img {
       width: 32px;
       height: 32px;
       transition: transform 0.3s ease;
   }

   .share-icons a:hover img {
       transform: scale(1.15);
   }

   .hero-image img,
   .slide-img img {
       width: 100% !important;
       height: auto !important;
       max-height: unset !important;
       object-fit: contain !important;
       display: block;
   }

   .hero-image-slider {
       width: 100%;
       max-width: 600px;
       margin: auto;
       height: auto;
       overflow: hidden;

   }

   .hero-wrapper,
   .slide-img {
       display: flex;
       justify-content: center;
       align-items: center;
   }

   .slider-wrapper {
       display: flex;
       transition: transform 0.4s ease-in-out;
       height: 100%;
   }

   .slide-img {
       min-width: 100%;
       flex-shrink: 0;
       display: flex;
       justify-content: center;
       align-items: center;
       width: 100%;
       height: auto;
       padding: 10px;
       padding-bottom: 24px;
       aspect-ratio: 1 / 1;
   }

   .slider-nav {
       position: absolute;
       top: 50%;
       transform: translateY(-50%);
       background: none;
       color: #808080;
       border: none;
       font-size: 20px;
       padding: 8px 12px;
       cursor: pointer;
       z-index: 1;
   }

   .slider-nav.prev {
       left: 10px;
   }

   .slider-nav.next {
       right: 10px;
   }

   .thumb-strip {
       position: static !important;
       bottom: auto !important;
       top: auto !important;
       z-index: auto !important;
   }

   .thumb-box {
       position: static !important;
   }

   /* ===== Amazon Card ===== */
   .marketplace-card {
       display: flex;
       align-items: center;
       justify-content: space-between;
       gap: 16px;
       border: 1px solid #e6e6e6;

       padding: 16px 24px;
       margin-top: 20px;
       background: #fff;
   }

   .marketplace-left {
       display: flex;
       flex-direction: column;
       align-items: flex-start;
       text-align: left;
       gap: 4px;
       min-width: 180px;
   }

   .marketplace-left h4 {
       margin: 0;
       font-size: 17px;
       font-weight: 700;
       line-height: 1.3;
   }

   .marketplace-subtext {
       margin: 0;
       font-size: 13px;
       color: #777;
       line-height: 1.4;
   }

   .marketplace-card .marketplace-divider {
       display: block;
       width: 2px;
       height: 90px;
       background: #cfcfcf;
       flex-shrink: 0;
   }

   .marketplace-right {
       display: flex;
       flex-direction: column;
       align-items: center;
       justify-content: center;
       text-align: center;
       gap: 8px;
   }

   .marketplace-right .market-logo {
       display: flex;
       align-items: center;
       justify-content: center;
   }

   .marketplace-right .market-logo img {
       height: 30px;
       width: auto;
       object-fit: contain;
   }

   .amazon-buy-btn {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       background: #F3A03C;
       color: #fff;
       font-weight: 700;
       font-size: 13px;
       letter-spacing: .4px;
       padding: 10px 22px;

       text-decoration: none;
       white-space: nowrap;
       transition: background .2s ease;
   }

   .amazon-buy-btn:hover {
       background: #e08c2b;
   }

   @media (max-width: 768px) {
       .hero-image-slider {
           max-width: 100%;
       }

       .slider-nav {
           font-size: 18px;
           padding: 6px 10px;
       }

       .marketplace-card {
           padding: 14px;
           gap: 12px;
       }

       .marketplace-left {
           min-width: auto;
       }

       .marketplace-left h4 {
           font-size: 15px;
       }

       .marketplace-subtext {
           font-size: 11px;
       }

       .marketplace-card .marketplace-divider {


           height: 90px;

       }

       .amazon-buy-btn {
           padding: 8px 16px;
           font-size: 12px;
       }
   }

   /* Zoom overlay */
   .zoom-overlay {
       position: fixed;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       background-color: rgba(0, 0, 0, 0.85);
       display: none;
       justify-content: center;
       align-items: center;
       z-index: 9999;
       padding: 20px;
   }

   @keyframes zoomIn {
       from {
           transform: scale(0.5);
           opacity: 0;
       }

       to {
           transform: scale(1);
           opacity: 1;
       }
   }

   .zoom-overlay img {
       max-width: 90%;
       max-height: 90%;
       object-fit: contain;
       box-shadow: 0 0 10px #000;
       animation: zoomIn 0.8s ease;
   }

   .zoom-nav {
       position: absolute;
       top: 50%;
       transform: translateY(-50%);
       background: transparent;
       color: white;
       font-size: 48px;
       border: none;
       cursor: pointer;
       z-index: 10001;
   }

   .zoom-nav.prev {
       left: 30px;
   }

   .zoom-nav.next {
       right: 30px;
   }

   .close-zoom {
       position: absolute;
       top: 50px;
       right: 30px;
       font-size: 36px;
       font-weight: bold;
       color: white;
       cursor: pointer;
       z-index: 10000;
   }



   @media(max-width: 1025px) {
       .color-pincode-wrapper {
           gap: 10px;
       }

       .share-btn {
           top: 60px;
       }
   }

   @media(max-width: 999px) {
       .hero-image img {
           max-width: 410px;
           height: 380px;
       }

       .total-price-qty-row {
           gap: 4px;
       }

       .color-section {
           width: 275px;
       }

       .color-pincode-wrapper {
           gap: 5px;
       }

       .offers-line-wrapper {
           margin-top: 20px;
       }

       .button-group {
           margin-top: 20px;
       }
   }

   @media(max-width: 700px) {
       .product-wrapper {
           gap: 10px;
       }

       .product-title {
           margin-top: 5px;
       }

       .total-price-qty-row {
           margin-top: 5px;
       }

       .hero-image img {
           max-width: 360px;
           height: 360px;
       }
   }

   @media (max-width: 767px) {
       .slide-img {
           width: 100%;
       }

       .product-info-container .right-info {
           border: none !important;
       }

       .product-section {
           margin-top: 0px;
       }

       .product-info-container .left-info {
           padding: 20px 0px;
       }

       .stars {
           font-size: 20px;
           margin-bottom: 20px;
           line-height: 1;
       }

       .rating-number {
           font-size: 16px;
       }

       .karban-product-name {
           font-size: 26px;
       }

       .total-price-qty-row {
           margin: 20px 0px !important;
       }

       .current-price,
       .compare-price {
           font-size: 20px;
       }

       .offer-tax {
           margin: 0px;
           line-height: 1;
       }

       .discount {
           font-size: 12px !important;
           font-weight: 300 !important;
       }

       p.product-description.description-label {
           margin: 20px 0px 0px !important;
           padding-top: 20px;
           font-size: 16px;
       }

       .key-features-grid {
           flex-wrap: nowrap;
           gap: 25px;
           white-space: nowrap;
           overflow-x: scroll;
           overflow-y: hidden;
           -ms-overflow-style: none;
           scrollbar-width: none;
       }

       .color-label {
           font-size: 14px;
       }

       .color-swatch {
           width: 20px;
           height: 20px;
           outline-offset: 2px;
       }

       .description-label {
           margin-top: 20px !important;
           margin-bottom: 20px !important;
       }

       .offers-heading.description-label {
           font-size: 16px;
       }

       .offers-line.offer-tax {
           font-size: 14px !important;
       }

       .key-features-heading {
           font-size: 16px;
           margin-bottom: 20px;
       }

       .key-feature-text {
           font-size: 12px;
           font-weight: 300;
       }

       .key-feature-icon {
           height: 30px;
           object-fit: contain;
       }

       .key-feature-text {
           white-space: normal !important;
           word-break: normal;
           text-align: center;
           max-width: 90px;
           line-height: 1.2;
       }

       /* Keep each feature compact */
       .key-feature-item {
           min-width: 90px;
       }

       .key-features-wrapper {
           margin-bottom: 0px;
       }

       .pincode label {
           font-size: 16px;
       }

       .pincode-apply {
           padding: 10px 12px;
           font-size: 12px;
           border: 1px solid var(--Forest-dew);
       }

       .quantity-box-inline {
           gap: 15px;
           margin-top: 16px;
       }

       .quantity-box-inline form .karban-lite-btn {
           padding: 9px 16px;
           font-size: 14px;
           min-height: 40px;
           display: inline-flex;
           align-items: center;
           justify-content: center;
       }

       .qty-box {
           padding: 9px 12px;
       }

       .product-info-container .left-info {
           padding: 20px 0px 60px;
       }
   }

   .star-wrap {
       position: relative;
       display: inline-block;
       font-size: 20px;
       line-height: 1;
   }

   .stars-base {
       color: #ddd;
   }

   .stars-fill {
       position: absolute;
       left: 0;
       top: 0;
       white-space: nowrap;
       overflow: hidden;
       color: #A87550;
       pointer-events: none;
   }

   .product-title-wrap .product-rating-detail {
       margin-top: 10px;
   }

   .rating-link {
       text-decoration: none;
       color: inherit;
       display: inline-block;
       cursor: pointer;
   }

   .rating-link:hover {
       opacity: .85;
   }

   /* Smooth scroll offset for sticky header */
   html {
       scroll-behavior: smooth;
       scroll-padding-top: 140px;
       /* adjust if needed */
   }

   /* Mobile Layout Styles */
   .mobile-product-layout {
       display: none;
   }

   .desktop-product-layout {
       display: flex;
   }

   .mobile-layout {
       display: none;
   }

   .color-counter-row {
       display: flex;
       justify-content: space-between;
       align-items: center;
       gap: 24px;
       margin: 20px 0;
   }

   .color-section {
       display: flex;
       flex-direction: column;
   }

   .color-label {
       font-size: 18px;
       font-weight: 700;
       margin-bottom: 8px;
   }

   .color-options {
       display: flex;
       gap: 10px;
       margin-top: 6px;
   }

   .color-swatch {
       width: 28px;
       height: 28px;
       border-radius: 50%;
       cursor: pointer;
       border: 1px solid #ccc;
       transition: 0.2s ease;
   }

   .color-swatch.active {
       border: 2px solid #0D362B;
       transform: scale(1.1);
   }

   .color-name {
       font-size: 12px;
   }

   .sold-unit {
       white-space: nowrap;
   }

   .first3-__sold,
   .sold-unit p {
       margin: 0;
       font-size: 18px;
       font-weight: 500;
       color: #001d00;
   }

   .features {
       display: flex;
       gap: 10px;
       flex-wrap: wrap;
       color: #444;
       margin-top: 24px;
   }

   /* product rating (safe scoped) */
   .product-platform-ratings {
       display: flex;
       align-items: center;
       gap: 12px;
   }

   .product-platform-rating {
       display: flex;
       align-items: center;
       gap: 6px;
   }

   .product-platform-rating img {
       width: 24px;
       height: 24px;
       object-fit: contain;
   }

   /* stars */
   .product-star-wrap {
       position: relative;
       display: inline-block;
       font-size: 20px;
       line-height: 1;
   }

   .product-stars-base {
       color: #ddd;
   }

   .product-stars-fill {
       position: absolute;
       left: 0;
       top: 0;
       overflow: hidden;
       white-space: nowrap;
       color: #A87550;
   }

   /* rating number */
   .product-platform-rating-value {
       font-size: 18px;
       font-weight: 600;
   }

   /* link */
   .product-rating-link {
       text-decoration: none;
       color: inherit;
       display: inline-block;
   }

   @media (max-width: 768px) {

       .desktop-layout {
           display: none !important;
       }

       .mobile-layout {
           display: block;
           padding: 18px 16px 28px;
       }

       /* ---------- TITLE ---------- */
       .mobile-layout .product-title {
           font-size: 22px;
           font-weight: 700;
           margin: 6px 0 8px;
       }

       .mobile-layout .product-description {
           font-size: 14px;
           line-height: 1.5;
           margin-bottom: 16px;
           color: #666;
       }

       /* ---------- IMAGE ---------- */
       .mobile-image img {
           border-radius: 10px;
           margin-bottom: 18px;
       }

       /* ---------- PRICE SECTION ---------- */
       .mobile-price {
           display: flex;
           align-items: center;
           gap: 10px;
           margin-bottom: 16px;
       }

       .mobile-price .current-price {
           font-size: 22px;
           font-weight: 700;
           color: #111;
       }

       .mobile-price .compare-price {
           font-size: 16px;
           text-decoration: line-through;
           color: #999;
       }

       /* ---------- COLOR ---------- */
       .mobile-color label {
           font-size: 14px;
           font-weight: 600;
           display: block;
           margin-bottom: 6px;
       }

       .mobile-layout .color-options {
           display: flex;
           gap: 8px;
           margin-bottom: 16px;
       }

       .mobile-layout .color-swatch {
           width: 22px;
           height: 22px;
           border: 2px solid #ddd;
       }

       .mobile-layout .color-swatch.active {
           border: 2px solid #0D362B;
       }

       /* ---------- AIR TYPE BUTTONS ---------- */
       .mobile-airtype {
           display: flex;
           gap: 8px;
           margin-bottom: 16px;
       }

       .mobile-airtype .airtype-btn {
           flex: 1;
           padding: 8px;
           font-size: 13px;
           border: 1px solid #0D362B;
           background: transparent;
           transition: 0.2s;
       }

       .mobile-airtype .airtype-btn.active {
           background: #0D362B;
           color: #fff;
       }

       /* ---------- KEY FEATURES ---------- */
       .mobile-layout .key-features-wrapper {
           margin-top: 14px;
           margin-bottom: 14px;
       }

       .mobile-layout .key-features-heading {
           font-size: 15px;
           margin-bottom: 12px;
       }

       .mobile-layout .key-features-grid {
           display: flex;
           overflow-x: auto;
           gap: 20px;
           padding-bottom: 4px;
       }

       .mobile-layout .key-feature-item {
           min-width: 80px;
           text-align: center;
       }

       .mobile-layout .key-feature-icon {
           height: 26px;
           margin-bottom: 6px;
       }

       .mobile-layout .key-feature-text {
           font-size: 12px;
       }

       /* ---------- PINCODE ---------- */
       .mobile-pincode {
           margin-top: 18px;
       }

       .mobile-pincode label {
           font-size: 14px;
           font-weight: 600;
           margin-bottom: 6px;
           display: block;
       }

       .mobile-pincode .pincode-input-wrapper {
           display: flex;
           border-bottom: 1px solid #ddd;
           padding-bottom: 4px;
       }

       .mobile-pincode input {
           flex: 1;
           border: none;
           padding: 6px 0;
       }

       .mobile-pincode button {
           background: #0D362B;
           color: #fff;
           border: none;
           padding: 6px 14px;
           font-size: 13px;
       }

       /* ---------- QTY + ADD TO CART ---------- */
       .mobile-cart {
           display: flex;
           gap: 10px;
           align-items: center;
           margin-top: 18px;
       }

       .mobile-cart .qty-box {
           flex: 1;
           border: 1px solid #ddd;
           padding: 6px 10px;
       }

       .mobile-cart form {
           flex: 2;
       }

       .mobile-cart button[type="submit"] {
           width: 100%;
           height: 42px;
           background: #0D362B;
           color: #fff;
           border: none;
           font-weight: 600;
           font-size: 14px;
       }

       /* ---------- GOKWIK ---------- */
       .mobile-layout gokwik-offer-widget {
           margin-top: 16px !important;
       }

   }

   @media (max-width: 768px) {

       .mobile-platform-ratings {
           display: flex;
           gap: 14px;
           align-items: center;
           margin-bottom: 4px;
       }

       .mobile-product-platform-ratings .product-platform-rating {
           display: flex;
           align-items: center;
           gap: 6px;
       }

       .mobile-platform-ratings img {
           height: 24px;
           width: auto;
       }

       .mobile-platform-ratings .star-wrap {
           position: relative;
           font-size: 18px;
           line-height: 1;
       }

       .mobile-platform-ratings .stars-base {
           color: #A87550;
       }

       .mobile-platform-ratings .stars-fill {
           color: #A87550;
           position: absolute;
           left: 0;
           top: 0;
           overflow: hidden;
           white-space: nowrap;
       }

       .mobile-platform-ratings .platform-rating-value {
           font-size: 18px;
           font-weight: 600;
       }

       .mobile-heading-wrap {
           margin: 8px 0 16px;
       }

       .mobile-title {
           font-size: 29px;
           font-weight: 700;
           line-height: 1.3;
           margin: 0 0 8px;
       }

       .mobile-title .highlight-text {
           display: block;
           font-weight: 700;
       }

       .mobile-subheading {
           font-size: 13px;
           color: #6C6F74;
           line-height: 1.2;
           margin: 0;
       }

       .mobile-hero-wrapper {
           position: relative;
           overflow: hidden;

           margin: 12px 0;
       }

       .mobile-hero-slider {
           display: flex;
           transition: transform 0.4s ease;
           will-change: transform;
       }

       .mobile-slide {
           min-width: 100%;
           aspect-ratio: 1 / 1;
           overflow: hidden;
       }

       .mobile-slide img {
           width: 100%;
           height: 100%;
           object-fit: contain;
           /* or cover if you want fill */
           display: block;
       }

       /* Arrows */
       .mobile-slider-nav {
           position: absolute;
           top: 45%;
           transform: translateY(-50%);
           background: rgba(0, 0, 0, 0.5);
           color: #fff;
           border: none;
           padding: 8px 12px;
           border-radius: 50%;
           cursor: pointer;
           font-size: 18px;
       }

       .mobile-slider-nav.prev {
           left: 10px;
       }

       .mobile-slider-nav.next {
           right: 10px;
       }

       /* Dots */
       .mobile-slider-dots {
           display: flex;
           justify-content: center;
           gap: 6px;
           margin-top: 10px;
       }

       .mobile-dot {
           width: 6px;
           height: 6px;
           background: #ccc;
           border-radius: 50%;
           transition: 0.3s ease;
       }

       .mobile-dot.active {
           width: 18px;
           border-radius: 10px;
           background: #000;
       }

       .mobile-hero-slider {
           display: flex;
           transition: transform 0.4s ease;
       }

       .mobile-slide {
           min-width: 100%;
       }

       .mobile-key-features {
           margin: 16px 0;
       }

       .mobile-key-features-row {
           display: flex;
           gap: 4px;
           overflow-x: auto;
       }

       .mobile-key-features-row::-webkit-scrollbar {
           display: none;
       }

       .mobile-key-feature-item {
           flex: 0 0 auto;
           width: 80px;
           text-align: center;
       }

       .mobile-key-feature-icon {
           width: 45px;
           height: 45px;
           object-fit: contain;
           margin-bottom: 8px;
       }

       .mobile-key-feature-text {
           font-size: 12px;
           /* bigger text */
           font-weight: 600;
           line-height: 1.3;
       }

       .mobile-extra-subheading {
           font-size: 14px;
           font-weight: 500;
           color: #333;
           margin: 16px 0 10px;
           line-height: 1.4;
       }

       .mobile-airtype-section {
           margin-top: 12px;
       }

       .mobile-airtype-buttons {
           display: flex;
           gap: 10px;
       }

       .mobile-airtype-buttons .airtype-btn {
           flex: 1;
           padding: 8px 12px;
           border: 1px solid #0D362B;
           background: #fff;
           font-size: 13px;
           cursor: pointer;
       }

       .mobile-airtype-buttons .airtype-btn.active {
           border-color: #0D362B;
           background: #0D362B;
           color: #fff;
       }

       .mobile-cart-box {
           margin-top: 16px;
       }

       .mobile-cart-row {
           display: flex;
           align-items: center;
           gap: 12px;
       }

       .mobile-cart-row .qty-box {
           display: flex;
           align-items: center;
           justify-content: space-between;
           width: 120px;
           height: 44px;
           border: 1px solid #ccc;
           background: #fff;
       }

       .mobile-cart-row .qty-box button {
           width: 40px;
           height: 100%;
           border: none;
           background: transparent;
           font-size: 18px;
           cursor: pointer;
       }

       .mobile-cart-row .qty-box input {
           width: 40px;
           text-align: center;
           border: none;
           font-size: 16px;
       }

       .mobile-cart-form {
           flex: 1;
       }

       .mobile-add-btn {
           width: 100%;
           height: 44px;
           background: #0f3f2f;
           /* green like screenshot */
           color: #fff;
           border: none;
           font-weight: 600;
           font-size: 14px;
           cursor: pointer;
       }

       .pincode {
           margin-bottom: 12px;
       }

       .mobile-cta-group {
           display: flex;
           gap: 10px;
           flex: 1;
       }

       .mobile-add-btn,
       .mobile-buy-now-btn {
           flex: 1;
           height: 48px;
           font-weight: 600;
       }

       .mobile-buy-now-btn {
           background: #000;
           color: #fff;
           border: none;
       }

       .color-section label,
       .pincode label {
           width: auto !important;
       }

       .pincode-input {
           width: 100% !important;
       }

       .color-section {
           margin: 14px 0;
       }

       .color-options {
           gap: 8px;
       }

       .product-info-container {
           padding: 0 12px !important;
       }

       .mobile-layout {
           padding: 12px 6px 24px !important;
       }


       .mobile-price-box .current-price {
           font-size: 22px;
           font-weight: 700;
           margin-right: 8px;
       }

       .mobile-price-box {
           display: flex;
           align-items: flex-end;
           gap: 8px;
           flex-wrap: wrap;
           margin-top: 12px;
       }

       .mobile-price-box .compare-price {
           font-size: 14px;
       }

       .mobile-price-box .offer-tax {
           font-size: 11px;
           color: #8c8c8c;
           margin-left: 4px;
           width: auto;
       }

       .mobile-discount {
           margin-top: 4px;
           display: inline-block;
           background: #1f1f1f;
           color: #fff;
           padding: 4px 8px;
           font-size: 12px;
           border-radius: 4px;
       }

       .mobile-tax-note {
           font-size: 12px;
           color: #777;
           margin-top: 4px;
       }

       .mobile-extra-subheading {
           margin: 8px 0 8px;
       }

       .color-counter-row {
           display: flex;
           justify-content: space-between;
           align-items: flex-start;
       }

       .color-bottom-row {
           display: flex;
           justify-content: space-between;
           align-items: center;
           gap: 15px;
       }

       .sold-unit {
           white-space: nowrap;
       }

       .sold-unit p {
           margin: 0;
           font-size: 14px;
           font-weight: 500;
           color: #001d00;
       }

       .units-sold-text {
           margin: 0;
           font-size: 14px;
           font-weight: 600;
           color: #001d00;
       }

       .mobile-layout .color-bottom-row {
           display: flex;
           justify-content: space-between;
           align-items: center;
       }

       .mobile-layout .color-options {
           display: flex;
           gap: 8px;
       }

       .mobile-layout .color-swatch {
           width: 22px;
           height: 22px;
           border-radius: 50%;
           border: 1px solid #ccc;
       }

       .color-swatch {
           display: inline-block !important;
       }

       .features {
           font-size: 13px;
           gap: 15px;
           margin-top: 15px;
           margin-bottom: 10px;
       }

       .custom-badge {
           display: inline-block;
           background-color: #1f3b2c;
           /* dark green */
           color: #ffffff;
           font-size: 9px;
           letter-spacing: 1px;
           padding: 4px 7px;
           border-radius: 4px;
           font-weight: 500;
           text-transform: uppercase;
           margin-bottom: 10px;
       }

       .ratings {
           display: flex;
           gap: 8px;
           flex-wrap: wrap;
           margin-bottom: 10px;
       }

       .pills {
           display: inline-flex;
           align-items: center;
           padding: 5px 11px;
           border-radius: 999px;
           border: 1px solid #000;
           font-size: 12px;
           color: #fff;
           font-weight: 500;
           background: #0D362B;
           white-space: nowrap;
       }

       .badges {
           display: flex;
           gap: 6px;
           flex-wrap: wrap;
           margin-bottom: 12px;
       }


       .badge {
           display: inline-flex;
           align-items: center;
           padding: 5px 11px;
           border-radius: 999px;
           border: 1px solid #ccc;
           font-size: 11px;
           color: #5f5f5f;
           font-weight: 500;
           background: #e3e3e3;
           white-space: nowrap;
       }

       .features {
           display: flex;
           gap: 6px;
           flex-wrap: no-wrap;
           color: #444;
           margin-top: 7px;
       }
   }