/* Pin Labz Design — PP Product Grid. Scoped to .ppd-pg */
.ppd-pg{background:var(--ppd-paper);color:var(--ppd-ink);font-family:var(--ppd-font)}
.ppd-pg *,.ppd-pg *::before,.ppd-pg *::after{box-sizing:border-box}
.ppd-pg-inner{max-width:1320px;margin:0 auto;padding:88px 40px}

/* Heading row */
.ppd-pg-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px 40px;flex-wrap:wrap;margin-bottom:30px}
.ppd-pg-headtext{min-width:0;max-width:640px}
.ppd-pg .ppd-pg-title{margin:0 0 12px;padding:0;font:700 clamp(28px,3.4vw,44px)/1.1 var(--ppd-font);letter-spacing:.03em;text-transform:uppercase;color:var(--ppd-ink);text-wrap:balance}
.ppd-pg .ppd-pg-sub{margin:0;font:400 16px/1.6 var(--ppd-font-b);color:var(--ppd-muted);max-width:56ch}
.ppd-pg-all{position:relative;padding-bottom:6px;font:500 13px/1 var(--ppd-font);letter-spacing:.14em;text-transform:uppercase;color:var(--ppd-ink);text-decoration:none;white-space:nowrap}
.ppd-pg-all::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--ppd-ink);transition:background .3s}
.ppd-pg-all:hover::after,.ppd-pg-all:focus-visible::after{background:var(--ppd-foil);height:2px}
.ppd-pg-all:focus-visible{outline:2px solid var(--ppd-ink);outline-offset:4px}

/* Tabs */
.ppd-pg-tabs{display:flex;gap:28px;margin:0 0 34px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--ppd-line)}
.ppd-pg-tabs::-webkit-scrollbar{display:none}
.ppd-pg .ppd-pg-tab{position:relative;flex:0 0 auto;margin:0;padding:12px 0 14px;background:none;border:0;border-radius:0;box-shadow:none;cursor:pointer;
	font:500 13px/1 var(--ppd-font);letter-spacing:.12em;text-transform:uppercase;color:var(--ppd-muted);transition:color .2s}
.ppd-pg .ppd-pg-tab:hover,.ppd-pg .ppd-pg-tab:focus{background:none;color:var(--ppd-ink)}
.ppd-pg .ppd-pg-tab[aria-selected="true"]{color:var(--ppd-ink)}
.ppd-pg-tab::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--ppd-foil);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ppd-ease)}
.ppd-pg-tab[aria-selected="true"]::after{transform:scaleX(1)}
.ppd-pg-tab:focus-visible{outline:2px solid var(--ppd-ink);outline-offset:2px}

/* Grid */
.ppd-pg .ppd-pg-grid{--pg-cols:4;--pg-gap:24px;display:grid;grid-template-columns:repeat(var(--pg-cols),minmax(0,1fr));column-gap:var(--pg-gap);row-gap:44px;margin:0;padding:0;list-style:none}
.ppd-pg-card{display:flex;flex-direction:column;min-width:0;margin:0;padding:0}
.ppd-pg-card[hidden]{display:none}
.ppd-pg-card.is-in{animation:ppd-pg-in .35s var(--ppd-ease) both}
@keyframes ppd-pg-in{from{opacity:0}to{opacity:1}}

/* Media — the foil frame fades in on hover, like the vial's foil print */
.ppd-pg-media{position:relative;display:block;aspect-ratio:1/1;border-radius:4px;background:var(--ppd-mist);overflow:hidden}
.ppd-pg-media::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;background:var(--ppd-foil);
	-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .35s}
.ppd-pg-card:hover .ppd-pg-media::after{opacity:1}
.ppd-pg .ppd-pg-media img{width:100%;height:100%;object-fit:cover;padding:0;margin:0;display:block;max-width:none;transform:translateY(var(--pg-img-y,0%)) scale(var(--pg-zoom,1));transform-origin:center;image-rendering:auto;transition:transform .6s var(--ppd-ease)}
.ppd-pg-card:hover .ppd-pg-media img{transform:translateY(calc(var(--pg-img-y,0%) - 4px)) scale(var(--pg-zoom,1))}
.ppd-pg-badge{position:absolute;top:12px;left:12px;padding:6px 9px 5px;border-radius:2px;background:var(--ppd-accent);color:var(--ppd-on-foil);font:600 10px/1 var(--ppd-font);letter-spacing:.16em;text-transform:uppercase}
.ppd-pg-badge.is-sale{background:var(--ppd-foil);color:var(--ppd-on-foil)}

