/* =====================================================================
   PSG SITEWIDE SKIN  (psg-skin.css)
   Restyles the stock Divi/WooCommerce chrome on INNER pages to match the
   new brand, so the site feels consistent with the custom homepage.
   Scope: everything is prefixed with `body.psg-skin` so it only touches
   front-end pages, and it RECOLOURS/RETYPES — it never hides content or
   prices and never changes URLs or layout structure.
   Tokens (--psg-*) come from style.css.
   ===================================================================== */

/* ---- Brand typography sitewide (Poppins is now self-hosted) ---- */
body.psg-skin,
body.psg-skin #main-header,
body.psg-skin #et-top-navigation,
body.psg-skin .et_pb_text,
body.psg-skin p,
body.psg-skin li,
body.psg-skin .woocommerce,
body.psg-skin input,
body.psg-skin select,
body.psg-skin textarea{
  font-family:var(--psg-font);
}
body.psg-skin h1, body.psg-skin h2, body.psg-skin h3,
body.psg-skin h4, body.psg-skin h5, body.psg-skin h6,
body.psg-skin .et_pb_module h1, body.psg-skin .et_pb_module h2,
body.psg-skin .et_pb_module h3, body.psg-skin .et_pb_module h4,
body.psg-skin .woocommerce-loop-product__title,
body.psg-skin .product_title{
  font-family:var(--psg-font);
  letter-spacing:-.01em;
}

/* ---- Top info bar: standardise to brand green sitewide (was inconsistent:
   green on some pages, Divi-default blue #2ea3f2 on others). White text. ---- */
body.psg-skin #top-header{ background-color:var(--psg-green) !important; }
body.psg-skin #top-header,
body.psg-skin #top-header a,
body.psg-skin #top-header .et_pb_menu__logo-wrap,
body.psg-skin #top-header #et-secondary-menu li a{ color:#fff !important; }
body.psg-skin #top-header a:hover{ color:rgba(255,255,255,.8) !important; }

/* ---- Header nav: brand hover + active ---- */
body.psg-skin #top-menu li a:hover,
body.psg-skin #et-top-navigation .et-menu li a:hover,
body.psg-skin #top-menu li.current-menu-item > a{
  color:var(--psg-brand) !important;
}
/* search icon hover */
body.psg-skin #et_top_search #et_search_icon:hover:before{ color:var(--psg-brand); }

/* ---- Buttons: Divi + WooCommerce → brand green (act) ---- */
body.psg-skin .et_pb_button,
body.psg-skin .woocommerce a.button,
body.psg-skin .woocommerce button.button,
body.psg-skin .woocommerce input.button,
body.psg-skin .woocommerce #respond input#submit,
body.psg-skin .woocommerce .single_add_to_cart_button,
body.psg-skin .woocommerce-page a.button{
  background-color:var(--psg-green) !important;
  color:#fff !important;
  border:0 !important;
  border-radius:var(--psg-radius-sm) !important;
  padding:.85em 1.6em !important;
  font-weight:600 !important;
  font-family:var(--psg-font) !important;
  transition:background .15s ease !important;
}
body.psg-skin .et_pb_button:hover,
body.psg-skin .woocommerce a.button:hover,
body.psg-skin .woocommerce button.button:hover,
body.psg-skin .woocommerce input.button:hover,
body.psg-skin .woocommerce .single_add_to_cart_button:hover,
body.psg-skin .woocommerce #respond input#submit:hover{
  background-color:var(--psg-green-hover) !important;
  color:#fff !important;
}
/* Divi buttons draw an arrow via :after — remove for a flat brand button */
body.psg-skin .et_pb_button:after{ content:none !important; }

/* WooCommerce "add to cart" states (variable products):
   - disabled / awaiting a variation → neutral grey (reads as inert, on-brand)
   - active → brand green (higher specificity than Divi's default rule) */
/* NB: Divi's Theme-Builder product template does NOT wrap the add-to-cart button
   in a .woocommerce ancestor, so these rules must target the button class
   directly (not `.woocommerce .single_add_to_cart_button`). */
body.psg-skin #page-container .single_add_to_cart_button.disabled,
body.psg-skin #page-container .single_add_to_cart_button.wc-variation-selection-needed{
  background-color:#e6ebf0 !important;
  color:#8a97a5 !important;
  border:1px solid #d4dbe3 !important;
  cursor:not-allowed;
}
body.psg-skin #page-container .single_add_to_cart_button:not(.disabled),
body.psg-skin #page-container button.button.alt:not(.disabled),
body.psg-skin #page-container a.button.alt:not(.disabled){
  background-color:var(--psg-green) !important;
  color:#fff !important;
  border:0 !important;
}
body.psg-skin #page-container .single_add_to_cart_button:not(.disabled):hover,
body.psg-skin #page-container button.button.alt:not(.disabled):hover{
  background-color:var(--psg-green-hover) !important;
}
/* "add to cart" that is the primary purchase action stays green; the
   WooCommerce "view cart" secondary link gets an outline treatment */
