/* =====================================================================
PakPick — modern front-end layer (hero, marquee, bento, cards, motion)
Loads on top of theme.json + style.css. Brand vars come from PakPick Core.
===================================================================== */
:root{
/* --pp-accent (Mint) is provided by PakPick Core → Brand hub (single source of truth) */
--pp-accent-2:#0A6B39; /* mid pine for gradients */
--pp-ink:#0C130E; /* near-black green */
--pp-radius-lg:24px;
--pp-shadow:0 24px 60px -20px rgba(2,65,29,.35);
--pp-shadow-sm:0 10px 30px -12px rgba(12,19,14,.25);
}
.pp-container{ max-width:1200px; margin-inline:auto; padding-inline:clamp(1rem,5vw,2rem); }
/* ---------- scroll reveal (only hides when JS is active, so no-JS stays visible) ---------- */
.pp-js .pp-reveal{ opacity:0; transform:translateY(28px); transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); }
.pp-js .pp-reveal.pp-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .pp-js .pp-reveal{ opacity:1; transform:none; transition:none; } }
/* ---------- section heading ---------- */
.pp-head{ text-align:center; max-width:640px; margin:0 auto clamp(1.5rem,4vw,2.75rem); }
.pp-eyebrow{ display:inline-block; font-size:.75rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--pp-pine); }
.pp-head h2{ font-size:clamp(1.9rem,1.4rem + 2.2vw,3rem); line-height:1.08; letter-spacing:-.02em; margin:.5rem 0 .5rem; }
.pp-head p{ color:#5f6b62; font-size:1.05rem; margin:0; }
/* ---------- shared buttons / highlight ---------- */
.pp-hl{ position:relative; white-space:nowrap; color:var(--pp-accent); }
.pp-cta-row{ display:flex; gap:.9rem; flex-wrap:wrap; margin-top:2rem; }
.pp-btn{ display:inline-flex; align-items:center; gap:.55rem; font-weight:700; font-size:1.02rem; padding:.95rem 1.7rem; border-radius:12px; text-decoration:none; cursor:pointer; border:1.5px solid transparent; transition:transform .2s, background .2s, box-shadow .2s; }
.pp-btn:hover{ transform:translateY(-2px); }
.pp-btn--solid{ background:#fff; color:var(--pp-pine); box-shadow:0 12px 30px -12px rgba(0,0,0,.5); }
.pp-btn--solid:hover{ background:var(--pp-accent); color:var(--pp-ink); }
.pp-btn--ghost{ border-color:rgba(255,255,255,.35); color:#fff; }
.pp-btn--ghost:hover{ background:rgba(255,255,255,.1); }
.pp-btn--pine{ background:var(--pp-pine); color:#fff; box-shadow:0 12px 30px -14px rgba(2,65,29,.6); }
.pp-btn--pine:hover{ background:var(--pp-charcoal); color:#fff; }
.pp-btn--line{ background:#fff; border-color:var(--pp-mist); color:var(--pp-pine); }
.pp-btn--line:hover{ border-color:var(--pp-pine); }
/* =====================================================================
HOME SHOWCASE — auto rotating product stage ([pp_showcase])
===================================================================== */
/* remove default flow gaps between the full-width homepage sections + header/main/footer */
.wp-block-post-content > .wp-block-group{ margin-block:0 !important; }
.wp-site-blocks > main.wp-block-group, main.wp-block-group{ margin-block:0 !important; padding-top:0 !important; }
.wp-site-blocks > header.wp-block-group{ margin-bottom:0 !important; }
.wp-block-post-content{ margin-top:0 !important; }
.pp-show{ --show-bg:#03301A; --show-disc:#0A6B39; --show-disc2:#17945A; --show-accent:#2FD98A; --show-dur:6.5s;
position:relative; overflow:hidden; color:#fff; background:var(--show-bg); outline:none;
transition:background-color .9s ease; }
.pp-show::before{ content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
background:radial-gradient(55% 75% at 78% 50%, color-mix(in srgb, var(--show-accent) 14%, transparent), transparent 70%); }
.pp-show::after{ content:""; position:absolute; inset:0; pointer-events:none; z-index:0; opacity:.5;
background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
background-size:56px 56px; mask-image:radial-gradient(70% 90% at 50% 50%,#000,transparent 82%); -webkit-mask-image:radial-gradient(70% 90% at 50% 50%,#000,transparent 82%); }
.pp-show__in{ position:relative; z-index:2; max-width:1200px; margin:0 auto;
padding:100px var(--wp--style--root--padding-right,2rem); }
.pp-show__stage{ display:grid; }
.pp-show__slide{ grid-area:1/1; display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(1.5rem,4vw,3.5rem); align-items:center;
min-height:clamp(400px,42vw,500px); opacity:0; visibility:hidden; pointer-events:none;
transition:opacity .45s ease, visibility 0s linear .45s; }
.pp-show__slide.is-active{ opacity:1; visibility:visible; pointer-events:auto; transition:opacity .6s ease; }
/* info column (bottom padding reserves space for the absolutely placed nav row) */
.pp-show__info{ padding-bottom:78px; }
.pp-show__info > *{ opacity:0; transform:translateY(22px); transition:opacity .3s ease, transform .3s ease; }
.pp-show__slide.is-active .pp-show__info > *{ opacity:1; transform:none; transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.pp-show__slide.is-active .pp-show__eyebrow{ transition-delay:.12s; }
.pp-show__slide.is-active .pp-show__title{ transition-delay:.2s; }
.pp-show__slide.is-active .pp-show__text{ transition-delay:.28s; }
.pp-show__slide.is-active .pp-show__price{ transition-delay:.34s; }
.pp-show__slide.is-active .pp-show__cta{ transition-delay:.42s; }
.pp-show__slide.is-active .pp-show__trust{ transition-delay:.5s; }
.pp-show__eyebrow{ display:inline-flex; align-items:center; gap:.6rem; font-size:.76rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--show-accent); }
.pp-show__eyebrow i{ width:24px; height:2px; border-radius:2px; background:var(--show-accent); }
.pp-show__title{ font-size:clamp(1.9rem,1.4rem + 1.8vw,2.6rem); line-height:1.08; letter-spacing:-.02em; font-weight:700; margin:.7rem 0 .8rem; color:#fff; }
.pp-show__title em{ font-style:normal; color:var(--show-accent); }
.pp-show__text{ font-size:1.05rem; line-height:1.6; max-width:38ch; margin:0 0 1.3rem; color:rgba(255,255,255,.72); }
.pp-show__price{ display:flex; align-items:center; gap:.9rem; flex-wrap:wrap; margin:0 0 1.3rem; }
.pp-show__now{ font-size:1.9rem; font-weight:700; letter-spacing:-.03em; line-height:1; color:#fff; font-variant-numeric:tabular-nums; }
.pp-show__now .woocommerce-Price-currencySymbol{ font-size:.48em; font-weight:600; margin-right:.12em; vertical-align:.5em; opacity:.85; }
.pp-show__price s{ color:rgba(255,255,255,.48); font-size:1.08rem; }
.pp-show__price s .woocommerce-Price-currencySymbol{ font-size:.75em; }
.pp-show__save{ display:inline-flex; align-items:center; font-size:.8rem; font-weight:700; letter-spacing:.01em; padding:.4rem .75rem; border-radius:999px; color:var(--show-accent); background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); }
@supports (color:color-mix(in srgb,red,blue)){ .pp-show__save{ background:color-mix(in srgb, var(--show-accent) 16%, transparent); border-color:color-mix(in srgb, var(--show-accent) 38%, transparent); } }
.pp-show__cta{ display:flex; gap:.8rem; flex-wrap:wrap; align-items:center; }
.pp-show__buy{ display:inline-flex; align-items:center; gap:.5rem; background:#fff; color:var(--pp-ink); font-weight:700; font-size:1rem; padding:.95rem 1.7rem; border-radius:999px; text-decoration:none;
box-shadow:0 16px 34px -14px rgba(0,0,0,.6); transition:transform .2s, background .2s, color .2s; }
.pp-show__buy:hover{ transform:translateY(-2px); background:var(--show-accent); color:var(--pp-ink); }
.pp-show__buy .pp-ic{ width:18px; height:18px; }
.pp-show__more{ display:inline-flex; align-items:center; gap:.45rem; color:#fff; font-weight:600; font-size:.98rem; text-decoration:none; padding:.9rem 1.25rem; border-radius:999px; border:1.5px solid rgba(255,255,255,.3); box-sizing:border-box; transition:background .2s, border-color .2s, gap .2s; }
.pp-show__more svg{ width:17px; height:17px; }
.pp-show__more:hover{ background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.65); gap:.7rem; }
.pp-show__trust{ list-style:none; margin:1.6rem 0 0; padding:0; display:flex; gap:.4rem .7rem; flex-wrap:wrap; }
.pp-show__trust li{ display:inline-flex; align-items:center; gap:.7rem; font-size:.86rem; white-space:nowrap; font-weight:500; color:rgba(255,255,255,.6); }
.pp-show__trust li + li::before{ content:""; width:4px; height:4px; border-radius:50%; background:var(--show-accent); opacity:.9; }
/* visual column */
.pp-show__visual{ position:relative; align-self:stretch; display:flex; align-items:center; justify-content:center; }
.pp-show__ghost{ position:absolute; left:50%; top:1%; transform:translate(-50%,0); z-index:0; font-weight:700; text-transform:uppercase; letter-spacing:-.04em; line-height:1;
font-size:clamp(4rem,11.5vw,10rem); color:rgba(255,255,255,.1); white-space:nowrap; pointer-events:none; user-select:none;
opacity:0; transition:opacity .3s ease; }
.pp-show__slide.is-active .pp-show__ghost{ opacity:1; transition:opacity 1.2s ease .2s; }
.pp-show__disc{ position:absolute; left:50%; top:50%; width:min(80%,440px); aspect-ratio:1; border-radius:50%; z-index:1;
background:radial-gradient(circle at 35% 30%, var(--show-disc2), var(--show-disc) 72%);
box-shadow:0 44px 90px -30px rgba(0,0,0,.6), inset 0 -34px 60px -20px rgba(0,0,0,.35);
transform:translate(-50%,-50%) scale(.55); opacity:0; transition:transform .35s ease, opacity .3s ease; }
.pp-show__slide.is-active .pp-show__disc{ transform:translate(-50%,-50%) scale(1); opacity:1; transition:transform .9s cubic-bezier(.2,.8,.2,1) .05s, opacity .5s ease .05s; }
.pp-show__disc::after{ content:""; position:absolute; inset:-16px; border-radius:50%; border:1px dashed rgba(255,255,255,.22); animation:pp-showspin 46s linear infinite; }
.pp-show__img{ position:relative; z-index:2; max-height:min(86%,500px); max-width:92%; width:auto; height:auto; object-fit:contain;
filter:drop-shadow(0 30px 40px rgba(0,0,0,.42));
transform:translate(70px,26px) rotate(9deg) scale(.9); opacity:0; transition:transform .35s ease, opacity .3s ease; }
.pp-show__slide.is-active .pp-show__img{ transform:none; opacity:1; transition:transform .95s cubic-bezier(.2,.8,.2,1) .18s, opacity .6s ease .18s;
animation:pp-showfloat 6s ease-in-out 1.3s infinite; }
.pp-show__badge{ position:absolute; z-index:3; right:3%; top:7%; width:88px; height:88px; border-radius:50%; background:var(--show-accent); color:var(--pp-ink);
display:flex; flex-direction:column; align-items:center; justify-content:center; font-weight:700; font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; line-height:1;
box-shadow:0 16px 30px -10px rgba(0,0,0,.5); transform:scale(0) rotate(-30deg); transition:transform .3s ease; }
.pp-show__badge b{ font-size:1.55rem; letter-spacing:-.03em; margin-bottom:.2rem; }
.pp-show__slide.is-active .pp-show__badge{ transform:scale(1) rotate(-8deg); transition:transform .7s cubic-bezier(.34,1.56,.64,1) .75s; }
/* nav row */
.pp-show__nav{ position:absolute; left:var(--wp--style--root--padding-left,2rem); bottom:100px; z-index:3; display:flex; align-items:center; gap:1rem; }
.pp-show__arrow{ width:46px; height:46px; border-radius:50%; border:1.5px solid rgba(255,255,255,.3); background:transparent; color:#fff; display:grid; place-items:center; cursor:pointer; padding:0; box-sizing:border-box;
transition:background .2s, border-color .2s, color .2s, transform .2s; }
.pp-show__arrow:hover{ background:#fff; color:var(--pp-ink); border-color:#fff; transform:scale(1.06); }
.pp-show__arrow svg{ width:20px; height:20px; }
.pp-show__count{ display:flex; gap:.35rem; align-items:baseline; font-weight:700; font-size:.95rem; letter-spacing:.06em; font-variant-numeric:tabular-nums; }
.pp-show__count span{ color:rgba(255,255,255,.5); font-weight:500; }
.pp-show__bar{ width:120px; height:2px; border-radius:2px; background:rgba(255,255,255,.2); overflow:hidden; }
.pp-show__bar i{ display:block; height:100%; width:0; background:var(--show-accent); }
.pp-show.is-playing .pp-show__bar i{ animation:pp-showbar var(--show-dur) linear forwards; }
@keyframes pp-showbar{ from{ width:0 } to{ width:100% } }
@keyframes pp-showspin{ to{ transform:rotate(360deg) } }
@keyframes pp-showfloat{ 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-12px) } }
@media (prefers-reduced-motion:reduce){
.pp-show, .pp-show__slide, .pp-show__info > *, .pp-show__ghost, .pp-show__disc, .pp-show__img, .pp-show__badge{ transition:none !important; animation:none !important; }
.pp-show__disc::after{ animation:none; }
.pp-show__bar{ display:none; }
}
@media (max-width:860px){
.pp-show__in{ padding-top:3rem; padding-bottom:3rem; }
.pp-show__slide{ grid-template-columns:1fr; min-height:auto; gap:.75rem; text-align:center; }
.pp-show__visual{ order:-1; height:clamp(250px,64vw,380px); }
.pp-show__disc{ width:min(70%,320px); }
.pp-show__disc::after{ inset:-10px; }
.pp-show__img{ max-height:96%; }
.pp-show__ghost{ font-size:clamp(3.6rem,19vw,6.5rem); top:0; }
.pp-show__title{ font-size:clamp(1.8rem,7.5vw,2.3rem); margin-top:.6rem; }
.pp-show__text{ margin-inline:auto; }
.pp-show__price, .pp-show__cta, .pp-show__trust{ justify-content:center; }
.pp-show__trust{ gap:.4rem .6rem; margin-top:1.3rem; }
.pp-show__badge{ width:72px; height:72px; right:6%; top:2%; font-size:.62rem; }
.pp-show__badge b{ font-size:1.3rem; }
.pp-show__info{ padding-bottom:0; }
.pp-show__nav{ position:static; justify-content:center; margin-top:1.4rem; }
}
/* 2-up category bento with image backgrounds (.pp-bento.pp-bento--2 beats the 4-col base rule) */
.pp-bento.pp-bento--2{ grid-template-columns:1fr 1fr; grid-auto-rows:360px; }
.pp-cat--img .pp-cat__bg{ background-size:cover; background-position:center; }
@media (max-width:640px){ .pp-bento.pp-bento--2{ grid-template-columns:1fr; grid-auto-rows:240px; } }
/* =====================================================================
MARQUEE
===================================================================== */
.pp-marquee{ background:var(--pp-ink); color:#fff; overflow:hidden; padding:.9rem 0; }
.pp-marquee__track{ display:inline-flex; gap:2.5rem; white-space:nowrap; will-change:transform; animation:pp-scroll 26s linear infinite; }
.pp-marquee:hover .pp-marquee__track{ animation-play-state:paused; }
.pp-marquee__track span{ display:inline-flex; align-items:center; gap:2.5rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; font-size:.82rem; }
.pp-marquee__track span::after{ content:"✦"; color:var(--pp-accent); }
@keyframes pp-scroll{ from{ transform:translateX(0) } to{ transform:translateX(-50%) } }
/* =====================================================================
BENTO CATEGORIES
===================================================================== */
.pp-bento{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:215px; gap:1.1rem; }
.pp-cat{ position:relative; overflow:hidden; border-radius:20px; display:flex; flex-direction:column; justify-content:flex-end;
padding:1.6rem; text-decoration:none; color:#fff; isolation:isolate; box-shadow:var(--pp-shadow-sm); }
.pp-cat--lg{ grid-column:span 2; grid-row:span 2; }
.pp-cat--sm{ grid-column:span 2; }
.pp-cat__bg{ position:absolute; inset:0; z-index:-2; transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.pp-cat:hover .pp-cat__bg{ transform:scale(1.07); }
.pp-cat::after{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,transparent 30%,rgba(8,14,10,.72)); }
.pp-cat--g .pp-cat__bg{ background:linear-gradient(150deg,#2a3a2c,#141a15); }
.pp-cat--h .pp-cat__bg{ background:linear-gradient(150deg,#0a6b39,#02411D); }
.pp-cat--l .pp-cat__bg{ background:linear-gradient(150deg,#e9efe9,#cdd8cf); }
.pp-cat--l{ color:var(--pp-ink); }
.pp-cat--l::after{ background:linear-gradient(180deg,transparent 40%,rgba(255,255,255,.25)); }
.pp-cat h3{ color:inherit; font-size:clamp(1.3rem,1.1rem + .9vw,1.9rem); margin:0; letter-spacing:-.01em; line-height:1.1; }
.pp-cat .pp-cat__go{ display:inline-flex; align-items:center; gap:.4rem; margin-top:.35rem; font-weight:600; font-size:.95rem; opacity:.9; }
.pp-cat .pp-cat__go svg{ transition:transform .3s; }
.pp-cat:hover .pp-cat__go svg{ transform:translateX(5px); }
.pp-cat__mark{ position:absolute; top:1.2rem; right:1.2rem; width:44px; height:44px; opacity:.16; z-index:-1; }
/* =====================================================================
PRODUCT CARDS (global — also improves Shop)
===================================================================== */
.woocommerce ul.products, .woocommerce-page ul.products, ul.products{ display:grid !important; gap:1.5rem !important; margin:0 !important; padding:0 !important; list-style:none !important; float:none !important; }
/* WooCommerce adds clearfix ::before/::after — as a grid these become phantom cells that shove products diagonally. Kill them. */
.woocommerce ul.products::before, .woocommerce ul.products::after,
.woocommerce-page ul.products::before, .woocommerce-page ul.products::after,
ul.products::before, ul.products::after{ content:none !important; display:none !important; }
.woocommerce ul.products.columns-2, ul.products.columns-2{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
.woocommerce ul.products.columns-3, ul.products.columns-3{ grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
.woocommerce ul.products.columns-4, ul.products.columns-4{ grid-template-columns:repeat(4,minmax(0,1fr)) !important; }
@media (max-width:600px){ .woocommerce ul.products, ul.products, .woocommerce ul.products[class*=columns-], ul.products[class*=columns-]{ grid-template-columns:1fr !important; gap:1rem !important; } .pp-picks{ grid-template-columns:1fr; } }
/* neutralise WooCommerce's float/clear grid so items sit in the CSS-grid cells */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.woocommerce ul.products[class*=columns-] li.product,
.woocommerce ul.products[class*=columns-] li.product:nth-child(2n),
.woocommerce-page ul.products[class*=columns-] li.product:nth-child(2n),
ul.products li.product{ width:auto !important; float:none !important; clear:none !important; margin:0 !important; max-width:none !important; }
.woocommerce ul.products li.product{ background:#fff; border:1px solid var(--pp-mist); border-radius:18px; overflow:hidden; padding:0 0 1.1rem; position:relative; display:flex; flex-direction:column; transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s, border-color .3s; }
.woocommerce ul.products li.product:hover{ transform:translateY(-8px); box-shadow:0 26px 48px -26px rgba(12,19,14,.42); border-color:transparent; }
.woocommerce ul.products li.product .onsale{ position:absolute; top:12px; right:12px; left:auto; margin:0; z-index:2; background:var(--pp-sale); color:#fff; font-size:.72rem; font-weight:700; border-radius:999px; padding:5px 11px; min-height:auto; min-width:auto; line-height:1.3; letter-spacing:.02em; }
/* image sits on a soft stage; the zoom is clipped to its own box (never covers the title) */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{ display:block; position:relative; }
.woocommerce ul.products li.product .pp-card__img{ display:block; overflow:hidden; aspect-ratio:1/1; background:#fafbfa; margin:0 0 1rem; }
.woocommerce ul.products li.product .pp-card__img img{ width:100%; height:100%; object-fit:cover; display:block; margin:0; transition:transform .55s cubic-bezier(.2,.7,.2,1); }
.woocommerce ul.products li.product:hover .pp-card__img img{ transform:scale(1.06); }
.woocommerce ul.products li.product .woocommerce-loop-product__title{ padding:0 1.1rem; font-size:1.04rem; font-weight:700; line-height:1.3; color:var(--pp-charcoal); }
.woocommerce ul.products li.product .star-rating{ margin:.4rem 1.1rem 0; font-size:.8rem; color:#f5a623; }
.woocommerce ul.products li.product .price{ padding:.35rem 1.1rem .1rem; display:block; font-size:1.1rem; font-weight:700; color:var(--pp-pine); margin-top:auto; }
.woocommerce ul.products li.product .price del{ color:#9aa39c; font-weight:500; font-size:.92rem; margin-right:.35rem; }
.woocommerce ul.products li.product .price ins{ text-decoration:none; }
/* CTA row: [cart-icon add] [Buy now] [WhatsApp] */
.woocommerce ul.products li.product .pp-loop-cta{ display:flex; gap:.45rem; align-items:stretch; margin:auto 1.1rem 0 !important; padding-top:.4rem; }
.woocommerce ul.products li.product .pp-loop-cta .button,
.woocommerce ul.products li.product .pp-loop-cta .added_to_cart{ margin:0 !important; flex:0 0 46px; width:46px; height:46px; padding:0 !important; font-size:0 !important; box-sizing:border-box !important;
display:inline-flex !important; align-items:center; justify-content:center; border-radius:10px !important; background:#fff !important; color:var(--pp-pine) !important; border:1.5px solid var(--pp-pine) !important; transition:background .2s, color .2s; }
.woocommerce ul.products li.product .pp-loop-cta .button::before{ content:""; width:20px; height:20px; background:currentColor;
-webkit-mask:url("data:image/svg+xml;utf8,") center/contain no-repeat;
mask:url("data:image/svg+xml;utf8,") center/contain no-repeat; }
.woocommerce ul.products li.product .pp-loop-cta .button:hover{ background:var(--pp-pine) !important; color:#fff !important; }
.woocommerce ul.products li.product .pp-loop-cta .added_to_cart{ display:none !important; } /* hide the post-add "View cart" link (header cart count still updates) */
.pp-loop-buy{ flex:1 1 auto; min-width:0; display:inline-flex; align-items:center; justify-content:center; height:46px; border-radius:10px; background:var(--pp-pine); color:#fff !important; font-weight:700; font-size:.92rem; white-space:nowrap; text-decoration:none; transition:background .2s, transform .15s; }
.pp-loop-buy:hover{ background:var(--pp-charcoal); }
.pp-loop-wa{ flex:0 0 46px; width:46px; height:46px; display:inline-flex; align-items:center; justify-content:center; border-radius:10px; background:#25D366; color:#fff !important; transition:background .2s; }
.pp-loop-wa:hover{ background:#1ebe5b; }
.pp-loop-wa svg{ width:20px; height:20px; }
/* =====================================================================
PRODUCT CARDS — block "Product Collection" (Shop / category archives)
===================================================================== */
.wc-block-product-template{ gap:1.5rem !important; }
li.wc-block-product{ background:#fff; border:1px solid var(--pp-mist); border-radius:18px; overflow:hidden;
padding:0 0 .4rem; position:relative; display:flex; flex-direction:column; text-align:left;
transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s; }
li.wc-block-product:hover{ transform:translateY(-8px); box-shadow:var(--pp-shadow); border-color:transparent; }
li.wc-block-product .wc-block-components-product-image{ margin:0 0 .9rem; overflow:hidden; }
li.wc-block-product .wc-block-components-product-image img{ width:100%; aspect-ratio:1/1; object-fit:cover; display:block; transition:transform .55s cubic-bezier(.2,.7,.2,1); }
li.wc-block-product:hover .wc-block-components-product-image img{ transform:scale(1.06); }
li.wc-block-product .wp-block-post-title{ text-align:left !important; padding:0 1.1rem; margin:0; font-size:1.02rem !important; font-weight:700; line-height:1.3; }
li.wc-block-product .wp-block-post-title a{ color:var(--pp-charcoal); text-decoration:none; }
li.wc-block-product .wp-block-woocommerce-product-price{ text-align:left !important; padding:.2rem 1.1rem 0; font-size:1.05rem !important; }
li.wc-block-product .wc-block-components-product-price__value.is-discounted{ color:var(--pp-pine); font-weight:700; }
li.wc-block-product .wc-block-components-product-price__regular{ color:#9aa09a; margin-right:.4rem; }
li.wc-block-product .wp-block-woocommerce-product-button{ padding:.7rem 1.1rem .3rem; margin-top:auto; }
li.wc-block-product .wc-block-components-product-button__button{ display:block; width:100%; text-align:center;
background:var(--pp-pine) !important; color:#fff !important; border-radius:10px !important; font-weight:700; padding:.72rem 1rem !important; border:none; }
li.wc-block-product .wc-block-components-product-button__button:hover{ background:var(--pp-charcoal) !important; }
.wc-block-components-product-sale-badge{ position:absolute; top:10px; right:10px; z-index:2;
background:var(--pp-sale) !important; color:#fff !important; border:none !important; border-radius:6px !important;
font-weight:700; font-size:.72rem !important; letter-spacing:.03em; padding:5px 10px !important; text-transform:uppercase; }
/* WooCommerce archive header polish */
.woocommerce-products-header__title, .wp-block-query-title, .woocommerce-products-header{ margin-bottom:.5rem; }
.woocommerce .woocommerce-result-count{ color:#8a908a; font-size:.9rem; }
.woocommerce .woocommerce-ordering select{ border:1px solid var(--pp-mist); border-radius:8px; padding:.5rem .8rem; }
/* =====================================================================
SINGLE PRODUCT — landing page
===================================================================== */
/* summary hierarchy: title calmer, price loud (block markup) */
.single-product .wp-block-post-title,
.woocommerce div.product .product_title{ font-size:clamp(1.45rem,1.15rem + 1vw,2rem) !important; line-height:1.15 !important; margin:.1rem 0 .5rem !important; letter-spacing:-.01em; font-weight:700; }
.single-product .wc-block-components-product-price,
.woocommerce div.product p.price{ margin:.2rem 0 !important; display:flex; align-items:baseline; gap:.6rem; flex-wrap:wrap; }
.single-product .wc-block-components-product-price ins .amount,
.single-product .wc-block-components-product-price > .amount,
.woocommerce div.product p.price .amount{ font-size:clamp(1.9rem,1.5rem + 1.4vw,2.4rem) !important; font-weight:800; color:var(--pp-pine); }
.single-product .wc-block-components-product-price ins,
.woocommerce div.product p.price ins{ text-decoration:none; }
.single-product .wc-block-components-product-price del .amount,
.woocommerce div.product p.price del .amount{ font-size:1.2rem !important; font-weight:600; color:#9aa09a; }
.pp-save{ color:var(--pp-sale); font-weight:700; margin:.1rem 0 .9rem; font-size:.95rem; }
.pp-save span{ font-weight:600; opacity:.85; }
/* CTA: [qty stepper] [add-to-cart icon] [Buy now] on row 1, WhatsApp on row 2 */
.woocommerce div.product form.cart{ display:flex; flex-wrap:wrap; gap:.6rem; align-items:stretch; margin:1.4rem 0 .4rem; }
/* quantity stepper */
.woocommerce div.product form.cart .quantity{ flex:0 0 auto; display:flex; align-items:stretch; height:56px; border:1px solid var(--pp-mist); border-radius:12px; overflow:hidden; background:#fff; }
.woocommerce div.product form.cart .quantity input.qty{ width:44px; height:100%; border:0 !important; background:none; text-align:center; font-weight:700; font-size:1.02rem; -moz-appearance:textfield; padding:0; color:var(--pp-charcoal); }
.woocommerce div.product form.cart .quantity input.qty::-webkit-outer-spin-button,
.woocommerce div.product form.cart .quantity input.qty::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.pp-qtybtn{ width:42px; border:0; background:#fff; color:var(--pp-charcoal); font-size:1.35rem; line-height:1; cursor:pointer; transition:background .15s, color .15s; }
.pp-qtybtn:hover{ background:var(--pp-pine); color:#fff; }
.woocommerce div.product form.cart .single_add_to_cart_button,
.woocommerce div.product .pp-buynow,
.woocommerce div.product .pp-wa-btn{ min-height:56px; display:inline-flex !important; align-items:center; justify-content:center; gap:.5rem;
border-radius:12px !important; font-weight:700; letter-spacing:.01em; line-height:1; white-space:nowrap; cursor:pointer;
transition:transform .15s cubic-bezier(.2,.7,.2,1), box-shadow .25s, background .2s, color .2s; }
/* add-to-cart = icon-only, secondary */
.woocommerce div.product form.cart .single_add_to_cart_button{ flex:0 0 56px; width:56px; padding:0 !important; font-size:0 !important; margin:0 !important; box-sizing:border-box !important;
background:#fff !important; color:var(--pp-pine) !important; border:1.5px solid var(--pp-pine) !important; }
.woocommerce div.product form.cart .single_add_to_cart_button::before{ content:""; width:24px; height:24px; background:currentColor;
-webkit-mask:url("data:image/svg+xml;utf8,") center/contain no-repeat;
mask:url("data:image/svg+xml;utf8,") center/contain no-repeat; }
.woocommerce div.product form.cart .single_add_to_cart_button:hover{ background:var(--pp-pine) !important; color:#fff !important; transform:translateY(-2px); }
/* buy now = primary */
.woocommerce div.product .pp-buynow{ flex:1 1 auto; padding:0 1.4rem !important; font-size:1.06rem; background:var(--pp-pine); color:#fff; border:none;
box-shadow:0 12px 26px -12px rgba(20,60,35,.6); }
.woocommerce div.product .pp-buynow .pp-ic{ width:18px; height:18px; }
.woocommerce div.product .pp-buynow:hover{ background:var(--pp-charcoal); transform:translateY(-2px); }
/* whatsapp = full width, row 2 */
.woocommerce div.product .pp-wa-btn{ flex:1 1 100%; padding:0 1.4rem; font-size:1.04rem; background:#25D366; color:#fff !important; text-decoration:none; }
.woocommerce div.product .pp-wa-btn:hover{ background:#1ebe5b; transform:translateY(-2px); }
.woocommerce div.product .pp-wa-btn .pp-ic{ width:20px; height:20px; }
/* consolidated assurance card (delivery + COD + returns + secure) */
.pp-assure{ background:#eef4ef; border:1px solid #dce7de; border-radius:14px; padding:.85rem 1.05rem; margin:1rem 0 .2rem; }
.pp-assure__ship{ display:flex; align-items:center; gap:.6rem; color:var(--pp-charcoal); }
.pp-assure__ship .pp-ic{ width:24px; height:24px; color:var(--pp-pine); flex:none; }
.pp-assure__ship b{ font-weight:700; font-size:.95rem; white-space:nowrap; }
.pp-assure__pts{ display:flex; flex-wrap:wrap; gap:.4rem 1.1rem; margin-top:.7rem; padding-top:.7rem; border-top:1px solid #dce7de; }
.pp-assure__pts span{ display:inline-flex; align-items:center; gap:.35rem; font-size:.82rem; font-weight:600; color:#4a504a; }
.pp-assure__pts .pp-ic{ width:17px; height:17px; color:var(--pp-pine); flex:none; }
/* gallery ↔ summary gap + gallery arrows */
@media (min-width:769px){ .woocommerce div.product .entry-summary,
.woocommerce div.product .summary{ padding-left:clamp(24px,3vw,42px); } }
.woocommerce div.product .flex-direction-nav{ margin:0; padding:0; list-style:none; }
.woocommerce div.product .flex-direction-nav li{ margin:0; padding:0; list-style:none; }
/* arrows: the same circle + chevron as the homepage hero, on the light panel */
.woocommerce div.product .flex-direction-nav a{ position:absolute; top:calc(50% - 46px); transform:translateY(-50%);
width:46px; height:46px; border-radius:50%; background:#fff; border:1.5px solid rgba(32,38,31,.25); box-sizing:border-box;
display:flex; align-items:center; justify-content:center; font-size:0; line-height:0; color:var(--pp-charcoal); text-indent:0; text-shadow:none; overflow:hidden; opacity:1; z-index:5;
box-shadow:0 10px 24px -14px rgba(12,19,14,.35); transition:background .2s, border-color .2s, transform .2s, color .2s; }
.woocommerce div.product .flex-direction-nav a::before, .woocommerce div.product .flex-direction-nav a::after{ content:none !important; }
.woocommerce div.product .flex-direction-nav a svg{ width:20px; height:20px; display:block; }
.woocommerce div.product .flex-direction-nav a.flex-next svg{ transform:scaleX(-1); }
.woocommerce div.product .flex-direction-nav a:hover{ background:var(--pp-pine); border-color:var(--pp-pine); color:#fff; transform:translateY(-50%) scale(1.06); }
.woocommerce div.product .flex-direction-nav a.flex-prev{ left:14px; }
.woocommerce div.product .flex-direction-nav a.flex-next{ right:14px; }
.woocommerce div.product .flex-direction-nav a.flex-disabled{ opacity:0; pointer-events:none; }
.woocommerce div.product .woocommerce-product-gallery:has(.woocommerce-product-gallery__image:only-child) .flex-direction-nav{ display:none; }
/* ---- premium hero: gallery panel + refined thumbnails ---- */
.woocommerce div.product{ padding-top:.5rem; }
/* 50 / 50 gallery & summary — the block template puts them in wp-block-columns
with a hardcoded flex-basis on the gallery column; force both columns equal. */
@media (min-width:782px){
.wp-block-columns:has(.wp-block-woocommerce-product-image-gallery){ align-items:flex-start; gap:clamp(28px,4vw,56px) !important; }
.wp-block-columns:has(.wp-block-woocommerce-product-image-gallery) > .wp-block-column{ flex:1 1 0 !important; flex-basis:0 !important; min-width:0; }
}
/* summary order at every width: title, then tagline, then price, rating, save, CTA */
.single-product .wp-block-column:has(> .wp-block-post-title){ display:flex; flex-direction:column; }
.single-product .wp-block-column:has(> .wp-block-post-title) > .wp-block-post-title{ order:-2; }
.single-product .wp-block-column:has(> .wp-block-post-title) > .wp-block-post-excerpt{ order:-1; }
/* tagline styling */
.single-product .wp-block-post-excerpt{ margin:.15rem 0 .5rem !important; }
.single-product .wp-block-post-excerpt__excerpt{ font-size:.98rem; color:#5a635b; line-height:1.5; margin:0; }
/* gallery panel: light card, big image with a slim inset, thumbnails below.
Background + border + radius sit on the slider's fixed viewport; the inset is padding on
each slide (border-box) so nothing from the neighbouring slide or the strip edge can peek in. */
.woocommerce div.product .woocommerce-product-gallery{ position:relative; }
.woocommerce div.product .woocommerce-product-gallery .flex-viewport{ background:#fafbfa; border:1px solid var(--pp-mist); border-radius:24px; overflow:hidden; }
.woocommerce div.product .woocommerce-product-gallery__wrapper{ background:none; border:0; border-radius:0; padding:0; margin:0; }
.woocommerce div.product .woocommerce-product-gallery{ height:auto !important; }
.woocommerce div.product .woocommerce-product-gallery__image{ padding:clamp(.9rem,1.8vw,1.4rem); box-sizing:border-box; width:100%; aspect-ratio:1/1; display:flex !important; align-items:center; justify-content:center; }
.woocommerce div.product .woocommerce-product-gallery__image > a{ display:flex !important; align-items:center; justify-content:center; width:100%; height:100%; }
.woocommerce div.product .woocommerce-product-gallery__image img{ width:auto !important; height:auto !important; max-width:100%; max-height:100%; object-fit:contain; margin:0 auto; }
/* fade mode: flexslider overlaps the slides (float + negative margin) and fades the active one in */
.woocommerce div.product .woocommerce-product-gallery__wrapper{ transform:none !important; width:100% !important; }
/* no JS yet (or slider disabled): give the bare wrapper the same panel so nothing flashes unstyled */
.woocommerce div.product .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper{ background:#fafbfa; border:1px solid var(--pp-mist); border-radius:24px; overflow:hidden; }
.woocommerce div.product .woocommerce-product-gallery__image > a{ display:block; }
.woocommerce div.product .woocommerce-product-gallery__image img{ border-radius:10px; }
/* remove the leftover lightbox magnifier trigger */
.woocommerce div.product .woocommerce-product-gallery__trigger{ display:none !important; }
.woocommerce div.product .flex-control-thumbs{ display:flex !important; flex-wrap:wrap; gap:12px; margin:16px 0 0 !important; padding:0; list-style:none; }
.woocommerce div.product .flex-control-thumbs li{ width:auto !important; margin:0 !important; float:none !important; }
.woocommerce div.product .flex-control-thumbs li:only-child{ display:none !important; }
.woocommerce div.product .flex-control-thumbs img{ width:74px; height:74px; object-fit:cover; border-radius:14px; border:2px solid var(--pp-mist);
background:#fff; cursor:pointer; opacity:.8; transition:opacity .2s, border-color .2s, transform .2s; }
.woocommerce div.product .flex-control-thumbs img:hover{ opacity:1; transform:translateY(-2px); }
.woocommerce div.product .flex-control-thumbs img.flex-active{ opacity:1; border-color:var(--pp-pine); }
.woocommerce div.product .woocommerce-product-gallery span.onsale{ position:absolute; top:16px; left:16px; z-index:3; margin:0; border-radius:8px; padding:6px 12px; }
/* ---- premium summary rhythm ---- */
.single-product .wp-block-post-title{ margin-bottom:.4rem !important; letter-spacing:-.01em; }
.woocommerce div.product .woocommerce-product-details__short-description{ margin:.2rem 0 0; }
.woocommerce div.product .woocommerce-product-details__short-description > p{ color:#5a635b; font-size:1.02rem; line-height:1.55; margin:0; }
/* key highlights list */
.pp-highlights{ list-style:none; margin:1.1rem 0 0; padding:0; display:grid; gap:.6rem; }
.pp-highlights li{ position:relative; padding-left:1.85rem; font-size:.96rem; line-height:1.4; color:var(--pp-charcoal); }
.pp-highlights li::before{ content:""; position:absolute; left:0; top:1px; width:1.2rem; height:1.2rem; border-radius:50%;
background:var(--pp-pine); -webkit-mask:url("data:image/svg+xml;utf8,") center/62% no-repeat;
mask:url("data:image/svg+xml;utf8,") center/62% no-repeat; }
/* CTA divider + rhythm */
.woocommerce div.product form.cart{ margin-top:1.6rem !important; padding-top:1.6rem; border-top:1px solid var(--pp-mist); }
/* category as a subtle chip */
.woocommerce div.product .product_meta{ margin-top:1.4rem; font-size:.82rem; color:#8a908a; }
.woocommerce div.product .product_meta > span{ display:inline-flex; align-items:center; gap:.4rem; }
.woocommerce div.product .product_meta a{ display:inline-block; color:var(--pp-pine); font-weight:600; text-decoration:none;
background:var(--pp-mist); padding:.28rem .7rem; border-radius:999px; margin:0 .2rem; }
.woocommerce div.product .product_meta a:hover{ background:var(--pp-pine); color:#fff; }
.woocommerce div.product .product_meta .posted_in{ color:#8a908a; }
/* floating buy-box */
.pp-stickybuy{ position:fixed; z-index:70; right:22px; bottom:22px; width:min(480px,94vw); background:#fff; border:1px solid var(--pp-mist);
border-radius:16px; box-shadow:0 20px 55px -14px rgba(12,19,14,.45); padding:12px 14px; display:flex; gap:12px; align-items:center;
transform:translateY(160%); opacity:0; transition:transform .5s cubic-bezier(.2,.8,.2,1), opacity .35s; pointer-events:none; }
.pp-stickybuy.pp-visible{ transform:none; opacity:1; pointer-events:auto; }
.pp-stickybuy__info{ display:flex; gap:10px; align-items:center; min-width:0; }
.pp-stickybuy__info img{ width:50px; height:50px; object-fit:cover; border-radius:10px; flex:none; }
.pp-stickybuy__info b{ display:block; font-size:.85rem; font-weight:700; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:120px; }
.pp-stickybuy__info span .amount{ font-size:.95rem; color:var(--pp-pine); font-weight:800; }
.pp-stickybuy__info del{ display:none; }
.pp-stickybuy__cta{ display:flex; gap:8px; margin-left:auto; align-items:stretch; flex:none; }
.pp-sb-btn{ display:inline-flex; align-items:center; justify-content:center; height:46px; border-radius:11px; font-weight:700; text-decoration:none; cursor:pointer; white-space:nowrap; }
.pp-sb-cart{ width:46px; background:#eef2ee; color:var(--pp-pine); }
.pp-sb-cart:hover{ background:#e2e9e2; }
.pp-sb-wa{ width:46px; background:#25D366; color:#fff; }
.pp-sb-wa:hover{ background:#1ebe5b; }
.pp-sb-buy{ padding:0 1.2rem; background:var(--pp-pine); color:#fff; }
.pp-sb-buy:hover{ background:var(--pp-charcoal); }
.pp-sb-btn .pp-ic{ width:20px; height:20px; }
@media (max-width:640px){
.pp-stickybuy{ right:0; left:0; bottom:0; width:auto; border-radius:14px 14px 0 0; padding:10px 12px; }
.pp-stickybuy__info b{ max-width:90px; }
.pp-sb-buy{ padding:0 .9rem; }
.pp-buynow, .pp-wa-btn{ flex:1 1 100%; }
.woocommerce div.product form.cart .single_add_to_cart_button{ flex:1 1 auto; width:auto; font-size:1rem !important; gap:.5rem; padding:0 1rem !important; }
}
/* benefit strip: professional icons */
.pp-benefit .ic .pp-ic{ width:30px; height:30px; color:#fff; }
/* full-bleed landing below the summary */
.pp-pdp{ width:100vw; margin-left:calc(50% - 50vw); margin-top:clamp(2.5rem,5vw,4rem); }
.pp-pdp .pp-container{ max-width:1160px; margin-inline:auto; padding-inline:clamp(1rem,5vw,2rem); }
.pp-pdp .pp-sec{ padding-block:clamp(2.5rem,5vw,4rem); }
/* benefit strip */
.pp-benefits{ background:var(--pp-pine); color:#fff; width:100vw; margin-left:calc(50% - 50vw); }
.pp-benefits__grid{ max-width:1160px; margin-inline:auto; padding:2.2rem clamp(1rem,5vw,2rem); display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; }
.pp-benefit{ text-align:center; }
.pp-benefit .ic{ font-size:1.9rem; line-height:1; }
.pp-benefit b{ display:block; margin-top:.5rem; font-size:1.02rem; }
.pp-benefit span{ display:block; color:var(--pp-mist); font-size:.85rem; margin-top:.15rem; }
/* alternating feature rows */
.pp-frow{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.5rem,4vw,3.5rem); align-items:center; }
.pp-frow + .pp-frow{ margin-top:clamp(2rem,4vw,3.5rem); }
.pp-frow__media img{ width:100%; height:auto; border-radius:20px; display:block; box-shadow:var(--pp-shadow-sm); }
.pp-frow__text .pp-eyebrow{ color:var(--pp-pine); }
.pp-frow__text h3{ font-size:clamp(1.5rem,1.2rem + 1.2vw,2.1rem); margin:.4rem 0 .7rem; line-height:1.15; }
.pp-frow__text p{ color:#4a504a; font-size:1.05rem; line-height:1.65; }
.pp-frow--rev .pp-frow__media{ order:2; }
/* how it works */
.pp-steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:1rem; }
.pp-step{ text-align:center; padding:1.5rem 1rem; border:1px solid var(--pp-mist); border-radius:16px; background:#fff; }
.pp-step__n{ width:46px; height:46px; border-radius:50%; background:var(--pp-pine); color:#fff; display:grid; place-items:center; font-weight:700; margin:0 auto .9rem; font-size:1.1rem; }
.pp-step h4{ font-size:1.1rem; margin:0 0 .3rem; }
.pp-step p{ color:#6a706a; font-size:.95rem; margin:0; }
/* what's in the box + specs share the frow/grid */
.pp-box__list{ list-style:none; margin:1rem 0 0; padding:0; }
.pp-box__list li{ padding:.55rem 0; border-bottom:1px dashed var(--pp-mist); font-weight:600; }
.pp-box__list li::before{ content:"✓ "; color:var(--pp-pine); font-weight:700; }
.pp-specs{ width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--pp-mist); border-radius:14px; overflow:hidden; }
.pp-specs td{ padding:.85rem 1.2rem; border-bottom:1px solid var(--pp-mist); font-size:.98rem; }
.pp-specs tr:last-child td{ border-bottom:none; }
.pp-specs td:first-child{ color:#6a706a; width:42%; }
.pp-specs td:last-child{ font-weight:600; }
/* spec grid (distinct card style, not a table) */
.pp-specgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.pp-specitem{ display:flex; gap:.9rem; align-items:flex-start; padding:1.1rem 1.2rem; background:#fff; border:1px solid var(--pp-mist); border-radius:14px; }
.pp-specitem .pp-ic{ width:26px; height:26px; color:var(--pp-pine); flex:none; margin-top:2px; }
.pp-specitem span{ display:block; color:#8a908a; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; }
.pp-specitem b{ display:block; font-size:1rem; color:var(--pp-charcoal); margin-top:2px; }
@media (max-width:640px){ .pp-specgrid{ grid-template-columns:1fr 1fr; } }
/* comparison */
.pp-compare{ width:100%; border-collapse:separate; border-spacing:0; }
.pp-compare th, .pp-compare td{ padding:.9rem 1rem; text-align:center; border-bottom:1px solid var(--pp-mist); }
.pp-compare th:first-child, .pp-compare td:first-child{ text-align:left; color:#4a504a; }
.pp-compare thead th{ font-size:.95rem; }
.pp-compare thead th.pp-compare__us{ background:var(--pp-pine); color:#fff; border-radius:10px 10px 0 0; }
.pp-compare td.pp-compare__us{ background:#f2f7f3; font-weight:700; color:var(--pp-pine); }
.pp-compare .yes{ color:var(--pp-pine); font-weight:700; } .pp-compare .no{ color:#c0605f; }
/* faq */
.pp-faq details{ border:1px solid var(--pp-mist); border-radius:12px; padding:.9rem 1.2rem; margin-bottom:.8rem; background:#fff; }
.pp-faq summary{ font-weight:700; cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; }
.pp-faq summary::after{ content:"+"; font-size:1.4rem; color:var(--pp-pine); }
.pp-faq details[open] summary::after{ content:"–"; }
.pp-faq details p{ margin:.7rem 0 0; color:#4a504a; }
@media (max-width:820px){
.pp-benefits__grid{ grid-template-columns:1fr 1fr; gap:1.2rem; }
.pp-frow{ grid-template-columns:1fr; }
.pp-frow--rev .pp-frow__media{ order:0; }
.pp-steps{ grid-template-columns:1fr; }
}
/* =====================================================================
WHY PAKPICK
===================================================================== */
.pp-why{ background:#f6f8f6; }
.pp-why__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
.pp-feature{ background:#fff; border:1px solid var(--pp-mist); border-radius:20px; padding:2rem 1.8rem; transition:transform .3s, box-shadow .3s; }
.pp-feature:hover{ transform:translateY(-6px); box-shadow:var(--pp-shadow-sm); }
.pp-feature__ic{ width:54px; height:54px; border-radius:14px; display:grid; place-items:center; font-size:1.5rem;
background:linear-gradient(150deg,var(--pp-accent),var(--pp-accent-2)); color:#fff; margin-bottom:1.1rem; box-shadow:0 10px 24px -10px var(--pp-accent-2); }
.pp-feature__ic .pp-ic{ width:28px; height:28px; }
.pp-feature h3{ font-size:1.2rem; margin:0 0 .4rem; }
.pp-feature p{ color:#5f6b62; margin:0; font-size:.98rem; line-height:1.6; }
/* stats band */
.pp-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:2.5rem; }
.pp-stat{ text-align:center; padding:1.2rem .5rem; border-radius:16px; background:#fff; border:1px solid var(--pp-mist); }
.pp-stat b{ display:block; font-size:clamp(1.6rem,1.2rem + 1.4vw,2.4rem); color:var(--pp-pine); letter-spacing:-.02em; }
.pp-stat span{ color:#7c877f; font-size:.85rem; font-weight:600; }
/* =====================================================================
FINAL CTA
===================================================================== */
.pp-cta{ position:relative; overflow:hidden; border-radius:28px; text-align:center; color:#fff;
padding:clamp(3rem,6vw,5.5rem) clamp(1.5rem,5vw,3rem);
background:radial-gradient(70% 120% at 100% 0%, rgba(47,217,138,.35), transparent 60%), linear-gradient(135deg,var(--pp-pine),var(--pp-accent-2)); box-shadow:var(--pp-shadow); }
.pp-cta::before{ content:""; position:absolute; width:300px; height:300px; border-radius:50%; background:rgba(255,255,255,.08); bottom:-140px; left:-80px; }
.pp-cta h2{ position:relative; font-size:clamp(2rem,1.5rem + 2.6vw,3.4rem); line-height:1.05; letter-spacing:-.02em; margin:0 0 .8rem; color:#fff; }
.pp-cta p{ position:relative; color:#d6efe1; font-size:1.15rem; margin:0 auto 1.8rem; max-width:44ch; }
.pp-cta .pp-btn--solid{ position:relative; }
/* spacing helpers */
.pp-sec{ padding-block:clamp(3rem,6vw,5rem); }
/* =====================================================================
STICKY HEADER
===================================================================== */
header.wp-block-group{ position:sticky; top:0; z-index:50; transition:box-shadow .3s, background .3s; }
header.wp-block-group.pp-stuck{ box-shadow:0 6px 24px -14px rgba(12,19,14,.4); backdrop-filter:blur(10px); background:rgba(255,255,255,.86)!important; }
/* =====================================================================
ANNOUNCEMENT BAR
===================================================================== */
.pp-annc{ position:relative; background:var(--pp-charcoal); color:#fff; display:flex; align-items:center; justify-content:center; min-height:40px; padding:8px 20px; overflow:hidden; }
.pp-annc__viewport{ position:relative; width:100%; height:1.25em; }
.pp-annc__msg{ position:absolute; left:50%; top:50%; transform:translate(-50%,-30%); opacity:0; white-space:nowrap; font-size:.82rem; letter-spacing:.01em; transition:opacity .5s ease, transform .5s ease; pointer-events:none; display:flex; align-items:center; gap:.5rem; }
.pp-annc__ic{ width:16px; height:16px; color:var(--pp-accent); flex:none; }
.pp-annc__msg.is-on{ opacity:.95; transform:translate(-50%,-50%); }
.pp-annc__x{ position:absolute; right:12px; top:50%; transform:translateY(-50%); background:none; border:0; color:rgba(255,255,255,.65); font-size:1.25rem; line-height:1; cursor:pointer; padding:4px 8px; }
.pp-annc__x:hover{ color:#fff; }
.pp-annc--hidden{ display:none !important; }
/* =====================================================================
HEADER ACTIONS (search / whatsapp / cart) + SEARCH BAR
===================================================================== */
/* keep the primary nav on one line */
header .wp-block-navigation__container.wp-block-navigation{ flex-wrap:nowrap; }
header .wp-block-navigation:not(.is-responsive) .wp-block-navigation__container{ flex-wrap:nowrap; gap:.35rem 1.6rem; }
header .wp-block-navigation-item__label{ white-space:nowrap; }
/* branded nav hover — sliding pine underline + colour lift (no default underline) */
header .wp-block-navigation-item__content{ position:relative; text-decoration:none !important; padding-bottom:5px; font-weight:500; transition:color .2s ease; }
header .wp-block-navigation-item__content::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2px; border-radius:2px;
background:linear-gradient(90deg,var(--pp-pine),var(--pp-accent)); transform:scaleX(0); transform-origin:left center; transition:transform .32s cubic-bezier(.2,.7,.2,1); }
header .wp-block-navigation-item__content:hover{ color:var(--pp-pine) !important; }
header .wp-block-navigation-item__content:hover::after{ transform:scaleX(1); }
header .wp-block-navigation-item.current-menu-item .wp-block-navigation-item__content::after{ transform:scaleX(1); }
.pp-hdr-actions{ align-items:center; gap:.25rem !important; flex:none; }
.pp-hdr-actions p{ margin:0 !important; }
.pp-hdr-ic{ display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; border-radius:50%; color:var(--pp-charcoal); background:transparent; border:0; cursor:pointer; transition:background .2s, color .2s; text-decoration:none; }
.pp-hdr-ic:hover{ background:var(--pp-mist); }
.pp-hdr-ic .pp-ic{ width:21px; height:21px; }
.pp-hdr-wa:hover{ background:#25D366; color:#fff; }
/* mini-cart button → match icon buttons */
.pp-hdr-actions .wc-block-mini-cart__button{ display:inline-flex; align-items:center; justify-content:center; min-width:42px; height:42px; border-radius:50%; padding:0 !important; color:var(--pp-charcoal); background:transparent; transition:background .2s; }
.pp-hdr-actions .wc-block-mini-cart__button:hover{ background:var(--pp-mist); }
.pp-hdr-actions .wc-block-mini-cart__amount{ display:none; }
.pp-hdr-actions .wc-block-mini-cart__badge{ background:var(--pp-pine) !important; color:#fff !important; font-weight:700; }
.pp-hdr-actions .wc-block-mini-cart__quantity-badge{ color:var(--pp-charcoal); }
.pp-searchbar{ margin-top:.85rem; padding-top:1rem; border-top:1px solid var(--pp-mist); }
.pp-searchbar[hidden]{ display:none; }
.pp-searchbar__form{ display:flex; align-items:center; gap:.6rem; max-width:640px; margin:0 auto; background:var(--pp-mist); border-radius:999px; padding:.5rem .5rem .5rem 1rem; }
.pp-searchbar__form .pp-ic{ width:20px; height:20px; color:#8a908a; flex:none; }
.pp-searchbar__form input[type=search]{ flex:1; border:0; background:none; font-size:1rem; outline:none; color:var(--pp-charcoal); min-width:0; }
.pp-searchbar__go{ border:0; background:var(--pp-pine); color:#fff; border-radius:999px; padding:.55rem 1.2rem; font-weight:600; cursor:pointer; white-space:nowrap; }
/* =====================================================================
FOOTER trust strip + WhatsApp CTA
===================================================================== */
/* footer logo on a white chip (uses the main header logo) */
.wp-block-column .pp-logo-img{ display:inline-block; height:36px; width:auto; background:#fff; padding:7px 11px; border-radius:8px; box-shadow:0 8px 20px -12px rgba(0,0,0,.5); }
footer p:has(> .pp-logo-img){ margin:0 0 1.1rem; }
/* delivery partner + payment methods — sits under the link columns (right region) */
.pp-foot-partners{ display:grid; grid-template-columns:auto 1fr; align-items:start; gap:1.5rem 2.5rem; margin-top:2rem; padding-top:1.75rem; border-top:1px solid rgba(255,255,255,.12); }
.pp-foot-pcol{ display:flex; flex-direction:column; gap:.6rem; }
.pp-foot-plabel{ margin:0; }
.pp-foot-pcol:last-child{ border-left:1px solid rgba(255,255,255,.12); padding-left:2rem; }
.pp-foot-plabel{ font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:#9aa79d; }
.pp-foot-pitems{ display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; }
.pp-foot-pitems--single{ }
.pp-partner{ display:inline-flex; align-items:center; gap:.6rem; background:#fff; border-radius:10px; padding:.6rem 1.1rem; box-shadow:0 2px 6px rgba(0,0,0,.18); }
.pp-partner__mark{ display:inline-flex; }
.pp-partner__mark .pp-ic{ width:26px; height:26px; color:#E4002B; }
.pp-partner__name b{ display:block; font-size:1rem; font-weight:800; color:#E4002B; line-height:1; }
.pp-partner__name em{ font-style:normal; font-size:.7rem; color:#6b726c; letter-spacing:.02em; }
/* footer brand column — consistent vertical rhythm */
.pp-foot-brand{ display:flex; flex-direction:column; align-items:flex-start; }
.pp-foot-brand > *{ margin-top:0 !important; margin-bottom:0 !important; }
.pp-foot-logo{ width:160px; height:auto; display:block; }
.pp-foot-brand .pp-foot-logo{ margin-bottom:0.7rem !important; }
.pp-foot-brand > p{ margin-bottom:1.2rem !important; max-width:34ch; }
.pp-foot-brand .pp-wa-cta{ margin:0 0 1.4rem !important; }
.pp-foot-brand .pp-foot-contact{ margin-bottom:1.4rem !important; }
.pp-foot-brand h3{ margin-bottom:.7rem !important; }
.pp-foot-brand .pakpick-socials{ margin-bottom:0 !important; }
/* footer contact lines */
.pp-foot-contact{ list-style:none; margin:.9rem 0 1.1rem; padding:0; display:grid; gap:.55rem; }
.pp-foot-contact li{ display:flex; align-items:center; gap:.55rem; margin:0; }
.pp-foot-contact .pp-ic{ width:18px; height:18px; color:var(--pp-accent); flex:none; }
.pp-foot-contact a{ color:#dfe4df; text-decoration:none; font-size:.92rem; }
.pp-foot-contact a:hover{ color:#fff; }
/* social icons */
.pakpick-socials{ display:flex; gap:.55rem; list-style:none; margin:.4rem 0 0; padding:0; }
.pakpick-socials li{ margin:0; }
.pakpick-socials a{ display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:50%;
background:rgba(255,255,255,.08); color:#fff; transition:background .2s, transform .2s, color .2s; }
.pakpick-socials a:hover{ background:var(--pp-accent); color:var(--pp-charcoal); transform:translateY(-2px); }
.pakpick-socials svg{ width:19px; height:19px; }
/* payment chips */
.pp-pays{ display:flex; flex-wrap:nowrap; gap:.4rem; align-items:center; justify-content:flex-start; }
.pp-pay{ display:inline-flex; align-items:center; justify-content:center; height:40px; min-width:48px; padding:0 9px; background:#fff; border-radius:8px; box-shadow:0 1px 3px rgba(0,0,0,.15); flex:0 0 auto; }
.pp-pay svg{ height:17px; width:auto; }
.pp-pay__visa{ font-family:Arial,Helvetica,sans-serif; font-weight:800; font-style:italic; font-size:.98rem; color:#1A1F71; letter-spacing:.01em; }
.pp-pay__jazz{ font-size:.74rem; font-weight:800; color:#C4161C; }
.pp-pay__easy{ font-size:.74rem; font-weight:800; color:#00A651; }
.pp-paylogo{ height:23px; width:auto; display:block; }
.pp-partner--img{ background:#fff; border-radius:8px; height:40px; padding:0 11px; box-shadow:0 1px 3px rgba(0,0,0,.15); display:inline-flex; align-items:center; }
.pp-partner--img .pp-paylogo{ height:23px; }
.pp-pay--cod{ min-width:auto; gap:.35rem; padding:0 11px; }
.pp-pay--cod .pp-ic{ width:16px; height:16px; color:var(--pp-pine); }
.pp-pay--cod b{ font-size:.74rem; font-weight:800; color:#0f3323; }
.pp-glorix{ color:#fff; font-weight:600; text-decoration:none; border-bottom:1px solid rgba(255,255,255,.35); }
.pp-glorix:hover{ color:var(--pp-accent); border-color:var(--pp-accent); }
/* =====================================================================
SECONDARY PAGE HERO + PROMO BANNER
===================================================================== */
.pp-pagehero{ background:linear-gradient(150deg,var(--pp-pine) 0%, #0c2c1c 100%); color:#fff; padding-top:clamp(2.6rem,6vw,4.4rem); padding-bottom:clamp(2.6rem,6vw,4.4rem); padding-left:var(--wp--style--root--padding-left,1.5rem); padding-right:var(--wp--style--root--padding-right,1.5rem); text-align:left; position:relative; overflow:hidden; margin:0 !important; }
/* constrain hero content to the site width (1200px), centred — aligns with the header on wide screens */
.pp-pagehero > *{ max-width:1200px !important; margin-left:auto !important; margin-right:auto !important; width:100%; box-sizing:border-box; }
.pp-pagehero .pp-pagehero__title,.pp-pagehero h1{ text-align:left !important; }
.pp-pagehero .pp-crumbs{ text-align:left; }
.pp-pagehero::before{ content:""; position:absolute; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle,rgba(47,217,138,.16),transparent 70%); top:-170px; right:-120px; pointer-events:none; }
.pp-pagehero::after{ content:""; position:absolute; width:320px; height:320px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.05),transparent 70%); bottom:-160px; left:-110px; pointer-events:none; }
.pp-pagehero .pp-pagehero__title,.pp-pagehero h1{ color:#fff !important; font-size:clamp(2rem,4vw,2.9rem) !important; line-height:1.1 !important; margin:.5rem auto 0 !important; position:relative; z-index:1; }
.pp-crumbs{ position:relative; z-index:1; font-size:.85rem; }
.pp-crumbs__in{ display:inline-flex; gap:.5rem; align-items:center; color:rgba(255,255,255,.7); }
.pp-crumbs a{ color:rgba(255,255,255,.85); text-decoration:none; }
.pp-crumbs a:hover{ color:#fff; }
.pp-crumbs span{ opacity:.5; }
.pp-pagebody{ font-size:1.02rem; line-height:1.7; color:#3a423b; }
/* keep the ~820px reading width but left-align it to the site content edge (under the logo/hero title) */
.pp-pagebody .wp-block-post-content{ max-width:820px !important; margin-left:0 !important; margin-right:auto !important; }
.pp-pagebody .wp-block-post-content > *{ margin-left:0 !important; margin-right:0 !important; max-width:100% !important; }
.pp-pagebody h2{ font-size:1.5rem; margin:2rem 0 .8rem; color:var(--pp-charcoal); }
.pp-pagebody h3{ font-size:1.2rem; margin:1.5rem 0 .5rem; color:var(--pp-charcoal); }
.pp-pagebody p{ margin:0 0 1rem; }
.pp-pagebody ul,.pp-pagebody ol{ margin:0 0 1.1rem 1.2rem; }
.pp-pagebody li{ margin:.35rem 0; }
.pp-pagebody a{ color:var(--pp-pine); }
/* hide WooCommerce default archive title + breadcrumb (our hero replaces them) */
.woocommerce-products-header{ display:none !important; }
.woocommerce .woocommerce-breadcrumb{ display:none !important; }
/* result count + ordering row spacing */
.woocommerce .woocommerce-result-count{ color:#6b726c; font-size:.9rem; margin-bottom:1.5rem; }
.woocommerce .woocommerce-ordering{ margin-bottom:1.5rem; }
.woocommerce .woocommerce-ordering select{ border:1px solid var(--pp-mist); border-radius:10px; padding:.5rem .8rem; background:#fff; }
.pp-banner{ background:linear-gradient(120deg,#0c2c1c,var(--pp-pine)); color:#fff; margin:0 !important; }
/* no gap between the last section and the footer (kills WP blockGap margin above footer) */
.wp-site-blocks > footer,
.wp-site-blocks > footer.wp-block-template-part,
footer.wp-block-template-part{ margin-top:0 !important; margin-block-start:0 !important; }
/* shop/archive: banner sits flush on the footer (no trailing gap) */
.post-type-archive-product main.wp-block-group,
.tax-product_cat main.wp-block-group{ padding-bottom:0 !important; margin-bottom:0 !important; }
.post-type-archive-product main.wp-block-group > *:last-child,
.tax-product_cat main.wp-block-group > *:last-child{ margin-bottom:0 !important; }
.pp-banner__in{ max-width:1200px; margin:0 auto; padding:clamp(2rem,4vw,3rem) clamp(1rem,5vw,2rem); display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; }
.pp-banner__text h2{ color:#fff; font-size:clamp(1.5rem,3vw,2rem); margin:.3rem 0 .4rem; }
.pp-banner__text p{ color:rgba(255,255,255,.85); margin:0; max-width:560px; }
.pp-banner .pp-eyebrow{ color:var(--pp-accent); }
.pp-btn--light{ background:#fff; color:var(--pp-pine); font-weight:700; padding:.85rem 1.6rem; border-radius:999px; text-decoration:none; white-space:nowrap; transition:transform .2s, box-shadow .2s; }
.pp-btn--light:hover{ transform:translateY(-2px); box-shadow:0 14px 30px -14px rgba(0,0,0,.5); }
/* =====================================================================
CONTACT PAGE + CF7 FORM
===================================================================== */
.pp-contact{ display:grid; grid-template-columns:1fr 1.1fr; gap:2.5rem; align-items:start; text-align:left; }
.pp-contact__info h2,.pp-contact__form h2{ font-size:1.5rem; margin:.3rem 0 .6rem; }
.pp-contact__info > p{ color:#5a635b; line-height:1.6; }
.pp-contact__list{ list-style:none; margin:1.3rem 0; padding:0; display:grid; gap:1rem; }
.pp-contact__list li{ display:flex; gap:.8rem; align-items:flex-start; margin:0; }
.pp-contact__list .pp-ic{ width:22px; height:22px; color:var(--pp-pine); flex:none; margin-top:3px; }
.pp-contact__list b{ display:block; font-size:.95rem; color:var(--pp-charcoal); }
.pp-contact__list a,.pp-contact__list span{ color:#5a635b; text-decoration:none; }
.pp-contact__list a:hover{ color:var(--pp-pine); }
.pp-contact__form{ background:#f6f8f6; border:1px solid var(--pp-mist); border-radius:18px; padding:1.6rem; }
.pp-form__row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.pp-form p{ margin:0 0 1rem; }
.pp-form label{ font-weight:600; font-size:.9rem; display:block; color:var(--pp-charcoal); }
.pp-form input[type=text],.pp-form input[type=tel],.pp-form input[type=email],.pp-form textarea{ width:100%; border:1px solid var(--pp-mist); border-radius:10px; padding:.7rem .85rem; font-family:inherit; font-size:1rem; background:#fff; margin-top:.35rem; box-sizing:border-box; }
.pp-form textarea{ min-height:130px; resize:vertical; }
.pp-form input:focus,.pp-form textarea:focus{ outline:none; border-color:var(--pp-pine); box-shadow:0 0 0 3px rgba(2,65,29,.12); }
.pp-form .wpcf7-submit{ background:var(--pp-pine); color:#fff; border:0; border-radius:999px; padding:.8rem 1.9rem; font-weight:700; cursor:pointer; font-size:1rem; transition:background .2s, transform .15s; }
.pp-form .wpcf7-submit:hover{ background:var(--pp-charcoal); transform:translateY(-2px); }
.wpcf7-response-output{ border-radius:10px; margin:.6rem 0 0 !important; font-size:.9rem; }
@media(max-width:800px){ .pp-contact{ grid-template-columns:1fr; } .pp-form__row{ grid-template-columns:1fr; } }
/* =====================================================================
BUNDLE SAVING NOTE (PDP)
===================================================================== */
.pp-bundle{ display:flex; align-items:center; gap:.6rem; margin:.9rem 0 .2rem; padding:.7rem .9rem; background:linear-gradient(120deg,#eef7f0,#e4f2ea); border:1px dashed var(--pp-pine); border-radius:12px; font-size:.92rem; line-height:1.4; color:var(--pp-charcoal); }
.pp-bundle .pp-ic{ width:22px; height:22px; color:var(--pp-pine); flex:none; }
.pp-bundle b{ color:var(--pp-pine); }
/* =====================================================================
MY ACCOUNT (sign in / dashboard)
===================================================================== */
/* account content spans the site width (1200px) and is centred like every other page */
.woocommerce-account .pp-pagebody .wp-block-post-content{ max-width:1200px !important; margin-inline:auto !important; }
.woocommerce-account .pp-pagebody .wp-block-post-content > *{ max-width:none !important; margin-left:0 !important; margin-right:0 !important; }
.woocommerce-account .woocommerce::before, .woocommerce-account .woocommerce::after{ content:none !important; display:none !important; }
.woocommerce-account .woocommerce-notices-wrapper:empty{ display:none; }
/* ---- sign in: brand panel + form card ---- */
.pp-auth{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(1.5rem,4vw,3.5rem); align-items:stretch; }
.pp-auth__side{ position:relative; overflow:hidden; border-radius:24px; padding:clamp(1.8rem,4vw,3rem); color:#fff; display:flex; flex-direction:column; justify-content:center;
background:radial-gradient(70% 90% at 100% 0%, rgba(47,217,138,.28), transparent 60%), linear-gradient(150deg,#06301c,var(--pp-pine)); }
.pp-auth__side::after{ content:""; position:absolute; right:-90px; bottom:-120px; width:300px; height:300px; border-radius:50%; background:rgba(255,255,255,.06); }
.pp-auth__side .pp-eyebrow{ color:var(--pp-accent); }
.woocommerce-account .pp-auth__side h2{ font-size:clamp(1.8rem,1.4rem + 1.6vw,2.6rem); line-height:1.08; margin:.6rem 0 .8rem; color:#fff; }
.pp-auth__side p{ color:rgba(255,255,255,.78); max-width:40ch; margin:0 0 1.4rem; }
.pp-auth__list{ list-style:none; margin:0 0 1.6rem; padding:0; display:grid; gap:.85rem; position:relative; }
.pp-auth__list li{ display:flex; gap:.8rem; align-items:flex-start; margin:0; }
.pp-auth__list .pp-ic{ width:22px; height:22px; color:var(--pp-accent); flex:none; margin-top:2px; }
.pp-auth__list b{ display:block; font-size:.98rem; color:#fff; }
.pp-auth__list span{ font-size:.88rem; color:rgba(255,255,255,.7); }
.pp-auth__help{ position:relative; display:inline-flex; align-items:center; gap:.5rem; color:#fff !important; text-decoration:none; font-weight:600; font-size:.92rem; border:1px solid rgba(255,255,255,.3); border-radius:999px; padding:.6rem 1rem; width:fit-content; transition:background .2s; }
.pp-auth__help:hover{ background:rgba(255,255,255,.1); }
.pp-auth__help .pp-ic{ width:18px; height:18px; }
.pp-auth__main{ display:flex; align-items:center; }
.pp-auth__main > h2{ display:none; }
.woocommerce form.woocommerce-form-login{ width:100%; max-width:none; margin:0; background:#fff; border:1px solid var(--pp-mist); border-radius:22px; padding:clamp(1.5rem,3vw,2.4rem); box-shadow:0 24px 50px -30px rgba(12,19,14,.35); }
.pp-auth__title{ font-size:1.5rem; margin:0 0 .3rem; }
.pp-auth__sub{ color:#5f6b62; margin:0 0 1.4rem; font-size:.95rem; }
.pp-auth__foot{ margin:1.2rem 0 0; padding-top:1rem; border-top:1px solid var(--pp-mist); font-size:.9rem; color:#5f6b62; line-height:1.5; }
.pp-auth__foot a{ color:var(--pp-pine); font-weight:600; }
@media (max-width:860px){ .pp-auth{ grid-template-columns:1fr; } .pp-auth__side{ order:2; } }
/* ---- forms (sign in, account details, addresses) ---- */
.woocommerce-account h2{ font-size:1.3rem; margin:0 0 1rem; }
.woocommerce form .form-row{ margin:0 0 1rem; display:flex; flex-direction:column; }
.woocommerce form .form-row label{ font-weight:600; font-size:.9rem; margin-bottom:.35rem; color:var(--pp-charcoal); }
.woocommerce form .form-row .required{ color:var(--pp-sale); text-decoration:none; }
.woocommerce form .input-text,
.woocommerce-account input[type=text],
.woocommerce-account input[type=email],
.woocommerce-account input[type=password],
.woocommerce-account input[type=tel],
.woocommerce-account select,
.woocommerce-account .select2-container .select2-selection--single{ width:100%; border:1px solid var(--pp-mist); border-radius:10px; padding:.7rem .85rem; font-size:1rem; background:#fff; box-sizing:border-box; height:auto; }
.woocommerce-account .select2-container .select2-selection--single{ min-height:46px; display:flex; align-items:center; }
.woocommerce-account .select2-container .select2-selection--single .select2-selection__arrow{ top:50%; transform:translateY(-50%); }
.woocommerce form .input-text:focus,
.woocommerce-account input:focus,
.woocommerce-account select:focus{ outline:none; border-color:var(--pp-pine); box-shadow:0 0 0 3px rgba(2,65,29,.12); }
.woocommerce-account .woocommerce-form-login__rememberme{ flex-direction:row; align-items:center; gap:.4rem; font-size:.9rem; }
.woocommerce-account .woocommerce-form-login__submit{ width:100%; margin-top:.4rem; }
.woocommerce-account .lost_password{ margin:.9rem 0 0; text-align:center; }
.woocommerce-account .lost_password a{ color:var(--pp-pine); font-size:.88rem; }
.woocommerce-account .woocommerce-password-strength{ border-radius:8px; margin-top:.4rem; font-size:.85rem; }
.woocommerce-account .woocommerce-password-hint{ font-size:.85rem; color:#6b726c; }
.woocommerce-account fieldset{ border:1px solid var(--pp-mist); border-radius:14px; padding:1.1rem 1.2rem .3rem; margin:1.4rem 0; }
.woocommerce-account fieldset legend{ font-weight:700; padding:0 .4rem; font-size:.95rem; }
@media (min-width:640px){
.woocommerce-account .form-row-first, .woocommerce-account .form-row-last{ width:calc(50% - .5rem) !important; float:left; }
.woocommerce-account .form-row-last{ float:right; }
.woocommerce-account .form-row-wide, .woocommerce-account .form-row:not(.form-row-first):not(.form-row-last){ clear:both; }
}
.woocommerce-account form .woocommerce-address-fields__field-wrapper::after, .woocommerce-account form .woocommerce-EditAccountForm::after{ content:""; display:table; clear:both; }
/* ---- dashboard: user card + sidebar nav + content ---- */
.woocommerce-account.logged-in .woocommerce{ display:block; }
@media (min-width:782px){
.woocommerce-account.logged-in .woocommerce{ display:grid !important; grid-template-columns:260px minmax(0,1fr); grid-template-rows:auto 1fr; grid-template-areas:"user content" "nav content"; gap:1rem 1.75rem; align-items:start; }
.pp-acct-user{ grid-area:user; }
.woocommerce-account .woocommerce-MyAccount-navigation{ grid-area:nav; }
.woocommerce-account .woocommerce-MyAccount-content{ grid-area:content; }
}
.pp-acct-user{ display:flex; align-items:center; gap:.85rem; padding:1rem 1.1rem; background:var(--pp-pine); color:#fff; border-radius:16px; margin-bottom:1rem; }
.pp-acct-user__avatar{ width:44px; height:44px; border-radius:50%; background:var(--pp-accent); color:var(--pp-ink); display:grid; place-items:center; font-weight:700; font-size:1.15rem; flex:none; }
.pp-acct-user b{ display:block; font-size:.98rem; line-height:1.2; }
.pp-acct-user div span{ display:block; font-size:.8rem; color:rgba(255,255,255,.7); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:170px; }
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content{ float:none !important; width:auto !important; margin:0 !important; }
.woocommerce-account .woocommerce-MyAccount-navigation{ margin-bottom:1.5rem !important; }
@media (min-width:782px){ .woocommerce-account .woocommerce-MyAccount-navigation{ margin-bottom:0 !important; } }
.woocommerce-MyAccount-navigation ul{ list-style:none !important; margin:0 !important; padding:.4rem !important; background:#f6f8f6; border:1px solid var(--pp-mist); border-radius:16px; }
.woocommerce-MyAccount-navigation ul li{ margin:0 !important; padding:0 !important; border:0 !important; list-style:none !important; }
.woocommerce-MyAccount-navigation ul li + li{ margin-top:2px !important; }
.woocommerce-MyAccount-navigation li a{ display:block !important; padding:.75rem 1rem !important; border-radius:10px; color:var(--pp-charcoal) !important; text-decoration:none !important; font-weight:600; font-size:.95rem; transition:background .2s, color .2s; }
.woocommerce-MyAccount-navigation li a:hover{ background:#e7efe9; color:var(--pp-pine) !important; }
.woocommerce-MyAccount-navigation li.is-active a{ background:var(--pp-pine) !important; color:#fff !important; }
.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout a{ color:#8a4b4b !important; }
.woocommerce-MyAccount-content{ background:#fff; border:1px solid var(--pp-mist); border-radius:18px; padding:clamp(1.4rem,3vw,2.2rem); min-width:0; }
.woocommerce-account .woocommerce-MyAccount-content > p:first-of-type{ font-size:1.05rem; }
.woocommerce-account .woocommerce-MyAccount-content a:not(.button):not(.pp-dash-card){ color:var(--pp-pine); }
.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3{ font-size:1.15rem; font-weight:700; margin:1.6rem 0 .8rem; }
.woocommerce-account .woocommerce-MyAccount-content > h2:first-child,
.woocommerce-account .woocommerce-MyAccount-content > h3:first-child{ margin-top:0; }
.woocommerce-account .woocommerce-MyAccount-content mark{ background:none; font-weight:700; color:var(--pp-charcoal); }
/* tables: orders list, order details */
.woocommerce-account table.shop_table{ width:100%; border-collapse:separate; border-spacing:0; border:1px solid var(--pp-mist); border-radius:14px; overflow:hidden; font-size:.95rem; margin:0; }
.woocommerce-account table.shop_table th{ background:#f6f8f6; text-align:left; font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; color:#6b726c; padding:.8rem 1rem; border-bottom:1px solid var(--pp-mist); }
.woocommerce-account table.shop_table td{ padding:.9rem 1rem; border-bottom:1px solid var(--pp-mist); vertical-align:middle; }
.woocommerce-account table.shop_table tbody tr:last-child td, .woocommerce-account table.shop_table tfoot tr:last-child td, .woocommerce-account table.shop_table tfoot tr:last-child th{ border-bottom:0; }
.woocommerce-account table.shop_table tfoot th{ background:none; text-transform:none; letter-spacing:0; font-size:.95rem; color:var(--pp-charcoal); text-align:left; padding:.8rem 1rem; border-top:1px solid var(--pp-mist); }
.woocommerce-account table.shop_table tfoot td{ font-weight:700; border-top:1px solid var(--pp-mist); }
.woocommerce-account table.shop_table .woocommerce-orders-table__cell-order-number a{ font-weight:700; }
.woocommerce-account .woocommerce-orders-table__cell-order-status{ font-weight:600; }
.woocommerce-account .woocommerce-orders-table__cell-order-status::before{ content:""; display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--pp-accent); margin-right:.45rem; vertical-align:1px; }
.woocommerce-account .woocommerce-orders-table__cell-order-actions .button{ padding:.5rem 1rem !important; font-size:.85rem !important; }
.woocommerce-account .woocommerce-order-details__title, .woocommerce-account .woocommerce-column__title{ font-size:1.1rem; }
.woocommerce-account .woocommerce-table--order-details .product-name a{ font-weight:600; }
.woocommerce-account .woocommerce-pagination{ margin-top:1.2rem; display:flex; gap:.6rem; }
/* addresses */
.woocommerce-account .woocommerce-Addresses{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.woocommerce-account .woocommerce-Addresses::before, .woocommerce-account .woocommerce-Addresses::after, .woocommerce-account .woocommerce-customer-details .woocommerce-columns::before, .woocommerce-account .woocommerce-customer-details .woocommerce-columns::after{ content:none !important; display:none !important; }
.woocommerce-account .woocommerce-Addresses .woocommerce-Address{ width:auto; float:none; }
.woocommerce-account .woocommerce-Address, .woocommerce-account .woocommerce-customer-details .woocommerce-column{ background:#f6f8f6; border:1px solid var(--pp-mist); border-radius:14px; padding:1.1rem 1.2rem; margin:0; }
.woocommerce-account .woocommerce-Address-title{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:.5rem; }
.woocommerce-account .woocommerce-Address-title h2, .woocommerce-account .woocommerce-Address-title h3{ margin:0; font-size:1rem; flex:1; min-width:0; }
.woocommerce-account .woocommerce-Address-title .edit{ font-size:.85rem; font-weight:600; border:1px solid var(--pp-pine); border-radius:999px; padding:.3rem .8rem; text-decoration:none; white-space:nowrap; }
.woocommerce-account .woocommerce-Address address{ font-style:normal; line-height:1.6; color:#4a504a; }
.woocommerce-account .woocommerce-customer-details{ margin-top:1.5rem; }
.woocommerce-account .woocommerce-customer-details .woocommerce-columns{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.woocommerce-account .woocommerce-customer-details address{ font-style:normal; line-height:1.6; }
.woocommerce-account .woocommerce-customer-details--phone, .woocommerce-account .woocommerce-customer-details--email{ margin-top:.4rem; padding-left:0 !important; }
.woocommerce-account .woocommerce-customer-details--phone::before, .woocommerce-account .woocommerce-customer-details--email::before{ content:none !important; }
@media (max-width:640px){ .woocommerce-account .woocommerce-Addresses, .woocommerce-account .woocommerce-customer-details .woocommerce-columns{ grid-template-columns:1fr; } }
/* dashboard quick cards */
.pp-dash-cards{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin:1.4rem 0 .5rem; }
.pp-dash-card{ display:flex; flex-direction:column; gap:.2rem; background:#f6f8f6; border:1px solid var(--pp-mist); border-radius:14px; padding:1.1rem 1.2rem; text-decoration:none !important; color:var(--pp-charcoal) !important; transition:transform .2s, box-shadow .2s, border-color .2s; }
.pp-dash-card:hover{ transform:translateY(-3px); box-shadow:0 16px 30px -20px rgba(12,19,14,.4); border-color:var(--pp-pine); }
.pp-dash-card .pp-ic{ width:24px; height:24px; color:var(--pp-pine); margin-bottom:.35rem; }
.pp-dash-card b{ font-size:1rem; }
.pp-dash-card span{ font-size:.85rem; color:#6b726c; }
@media (max-width:600px){ .pp-dash-cards{ grid-template-columns:1fr; } }
/* =====================================================================
BUTTONS: one language for every WooCommerce / form button outside the shop loop
===================================================================== */
.woocommerce-account .button, .woocommerce-account button.button, .woocommerce-account .woocommerce-Button,
.woocommerce-cart .wc-block-components-button, .woocommerce-checkout .wc-block-components-button, .wc-block-components-button.wc-block-cart__submit-button,
.pp-pagebody .woocommerce .button, .woocommerce-form-track-order .button, .wpcf7-submit, .wp-block-button__link,
.woocommerce-cart .return-to-shop .button, .wc-block-cart__empty-cart__button{
display:inline-flex !important; align-items:center; justify-content:center; gap:.5rem; box-sizing:border-box;
background:var(--pp-pine) !important; color:#fff !important; border:0 !important; border-radius:999px !important;
padding:.85rem 1.6rem !important; font-weight:700 !important; font-size:.98rem !important; line-height:1.2 !important;
text-decoration:none !important; cursor:pointer; box-shadow:none !important; transition:background .2s, transform .15s; }
.woocommerce-account .button:hover, .woocommerce-account button.button:hover, .woocommerce-account .woocommerce-Button:hover,
.woocommerce-cart .wc-block-components-button:hover, .woocommerce-checkout .wc-block-components-button:hover,
.pp-pagebody .woocommerce .button:hover, .wpcf7-submit:hover, .wp-block-button__link:hover, .wc-block-cart__empty-cart__button:hover{
background:var(--pp-charcoal) !important; color:#fff !important; transform:translateY(-2px); }
.wc-block-components-button .wc-block-components-button__text{ font-weight:700; }
.wp-block-button.is-style-outline .wp-block-button__link{ background:transparent !important; color:var(--pp-pine) !important; border:1.5px solid var(--pp-pine) !important; }
/* =====================================================================
ADD-MORE-PRODUCTS MODAL (checkout / cart)
===================================================================== */
.pp-addmore-open{ display:flex; align-items:center; justify-content:center; gap:.5rem; width:100%; margin:0 0 1.2rem; padding:.85rem 1.2rem;
background:#fff; color:var(--pp-pine); border:1.5px dashed var(--pp-pine); border-radius:12px; font-weight:700; font-size:.98rem; cursor:pointer; transition:background .2s, color .2s; }
.pp-addmore-open:hover{ background:var(--pp-pine); color:#fff; }
.pp-addmore-open svg{ width:20px; height:20px; }
.pp-modal{ position:fixed; inset:0; z-index:9999; display:none; }
.pp-modal.is-open{ display:block; }
.pp-modal__backdrop{ position:absolute; inset:0; background:rgba(12,19,14,.55); backdrop-filter:blur(3px); }
.pp-modal__panel{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:min(760px,94vw); max-height:88vh; display:flex; flex-direction:column;
background:#fff; border-radius:20px; overflow:hidden; box-shadow:0 40px 80px -30px rgba(0,0,0,.6); animation:pp-modal-in .28s cubic-bezier(.2,.7,.2,1); }
@keyframes pp-modal-in{ from{ opacity:0; transform:translate(-50%,-46%) scale(.97); } to{ opacity:1; transform:translate(-50%,-50%) scale(1); } }
.pp-modal__head{ display:flex; align-items:flex-start; justify-content:space-between; padding:1.3rem 1.5rem 1rem; border-bottom:1px solid var(--pp-mist); }
.pp-modal__head h3{ margin:.15rem 0 0; font-size:1.4rem; }
.pp-modal__x{ background:none; border:0; font-size:1.8rem; line-height:1; color:#8a908a; cursor:pointer; padding:0 .2rem; }
.pp-modal__x:hover{ color:var(--pp-charcoal); }
.pp-modal__tools{ padding:1rem 1.5rem; display:flex; flex-direction:column; gap:.8rem; }
.pp-modal__searchwrap{ display:flex; align-items:center; gap:.6rem; background:var(--pp-mist); border-radius:999px; padding:.55rem 1rem; }
.pp-modal__searchwrap svg{ width:18px; height:18px; color:#8a908a; flex:none; }
.pp-modal__search{ flex:1; border:0; background:none; outline:none; font-size:1rem; }
.pp-modal__cats{ display:flex; flex-wrap:wrap; gap:.4rem; }
.pp-chip{ border:1px solid var(--pp-mist); background:#fff; color:var(--pp-charcoal); border-radius:999px; padding:.4rem .9rem; font-size:.85rem; font-weight:600; cursor:pointer; transition:all .2s; }
.pp-chip:hover{ border-color:var(--pp-pine); }
.pp-chip.is-active{ background:var(--pp-pine); color:#fff; border-color:var(--pp-pine); }
.pp-modal__grid{ padding:.5rem 1.5rem 1.5rem; overflow-y:auto; display:grid; gap:.8rem; }
.pp-mp{ display:flex; align-items:center; gap:1rem; border:1px solid var(--pp-mist); border-radius:14px; padding:.7rem; transition:border-color .2s, box-shadow .2s; }
.pp-mp:hover{ border-color:var(--pp-pine); box-shadow:0 10px 24px -16px rgba(12,19,14,.4); }
.pp-mp__img{ width:66px; height:66px; border-radius:10px; overflow:hidden; background:#fafbfa; flex:none; }
.pp-mp__img img{ width:100%; height:100%; object-fit:cover; display:block; }
.pp-mp__body{ flex:1; min-width:0; }
.pp-mp__body b{ display:block; font-size:.98rem; line-height:1.25; }
.pp-mp__price{ font-size:.92rem; color:var(--pp-pine); font-weight:600; }
.pp-mp__price del{ color:#9aa39c; font-weight:400; margin-right:.3rem; }
.pp-mp__price ins{ text-decoration:none; }
.pp-mp__add{ flex:none; display:inline-flex; align-items:center; gap:.4rem; background:var(--pp-pine); color:#fff; border:0; border-radius:10px; padding:.6rem 1rem; font-weight:700; font-size:.9rem; cursor:pointer; transition:background .2s, transform .15s; }
.pp-mp__add svg{ width:16px; height:16px; }
.pp-mp__add:hover{ background:var(--pp-charcoal); }
.pp-mp__add.is-loading{ opacity:.7; }
.pp-mp__add.is-added{ background:var(--pp-accent); color:var(--pp-charcoal); }
/* =====================================================================
TOAST NOTIFICATIONS + add-to-cart feedback
===================================================================== */
.pp-toasts{ position:fixed; bottom:24px; right:24px; z-index:100000; display:flex; flex-direction:column; gap:.7rem; width:min(370px,92vw); pointer-events:none; }
.pp-toast{ pointer-events:auto; display:flex; align-items:flex-start; gap:.75rem; background:#fff; border:1px solid var(--pp-mist); border-left:4px solid var(--pp-pine); border-radius:14px; padding:.85rem 1rem; box-shadow:0 22px 46px -20px rgba(12,19,14,.5); transform:translateX(120%); opacity:0; transition:transform .38s cubic-bezier(.2,.8,.2,1), opacity .38s; }
.pp-toast.is-in{ transform:translateX(0); opacity:1; }
.pp-toast--error{ border-left-color:var(--pp-sale); }
.pp-toast--info{ border-left-color:#2f80ed; }
.pp-toast__ic{ flex:none; width:26px; height:26px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:var(--pp-pine); color:#fff; margin-top:1px; }
.pp-toast--error .pp-toast__ic{ background:var(--pp-sale); }
.pp-toast--info .pp-toast__ic{ background:#2f80ed; }
.pp-toast__ic svg{ width:15px; height:15px; }
.pp-toast__msg{ flex:1; font-size:.92rem; line-height:1.4; color:var(--pp-charcoal); font-weight:500; padding-top:3px; }
.pp-toast__x{ flex:none; background:none; border:0; color:#9aa39c; font-size:1.25rem; line-height:1; cursor:pointer; padding:0 .1rem; }
.pp-toast__x:hover{ color:var(--pp-charcoal); }
@media (max-width:560px){ .pp-toasts{ left:12px; right:12px; bottom:12px; width:auto; } }
/* cart-icon button: spinner while adding, checkmark when done (shop-loop) */
@keyframes pp-spin{ to{ transform:rotate(360deg); } }
.woocommerce ul.products li.product .pp-loop-cta .button.loading{ opacity:1 !important; color:var(--pp-pine) !important; }
.woocommerce ul.products li.product .pp-loop-cta .button.loading::after{ display:none !important; }
.woocommerce ul.products li.product .pp-loop-cta .button.loading::before{ -webkit-mask:none !important; mask:none !important; background:none !important; width:18px; height:18px; border:2.5px solid currentColor; border-top-color:transparent; border-radius:50%; animation:pp-spin .6s linear infinite; }
.woocommerce ul.products li.product .pp-loop-cta .button.pp-done{ background:var(--pp-pine) !important; color:#fff !important; border-color:var(--pp-pine) !important; }
.woocommerce ul.products li.product .pp-loop-cta .button.pp-done::before{ background:currentColor !important; border:0 !important; animation:none !important; width:20px; height:20px;
-webkit-mask:url("data:image/svg+xml;utf8,") center/contain no-repeat !important;
mask:url("data:image/svg+xml;utf8,") center/contain no-repeat !important; }
/* branded inline notices (block cart/checkout, kept inline as React manages them) */
.wc-block-components-notice-banner{ border-radius:12px !important; }
/* assurance strip, then a grey divider, then copyright */
.pp-foot-trust{ display:flex; flex-wrap:wrap; gap:.9rem 2.2rem; justify-content:center; }
.pp-foot-hr{ border:0 !important; border-top:1px solid rgba(255,255,255,.14) !important; background:transparent !important; height:0; margin:1.5rem 0 !important; }
.pp-foot-trust__item{ display:inline-flex; align-items:center; gap:.5rem; font-size:.85rem; color:#dfe4df; }
.pp-foot-trust__item .pp-ic{ width:20px; height:20px; color:var(--pp-accent); flex:none; }
.pp-wa-cta{ display:inline-flex; align-items:center; gap:.5rem; background:#25D366; color:#fff !important; padding:.6rem 1rem; border-radius:999px; font-weight:600; font-size:.9rem; text-decoration:none; margin-top:1.1rem; }
.pp-wa-cta .pp-ic{ width:18px; height:18px; }
.pp-wa-cta:hover{ filter:brightness(1.06); }
/* =====================================================================
PDP additions — rating stars, delivery block, reviews, related
===================================================================== */
.pp-rating{ display:inline-flex; align-items:center; gap:.5rem; text-decoration:none; margin:.15rem 0 .1rem; }
.pp-stars{ --r:5; position:relative; display:inline-block; width:6.2em; height:1.05em; font-size:.95rem; line-height:1; }
.pp-stars::before,.pp-stars::after{ content:"★★★★★"; position:absolute; left:0; top:0; letter-spacing:.14em; }
.pp-stars::before{ color:#d9ddd9; }
.pp-stars::after{ color:#f5a623; width:calc(var(--r)/5*100%); overflow:hidden; white-space:nowrap; }
.pp-rating__txt{ font-size:.85rem; color:#6b726c; font-weight:500; }
.pp-rating:hover .pp-rating__txt{ color:var(--pp-pine); }
.pp-deliver{ display:flex; align-items:center; gap:.65rem; margin:1.3rem 0 .1rem; padding:.75rem .95rem; background:#eef4ef; border-radius:12px; font-size:.92rem; color:var(--pp-charcoal); }
.pp-deliver .pp-ic{ width:22px; height:22px; color:var(--pp-pine); flex:none; }
/* related products */
/* premium "More picks" cards */
.pp-picks{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.5rem; }
@media (max-width:1000px){ .pp-picks{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.pp-pick{ display:flex; flex-direction:column; background:#fff; border:1px solid var(--pp-mist); border-radius:18px; overflow:hidden; text-decoration:none; color:var(--pp-charcoal);
transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s, border-color .3s; }
.pp-pick:hover{ transform:translateY(-6px); box-shadow:0 24px 44px -24px rgba(12,19,14,.4); border-color:transparent; }
.pp-pick__img{ position:relative; background:#fafbfa; aspect-ratio:1/1; overflow:hidden; }
.pp-pick__img img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .55s cubic-bezier(.2,.7,.2,1); }
.pp-pick:hover .pp-pick__img img{ transform:scale(1.06); }
.pp-pick__sale{ position:absolute; top:12px; right:12px; background:var(--pp-sale); color:#fff; font-size:.72rem; font-weight:700; padding:5px 10px; border-radius:6px; letter-spacing:.02em; }
.pp-pick__body{ padding:1rem 1.15rem 1.15rem; display:flex; flex-direction:column; gap:.35rem; flex:1; }
.pp-pick__body h3{ font-size:1.02rem; font-weight:700; margin:0; line-height:1.25; }
.pp-pick__price{ font-size:1.05rem; font-weight:600; }
.pp-pick__price del{ color:#9aa39c; font-weight:500; margin-right:.35rem; }
.pp-pick__price ins{ text-decoration:none; color:var(--pp-pine); }
.pp-pick__btn{ margin-top:.6rem; display:inline-flex; align-items:center; justify-content:center; gap:.45rem; background:var(--pp-pine); color:#fff; border-radius:10px; padding:.6rem 1rem; font-weight:600; font-size:.92rem; transition:background .2s; }
.pp-pick:hover .pp-pick__btn{ background:var(--pp-charcoal); }
.pp-pick__btn .pp-ic{ width:16px; height:16px; }
/* shop-all filler card */
.pp-pick--all{ background:linear-gradient(160deg,var(--pp-pine),#0f3323); color:#fff; align-items:center; justify-content:center; text-align:center; }
.pp-pick--all .pp-pick__allinner{ padding:2rem 1.5rem; display:flex; flex-direction:column; align-items:center; gap:.5rem; }
.pp-pick--all .pp-ic{ width:34px; height:34px; color:var(--pp-accent); margin-bottom:.3rem; }
.pp-pick--all b{ font-size:1.15rem; }
.pp-pick--all span{ font-size:.9rem; color:rgba(255,255,255,.85); max-width:220px; }
.pp-pick__btn--ghost{ margin-top:.9rem; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.35); }
.pp-pick--all:hover{ transform:translateY(-6px); }
.pp-pick--all:hover .pp-pick__btn--ghost{ background:#fff; color:var(--pp-pine); }
/* reviews */
.pp-reviews-sec .woocommerce-Reviews-title{ display:none; }
.pp-reviews-sec #reviews{ margin-top:1rem; }
.pp-reviews-sec .commentlist{ list-style:none; margin:0 0 2rem; padding:0; display:grid; gap:1.1rem; }
.pp-reviews-sec .commentlist li.review{ background:#fff; border:1px solid var(--pp-mist); border-radius:14px; padding:1.1rem 1.3rem; }
.pp-reviews-sec .commentlist .comment-text{ margin-left:0; }
.pp-reviews-sec .commentlist .avatar{ display:none; }
.pp-reviews-sec .star-rating{ margin:.2rem 0 .5rem; }
.pp-reviews-sec .woocommerce-noreviews{ color:#6b726c; background:#f6f8f6; border:1px dashed var(--pp-mist); border-radius:12px; padding:1rem 1.2rem; }
.pp-reviews-sec #review_form_wrapper{ background:#f6f8f6; border-radius:16px; padding:1.4rem 1.6rem; margin-top:1rem; }
.pp-reviews-sec .comment-form textarea,
.pp-reviews-sec .comment-form input[type=text],
.pp-reviews-sec .comment-form input[type=email]{ width:100%; border:1px solid var(--pp-mist); border-radius:10px; padding:.7rem .85rem; font-family:inherit; background:#fff; }
.pp-reviews-sec .comment-form label{ display:block; font-weight:600; margin:.6rem 0 .3rem; font-size:.9rem; }
.pp-reviews-sec .comment-form .submit,
.pp-reviews-sec form.comment-form button[type=submit]{ background:var(--pp-pine); color:#fff; border:0; border-radius:999px; padding:.7rem 1.6rem; font-weight:600; cursor:pointer; margin-top:.8rem; }
/* =====================================================================
RESPONSIVE
===================================================================== */
@media (max-width:900px){
.pp-cta-row{ justify-content:center; }
.pp-bento{ grid-template-columns:1fr 1fr; grid-auto-rows:180px; }
.pp-cat--lg{ grid-column:span 2; grid-row:span 1; }
.pp-why__grid{ grid-template-columns:1fr; }
.pp-stats{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
.pp-bento{ grid-template-columns:1fr; } .pp-cat--sm,.pp-cat--lg{ grid-column:span 1; }
}
/* =====================================================================
MOBILE HARDENING (kill horizontal scroll + fit CTAs) — mobile is primary
===================================================================== */
html, body{ overflow-x:hidden; max-width:100%; }
.wp-site-blocks{ overflow-x:clip; }
@media (max-width:782px){
/* footer: stack the two partner columns */
/* footer: Shop + Help side by side, Policies full width below */
footer .wp-block-column > .wp-block-columns{ display:grid !important; grid-template-columns:1fr 1fr; gap:1.6rem 1.5rem; }
footer .wp-block-column > .wp-block-columns > .wp-block-column{ flex-basis:auto !important; width:auto !important; margin:0 !important; }
footer .wp-block-column > .wp-block-columns > .wp-block-column:nth-child(3){ grid-column:1 / -1; }
/* delivery partner and payment methods side by side; payment chips in two rows */
.pp-foot-partners{ grid-template-columns:max-content minmax(0,1fr); gap:1.2rem 1rem; align-items:start; }
.pp-foot-pcol:first-child .pp-foot-plabel{ white-space:normal; max-width:6.5rem; line-height:1.35; }
.pp-foot-pcol:last-child{ border-left:1px solid rgba(255,255,255,.12); padding-left:1rem; min-width:0; }
.pp-pays{ display:grid; grid-template-columns:repeat(3,max-content); gap:.4rem; }
.pp-pay, .pp-partner--img{ height:34px; min-width:40px; padding:0 7px; }
.pp-pay--cod{ padding:0 9px; }
.pp-paylogo, .pp-partner--img .pp-paylogo{ height:18px; max-width:54px; }
/* assurance points and the copyright line both centred */
.pp-foot-trust{ gap:.7rem 1.2rem; justify-content:center; text-align:center; }
footer .pp-foot-hr ~ .wp-block-group{ flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:.35rem !important; }
/* PDP: consolidated assurance + CTA breathe */
.woocommerce div.product form.cart .quantity{ flex:0 0 auto; }
.woocommerce div.product form.cart .quantity input.qty{ width:36px; }
.pp-qtybtn{ width:34px; }
}
@media (max-width:600px){
.pp-annc__msg{ font-size:.74rem; } .pp-annc{ padding:8px 12px; }
/* product cards are one per row on phones, so the three CTAs share one row */
/* add-more modal fits small screens */
.pp-modal__panel{ width:96vw; max-height:92vh; }
.pp-modal__grid{ padding:.5rem 1rem 1.2rem; }
.pp-mp{ gap:.7rem; padding:.6rem; }
.pp-mp__img{ width:56px; height:56px; }
.pp-mp__add span{ display:none; } .pp-mp__add{ padding:.6rem .8rem; }
/* page hero title smaller */
.pp-pagehero .pp-pagehero__title, .pp-pagehero h1{ font-size:1.7rem !important; }
/* payment chips tighter so they fit */
.pp-pay__visa{ font-size:.85rem; }
/* promo banner stacks */
.pp-banner__in{ flex-direction:column; align-items:flex-start; text-align:left; }
/* related/pick grid single column */
.pp-picks{ grid-template-columns:1fr; }
}
/* structured product sections */
.pp-sec--tint{ background:#f6f8f6; }
.pp-container--narrow{ max-width:820px; }
.pp-cta__btns{ display:flex; gap:.8rem; justify-content:center; flex-wrap:wrap; position:relative; z-index:2; }
.pp-steps{ grid-template-columns:repeat(var(--n,3),1fr); }
.pp-compare-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.pp-compare{ min-width:520px; }
@media (max-width:640px){ .pp-compare th, .pp-compare td{ padding:.7rem .6rem; font-size:.9rem; } .pp-compare thead th{ font-size:.85rem; } }
@media (max-width:860px){ .pp-steps{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .pp-steps{ grid-template-columns:1fr; } }
/* ---- FAQ page: details blocks styled like the product FAQ ---- */
.pp-pagebody details.wp-block-details, .pp-pagebody .wp-block-post-content > details{ border:1px solid var(--pp-mist); border-radius:12px; padding:.9rem 1.2rem; margin:0 0 .7rem; background:#fff; }
.pp-pagebody details.wp-block-details summary, .pp-pagebody .wp-block-post-content > details summary{ font-weight:700; cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.pp-pagebody details summary::-webkit-details-marker{ display:none; }
.pp-pagebody details.wp-block-details summary::after, .pp-pagebody .wp-block-post-content > details summary::after{ content:"+"; font-size:1.4rem; color:var(--pp-pine); line-height:1; }
.pp-pagebody details[open] summary::after{ content:"\2013"; }
.pp-pagebody details > :not(summary){ margin:.7rem 0 0; color:#4a504a; }
/* ---- Track order form ---- */
.woocommerce-form-track-order > p:first-child{ display:none; }
.woocommerce-form-track-order{ background:#f6f8f6; border:1px solid var(--pp-mist); border-radius:18px; padding:1.5rem; margin:1.2rem 0; }
.woocommerce-form-track-order .form-row{ display:flex; flex-direction:column; margin:0 0 1rem; }
.woocommerce-form-track-order label{ font-weight:600; font-size:.9rem; margin-bottom:.35rem; }
.woocommerce-form-track-order .input-text{ width:100%; border:1px solid var(--pp-mist); border-radius:10px; padding:.7rem .85rem; font-size:1rem; background:#fff; box-sizing:border-box; }
.woocommerce-form-track-order .input-text:focus{ outline:none; border-color:var(--pp-pine); box-shadow:0 0 0 3px rgba(2,65,29,.12); }
@media (min-width:640px){ .woocommerce-form-track-order .form-row-first, .woocommerce-form-track-order .form-row-last{ width:calc(50% - .5rem); float:left; } .woocommerce-form-track-order .form-row-last{ float:right; } .woocommerce-form-track-order .form-row:not(.form-row-first):not(.form-row-last){ clear:both; } }
.woocommerce-form-track-order .button{ width:auto; }
/* ---- Contact page ---- */
.pp-contact__ic{ width:42px; height:42px; border-radius:12px; background:#eef4ef; display:grid; place-items:center; flex:none; color:var(--pp-pine); }
.pp-contact__ic .pp-ic{ width:20px; height:20px; margin:0; }
.pp-contact__list li{ align-items:center; }
.pp-contact__note{ color:#6b726c; font-size:.88rem; margin:-.2rem 0 1rem; }
.pp-contact__links{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:2.5rem; }
.pp-contact__link{ display:flex; flex-direction:column; gap:.25rem; padding:1.2rem 1.3rem; border:1px solid var(--pp-mist); border-radius:16px; background:#fff; text-decoration:none !important; color:var(--pp-charcoal) !important; transition:transform .2s, box-shadow .2s, border-color .2s; }
.pp-contact__link:hover{ transform:translateY(-3px); box-shadow:0 16px 30px -20px rgba(12,19,14,.4); border-color:var(--pp-pine); }
.pp-contact__link .pp-ic{ width:24px; height:24px; color:var(--pp-pine); margin-bottom:.4rem; }
.pp-contact__link b{ font-size:1rem; }
.pp-contact__link span{ font-size:.88rem; color:#6b726c; }
.pp-form p{ margin:0 0 1rem; }
.pp-form label{ font-weight:600; font-size:.9rem; display:block; }
.pp-form .wpcf7-form-control-wrap{ display:block; margin-top:.35rem; }
.pp-form input[type=text], .pp-form input[type=email], .pp-form input[type=tel], .pp-form textarea{ width:100%; border:1px solid var(--pp-mist); border-radius:10px; padding:.7rem .85rem; font-size:1rem; background:#fff; box-sizing:border-box; font-family:inherit; }
.pp-form input:focus, .pp-form textarea:focus{ outline:none; border-color:var(--pp-pine); box-shadow:0 0 0 3px rgba(2,65,29,.12); }
.pp-form textarea{ min-height:150px; resize:vertical; }
.pp-form .wpcf7-not-valid-tip{ color:var(--pp-sale); font-size:.82rem; margin-top:.3rem; }
.wpcf7 form .wpcf7-response-output{ border-radius:10px; margin:.6rem 0 0 !important; padding:.8rem 1rem; font-size:.92rem; border:1px solid var(--pp-mist); }
.wpcf7 form.sent .wpcf7-response-output{ background:#eef7f0; border-color:var(--pp-pine); color:var(--pp-pine); }
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.failed .wpcf7-response-output{ background:#fdf0f0; border-color:#e5a3a3; color:#8a2b2b; }
.wpcf7-spinner{ display:none; }
@media (max-width:800px){ .pp-contact__links{ grid-template-columns:1fr; } }
/* ---- 404 / search ---- */
.pp-404__in, .pp-search .pp-404__search, .pp-search .wp-block-query{ max-width:720px; margin-left:0 !important; }
.pp-404__links .pp-btn--pine{ color:#fff !important; }
.pp-404__lead{ font-size:1.1rem; color:#4a504a; margin:0 0 1.4rem; }
.pp-404__search{ display:flex; gap:.6rem; margin:0 0 1.4rem; max-width:720px; }
.pp-404__search input[type=search]{ flex:1; min-width:0; border:1px solid var(--pp-mist); border-radius:999px; padding:.8rem 1.2rem; font-size:1rem; background:#fff; }
.pp-404__search input[type=search]:focus{ outline:none; border-color:var(--pp-pine); box-shadow:0 0 0 3px rgba(2,65,29,.12); }
.pp-404__search button{ background:var(--pp-pine); color:#fff; border:0; border-radius:999px; padding:.8rem 1.4rem; font-weight:700; cursor:pointer; }
.pp-404__search button:hover{ background:var(--pp-charcoal); }
.pp-404__links{ display:flex; gap:.7rem; flex-wrap:wrap; }
.pp-404__links .pp-btn{ font-size:.95rem; padding:.75rem 1.3rem; }
.pp-search .wp-block-query h2 a{ text-decoration:none; color:var(--pp-charcoal); }
.pp-search .wp-block-query h2 a:hover{ color:var(--pp-pine); }
/* =====================================================================
MOBILE HEADER + DRAWER MENU
===================================================================== */
.pp-menu-open{ display:none; }
.pp-drawer{ position:fixed; inset:0; z-index:9000; visibility:hidden; pointer-events:none; }
.pp-drawer.is-open{ visibility:visible; pointer-events:auto; }
.pp-drawer__backdrop{ position:absolute; inset:0; background:rgba(12,19,14,.55); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); opacity:0; transition:opacity .35s ease; }
.pp-drawer.is-open .pp-drawer__backdrop{ opacity:1; }
.pp-drawer__panel{ position:absolute; top:0; right:0; bottom:0; width:min(88vw,400px); background:#fff; display:flex; flex-direction:column; gap:1.1rem; padding:1.1rem 1.35rem calc(1.35rem + env(safe-area-inset-bottom));
overflow-y:auto; border-radius:24px 0 0 24px; box-shadow:-30px 0 60px -30px rgba(12,19,14,.5); transform:translateX(104%); transition:transform .45s cubic-bezier(.2,.8,.2,1); }
.pp-drawer.is-open .pp-drawer__panel{ transform:none; }
.pp-drawer__head{ display:flex; align-items:center; justify-content:space-between; }
.pp-drawer__brand{ display:inline-flex; }
.pp-drawer__logo{ width:140px; height:auto; display:block; }
.pp-drawer__x{ width:42px; height:42px; border-radius:50%; border:1px solid var(--pp-mist); background:#fff; color:var(--pp-charcoal); display:grid; place-items:center; cursor:pointer; padding:0; }
.pp-drawer__x .pp-ic{ width:20px; height:20px; }
.pp-drawer__search{ display:flex; align-items:center; gap:.6rem; background:#f6f8f6; border:1px solid var(--pp-mist); border-radius:999px; padding:.55rem .55rem .55rem 1rem; }
.pp-drawer__search .pp-ic{ width:20px; height:20px; color:var(--pp-pine); flex:none; }
.pp-drawer__search input{ flex:1; min-width:0; border:0; background:none; font-size:1rem; outline:none; color:var(--pp-charcoal); padding:.25rem 0; }
.pp-drawer__nav{ display:flex; flex-direction:column; }
.pp-drawer__nav a{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.9rem .2rem; border-bottom:1px solid var(--pp-mist); color:var(--pp-charcoal); text-decoration:none; font-weight:600; font-size:1.2rem;
opacity:0; transform:translateX(18px); transition:opacity .4s ease, transform .4s cubic-bezier(.2,.8,.2,1), color .2s; }
.pp-drawer.is-open .pp-drawer__nav a{ opacity:1; transform:none; transition-delay:calc(.12s + var(--i,0) * .06s); }
.pp-drawer__nav a svg{ width:20px; height:20px; color:var(--pp-pine); flex:none; }
.pp-drawer__nav a:hover, .pp-drawer__nav a:active{ color:var(--pp-pine); }
.pp-drawer__quick{ display:grid; grid-template-columns:1fr 1fr; gap:.6rem; }
.pp-drawer__quick a{ display:flex; align-items:center; gap:.55rem; padding:.8rem .9rem; border:1px solid var(--pp-mist); border-radius:14px; background:#f6f8f6; color:var(--pp-charcoal); text-decoration:none; font-weight:600; font-size:.92rem; }
.pp-drawer__quick .pp-ic{ width:20px; height:20px; color:var(--pp-pine); flex:none; }
.pp-drawer__wa{ display:flex; align-items:center; justify-content:center; gap:.55rem; background:#25D366; color:#fff !important; text-decoration:none; font-weight:700; padding:.95rem 1rem; border-radius:999px; }
.pp-drawer__wa .pp-ic{ width:22px; height:22px; }
.pp-drawer__trust{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:.4rem .5rem; }
.pp-drawer__trust li{ margin:0; font-size:.78rem; font-weight:600; color:var(--pp-pine); background:#eef4ef; border-radius:999px; padding:.35rem .7rem; }
.pp-drawer__foot{ margin-top:auto; padding-top:1rem; border-top:1px solid var(--pp-mist); display:flex; flex-direction:column; gap:.9rem; }
.pp-drawer__foot .pakpick-socials a{ background:#f6f8f6; color:var(--pp-charcoal); }
.pp-drawer__contact{ display:flex; flex-direction:column; gap:.4rem; }
.pp-drawer__contact a{ display:inline-flex; align-items:center; gap:.5rem; color:#4a504a; text-decoration:none; font-size:.9rem; }
.pp-drawer__contact .pp-ic{ width:17px; height:17px; color:var(--pp-pine); }
body.pp-drawer-open{ overflow:hidden; }
@media (max-width:781px){
header .wp-block-navigation{ display:none !important; }
.pp-menu-open{ display:inline-flex; }
.pp-hdr-actions .pp-search-toggle, .pp-hdr-actions .pp-hdr-account{ display:none !important; }
.pp-hdr-actions{ gap:.15rem !important; }
/* product page: the gallery sits one root padding below the header, like the side gaps */
.single-product .wp-block-group.woocommerce{ margin-top:0 !important; padding-top:0 !important; }
.single-product div.product{ padding-top:0 !important; }
.single-product .wp-block-columns:has(.wp-block-woocommerce-product-image-gallery){ margin-top:var(--wp--style--root--padding-left,1rem) !important; }
}
@media (max-width:600px){
/* four thumbnails per row */
.woocommerce div.product .flex-control-thumbs{ gap:8px; }
.woocommerce div.product .flex-control-thumbs li{ flex:0 0 calc(25% - 6px); }
.woocommerce div.product .flex-control-thumbs img{ width:100%; height:auto; aspect-ratio:1/1; }
}
/* ---- comparison table becomes cards on phones (no sideways scrolling) ---- */
@media (max-width:640px){
.pp-compare-wrap{ overflow:visible; }
.pp-compare{ min-width:0; display:block; border-collapse:collapse; }
.pp-compare thead{ display:none; }
.pp-compare tbody{ display:grid; gap:.45rem; }
.pp-compare tr{ display:block; background:#fff; border:1px solid var(--pp-mist); border-radius:12px; padding:.6rem .75rem .45rem; }
.pp-compare td{ border:0; padding:0; text-align:left; }
.pp-compare td.pp-compare__feature{ display:block; font-weight:700; font-size:.92rem; color:var(--pp-charcoal); margin-bottom:.35rem; }
.pp-compare td.pp-compare__us, .pp-compare td.yes, .pp-compare td.no, .pp-compare td.none{ display:inline-flex; align-items:center; gap:.3rem; margin:0 .3rem .3rem 0; padding:.2rem .5rem; border-radius:999px; font-size:.72rem; font-weight:600; background:#f6f8f6; color:#4a504a; line-height:1.3; }
.pp-compare td::before{ content:attr(data-col); }
.pp-compare td.pp-compare__us{ background:#e7f3ea; color:var(--pp-pine); }
.pp-compare td span{ font-weight:800; }
.pp-compare td.yes span{ color:var(--pp-pine); }
.pp-compare td.no span{ color:#c0605f; }
.pp-compare td.none span{ display:none; }
}
/* ---- mini cart drawer: compact, branded ---- */
.wc-block-mini-cart__drawer .wc-block-mini-cart__title{ font-size:1.25rem !important; font-weight:700; gap:.35rem; margin:0; padding:.35rem 16px .9rem; }
.wc-block-mini-cart__drawer .wc-block-mini-cart__title > *{ font-size:inherit !important; }
.wc-block-mini-cart__drawer .wc-block-cart-items__header{ display:none; }
.wc-block-mini-cart__drawer .wc-block-cart-item__image img{ border-radius:10px; border:1px solid var(--pp-mist); }
.wc-block-mini-cart__drawer .wc-block-components-product-name{ font-size:.95rem !important; font-weight:600; color:var(--pp-charcoal) !important; text-decoration:none; line-height:1.35; }
.wc-block-mini-cart__drawer .wc-block-components-product-metadata{ display:none; }
.wc-block-mini-cart__drawer .wc-block-cart-item__prices{ font-size:.88rem; margin-top:.2rem; }
.wc-block-mini-cart__drawer .wc-block-cart-item__total .wc-block-components-product-price{ font-size:.95rem; font-weight:700; color:var(--pp-pine); }
.wc-block-mini-cart__drawer .wc-block-components-sale-badge{ font-size:.68rem; padding:.2em .55em; border-radius:6px; background:#eef4ef; color:var(--pp-pine); border:0; }
.wc-block-mini-cart__drawer .wc-block-cart-item__quantity{ margin-top:.5rem; }
.wc-block-mini-cart__drawer .wc-block-components-quantity-selector{ border-radius:10px; }
.wc-block-mini-cart__drawer .wc-block-cart-item__remove-link{ font-size:.82rem; }
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer{ border-top:1px solid var(--pp-mist); }
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer-subtotal, .wc-block-mini-cart__drawer .wc-block-components-totals-item{ font-size:1rem; }
.wc-block-mini-cart__drawer .wc-block-components-totals-item__value{ font-weight:700; color:var(--pp-pine); }
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer-actions .wc-block-components-button{ border-radius:999px !important; padding:.85rem 1rem !important; font-weight:700 !important; }
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer-actions .wc-block-mini-cart__footer-cart{ background:#fff !important; color:var(--pp-pine) !important; border:1.5px solid var(--pp-pine) !important; }
.wc-block-mini-cart__drawer .wc-block-components-drawer__close{ border-radius:50%; }
/* benefits strip on phones: a faded plus divider between the four items */
@media (max-width:860px){
.pp-benefits__grid{ position:relative; }
.pp-benefits__grid::before, .pp-benefits__grid::after{ content:""; position:absolute; background:rgba(255,255,255,.14); pointer-events:none; }
.pp-benefits__grid::before{ left:50%; top:12%; bottom:12%; width:1px; transform:translateX(-50%); }
.pp-benefits__grid::after{ top:50%; left:8%; right:8%; height:1px; transform:translateY(-50%); }
}
/* Sale badge: it is a sibling before the gallery box, so lift it above the slides (which carry z-index 2) */
.single-product .wp-block-woocommerce-product-image-gallery{ position:relative; }
.single-product .wp-block-woocommerce-product-image-gallery > .onsale,
.single-product .woocommerce-product-gallery .onsale{ position:absolute; top:12px; left:12px; z-index:6 !important; margin:0; }
/* specification cards: never wider than the phone */
.pp-specgrid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.pp-specitem > div{ min-width:0; }
.pp-specitem b{ overflow-wrap:anywhere; word-break:break-word; }
@media (max-width:640px){ .pp-specgrid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:.7rem; } .pp-specitem{ padding:.9rem .9rem; gap:.6rem; } .pp-specitem b{ font-size:.92rem; } }
@media (max-width:420px){ .pp-specgrid{ grid-template-columns:1fr; } }
/* Safari shows its own disclosure triangle on details unless told not to */
.pp-faq summary, .pp-pagebody details summary{ list-style:none; }
.pp-faq summary::-webkit-details-marker, .pp-pagebody details summary::-webkit-details-marker, .pp-faq summary::marker{ display:none; content:""; }