/* Body */
.ppd-pg-body{display:flex;flex-direction:column;flex:1;padding-top:16px}
.ppd-pg-cat{margin-bottom:6px;font:400 13px/1.3 var(--ppd-font);color:var(--ppd-muted)}
.ppd-pg .ppd-pg-name{margin:0 0 10px;padding:0;font:500 16px/1.3 var(--ppd-font);letter-spacing:.08em;text-transform:uppercase;color:var(--ppd-ink)}
.ppd-pg-name a{color:inherit;text-decoration:none}
.ppd-pg-name a:hover{text-decoration:underline;text-underline-offset:4px}
.ppd-pg-name a:focus-visible{outline:2px solid var(--ppd-ink);outline-offset:3px}

/* Strength boxes — the boxed "600MG" from the label */
.ppd-pg-str{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.ppd-pg-str span{display:inline-flex;align-items:center;height:24px;padding:0 7px;border:1px solid var(--ppd-ink);border-radius:2px;font:500 11px/1 var(--ppd-font);letter-spacing:.08em;text-transform:uppercase;color:var(--ppd-ink);white-space:nowrap}
.ppd-pg-str .is-more{border-color:transparent;padding:0 2px;color:var(--ppd-muted);text-transform:none;letter-spacing:0}

.ppd-pg-price{margin-bottom:16px;font:600 16px/1.3 var(--ppd-font-b);letter-spacing:.02em;color:var(--ppd-ink);font-variant-numeric:tabular-nums}
.ppd-pg-from{font-weight:400;color:var(--ppd-muted)}
.ppd-pg-price del{color:var(--ppd-muted);font-weight:400;margin-right:6px}
.ppd-pg-price ins{text-decoration:none}
.ppd-pg-cta{margin-top:auto}

/* Fallback button when Pin Labz Store Suite isn't active */
.ppd-pg-btn--link{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;border:1px solid var(--ppd-ink);border-radius:999px;color:var(--ppd-ink);text-decoration:none;font:500 12px/1 var(--ppd-font);letter-spacing:.16em;text-transform:uppercase}
.ppd-pg-btn--link:hover{background:var(--ppd-accent);border-color:var(--ppd-accent);color:var(--ppd-on-foil)}

.ppd-pg-none{margin:24px 0 0;color:var(--ppd-muted);font-size:15px}
.ppd-pg-none[hidden]{display:none}

@media (max-width:1024px){
	.ppd-pg-inner{padding:72px 32px}
	.ppd-pg .ppd-pg-grid{--pg-cols:3}
}
@media (max-width:767px){
	.ppd-pg-inner{padding:56px 20px}
	.ppd-pg-head{margin-bottom:22px}
	.ppd-pg .ppd-pg-grid{--pg-cols:2;--pg-gap:14px;row-gap:32px}
	.ppd-pg .ppd-pg-name{font-size:14px;letter-spacing:.06em}
	.ppd-pg-str span{height:22px;padding:0 5px;font-size:10px}
	.ppd-pg-price{font-size:15px;margin-bottom:12px}
	.ppd-pg .pps-qa{min-height:40px;padding:0 8px;font-size:11px;letter-spacing:.1em}
	.ppd-pg-tabs{gap:22px;margin-bottom:26px;margin-right:-20px;padding-right:20px}
	/* Swipeable row */
	.ppd-pg-m-swipe .ppd-pg-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin:0 -20px;padding:0 20px 8px;scroll-padding:0 20px;scrollbar-width:none}
	.ppd-pg-m-swipe .ppd-pg-grid::-webkit-scrollbar{display:none}
	.ppd-pg-m-swipe .ppd-pg-card{flex:0 0 72%;scroll-snap-align:start}
}
@media (prefers-reduced-motion:reduce){
	.ppd-pg-card.is-in{animation:none}
	.ppd-pg .ppd-pg-media img,.ppd-pg-tab::after,.ppd-pg-media::after{transition:none}
}