body.psg-skin .woocommerce a.added_to_cart{
  background:transparent !important;color:var(--psg-brand) !important;
  border:1.5px solid var(--psg-brand) !important;border-radius:var(--psg-radius-sm) !important;
  padding:.7em 1.2em !important;margin-left:8px;font-weight:600;text-decoration:none;
}

/* ---- Prices: keep them fully visible; just brand the colour ---- */
body.psg-skin .woocommerce .price,
body.psg-skin .woocommerce ul.products li.product .price,
body.psg-skin .woocommerce div.product p.price,
body.psg-skin .woocommerce div.product span.price{
  color:var(--psg-ink);
  font-weight:700;
}

/* ---- WooCommerce niceties ---- */
body.psg-skin .woocommerce ul.products li.product{
  border-radius:var(--psg-radius);
}
body.psg-skin .woocommerce-breadcrumb{
  color:var(--psg-muted);font-size:14px;
}
body.psg-skin .woocommerce-breadcrumb a{ color:var(--psg-brand); }
/* sale / new badges use brand green */
body.psg-skin .woocommerce span.onsale{
  background:var(--psg-green) !important;color:#fff !important;border-radius:999px;
}
/* pagination current page → brand */
body.psg-skin .woocommerce nav.woocommerce-pagination ul li span.current,
body.psg-skin .page-numbers.current{
  background:var(--psg-brand) !important;color:#fff !important;border-color:var(--psg-brand) !important;
}

/* =====================================================================
   FOOTER — inner pages use the rich brand footer (injected via wp_footer);
   hide Divi's own Theme-Builder / classic footer so there's no duplicate.
   (The homepage template never renders these, so this only affects inner pages.)
   ===================================================================== */
body.psg-skin .et-l--footer,
body.psg-skin #main-footer,
body.psg-skin #footer-bottom{ display:none !important; }
/* the injected footer sits after #page-container; give it a clean top edge */
body.psg-skin > .psg-footer,
#page-container + .psg-footer{ margin-top:0; }

/* =====================================================================
   INSTANT-QUOTE PAGE → full width (drop the Divi sidebar so the
   calculator has room to breathe and convert)
   ===================================================================== */
body.psg-quotepage #main-content #sidebar{ display:none !important; }
body.psg-quotepage #main-content #left-area{
  width:100% !important;
  float:none !important;
  padding:0 !important;
}
body.psg-quotepage #main-content .container{
  width:92% !important;
  max-width:1080px !important;
}
body.psg-quotepage .entry-title,
body.psg-quotepage h1.entry-title{
  text-align:center;font-family:var(--psg-font);color:var(--psg-ink);
  font-weight:800;margin-bottom:24px;
}
/* =====================================================================
   MOBILE HARDENING (fixed homepage header + notched iPhones)
   The homepage header is position:fixed; keep it clear of the notch/status
   bar and give the hero a little safe-area breathing room. viewport-fit=cover
   is set on the homepage <meta>, so env(safe-area-inset-*) resolves.
   ===================================================================== */
@supports (padding:max(0px)){
  .psg-header__inner{
    padding-left:max(24px, env(safe-area-inset-left));
    padding-right:max(24px, env(safe-area-inset-right));
  }
  @media (max-width:860px){
    .psg-header__inner{ padding-top:max(10px, env(safe-area-inset-top)); }
    .psg-hero{ padding-top:max(92px, calc(72px + env(safe-area-inset-top))); }
  }
}

/* =====================================================================
   SANDBLAST — INNER PAGES (2026-09-03): shop, product, cart/checkout,
   instant-quote, contact join the homepage's glass language.
   ===================================================================== */

/* the through-glass ground + veil on every front-end page (home keeps
   its own richer stack from psg.css) */
body.psg-skin:not(.psg-home){background:
  linear-gradient(180deg, rgba(244,250,253,.68) 0%, rgba(244,250,253,.5) 30%, rgba(244,250,253,.62) 100%),
  url(../img/psg-glass-bg3.webp?v=2) center / cover no-repeat,
  var(--psg-page) !important;}
@media (min-width:1025px){
  body.psg-skin:not(.psg-home){background-attachment:fixed,fixed,scroll !important;}
}

