h1.pd-title {
color: rgba(48, 166, 127, 0.80);
font-family: "Noto Sans";
font-size: 24px;
font-style: normal;
font-weight: 600;
line-height: 28px; 
letter-spacing: -0.12px;
text-transform: capitalize;	
}
.pd-gallery{--hero-w:100%;--hero-h:600px;--gap:14px;--thumb-w:159px;--thumb-h:102px;--shadow:0 10px 30px rgba(0,0,0,.15);margin-bottom:24px}
.pd-hero{position:relative;width:min(100%,var(--hero-w));height:var(--hero-h));height:var(--hero-h);border-radius:28px;overflow:hidden;background:#f4f5f7;box-shadow:var(--shadow)}
.pd-main{width:100%;height:100%;object-fit:cover;display:block}
.pd-badge{position:absolute;top:18px;left:18px;background:#3cc18a;color:#fff;padding:10px 16px;border-radius:999px;font:600 14px/1 system-ui;box-shadow:0 6px 16px rgba(60,193,138,.35)}
.pd-actions{position:absolute;right:18px;bottom:18px;display:flex;gap:20px;background:#39a07a;padding:5px 5px;border-radius:22px;width:196px;height:102px;align-items:center;justify-content:center;}
.pd-btn{border:0;background:#ffffff00;color:#fff;width:36px;height:36px;display:grid;place-items:center;border-radius:12px;cursor:pointer;padding: 0px;}
.pd-btn:hover{background:#ffffff33}
.pd-thumbs{position:absolute;left:6px;bottom:6px;width:calc(4.5*var(--thumb-w) + 4*var(--gap) + 24px);border-radius:20px;background:#ffffff00;box-shadow:var(--shadow);overflow:hidden}
.pd-thumb-track{display:flex;gap:var(--gap);transition:transform .4s ease}
.pd-thumb{width:var(--thumb-w);height:var(--thumb-h);border:0px;border-radius:22px;overflow:hidden;padding:0;cursor:pointer;background:#eee;flex:0 0 auto}
.pd-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.pd-thumb.is-active{border:2px solid #30a67f;box-shadow:0 6px 14px rgba(60,193,138,.3); background:#fff;}
.pd-thumb.is-active img{opacity:0.5;}
.pd-thumb-next,.pd-thumb-prev{position:absolute;top:50%;transform:translateY(-50%);border:0;display:grid;place-items:center;background:transparent;color:#2b8c66;cursor:pointer}
.pd-thumb-next{right:-14px;z-index:999;}
.pd-thumb-prev{left:10px;display:none}
.pd-thumbs::after {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.00) 0%, #FFF 100%);
    position: absolute;
    width: 6%;
    height: 100%;
    content: "";
    top: 0;
    right: 0px;
    z-index: 10;
}
.w2w-klarna .txtbox {
	color: #363635;
	font-family: "Noto Sans";
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 12px; /* 150% */
	letter-spacing: 0.64px;	
	display: flex;
	align-items: start;
	gap: 0;
	flex-direction: column;	
}
.w2w-klarna .icnbox{
	width: 77px;
    height: 45px;
}
.w2w-klarna .txtbox a{
	color: #30A67F;
	font-family: Lato;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 32px; /* 200% */
	letter-spacing: 0.64px;
	text-decoration-line: underline;
	text-decoration-style: solid;
	text-underline-position: from-font;
}
@media (max-width:1280px){.pd-gallery{--hero-w:100%}}
@media (max-width:640px){
	.pd-gallery{--thumb-w:140px;--thumb-h:92px}
	.pd-actions{padding:10px 14px}
    .pd-actions {
        padding: 5px 10px !important;
        height: auto !important;
        border-radius: 10px !important;
        background: rgba(48, 166, 127, 0.80);
		right: 5px;
		width:150px;
		gap:15px;
    }	
	.pd-thumbs{
		display:flex;
		width: 60%;
		border-radius:10px;
	}
	.pd-thumb {
    width: 60px;
    height: 45px;
    border: 0px;
    border-radius: 10px;
	}
	.w2w-colours-left{
		position:relative;
	}
	.w2w-colours-toggle{
		position: absolute;
		top: 0px;
		right: 0;
		margin: 0px;
		padding: 0;
	}
	.w2w-colours-right .w2w-attribute-chips .w2w-chip{
	  font-family: Lato;
      font-size: 14px;
    }
	.w2w-calc-wrap .w2w-card{
		width:100%;
	}
	.productList {
		padding: 0px 0px !important;
		position: relative;
	}	
    .productList .swiper-pagination {
        display: inline-block;
        position: static;
        margin: 35px 0 35px;
    }
	.productList .swiper-pagination span.swiper-pagination-bullet {
        width: 20px;
        height: 12px;
        border-radius: 10px;
    }
	.productList .swiper-pagination span.swiper-pagination-bullet.swiper-pagination-bullet-active {
        background: #37856A;
    }
	.w2w-related {
    margin-bottom: 0px !important;
    }
}

.w2w-colour-swatch img{
	border-radius: 40px;
}
.pdetails .price-line, .pdetails .price-line .price-decimal{font-size: clamp(20px, 2.5vw, 32px);}
.pdetails .price-line .price-decimal{vertical-align:top;}
.pdetails .price-line::after {font-size: clamp(20px, 2.5vw, 32px);color: #222222;top: -3px;}
.productList {
    padding: 0px 40px;
    position: relative;
}
.productList .mySpecialSwiper{
	position:static;
}
/* Left thumbnail rail */
.pd-gallery .thumb-swiper {
  width: 90%;           /* apne layout ke hisab se */
  height: 100%;          /* banner ki height match kar lo */
  position: relative;
  padding-top:50px !important;
}

/* Swiper slides me jo tumhare thumbnail boxes jayenge */
.pd-gallery .thumb-swiper .swiper-slide > * {
  width: 100%;
  display: block;
}
.calcy-wrapper input[name="calwidth"] {
/*     margin-bottom: 0px; */
}

.pd-gallery .swiper-slide{
	width:100%;
	height:90px !important;
	overflow:hidden;
	border-radius: 22px;
	transition: max-height 600ms ease;  /* slow & smooth */
}

.pd-gallery .swiper-vertical>.swiper-wrapper{
	gap:10px;
}
.pd-gallery .swiper-slide-active {
    height: 246px !important;
}
/* Navigation buttons (vertical) */
.pd-gallery .thumb-swiper .swiper-button-next,
.pd-gallery .thumb-swiper .swiper-button-prev {
  --swiper-navigation-size: 20px;
  width: 28px; height: 28px;
  border-radius: 999px;
  background: rgba(0,0,0,.5);
  color:#fff;
  display:none;
}
.pd-gallery .thumb-swiper .swiper-button-next { right: -8px; transform: rotate(90deg); }
.pd-gallery .thumb-swiper .swiper-button-prev { left: -8px;  transform: rotate(90deg); }

/* Mobile me horizontal */
@media (max-width: 768px) {
.pd-gallery .thumb-swiper { width: 100%; height: auto; }
.pd-gallery .swiper-wrapper{
		flex-direction:column;
		gap:10px;
}	
	.pd-gallery .swiper-wrapper .swiper-slide{
		width: 150px !important;
		height: 32px;
		border-radius: 8px;
		overflow: hidden;
		margin-right: auto !important;
		margin-left: auto !important;
	}	
	.w2w-klarna .txtbox{
	   flex: 0 0 calc(100% - 77px);
       gap: 8px;
       flex-direction: unset;
	}
}