/* ---------- Heading: small line + solid "Explore all" button ---------- */
.ppd-pg .ppd-pg-eyebrow{margin:0 0 10px;font:600 13px/1.3 var(--ppd-font);letter-spacing:.2em;text-transform:uppercase;color:var(--ppd-accent)}
.ppd-pg-all.is-btn{display:inline-flex;align-items:center;justify-content:center;min-height:58px;padding:0 44px;border-radius:4px;background:var(--ppd-accent);color:var(--ppd-on-foil);
	font:600 16px/1 var(--ppd-font);letter-spacing:.02em;text-transform:none;position:relative;overflow:hidden;isolation:isolate;transition:color .3s}
.ppd-pg-all.is-btn::after{inset:0;height:auto;z-index:-1;background:var(--ppd-foil);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ppd-ease)}
.ppd-pg-all.is-btn:hover,.ppd-pg-all.is-btn:focus-visible{color:var(--ppd-on-foil)}
.ppd-pg-all.is-btn:hover::after,.ppd-pg-all.is-btn:focus-visible::after{transform:scaleX(1);height:auto}

/* ---------- Boxed card style ---------- */
.ppd-pg-boxed .ppd-pg-card{--pg-pad:24px;background:var(--ppd-mist);border:1px solid var(--ppd-line);border-radius:4px;overflow:hidden;transition:box-shadow .35s var(--ppd-ease),border-color .35s}
.ppd-pg-boxed .ppd-pg-card:hover{box-shadow:0 22px 44px -18px rgba(0,0,0,.7);border-color:rgba(227,32,39,.45)}
.ppd-pg-boxed .ppd-pg-media{background:var(--ppd-mist);border-radius:0}
.ppd-pg-boxed .ppd-pg-media::after{display:none}
.ppd-pg-boxed .ppd-pg-media img{padding:0}
.ppd-pg-boxed .ppd-pg-card:hover .ppd-pg-media img{transform:translateY(var(--pg-img-y,0%)) scale(calc(var(--pg-zoom,1) * 1.04))}
.ppd-pg-boxed .ppd-pg-body{padding:6px var(--pg-pad) var(--pg-pad)}
.ppd-pg-boxed .ppd-pg-name{margin-bottom:10px;font:500 clamp(18px,1.6vw,22px)/1.25 var(--ppd-font);letter-spacing:.02em;text-transform:none}
.ppd-pg-boxed .ppd-pg-price{margin-bottom:22px;font:600 clamp(17px,1.4vw,20px)/1.3 var(--ppd-font-b)}
.ppd-pg-boxed .ppd-pg-cat{margin-bottom:4px}

/* Solid black Quick Add (overrides the suite's outline pill inside this widget only) */
.ppd-pg-boxed .ppd-pg-cta .pps-qa,.ppd-pg-boxed .ppd-pg-cta .ppd-pg-btn--link{min-height:56px;padding:0 16px;border:1px solid var(--ppd-accent);border-radius:4px;clip-path:inset(0 round 4px);
	background:var(--ppd-accent);color:var(--ppd-on-foil);font:600 16px/1 var(--ppd-font);letter-spacing:.01em;text-transform:none}
.ppd-pg-boxed .ppd-pg-cta .pps-qa::before{background:var(--ppd-foil)}
.ppd-pg-boxed .ppd-pg-cta .pps-qa:hover,.ppd-pg-boxed .ppd-pg-cta .pps-qa:focus-visible,.ppd-pg-boxed .ppd-pg-cta .ppd-pg-btn--link:hover{color:var(--ppd-on-foil);border-color:var(--ppd-accent);background:var(--ppd-accent)}
.ppd-pg-boxed .ppd-pg-cta .ppd-pg-btn--link:hover{background:var(--ppd-foil)}
.ppd-pg-boxed .ppd-pg-cta .pps-qa.is-added{color:var(--ppd-on-foil);border-color:transparent}
.ppd-pg-boxed .ppd-pg-cta .pps-qa.is-disabled{background:var(--ppd-mist);color:var(--ppd-muted);border-color:var(--ppd-line)}
.ppd-pg-boxed .ppd-pg-cta .pps-qa:focus-visible{outline:2px solid var(--ppd-ink);outline-offset:3px;clip-path:none}

