/* Dimensions measured from the supplied retail reference at 1600px. */
body { font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", Ubuntu, Cantarell, "Helvetica Neue", sans-serif; letter-spacing: 0; }
h1,h2,h3,h4 { font-family: inherit !important; }
button, input, select, textarea { font-family: inherit; }
.utility-bar { background: var(--ink); }
.header-main { grid-template-columns: 174px 234px minmax(0,1fr) 180px 72px; gap: 14px; height: 88px; }
.header-main .brand img { width: 164px; height: 84px; object-fit: contain; }
.header-location { background: #f7f7f5; }
.header-search button { background: var(--red); }
.header-phone { color: var(--ink); }
.header-phone > svg:first-child { width: 36px; height: 36px; padding: 8px; border-radius: 50%; background: #fff1f0; color: var(--red); }
.header-cart { border: 0; background: transparent; }
.header-cart > svg { width: 32px; height: 32px; }
.nav-bar { background: #fafafa; height: 60px; border-bottom: 1px solid #f1f1f1; }
.nav-inner { width: 100%; height: 60px; min-height: 60px; grid-template-columns: 150px minmax(0,1fr) 32px 150px; gap: 10px; padding-inline: 16px; box-sizing: border-box; }
.category-trigger { width: 150px; min-width: 150px; height: 60px; padding: 0; background: transparent; color: #101512; font-size: 13px; font-weight: 500; justify-content: flex-start; gap: 8px; border: 0; }
.category-trigger:hover { background: transparent; color: var(--red); }
.category-trigger svg { width: 16px; height: 16px; }
.nav-links { position: static; width: 100%; min-width: 0; justify-self: stretch; margin-left: 0; display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 14px; padding: 0 10px; overflow: auto; scrollbar-width: none; background: transparent; box-shadow: none; border: 0; max-height: none; }
.nav-links a { flex-shrink: 0; min-height: 60px; padding: 0 5px; border: 0; font-size: 13px; font-weight: 500; }
.nav-links a::after { display: none; }
.nav-links a:hover { color: var(--red); }
.nav-scroll { border: 1px solid #eee; background: #f5f4f0; width: 28px; height: 28px; border-radius: 50%; }
.nav-quote { height: 36px; background: var(--red); color: #fff; font-size: 12px; border-radius: 8px; padding: 0 10px; white-space: nowrap; }
.nav-quote:hover { background: var(--red-dark); }
.category-drawer { width: min(940px,94vw); border-radius: 0; }
.category-drawer-shell:not(.is-open) { visibility: hidden; pointer-events: none; }
.category-drawer-shell.is-open { visibility: visible; pointer-events: auto; }
.drawer-header { background: #fff; }
.drawer-departments button { font-size: 14px; }
.drawer-departments button > span { font-size: 14px; }
.drawer-departments button small { display: none; }
.drawer-category-title { font-size: 15px; }
.drawer-subcategory-links a { font-size: 13px; }
.drawer-panel-head small { display: none; }
.drawer-panel-head h2 { font-size: 24px; }
.drawer-footer { font-size: 13px; }

@media(min-width:1241px){
  .nav-inner{grid-template-columns:160px minmax(0,1fr) 160px}
  .category-trigger{width:160px;min-width:160px}
  .nav-scroll{display:none}
}

/* Cart and order enquiry */
.header-cart {
  width: 72px;
  min-width: 72px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #111713;
  cursor: pointer;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
}
.header-cart > svg { width: 27px; height: 27px; }
.header-cart:hover { color: var(--green); }
.header-cart b[hidden] { display: none; }
.card-add-cart {
  min-width: 108px;
  height: 39px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 12px;
  border: 1px solid #090d0a;
  border-radius: 5px;
  background: #090d0a;
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
  transition: background .2s, border-color .2s, color .2s;
}
.card-add-cart svg { width: 15px; height: 15px; }
.card-add-cart:hover { border-color: var(--green); background: var(--green); }
.product-cart-button { width: 100%; margin: 0 0 9px; border: 0; cursor: pointer; }
.product-quote-button { border: 1px solid var(--red); background: #fff; color: var(--red); }
.product-quote-button:hover { background: #fff2f1; }

.cart-drawer-shell { position: fixed; z-index: 600; inset: 0; visibility: hidden; pointer-events: none; }
.cart-drawer-shell.is-open { visibility: visible; pointer-events: auto; }
.cart-backdrop { position: absolute; inset: 0; border: 0; background: rgba(5, 9, 7, .58); opacity: 0; transition: opacity .25s; }
.cart-drawer-shell.is-open .cart-backdrop { opacity: 1; }
.cart-drawer {
  position: absolute;
  top: 0;
  right: 0;
  width: min(520px, 100%);
  height: 100%;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  background: #fff;
  box-shadow: -18px 0 55px rgba(0, 0, 0, .18);
  transform: translateX(100%);
  transition: transform .3s ease;
}
.cart-drawer-shell.is-open .cart-drawer { transform: translateX(0); }
.cart-drawer-head { min-height: 90px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 24px; border-bottom: 1px solid #e1e5e2; }
.cart-drawer-head small { display: block; margin-bottom: 3px; color: var(--green); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.cart-drawer-head h2 { margin: 0; font-size: 23px; }
.cart-drawer-head button { width: 42px; height: 42px; display: grid; place-items: center; padding: 0; border: 1px solid #dce1de; border-radius: 50%; background: #fff; cursor: pointer; }
.cart-drawer-head button svg { width: 19px; }
.cart-drawer-body { overflow-y: auto; padding: 8px 24px; }
.cart-line { display: grid; grid-template-columns: 82px minmax(0, 1fr) auto; gap: 14px; align-items: start; padding: 16px 0; border-bottom: 1px solid #e7eae8; }
.cart-line > a { width: 82px; height: 82px; display: grid; place-items: center; border: 1px solid #e1e5e2; border-radius: 6px; background: #f7f8f7; overflow: hidden; }
.cart-line img { width: 100%; height: 100%; padding: 7px; object-fit: contain; }
.cart-line-info > a { display: -webkit-box; overflow: hidden; font-size: 12px; font-weight: 800; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.cart-line-info > small { display: block; margin-top: 5px; color: #778079; font-size: 9px; }
.cart-line > strong { padding-top: 1px; font-size: 12px; white-space: nowrap; }
.cart-line-controls { display: flex; align-items: center; gap: 0; margin-top: 11px; }
.cart-line-controls button:not(.cart-remove), .cart-line-controls span { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid #d8ddd9; background: #fff; font-size: 10px; }
.cart-line-controls button { cursor: pointer; }
.cart-line-controls button svg { width: 12px; }
.cart-line-controls span { border-inline: 0; }
.cart-line-controls .cart-remove { margin-left: 10px; padding: 0; border: 0; background: transparent; color: var(--red); font-size: 9px; font-weight: 800; }
.cart-empty { min-height: 410px; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 45px 20px; text-align: center; }
.cart-empty > svg { width: 48px; height: 48px; color: #a3aaa5; }
.cart-empty h3 { margin: 18px 0 7px; font-size: 21px; }
.cart-empty p { max-width: 300px; margin: 0; color: #727b74; font-size: 12px; }
.cart-empty a { margin-top: 20px; padding: 12px 20px; border-radius: 5px; background: var(--green); color: #fff; font-size: 11px; font-weight: 800; }
.cart-drawer-footer { max-height: 56vh; overflow-y: auto; padding: 18px 24px 22px; border-top: 1px solid #dfe4e0; background: #f7f9f7; }
.cart-summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.cart-summary span { font-size: 12px; font-weight: 800; }
.cart-summary span small { display: block; color: #778079; font-size: 8px; text-transform: uppercase; }
.cart-summary strong { font-size: 18px; }
.cart-enquiry-form { display: grid; gap: 10px; }
.cart-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cart-enquiry-form label { min-width: 0; }
.cart-enquiry-form label > span { display: flex; justify-content: space-between; margin-bottom: 4px; font-size: 9px; font-weight: 800; }
.cart-enquiry-form label > span small { color: #79827b; font-weight: 500; }
.cart-enquiry-form input, .cart-enquiry-form textarea { width: 100%; min-height: 39px; padding: 9px 11px; border: 1px solid #cfd6d1; border-radius: 4px; background: #fff; font: inherit; font-size: 11px; resize: vertical; }
.cart-enquiry-form input:focus, .cart-enquiry-form textarea:focus { outline: 2px solid rgba(0, 137, 65, .16); border-color: var(--green); }
.cart-honeypot { position: absolute; left: -10000px; }
.cart-email-submit, .cart-whatsapp { min-height: 44px; display: flex; align-items: center; justify-content: center; gap: 8px; border: 0; border-radius: 5px; cursor: pointer; font: inherit; font-size: 11px; font-weight: 800; }
.cart-email-submit { background: var(--red); color: #fff; }
.cart-email-submit:hover { background: var(--red-dark); }
.cart-email-submit:disabled { opacity: .65; cursor: wait; }
.cart-whatsapp { margin-top: 10px; border: 1px solid var(--green); background: #fff; color: var(--green); }
.cart-email-submit svg, .cart-whatsapp svg { width: 16px; }
.cart-form-status { min-height: 0; margin: 0; font-size: 10px; line-height: 1.4; }
.cart-form-status.is-success { color: var(--green-dark); }
.cart-form-status.is-error { color: var(--red); }
.is-spinning { animation: cart-spin .8s linear infinite; }
body.cart-open { overflow: hidden; }
@keyframes cart-spin { to { transform: rotate(360deg); } }

@media (max-width: 940px) {
  .header-cart { width: 48px; min-width: 48px; height: 44px; }
  .header-cart > span { display: none; }
  .header-cart > svg { width: 24px; height: 24px; }
  .header-cart b { top: -1px; right: 0; }
}
@media (max-width: 560px) {
  .card-add-cart { min-width: 42px; width: 42px; padding: 0; border-radius: 50%; }
  .card-add-cart span { display: none; }
  .cart-drawer-head { min-height: 76px; padding: 15px 16px; }
  .cart-drawer-body { padding-inline: 16px; }
  .cart-line { grid-template-columns: 68px minmax(0, 1fr); gap: 11px; }
  .cart-line > a { width: 68px; height: 68px; }
  .cart-line > strong { grid-column: 2; margin-top: -4px; }
  .cart-drawer-footer { padding: 15px 16px 18px; }
  .cart-form-grid { grid-template-columns: 1fr; }
}

body[data-page="home"] { background: #fff; }
body[data-page="home"] .shell { width: calc(100% - 32px); max-width: 1920px; }
body[data-page="home"] .storefront-hero { padding: 24px 16px 0; background: #fff; }
body[data-page="home"] .storefront-layout { width: 100%; grid-template-columns: minmax(0, 2.375fr) minmax(0,1fr); gap: 16px; align-items: stretch; }
body[data-page="home"] .storefront-slider { height: auto; aspect-ratio: 4.57; border-radius: 0; background: #f5f5f5; }
body[data-page="home"] .storefront-slide { inset: 0; display: block; }
body[data-page="home"] .storefront-slide img { width: 100%; height: 100%; object-fit: cover; opacity: 1; }
body[data-page="home"] .storefront-arrow { width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; background: #fff; color: var(--ink); box-shadow: 0 2px 8px #0002; }
body[data-page="home"] .storefront-prev { left: 20px; }
body[data-page="home"] .storefront-next { right: 20px; }
body[data-page="home"] .storefront-dots { left: 50%; bottom: 8px; transform: translateX(-50%); gap: 8px; }
body[data-page="home"] .storefront-dots button { width: 32px; height: 4px; border-radius: 4px; background: #fff8; }
body[data-page="home"] .storefront-dots button.is-active { background: var(--red); }
body[data-page="home"] .storefront-offer { position: relative; height: auto; min-height: 0; border-radius: 0; display: flex; padding: 20px; background: var(--green-dark); overflow: hidden; }
body[data-page="home"] .storefront-offer > div { width: 60%; position: relative; z-index: 1; }
body[data-page="home"] .storefront-offer small { display: inline-block; padding: 2px 7px; background: var(--red); color: #fff; font-size: 10px; border-radius: 4px; }
body[data-page="home"] .storefront-offer h1 { margin: 8px 0 6px; color: #fff; font-size: 32px; line-height: 1.05; font-weight: 800; }
body[data-page="home"] .storefront-offer p { margin: 0 0 12px; font-size: 11px; line-height: 1.4; color: #fff; }
body[data-page="home"] .storefront-offer div > span { display: inline-flex; align-items: center; gap: 7px; padding: 6px 10px; background: #fff; color: var(--green-dark); font-size: 11px; border-radius: 4px; }
body[data-page="home"] .storefront-offer img { position: absolute; width: 47%; height: 87%; right: 8px; bottom: 0; object-fit: contain; object-position: center; mix-blend-mode: normal; }
body[data-page="home"] .retail-benefits { border: 0; margin: 0; padding: 48px 0 40px; background: #fff; }
body[data-page="home"] .retail-benefit-grid { grid-template-columns: repeat(5,minmax(0,1fr)); }
body[data-page="home"] .retail-benefit-grid > div { min-height: 48px; border: 0; border-right: 1px solid #e5e7eb; justify-content: center; padding: 0 16px; gap: 20px; }
body[data-page="home"] .retail-benefit-grid > div:last-child { border: 0; }
body[data-page="home"] .retail-benefit-grid svg { width: 26px; height: 26px; color: var(--red); }
body[data-page="home"] .retail-benefit-grid strong { font-size: 18px; font-weight: 600; }
body[data-page="home"] .retail-benefit-grid small { font-size: 14px; color: #64748b; margin-top: 4px; }
body[data-page="home"] .retail-section { padding: 24px 0; margin: 0; background: #fff; }
body[data-page="home"] .department-navigation { padding: 30px 0; border-block: 1px solid #dfe7e2; background: #f3f7f5; }
.rail-shell { position: relative; }
.rail-edge { position: absolute; z-index: 5; top: 45%; width: 32px; height: 32px; display: grid; place-items: center; padding: 0; border: 1px solid #eee; border-radius: 50%; background: #fff; color: #111; box-shadow: 0 2px 5px #0002; }
.rail-edge svg { width: 20px; height: 20px; }
.rail-edge:disabled { opacity: .38; cursor: default; box-shadow: none; }
.rail-prev { left: -10px; }.rail-next { right: -10px; }
body[data-page="home"] .department-rail { display: grid; grid-auto-flow: column; grid-auto-columns: 194px; grid-template-columns: none; gap: 14px; overflow: auto; padding: 4px 3px 10px; scrollbar-width: none; }
body[data-page="home"] .department-tile { position: relative; display: grid; grid-template-columns: 74px minmax(0,1fr); align-items: center; min-height: 100px; padding: 11px; border: 1px solid #d5e0d9; border-radius: 8px; background: #fff; box-shadow: 0 5px 16px rgba(14, 45, 29, .065); text-align: left; transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease; }
body[data-page="home"] .department-tile::after { position: absolute; top: 14px; bottom: 14px; left: 0; width: 3px; border-radius: 0 3px 3px 0; background: var(--green); content: ''; opacity: 0; transform: scaleY(.35); transition: opacity .22s ease, transform .22s ease; }
body[data-page="home"] .department-tile > span { width: 74px; height: 74px; border: 1px solid #e0e9e3; border-radius: 7px; background: #edf5f0; padding: 6px; overflow: hidden; transition: background .22s ease, border-color .22s ease; }
body[data-page="home"] .department-tile:nth-child(3n + 2) > span { border-color: #f1dedd; background: #fff3f2; }
body[data-page="home"] .department-tile:nth-child(3n) > span { background: #f3f4f3; }
body[data-page="home"] .department-tile img { width: 100%; height: 100%; object-fit: contain; transition: transform .28s ease; }
body[data-page="home"] .department-tile strong { min-height: 0; padding: 0 4px 0 11px; color: #172019; font-size: 13px; font-weight: 650; line-height: 18px; }
body[data-page="home"] .department-tile:hover { border-color: #86a995; box-shadow: 0 12px 28px rgba(18, 43, 32, .13); transform: translateY(-3px); }
body[data-page="home"] .department-tile:hover::after { opacity: 1; transform: scaleY(1); }
body[data-page="home"] .department-tile:hover > span { border-color: #bdd1c4; background: #e8f2ec; }
body[data-page="home"] .department-tile:hover img { transform: scale(1.045); }
body[data-page="home"] .department-tile:hover strong { color: var(--red); }
body[data-page="home"] .category-deals-section { padding: 42px 0 48px; border-bottom: 1px solid #dfe7e2; background: #edf3ef; }
body[data-page="home"] .category-module-grid { display: grid; grid-auto-flow: row; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; overflow: visible; }
body[data-page="home"] .category-module { position: relative; min-height: 0; padding: 20px; border: 1px solid #d5e0d9; border-top: 4px solid var(--green); border-radius: 8px; background: #fff; box-shadow: 0 16px 36px rgba(20, 44, 31, .14), 0 3px 10px rgba(20, 44, 31, .08); overflow: hidden; transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease; }
body[data-page="home"] .category-module:nth-child(3n) { border-top-color: var(--red); }
body[data-page="home"] .category-module:hover { border-color: #aebfb5; box-shadow: 0 22px 44px rgba(20, 43, 30, .19), 0 5px 14px rgba(20, 43, 30, .1); transform: translateY(-4px); }
body[data-page="home"] .category-module header { margin-bottom: 16px; min-height: 44px; padding-bottom: 13px; border-bottom: 1px solid #e8ece9; }
body[data-page="home"] .category-module h3 { margin: 0; color: #111713; font-size: 19px; line-height: 24px; font-weight: 700; }
body[data-page="home"] .category-module > div { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px 16px; }
body[data-page="home"] .category-module > div a { display: block; padding: 0; background: transparent; color: #101512; }
body[data-page="home"] .category-module > div span { display: block; height: auto; aspect-ratio: 1.22; padding: 9px; border: 1px solid #dfe8e2; border-radius: 6px; background: #f3f7f5; overflow: hidden; transition: background .25s ease, border-color .25s ease, box-shadow .25s ease; }
body[data-page="home"] .category-module > div img { width: 100%; height: 100%; object-fit: contain; transition: transform .35s ease; }
body[data-page="home"] .category-module > div a:hover span { border-color: #b9cfc1; background: #fff; box-shadow: 0 8px 20px rgba(19, 41, 30, .1); }
body[data-page="home"] .category-module > div a:hover img { transform: scale(1.045); }
body[data-page="home"] .category-module > div strong { display: block; min-height: 42px; padding: 8px 2px 0; font-size: 13px; line-height: 17px; font-weight: 550; color: #26302a; transition: color .2s ease; }
body[data-page="home"] .category-module > div a:hover strong { color: var(--red); }
.module-view-all { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 15px; padding-top: 13px; border-top: 1px solid #e8ece9; color: var(--green-dark); font-size: 13px; font-weight: 700; }
.module-view-all svg { width: 17px; height: 17px; color: var(--red); transition: transform .2s ease; }
.module-view-all:hover svg { transform: translateX(3px); }
body[data-page="home"] .category-module-single > div { grid-template-columns: 1fr; }
body[data-page="home"] .category-module-single > div a:not(:first-child) { display: none; }
body[data-page="home"] .category-module-single > div span { aspect-ratio: 1.04; }
body[data-page="home"] .category-module-single > div strong { display: none; }
body[data-page="home"] .retail-heading { min-height: 20px; margin-bottom: 16px; gap: 16px; align-items: center; }
body[data-page="home"] .retail-heading h2 { margin: 0; font-size: 20px; line-height: 24px; font-weight: 700; letter-spacing: 0; }
body[data-page="home"] .retail-heading a { font-size: 14px; color: var(--red); text-decoration: underline; }
body[data-page="home"] .retail-heading p { display: none; }
body[data-page="home"] .retail-product-rail,
body[data-page="home"] #trending-products,
body[data-page="home"] #featured-products,
body[data-page="home"] #new-products,
body[data-page="home"] #department-product-sections .retail-product-rail { display: grid; grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 273px; gap: 16px; overflow: auto; scrollbar-width: none; scroll-snap-type: x mandatory; }
.product-card,
body[data-page="home"] .retail-product-rail .product-card { position: relative; display: grid; grid-template-rows: auto 90px 64px; min-height: 0; border: 1px solid #e6e6e6; border-radius: 16px; background: #fff; overflow: hidden; box-shadow: none; transition: border-color .2s; }
.product-card:hover,
body[data-page="home"] .retail-product-rail .product-card:hover { transform: none; box-shadow: none; border-color: #c7c7c7; background: #fff; }
.product-card .product-image,
body[data-page="home"] .retail-product-rail .product-image { height: auto; aspect-ratio: 1; display: block; padding: 0; border: 0; background: #f0f0f0; }
.product-card .product-image img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; transition: transform .7s; }
.product-card:hover .product-image img { transform: scale(1.05); }
.product-card .product-card-top,
body[data-page="home"] .retail-product-rail .product-card-top { position: absolute; top: 10px; right: 10px; left: 10px; z-index: 2; }
.product-card .stock-badge,
body[data-page="home"] .retail-product-rail .stock-badge { padding: 4px 7px; border-radius: 5px; background: var(--green); color: #fff; font-size: 10px; line-height: 14px; }
.product-card .product-wishlist { width: 32px; height: 32px; padding: 7px; border: 0; border-radius: 7px; background: #fff; box-shadow: 0 1px 4px #0002; color: #94a3b8; }
.product-card .product-wishlist svg { width: 18px; height: 18px; }
.product-card .product-card-body,
body[data-page="home"] .retail-product-rail .product-card-body { min-width: 0; padding: 12px 14px 0; height: 90px; }
.product-card h3,
body[data-page="home"] .retail-product-rail .product-card h3 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 0; min-height: 40px; font-size: 14px; line-height: 20px; font-weight: 500; color: #101512; }
.product-card h3 a,.product-card:hover h3 a { color: #101512; opacity: 1; visibility: visible; }
.product-card .product-delivery,
body[data-page="home"] .retail-product-rail .product-delivery { display: flex; align-items: center; gap: 4px; margin: 7px 0 0; color: #475569; font-size: 11px; }
.product-card .product-delivery svg { width: 12px; height: 12px; }
.product-card .product-bottom,
body[data-page="home"] .retail-product-rail .product-bottom { padding: 8px 14px 12px; min-height: 64px; border: 0; display: flex; align-items: center; justify-content: space-between; }
.product-card .product-price small { display: none; }
.product-card .product-price strong,
body[data-page="home"] .retail-product-rail .product-price strong { font-size: 20px; line-height: 24px; color: #101512; }
.product-card .whatsapp-action,
body[data-page="home"] .retail-product-rail .whatsapp-action { display: inline-flex; flex-shrink: 0; width: 42px; height: 42px; padding: 0 10px; gap: 4px; border-radius: 50px; background: #000; color: #fff; overflow: hidden; transition: width .25s,background .25s; }
.product-card .whatsapp-action svg { flex-shrink: 0; width: 22px; height: 22px; }
.product-card .whatsapp-action span { display: none; font-size: 11px; font-weight: 600; }
.product-card .whatsapp-action:hover { width: 82px; background: var(--green); }
.product-card .whatsapp-action:hover span { display: block; }
body[data-page="home"] .retail-banner { display: block; margin: 24px auto; border: 0; border-radius: 0; overflow: hidden; }
body[data-page="home"] .retail-banner img { display: block; width: 100%; height: auto; aspect-ratio: 8.07; object-fit: cover; object-position: center 35%; }
body[data-page="home"] .range-showcase { margin: 24px 16px; padding: 24px 0; border-radius: 8px; background: var(--green-dark); }
body[data-page="home"] .range-showcase > .shell { width: calc(100% - 32px); }
body[data-page="home"] .range-showcase-head h2 { font-size: 20px; font-weight: 700; }
body[data-page="home"] .range-showcase-head a { margin-left: auto; font-size: 12px; color: #fff; }
body[data-page="home"] .range-rail { display: grid; grid-auto-columns: 273px; gap: 20px; overflow: auto; scrollbar-width: none; }
body[data-page="home"] .range-card { border-radius: 16px; padding: 16px; }
body[data-page="home"] .range-card > span { height: 245px; }
body[data-page="home"] .range-card strong { font-size: 16px; }
body[data-page="home"] .range-card small { font-size: 12px; color: var(--red); }
body[data-page="home"] .brand-rail { display: grid; grid-auto-flow: column; grid-auto-columns: 170px; gap: 37px; overflow: auto; scrollbar-width: none; padding-top: 8px; }
body[data-page="home"] .brand-tile { height: 250px; padding: 12px; background: #f1f1ef; border: 0; border-radius: 4px; gap: 8px; transition: transform .7s; }
body[data-page="home"] .brand-tile:hover { transform: translateY(-8px); }
body[data-page="home"] .brand-tile img { width: 146px; height: 190px; object-fit: contain; mix-blend-mode: multiply; }
body[data-page="home"] .brand-tile strong { display: block; width: 100%; padding: 9px; color: var(--green); background: #fff; border-radius: 4px; font-size: 14px; font-weight: 700; }
.department-feature-grid { display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 112px; gap: 24px; overflow: auto; scrollbar-width: none; }
.department-feature-grid > a { min-width: 0; padding: 0; border: 0; border-radius: 0; background: #fff; }
.department-feature-grid span { display: block; height: 112px; }
.department-feature-grid img { height: 100%; width: 100%; object-fit: contain; mix-blend-mode: multiply; }
.department-feature-grid h3 { margin: 12px 0 0; font-size: 14px; line-height: 20px; font-weight: 500; text-align: center; }
.cta-band { background: var(--ink); color: #fff; }
.cta-inner h2 { font-size: 32px; color: #fff; }
.footer-help { background: #f8fafc; padding: 48px 16px 40px; }
.footer-help-heading h2 { font-size: 24px; }.footer-help-heading p { font-size: 14px; }
.footer-help-card { width: 440px; max-width: 100%; }.footer-help-card strong { font-size: 16px; }.footer-help-card small { font-size: 12px; }
.retail-footer-wide { width: min(calc(100% - 64px),1216px); }
.footer-main { grid-template-columns: repeat(6,minmax(0,1fr)); gap: 32px; }
.footer-col h3,.footer-brand h3,.footer-trade h3 { font-size: 12px; }
.footer-col > a,.footer-contact > a { color: #111 !important; font-size: 14px; }
.site-footer .footer-col > a:not(.footer-cta) { color: #111 !important; }
.footer-contact small { font-size: 11px; }.footer-brand p,.footer-trade p { font-size: 12px; }
.footer-brand img { width: 144px; height: 120px; border: 0; background: transparent; box-shadow: none; }
.footer-socials { display: flex; align-items: center; gap: 9px; margin-top: 16px; }
.footer-socials a {
  width: 36px;
  height: 36px;
  display: inline-grid;
  place-items: center;
  border: 1px solid #d9dfdb;
  border-radius: 50%;
  background: #fff;
  color: #111;
  font-size: 17px;
  font-weight: 900;
  line-height: 1;
  transition: border-color .2s ease, background-color .2s ease, color .2s ease, transform .2s ease;
}
.footer-socials a:hover { border-color: #c99524; background: #111; color: #fff; transform: translateY(-2px); }
.footer-socials svg { width: 17px; height: 17px; }
.footer-trade > a { color: #fff !important; font-size: 13px; }
.footer-trade > span { font-size: 12px; }
.footer-category-directory { padding: 48px 16px; border-top: 1px solid #f1f5f9; background: #f8fafc; }
.footer-directory-inner { max-width: 1280px; margin: auto; padding-inline: 32px; }
.footer-directory-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; }
.footer-directory-heading h2 { margin: 0; font-size: 20px; }
.footer-directory-heading > a { display: flex; gap: 8px; color: var(--red); font-size: 12px; }
.footer-directory-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 32px; }
.footer-directory-grid h3 { margin: 0 0 12px; padding-bottom: 8px; border-bottom: 1px solid #e2e8f0; font-size: 14px; }
.footer-directory-grid > div > a { display: block; margin: 8px 0; color: #111; font-size: 14px; }
.footer-directory-grid a:hover { color: var(--red); }
.footer-bottom { background: #fff; border-top: 1px solid #e5e7eb; color: #475569; font-size: 12px; padding-block: 24px; }
.footer-assurance span { font-size: 13px; }
.floating-wa { left: 16px; right: auto; }
@media(max-width:1240px){
  .header-main { grid-template-columns: 130px 195px minmax(0,1fr) 52px; gap: 16px; }.header-main .brand img{width:122px;height:78px}.header-phone{display:none}
  body[data-page="home"] .retail-benefit-grid strong{font-size:15px}body[data-page="home"] .retail-benefit-grid small{font-size:12px}
  body[data-page="home"] .storefront-offer h1{font-size:26px}body[data-page="home"] .storefront-offer{padding:12px}
  .footer-main{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:940px){
  .utility-bar{display:none}.header-main{height:auto;grid-template-columns:minmax(0,1fr) minmax(112px,124px) 40px 40px;gap:6px;padding:8px 0}
  .header-location,.header-phone{display:none}.header-main .brand{grid-column:1;grid-row:1}.header-main .brand img{height:56px;width:78px}
  .header-main .language-selector{grid-column:2;grid-row:1}.header-cart{grid-column:3;grid-row:1;width:40px;min-width:0}
  .header-cart span{display:none}.menu-button{grid-column:4;grid-row:1;display:grid;width:40px;height:44px}
  .header-main .header-search{display:flex;grid-column:1/-1;grid-row:2;height:44px}.nav-inner{grid-template-columns:130px minmax(0,1fr) 28px;gap:12px}
  .category-trigger{width:130px;min-width:130px}
  .nav-quote{display:none}.nav-scroll{display:grid}.nav-links{display:flex}.nav-links a{font-size:12px}
  body[data-page="home"] .storefront-layout{grid-template-columns:1fr}.storefront-offer{display:none!important}
  body[data-page="home"] .storefront-slider{aspect-ratio:3.2}body[data-page="home"] .retail-benefits{padding:28px 0}
  body[data-page="home"] .retail-benefit-grid{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:240px;overflow:auto;scrollbar-width:none}
  body[data-page="home"] .retail-benefit-grid > div{border-top:0!important;justify-content:flex-start}
  body[data-page="home"] .category-module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .department-feature-grid{grid-template-columns:none}
  .footer-directory-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:620px){
  .retail-wide,body[data-page="home"] .shell{width:calc(100% - 24px)}
  .header-main{grid-template-columns:minmax(0,1fr) minmax(108px,112px) 40px 40px;gap:6px}.header-main .brand img{width:64px;height:58px}.header-search input{padding-inline:10px;font-size:12px}.header-search button{width:42px;min-width:42px}
  .header-cart{width:40px;height:40px;min-width:0}.header-cart>svg{width:26px;height:26px}.header-search button{flex:0 0 42px}.nav-bar,.nav-inner{height:48px;min-height:48px}.nav-inner{width:calc(100% - 24px);grid-template-columns:122px minmax(0,1fr) 24px;gap:8px}
  .category-trigger{width:122px;min-width:122px;height:48px;font-size:12px}.nav-links{gap:20px}.nav-links a{min-height:48px;font-size:12px}
  .category-drawer{width:100%;grid-template-rows:74px minmax(0,1fr) 62px}.drawer-body{grid-template-columns:140px minmax(0,1fr)}.drawer-departments button>span{font-size:12px}.drawer-category-title{font-size:14px}.drawer-subcategory-links a{font-size:12px}
  body[data-page="home"] .storefront-hero{padding:12px 12px 0}body[data-page="home"] .storefront-layout{width:100%}body[data-page="home"] .storefront-slider{aspect-ratio:3}
  body[data-page="home"] .storefront-slide img{object-fit:contain}
  body[data-page="home"] .retail-banner img{aspect-ratio:auto;object-fit:contain}
  body[data-page="home"] .storefront-arrow{width:26px;height:26px;top:50%}body[data-page="home"] .storefront-arrow svg{width:16px;height:16px}body[data-page="home"] .storefront-prev{left:4px}body[data-page="home"] .storefront-next{right:4px}
  body[data-page="home"] .storefront-dots{bottom:4px}body[data-page="home"] .storefront-dots button{width:18px;height:3px}
  body[data-page="home"] .retail-section{padding:18px 0}body[data-page="home"] .department-navigation{padding-top:8px}
  body[data-page="home"] .department-rail{grid-auto-columns:164px;gap:10px}body[data-page="home"] .department-tile{grid-template-columns:64px minmax(0,1fr);min-height:86px;padding:8px}body[data-page="home"] .department-tile>span{width:64px;height:64px;padding:4px}body[data-page="home"] .department-tile strong{padding-left:8px;font-size:11px;line-height:14px}
  body[data-page="home"] .category-module-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row;gap:12px}
  body[data-page="home"] .category-module{padding:12px;min-height:0}body[data-page="home"] .category-module h3{font-size:16px;line-height:20px}body[data-page="home"] .category-module header{min-height:40px;margin-bottom:12px}
  body[data-page="home"] .category-module>div{gap:10px 8px}body[data-page="home"] .category-module>div span{height:auto}body[data-page="home"] .category-module>div strong{font-size:10px;line-height:14px;min-height:32px}
  .module-view-all{font-size:12px;margin-top:10px}
  body[data-page="home"] .retail-heading h2{font-size:16px;line-height:20px;max-width:none}body[data-page="home"] .retail-heading a{font-size:12px;flex-shrink:0}
  body[data-page="home"] .retail-product-rail,body[data-page="home"] #trending-products,body[data-page="home"] #featured-products,body[data-page="home"] #new-products,body[data-page="home"] #department-product-sections .retail-product-rail{grid-auto-columns:calc((100% - 12px)/2);gap:12px}
  .product-card,body[data-page="home"] .retail-product-rail .product-card{grid-template-rows:auto 86px 56px;border-radius:12px}
  .product-card .product-image,body[data-page="home"] .retail-product-rail .product-image{height:auto;padding:0}
  .product-card .product-card-body,body[data-page="home"] .retail-product-rail .product-card-body{padding:10px 10px 0;height:86px}
  .product-card h3,body[data-page="home"] .retail-product-rail .product-card h3{font-size:12px;line-height:18px;min-height:36px;-webkit-line-clamp:2}
  .product-card .product-delivery,body[data-page="home"] .retail-product-rail .product-delivery{font-size:10px}
  .product-card .product-price strong,body[data-page="home"] .retail-product-rail .product-price strong{font-size:14px;line-height:18px}
  .product-card .product-bottom,body[data-page="home"] .retail-product-rail .product-bottom{padding:8px 10px;min-height:56px}
  .product-card .whatsapp-action,body[data-page="home"] .retail-product-rail .whatsapp-action{width:34px;height:34px;padding:0 7px}.product-card .whatsapp-action svg{width:20px;height:20px}
  .product-card .product-card-top,body[data-page="home"] .retail-product-rail .product-card-top{top:8px;left:8px;right:8px}.product-card .stock-badge,body[data-page="home"] .retail-product-rail .stock-badge{font-size:8px;padding:2px 5px}
  .product-card .product-wishlist{width:26px;height:26px;padding:5px}.product-card .product-wishlist svg{width:16px;height:16px}
  body[data-page="home"] .range-showcase{margin:18px 12px;padding:16px 0}body[data-page="home"] .range-showcase>.shell{width:calc(100% - 20px)}body[data-page="home"] .range-showcase-head h2{font-size:16px}
  body[data-page="home"] .range-rail{grid-auto-columns:calc((100% - 12px)/2);gap:12px}body[data-page="home"] .range-card{padding:10px;border-radius:12px}body[data-page="home"] .range-card>span{height:160px}body[data-page="home"] .range-card strong{font-size:13px}
  body[data-page="home"] .brand-rail{grid-auto-columns:140px;gap:24px}body[data-page="home"] .brand-tile{height:200px}body[data-page="home"] .brand-tile img{height:140px;width:110px}
  .department-feature-grid{grid-template-columns:none;grid-auto-columns:88px;gap:16px}.department-feature-grid>a{padding:0}.department-feature-grid span{height:88px}.department-feature-grid h3{font-size:12px;line-height:16px}
  .cta-inner h2{font-size:26px}.footer-main{width:calc(100% - 32px);grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}.footer-brand,.footer-trade{grid-column:1/-1}.footer-directory-inner{padding-inline:0}.footer-directory-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 20px}.footer-directory-grid>div>a{font-size:12px}.footer-category-directory{padding:32px 16px}.footer-bottom{font-size:11px}
}
/* Custom Jabal Al Dhaid campaign banners */
body[data-page="home"] .campaign-slide {
  position: absolute;
  overflow: hidden;
  color: #fff;
  background: #07110c;
}
body[data-page="home"] .campaign-cement { background: #dce9ee; }
body[data-page="home"] .campaign-tools { background: #087b45; }
body[data-page="home"] .campaign-plumbing { background: #f4f2ed; }
body[data-page="home"] .campaign-slide::after {
  display: none;
}
body[data-page="home"] .campaign-slide > .campaign-media {
  position: absolute;
  inset: 0;
  display: block;
}
body[data-page="home"] .campaign-media > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
body[data-page="home"] .campaign-copy {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: clamp(68px, 5.2vw, 84px);
  display: flex;
  width: min(38%, 480px);
  transform: translateY(-50%);
  flex-direction: column;
  align-items: flex-start;
  color: #fff;
  text-shadow: none;
}
body[data-page="home"] .campaign-copy small {
  margin-bottom: 7px;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
}
body[data-page="home"] .campaign-copy strong {
  max-width: 460px;
  color: #fff;
  font-size: clamp(22px, 2.15vw, 34px);
  font-weight: 800;
  line-height: 1.06;
}
body[data-page="home"] .campaign-copy > span {
  max-width: 430px;
  margin-top: 8px;
  color: rgba(255, 255, 255, .92);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.42;
}
body[data-page="home"] .campaign-copy em,
body[data-page="home"] .campaign-strip-copy em {
  display: inline-flex;
  min-height: 38px;
  margin-top: 14px;
  padding: 0 17px;
  align-items: center;
  gap: 8px;
  border-radius: 5px;
  background: #e52420;
  box-shadow: none;
  color: #fff;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  text-shadow: none;
}
body[data-page="home"] .campaign-copy em svg,
body[data-page="home"] .campaign-strip-copy em svg { width: 16px; height: 16px; }
body[data-page="home"] .campaign-tools .campaign-copy em { background: #fff; color: #087b45; }
body[data-page="home"] .campaign-plumbing .campaign-copy em { background: #078746; }
body[data-page="home"] .campaign-cement .campaign-copy,
body[data-page="home"] .campaign-cement .campaign-copy strong,
body[data-page="home"] .campaign-cement .campaign-copy > span,
body[data-page="home"] .campaign-plumbing .campaign-copy,
body[data-page="home"] .campaign-plumbing .campaign-copy strong,
body[data-page="home"] .campaign-plumbing .campaign-copy > span { color: #101814; }
body[data-page="home"] .campaign-cement .campaign-copy small,
body[data-page="home"] .campaign-plumbing .campaign-copy small { color: #087b45; }

body[data-page="home"] .campaign-strip {
  position: relative;
  width: calc(100% - 16px);
  max-width: 1920px;
  height: clamp(240px, 19vw, 330px);
  min-height: 0;
  aspect-ratio: auto;
  background: #0b0d0c;
  color: #fff;
  border: 1px solid rgba(7, 135, 70, .24);
  box-shadow: none;
}
body[data-page="home"] .campaign-strip-red { border-color: rgba(229, 36, 32, .28); }
body[data-page="home"] .campaign-strip-red { background: #d90d20; }
body[data-page="home"] .campaign-strip-green { background: #101613; }
body[data-page="home"] .campaign-strip::after {
  display: none;
}
body[data-page="home"] .campaign-strip > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: center;
}
body[data-page="home"] .campaign-strip-copy {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: clamp(28px, 4vw, 62px);
  display: flex;
  width: 42%;
  transform: translateY(-50%);
  flex-direction: column;
  align-items: flex-start;
  color: #fff;
  text-shadow: none;
}
body[data-page="home"] .campaign-strip-copy small {
  color: rgba(255, 255, 255, .9);
  font-size: 10px;
  font-weight: 800;
}
body[data-page="home"] .campaign-strip-copy strong {
  margin-top: 3px;
  color: #fff;
  font-size: clamp(18px, 1.9vw, 28px);
  line-height: 1.08;
}
body[data-page="home"] .campaign-strip-copy > span {
  max-width: 470px;
  margin-top: 5px;
  color: rgba(255, 255, 255, .9);
  font-size: 12px;
  line-height: 1.35;
}
body[data-page="home"] .campaign-strip-copy em { min-height: 32px; margin-top: 9px; padding-inline: 14px; font-size: 11px; }
body[data-page="home"] .campaign-strip-green .campaign-strip-copy em { background: #078746; }

@media(max-width:940px){
  body[data-page="home"] .campaign-copy { left: 62px; width: 40%; }
  body[data-page="home"] .campaign-copy > span { display: none; }
  body[data-page="home"] .campaign-copy em { min-height: 34px; margin-top: 10px; }
  body[data-page="home"] .campaign-strip-copy > span { display: none; }
  body[data-page="home"] .campaign-strip-copy em { margin-top: 7px; }
}
@media(max-width:620px){
  body[data-page="home"] .storefront-hero { margin: 0; padding: 0; }
  body[data-page="home"] .storefront-layout { width: 100%; max-width: none; }
  body[data-page="home"] .storefront-slider { width: 100%; min-height: 248px; aspect-ratio: 1.56; border-radius: 0; }
  body[data-page="home"] .campaign-media > img { object-fit: cover; object-position: center; }
  body[data-page="home"] .campaign-slide::after { width: 67%; background: rgba(2, 10, 7, .56); }
  body[data-page="home"] .campaign-copy { left: 42px; width: 54%; padding: 13px 12px 13px 14px; box-sizing: border-box; border-left: 4px solid #e52420; border-radius: 0 5px 5px 0; background: rgba(255,255,255,.92); }
  body[data-page="home"] .campaign-tools .campaign-copy { border-left-color: #fff; background: rgba(5,122,69,.94); }
  body[data-page="home"] .campaign-plumbing .campaign-copy { border-left-color: #078746; }
  body[data-page="home"] .campaign-copy small { margin-bottom: 5px; font-size: 9px; }
  body[data-page="home"] .campaign-copy strong { font-size: 20px; line-height: 1.08; }
  body[data-page="home"] .campaign-copy em { min-height: 32px; margin-top: 10px; padding-inline: 12px; font-size: 10px; }
  body[data-page="home"] .campaign-strip { width: calc(100% - 16px); height: auto; min-height: 210px; aspect-ratio: 1.82; border-radius: 6px; }
  body[data-page="home"] .campaign-strip::after { width: 68%; background: rgba(12, 3, 3, .58); }
  body[data-page="home"] .campaign-strip-green::after { background: rgba(2, 14, 8, .6); }
  body[data-page="home"] .campaign-strip > img { height: 100%; aspect-ratio: auto; object-fit: cover; object-position: 66% center; }
  body[data-page="home"] .campaign-strip-copy { left: 18px; width: 58%; }
  body[data-page="home"] .campaign-strip-copy small { font-size: 8px; }
  body[data-page="home"] .campaign-strip-copy strong { margin-top: 4px; font-size: 19px; line-height: 1.08; }
  body[data-page="home"] .campaign-strip-copy em { min-height: 30px; margin-top: 10px; padding-inline: 11px; font-size: 10px; }
}

@media(prefers-reduced-motion:reduce){.product-card .product-image img,.product-card .whatsapp-action,.brand-tile{transition:none!important}}

/* Canva/Pinterest campaign templates adapted to the Jabal Al Dhaid catalogue. */
body[data-page="home"] .campaign-simple { isolation: isolate; }
body[data-page="home"] .campaign-simple::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  display: block;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  content: "";
  pointer-events: none;
}
body[data-page="home"] .campaign-cement::before {
  background-image:
    linear-gradient(0deg, #060a08 0%, #060a08 31%, rgba(6, 10, 8, .46) 56%, rgba(6, 10, 8, .12) 100%),
    linear-gradient(90deg, #060a08 0%, #060a08 38%, rgba(6, 10, 8, .78) 55%, rgba(6, 10, 8, .35) 100%),
    url("assets/banners/templates/canva-black-equipment.jpg");
}
body[data-page="home"] .campaign-tools::before {
  background-image:
    linear-gradient(90deg, rgba(4, 102, 55, .94) 0%, rgba(5, 121, 65, .84) 48%, rgba(2, 65, 35, .91) 100%),
    url("assets/banners/templates/canva-white-green.jpg");
  background-blend-mode: multiply;
}
body[data-page="home"] .campaign-plumbing::before {
  background-image:
    linear-gradient(90deg, rgba(188, 12, 18, .96) 0%, rgba(218, 25, 29, .88) 48%, rgba(118, 3, 9, .92) 100%),
    url("assets/banners/templates/pinterest-red-metal.jpg");
}
body[data-page="home"] .campaign-strip-paint::before {
  background-image:
    linear-gradient(90deg, rgba(255, 255, 255, .98) 0%, rgba(255, 255, 255, .91) 35%, rgba(255, 255, 255, .54) 68%, rgba(241, 247, 241, .83) 100%),
    url("assets/banners/templates/canva-white-green.jpg");
}
body[data-page="home"] .campaign-strip-green::before {
  background-image:
    linear-gradient(90deg, rgba(7, 13, 11, .96) 0%, rgba(7, 13, 11, .87) 36%, rgba(7, 13, 11, .48) 66%, rgba(7, 13, 11, .83) 100%),
    url("assets/banners/templates/pinterest-black-red.jpg");
}
body[data-page="home"] .campaign-simple.campaign-black { background: #090d0b; }
body[data-page="home"] .campaign-simple.campaign-green { background: #087b45; }
body[data-page="home"] .campaign-simple.campaign-red { background: #e52521; }
body[data-page="home"] .campaign-simple.campaign-white { border: 1px solid #dfe4e1; background: #fff; }
body[data-page="home"] .campaign-simple .campaign-copy,
body[data-page="home"] .campaign-simple .campaign-strip-copy { left: 7%; width: 30%; }
body[data-page="home"] .campaign-simple .campaign-copy,
body[data-page="home"] .campaign-simple .campaign-copy small,
body[data-page="home"] .campaign-simple .campaign-copy strong,
body[data-page="home"] .campaign-simple .campaign-copy > span,
body[data-page="home"] .campaign-simple .campaign-strip-copy,
body[data-page="home"] .campaign-simple .campaign-strip-copy small,
body[data-page="home"] .campaign-simple .campaign-strip-copy strong,
body[data-page="home"] .campaign-simple .campaign-strip-copy > span { color: #fff; }
body[data-page="home"] .campaign-white .campaign-strip-copy,
body[data-page="home"] .campaign-white .campaign-strip-copy small,
body[data-page="home"] .campaign-white .campaign-strip-copy strong,
body[data-page="home"] .campaign-white .campaign-strip-copy > span { color: #111713; }
body[data-page="home"] .campaign-simple .campaign-copy strong,
body[data-page="home"] .campaign-simple .campaign-strip-copy strong { max-width: 360px; }
body[data-page="home"] .campaign-simple > .campaign-product-art {
  position: absolute;
  z-index: 1;
  inset: auto;
  top: 50%;
  right: auto;
  bottom: auto;
  left: 40%;
  width: 40%;
  height: 90%;
  max-width: none;
  display: block;
  transform: translateY(-50%);
  object-fit: contain;
  object-position: center;
}
body[data-page="home"] .campaign-tools > .campaign-product-art { left: 39%; width: 42%; height: 94%; }
body[data-page="home"] .campaign-plumbing > .campaign-product-art { left: 40%; width: 40%; height: 80%; }
body[data-page="home"] .campaign-simple .campaign-action {
  position: absolute;
  z-index: 4;
  top: 50%;
  right: 5.2%;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 18px;
  transform: translateY(-50%);
  border: 1px solid #fff;
  border-radius: 22px;
  background: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  transition: background-color .2s ease,color .2s ease,border-color .2s ease,transform .2s ease;
}
body[data-page="home"] .campaign-simple .campaign-action svg { width: 14px; height: 14px; }
body[data-page="home"] .campaign-black .campaign-action { color: #090d0b; }
body[data-page="home"] .campaign-green .campaign-action { color: #087b45; }
body[data-page="home"] .campaign-red .campaign-action { color: #e52521; }
body[data-page="home"] .campaign-white .campaign-action { border-color: #111713; background: #111713; color: #fff; }
body[data-page="home"] .campaign-black:hover .campaign-action { border-color: #e52521; background: #e52521; color: #fff; transform: translateY(calc(-50% - 2px)); }
body[data-page="home"] .campaign-green:hover .campaign-action { border-color: #111713; background: #111713; color: #fff; transform: translateY(calc(-50% - 2px)); }
body[data-page="home"] .campaign-red:hover .campaign-action { border-color: #087b45; background: #087b45; color: #fff; transform: translateY(calc(-50% - 2px)); }
body[data-page="home"] .campaign-white:hover .campaign-action { border-color: #087b45; background: #087b45; color: #fff; transform: translateY(calc(-50% - 2px)); }
body[data-page="home"] .campaign-strip.campaign-simple .campaign-strip-copy { left: 5.2%; width: 30%; }
body[data-page="home"] .campaign-strip.campaign-simple > .campaign-product-art { left: 39%; width: 42%; height: 88%; }
body[data-page="home"] .campaign-products-original {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 39%;
  width: 42%;
  height: 90%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  transform: translateY(-50%);
  background: transparent;
}
body[data-page="home"] .campaign-products-original img {
  width: 31%;
  height: 90%;
  display: block;
  object-fit: contain;
  background: #fff;
}
body[data-page="home"] .campaign-products-original img:nth-child(2) { transform: scale(1.08); }
body[data-page="home"] .campaign-products-original img:nth-child(3) { width: 42%; height: 100%; }

@media(max-width:940px){
  body[data-page="home"] .campaign-simple .campaign-copy,
  body[data-page="home"] .campaign-strip.campaign-simple .campaign-strip-copy { left: 7%; width: 30%; }
  body[data-page="home"] .campaign-simple > .campaign-product-art { left: 39%; width: 42%; }
  body[data-page="home"] .campaign-simple .campaign-action { right: 4.5%; padding-inline: 14px; font-size: 10px; }
}

@media(max-width:620px){
  body[data-page="home"] .campaign-simple .campaign-copy,
  body[data-page="home"] .campaign-strip.campaign-simple .campaign-strip-copy {
    top: 25px;
    left: 22px;
    width: 49%;
    z-index: 6;
    padding: 10px 12px;
    transform: none;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 5px;
    background: rgba(8,13,11,.9);
  }
  body[data-page="home"] .campaign-strip.campaign-white .campaign-strip-copy {
    border-color: #dfe4e1;
    border-left: 4px solid #e52521;
    background: rgba(255,255,255,.96);
    box-shadow: 0 6px 16px rgba(17,23,19,.1);
  }
  body[data-page="home"] .storefront-slide.campaign-simple .campaign-copy {
    top: 42%;
    left: 5%;
    width: 48%;
    padding: 0;
    transform: translateY(-50%);
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    text-align: center;
  }
  body[data-page="home"] .campaign-strip.campaign-simple .campaign-strip-copy {
    top: 42%;
    left: 5%;
    width: 48%;
    padding: 0;
    transform: translateY(-50%);
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    text-align: center;
  }
  body[data-page="home"] .campaign-simple .campaign-copy small,
  body[data-page="home"] .campaign-simple .campaign-copy strong,
  body[data-page="home"] .campaign-simple .campaign-copy > span,
  body[data-page="home"] .campaign-strip.campaign-simple .campaign-strip-copy small,
  body[data-page="home"] .campaign-strip.campaign-simple .campaign-strip-copy strong,
  body[data-page="home"] .campaign-strip.campaign-simple .campaign-strip-copy > span { color: #fff; }
  body[data-page="home"] .campaign-strip.campaign-white .campaign-strip-copy small,
  body[data-page="home"] .campaign-strip.campaign-white .campaign-strip-copy strong,
  body[data-page="home"] .campaign-strip.campaign-white .campaign-strip-copy > span { color: #111713; }
  body[data-page="home"] .campaign-simple .campaign-copy strong,
  body[data-page="home"] .campaign-strip.campaign-simple .campaign-strip-copy strong {
    display: block;
    opacity: 1;
    visibility: visible;
    font-size: 20px;
    line-height: 1.08;
  }
  body[data-page="home"] .campaign-simple .campaign-copy > span,
  body[data-page="home"] .campaign-strip.campaign-simple .campaign-strip-copy > span { display: none; }
  body[data-page="home"] .campaign-simple > .campaign-product-art,
  body[data-page="home"] .campaign-tools > .campaign-product-art,
  body[data-page="home"] .campaign-plumbing > .campaign-product-art,
  body[data-page="home"] .campaign-strip.campaign-simple > .campaign-product-art {
    top: 44%;
    left: auto;
    right: 1%;
    width: 48%;
    height: 63%;
  }
  body[data-page="home"] .campaign-products-original {
    top: 44%;
    left: auto;
    right: 1%;
    width: 49%;
    height: 62%;
  }
  body[data-page="home"] .campaign-products-original img:nth-child(1) { display: none; }
  body[data-page="home"] .campaign-products-original img:nth-child(2) { width: 38%; }
  body[data-page="home"] .campaign-products-original img:nth-child(3) { width: 62%; }
  body[data-page="home"] .campaign-simple .campaign-action {
    top: auto;
    right: auto;
    bottom: 22px;
    left: 22px;
    min-height: 34px;
    padding: 0 12px;
    transform: none;
    font-size: 9px;
  }
  body[data-page="home"] .campaign-black:hover .campaign-action,
  body[data-page="home"] .campaign-green:hover .campaign-action,
  body[data-page="home"] .campaign-red:hover .campaign-action,
  body[data-page="home"] .campaign-white:hover .campaign-action { transform: translateY(-2px); }
  body[data-page="home"] .campaign-strip.campaign-simple { min-height: 210px; }
}

/* Keep cart controls above legacy reference overrides. */
.header-cart { width: 72px; min-width: 72px; height: 48px; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 0; cursor: pointer; }
.header-cart > svg { width: 27px; height: 27px; }
.product-quote-button { border: 1px solid var(--red); background: #fff; color: var(--red); }
@media (max-width: 940px) {
  .header-cart { width: 48px; min-width: 48px; height: 44px; display: flex; }
  .header-cart > span { display: none; }
  .header-cart > svg { width: 24px; height: 24px; }
}