/*  GroundingSheet - Single Product Template
 *  Presentation layer built from the product-price-tabs mockup.
 *
 *  Written against the real rendered DOM:
 *    div.product.entry-content-wrap
 *      > div.ksk-gallery            (Shop Kit gallery: main image + thumb strip inside)
 *      > div.kske-thumbnails        (empty placeholder sibling)
 *      > div.summary.entry-summary
 *      > div.gspt-fade
 *      > div.woocommerce-tabs
 *
 *  Scoped to body.single-product. Global typography is untouched.
 *  Contains no product data - every value comes from WooCommerce.
 */

body.single-product{
  --gspt-paper:#FBFAF5;
  --gspt-alt:#F2F5EC;
  --gspt-img:#EDEFE6;
  --gspt-img-2:#E7EBDF;
  --gspt-ink:#1F2A22;
  --gspt-body:#3B453A;
  --gspt-body-2:#56604F;
  --gspt-muted:#8B9384;
  --gspt-eyebrow:#7E8C76;
  --gspt-green:#2F6B3F;
  --gspt-green-dk:#1F4A2B;
  --gspt-red:#C2452F;
  --gspt-gold:#C9922B;
  --gspt-rule:#E3E0D4;
  --gspt-rule-2:#D6D2C2;
  --gspt-rule-soft:#E6EADF;
  --gspt-serif:"Newsreader",Georgia,"Times New Roman",serif;
  --gspt-sans:"Karla",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --gspt-mono:"DM Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --gspt-max:1180px;
}

@keyframes gsptSoftIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  body.single-product .woocommerce-tabs .panel{animation:none}
}

/* =================================================================== shell */
body.single-product .content-container.site-container,
body.single-product main.site-main > .wrap,
body.single-product .entry-content-wrap{
  max-width:var(--gspt-max);
  margin-left:auto;
  margin-right:auto;
}
body.single-product .site-main{padding-top:0;padding-bottom:0}
body.single-product div.product{
  font-family:var(--gspt-sans);
  color:var(--gspt-body);
  background:none;
  box-shadow:none;
  border:0;
}

/* ================================================================= buy box */
body.single-product div.product{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  column-gap:clamp(20px,3.5vw,48px);
  row-gap:0;
  align-items:start;
  padding:clamp(16px,4vw,40px) clamp(14px,4vw,48px) clamp(32px,6vw,56px);
}
body.single-product div.product > style{display:none}
/* Shop Kit's gallery holds its own thumbnail strip, so it is one grid item. */
body.single-product.woocommerce div.product > .ksk-gallery,
body.single-product.woocommerce div.product > .woocommerce-product-gallery,
body.single-product.woocommerce div.product > div.images{
  grid-column:1;
  grid-row:1;
  min-width:0;
  width:100%;
  margin:0;
  float:none;
}
/* Empty placeholder sibling Shop Kit prints; never shows content. */
body.single-product div.product > .kske-thumbnails:empty{display:none}
body.single-product div.product > .kske-thumbnails{
  grid-column:1;
  grid-row:2;
  min-width:0;
}
body.single-product.woocommerce div.product > .summary,
body.single-product.woocommerce #content div.product > .summary{
  grid-column:2;
  grid-row:1 / span 2;
  min-width:0;
  margin:0;
  padding:0;
  width:auto;
  float:none;
}
body.single-product div.product > .gspt-fade,
body.single-product div.product > .woocommerce-tabs,
body.single-product div.product > .up-sells,
body.single-product div.product > .related,
body.single-product div.product > .woocommerce-notices-wrapper{
  grid-column:1 / -1;
}


/* WooCommerce's legacy float layout has no place inside a grid. */
body.single-product.woocommerce div.product > .summary,
body.single-product.woocommerce div.product > .ksk-gallery,
body.single-product.woocommerce div.product > .woocommerce-product-gallery,
body.single-product.woocommerce div.product > div.images{
  width:100%;
  max-width:none;
  float:none;
  clear:none;
}
body.single-product.woocommerce div.product > .summary{margin:0;padding:0}
/* the visually-hidden price string must not occupy a flex line */
body.single-product div.product .summary .price .screen-reader-text{
  position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;
}