@media (max-width:767px){
	.ppd-pg-all.is-btn{min-height:48px;padding:0 24px;font-size:14px}
	.ppd-pg-boxed .ppd-pg-card{--pg-pad:12px}
	.ppd-pg-boxed .ppd-pg-name{font-size:15px;margin-bottom:6px}
	.ppd-pg-boxed .ppd-pg-price{font-size:16px;margin-bottom:14px}
	.ppd-pg-boxed .ppd-pg-cta .pps-qa,.ppd-pg-boxed .ppd-pg-cta .ppd-pg-btn--link{min-height:44px;font-size:14px;padding:0 8px;letter-spacing:0}
}

/* ---------- Button colour: red gradient, pill shape ---------- */
.ppd-pg{--pg-btn-r:100px}
.ppd-pg-btn-foil .ppd-pg-all.is-btn,
.ppd-pg-btn-foil.ppd-pg-boxed .ppd-pg-cta .pps-qa,
.ppd-pg-btn-foil.ppd-pg-boxed .ppd-pg-cta .ppd-pg-btn--link{
	border:0;border-radius:var(--pg-btn-r);clip-path:inset(0 round var(--pg-btn-r));
	background:linear-gradient(90deg,#B5161C,#E32027,#FF4A50,#E32027,#B5161C,#B5161C);background-size:200% 100%;background-position:0 0;
	color:var(--ppd-on-foil);transition:background-position .7s var(--ppd-ease),transform .3s var(--ppd-ease),box-shadow .3s}
.ppd-pg-btn-foil .ppd-pg-all.is-btn::after,
.ppd-pg-btn-foil.ppd-pg-boxed .ppd-pg-cta .pps-qa::before{display:none}
.ppd-pg-btn-foil .ppd-pg-all.is-btn:hover,.ppd-pg-btn-foil .ppd-pg-all.is-btn:focus-visible,
.ppd-pg-btn-foil.ppd-pg-boxed .ppd-pg-cta .pps-qa:hover,.ppd-pg-btn-foil.ppd-pg-boxed .ppd-pg-cta .pps-qa:focus-visible,
.ppd-pg-btn-foil.ppd-pg-boxed .ppd-pg-cta .ppd-pg-btn--link:hover{
	background:linear-gradient(90deg,#B5161C,#E32027,#FF4A50,#E32027,#B5161C,#B5161C);background-size:200% 100%;background-position:100% 0;
	color:var(--ppd-on-foil);transform:translateY(-1px);box-shadow:0 10px 22px -10px rgba(227,32,39,.8)}
.ppd-pg-btn-foil.ppd-pg-boxed .ppd-pg-cta .pps-qa:focus-visible,.ppd-pg-btn-foil .ppd-pg-all.is-btn:focus-visible{clip-path:none;outline:2px solid var(--ppd-ink);outline-offset:3px}
.ppd-pg-btn-foil.ppd-pg-boxed .ppd-pg-cta .pps-qa.is-loading{opacity:.75}
.ppd-pg-btn-foil.ppd-pg-boxed .ppd-pg-cta .pps-qa.is-added{background:var(--ppd-ink);color:var(--ppd-paper)}
.ppd-pg-btn-foil.ppd-pg-boxed .ppd-pg-cta .pps-qa.is-disabled{background:var(--ppd-mist);color:var(--ppd-muted)}
/* Solid black option keeps the same pill radius control */
.ppd-pg-btn-ink.ppd-pg-boxed .ppd-pg-cta .pps-qa,.ppd-pg-btn-ink .ppd-pg-all.is-btn{border-radius:var(--pg-btn-r);clip-path:inset(0 round var(--pg-btn-r))}
@media (prefers-reduced-motion:reduce){
	.ppd-pg-btn-foil .ppd-pg-all.is-btn,.ppd-pg-btn-foil.ppd-pg-boxed .ppd-pg-cta .pps-qa{transition:none}
}

/* Product name link must follow the name's typography (theme / Elementor kit link styles set their own) */
.ppd-pg .ppd-pg-name a,.ppd-pg .ppd-pg-name a:hover,.ppd-pg .ppd-pg-name a:focus{
	font-family:inherit!important;font-size:inherit!important;font-weight:inherit!important;font-style:inherit!important;
	line-height:inherit!important;letter-spacing:inherit!important;text-transform:inherit!important;word-spacing:inherit!important}
.ppd-pg .ppd-pg-price .amount,.ppd-pg .ppd-pg-price bdi,.ppd-pg .ppd-pg-price .woocommerce-Price-currencySymbol{font:inherit!important;letter-spacing:inherit!important}