/* global gloss sweep on every page (keyframes live in psg.css) */
body.psg-skin::after{
  content:"";position:fixed;top:-12%;bottom:-12%;left:0;width:44%;
  background:linear-gradient(100deg,
    transparent 0%, rgba(255,255,255,.05) 34%,
    rgba(255,255,255,.34) 47%, rgba(205,233,255,.20) 53%,
    rgba(255,255,255,.05) 66%, transparent 100%);
  transform:translateX(-160%) skewX(-14deg);
  animation:psgGlare 11s ease-in-out infinite;
  pointer-events:none;z-index:99990;}
@media (prefers-reduced-motion: reduce){ body.psg-skin::after{animation:none !important;} }

/* Divi header becomes a frosted bar (top bar stays vinyl green) */
body.psg-skin #main-header{
  background:rgba(255,255,255,.72) !important;
  -webkit-backdrop-filter:blur(14px) saturate(1.15);
  backdrop-filter:blur(14px) saturate(1.15);
  box-shadow:0 0 26px rgba(255,255,255,.5), 0 8px 24px rgba(30,80,140,.07) !important;}

/* WooCommerce product cards: etched frost, photos melted into it */
body.psg-skin .woocommerce ul.products li.product,
body.psg-skin .woocommerce-page ul.products li.product{
  background:rgba(255,255,255,.5) !important;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border:0 !important;border-radius:16px !important;
  box-shadow:0 0 26px rgba(255,255,255,.55), 0 8px 24px rgba(30,80,140,.06) !important;
  padding:12px 12px 16px !important;overflow:hidden;}
body.psg-skin .woocommerce ul.products li.product img{
  mix-blend-mode:multiply;border-radius:10px;
  filter:saturate(.92) contrast(1.05) brightness(1.02);}
body.psg-skin .woocommerce div.product div.images img{
  mix-blend-mode:multiply;border-radius:12px;}

/* description/review tabs: etched (double-ID beats Divi's dynamic CSS) */
body.psg-skin #page-container #main-content .woocommerce-tabs ul.tabs{background:transparent !important;padding-left:0 !important;}
body.psg-skin #page-container #main-content .woocommerce-tabs ul.tabs li{
  background:rgba(255,255,255,.42) !important;border:0 !important;border-radius:10px 10px 0 0 !important;}
body.psg-skin #page-container #main-content .woocommerce-tabs ul.tabs li.active{background:rgba(255,255,255,.62) !important;}
body.psg-skin #page-container #main-content .woocommerce-tabs .panel{
  background:rgba(255,255,255,.5) !important;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border:0 !important;border-radius:0 14px 14px 14px !important;padding:22px 26px !important;
  box-shadow:0 0 26px rgba(255,255,255,.5), 0 8px 24px rgba(30,80,140,.05);}

/* cart + checkout surfaces: etched panels, fields stay clear windows */
body.psg-skin .woocommerce table.shop_table,
body.psg-skin .woocommerce .cart_totals{
  background:rgba(255,255,255,.52) !important;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border:0 !important;border-radius:14px !important;
  box-shadow:0 0 26px rgba(255,255,255,.5), 0 8px 24px rgba(30,80,140,.05);}
body.psg-skin .woocommerce table.shop_table td,
body.psg-skin .woocommerce table.shop_table th{border-color:rgba(120,160,195,.18) !important;}
body.psg-skin input,body.psg-skin textarea,body.psg-skin select{
  background:rgba(255,255,255,.85) !important;border:1px solid rgba(120,160,195,.35) !important;
  border-radius:8px !important;}

/* instant-quote calculator: etched form + result panes */
body.psg-skin .psgq-form,
body.psg-skin .psgq-result{
  background:rgba(255,255,255,.5) !important;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border:0 !important;
  box-shadow:0 0 30px rgba(255,255,255,.55), 0 10px 28px rgba(30,80,140,.06) !important;}
body.psg-skin .psgq-line{background:rgba(255,255,255,.55) !important;border:0 !important;}
body.psg-skin .psgq-extras,
body.psg-skin .psgq-customer{border-color:rgba(120,160,195,.3) !important;}

/* sidebar widgets (search page): etched chip */
body.psg-skin #sidebar .et_pb_widget{padding:14px;border-radius:12px;
  background:rgba(255,255,255,.45);}

/* Divi paints opaque white containers over the body — let the glass through */
body.psg-skin #page-container,
body.psg-skin #main-content,
body.psg-skin #left-area,
body.psg-skin .et_pb_section,
body.psg-skin .et_pb_row,
body.psg-skin .et_pb_column{background-color:transparent !important;}
/* Divi's default 1px image borders fight the etched look */
body.psg-skin .woocommerce ul.products li.product img,
body.psg-skin .woocommerce div.product div.images img{border:0 !important;}