/* ================================================================= gallery */
body.single-product .ksk-gallery{padding:0}
body.single-product .ksk-gallery .product_image{margin:0}
body.single-product .kadence-product-gallery-main{
  border-radius:20px;
  overflow:hidden;
  background:var(--gspt-img);
}
body.single-product .kadence-product-gallery-main img{
  display:block;
  width:100%;
  height:auto;
  border-radius:20px;
}
/* thumbnail strip, below the frame */
body.single-product .kadence-product-gallery-thumbnails{
  margin-top:10px;
}
body.single-product .kadence-product-gallery-thumbnails img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:12px;
  border:1px solid var(--gspt-rule);
  background:var(--gspt-img);
  cursor:pointer;
  transition:border-color .18s ease;
}
body.single-product .kadence-product-gallery-thumbnails img:hover{
  border-color:var(--gspt-rule-2);
}
body.single-product .kadence-product-gallery-thumbnails .is-active img,
body.single-product .kadence-product-gallery-thumbnails .splide__slide.is-active img,
body.single-product .kadence-product-gallery-thumbnails [aria-selected="true"] img{
  border:2px solid var(--gspt-green);
}
/* pagination dots over the main frame */
body.single-product .kadence-product-gallery-main .splide__pagination{
  bottom:12px;
  gap:6px;
  padding:0;
}
body.single-product .kadence-product-gallery-main .splide__pagination__page{
  width:6px;
  height:6px;
  margin:0;
  border-radius:3px;
  opacity:1;
  background:rgba(251,250,245,.7);
  transition:width .2s ease,background .2s ease;
}
body.single-product .kadence-product-gallery-main .splide__pagination__page.is-active{
  width:18px;
  transform:none;
  background:var(--gspt-gold);
}
/* arrows stay out of the mockup's way */
body.single-product .kadence-product-gallery-main .splide__arrow{
  background:rgba(251,250,245,.94);
  box-shadow:0 10px 26px rgba(0,0,0,.18);
  opacity:0;
  transition:opacity .2s ease;
}
body.single-product .kadence-product-gallery-main:hover .splide__arrow{opacity:1}

/* ==================================================================== info */
body.single-product div.product .summary h1.product_title{
  font-family:var(--gspt-serif);
  font-weight:300;
  font-size:clamp(28px,6.4vw,40px);
  line-height:1.08;
  letter-spacing:-.01em;
  color:var(--gspt-ink);
  margin:10px 0 0;
  padding:0;
}

/* rating - absent when the product has no reviews */
body.single-product div.product .summary .woocommerce-product-rating{
  display:flex;
  align-items:center;
  gap:10px;
  margin:12px 0 0;
  font-family:var(--gspt-sans);
  font-size:13px;
  color:var(--gspt-muted);
}
body.single-product div.product .summary .star-rating{color:var(--gspt-gold)}
body.single-product div.product .summary .woocommerce-review-link{color:var(--gspt-green)}

/* price row */
body.single-product .gs-pricebox{margin:14px 0 0}
body.single-product .gs-price-inner{
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:10px;
}
body.single-product div.product .summary .price,
body.single-product div.product .summary .price ins,
body.single-product div.product .summary .price ins .amount,
body.single-product div.product .summary .price > .amount{
  font-family:var(--gspt-sans);
  font-weight:700;
  font-size:clamp(30px,7vw,40px);
  line-height:1;
  color:var(--gspt-green-dk);
  text-decoration:none;
  background:none;
  margin:0;
}
body.single-product div.product .summary .price{
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:10px;
}
body.single-product div.product .summary .price del,
body.single-product div.product .summary .price del .amount{
  font-family:var(--gspt-sans);
  font-weight:400;
  font-size:16px;
  line-height:1;
  color:var(--gspt-muted);
  text-decoration:line-through;
  opacity:1;
}
body.single-product .gs-pct-badge{
  display:inline-block;
  background:var(--gspt-red);
  color:var(--gspt-paper);
  font-family:var(--gspt-sans);
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  line-height:1;
  padding:6px 10px;
  border-radius:8px;
}

/* short description */
body.single-product div.product .woocommerce-product-details__short-description{
  font-family:var(--gspt-sans);
  font-size:15.5px;
  line-height:1.6;
  color:var(--gspt-body);
  max-width:48ch;
  margin:16px 0 0;
}
body.single-product div.product .woocommerce-product-details__short-description p{margin:0}

