/* Sticky Labels brand layer, 25 Sep 2026.
   One typeface (Inter, loaded from inc.meta.php), one heading system across the home page, category hub,
   category pages, product pages, old-template pages and the label builder, plus the shared rating bar.
   Loaded last from inc.header.php so it wins over the older stylesheets. */
:root {
  --slb-font: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --slb-ink: #10261d;
  --slb-forest: #173d2c;
  --slb-green: #648d27;
  --slb-grey: #65736c;
}

/* ---- Typeface ---- */
/* cart-checkout-restyle.css defines its own --sl-font on :root and loads after this file; html:root outranks it. */
html:root { --sl-font: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
html, body, button, input, select, textarea, h1, h2, h3, h4, h5, h6,
.sl-topbar, .sl-header, .sl-nav, .sl-nav a, .slx-trigger, .slx-panel, .mobile-menu-container,
.homepage-redesign, .homepage-redesign *, .store-body, .page-content,
.v2-master-page, .v2-product-page, .v2-category-page, #lb-builder, #lb-builder * {
  font-family: var(--slb-font) !important;
}
.fa, .fas, .far, .fab, [class^="fa-"], [class*=" fa-"], .homepage-redesign .fa, .homepage-redesign .fas {
  font-family: "Font Awesome 5 Free", "FontAwesome" !important;
}

/* ---- Heading system ---- */
h1, h2, h3 { font-weight: 800; letter-spacing: -.025em; }

/* Page titles (hub, category, product, material guide). The older sheets use !important for sizes, so this layer does too. */
.v2-master-copy h1,
.v2-master-page .v2-master-copy h1,
.v2-category-hero h1,
.v2-product-commerce h1 {
  max-width: 680px !important;
  margin: 0 0 12px !important;
  color: var(--slb-ink) !important;
  font-size: clamp(38px, 4.3vw, 60px) !important;
  font-weight: 800 !important;
  line-height: 1.02 !important;
  letter-spacing: -.03em !important;
  opacity: 1 !important;
}
.sl-hero-tagline {
  max-width: 620px !important;
  margin: 0 0 10px !important;
  color: var(--slb-forest) !important;
  font-size: clamp(18px, 1.6vw, 20px) !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  letter-spacing: -.015em !important;
}
.v2-category-hero > div:first-child > p:not(.v2-kicker):not(.sl-hero-tagline),
.v2-master-copy > p:not(.v2-kicker):not(.sl-hero-tagline) { color: var(--slb-grey); }

/* Section headings on light backgrounds */
.v2-product-collection h2,
.v2-editorial-split h2,
.v2-faq-section h2,
.v2-guide-feature h2,
.v2-product-description > header h2,
.v2-related-products h2,
.v2-category-copy h2,
.v2-master-page .v2-category-copy h2,
.v2-master-intro h2 {
  color: var(--slb-ink) !important;
  font-size: clamp(28px, 3.2vw, 44px) !important;
  font-weight: 800 !important;
  line-height: 1.06 !important;
  letter-spacing: -.03em !important;
  opacity: 1 !important;
}
.v2-category-copy h2 a { color: inherit !important; }
/* Section headings on dark backgrounds keep their colour, only the scale is unified */
.v2-directory h2,
.v2-sibling-strip h2,
.v2-guide-help h2,
.v2-review-section h2 {
  font-size: clamp(28px, 3.2vw, 44px) !important;
  font-weight: 800 !important;
  line-height: 1.06 !important;
  letter-spacing: -.03em !important;
}
.v2-rich-description h2 { color: var(--slb-forest) !important; font-size: 26px !important; font-weight: 800 !important; letter-spacing: -.025em !important; }
.v2-rich-description h3 { color: var(--slb-forest) !important; font-size: 20px !important; font-weight: 700 !important; letter-spacing: -.015em !important; }
.v2-kicker { color: var(--slb-green) !important; font-weight: 800 !important; }
.v2-button { font-size: 14px !important; font-weight: 800 !important; letter-spacing: 0 !important; }
/* Hero buttons: compact height, clear gap from the text above, arrow in the button's own colour */
.v2-category-hero .v2-button, .v2-master-copy .v2-button {
  min-height: 0 !important;
  margin-top: 18px !important;
  padding: 13px 22px !important;
  line-height: 1.1 !important;
  gap: 10px !important;
}
.v2-button span { color: inherit !important; -webkit-text-fill-color: currentColor !important; font-size: 13px !important; line-height: 1 !important; }
.v2-category-hero > div:first-child > p:not(.v2-kicker):not(.sl-hero-tagline) { margin-bottom: 0 !important; }