/* Divi's shop module omits the .woocommerce wrapper — selector-proof etched cards */
body.psg-skin ul.products li.product{
  background:rgba(255,255,255,.5) !important;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border:0 !important;border-radius:16px !important;
  box-shadow:0 0 26px rgba(255,255,255,.55), 0 8px 24px rgba(30,80,140,.06) !important;
  padding:14px 14px 18px !important;overflow:hidden;}
body.psg-skin ul.products li.product img{
  mix-blend-mode:multiply;border:0 !important;border-radius:10px;
  filter:saturate(.92) contrast(1.05) brightness(1.02);}
body.psg-skin ul.products li.product .et_shop_image{display:block;border-radius:10px;overflow:hidden;}

/* shop images: same feathered submerge into the frost */
body.psg-skin ul.products li.product img,
body.psg-skin .woocommerce div.product div.images img{
  -webkit-mask-image:radial-gradient(120% 120% at 50% 45%, #000 58%, rgba(0,0,0,.55) 78%, transparent 97%);
  mask-image:radial-gradient(120% 120% at 50% 45%, #000 58%, rgba(0,0,0,.55) 78%, transparent 97%);
}

/* FIX: blend container, mask image (mask kills blend on same element) */
body.psg-skin ul.products li.product img,
body.psg-skin .woocommerce div.product div.images img{mix-blend-mode:normal;}
body.psg-skin ul.products li.product .et_shop_image,
body.psg-skin .woocommerce-product-gallery__image,
body.psg-skin .woocommerce div.product div.images{mix-blend-mode:multiply;}

/* FINAL shop-photo recipe: multiply on img, no masks, zoom-crop edges */
body.psg-skin ul.products li.product .et_shop_image,
body.psg-skin .woocommerce-product-gallery__image,
body.psg-skin .woocommerce div.product div.images{mix-blend-mode:normal;}
body.psg-skin ul.products li.product .et_shop_image{overflow:hidden;border-radius:10px;}
body.psg-skin ul.products li.product img,
body.psg-skin .woocommerce div.product div.images img{
  mix-blend-mode:multiply;
  -webkit-mask-image:none;mask-image:none;
  transform:scale(1.05);
}

/* =====================================================================
   2026-09-03 owner directives: green top bar GONE sitewide; cart lives
   in the main header; compact sandblasted price list.
   ===================================================================== */

/* kill the green top bar everywhere (contact details live in footer/contact) */
body.psg-skin #top-header{display:none !important;}
body.psg-skin #main-header{top:0 !important;}
/* logged-in admins: keep the fixed header below the WP admin bar (the top:0
   above — added when the old green top-bar was removed — overrode Divi's own
   admin-bar offset and clipped the header on every inner page) */
body.psg-skin.admin-bar #main-header{top:32px !important;}
@media (max-width:782px){body.psg-skin.admin-bar #main-header{top:46px !important;}}
/* NB: keep Divi's inline #page-container padding-top (it recalculates to the
   main-header height once #top-header is hidden) */

/* cart item in the Divi primary menu */
body.psg-skin #top-menu .psg-cartitem > a{position:relative;display:inline-flex;align-items:center;padding-right:14px !important;}
body.psg-skin .psg-cartitem svg{display:block;}
.psg-cart-count{
  position:absolute;top:-4px;right:-2px;min-width:16px;height:16px;padding:0 4px;
  border-radius:999px;background:var(--psg-orange);color:#14231A;
  font-size:10.5px;font-weight:800;line-height:16px;text-align:center;}
.psg-cart-count.is-empty{display:none;}

/* price-list page: full width + etched panes */
body.psg-plpage #main-content #sidebar{display:none !important;}
body.psg-plpage #main-content #left-area{width:100% !important;float:none !important;padding:0 !important;}
body.psg-plpage #main-content .container{width:92% !important;max-width:1100px !important;}
body.psg-plpage h1.entry-title{text-align:center;font-weight:800;}

.psg-pricelist{margin:8px 0 40px;}
.psg-pl-intro{text-align:center;color:var(--psg-muted);max-width:60ch;margin:0 auto 22px;}
.psg-pl-intro a{color:var(--psg-brand-dark);font-weight:700;}
.psg-pl-controls{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:center;margin-bottom:22px;}
.psg-pricelist #psgPlSearch{
  flex:1 1 260px;max-width:340px;padding:12px 16px;font-size:15px;
  background:rgba(255,255,255,.85) !important;border:1px solid rgba(120,160,195,.35) !important;border-radius:999px !important;}
.psg-pl-pills{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;}
.psg-pl-pill{
  padding:9px 16px;border:0;border-radius:999px;cursor:pointer;font-weight:700;font-size:13.5px;
  background:rgba(255,255,255,.5);color:var(--psg-ink);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  box-shadow:0 0 16px rgba(255,255,255,.5);transition:background .15s,color .15s;}
.psg-pl-pill:hover{background:rgba(255,255,255,.75);}
.psg-pl-pill.is-active{background:var(--psg-brand);color:#fff;}
.psg-pl-group{display:none;}
.psg-pl-group.is-active{display:block;}
.psg-pl-group h2{
  font-size:20px;font-weight:800;color:var(--psg-ink);margin:18px 0 12px;text-align:left;}
.psg-pl-group h2 span{font-size:13px;font-weight:600;color:var(--psg-muted);margin-left:8px;}
.psg-pl-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;}
@media (max-width:760px){.psg-pl-grid{grid-template-columns:1fr;}}
.psg-pl-row{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:11px 16px;border-radius:10px;
  background:rgba(255,255,255,.5);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  box-shadow:0 0 14px rgba(255,255,255,.45);}
.psg-pl-name{font-size:14.5px;color:var(--psg-ink);font-weight:600;}
.psg-pl-price{font-size:14.5px;font-weight:800;color:var(--psg-ink);white-space:nowrap;}
.psg-pl-price em{font-style:normal;font-weight:600;color:var(--psg-muted);font-size:12px;}
.psg-pl-por{
  font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;
  color:var(--psg-brand-dark);background:rgba(0,124,194,.10);padding:5px 10px;border-radius:999px;}
.psg-pl-none{text-align:center;color:var(--psg-muted);padding:26px 0;}

.psg-pl-title{text-align:center;font-weight:800;font-size:clamp(26px,3vw,34px);color:var(--psg-ink);margin:6px 0 10px;}

/* ---- price list: real etched CARDS (padding, stacked layout, quote button) ---- */
.psg-pl-grid{grid-template-columns:repeat(3,1fr);gap:16px;}
@media (max-width:980px){.psg-pl-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:640px){.psg-pl-grid{grid-template-columns:1fr;}}
.psg-pl-card{
  display:flex;flex-direction:column;align-items:flex-start;gap:12px;
  padding:20px 20px 18px;border-radius:16px;
  background:rgba(255,255,255,.55);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 0 24px rgba(255,255,255,.5), 0 8px 22px rgba(30,80,140,.06);
  transition:transform .15s ease, box-shadow .2s ease;}
.psg-pl-card:hover{transform:translateY(-3px);
  box-shadow:0 0 30px rgba(255,255,255,.6), 0 14px 28px rgba(30,80,140,.10);}
.psg-pl-card .psg-pl-name{font-size:15.5px;font-weight:700;line-height:1.35;}
.psg-pl-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;margin-top:auto;}
.psg-pl-card .psg-pl-price{font-size:16px;}
.psg-pl-btn{
  padding:8px 14px;border:1.5px solid var(--psg-green);border-radius:999px;
  color:var(--psg-green);font-weight:700;font-size:13px;white-space:nowrap;
  transition:background .15s,color .15s;}
.psg-pl-btn:hover{background:var(--psg-green);color:#fff;}

/* ---- SITEWIDE ROUNDED-CORNER CONSISTENCY (cards 16px, images 14px) ---- */
body.psg-skin .et_pb_image,
body.psg-skin .et_pb_image .et_pb_image_wrap,
body.psg-skin .et_pb_image img{border-radius:14px;overflow:hidden;}
body.psg-skin .et_pb_gallery_image,
body.psg-skin .et_pb_gallery_image a,
body.psg-skin .et_pb_gallery_image img{border-radius:14px;overflow:hidden;}
body.psg-skin ul.products li.product img,
body.psg-skin ul.products li.product .et_shop_image,
body.psg-skin ul.products li.product .et_shop_image > a{border-radius:12px;overflow:hidden;}
body.psg-skin .woocommerce div.product div.images img,
body.psg-skin .woocommerce-product-gallery__image{border-radius:14px;overflow:hidden;}
body.psg-skin .et_pb_blurb_content .et_pb_main_blurb_image img{border-radius:14px;}
body.psg-skin iframe{border-radius:14px;}

/* =====================================================================
   HOVER LIGHT-STROKE sitewide (2026-09-04, owner request): the same
   one-shot gloss sweep as the homepage CTAs, on every button and card.
   ::before is used — Divi reserves .et_pb_button:after for its arrow
   (which we suppress), and product/gallery cards use ::after for frost.
   (Keyframes psgSheenOnce live in psg.css, which loads sitewide.)
   ===================================================================== */
body.psg-skin .et_pb_button,
body.psg-skin a.button,
body.psg-skin button.button,
body.psg-skin #page-container .single_add_to_cart_button,
body.psg-skin #page-container button.button.alt,
body.psg-skin .psgq-submit,
body.psg-skin .psgq-add,
.psg-pl-btn,
body.psg-skin ul.products li.product,
.psg-pl-card,
body.psg-skin .et_pb_gallery_image{position:relative;overflow:hidden;}

body.psg-skin .et_pb_button::before,
body.psg-skin a.button::before,
body.psg-skin button.button::before,
body.psg-skin #page-container .single_add_to_cart_button::before,
body.psg-skin #page-container button.button.alt::before,
body.psg-skin .psgq-submit::before,
body.psg-skin .psgq-add::before,
.psg-pl-btn::before,
body.psg-skin ul.products li.product::before,
.psg-pl-card::before,
body.psg-skin .et_pb_gallery_image::before{
  content:"";position:absolute;top:-30%;bottom:-30%;left:0;width:46%;z-index:3;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.45) 50%,transparent);
  transform:translateX(-180%) skewX(-18deg);pointer-events:none;}