/* ============================================================== variations */
body.single-product div.product form.cart{
  margin:22px 0 0;
  padding:22px 0 0;
  border-top:1px solid var(--gspt-rule);
}
body.single-product div.product table.variations{
  width:100%;
  margin:0;
  border:0;
  background:none;
}
body.single-product div.product table.variations,
body.single-product div.product table.variations tbody,
body.single-product div.product table.variations tr,
body.single-product div.product table.variations th,
body.single-product div.product table.variations td{
  display:block;
  border:0;
  padding:0;
  margin:0;
  background:none;
  width:auto;
}
body.single-product div.product table.variations tr + tr{margin-top:20px}

/* label row: attribute name left, chosen value right */
body.single-product div.product table.variations th.label{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  margin:0 0 10px;
}
body.single-product div.product table.variations th.label label{
  font-family:var(--gspt-sans);
  font-weight:700;
  font-size:13px;
  line-height:1;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--gspt-ink);
  margin:0;
  padding:0;
}
body.single-product .gspt-chosen{
  font-family:var(--gspt-sans);
  font-weight:400;
  font-size:13px;
  line-height:1;
  color:var(--gspt-green);
}
body.single-product .gspt-chosen:empty{display:none}

/* Shop Kit radio swatches as mockup pills */
body.single-product .kt-radio-variation-container{margin:0}
body.single-product fieldset.kad_radio_variations{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0;
  padding:0;
  border:0;
}
body.single-product fieldset.kad_radio_variations input[type="radio"]{
  position:absolute;
  opacity:0;
  width:0;
  height:0;
  pointer-events:none;
}
body.single-product fieldset.kad_radio_variations label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  height:46px;
  min-height:46px;
  padding:0 16px;
  margin:0;
  border:1px solid var(--gspt-rule-2);
  border-radius:12px;
  background:var(--gspt-paper);
  color:var(--gspt-body);
  font-family:var(--gspt-sans);
  font-weight:600;
  font-size:14px;
  line-height:1;
  cursor:pointer;
  user-select:none;
  box-shadow:none;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
body.single-product fieldset.kad_radio_variations label:hover{
  border-color:var(--gspt-green);
  color:var(--gspt-green);
}
body.single-product fieldset.kad_radio_variations input[type="radio"]:checked + label{
  background:var(--gspt-green);
  border-color:var(--gspt-green);
  color:var(--gspt-paper);
}
body.single-product fieldset.kad_radio_variations input[type="radio"]:focus-visible + label{
  outline:2px solid var(--gspt-green);
  outline-offset:2px;
}
/* colour swatch: a dot inside the pill, label text beside it */
body.single-product fieldset.kt-image-color-sw label,
body.single-product fieldset.kad_radio_variations label:has(.kt_color_sw_span){
  padding:0 16px;
}
body.single-product fieldset.kad_radio_variations .kt_color_sw_span{
  width:16px;
  height:16px;
  min-width:16px;
  border-radius:50%;
  border:1px solid var(--gspt-rule-2);
  flex:none;
  order:-1;
  display:inline-block;
  margin:0;
  box-shadow:none;
}
body.single-product fieldset.kad_radio_variations input:checked + label .kt_color_sw_span{
  border-color:rgba(251,250,245,.65);
}
body.single-product fieldset.kad_radio_variations .label_text{
  order:1;
  display:inline;
  position:static;
  width:auto;
  height:auto;
  clip:auto;
  font:inherit;
  color:inherit;
  background:none;
  padding:0;
  margin:0;
  opacity:1;
  transform:none;
  white-space:nowrap;
}
/* the native select stays for submission, visually hidden */
body.single-product .kt-radio-variation-container select.kt-no-select2{
  position:absolute;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
  border:0;
}
/* plain select fallback when an attribute has no swatch type */
body.single-product div.product table.variations td.value > select{
  width:100%;
  height:46px;
  padding:0 14px;
  border:1px solid var(--gspt-rule-2);
  border-radius:12px;
  background:var(--gspt-paper);
  font-family:var(--gspt-sans);
  font-size:14px;
  color:var(--gspt-body);
}
/* Native reset link is not part of the mockup's buy box. It can render
   outside div.product, so hide it at the body scope. */
body.single-product a.reset_variations{display:none}