/* Old-template category pages */
.page-content .heading-md, .page-content h1.heading-md {
  color: var(--slb-ink) !important;
  font-size: clamp(32px, 3.6vw, 44px) !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  letter-spacing: -.03em !important;
}
.page-content .reviews-section h2, .page-content .faq-section h2, .page-content h2.heading, .page-content .related-products h2 {
  color: var(--slb-ink) !important;
  font-size: clamp(26px, 3vw, 36px) !important;
  font-weight: 800 !important;
  letter-spacing: -.03em !important;
}
.breadcrumb-inner p { color: var(--slb-grey); font-size: 13px; }
.breadcrumb-inner a { color: var(--slb-green) !important; }
.intro-text-section .sl-rbar-hero { margin-top: 14px; }

/* Label builder page title */
#lb-builder .lb-page-title {
  max-width: 1100px;
  margin: 22px auto 4px;
  padding: 0 16px;
  color: var(--slb-ink);
  font-size: clamp(24px, 2.6vw, 32px);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -.03em;
  text-align: center;
}
#lb-builder .lb-page-sub {
  max-width: 1100px;
  margin: 0 auto 12px;
  padding: 0 16px;
  color: var(--slb-grey);
  font-size: 15px;
  line-height: 1.5;
  text-align: center;
}

/* ---- Shared rating bar (Google + Trustpilot) ---- */
.sl-rbar {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  color: var(--slb-ink);
  font-family: var(--slb-font) !important;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
}
.sl-rbar a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  white-space: nowrap;
  color: var(--slb-ink) !important;
  text-decoration: none !important;
  border-radius: 6px;
  transition: opacity .15s;
}
.sl-rbar a:hover { opacity: .75; }
.sl-rbar a:focus-visible { outline: 2px solid #91b93d; outline-offset: 3px; }
.sl-rbar svg { flex: none; display: block; width: 15px; height: 15px; }
.sl-rbar b { font-weight: 800; font-size: 13px; }
.sl-rbar-name { font-weight: 700; }
.sl-rbar-count { color: var(--slb-grey); }
.sl-rbar-sep { flex: none; width: 0; height: 16px; border-left: 1px solid #ddd8c8; }
/* Hero variant: a quiet one-line rating directly under the page title (no pill, no border) */
.sl-rbar-hero {
  margin: 0 0 18px !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  gap: 14px !important;
  color: var(--slb-grey) !important;
  font-size: 13px !important;
}
.sl-rbar-hero b { font-weight: 700 !important; color: var(--slb-ink) !important; }
.sl-rbar-hero .sl-rbar-name { font-weight: 600 !important; color: var(--slb-ink) !important; }
.sl-rbar-hero .sl-rbar-sep { height: 12px !important; border-color: #cfd6cf !important; }
.sl-rbar a:focus { outline: none !important; }
.sl-rbar a:focus-visible { outline: 2px solid #91b93d !important; outline-offset: 3px !important; }
/* Put the rating line straight under the H1 on the hub and category heroes without touching the templates' markup order */
.v2-category-hero > div:first-child, .v2-master-copy { display: flex; flex-direction: column; align-items: flex-start; }
.v2-category-hero > div:first-child > .v2-kicker, .v2-master-copy > .v2-kicker { order: -3; }
.v2-category-hero > div:first-child > h1, .v2-master-copy > h1 { order: -2; margin-bottom: 10px !important; }
.v2-category-hero > div:first-child > .sl-rbar-hero, .v2-master-copy > .sl-rbar-hero { order: -1; }
.v2-master-copy .v2-button + .sl-rbar-hero { margin-top: 0 !important; }
.intro-text-section .sl-rbar-hero { margin: 12px 0 0 !important; }
/* Product page variant under the photo (moved here from the inline block in catalog-v2-views.php) */
.v2-product-page .v2-has-rbar { border-radius: 20px; box-shadow: 0 30px 60px rgba(15, 33, 25, .12); }
.v2-product-page .v2-has-rbar .v2-main-product-image { border-bottom-left-radius: 0; border-bottom-right-radius: 0; box-shadow: none; }
.v2-product-page .v2-rbar {
  display: flex;
  justify-content: center;
  min-height: 42px;
  padding: 8px 12px;
  background: #fff;
  border-top: 1px solid #ece8da;
  border-radius: 0 0 20px 20px;
}

@media (max-width: 650px) {
  .v2-master-page .v2-master-copy h1 { font-size: 38px !important; }
  .v2-master-page .v2-category-copy h2 { font-size: 30px !important; }
}
@media (max-width: 640px) {
  .sl-rbar-hero { font-size: 12px !important; gap: 10px !important; }
  .sl-rbar-hero b { font-size: 12px !important; }
  .sl-hero-tagline { font-size: 17px !important; }
}