body.psg-skin .et_pb_button:hover::before,
body.psg-skin a.button:hover::before,
body.psg-skin button.button:hover::before,
body.psg-skin #page-container .single_add_to_cart_button:hover::before,
body.psg-skin #page-container button.button.alt:hover::before,
body.psg-skin .psgq-submit:hover::before,
body.psg-skin .psgq-add:hover::before,
.psg-pl-btn:hover::before,
body.psg-skin ul.products li.product:hover::before,
.psg-pl-card:hover::before,
body.psg-skin .et_pb_gallery_image:hover::before{animation:psgSheenOnce .7s ease forwards;}

@media (prefers-reduced-motion: reduce){
  body.psg-skin .et_pb_button::before,
  body.psg-skin a.button::before,
  body.psg-skin button.button::before,
  body.psg-skin #page-container .single_add_to_cart_button::before,
  body.psg-skin .psgq-submit::before,
  body.psg-skin .psgq-add::before,
  .psg-pl-btn::before,
  body.psg-skin ul.products li.product::before,
  .psg-pl-card::before,
  body.psg-skin .et_pb_gallery_image::before{animation:none !important;}
}

/* =====================================================================
   WCAG QA PASS sitewide (2026-09-04, computed-contrast audit)
   ===================================================================== */
body.psg-skin #main-content a:not(.psg-btn):not(.button):not(.psg-pl-btn):not(.et_pb_button){
  color:var(--psg-brand-dark);}                            /* breadcrumbs/inline links 4.2-4.4 → 5.2 */