/* ================================================ variation price + stock */
body.single-product .woocommerce-variation-price{margin:18px 0 0}
body.single-product div.product .woocommerce-variation-price .price,
body.single-product div.product .woocommerce-variation-price .price .amount{
  font-size:clamp(24px,5vw,30px);
}
body.single-product .woocommerce-variation-availability p.stock{
  display:flex;
  align-items:center;
  gap:8px;
  margin:10px 0 0;
  font-family:var(--gspt-sans);
  font-weight:500;
  font-size:13px;
  line-height:1;
}
body.single-product p.stock.in-stock{color:var(--gspt-green)}
body.single-product p.stock.out-of-stock,
body.single-product p.stock.available-on-backorder{color:var(--gspt-red)}
body.single-product .woocommerce-variation-availability p.stock::before{
  content:"";
  width:8px;height:8px;
  border-radius:50%;
  background:currentColor;
  display:inline-block;
  flex:none;
}

/* =========================================== quantity + add to cart (mockup) */
body.single-product div.product form.cart .woocommerce-variation-add-to-cart,
body.single-product div.product form.cart.cart:not(.variations_form){
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:nowrap;
  margin-top:24px;
}
body.single-product div.product form.cart .quantity{
  display:flex;
  align-items:center;
  flex:0 0 auto;
  height:56px;
  margin:0;
  padding:0;
  border:1px solid var(--gspt-rule-2);
  border-radius:28px;
  background:var(--gspt-paper);
  overflow:hidden;
}
body.single-product div.product form.cart .quantity input.qty{
  width:54px;
  height:54px;
  min-height:0;
  border:0;
  border-radius:0;
  background:transparent;
  text-align:center;
  font-family:var(--gspt-sans);
  font-weight:600;
  font-size:16px;
  line-height:1;
  color:var(--gspt-ink);
  padding:0;
  box-shadow:none;
  -moz-appearance:textfield;
}
body.single-product div.product form.cart .quantity input.qty::-webkit-outer-spin-button,
body.single-product div.product form.cart .quantity input.qty::-webkit-inner-spin-button{
  -webkit-appearance:none;margin:0;
}
body.single-product .gspt-qty-btn{
  width:46px;
  height:54px;
  border:0;
  background:transparent;
  color:var(--gspt-ink);
  font-family:var(--gspt-sans);
  font-size:19px;
  line-height:1;
  cursor:pointer;
  flex:none;
  padding:0;
}
body.single-product .gspt-qty-btn:hover{color:var(--gspt-green)}
body.single-product div.product form.cart button.single_add_to_cart_button,
body.single-product div.product .summary button.single_add_to_cart_button{
  flex:1 1 auto;
  width:auto;
  height:56px;
  min-height:56px;
  margin:0;
  padding:0 24px;
  float:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border:0;
  border-radius:28px;
  background:var(--gspt-green);
  color:var(--gspt-paper);
  font-family:var(--gspt-sans);
  font-weight:700;
  font-size:15px;
  line-height:1;
  letter-spacing:.05em;
  text-transform:uppercase;
  cursor:pointer;
  box-shadow:none;
  transition:background .2s ease;
}
body.single-product div.product form.cart button.single_add_to_cart_button:hover{
  background:var(--gspt-green-dk);
}
body.single-product div.product form.cart button.single_add_to_cart_button:disabled{
  opacity:.45;
  cursor:not-allowed;
}

/* legacy blocks from the previous design, no longer part of the template */
body.single-product .gs-assure,
body.single-product .gs-perk{display:none}

/* ==================================================================== fade */
body.single-product .gspt-fade{
  height:64px;
  background:linear-gradient(var(--gspt-paper),var(--gspt-alt));
  margin:0 calc(-1 * clamp(14px,4vw,48px));
}