body.psg-skin .woocommerce-result-count{color:var(--psg-muted) !important;}   /* 2.66 → ~5 */
body.psg-skin .page-numbers{color:var(--psg-brand-dark) !important;}          /* 2.57 → 5.2 */
body.psg-skin .woocommerce-Price-currencySymbol{color:inherit !important;}    /* "R" 2.57 → follows price ink */
body.psg-skin .small-button.smallgreen{                                       /* legacy content btn 3.09 → 5.5 */
  background:#0B7A38 !important;color:#fff !important;border-color:#0B7A38 !important;}
body.psg-skin .psgq-remove{color:var(--psg-muted);}                           /* "×" 4.48 → ~5 */
/* WCAG QA pass round 2: header menu links were Divi rgba(0,0,0,.6) = 4.42;
   product prices were Divi blue #2EA3F2 = 2.57 (summary) / #666 (loop) */
body.psg-skin #top-menu a{color:#3E4E5F;}
body.psg-skin #top-menu .current-menu-item > a,
body.psg-skin #top-menu li a:hover{color:var(--psg-ink);}
body.psg-skin .price,
body.psg-skin .woocommerce-Price-amount{color:var(--psg-ink) !important;}
body.psg-skin .price del,
body.psg-skin .price del .woocommerce-Price-amount{color:var(--psg-muted) !important;}
/* WCAG QA pass round 3: contact page's Divi submit was white on lime #7CDA24 (1.76).
   Scoped to #main-content so the homepage form card (own template, orange) is untouched. */
body.psg-skin #main-content .et_pb_contact_submit{
  background:var(--psg-green) !important;color:#fff !important;border-color:var(--psg-green) !important;}
/* (round 3b) Divi's per-page module CSS also uses !important — out-rank it with the
   double-ID pattern (same trick as the etched tables/buttons blocks). */
body.psg-skin #page-container #main-content .et_pb_contact_submit{
  background:var(--psg-green) !important;color:#fff !important;border-color:var(--psg-green) !important;}
/* QA regression fix: .psg-pl-card sets its own display, which overrides the UA
   [hidden]{display:none} rule — so the search filter marked cards hidden but they
   stayed visible. Restore hidden semantics. */
.psg-pl-row[hidden]{display:none !important;}

/* Price-list page renders in a full-width Divi layout with zero side padding —
   constrain the wrapper itself (2026-09-04, owner catch). */
.psg-pricelist{max-width:1240px;margin:0 auto;padding:clamp(30px,3.5vw,52px) clamp(16px,4vw,40px) 64px;box-sizing:border-box;}

/* =====================================================================
   PRODUCTS-DROPDOWN PAGE BANDS (2026-09-04): product grid band +
   made-to-measure CTA band injected by psg_products_page_enrich().
   ===================================================================== */
/* Bands render inside full-width Divi layouts (zero side padding — same trap
   as the price-list page): constrain them exactly like .psg-pricelist. */
.psg-prodband,.psg-quoteband2{
  max-width:1240px;margin:10px auto 40px;box-sizing:border-box;
  padding-left:clamp(16px,4vw,40px);padding-right:clamp(16px,4vw,40px);}
.psg-prodband h2,.psg-quoteband2 h2{font-size:clamp(22px,2.2vw,28px);color:var(--psg-ink);margin:0 0 8px;}
.psg-prodband__sub{color:var(--psg-muted);max-width:70ch;margin:0 0 20px;}
.psg-prodband__more{margin:20px 0 0;}
.psg-quoteband2{margin:10px auto 44px;text-align:center;padding:34px 28px;border-radius:18px;
  max-width:min(1160px, calc(100% - 32px));
  background:rgba(255,255,255,.48);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 0 30px rgba(255,255,255,.55), 0 10px 28px rgba(30,80,140,.06);}
.psg-quoteband2 p{max-width:62ch;margin:6px auto 0;color:var(--psg-muted);}
.psg-quoteband2__row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:18px !important;}