/* ==================================================================== tabs */
body.single-product div.product .woocommerce-tabs{
  background:var(--gspt-alt);
  padding:clamp(10px,2vw,18px) clamp(14px,4vw,48px) clamp(30px,5vw,54px);
  margin:0 calc(-1 * clamp(14px,4vw,48px));
  border:0;
}
body.single-product .gspt-tabs-eyebrow{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:clamp(18px,3vw,28px);
}
body.single-product .gspt-tabs-eyebrow span{
  font-family:var(--gspt-mono);
  font-weight:500;
  font-size:10px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--gspt-eyebrow);
}
body.single-product .gspt-tabs-eyebrow i{
  flex:1;
  height:1px;
  background:linear-gradient(90deg,#D8E0CE,rgba(216,224,206,0));
}
body.single-product div.product .woocommerce-tabs ul.tabs{
  display:flex;
  gap:4px;
  margin:0;
  padding:0;
  list-style:none;
  overflow-x:auto;
  scrollbar-width:none;
  border:0;
  border-bottom:1px solid var(--gspt-rule);
  background:none;
  box-shadow:none;
}
body.single-product div.product .woocommerce-tabs ul.tabs::-webkit-scrollbar{display:none}
body.single-product div.product .woocommerce-tabs ul.tabs::before,
body.single-product div.product .woocommerce-tabs ul.tabs::after,
body.single-product div.product .woocommerce-tabs ul.tabs li::before,
body.single-product div.product .woocommerce-tabs ul.tabs li::after{
  display:none;
  content:none;
  border:0;
  box-shadow:none;
}
body.single-product div.product .woocommerce-tabs ul.tabs li{
  flex:none;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
}
body.single-product div.product .woocommerce-tabs ul.tabs li a{
  display:flex;
  align-items:center;
  height:52px;
  padding:0 14px;
  font-family:var(--gspt-sans);
  font-weight:600;
  font-size:14.5px;
  line-height:1;
  color:var(--gspt-muted);
  white-space:nowrap;
  text-decoration:none;
  background:none;
  border:0;
  border-radius:0;
  transition:color .22s ease,box-shadow .22s ease;
}
body.single-product div.product .woocommerce-tabs ul.tabs li a:hover{color:var(--gspt-body)}
body.single-product div.product .woocommerce-tabs ul.tabs li.active a,
body.single-product div.product .woocommerce-tabs ul.tabs li[aria-selected="true"] a{
  color:var(--gspt-ink);
  background:none;
  box-shadow:inset 0 -3px 0 var(--gspt-green);
}
body.single-product div.product .woocommerce-tabs .panel{
  padding:clamp(22px,4vw,36px) 0;
  margin:0;
  border:0;
  background:none;
  animation:gsptSoftIn .32s ease both;
}
body.single-product div.product .woocommerce-tabs .panel > h1:first-child,
body.single-product div.product .woocommerce-tabs .panel > h2:first-child,
body.single-product div.product .woocommerce-tabs .panel > h3:first-child{
  font-family:var(--gspt-serif);
  font-weight:300;
  font-size:clamp(26px,5.6vw,36px);
  line-height:1.1;
  letter-spacing:-.01em;
  color:var(--gspt-ink);
  margin:0 0 10px;
}
body.single-product div.product .woocommerce-tabs .panel p{
  font-family:var(--gspt-sans);
  font-size:clamp(15px,4vw,17px);
  line-height:1.6;
  color:var(--gspt-body-2);
  max-width:56ch;
}

/* attribute rows as the mockup's cards */
body.single-product div.product .woocommerce-tabs .panel table.shop_attributes{
  display:flex;
  flex-direction:column;
  gap:10px;
  width:100%;
  margin:clamp(20px,3vw,30px) 0 0;
  border:0;
  background:none;
}
body.single-product div.product .woocommerce-tabs .panel table.shop_attributes tbody{display:contents}
body.single-product div.product .woocommerce-tabs .panel table.shop_attributes tr{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:16px 18px;
  border:1px solid var(--gspt-rule-soft);
  border-radius:16px;
  background:var(--gspt-paper);
}
body.single-product div.product .woocommerce-tabs .panel table.shop_attributes th,
body.single-product div.product .woocommerce-tabs .panel table.shop_attributes td{
  border:0;
  padding:0;
  background:none;
  font-style:normal;
}
body.single-product div.product .woocommerce-tabs .panel table.shop_attributes th{
  flex:0 0 34%;
  font-family:var(--gspt-sans);
  font-weight:600;
  font-size:15px;
  line-height:1.35;
  color:var(--gspt-ink);
}
body.single-product div.product .woocommerce-tabs .panel table.shop_attributes td{
  flex:1;
  font-family:var(--gspt-sans);
  font-weight:400;
  font-size:14.5px;
  line-height:1.5;
  color:var(--gspt-body-2);
}
body.single-product div.product .woocommerce-tabs .panel table.shop_attributes td p{
  margin:0;font-size:inherit;max-width:none;
}

/* reviews */
body.single-product #reviews .comment-form input[type=text],
body.single-product #reviews .comment-form input[type=email],
body.single-product #reviews .comment-form textarea{
  border:1px solid var(--gspt-rule-2);
  border-radius:12px;
  background:var(--gspt-paper);
  font-family:var(--gspt-sans);
}
body.single-product #reviews .commentlist li .comment_container{
  padding:16px 18px;
  border:1px solid var(--gspt-rule-soft);
  border-radius:16px;
  background:var(--gspt-paper);
}
body.single-product #reviews .star-rating{color:var(--gspt-gold)}

/* ===================================================== sticky add to cart */
body.single-product .kadence-sticky-add-to-cart{
  background:rgba(251,250,245,.96);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-top:1px solid var(--gspt-rule);
  padding:10px clamp(14px,4vw,20px) calc(10px + env(safe-area-inset-bottom));
}
body.single-product .kadence-sticky-add-to-cart-title{
  font-family:var(--gspt-sans);
  font-weight:600;
  font-size:14px;
  line-height:1.2;
  color:var(--gspt-ink);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
body.single-product .kadence-sticky-add-to-cart-action-price .amount{
  font-family:var(--gspt-sans);
  font-weight:700;
  color:var(--gspt-green-dk);
}
body.single-product .kadence-sticky-add-to-cart-action-price del .amount{
  font-weight:400;
  color:var(--gspt-muted);
}
body.single-product .kadence-sticky-add-to-cart .button{
  height:50px;
  padding:0 20px;
  border-radius:25px;
  background:var(--gspt-green);
  color:var(--gspt-paper);
  font-family:var(--gspt-sans);
  font-weight:700;
  font-size:14px;
  letter-spacing:.04em;
  white-space:nowrap;
  border:0;
}
body.single-product .kadence-sticky-add-to-cart .button:hover{background:var(--gspt-green-dk)}
body.single-product .kadence-sticky-add-to-cart img{
  width:46px;height:46px;
  border-radius:10px;
  object-fit:cover;
}

/* ============================================================== responsive */
@media (max-width:900px){
  body.single-product div.product{
    grid-template-columns:minmax(0,1fr);
    row-gap:0;
  }
  body.single-product div.product > .ksk-gallery,
  body.single-product div.product > .woocommerce-product-gallery,
  body.single-product div.product > .kske-thumbnails,
  body.single-product.woocommerce div.product > .summary,
body.single-product.woocommerce #content div.product > .summary{
    grid-column:1;
    grid-row:auto;
  }
  body.single-product div.product .summary h1.product_title{margin-top:18px}
}
@media (max-width:600px){
  body.single-product div.product{padding-left:14px;padding-right:14px}
  body.single-product div.product .woocommerce-tabs,
  body.single-product .gspt-fade{margin-left:-14px;margin-right:-14px}
  body.single-product div.product .woocommerce-tabs{padding-left:14px;padding-right:14px}
  body.single-product div.product form.cart button.single_add_to_cart_button{
    font-size:14px;letter-spacing:.03em;padding:0 16px;
  }
  body.single-product div.product .woocommerce-tabs .panel table.shop_attributes tr{
    flex-direction:column;gap:4px;
  }
  body.single-product div.product .woocommerce-tabs .panel table.shop_attributes th{flex:none}
}

/* ---- final alignment with the mockup ---------------------------------- */
/* Mockup order is: sale price, then struck original, then the badge.
   WooCommerce prints <del> before <ins>, so reorder the flex children. */
body.single-product div.product .summary .price ins{order:1}
body.single-product div.product .summary .price del{order:2}
body.single-product .gs-pct-badge{order:3}
body.single-product div.product .summary .price{align-items:baseline}

/* Square gallery frame, as the mockup and the Shop Kit 1:1 setting intend. */
body.single-product .kadence-product-gallery-main .splide__slide,
body.single-product .kadence-product-gallery-main .splide__track{
  border-radius:20px;
}
body.single-product .kadence-product-gallery-main img{
  aspect-ratio:1/1;
  object-fit:cover;
  width:100%;
  height:auto;
}

/* Native reset link is not part of the mockup's buy box. */
body.single-product div.product a.reset_variations{display:none}
body.single-product div.product .variations_form .reset_variations_alert{display:none}

/* Tab bar sits on the alt ground with no stray theme chrome. */
body.single-product div.product .woocommerce-tabs ul.tabs li a::after,
body.single-product div.product .woocommerce-tabs ul.tabs li a::before{content:none}

body.single-product.woocommerce div.product form.cart a.reset_variations,
body.single-product.woocommerce div.product .variations a.reset_variations{
  display:none;
}


/* ===================== corrections =================================== */
/* 1. Quantity field was being flex-shrunk to zero width. Pin all three
      children so the stepper is always visible on desktop. */