/* Laminated page: 4 small shop groups had oversized gaps between them */
body.psg-skin .et_pb_shop{margin-bottom:22px !important;}
/* Laminated page (page-id-466): the four colour groups each sit in their own
   Divi row — stacked row paddings + heading margins kept them ~100px apart.
   Compact into one catalog flow. */
body.page-id-466 .et_pb_row{padding-top:8px !important;padding-bottom:0 !important;}
body.page-id-466 .et_pb_text h2{margin:16px 0 4px;}
body.page-id-466 .et_pb_shop{margin-bottom:4px !important;}
/* =====================================================================
   UNIFIED PRODUCT GRID (2026-09-04, owner: "consistency across all 10
   pages"). Woo/Divi lay products out with floats + % margins, and Divi
   shop modules omit the .woocommerce wrapper, so nothing here was ever
   one system. One wrapper-free CSS grid for EVERY product list:
   shop page, Divi shop modules, [products] shortcodes, related products.
   ===================================================================== */
body.psg-skin ul.products{
  display:grid !important;grid-template-columns:repeat(4,1fr) !important;
  gap:22px !important;margin:0 !important;padding:0 !important;width:100% !important;}
body.psg-skin ul.products.columns-3{grid-template-columns:repeat(3,1fr) !important;}
body.psg-skin ul.products.columns-2{grid-template-columns:repeat(2,1fr) !important;}
body.psg-skin ul.products::before,
body.psg-skin ul.products::after{content:none !important;display:none !important;}
body.psg-skin ul.products li.product{
  width:auto !important;max-width:none !important;min-height:0;
  float:none !important;clear:none !important;margin:0 !important;
  box-sizing:border-box;display:flex;flex-direction:column;}
@media (max-width:980px){
  body.psg-skin ul.products,
  body.psg-skin ul.products.columns-3,
  body.psg-skin ul.products.columns-2{grid-template-columns:repeat(2,1fr) !important;}
}
@media (max-width:560px){
  body.psg-skin ul.products,
  body.psg-skin ul.products.columns-3,
  body.psg-skin ul.products.columns-2{grid-template-columns:1fr !important;}
}
/* Laminated page: hide the four sparse colour-group rows — replaced by the
   single injected .psg-prodband grid under the title (see functions.php). */
body.page-id-466 .et_pb_row:has(.et_pb_shop){display:none !important;}
/* Annealed + Double Glazing: same single-grid treatment as laminated —
   original shop rows hidden, injected .psg-prodband under the title. */
body.page-id-452 .et_pb_row:has(.et_pb_shop),
body.page-id-470 .et_pb_row:has(.et_pb_shop){display:none !important;}

/* =====================================================================
   CONTACT PAGE (2026-09-04 redesign) — etched cards, form + map band.
   ===================================================================== */