body.single-product.woocommerce div.product form.cart .quantity{
  flex:0 0 auto;
  width:auto;
  min-width:146px;
  overflow:visible;
}
body.single-product.woocommerce div.product form.cart .quantity input.qty{
  flex:0 0 54px;
  width:54px;
  min-width:54px;
  max-width:54px;
  height:54px;
  opacity:1;
  visibility:visible;
  display:block;
}
body.single-product .gspt-qty-btn{flex:0 0 46px;min-width:46px}

/* 2. Add to Cart: mockup type scale, no inherited large-button sizing. */
body.single-product.woocommerce div.product form.cart button.single_add_to_cart_button,
body.single-product.woocommerce div.product .summary button.single_add_to_cart_button{
  font-family:var(--gspt-sans);
  font-size:15px;
  font-weight:700;
  line-height:1;
  letter-spacing:.05em;
  text-transform:uppercase;
  height:56px;
  min-height:56px;
}

/* 3. Colour swatch: a crisp dot that reads on light and dark pills. */
body.single-product fieldset.kad_radio_variations .kt_color_sw_span{
  width:18px;
  height:18px;
  min-width:18px;
  border-radius:50%;
  border:1px solid rgba(31,42,34,.22);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);
  flex:none;
  order:-1;
}
body.single-product fieldset.kad_radio_variations input:checked + label .kt_color_sw_span{
  border-color:rgba(251,250,245,.9);
  box-shadow:inset 0 0 0 1px rgba(31,42,34,.18);
}
body.single-product fieldset.kt-image-color-sw label{gap:10px;padding:0 18px}
body.single-product fieldset.kt-image-color-sw .label_text{
  order:1;font-family:var(--gspt-sans);font-weight:600;font-size:14px;line-height:1;
}

/* 4. Tabs centred on desktop, still scrollable on small screens. */
@media (min-width:901px){
  body.single-product.woocommerce div.product .woocommerce-tabs ul.tabs{
    justify-content:center;
  }
  body.single-product .gspt-tabs-eyebrow{justify-content:center}
  body.single-product .gspt-tabs-eyebrow i{display:none}
  body.single-product div.product .woocommerce-tabs .panel{max-width:900px;margin:0 auto}
}

/* 5. Mobile breathing room. */
@media (max-width:600px){
  body.single-product div.product{
    padding:18px 18px 40px;
    row-gap:8px;
  }
  body.single-product div.product .summary h1.product_title{margin-top:22px}
  body.single-product .gs-pricebox{margin-top:16px}
  body.single-product div.product .woocommerce-product-details__short-description{margin-top:14px}
  body.single-product div.product form.cart{margin-top:24px;padding-top:24px}
  body.single-product div.product table.variations tr + tr{margin-top:22px}
  body.single-product .gspt-fade,
  body.single-product div.product .woocommerce-tabs{margin-left:-18px;margin-right:-18px}
  body.single-product div.product .woocommerce-tabs{padding:14px 18px 40px}
  body.single-product div.product .woocommerce-tabs .panel{padding:24px 0}
  body.single-product .kadence-product-gallery-thumbnails{margin-top:12px}
}


/* ============ round 2 corrections ================================== */
/* Softer tab ground: a hair off the paper rather than a green band. */
body.single-product{--gspt-alt:#F7F7F2}

/* Kadence's unboxed content style zeroes the wrapper padding, which beat
   the earlier rule and also let the negative margins overflow the viewport.
   Match its specificity so the side padding actually lands. */
body.single-product.woocommerce div.product.entry-content-wrap{
  padding:clamp(16px,4vw,40px) clamp(16px,4vw,48px) clamp(32px,6vw,56px);
}

@media (max-width:900px){
  body.single-product.woocommerce div.product.entry-content-wrap{
    padding:16px 16px 40px;
    row-gap:0;
  }
  /* Gallery sat well clear of the title; close it up. */
  body.single-product .ksk-gallery{margin-bottom:0;padding-bottom:0}
  body.single-product .ksk-gallery .product_image{margin-bottom:0}
  body.single-product .kadence-product-gallery-thumbnails{margin-top:8px;margin-bottom:0}
  body.single-product div.product .summary h1.product_title{margin-top:14px}
  body.single-product .gs-pricebox{margin-top:12px}
  body.single-product div.product .woocommerce-product-details__short-description{margin-top:12px}
  body.single-product div.product form.cart{margin-top:18px;padding-top:18px}
  body.single-product div.product table.variations tr + tr{margin-top:18px}
  /* keep the full-bleed bands exactly one padding wide */
  body.single-product .gspt-fade,
  body.single-product div.product .woocommerce-tabs{margin-left:-16px;margin-right:-16px}
  body.single-product div.product .woocommerce-tabs{padding:14px 16px 36px}
}

/* No eyebrow rule above the tab bar any more. */
body.single-product .gspt-tabs-eyebrow{display:none}

/* Tabs band sits closer to the buy box on small screens. */
@media (max-width:900px){
  body.single-product .gspt-fade{height:28px}
  body.single-product.woocommerce div.product .woocommerce-tabs{padding-top:4px}
  body.single-product.woocommerce div.product .woocommerce-tabs .panel{padding-top:18px}
}


/* ===== gallery load-state fixes 2026-09-15 ===== */
/* WooCommerce core sets padding-bottom:1em on div.images, and .ksk-gallery
   carries that class. Its selector (.woocommerce div.product div.images,
   0-2-2) outranks body.single-product .ksk-gallery (0-2-1), which is where
   the stray gap under the thumbnails came from. */
body.single-product.woocommerce div.product > .ksk-gallery,
body.single-product.woocommerce div.product > div.images{
  padding-bottom:0;
}

/* Kadence mounts Splide after first paint. Until .is-initialized lands, all
   seven slides sit in normal flow at full width, so the gallery paints about
   seven screens tall and then snaps to one - the oversize-then-shrink jump.
   Reserve the square and show only the first slide until Splide takes over. */
body.single-product .kadence-product-gallery-main:not(.is-initialized){
  aspect-ratio:1/1;
  overflow:hidden;
}
body.single-product .kadence-product-gallery-main:not(.is-initialized) .splide__list{
  display:block;
}
body.single-product .kadence-product-gallery-main:not(.is-initialized) .splide__slide:not(:first-child){
  display:none;
}

/* Same for the thumb strip: lay it out in one clipped row at the column count
   Splide is about to use, so it never stacks vertically then collapses.
   Breakpoints and counts mirror the Shop Kit gallery settings (4/5/7). */
body.single-product .kadence-product-gallery-thumbnails:not(.is-initialized){
  overflow:hidden;
}
body.single-product .kadence-product-gallery-thumbnails:not(.is-initialized) .splide__list{
  display:flex;
  gap:4px;
}
body.single-product .kadence-product-gallery-thumbnails:not(.is-initialized) .splide__slide{
  flex:0 0 calc((100% - 12px) / 4);
  min-width:0;
}
@media (min-width:768px){
  body.single-product .kadence-product-gallery-thumbnails:not(.is-initialized) .splide__slide{
    flex-basis:calc((100% - 16px) / 5);
  }
}
@media (min-width:1025px){
  body.single-product .kadence-product-gallery-thumbnails:not(.is-initialized) .splide__slide{
    flex-basis:calc((100% - 24px) / 7);
  }
}


/* ===== colour swatch shape 2026-09-15 ===== */
/* Shop Kit's swatch shape is now 'square', so kt-swatch-round no longer puts
   border-radius:50% on the label. On a 127x46 label that rendered as an
   ellipse rather than a pill and did not match the plug-type buttons beside
   it; the label now inherits the same 12px radius. The colour chip inside
   still wants to be a circle, which the shape setting can no longer give it. */
body.single-product fieldset.kad_radio_variations .kt_color_sw_span{
  border-radius:50%;
  overflow:hidden;
  flex:none;
  box-shadow:inset 0 0 0 1px rgba(31,42,34,.14);
}


/* ===== swatch selected ring 2026-09-15 ===== */
/* Kadence styles the selected swatch via label.selectedValue, and WP Rocket's
   Used CSS pass can drop a :checked-only rule because that state is not in
   the static HTML it analyses - which is how the ring reverted to Kadence's
   palette colour. Match both states so the brand green holds either way. */
/* Kadence pads its selector with :not(.used-for-specificity) x3, landing at
   0-6-1. Beaten here with real DOM depth rather than another padding hack or
   !important: body > div.product > form.cart > table.variations > fieldset
   > label is 0-6-6. */
body.single-product div.product form.cart table.variations fieldset.kad_radio_variations input[type="radio"]:checked + label,
body.single-product div.product form.cart table.variations fieldset.kad_radio_variations label.selectedValue{
  border-color:var(--gspt-green);
}