.psg-ct{max-width:1240px;margin:0 auto;padding:clamp(30px,3.5vw,52px) clamp(16px,4vw,40px) 64px;box-sizing:border-box;}
.psg-ct__head{text-align:center;max-width:72ch;margin:0 auto 30px;}
.psg-ct__head h1{margin:0 0 10px;}
.psg-ct__head p{color:var(--psg-muted);margin:0;}
.psg-ct-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:0 0 22px;}
.psg-ct-card,.psg-ct-form{
  background:rgba(255,255,255,.48);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border-radius:18px;box-shadow:0 0 30px rgba(255,255,255,.55), 0 10px 28px rgba(30,80,140,.06);}
.psg-ct-card{padding:22px 24px;}
.psg-ct-card h2,.psg-ct-form h2{font-size:13px;text-transform:uppercase;letter-spacing:.08em;
  color:var(--psg-muted);margin:0 0 10px;font-weight:700;}
.psg-ct-form h2{font-size:20px;text-transform:none;letter-spacing:0;color:var(--psg-ink);}
.psg-ct-big{font-size:clamp(16px,1.5vw,20px);font-weight:700;color:var(--psg-ink);
  margin:0 0 6px;overflow-wrap:anywhere;}
.psg-ct-big a{color:var(--psg-ink);text-decoration:none;}
.psg-ct-big a:hover{color:var(--psg-brand-dark);}
.psg-ct-card p:last-child{color:var(--psg-muted);font-size:14px;margin:0;}
.psg-ct-main{display:grid;grid-template-columns:1.05fr .95fr;gap:18px;align-items:stretch;}
.psg-ct-form{padding:26px 28px;}
.psg-ct-map{border-radius:18px;overflow:hidden;min-height:440px;
  box-shadow:0 0 30px rgba(255,255,255,.55), 0 10px 28px rgba(30,80,140,.06);}
.psg-ct-map iframe{width:100% !important;height:100% !important;min-height:440px;border:0;display:block;}
@media (max-width:980px){
  .psg-ct-grid{grid-template-columns:1fr;}
  .psg-ct-main{grid-template-columns:1fr;}
  .psg-ct-map{min-height:320px;}
  .psg-ct-map iframe{min-height:320px;}
}
/* contact polish: single heading in the form card; email fits on one line */
.psg-ct-form .et_pb_contact_main_title{display:none !important;}
.psg-ct-big--email{font-size:15.5px;letter-spacing:-.01em;}

/* Uniform title clearance below the fixed header (2026-09-04, owner catch):
   every Divi page's first section gets the same breathing room. */
body.psg-skin #main-content .et_pb_section:first-of-type{padding-top:clamp(34px,3.5vw,50px) !important;}

/* =====================================================================
   PRODUCTS DROPDOWN sitewide (2026-09-04, owner: "use the homepage
   dropdown style sitewide") — Divi's #top-menu submenu restyled to match
   the homepage frosted mega panel: centred 2-column glass card.
   ===================================================================== */
body.psg-skin #top-menu li ul.sub-menu{
  display:grid;grid-template-columns:1fr 1fr;gap:4px;
  min-width:480px;width:auto;padding:14px !important;
  left:50%;transform:translateX(-50%);
  /* header's own backdrop-filter stops the panel's blur sampling the page,
     so use a near-opaque frost instead of relying on backdrop blur */
  background:rgba(255,255,255,.93);
  -webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5);
  border:1px solid var(--psg-glass-line);border-top:1px solid var(--psg-glass-line) !important;
  border-radius:var(--psg-radius);
  box-shadow:inset 0 1px 0 var(--psg-glass-edge), var(--psg-shadow-lg);}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  body.psg-skin #top-menu li ul.sub-menu{background:rgba(255,255,255,.94);}
}
body.psg-skin #top-menu li li{padding:0 !important;margin:0 !important;width:auto;}
body.psg-skin #top-menu li li a{
  width:auto !important;padding:10px 12px !important;border-radius:8px;
  color:var(--psg-ink) !important;font-weight:500;font-size:14px;opacity:1 !important;}
body.psg-skin #top-menu li li a:hover{background:var(--psg-surface);color:var(--psg-brand) !important;opacity:1 !important;}
/* tablet/touch: submenu opened by tap (see psg.js touch support) */
body.psg-skin #top-menu li.psg-touch-open ul.sub-menu{visibility:visible !important;opacity:1 !important;}

/* iOS focus-zoom prevention sitewide: inputs must be >=16px on small screens
   (Safari zooms any focused field below 16px). 2026-09-07. */
@media (max-width:980px){
  body.psg-skin input[type=text],body.psg-skin input[type=email],body.psg-skin input[type=tel],
  body.psg-skin input[type=number],body.psg-skin input[type=search],body.psg-skin select,
  body.psg-skin textarea,
  body.psg-skin .psgq-line input,body.psg-skin .psgq-grid2 input,
  body.psg-skin input:not([type]){font-size:16px !important;}
}
