/** Shopify CDN: Minification failed

Line 1230:0 Unexpected "}"

**/
/* ==========================================================================
   Webspires v2 - Click It Flooring
   Cream & ink with rust and forest accents. Plus Jakarta Sans display, Inter body.
   ========================================================================== */

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url('inter-latin-var.woff2') format('woff2');
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 500 800;
  font-display: swap;
  src: url('jakarta-latin-var.woff2') format('woff2');
}

:root {
  --black: #0a0a0a;
  --accent: #f2b705;
  --accent-deep: #d9a204;
  --price-red: #d2331f;
  --ink: #0f1418;
  --graphite: #333c44;
  --slate: #66727c;
  --line: #e4e8ea;
  --paper: #ffffff;
  --mist: #f5f7f8;
  --sand: #f7f2ec;
  --cream: #f8f4ee;
  --cream-2: #f1ebe3;
  --rust: #bf4a1c;
  --rust-deep: #a63f16;
  --amber: #e0982f;
  --bark: #a9673a;
  --forest: #2d3b34;
  --forest-deep: #22302a;

  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-display: 'Plus Jakarta Sans', 'Inter', -apple-system, sans-serif;

  --content: 760px;
  --wide: 1400px;
  --radius: 8px;
  --radius-lg: 12px;
  --radius-xl: 18px;
  --shadow-soft: 0 1px 2px rgba(15,20,24,.04), 0 8px 24px -12px rgba(15,20,24,.10);
  --shadow-lifted: 0 2px 4px rgba(15,20,24,.05), 0 18px 44px -18px rgba(15,20,24,.18);
}

/* --- Reset / base ------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.65;
  letter-spacing: -0.005em;
  color: var(--graphite);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.028em;
  color: var(--ink);
  margin: 0 0 0.6em;
}
h1 { font-size: clamp(2.125rem, 4.5vw, 3.75rem); letter-spacing: -0.036em; }
h2 { font-size: clamp(1.625rem, 3vw, 2.5rem); letter-spacing: -0.032em; }
h3 { font-size: clamp(1.125rem, 1.6vw, 1.375rem); }
h4 { font-size: 1.0625rem; letter-spacing: -0.015em; }
p { margin: 0 0 1em; }
a { color: var(--ink); text-decoration: none; }
a:hover { color: var(--rust); }
:focus-visible { outline: 2px solid var(--rust); outline-offset: 2px; border-radius: 2px; }
svg { display: inline-block; }

.ws-skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 200;
  background: var(--ink); color: var(--paper); padding: 10px 16px; border-radius: 0 0 var(--radius) 0;
}
.ws-skip-link:focus { left: 0; color: var(--paper); }

.ws-visually-hidden {
  position: absolute !important; width: 1px; height: 1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

/* --- Layout helpers ----------------------------------------------------- */
.ws-wrap { max-width: var(--wide); margin-inline: auto; padding-inline: clamp(16px, 3.5vw, 40px); }
.ws-prose { max-width: var(--content); margin-inline: auto; }
.ws-section { padding-block: clamp(3rem, 6vw, 5.5rem); }
.ws-section--tight { padding-block: clamp(2rem, 4vw, 3rem); }
.ws-section--mist { background: var(--mist); }
.ws-section--sand { background: var(--sand); }
.ws-section--cream { background: var(--cream); }
.ws-section--paper { background: var(--paper); }
.ws-section--ink { background: var(--ink); color: #c9d1d7; }
.ws-section--ink h1, .ws-section--ink h2, .ws-section--ink h3 { color: var(--paper); }

/* --- Eyebrows, headings, links ------------------------------------------- */
.ws-eyebrow {
  font-family: var(--font-display);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rust);
  display: flex; align-items: center; gap: 10px;
  margin: 0 0 14px;
}
.ws-eyebrow::before { content: ''; width: 28px; height: 2px; background: currentColor; flex: none; }
.ws-eyebrow--bark { color: var(--bark); }
.ws-eyebrow--center { justify-content: center; }
.ws-eyebrow--center::after { content: ''; width: 28px; height: 2px; background: currentColor; flex: none; }
.ws-eyebrow--plain::before { display: none; }

.ws-h2 { font-size: clamp(2rem, 4.2vw, 3.375rem); letter-spacing: -0.035em; line-height: 1.04; margin: 0 0 0.45em; }
.ws-h2--sm { font-size: clamp(1.75rem, 3.2vw, 2.5rem); }
.ws-h3 { font-size: clamp(1.375rem, 2.2vw, 1.75rem); letter-spacing: -0.03em; margin: 0 0 0.7em; }
.ws-h2 em, .ws-accent { font-style: normal; color: var(--rust); }
.ws-accent--bark, .ws-h2 em.ws-accent--bark { color: var(--bark); }
.ws-lead { font-size: clamp(1rem, 1.3vw, 1.1875rem); color: var(--graphite); max-width: 62ch; margin: 0; line-height: 1.55; }

.ws-head-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: clamp(22px, 3vw, 40px); flex-wrap: wrap; }
.ws-head-row > div:first-child { max-width: 760px; }
.ws-head-row--tight { margin-bottom: 18px; align-items: center; }
.ws-head-row--tight h2 { margin: 0; }
.ws-head--center { text-align: center; max-width: 860px; margin-inline: auto; margin-bottom: clamp(24px, 3.5vw, 44px); }
.ws-head--center .ws-lead { margin-inline: auto; }

.ws-link-arrow { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-display); font-weight: 600; color: var(--ink); border-bottom: 2px solid var(--ink); padding-bottom: 2px; white-space: nowrap; }
.ws-link-arrow svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 2; }
.ws-link-arrow:hover { color: var(--rust); border-color: var(--rust); }

.ws-section-head { margin-bottom: clamp(20px, 3vw, 36px); }
.ws-section-head p { max-width: 560px; color: var(--slate); margin: 0; }
.ws-section-head__link { display: inline-block; margin-top: 10px; font-family: var(--font-display); font-weight: 600; font-size: 0.9375rem; white-space: nowrap; }
.ws-section-head__link::after { content: ' \2192'; }
@media (max-width: 719.98px) {
  .ws-section-head h2 { margin-bottom: 0.4em; }
  .ws-section-head p { font-size: 0.9375rem; line-height: 1.55; }
  .ws-section-head__link--hide-sm { display: none; }
}
@media (min-width: 720px) {
  .ws-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
  .ws-section-head__link { margin-top: 0; }
}

/* --- Buttons ------------------------------------------------------------ */
.ws-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-family: var(--font-display); font-size: 0.9375rem; font-weight: 600; line-height: 1.2;
  letter-spacing: -0.005em;
  padding: 0.9rem 1.5rem; border-radius: 10px;
  background: var(--ink); color: var(--paper);
  border: 1.5px solid var(--ink);
  cursor: pointer; transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}
.ws-btn svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 2; flex: none; }
.ws-btn:hover { background: var(--graphite); border-color: var(--graphite); color: var(--paper); }
.ws-btn--rust { background: var(--rust); border-color: var(--rust); }
.ws-btn--rust:hover { background: var(--rust-deep); border-color: var(--rust-deep); }
.ws-btn--forest { background: var(--forest); border-color: var(--forest); }
.ws-btn--forest:hover { background: var(--forest-deep); border-color: var(--forest-deep); }
.ws-btn--outline { background: transparent; color: var(--ink); border-color: var(--ink); }
.ws-btn--outline:hover { background: var(--ink); color: var(--paper); }
.ws-btn--ghost { background: transparent; color: var(--ink); border-color: var(--line); }
.ws-btn--ghost:hover { background: var(--mist); color: var(--ink); border-color: var(--line); }
.ws-btn--on-dark { background: transparent; color: var(--paper); border-color: rgba(255,255,255,.35); }
.ws-btn--on-dark:hover { background: rgba(255,255,255,.1); color: var(--paper); }
.ws-btn--small { padding: 0.6rem 1rem; font-size: 0.875rem; }
.ws-btn--lg { padding: 1.05rem 1.75rem; font-size: 1.0625rem; }
.ws-btn--full { width: 100%; }
.ws-btn[disabled] { opacity: .5; cursor: not-allowed; }

.ws-arrow-circle { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; border: 1.5px solid currentColor; flex: none; }
.ws-arrow-circle svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 2; }
.ws-arrow-circle--solid { background: var(--paper); border: 0; color: var(--ink); width: 46px; height: 46px; box-shadow: 0 2px 10px rgba(0,0,0,.18); }
.ws-arrow-circle--sm { width: 36px; height: 36px; }
.ws-arrow-circle--bark { background: var(--bark); color: #fff; border: 0; width: 46px; height: 46px; }

/* --- Top bar -------------------------------------------------------------- */
.ws-topbar { background: var(--forest); color: #e6ebe7; font-size: 0.8125rem; }
.ws-topbar__inner {
  max-width: var(--wide); margin-inline: auto;
  padding: 9px clamp(16px, 3.5vw, 40px);
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.ws-topbar__group { display: flex; align-items: center; }
.ws-topbar__item { display: inline-flex; align-items: center; gap: 8px; margin: 0; padding-inline: 16px; border-left: 1px solid rgba(255,255,255,.14); white-space: nowrap; }
.ws-topbar__group .ws-topbar__item:first-child { padding-left: 0; border-left: 0; }
.ws-topbar__item svg { width: 16px; height: 16px; stroke: #fff; fill: none; stroke-width: 1.8; flex: none; }
.ws-topbar__item a { color: #fff; display: inline-flex; align-items: center; gap: 4px; }
.ws-topbar__item a:hover { color: var(--amber); }
.ws-topbar__stars { display: inline-flex; gap: 1px; margin-left: 4px; }
.ws-topbar__stars svg { width: 13px; height: 13px; fill: var(--amber); stroke: none; }
@media (max-width: 1099px) { .ws-topbar__group--right { display: none; } }
@media (max-width: 899px) {
  .ws-topbar__group--usps { display: none; }
  .ws-topbar__inner { justify-content: center; }
}
@media (max-width: 480px) { .ws-topbar__item--email { display: none; } }

/* --- Header --------------------------------------------------------------- */
.ws-header { background: var(--paper); border-bottom: 1px solid var(--line); }
.ws-header__inner {
  max-width: var(--wide); margin-inline: auto;
  display: grid; grid-template-columns: auto 1fr auto; align-items: center;
  gap: clamp(12px, 2.4vw, 36px);
  padding: 12px clamp(16px, 3.5vw, 40px);
}
.ws-logo img { width: clamp(130px, 14vw, 200px); height: auto; }

.ws-search { display: none; }
@media (min-width: 900px) { .ws-search { display: block; } }
.ws-search__form { position: relative; max-width: 720px; margin-inline: auto; display: flex; align-items: center; height: 54px; border: 1.5px solid var(--line); border-radius: 999px; background: var(--paper); padding: 4px 4px 4px 0; transition: border-color .15s ease, box-shadow .15s ease; }
.ws-search__form:focus-within { border-color: var(--forest); box-shadow: 0 0 0 3px rgba(45,59,52,.12); }
.ws-search__icon { display: inline-flex; width: 48px; height: 100%; align-items: center; justify-content: center; color: var(--ink); flex: none; }
.ws-search__icon svg { width: 22px; height: 22px; stroke: currentColor; fill: none; stroke-width: 1.9; }
.ws-search__form input { flex: 1; min-width: 0; height: 100%; border: 0; background: none; font: inherit; font-size: 1rem; color: var(--ink); padding: 0; }
.ws-search__form input::placeholder { color: var(--slate); }
.ws-search__form input:focus { outline: none; }
.ws-search__submit { height: 100%; padding: 0 26px; border: 0; border-radius: 999px; background: var(--forest); color: #fff; font-family: var(--font-display); font-weight: 600; font-size: 0.9375rem; cursor: pointer; flex: none; }
.ws-search__submit:hover { background: var(--forest-deep); }

.ws-header__actions { display: flex; align-items: center; gap: clamp(2px, 1vw, 14px); justify-self: end; }
.ws-hact {
  position: relative; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  min-width: 52px; padding: 4px 6px; border: 0; background: none; border-radius: 10px; cursor: pointer;
  color: var(--ink); font-family: var(--font-display); font-size: 0.75rem; font-weight: 500; line-height: 1;
}
.ws-hact:hover { color: var(--rust); background: var(--cream); }
.ws-hact svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.ws-hact__count {
  position: absolute; top: -2px; right: 6px; min-width: 18px; height: 18px;
  background: var(--rust); color: var(--paper); border-radius: 999px;
  font-size: 0.6875rem; font-weight: 700; line-height: 18px; text-align: center; padding-inline: 4px;
}
.ws-hact--search { display: inline-flex; }
@media (min-width: 900px) { .ws-hact--search { display: none; } }
@media (max-width: 480px) { .ws-hact--account, .ws-hact--wishlist { display: none; } .ws-hact span:not(.ws-hact__count) { display: none; } .ws-hact { min-width: 42px; } }
.ws-header__divider { width: 1px; height: 36px; background: var(--line); margin-inline: 6px; display: none; }
.ws-header__cta { display: none; white-space: nowrap; }
@media (min-width: 1140px) { .ws-header__cta, .ws-header__divider { display: inline-flex; } .ws-header__divider { display: block; } }
.ws-burger { display: inline-flex; }
@media (min-width: 900px) { .ws-burger { display: none; } }

.ws-header__search-mobile { display: none; padding: 0 clamp(16px, 3.5vw, 40px) 12px; }
.ws-header__search-mobile[data-open="true"] { display: block; }
.ws-header__search-mobile .ws-search__form { height: 48px; max-width: none; }
@media (min-width: 900px) { .ws-header__search-mobile { display: none !important; } }

/* Nav bar */
.ws-navbar { border-top: 1px solid var(--line); display: none; background: var(--paper); }
@media (min-width: 900px) { .ws-navbar { display: block; } }
.ws-nav { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.ws-nav__list { display: flex; align-items: center; gap: clamp(4px, 1.2vw, 18px); list-style: none; margin: 0; padding: 0; }
.ws-nav__item { position: relative; display: flex; align-items: center; }
.ws-nav__item--mega { position: static; }
.ws-nav__link {
  display: inline-block; font-family: var(--font-display); font-size: 1.0625rem; font-weight: 500;
  padding: 15px 12px 13px; border-bottom: 2px solid transparent; color: var(--ink); white-space: nowrap;
}
.ws-nav__item:hover > .ws-nav__link, .ws-nav__item[data-open="true"] > .ws-nav__link, .ws-nav__link[aria-current="page"] { border-bottom-color: var(--forest); color: var(--ink); }
.ws-nav__link.ws-nav--sale { color: var(--rust); font-weight: 600; }
.ws-nav__link--quiet { font-weight: 500; color: var(--graphite); }
.ws-nav__toggle { border: 0; background: none; padding: 0 8px 0 0; margin-left: -8px; cursor: pointer; color: var(--ink); display: inline-flex; align-items: center; }
.ws-nav__toggle svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 2; transition: transform .2s ease; }
.ws-nav__item[data-open="true"] .ws-nav__toggle svg { transform: rotate(180deg); }
.ws-nav__list--secondary .ws-nav__link { padding-inline: 10px; }

/* Dropdown */
.ws-dd {
  position: absolute; top: 100%; left: 0; min-width: 280px; z-index: 120;
  background: var(--paper); border-radius: 0 0 16px 16px; box-shadow: var(--shadow-lifted); border: 1px solid var(--line); border-top: 0;
  padding: 10px; display: none;
}
.ws-nav__item[data-open="true"] > .ws-dd { display: block; }
.ws-dd ul { list-style: none; margin: 0; padding: 0; }
.ws-dd li a { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border-radius: 10px; font-weight: 500; color: var(--ink); }
.ws-dd li a:hover { background: var(--cream); color: var(--ink); }
.ws-dd li a > svg { width: 16px; height: 16px; stroke: var(--slate); fill: none; stroke-width: 2; margin-left: auto; }

/* Mega menu */
.ws-mega {
  position: absolute; top: 100%; left: 0; right: 0; z-index: 120;
  background: var(--paper); border-radius: 0 0 22px 22px; box-shadow: 0 30px 60px -20px rgba(15,20,24,.35); border-top: 1px solid var(--line);
  display: none;
}
.ws-nav__item[data-open="true"] > .ws-mega { display: block; }
.ws-mega__inner {
  max-width: var(--wide); margin-inline: auto; padding: 34px clamp(16px, 3.5vw, 40px) 36px;
  display: grid; grid-template-columns: repeat(var(--ws-mega-cols, 4), minmax(0, 1fr)) minmax(280px, 1.15fr); gap: 0 24px;
}
.ws-mega__col { padding-right: 20px; border-right: 1px solid var(--line); min-width: 0; }
.ws-mega__col h3 { font-size: 1.375rem; margin: 0 0 6px; letter-spacing: -0.025em; }
.ws-mega__col > p { font-size: 0.9375rem; color: var(--slate); margin: 0 0 18px; line-height: 1.45; }
.ws-mega__col ul { list-style: none; margin: 0; padding: 0; }
.ws-mega__col li a { display: flex; align-items: center; gap: 12px; padding: 7px 8px 7px 0; border-radius: 12px; font-size: 1rem; font-weight: 500; color: var(--ink); }
.ws-mega__label { font-size: 0.9375rem; line-height: 1.25; min-width: 0; }
.ws-mega__col li a:hover { color: var(--rust); }
.ws-mega__col li a:hover .ws-mega__thumb, .ws-mega__col li a:hover .ws-mega__icon { box-shadow: 0 0 0 2px var(--rust); }
.ws-mega__col li a > svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 2; margin-left: auto; flex: none; }
.ws-mega__thumb { width: 50px; height: 50px; border-radius: 50%; object-fit: cover; flex: none; background: var(--mist); }
.ws-mega__icon { width: 48px; height: 48px; border-radius: 50%; background: var(--cream-2); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.ws-mega__icon svg { width: 24px; height: 24px; stroke: var(--ink); fill: none; stroke-width: 1.6; }
.ws-mega__icon--sm { width: 40px; height: 40px; }
.ws-mega__icon--sm svg { width: 20px; height: 20px; }
.ws-mega__promo { position: relative; border-radius: 18px; overflow: hidden; min-height: 440px; background: var(--cream); display: flex; align-items: center; }
.ws-mega__promo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: right center; }
.ws-mega__promo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(248,244,238,.98) 0%, rgba(248,244,238,.92) 40%, rgba(248,244,238,.3) 72%, rgba(248,244,238,0) 100%); }
.ws-mega__promo-body { position: relative; z-index: 1; padding: 30px 28px; max-width: 320px; }
.ws-mega__promo-body h3 { font-size: clamp(1.75rem, 2.4vw, 2.375rem); line-height: 1.05; letter-spacing: -0.035em; margin: 0 0 10px; }
.ws-mega__promo-body p { font-size: 0.9375rem; color: var(--graphite); margin: 0 0 18px; }
.ws-mega__promo-actions { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.ws-mega__promo-actions .ws-btn { width: 100%; max-width: 250px; }

/* Grouped dropdown (Type / Installation / Thickness / Brands / Colour) - same design as the Shop all mega menu */
.ws-mega__label { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.ws-mega--groups .ws-mega__inner { grid-template-columns: repeat(var(--ws-mega-cols, 4), minmax(0, 1fr)) minmax(220px, 0.9fr); gap: 0 16px; padding-top: 28px; padding-bottom: 30px; }
.ws-mega--groups .ws-mega__col { padding-right: 12px; }
.ws-mega--groups .ws-mega__col h3 { font-size: 1.0625rem; margin: 0 0 4px; line-height: 1.15; }
.ws-mega--groups .ws-mega__col > p { font-size: 0.8125rem; margin: 0 0 10px; line-height: 1.35; }
@media (max-width: 1499px) { .ws-mega--groups .ws-mega__col > p { display: none; } .ws-mega--groups .ws-mega__col h3 { margin-bottom: 10px; } }
.ws-mega--groups .ws-mega__col li a { padding: 4px 4px 4px 0; gap: 9px; font-size: 0.9rem; }
.ws-mega--groups .ws-mega__label { font-size: 0.875rem; line-height: 1.2; overflow-wrap: normal; hyphens: none; }
.ws-mega--groups .ws-mega__col li a > svg { display: none; }
.ws-mega--groups .ws-mega__icon, .ws-mega__swatch { width: 36px; height: 36px; }
.ws-mega--groups .ws-mega__icon svg { width: 18px; height: 18px; }
.ws-mega__icon--text { font-family: var(--font-display); font-weight: 700; font-size: 0.75rem; color: var(--ink); letter-spacing: -0.02em; }
.ws-mega__col--2 { grid-column: span 2; }
.ws-mega__col--2 ul { columns: 2; column-gap: 12px; }
.ws-mega__col--2 li { break-inside: avoid; }
.ws-mega__swatch { border-radius: 50%; flex: none; box-shadow: inset 0 0 0 1px rgba(15,20,24,.12); }
.ws-mega--groups .ws-mega__promo { min-height: 360px; }
.ws-mega--groups .ws-mega__promo-body { max-width: 300px; padding: 26px 22px; }
.ws-mega--groups .ws-mega__promo-body h3 { font-size: clamp(1.375rem, 1.6vw, 1.75rem); }
.ws-mega--groups .ws-mega__promo-body p { font-size: 0.875rem; }

/* --- Drawer (mobile menu) ----------------------------------------------- */
.ws-iconbtn {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; border-radius: 50%;
  background: transparent; border: 0; cursor: pointer; color: var(--ink);
}
.ws-iconbtn:hover { background: var(--mist); color: var(--ink); }
.ws-iconbtn svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.ws-drawer { position: fixed; inset: 0; z-index: 150; visibility: hidden; }
.ws-drawer[data-open="true"] { visibility: visible; }
.ws-drawer__scrim {
  position: absolute; inset: 0; background: rgba(15,20,24,.5);
  border: 0; opacity: 0; transition: opacity .2s ease; cursor: pointer;
}
.ws-drawer[data-open="true"] .ws-drawer__scrim { opacity: 1; }
.ws-drawer__sheet {
  position: absolute; top: 0; bottom: 0; left: 0; width: min(380px, 90vw);
  background: var(--paper); box-shadow: var(--shadow-lifted);
  transform: translateX(-102%); transition: transform .25s ease;
  display: flex; flex-direction: column; overflow-y: auto; padding: 18px 22px 28px;
}
.ws-drawer[data-open="true"] .ws-drawer__sheet { transform: none; }
.ws-drawer__top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.ws-drawer__top img { width: 128px; }
.ws-drawer__label {
  font-family: var(--font-display); font-size: 0.75rem; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--slate);
  margin: 22px 0 6px;
}
.ws-drawer ul { list-style: none; margin: 0; padding: 0; }
.ws-drawer__menu > li > a, .ws-drawer__row { display: flex; align-items: center; justify-content: space-between; padding: 11px 0; font-weight: 500; font-size: 1.0625rem; border-bottom: 1px solid var(--mist); }
.ws-drawer__row a { flex: 1; }
.ws-drawer__acc { border: 0; background: var(--cream); width: 36px; height: 36px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; color: var(--ink); }
.ws-drawer__acc svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 2; transition: transform .2s ease; }
.ws-drawer__acc[aria-expanded="true"] svg { transform: rotate(180deg); }
.ws-drawer__sub { padding: 6px 0 10px 14px; border-left: 2px solid var(--cream-2); margin: 6px 0 10px 4px; }
.ws-drawer__sub ul a { display: block; padding: 7px 0; font-size: 0.9375rem; color: var(--graphite); }
.ws-drawer__sublabel { font-family: var(--font-display); font-size: 0.8125rem; font-weight: 700; color: var(--bark); margin: 10px 0 2px; }
.ws-drawer__foot { margin-top: 26px; color: var(--slate); font-size: 0.9375rem; }
.ws-drawer__foot a { font-weight: 700; }
@media (prefers-reduced-motion: reduce) {
  .ws-drawer__sheet, .ws-drawer__scrim { transition: none; }
}

/* --- Hero ---------------------------------------------------------------- */
.ws-hero { position: relative; background: var(--cream); overflow: hidden; min-height: clamp(520px, 58vw, 720px); display: flex; align-items: center; }
.ws-hero__media { position: absolute; inset: 0; }
.ws-hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 72% center; }
.ws-hero__media::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, var(--cream) 0%, var(--cream) 26%, rgba(248,244,238,.94) 38%, rgba(248,244,238,.55) 54%, rgba(248,244,238,0) 70%);
}
@media (max-width: 899px) {
  .ws-hero__media::after { background: linear-gradient(180deg, rgba(248,244,238,.97) 0%, rgba(248,244,238,.92) 60%, rgba(248,244,238,.7) 100%); }
}
.ws-hero__inner { position: relative; max-width: var(--wide); margin-inline: auto; width: 100%; padding: clamp(3rem, 7vw, 6rem) clamp(16px, 3.5vw, 40px); }
.ws-hero__content { max-width: 660px; }
.ws-hero h1 { color: var(--ink); font-size: clamp(2.5rem, 5.8vw, 5rem); line-height: 1.0; letter-spacing: -0.045em; margin-bottom: 0.3em; max-width: 12ch; }
.ws-hero h1 em { font-style: normal; color: var(--rust); }
.ws-hero h1 em.ws-accent--bark { color: var(--bark); }
.ws-hero__text { font-size: clamp(1.0625rem, 1.7vw, 1.5rem); color: var(--graphite); max-width: 36ch; line-height: 1.4; margin: 0 0 1.4em; }
.ws-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; }

.ws-inline-usps { display: flex; flex-wrap: wrap; margin: 30px 0 0; padding: 0; list-style: none; }
.ws-inline-usps li { display: inline-flex; align-items: center; gap: 12px; padding: 4px 22px 4px 0; margin: 0 22px 8px 0; border-right: 1px solid rgba(15,20,24,.14); font-size: 0.9375rem; font-weight: 500; color: var(--ink); line-height: 1.2; }
.ws-inline-usps li:last-child { border-right: 0; margin-right: 0; padding-right: 0; }
.ws-inline-usps svg { width: 32px; height: 32px; stroke: var(--ink); fill: none; stroke-width: 1.5; flex: none; }
.ws-inline-usps--sm li { font-size: 0.875rem; }
.ws-inline-usps--sm svg { width: 28px; height: 28px; }
@media (max-width: 599px) { .ws-inline-usps li { border-right: 0; margin-right: 0; width: 100%; padding-right: 0; } }

/* --- Promise bar ----------------------------------------------------------- */
.ws-usps { background: var(--cream); border-bottom: 1px solid rgba(15,20,24,.06); }
.ws-usps--bg-white { background: var(--paper); }
.ws-usps__inner { max-width: var(--wide); margin-inline: auto; padding: 20px clamp(16px, 3.5vw, 40px); display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px 20px; }
@media (min-width: 900px) { .ws-usps__inner { grid-template-columns: repeat(4, 1fr); padding-block: 22px; } }
.ws-usp { display: flex; align-items: center; gap: 14px; padding-left: 20px; border-left: 1px solid rgba(15,20,24,.12); }
.ws-usp:first-child { border-left: 0; padding-left: 0; }
@media (max-width: 899px) { .ws-usp:nth-child(odd) { border-left: 0; padding-left: 0; } }
.ws-usp__icon { flex: none; width: 46px; height: 46px; display: inline-flex; align-items: center; justify-content: center; }
.ws-usp__icon svg { width: 36px; height: 36px; stroke: var(--ink); fill: none; stroke-width: 1.5; }
.ws-usps--chips .ws-usp__icon { width: 64px; height: 64px; border-radius: 50%; background: var(--cream-2); }
.ws-usps--chips .ws-usp__icon svg { width: 28px; height: 28px; }
.ws-usp__title { display: block; font-family: var(--font-display); font-weight: 600; color: var(--ink); font-size: 1rem; line-height: 1.25; }
.ws-usp__text { display: block; font-size: 0.9375rem; color: var(--slate); line-height: 1.3; }
.ws-usp__stars { display: inline-flex; gap: 2px; margin-left: 6px; }
.ws-usp__stars svg { width: 18px; height: 18px; fill: var(--amber); stroke: none; }

/* --- Category cards --------------------------------------------------------- */
.ws-cats { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; padding-bottom: 6px; }
.ws-cats::-webkit-scrollbar { display: none; }
.ws-cats > * { flex: 0 0 78%; scroll-snap-align: center; }
@media (min-width: 720px) { .ws-cats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; overflow: visible; scroll-snap-type: none; } .ws-cats > * { flex: none; } }
@media (min-width: 1000px) { .ws-cats { grid-template-columns: repeat(4, 1fr); } }

.ws-ccard { display: flex; flex-direction: column; background: var(--paper); border: 1px solid rgba(15,20,24,.07); border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-soft); transition: transform .2s ease, box-shadow .2s ease; color: var(--ink); }
.ws-ccard:hover { transform: translateY(-3px); box-shadow: var(--shadow-lifted); color: var(--ink); }
.ws-ccard__media { aspect-ratio: 1 / 0.95; background: var(--mist); overflow: hidden; }
.ws-ccard__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.ws-ccard:hover .ws-ccard__media img { transform: scale(1.04); }
.ws-ccard__body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.ws-ccard__body h3 { font-size: 1.4375rem; margin: 0; letter-spacing: -0.025em; }
.ws-ccard__body p { color: var(--graphite); font-size: 0.9375rem; margin: 0; line-height: 1.5; }
.ws-ccard__cta { margin-top: auto; padding-top: 12px; display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-display); font-weight: 600; color: var(--rust); font-size: 0.9375rem; }

.ws-ocard { position: relative; display: flex; align-items: flex-end; aspect-ratio: 1 / 1.12; border-radius: var(--radius-xl); overflow: hidden; background: var(--graphite); color: #fff; box-shadow: var(--shadow-soft); }
.ws-ocard img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.ws-ocard:hover img { transform: scale(1.04); }
.ws-ocard::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(40,30,20,.8) 0%, rgba(40,30,20,.25) 45%, rgba(40,30,20,0) 70%); }
.ws-ocard__body { position: relative; z-index: 1; width: 100%; padding: 22px; display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; }
.ws-ocard__body h3 { color: #fff; margin: 0 0 4px; font-size: 1.5rem; }
.ws-ocard__body p { color: rgba(255,255,255,.88); margin: 0; font-size: 0.9375rem; }
.ws-ocard__icon { position: absolute; top: 22px; left: 22px; z-index: 1; width: 56px; height: 56px; border-radius: 50%; background: rgba(248,244,238,.92); display: inline-flex; align-items: center; justify-content: center; }
.ws-ocard__icon svg { width: 26px; height: 26px; stroke: var(--ink); fill: none; stroke-width: 1.6; }
.ws-ocard:hover { color: #fff; }
@media (prefers-reduced-motion: reduce) { .ws-ccard__media img, .ws-ocard img { transition: none; } }

/* --- Product grid & cards ------------------------------------------------ */
.ws-grid { display: grid; gap: 18px; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 900px) { .ws-grid { grid-template-columns: repeat(4, 1fr); } }
.ws-grid--3 { grid-template-columns: repeat(2, 1fr); }
@media (min-width: 900px) { .ws-grid--3 { grid-template-columns: repeat(3, 1fr); } }

.ws-card {
  position: relative; display: flex; flex-direction: column;
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-lg);
  overflow: hidden; transition: box-shadow .2s ease, transform .2s ease;
}
.ws-card:hover { box-shadow: var(--shadow-lifted); transform: translateY(-2px); }
.ws-card__media { position: relative; aspect-ratio: 1; background: var(--mist); }
.ws-card__media img { width: 100%; height: 100%; object-fit: cover; }
.ws-badge {
  position: absolute; top: 12px; left: 12px; z-index: 1;
  background: var(--rust); color: var(--paper); border-radius: 6px;
  font-family: var(--font-display); font-size: 0.75rem; font-weight: 700; padding: 3px 9px;
}
.ws-card__body { display: flex; flex-direction: column; flex: 1; padding: 14px 16px 16px; }
.ws-card__title { font-size: 0.9375rem; font-weight: 600; color: var(--ink); line-height: 1.35; margin: 0 0 8px; font-family: var(--font-body); letter-spacing: -0.01em; }
.ws-card__title a::after { content: ''; position: absolute; inset: 0; }
.ws-card__price { margin-top: auto; }
.ws-price-m2 { font-family: var(--font-display); font-weight: 700; font-size: 1.1875rem; color: var(--ink); }
.ws-price-m2 small { font-size: 0.75rem; font-weight: 600; color: var(--slate); }
.ws-price-m2 s { color: var(--slate); font-weight: 500; font-size: 0.875rem; margin-left: 6px; }
.ws-price-pack { font-size: 0.8125rem; color: var(--slate); margin: 2px 0 0; }
.ws-card__actions { margin-top: 12px; position: relative; z-index: 1; }

/* --- Product slider -------------------------------------------------------- */
.ws-slider { position: relative; }
.ws-slider__track {
  display: flex; gap: 18px;
  overflow-x: auto; scroll-snap-type: x mandatory;
  scrollbar-width: none; -webkit-overflow-scrolling: touch;
  padding-bottom: 4px;
}
.ws-slider__track::-webkit-scrollbar { display: none; }
.ws-slider__track > * { flex: 0 0 74%; scroll-snap-align: start; }
@media (min-width: 640px) { .ws-slider__track > * { flex-basis: calc((100% - 18px) / 2.2); } }
@media (min-width: 900px) { .ws-slider__track > * { flex-basis: calc((100% - 36px) / 3); } }
@media (min-width: 1100px) { .ws-slider__track > * { flex-basis: calc((100% - 54px) / 4); } }
.ws-slider__btn {
  display: none;
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--paper); color: var(--ink);
  border: 1px solid var(--line); box-shadow: var(--shadow-lifted);
  font-size: 1.25rem; line-height: 1; cursor: pointer;
}
.ws-slider__btn:hover { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.ws-slider__btn--prev { left: -14px; }
.ws-slider__btn--next { right: -14px; }
.ws-slider__nav { display: flex; gap: 8px; }
.ws-slider__btn--inline { position: static; transform: none; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; box-shadow: none; background: var(--cream); border-color: transparent; }
@media (min-width: 900px) { .ws-slider__btn { display: inline-flex; align-items: center; justify-content: center; } }
@media (prefers-reduced-motion: reduce) { .ws-slider__track { scroll-behavior: auto; } }

/* --- Price-focused product card -------------------------------------------- */
.clickit-product-card {
  --cc-accent: #c84a18;
  --cc-accent-dark: #a93c11;
  --cc-text: #161616;
  --cc-secondary: #69717c;
  --cc-muted: #89919b;
  --cc-green: #24834b;
  position: relative;
  display: flex; flex-direction: column;
  background: #ffffff;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 5px 22px rgba(0, 0, 0, 0.07);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
@media (hover: hover) {
  .clickit-product-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.10);
  }
}
.clickit-product-card__media { position: relative; background: var(--mist); }
.clickit-product-card__media img {
  width: 100%; aspect-ratio: 1.25 / 1; object-fit: cover; display: block;
}
.clickit-product-card__sale,
.clickit-product-card__discount {
  position: absolute; top: 14px; z-index: 1;
  font-family: var(--font-display); font-size: 13px; line-height: 1;
  padding: 7px 11px; border-radius: 6px;
}
.clickit-product-card__sale {
  left: 14px; background: var(--cc-accent); color: #ffffff; font-weight: 700;
}
.clickit-product-card__discount {
  right: 14px; background: #ffffff; color: var(--cc-accent); font-weight: 800;
  padding: 7px 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.clickit-product-card__content {
  display: flex; flex-direction: column; flex: 1;
  padding: 16px 16px 18px;
}
.clickit-product-card__category {
  color: var(--cc-accent);
  font-family: var(--font-display);
  font-size: 12px; font-weight: 800;
  text-transform: uppercase; letter-spacing: 0.7px;
  margin: 0 0 7px;
}
.clickit-product-card__heading { margin: 0 0 17px; font-family: inherit; }
.clickit-product-card__title {
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden;
  font-family: var(--font-body);
  font-size: 16px; line-height: 1.35; font-weight: 700;
  color: var(--cc-text); letter-spacing: -0.01em;
  min-height: calc(2 * 1.35em);
}
.clickit-product-card__title::after { content: ''; position: absolute; inset: 0; }
.clickit-product-card__title:hover { color: var(--cc-accent); }
.clickit-product-card__pricing {
  margin-top: auto;
  background: #f7f7f7; border-radius: 10px; padding: 13px;
}
.clickit-product-card__price-row { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.clickit-product-card__price {
  font-family: var(--font-display);
  font-size: 25px; font-weight: 800; color: var(--cc-text); line-height: 1.1;
}
.clickit-product-card__unit { font-size: 13px; font-weight: 500; color: var(--cc-secondary); }
.clickit-product-card__compare-price {
  color: var(--cc-muted); text-decoration: line-through; font-size: 14px;
}
.clickit-product-card__saving {
  color: var(--cc-green); font-size: 13px; font-weight: 700; margin: 7px 0 0;
}
.clickit-product-card__pack {
  font-size: 13px; line-height: 1.5; color: var(--cc-secondary); margin: 11px 0 0;
}
.clickit-product-card__actions { position: relative; z-index: 1; margin-top: 16px; }
.clickit-product-card__button {
  display: inline-flex; align-items: center; justify-content: center;
  width: 100%; padding: 15px;
  background: var(--cc-accent); color: #ffffff;
  border: none; border-radius: 8px;
  font-family: var(--font-display); font-size: 15px; font-weight: 700; line-height: 1.2;
  cursor: pointer;
  transition: background 0.15s ease;
}
.clickit-product-card__button:hover { background: var(--cc-accent-dark); color: #ffffff; }
.clickit-product-card__button:focus-visible { outline: 2px solid var(--cc-accent); outline-offset: 2px; }
.clickit-product-card__button[disabled] { background: var(--cc-muted); cursor: not-allowed; }
@media screen and (max-width: 719.98px) {
  .clickit-product-card__content { padding: 14px; }
  .clickit-product-card__price { font-size: 21px; }
  .clickit-product-card__heading { margin-bottom: 13px; }
  .clickit-product-card__pricing { padding: 11px; }
  .clickit-product-card__button { padding: 13px; }
  .clickit-product-card__sale,
  .clickit-product-card__discount { font-size: 11px; padding: 6px 8px; top: 10px; }
  .clickit-product-card__sale { left: 10px; }
  .clickit-product-card__discount { right: 10px; }
}

/* --- Feature grids (why choose / promise) ---------------------------------- */
.ws-feature-grid { display: grid; grid-template-columns: 1fr 1fr; margin: 28px 0 30px; border-top: 1px solid rgba(15,20,24,.1); border-bottom: 1px solid rgba(15,20,24,.1); }
.ws-feature { display: flex; gap: 14px; align-items: flex-start; padding: 20px 18px 20px 0; }
.ws-feature:nth-child(even) { padding-left: 18px; border-left: 1px solid rgba(15,20,24,.1); }
.ws-feature:nth-child(n+3) { border-top: 1px solid rgba(15,20,24,.1); }
.ws-feature__icon { flex: none; width: 60px; height: 60px; border-radius: 50%; background: var(--cream-2); display: inline-flex; align-items: center; justify-content: center; }
.ws-feature__icon svg { width: 26px; height: 26px; stroke: var(--ink); fill: none; stroke-width: 1.5; }
.ws-feature h4 { margin: 0 0 3px; font-size: 1.0625rem; }
.ws-feature p { margin: 0; font-size: 0.9rem; color: var(--slate); line-height: 1.45; }
@media (max-width: 599px) {
  .ws-feature-grid { grid-template-columns: 1fr; }
  .ws-feature:nth-child(even) { padding-left: 0; border-left: 0; }
  .ws-feature:nth-child(n+2) { border-top: 1px solid rgba(15,20,24,.1); }
}

/* --- Why choose us ---------------------------------------------------------- */
.ws-why { display: grid; grid-template-columns: 1fr; }
@media (min-width: 1000px) { .ws-why { grid-template-columns: minmax(0, 46%) minmax(0, 54%); min-height: 680px; } }
.ws-why__text { background: var(--cream); padding: clamp(2.5rem, 5vw, 5rem) clamp(16px, 3.5vw, 40px); display: flex; align-items: center; }
@media (min-width: 1000px) { .ws-why__text { padding-left: max(clamp(16px, 3.5vw, 40px), calc((100vw - var(--wide)) / 2 + 40px)); padding-right: clamp(32px, 4vw, 64px); } }
.ws-why__text-inner { max-width: 640px; width: 100%; }
.ws-why__media { position: relative; min-height: 460px; }
.ws-why__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% center; }

.ws-calc-card { position: absolute; right: clamp(16px, 4vw, 56px); bottom: clamp(16px, 4vw, 56px); width: min(400px, calc(100% - 32px)); background: rgba(248,244,238,.97); backdrop-filter: blur(6px); border-radius: var(--radius-xl); padding: 26px 26px 24px; box-shadow: var(--shadow-lifted); }
.ws-calc-card .ws-eyebrow { margin-bottom: 8px; }
.ws-calc-card h3 { font-size: 1.625rem; letter-spacing: -0.03em; margin: 0 0 6px; line-height: 1.1; }
.ws-calc-card > p { margin: 0 0 16px; color: var(--graphite); font-size: 0.9375rem; }
.ws-calc-card__row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; }
.ws-calc-card label { display: block; background: var(--paper); border: 1px solid rgba(15,20,24,.08); border-radius: 12px; padding: 10px 14px; }
.ws-calc-card label span { display: block; font-size: 0.8125rem; color: var(--slate); margin-bottom: 2px; }
.ws-calc-card input { width: 100%; border: 0; background: none; font: inherit; font-family: var(--font-display); font-weight: 600; font-size: 1.25rem; color: var(--ink); padding: 0; }
.ws-calc-card input:focus { outline: none; }
.ws-calc-card__result { margin: 14px 0 0; font-size: 0.9375rem; color: var(--graphite); }
.ws-calc-card__result strong { color: var(--ink); }
.ws-calc-card__result a { font-weight: 600; }

/* --- Our promise ------------------------------------------------------------- */
.ws-promise { display: grid; grid-template-columns: 1fr; background: var(--cream); }
@media (min-width: 1000px) { .ws-promise { grid-template-columns: minmax(0, 56%) minmax(0, 44%); } }
.ws-promise__media { position: relative; min-height: 420px; display: flex; align-items: flex-end; }
.ws-promise__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ws-promise__media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(248,244,238,.97) 0%, rgba(248,244,238,.8) 26%, rgba(248,244,238,0) 58%); }
.ws-promise__caption { position: relative; z-index: 1; padding: clamp(24px, 4vw, 56px); max-width: 660px; }
.ws-promise__caption .ws-h2 { margin-bottom: 0.3em; }
.ws-promise__caption p { color: var(--graphite); font-size: 1.0625rem; margin: 0; max-width: 54ch; }
.ws-promise__body { padding: clamp(2.5rem, 5vw, 5rem) clamp(16px, 3.5vw, 48px); }
.ws-promise__body .ws-feature-grid { margin-top: 24px; }

/* --- Shop by room ------------------------------------------------------------ */
.ws-rooms { display: flex; gap: 14px; overflow-x: auto; scrollbar-width: none; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; padding-bottom: 6px; }
.ws-rooms::-webkit-scrollbar { display: none; }
.ws-rooms > * { flex: 0 0 64%; scroll-snap-align: start; }
@media (min-width: 720px) { .ws-rooms > * { flex-basis: calc((100% - 28px) / 3); } }
@media (min-width: 1000px) { .ws-rooms { display: grid; grid-template-columns: repeat(5, 1fr); overflow: visible; scroll-snap-type: none; } .ws-rooms > * { flex: none; } }
.ws-room { position: relative; aspect-ratio: 2 / 1; border-radius: 14px; overflow: hidden; background: var(--graphite); display: flex; align-items: flex-end; color: #fff; }
.ws-room img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.ws-room:hover img { transform: scale(1.05); }
.ws-room::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(30,22,14,.78), rgba(30,22,14,.12) 55%, transparent); }
.ws-room__body { position: relative; z-index: 1; width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; }
.ws-room__body h3 { color: #fff; margin: 0; font-size: 1.25rem; }
.ws-room:hover { color: #fff; }

/* --- Our mission --------------------------------------------------------------- */
.ws-mcards { display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 640px) { .ws-mcards { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .ws-mcards { grid-template-columns: repeat(4, 1fr); } }
.ws-mcard { position: relative; background: var(--paper); border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-soft); display: flex; flex-direction: column; border: 1px solid rgba(15,20,24,.06); }
.ws-mcard__media { aspect-ratio: 1.45 / 1; overflow: hidden; background: var(--mist); }
.ws-mcard__media img { width: 100%; height: 100%; object-fit: cover; }
.ws-mcard__body { padding: 0 22px 22px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.ws-mcard__icon { width: 64px; height: 64px; border-radius: 50%; background: var(--cream); display: inline-flex; align-items: center; justify-content: center; margin-top: -32px; position: relative; z-index: 1; box-shadow: 0 2px 10px rgba(0,0,0,.08); }
.ws-mcard__icon svg { width: 26px; height: 26px; stroke: var(--ink); fill: none; stroke-width: 1.5; }
.ws-mcard__eyebrow { font-family: var(--font-display); font-size: 0.6875rem; letter-spacing: .16em; text-transform: uppercase; color: var(--bark); font-weight: 700; margin: 10px 0 0; }
.ws-mcard h3 { font-size: 1.375rem; margin: 0; line-height: 1.15; }
.ws-mcard h3 a::after { content: ''; position: absolute; inset: 0; }
.ws-mcard p:not(.ws-mcard__eyebrow) { margin: 0; font-size: 0.9rem; color: var(--slate); line-height: 1.5; }
.ws-mcard__foot { margin-top: auto; display: flex; justify-content: flex-end; padding-top: 10px; }

/* --- Call to action -------------------------------------------------------------- */
.ws-cta { position: relative; background: var(--cream); overflow: hidden; }
.ws-cta__bg { position: absolute; top: 0; bottom: 0; right: 0; width: 60%; }
.ws-cta__bg img { width: 100%; height: 100%; object-fit: cover; object-position: right center; }
.ws-cta__bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, var(--cream) 0%, rgba(248,244,238,0) 40%); }
.ws-cta__inner { position: relative; max-width: var(--wide); margin-inline: auto; padding: clamp(2rem, 5vw, 4.5rem) clamp(16px, 3.5vw, 40px); }
.ws-cta__card { background: rgba(248,244,238,.86); backdrop-filter: blur(12px); border-radius: 26px; padding: clamp(28px, 5vw, 64px); max-width: 1180px; box-shadow: var(--shadow-lifted); }
.ws-cta__card .ws-h2 { max-width: 14ch; }
.ws-cta__card .ws-lead { max-width: 46ch; margin-bottom: 26px; }
@media (max-width: 899px) { .ws-cta__bg { width: 100%; } .ws-cta__bg::after { background: rgba(248,244,238,.55); } }

/* --- Coverage calculator (legacy) ----------------------------------------- */
.ws-calc {
  border: 1px solid var(--line); border-radius: var(--radius-lg);
  padding: 18px; background: var(--mist); margin-block: 18px;
}
.ws-calc__label { font-family: var(--font-display); font-weight: 700; font-size: 0.9375rem; color: var(--ink); display: block; margin-bottom: 10px; }
.ws-calc__row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.ws-calc input[type="number"] {
  width: 110px; padding: 10px 12px; font: inherit;
  border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper);
}
.ws-calc__waste { display: inline-flex; gap: 7px; align-items: center; font-size: 0.875rem; color: var(--slate); }
.ws-calc__result { font-size: 0.9375rem; color: var(--graphite); margin: 10px 0 0; }
.ws-calc__result strong { color: var(--ink); }

/* --- Product page ------------------------------------------------------------------ */
.ws-crumbs { font-size: 0.8125rem; color: var(--slate); display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 6px 0 22px; }
.ws-crumbs a { color: var(--slate); }
.ws-crumbs a:hover { color: var(--rust); }
.ws-crumbs [aria-current] { color: var(--ink); }

.ws-pdp { display: grid; gap: clamp(24px, 4vw, 56px); grid-template-columns: 1fr; align-items: start; }
@media (min-width: 900px) { .ws-pdp { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); } }
.ws-pdp__gallery { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 720px) { .ws-pdp__gallery { grid-template-columns: 76px 1fr; } .ws-pdp__gallery { position: sticky; top: 150px; } }
.ws-pdp__thumbs { display: flex; gap: 10px; order: 2; overflow-x: auto; scrollbar-width: none; }
.ws-pdp__thumbs::-webkit-scrollbar { display: none; }
@media (min-width: 720px) { .ws-pdp__thumbs { flex-direction: column; order: 0; overflow: visible; } }
.ws-pdp__thumb { position: relative; width: 70px; height: 70px; border-radius: 10px; border: 2px solid transparent; overflow: hidden; background: var(--mist); padding: 0; cursor: pointer; flex: none; display: block; }
.ws-pdp__thumb img { width: 100%; height: 100%; object-fit: cover; }
.ws-pdp__thumb[aria-current="true"] { border-color: var(--rust); }
.ws-pdp__thumb--video img { filter: brightness(.6); }
.ws-pdp__play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.ws-pdp__play svg { width: 26px; height: 26px; fill: #fff; stroke: none; }
.ws-pdp__main { position: relative; border-radius: 16px; overflow: hidden; background: var(--mist); aspect-ratio: 1 / 1; }
.ws-pdp__main img { width: 100%; height: 100%; object-fit: cover; }
.ws-pdp__badge { position: absolute; top: 16px; left: 16px; background: var(--amber); color: var(--ink); font-family: var(--font-display); font-weight: 700; font-size: 0.8125rem; padding: 6px 12px; border-radius: 999px; z-index: 1; }
.ws-pdp__zoom { position: absolute; right: 16px; bottom: 16px; width: 42px; height: 42px; border-radius: 50%; background: var(--paper); display: inline-flex; align-items: center; justify-content: center; box-shadow: var(--shadow-soft); color: var(--ink); }
.ws-pdp__zoom svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 2; }

.ws-pdp__eyebrow { font-family: var(--font-display); font-size: 0.75rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--rust); margin: 0 0 10px; }
.ws-pdp__eyebrow a { color: inherit; }
.ws-pdp h1 { font-size: clamp(1.75rem, 3vw, 2.5rem); margin-bottom: 10px; letter-spacing: -0.03em; }
.ws-rating { display: flex; align-items: center; gap: 8px; font-size: 0.875rem; color: var(--slate); margin: 0 0 14px; }
.ws-stars { display: inline-flex; gap: 2px; }
.ws-stars svg { width: 16px; height: 16px; fill: var(--amber); stroke: none; }
.ws-stars .is-empty svg { fill: var(--line); }
.ws-pdp__price-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 6px 0 6px; }
.ws-pdp__price .ws-price-m2 { font-size: clamp(1.75rem, 3vw, 2.25rem); }
.ws-pdp__price .ws-price-m2 small { font-size: 0.875rem; }
.ws-stock { font-size: 0.8125rem; font-weight: 600; padding: 6px 12px; border-radius: 999px; background: #e4f1e8; color: #1f6b3a; white-space: nowrap; }
.ws-stock--out { background: #f7e6e1; color: var(--rust-deep); }
.ws-pdp__meta { font-size: 0.8125rem; color: var(--slate); margin: 0 0 12px; }
.ws-pdp__short { color: var(--graphite); font-size: 0.9375rem; margin: 0 0 20px; line-height: 1.55; }

.ws-pdp__features { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin: 0 0 22px; padding: 18px 0; border-block: 1px solid var(--line); }
@media (min-width: 600px) { .ws-pdp__features { grid-template-columns: repeat(4, 1fr); } }
.ws-pfeat { text-align: center; font-size: 0.8125rem; color: var(--slate); line-height: 1.35; }
.ws-pfeat > svg { width: 32px; height: 32px; stroke: var(--ink); fill: none; stroke-width: 1.5; margin: 0 auto 8px; }
.ws-pfeat strong { display: block; color: var(--ink); font-weight: 600; font-size: 0.875rem; margin-bottom: 2px; }

.ws-opt { margin: 0 0 16px; }
.ws-opt__label { font-size: 0.875rem; font-weight: 600; color: var(--ink); display: block; margin-bottom: 8px; }
.ws-opt__label span { font-weight: 500; color: var(--slate); }
.ws-opt__values { display: flex; flex-wrap: wrap; gap: 10px; }
.ws-pill { display: inline-flex; align-items: center; justify-content: center; padding: 10px 16px; border: 1.5px solid var(--line); border-radius: 10px; background: var(--paper); font: inherit; font-size: 0.9375rem; font-weight: 500; color: var(--ink); cursor: pointer; }
.ws-pill[aria-pressed="true"] { border-color: var(--rust); background: #fbf1ec; color: var(--rust-deep); font-weight: 600; }

.ws-pdp__buy { display: flex; gap: 12px; align-items: stretch; margin-top: 8px; }
.ws-pdp__buy .ws-btn { flex: 1; }
.ws-qty { display: inline-flex; align-items: center; border: 1.5px solid var(--line); border-radius: 10px; background: var(--paper); }
.ws-qty button { width: 42px; height: 100%; min-height: 52px; border: 0; background: none; font-size: 1.125rem; cursor: pointer; color: var(--ink); }
.ws-qty input { width: 50px; border: 0; text-align: center; font: inherit; font-weight: 600; -moz-appearance: textfield; background: none; }
.ws-qty input::-webkit-inner-spin-button { display: none; }
.ws-pdp__secondary { display: flex; gap: 12px; margin-top: 12px; flex-wrap: wrap; }
.ws-pdp__secondary .ws-btn { flex: 1; min-width: 180px; }

.ws-pdp__usps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; list-style: none; margin: 22px 0 0; padding: 18px 0 0; border-top: 1px solid var(--line); }
.ws-pdp__usps li { display: flex; gap: 10px; align-items: flex-start; font-size: 0.8125rem; color: var(--slate); line-height: 1.3; }
.ws-pdp__usps li strong { display: block; color: var(--ink); font-weight: 600; font-size: 0.875rem; }
.ws-pdp__usps svg { width: 24px; height: 24px; stroke: var(--ink); fill: none; stroke-width: 1.6; flex: none; }
@media (max-width: 599px) { .ws-pdp__usps { grid-template-columns: 1fr; } }
.ws-pdp__desc { margin-top: clamp(28px, 4vw, 44px); }

.ws-calcband { background: var(--cream); border-radius: 18px; padding: 22px clamp(18px, 3vw, 32px); display: grid; grid-template-columns: 1fr; gap: 18px; align-items: center; margin: clamp(28px, 4vw, 48px) 0; }
@media (min-width: 720px) { .ws-calcband { grid-template-columns: auto 1fr 1fr; } .ws-calcband__intro { grid-column: 2 / span 2; } }
@media (min-width: 1000px) { .ws-calcband { grid-template-columns: auto 1.3fr 0.8fr 0.8fr 1fr auto; } .ws-calcband__intro { grid-column: auto; } }
.ws-calcband__icon { width: 62px; height: 62px; border-radius: 50%; background: #f3e3d8; display: inline-flex; align-items: center; justify-content: center; }
.ws-calcband__icon svg { width: 28px; height: 28px; stroke: var(--rust); fill: none; stroke-width: 1.6; }
.ws-calcband h3 { margin: 0 0 4px; font-size: 1.25rem; }
.ws-calcband__intro p { margin: 0; color: var(--slate); font-size: 0.9rem; }
.ws-calcband label { display: block; background: var(--paper); border: 1px solid rgba(15,20,24,.08); border-radius: 12px; padding: 10px 14px; }
.ws-calcband label span { display: block; font-size: 0.75rem; color: var(--slate); margin-bottom: 2px; }
.ws-calcband input { width: 100%; border: 0; background: none; font: inherit; font-family: var(--font-display); font-weight: 600; font-size: 1.25rem; color: var(--ink); padding: 0; }
.ws-calcband input:focus { outline: none; }
.ws-calcband__est span { display: block; font-size: 0.75rem; color: var(--slate); }
.ws-calcband__est strong { display: block; font-family: var(--font-display); font-size: 1.75rem; color: var(--ink); line-height: 1.1; }
.ws-calcband__est small { display: block; font-size: 0.75rem; color: var(--slate); }

.ws-tabs { border-bottom: 1px solid var(--line); display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; margin-bottom: clamp(20px, 3vw, 32px); }
.ws-tabs::-webkit-scrollbar { display: none; }
.ws-tab { border: 0; background: none; font: inherit; font-family: var(--font-display); font-weight: 600; font-size: 0.9375rem; color: var(--slate); padding: 14px 18px; border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer; white-space: nowrap; }
.ws-tab[aria-selected="true"] { color: var(--rust); border-bottom-color: var(--rust); }
.ws-tabpanel[hidden] { display: none; }
.ws-tabpanel--prose { max-width: 820px; }
.ws-desc-grid { display: grid; grid-template-columns: 1fr; gap: clamp(20px, 4vw, 48px); align-items: start; }
@media (min-width: 900px) { .ws-desc-grid { grid-template-columns: 1.1fr 1fr; } }
.ws-desc-grid h2 { font-size: clamp(1.375rem, 2.2vw, 1.75rem); margin-top: 0; }
.ws-desc-media { position: relative; border-radius: 16px; overflow: hidden; background: var(--mist); }
.ws-desc-media img, .ws-desc-media video, .ws-desc-media iframe { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; border: 0; }
.ws-checks { list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 10px; }
.ws-checks li { display: flex; align-items: center; gap: 10px; font-size: 0.9375rem; color: var(--graphite); }
.ws-checks li svg { width: 20px; height: 20px; padding: 4px; border-radius: 50%; background: var(--rust); stroke: #fff; fill: none; stroke-width: 3; flex: none; }
.ws-specgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 0; }
@media (min-width: 900px) { .ws-specgrid { grid-template-columns: repeat(4, 1fr); } }
.ws-specgrid div { background: var(--cream); border-radius: 12px; padding: 12px 14px; }
.ws-specgrid dt { font-size: 0.75rem; color: var(--slate); margin-bottom: 2px; }
.ws-specgrid dd { margin: 0; font-weight: 600; color: var(--ink); font-size: 0.9375rem; }
.ws-related { background: var(--cream); }

/* --- Spec table ----------------------------------------------------------- */
.ws-spec { width: 100%; border-collapse: collapse; font-size: 0.9375rem; }
.ws-spec th, .ws-spec td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
.ws-spec th { width: 38%; font-weight: 600; color: var(--ink); }
.ws-spec td { color: var(--graphite); }

/* --- Collection page ------------------------------------------------------ */
.ws-coll-head { margin-bottom: clamp(18px, 3vw, 30px); }
.ws-coll-head p { max-width: 640px; color: var(--slate); }
.ws-toolbar {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  padding: 12px 0; border-block: 1px solid var(--line); margin-bottom: 22px;
  font-size: 0.875rem; color: var(--slate); flex-wrap: wrap;
}
.ws-toolbar select { font: inherit; padding: 7px 10px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); }

.ws-coll-more { display: flex; justify-content: center; margin-top: 20px; }
.ws-coll-more .ws-btn { width: 100%; max-width: 420px; background: var(--paper); gap: 10px; }
.ws-coll-more .ws-btn span { transition: transform .15s ease; }
.ws-coll-more .ws-btn:hover span { transform: translateX(3px); }
@media (min-width: 720px) { .ws-coll-more { display: none; } }

/* --- Pagination ----------------------------------------------------------- */
.ws-pagination { display: flex; justify-content: center; gap: 6px; margin-top: clamp(28px, 4vw, 44px); }
.ws-pagination a, .ws-pagination span {
  min-width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--line); border-radius: var(--radius); font-weight: 600; font-size: 0.9375rem; padding-inline: 10px;
}
.ws-pagination span[aria-current] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.ws-pagination a:hover { border-color: var(--ink); color: var(--ink); }

/* --- Cart ------------------------------------------------------------------ */
.ws-cart-grid { display: grid; gap: clamp(24px, 4vw, 48px); grid-template-columns: 1fr; align-items: start; }
@media (min-width: 900px) { .ws-cart-grid { grid-template-columns: minmax(0, 1.6fr) minmax(300px, 1fr); } }
.ws-cart-line { display: grid; grid-template-columns: 92px 1fr auto; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--line); align-items: center; }
.ws-cart-line__img { border-radius: var(--radius); overflow: hidden; background: var(--mist); }
.ws-cart-line__title { font-weight: 600; color: var(--ink); font-size: 0.9375rem; }
.ws-cart-line__meta { font-size: 0.8125rem; color: var(--slate); margin-top: 2px; }
.ws-cart-line__remove { font-size: 0.8125rem; color: var(--slate); text-decoration: underline; }
.ws-cart-line__right { text-align: right; display: flex; flex-direction: column; gap: 10px; align-items: flex-end; }
.ws-cart-summary {
  border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 22px; background: var(--cream);
  position: sticky; top: 150px;
}
.ws-cart-summary__row { display: flex; justify-content: space-between; padding: 6px 0; font-size: 0.9375rem; }
.ws-cart-summary__row--total { font-family: var(--font-display); font-weight: 700; font-size: 1.125rem; color: var(--ink); border-top: 1px solid var(--line); margin-top: 8px; padding-top: 14px; }
.ws-shipbar { font-size: 0.8125rem; color: var(--slate); margin: 10px 0 0; }
.ws-shipbar__track { height: 6px; background: var(--line); border-radius: 999px; margin-top: 6px; overflow: hidden; }
.ws-shipbar__fill { height: 100%; background: var(--rust); border-radius: 999px; }
.ws-cart-empty { text-align: center; padding-block: clamp(3rem, 8vw, 6rem); }

/* --- Steps / value props --------------------------------------------------- */
.ws-steps { display: grid; gap: 18px; grid-template-columns: 1fr; counter-reset: step; }
@media (min-width: 720px) { .ws-steps { grid-template-columns: repeat(4, 1fr); } }
.ws-step { border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 20px; background: var(--paper); }
.ws-step__num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 50%; background: var(--sand); color: var(--rust);
  font-family: var(--font-display); font-weight: 700; font-size: 0.9375rem; margin-bottom: 12px;
}
.ws-step h4 { margin-bottom: 4px; }
.ws-step p { font-size: 0.875rem; color: var(--slate); margin: 0; }

/* --- Dark promo (calculator) ----------------------------------------------- */
.ws-promo { border-radius: var(--radius-lg); overflow: hidden; display: grid; grid-template-columns: 1fr; background: var(--ink); }
@media (min-width: 900px) { .ws-promo { grid-template-columns: 1fr 1fr; } }
.ws-promo__media img { width: 100%; height: 100%; object-fit: cover; }
.ws-promo__body { padding: clamp(24px, 4vw, 48px); color: #c9d1d7; }
.ws-promo__body h2 { color: var(--paper); }
.ws-promo__list { list-style: none; margin: 0 0 22px; padding: 0; counter-reset: pstep; }
.ws-promo__list li { counter-increment: pstep; display: flex; gap: 12px; padding: 8px 0; font-size: 0.9375rem; }
.ws-promo__list li::before {
  content: counter(pstep); flex: none;
  width: 26px; height: 26px; border-radius: 50%; background: rgba(255,255,255,.12); color: var(--amber);
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-weight: 700; font-size: 0.8125rem;
}

/* --- Samples banner --------------------------------------------------------- */
.ws-samples { display: grid; gap: clamp(20px, 4vw, 48px); grid-template-columns: 1fr; align-items: center; }
@media (min-width: 900px) { .ws-samples { grid-template-columns: 1.2fr 1fr; } }
.ws-samples__note { font-size: 0.875rem; color: var(--slate); margin-top: 10px; }

/* --- Footer ------------------------------------------------------------------ */
.ws-footer { background: var(--forest); color: #c9d3cc; }
.ws-footer a { color: #e9eee9; }
.ws-footer a:hover { color: var(--amber); }
.ws-footer__inner {
  max-width: var(--wide); margin-inline: auto;
  padding: clamp(2.5rem, 5vw, 4.5rem) clamp(16px, 3.5vw, 40px) 2.5rem;
  display: grid; gap: clamp(28px, 4vw, 44px); grid-template-columns: 1fr;
}
@media (min-width: 720px) { .ws-footer__inner { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) {
  .ws-footer__inner { grid-template-columns: 1.6fr repeat(var(--ws-footer-cols, 3), 1fr); }
  .ws-footer__col + .ws-footer__col { border-left: 1px solid rgba(255,255,255,.1); padding-left: clamp(18px, 2.5vw, 36px); }
}
.ws-footer__brand img { width: 190px; filter: brightness(0) invert(1); }
.ws-footer__brand p { font-size: 0.9375rem; margin-top: 18px; max-width: 36ch; line-height: 1.6; }
.ws-footer h4 { color: #fff; font-size: 1.125rem; letter-spacing: -0.01em; margin-bottom: 16px; }
.ws-footer ul { list-style: none; margin: 0; padding: 0; }
.ws-footer ul a { display: inline-block; padding: 5px 0; font-size: 0.9375rem; }
.ws-footer ul a.ws-nav--sale { color: var(--amber); }
.ws-footer__contact { display: grid; gap: 12px; }
.ws-footer__contact li { display: flex; align-items: flex-start; gap: 12px; font-size: 0.9375rem; line-height: 1.45; }
.ws-footer__contact li a { padding: 0; }
.ws-footer__contact svg { width: 20px; height: 20px; stroke: #fff; fill: none; stroke-width: 1.6; flex: none; margin-top: 2px; }
.ws-social { display: flex; gap: 6px; list-style: none; margin: 18px 0 0; padding: 0; }
.ws-social a { display: inline-flex; width: 38px; height: 38px; border-radius: 50%; align-items: center; justify-content: center; color: #fff; padding: 0; }
.ws-social a:hover { background: rgba(255,255,255,.1); color: #fff; }
.ws-social svg { width: 20px; height: 20px; fill: currentColor; stroke: none; }
.ws-footer__bottom { border-top: 1px solid rgba(255,255,255,.1); }
.ws-footer__bottom-inner {
  max-width: var(--wide); margin-inline: auto;
  padding: 18px clamp(16px, 3.5vw, 40px);
  display: flex; flex-wrap: wrap; gap: 14px 28px; align-items: center; justify-content: space-between;
  font-size: 0.8125rem;
}
.ws-footer__copy { display: flex; flex-direction: column; gap: 4px; min-width: 0; max-width: 100%; }
.ws-footer__credit { color: #c9d3cc; }
.ws-footer__credit a { color: inherit; text-decoration: none; padding: 0; }
.ws-footer__credit a:hover { color: var(--amber); }
.ws-footer__company { font-size: 0.75rem; color: rgba(201,211,204,.75); max-width: 70ch; line-height: 1.5; }
@media (max-width: 719.98px) {
  .ws-footer__bottom-inner { flex-direction: column; align-items: flex-start; gap: 14px; }
  .ws-footer__company { max-width: none; }
  .ws-payments { justify-content: flex-start; }
}
.ws-footer__legal { display: flex; flex-wrap: wrap; gap: 4px 0; }
.ws-footer__legal li + li::before { content: '|'; color: rgba(255,255,255,.3); margin: 0 12px; }
.ws-footer__legal a { padding: 0; font-size: 0.8125rem; }
.ws-footer__bottom-inner .ws-social { margin: 0; }
.ws-payments { display: flex; gap: 8px; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; }
.ws-payments svg, .ws-payment-icon { width: 40px; height: 26px; display: block; }

/* --- Mini-basket drawer -------------------------------------------------------- */
.ws-cart-drawer { position: fixed; inset: 0; z-index: 170; visibility: hidden; }
.ws-cart-drawer[data-open="true"] { visibility: visible; }
.ws-cart-drawer__scrim {
  position: absolute; inset: 0; background: rgba(15,20,24,.5);
  border: 0; opacity: 0; transition: opacity .2s ease; cursor: pointer;
}
.ws-cart-drawer[data-open="true"] .ws-cart-drawer__scrim { opacity: 1; }
.ws-cart-drawer__panel {
  position: absolute; top: 0; bottom: 0; right: 0; width: min(420px, 94vw);
  background: var(--paper); box-shadow: var(--shadow-lifted);
  transform: translateX(102%); transition: transform .28s cubic-bezier(.22,.8,.36,1);
  display: flex; flex-direction: column;
}
.ws-cart-drawer[data-open="true"] .ws-cart-drawer__panel { transform: none; }
.ws-cart-drawer__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid var(--line);
}
.ws-cart-drawer__head h3 { margin: 0; font-size: 1.0625rem; }
.ws-cart-drawer__items { flex: 1; overflow-y: auto; padding: 6px 20px; }
.ws-cd-item { display: grid; grid-template-columns: 64px 1fr auto; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--mist); align-items: center; }
.ws-cd-item__img { width: 64px; height: 64px; border-radius: var(--radius); object-fit: cover; background: var(--mist); }
.ws-cd-item__title { font-size: 0.875rem; font-weight: 600; color: var(--ink); line-height: 1.3; margin: 0 0 4px; }
.ws-cd-item__meta { font-size: 0.8125rem; color: var(--slate); margin: 0 0 8px; }
.ws-cd-item__qty { display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: var(--radius); }
.ws-cd-item__qty button { width: 30px; height: 30px; border: 0; background: none; cursor: pointer; font-size: 1rem; color: var(--ink); }
.ws-cd-item__qty span { min-width: 26px; text-align: center; font-size: 0.875rem; font-weight: 600; }
.ws-cd-item__right { text-align: right; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.ws-cd-item__price { font-family: var(--font-display); font-weight: 700; font-size: 0.9375rem; color: var(--ink); }
.ws-cd-item__remove { border: 0; background: none; cursor: pointer; font-size: 0.75rem; color: var(--slate); text-decoration: underline; padding: 0; }
.ws-cd-empty { text-align: center; color: var(--slate); padding: 40px 0; }
.ws-cart-drawer__foot { border-top: 1px solid var(--line); padding: 14px 20px 20px; background: var(--paper); }
.ws-cart-drawer__foot .ws-shipbar { margin: 0 0 10px; }
.ws-cart-drawer__total {
  display: flex; justify-content: space-between; align-items: baseline;
  font-family: var(--font-display); font-size: 1.0625rem; color: var(--ink); font-weight: 700;
  margin-bottom: 12px;
}
.ws-cart-drawer__links { display: flex; justify-content: space-between; margin-top: 12px; font-size: 0.875rem; }
.ws-cart-drawer__links a, .ws-cart-drawer__links button {
  border: 0; background: none; cursor: pointer; padding: 0;
  font: inherit; font-weight: 600; color: var(--graphite); text-decoration: underline;
}
.ws-cart-drawer__links a:hover, .ws-cart-drawer__links button:hover { color: var(--rust); }
@media (prefers-reduced-motion: reduce) {
  .ws-cart-drawer__panel, .ws-cart-drawer__scrim { transition: none; }
}

/* --- Toast ------------------------------------------------------------------- */
.ws-toast[hidden] { display: none; }
.ws-toast {
  position: fixed; bottom: 22px; left: 50%; transform: translateX(-50%);
  width: max-content; max-width: 92vw;
  background: var(--ink); color: var(--paper);
  border-radius: var(--radius); box-shadow: var(--shadow-lifted);
  padding: 13px 18px; display: flex; gap: 16px; align-items: center; z-index: 180;
  font-size: 0.9375rem;
}
.ws-toast__link { color: var(--amber); font-weight: 700; white-space: nowrap; }
.ws-toast__link:hover { color: var(--paper); }

/* --- Forms / content pages ---------------------------------------------------- */
.ws-form { display: grid; gap: 14px; max-width: 560px; }
.ws-form label { font-weight: 600; font-size: 0.9375rem; color: var(--ink); }
.ws-form input, .ws-form textarea {
  width: 100%; padding: 12px 14px; font: inherit;
  border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper);
}
.ws-form input:focus, .ws-form textarea:focus { outline: 2px solid var(--rust); outline-offset: 1px; }
.ws-page-content img { border-radius: var(--radius-lg); }
.ws-page-content h2 { margin-top: 1.6em; }
.ws-page-content ul, .ws-page-content ol { padding-left: 1.3em; }
.ws-page-content table { width: 100%; border-collapse: collapse; }
.ws-page-content table td, .ws-page-content table th { border: 1px solid var(--line); padding: 9px 12px; }

/* --- Utility ------------------------------------------------------------------- */
.ws-center { text-align: center; }
.ws-mt-0 { margin-top: 0; }

/* ==========================================================================
   Collection page v3: hero, sidebar filters (drawer on phones), toolbar, cards
   Mobile first. Sidebar becomes a fixed left drawer below 900px.
   ========================================================================== */
/* Layout */
.ws-coll-layout { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
@media (min-width: 900px) { .ws-coll-layout { grid-template-columns: 250px minmax(0, 1fr); gap: 32px; align-items: start; } }
@media (min-width: 1200px) { .ws-coll-layout { gap: 40px; } }

/* Sidebar / drawer */
.ws-coll-side { background: var(--paper); }
@media (max-width: 899.98px) {
  .ws-coll-side {
    position: fixed; top: 0; left: 0; bottom: 0; z-index: 160; width: min(86vw, 380px);
    overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
    padding: 0; box-shadow: var(--shadow-lifted);
    transform: translateX(-104%); transition: transform .28s cubic-bezier(.2,.7,.2,1); visibility: hidden;
  }
  .ws-coll-side[data-open="true"] { transform: none; visibility: visible; }
  .ws-facets__scrim { position: fixed; inset: 0; z-index: 155; border: 0; padding: 0; background: rgba(15,20,24,.5); opacity: 0; pointer-events: none; transition: opacity .25s ease; }
  .ws-coll-layout[data-drawer="true"] .ws-facets__scrim { opacity: 1; pointer-events: auto; }
  .ws-facets { padding: 14px 18px 0; min-height: 100%; display: flex; flex-direction: column; }
  .ws-facets__foot { position: sticky; bottom: 0; margin: auto -18px 0; padding: 14px 18px calc(14px + env(safe-area-inset-bottom)); background: var(--paper); border-top: 1px solid var(--line); }
  .ws-facets .ws-help { margin-bottom: 18px; }
}
@media (min-width: 900px) {
  .ws-coll-side { position: sticky; top: 140px; max-height: calc(100vh - 160px); overflow-y: auto; scrollbar-width: thin; padding-right: 4px; }
  .ws-facets__scrim, .ws-facets__close, .ws-facets__foot, .ws-toolbar__filter { display: none; }
}
@media (prefers-reduced-motion: reduce) { .ws-coll-side, .ws-facets__scrim { transition: none; } }

.ws-facets__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.ws-facets__heading { font-size: 1.125rem; margin: 0; }
.ws-facets__selected { padding: 12px 0 14px; border-bottom: 1px solid var(--line); }
.ws-facets__selected-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; font-family: var(--font-display); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink); }
.ws-facets__selected-head a { font-family: var(--font-body); text-transform: none; letter-spacing: 0; font-weight: 600; font-size: 0.8125rem; color: var(--rust); }
.ws-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ws-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px 6px 12px; background: var(--mist); border: 1px solid var(--line); border-radius: 999px; font-size: 0.8125rem; font-weight: 500; color: var(--ink); min-height: 34px; }
.ws-chip svg { width: 13px; height: 13px; stroke: currentColor; fill: none; stroke-width: 2.2; }
.ws-chip:hover { background: var(--cream-2); color: var(--ink); }

.ws-facet { border-bottom: 1px solid var(--line); }
.ws-facet__summary { list-style: none; display: flex; align-items: center; gap: 10px; padding: 15px 0; cursor: pointer; font-family: var(--font-display); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink); user-select: none; min-height: 48px; }
.ws-facet__summary::-webkit-details-marker { display: none; }
.ws-facet__summary > span:first-child { flex: 1; }
.ws-facet__summary svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 2; transition: transform .2s ease; }
.ws-facet[open] .ws-facet__summary svg { transform: rotate(180deg); }
.ws-facet__count { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--rust); color: var(--paper); font-size: 0.6875rem; letter-spacing: 0; }
.ws-facet__body { padding: 0 0 16px; }
.ws-facet__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.ws-facet__list--long:not([data-expanded]) li:nth-child(n+9) { display: none; }
.ws-facet__more { border: 0; background: none; padding: 8px 0; font: inherit; font-size: 0.8125rem; font-weight: 600; color: var(--rust); cursor: pointer; }
.ws-facet__hint { margin: 10px 0 0; font-size: 0.75rem; color: var(--slate); }

.ws-check { display: flex; align-items: center; gap: 10px; padding: 7px 0; cursor: pointer; font-size: 0.9375rem; color: var(--graphite); min-height: 40px; }
.ws-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ws-check__box { flex: none; width: 20px; height: 20px; border: 1.5px solid #b9c0c6; border-radius: 5px; background: var(--paper); position: relative; transition: background .15s, border-color .15s; }
.ws-check__box::after { content: ''; position: absolute; left: 6px; top: 2px; width: 5px; height: 10px; border: solid var(--paper); border-width: 0 2px 2px 0; transform: rotate(45deg); opacity: 0; }
.ws-check input:checked ~ .ws-check__box { background: var(--rust); border-color: var(--rust); }
.ws-check input:checked ~ .ws-check__box::after { opacity: 1; }
.ws-check input:focus-visible ~ .ws-check__box { outline: 2px solid var(--rust); outline-offset: 2px; }
.ws-check__label { flex: 1; }
.ws-check__n { font-size: 0.8125rem; color: var(--slate); }
.ws-check:hover .ws-check__label { color: var(--ink); }

.ws-facet__swatches { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.ws-swatch { display: flex; align-items: center; gap: 12px; padding: 6px 0; cursor: pointer; font-size: 0.9375rem; color: var(--graphite); min-height: 40px; position: relative; }
.ws-swatch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ws-swatch .ws-mega__swatch { width: 28px; height: 28px; transition: box-shadow .15s; }
.ws-swatch input:checked ~ .ws-mega__swatch { box-shadow: 0 0 0 2px var(--paper), 0 0 0 4px var(--rust); }
.ws-swatch input:focus-visible ~ .ws-mega__swatch { box-shadow: 0 0 0 2px var(--paper), 0 0 0 4px var(--ink); }
.ws-swatch__label { flex: 1; }
.ws-swatch input:checked ~ .ws-swatch__label { font-weight: 600; color: var(--ink); }

.ws-facet__price { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ws-facet__price label > span:first-child { display: block; font-size: 0.75rem; color: var(--slate); margin-bottom: 4px; }
.ws-facet__money { display: flex; align-items: center; gap: 4px; border: 1px solid var(--line); border-radius: var(--radius); padding: 0 10px; min-height: 42px; font-size: 0.9375rem; background: var(--paper); }
.ws-facet__money input { border: 0; width: 100%; min-width: 0; font: inherit; padding: 8px 0; outline: none; background: transparent; }
.ws-facet__money:focus-within { border-color: var(--rust); }
.ws-facets__empty { font-size: 0.875rem; color: var(--slate); padding: 12px 0; }

.ws-help { margin-top: 20px; padding: 20px; background: var(--mist); border-radius: var(--radius-lg); display: flex; flex-direction: column; gap: 8px; }
.ws-help__icon { width: 44px; height: 44px; border-radius: 50%; background: var(--paper); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 4px; }
.ws-help__icon svg { width: 22px; height: 22px; stroke: var(--ink); fill: none; stroke-width: 1.6; }
.ws-help h3 { font-size: 1.0625rem; margin: 0; }
.ws-help p { margin: 0; font-size: 0.875rem; color: var(--slate); line-height: 1.5; }
.ws-help__phone { font-family: var(--font-display); font-weight: 700; font-size: 1.0625rem; color: var(--ink); }
.ws-help .ws-btn { margin-top: 6px; }

/* Toolbar */
.ws-toolbar--v3 { display: grid; grid-template-columns: auto 1fr; grid-template-areas: "filter sort" "count count"; gap: 10px 12px; align-items: center; padding: 0 0 14px; border-top: 0; border-bottom: 1px solid var(--line); margin-bottom: 20px; }
.ws-toolbar__filter { grid-area: filter; gap: 8px; min-height: 44px; }
.ws-toolbar__count { grid-area: count; margin: 0; font-size: 0.875rem; color: var(--slate); }
.ws-toolbar__count strong { color: var(--ink); }
.ws-toolbar__sort { grid-area: sort; display: flex; align-items: center; justify-content: flex-end; gap: 8px; font-size: 0.875rem; color: var(--slate); }
.ws-toolbar__sort > span { display: none; }
.ws-toolbar__sort select { min-height: 44px; max-width: 100%; }
.ws-toolbar__view { display: none; gap: 4px; }
.ws-toolbar__view .ws-iconbtn[aria-pressed="true"] { background: var(--ink); color: var(--paper); }
@media (min-width: 600px) { .ws-toolbar__sort > span { display: inline; } }
@media (min-width: 900px) {
  .ws-toolbar--v3 { grid-template-columns: 1fr auto auto; grid-template-areas: "count sort view"; padding: 4px 0 14px; }
  .ws-toolbar__view { grid-area: view; display: flex; }
}

/* Product grid: 1 col below 360px, 2 on phones and tablets, 3 beside the sidebar, 4 from 1200px */
.ws-cgrid { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 360px) { .ws-cgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } }
@media (min-width: 600px) { .ws-cgrid { gap: 16px; } }
@media (min-width: 900px) { .ws-cgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; } }
@media (min-width: 1200px) { .ws-cgrid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.ws-cgrid__empty { grid-column: 1 / -1; padding: 40px 20px; text-align: center; background: var(--mist); border-radius: var(--radius-lg); }
.ws-cgrid__empty p { margin: 0; color: var(--slate); }
.ws-cgrid__empty a { color: var(--rust); font-weight: 600; }

/* Card */
.ws-pcard { position: relative; display: flex; flex-direction: column; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; transition: box-shadow .2s ease, transform .2s ease; }
@media (hover: hover) { .ws-pcard:hover { box-shadow: var(--shadow-lifted); transform: translateY(-2px); } }
.ws-pcard__media { position: relative; background: var(--mist); aspect-ratio: 5 / 4; overflow: hidden; }
.ws-pcard__img { position: absolute; inset: 0; display: block; }
.ws-pcard__img img { width: 100%; height: 100%; object-fit: cover; }
.ws-pcard__noimg { display: flex; align-items: center; justify-content: center; height: 100%; color: var(--slate); }
.ws-pcard__noimg svg { width: 40px; height: 40px; stroke: currentColor; fill: none; stroke-width: 1.4; }
.ws-pcard__badge { position: absolute; top: 10px; left: 10px; background: var(--rust); color: var(--paper); font-family: var(--font-display); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.02em; padding: 5px 9px; border-radius: 6px; }
.ws-pcard__badge--new { background: var(--forest); }
.ws-pcard__wish { position: absolute; top: 8px; right: 8px; width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.92); display: inline-flex; align-items: center; justify-content: center; color: var(--ink); box-shadow: var(--shadow-soft); }
.ws-pcard__wish svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.8; }
.ws-pcard__wish:hover { color: var(--rust); }
.ws-pcard__body { display: flex; flex-direction: column; gap: 6px; padding: 14px 14px 16px; flex: 1; }
.ws-pcard__type { margin: 0; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--slate); }
.ws-pcard__title { margin: 0; font-family: var(--font-display); font-size: 1rem; font-weight: 700; line-height: 1.3; letter-spacing: -0.01em; }
.ws-pcard__title a::after { content: ''; position: absolute; inset: 0; }
.ws-pcard__title a:hover { color: var(--rust); }
.ws-pcard__rating { display: flex; align-items: center; gap: 6px; font-size: 0.8125rem; color: var(--slate); }
.ws-pcard__rating .ws-stars svg { width: 14px; height: 14px; fill: var(--amber); stroke: none; }
.ws-pcard__rating .ws-stars .is-empty svg { fill: var(--line); }
.ws-pcard__specs { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 0; font-size: 0.8125rem; color: var(--graphite); }
.ws-pcard__specs li:not(:last-child)::after { content: '\00b7'; margin: 0 6px; color: var(--slate); }
.ws-pcard__price { margin-top: auto; padding-top: 8px; }
.ws-pcard__now { display: flex; align-items: baseline; gap: 6px; }
.ws-pcard__now strong { font-family: var(--font-display); font-size: 1.375rem; font-weight: 800; letter-spacing: -0.02em; color: var(--rust); }
.ws-pcard__now span { font-size: 0.8125rem; color: var(--slate); font-weight: 500; }
.ws-pcard__was { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font-size: 0.8125rem; }
.ws-pcard__was s { color: var(--slate); }
.ws-pcard__was em { font-style: normal; font-weight: 700; color: #24834b; }
.ws-pcard__pack { margin: 2px 0 0; font-size: 0.8125rem; color: var(--slate); }
.ws-pcard__actions { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr; gap: 8px; margin-top: 10px; }
.ws-pcard__actions .ws-btn { min-height: 44px; padding-inline: 10px; font-size: 0.875rem; gap: 6px; white-space: nowrap; }
.ws-pcard__actions .ws-btn svg { width: 16px; height: 16px; }
/* Buttons sit side by side whenever the card itself is wide enough */
.ws-pcard { container-type: inline-size; }
@container (min-width: 225px) {
  .ws-pcard__actions { grid-template-columns: 1fr 1fr; gap: 6px; }
  .ws-pcard__actions .ws-btn { font-size: 0.8125rem; padding-inline: 4px; }
  .ws-pcard__actions .ws-btn svg { display: none; }
}
@container (min-width: 310px) {
  .ws-pcard__actions { gap: 8px; }
  .ws-pcard__actions .ws-btn { font-size: 0.875rem; }
  .ws-pcard__actions .ws-btn svg { display: inline-block; }
}
/* Narrow cards (two-up on phones, anywhere on the site): tighter type and padding, buttons stacked */
@container (max-width: 224.98px) {
  .ws-pcard__body { padding: 10px 10px 12px; gap: 5px; }
  .ws-pcard__type { font-size: 0.6875rem; }
  .ws-pcard__title { font-size: 0.875rem; }
  .ws-pcard__specs, .ws-pcard__was, .ws-pcard__pack { font-size: 0.75rem; }
  .ws-pcard__now strong { font-size: 1.1875rem; }
  .ws-pcard__badge { top: 8px; left: 8px; font-size: 0.6875rem; padding: 4px 7px; }
  .ws-pcard__wish { width: 34px; height: 34px; top: 6px; right: 6px; }
  .ws-pcard__actions .ws-btn { font-size: 0.8125rem; padding-inline: 6px; }
}
}

/* List view (from 600px; on small phones it is the same as grid) */
@media (min-width: 600px) {
  .ws-cgrid--list { grid-template-columns: minmax(0, 1fr); }
  .ws-cgrid--list .ws-pcard { flex-direction: row; container-type: normal; }
  .ws-cgrid--list .ws-pcard__media { flex: none; width: 38%; max-width: 320px; aspect-ratio: auto; min-height: 200px; }
  .ws-cgrid--list .ws-pcard__body { padding: 18px 20px; }
  .ws-cgrid--list .ws-pcard__title { font-size: 1.125rem; }
  .ws-cgrid--list .ws-pcard__actions { grid-template-columns: repeat(2, minmax(0, 180px)); }
}

/* Loading state while filters re-render */
.ws-collection[aria-busy="true"] .ws-coll-main { opacity: .55; pointer-events: none; transition: opacity .15s ease; }

/* ==========================================================================
   Product page: Square Metre calculator in the buy box
   ========================================================================== */
.ws-sqm { background: var(--cream); border: 1px solid var(--cream-2); border-radius: var(--radius-lg); padding: 18px 16px; margin: 4px 0 18px; display: grid; gap: 14px; }
@media (min-width: 600px) { .ws-sqm { padding: 22px; } }
.ws-sqm__title { font-size: 1.375rem; margin: 0 0 4px; }
.ws-sqm__pack { margin: 0; color: var(--graphite); font-size: 0.9375rem; }
.ws-sqm__pack strong { color: var(--ink); }
.ws-sqm__field { display: block; min-width: 0; }
.ws-sqm__field > span { display: block; font-size: 0.875rem; font-weight: 600; color: var(--ink); margin-bottom: 6px; }
.ws-sqm__field input, .ws-sqm__field select {
  width: 100%; min-height: 50px; padding: 10px 14px; font: inherit; font-size: 1rem; color: var(--ink);
  background: var(--paper); border: 1.5px solid var(--line); border-radius: 10px; -moz-appearance: textfield;
}
.ws-sqm__field input::-webkit-inner-spin-button, .ws-sqm__field input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.ws-sqm__field input:focus, .ws-sqm__field select:focus { outline: none; border-color: var(--rust); box-shadow: 0 0 0 3px rgba(191,74,28,.14); }
.ws-sqm__or { display: flex; align-items: center; gap: 12px; margin: 0; font-size: 0.8125rem; color: var(--slate); text-transform: uppercase; letter-spacing: 0.1em; }
.ws-sqm__or::before, .ws-sqm__or::after { content: ''; flex: 1; height: 1px; background: rgba(15,20,24,.14); }
.ws-sqm__pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
.ws-sqm__waste { font-weight: 500; color: var(--ink); padding: 0; }
.ws-sqm__result { border-top: 1px solid rgba(15,20,24,.12); padding-top: 14px; }
.ws-sqm__result p { margin: 0; }
.ws-sqm__hint { color: var(--slate); font-size: 0.9375rem; }
.ws-sqm__need { color: var(--graphite); font-size: 1rem; }
.ws-sqm__need strong { color: var(--ink); }
.ws-sqm__total { margin-top: 4px !important; font-family: var(--font-display); font-size: 1.25rem; font-weight: 700; color: var(--ink); }
.ws-sqm__total strong { color: var(--rust); font-weight: 800; }

/* --- Collection page: reference-matched hero, boxed filter groups, card details ------- */
.ws-collection__top { padding-top: 14px; }
.ws-collection__top .ws-crumbs { margin: 0 0 12px; }
.ws-collection .ws-section--tight { padding-top: clamp(16px, 2vw, 24px); }
.ws-chero { position: relative; overflow: hidden; background: var(--cream); border-radius: var(--radius-lg); }
.ws-chero__media { position: absolute; inset: 0; }
.ws-chero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 70% center; }
.ws-chero__media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(248,244,238,.97) 0%, rgba(248,244,238,.9) 100%); }
.ws-chero__inner { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 32px; padding: 18px 16px 20px; }
.ws-chero__text { max-width: 640px; min-width: 0; }
.ws-chero__eyebrow { font-family: var(--font-display); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--rust); margin: 0 0 8px; }
.ws-chero h1 { font-size: clamp(1.5rem, 3vw, 2.25rem); letter-spacing: -0.03em; margin: 0 0 0.35em; }
.ws-chero__desc { margin: 0; color: var(--graphite); font-size: 0.9375rem; line-height: 1.55; max-width: 58ch; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ws-chero__usps { list-style: none; margin: 16px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; }
.ws-chero__usps li { display: flex; align-items: center; gap: 10px; font-size: 0.8125rem; line-height: 1.3; font-weight: 600; color: var(--ink); min-width: 0; }
.ws-chero__usps svg { flex: none; width: 28px; height: 28px; stroke: var(--rust); fill: none; stroke-width: 1.5; }
.ws-chero__usps small { display: block; font-size: inherit; font-weight: 400; color: var(--graphite); }
.ws-chero__card { display: none; }
@media (min-width: 600px) { .ws-chero__usps { display: flex; flex-wrap: wrap; gap: 14px 30px; } .ws-chero__desc { -webkit-line-clamp: 3; } }
@media (min-width: 900px) {
  .ws-chero__media::after { background: linear-gradient(90deg, var(--cream) 0%, rgba(248,244,238,.97) 36%, rgba(248,244,238,.6) 54%, rgba(248,244,238,0) 74%); }
  .ws-chero__inner { padding: 30px 40px; min-height: 220px; }
  .ws-chero__text { max-width: 740px; }
  .ws-chero__usps { margin-top: 22px; gap: 14px 26px; }
  .ws-facets__head { display: none; }
  .ws-chero__usps li { font-size: 0.875rem; }
  .ws-chero__card { display: flex; flex-direction: column; gap: 8px; flex: none; padding: 24px 30px; background: rgba(15,20,24,.88); border-radius: var(--radius); }
  .ws-chero__card img { width: 170px; height: auto; }
  .ws-chero__card span { font-size: 0.8125rem; color: rgba(255,255,255,.75); font-weight: 500; }
}

.ws-facets__selected { background: var(--mist); border-radius: var(--radius); border-bottom: 0; padding: 12px 14px 14px; margin-bottom: 8px; }
.ws-chip { background: var(--paper); border-radius: 6px; }
.ws-facet { border-bottom: 0; margin-bottom: 6px; }
.ws-facet__summary { background: var(--mist); border-radius: var(--radius); padding: 0 14px; min-height: 46px; }
.ws-facet__body { padding: 12px 14px 8px; }
.ws-facet__ico { display: inline-flex; }
.ws-facet__ico svg { width: 16px; height: 16px; }
.ws-facet[open] .ws-facet__ico--plus, .ws-facet:not([open]) .ws-facet__ico--chev { display: none; }
.ws-check__label, .ws-swatch__label { flex: 0 1 auto; }
.ws-check, .ws-swatch { gap: 10px; }
.ws-check__n { font-size: 0.875rem; }
.ws-swatch .ws-mega__swatch { width: 22px; height: 22px; }

.ws-help { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 12px; align-items: start; padding: 16px; border-radius: var(--radius); }
.ws-help__icon { grid-row: 1 / span 3; width: 38px; height: 38px; background: none; margin: 0; }
.ws-help__icon svg { width: 30px; height: 30px; stroke: var(--rust); }
.ws-help h3 { font-size: 0.9375rem; }
.ws-help p { font-size: 0.8125rem; }
.ws-help .ws-btn { grid-column: 1 / -1; justify-self: stretch; margin-top: 10px; background: var(--paper); gap: 8px; white-space: nowrap; }
.ws-help .ws-btn:hover { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.ws-help .ws-btn svg { width: 14px; height: 14px; }

.ws-toolbar--v3 { border-bottom: 0; padding-bottom: 0; margin-bottom: 16px; }
.ws-toolbar__count strong { font-family: var(--font-display); font-size: 1rem; }
.ws-toolbar__count span { margin-left: 6px; }

.ws-pcard__badge { background: #f6c945; color: var(--ink); text-transform: uppercase; letter-spacing: 0.06em; border-radius: 4px; }
.ws-pcard__badge--sale { background: #d2331f; color: #fff; }
.ws-pcard__type { color: var(--ink); font-weight: 700; letter-spacing: 0.04em; }
.ws-pcard__title { font-family: var(--font-body); font-weight: 500; color: var(--graphite); }
.ws-pcard__specs { gap: 4px 8px; color: var(--slate); }
.ws-pcard__specs li:not(:last-child)::after { content: none; }
.ws-pcard__specs li + li { border-left: 1px solid #c9d0d5; padding-left: 8px; }
.ws-pcard__now strong { color: #d2331f; }
.ws-pcard__was { gap: 4px 8px; color: var(--slate); }
.ws-pcard__was em { color: var(--graphite); font-weight: 500; border-left: 1px solid #c9d0d5; padding-left: 8px; }
.ws-pcard__actions .ws-btn--ghost { border-color: var(--ink); }
@container (min-width: 268px) { .ws-pcard__actions .ws-btn svg { display: inline-block; width: 14px; height: 14px; } }
@media (max-width: 899.98px) { .ws-facets .ws-help { margin-top: 12px; } }
/* Narrow cards wrap the spec and price lines, so drop the divider rules there */
@container (max-width: 224.98px) {
  .ws-pcard__specs { gap: 2px 10px; }
  .ws-pcard__specs li + li, .ws-pcard__was em { border-left: 0; padding-left: 0; }
}
.ws-pcard__title a { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* --- Footer v3: contact lines under the logo, three link columns, centred socials -------- */
.ws-footer__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 20px; }
.ws-footer__brand, .ws-footer__contact-col { grid-column: 1 / -1; }
.ws-footer__brand p { max-width: 44ch; }
.ws-footer__contact--brand { margin-top: 18px; gap: 10px; }
.ws-footer__contact--brand a, .ws-footer__contact-col a { overflow-wrap: anywhere; }
.ws-footer__col--links ul a { padding: 7px 0; }
.ws-footer ul a.ws-nav--sale { color: #f08a4b; }
@media (min-width: 720px) {
  .ws-footer__inner { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px 28px; }
  .ws-footer__col--links ul a { padding: 5px 0; }
}
@media (min-width: 1000px) {
  .ws-footer__inner { grid-template-columns: minmax(0, 1.55fr) repeat(var(--ws-footer-cols, 4), minmax(0, 1fr)); gap: clamp(28px, 3vw, 44px); }
  .ws-footer__inner > .ws-footer__col:last-child { min-width: 0; }
  .ws-footer__brand, .ws-footer__contact-col { grid-column: auto; }
  .ws-footer__contact-col { grid-column: span 1; }
}
@media (min-width: 1200px) {
  .ws-footer__inner { grid-template-columns: minmax(0, 1.35fr) repeat(3, minmax(0, 0.95fr)) minmax(0, 1.25fr); gap: 28px; }
  .ws-footer__col + .ws-footer__col { padding-left: 28px; }
  .ws-footer__col--links h4 { white-space: nowrap; }
}
.ws-footer__bottom-inner { display: grid; grid-template-columns: minmax(0, 1fr); justify-items: start; gap: 14px; }
.ws-footer__bottom-inner .ws-social { justify-self: start; }
@media (min-width: 900px) {
  .ws-footer__bottom-inner { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 14px 28px; }
  .ws-footer__bottom-inner .ws-social { justify-self: center; grid-column: 2; grid-row: 1; }
  .ws-footer__bottom-inner .ws-payments { justify-self: end; grid-column: 3; grid-row: 1; justify-content: flex-end; }
  .ws-footer__copy { grid-column: 1; grid-row: 1; }
  .ws-footer__legal { grid-column: 1 / -1; grid-row: 2; }
  .ws-footer__company { grid-column: 1 / -1; }
}
p.ws-footer__company { margin: 0; max-width: none; }

/* --- Price filter: two-handle slider (the From / To boxes underneath stay in sync) ------- */
.ws-range { position: relative; height: 32px; margin: 4px 2px 14px; }
.ws-range__track { position: absolute; left: 0; right: 0; top: 50%; height: 4px; margin-top: -2px; border-radius: 4px; background: #d5dadd; }
.ws-range__fill { position: absolute; top: 0; bottom: 0; left: 0; right: 0; border-radius: 4px; background: var(--rust); }
.ws-range input[type="range"] { position: absolute; left: 0; top: 0; width: 100%; height: 32px; margin: 0; padding: 0; background: none; pointer-events: none; -webkit-appearance: none; appearance: none; }
.ws-range input[type="range"]::-webkit-slider-runnable-track { background: none; height: 32px; }
.ws-range input[type="range"]::-moz-range-track { background: none; height: 32px; }
.ws-range input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; pointer-events: auto; width: 26px; height: 26px; margin-top: 3px; border-radius: 50%; background: var(--paper); border: 2px solid var(--rust); box-shadow: 0 1px 4px rgba(15,20,24,.25); cursor: grab; }
.ws-range input[type="range"]::-moz-range-thumb { pointer-events: auto; width: 22px; height: 22px; border-radius: 50%; background: var(--paper); border: 2px solid var(--rust); box-shadow: 0 1px 4px rgba(15,20,24,.25); cursor: grab; }
.ws-range input[type="range"]:focus-visible { outline: none; }
.ws-range input[type="range"]:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 4px rgba(191,74,28,.25); }
.ws-range input[type="range"]:focus-visible::-moz-range-thumb { box-shadow: 0 0 0 4px rgba(191,74,28,.25); }
.ws-range input[type="range"]:active::-webkit-slider-thumb { cursor: grabbing; }
/* The same card inside the older grids and sliders (home, search, "You may also like") */
.ws-grid > .ws-pcard, .ws-slider__track > .ws-pcard { min-width: 0; }
@media (max-width: 599.98px) { .ws-grid:has(> .ws-pcard) { gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Product page: with a single image there is no thumbnail strip, so the main image takes the full gallery width */
.ws-pdp__gallery > .ws-pdp__main:only-child { grid-column: 1 / -1; }

/* ==========================================================================
   15 Oct: black top bar and footer, yellow departments bar, red prices, accent buttons
   ========================================================================== */
.ws-topbar { background: var(--black); }
.ws-footer { background: var(--black); }

.ws-navbar { background: var(--accent); border-top: 0; }
.ws-nav__list:first-child { flex: 1; justify-content: space-between; gap: 4px; }
.ws-nav__link { text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.875rem; font-weight: 700; color: var(--black); padding: 14px 10px 12px; }
.ws-nav__item:hover > .ws-nav__link, .ws-nav__item[data-open="true"] > .ws-nav__link, .ws-nav__link[aria-current="page"] { border-bottom-color: var(--black); color: var(--black); }
.ws-nav__link.ws-nav--sale { color: #a3120a; font-weight: 800; }
.ws-nav__toggle { color: var(--black); }

.ws-mega__thumb--sm { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; box-shadow: inset 0 0 0 1px rgba(15,20,24,.12); }

.ws-pdp__price .ws-price-m2, .ws-pdp__price .ws-price-m2 > span { color: var(--price-red); }
.ws-pdp__price .ws-price-m2 small { color: var(--slate); }

.ws-btn--ink { background: var(--black); border-color: var(--black); color: #fff; }
.ws-btn--ink:hover { background: #2a2a2a; border-color: #2a2a2a; color: #fff; }
.ws-btn--accent { background: var(--accent); border-color: var(--accent); color: var(--black); font-weight: 700; }
.ws-btn--accent:hover { background: var(--accent-deep); border-color: var(--accent-deep); color: var(--black); }
.ws-btn--accent svg { stroke: currentColor; }
.ws-pdp__secondary .ws-pdp__sample { flex: 1 1 100%; }
#ws-pdp-add { white-space: nowrap; }
@media (max-width: 380px) { #ws-pdp-add { font-size: 0.9375rem; padding-inline: 12px; } }
/* Homepage hero photo: keep the floor in view (lower part of the photo) */
.ws-hero__media img { object-position: 65% 78%; }
.ws-button-row__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 18px; }
@media (max-width: 479.98px) { .ws-button-row__actions .ws-btn { width: 100%; } }

/* Phone menu: departments in capitals on the yellow accent, like the desktop bar */
.ws-drawer .ws-drawer__menu--depts { background: var(--accent); border-radius: var(--radius-lg); padding: 4px 8px 4px 16px; }
.ws-drawer__menu--depts > li > a, .ws-drawer__menu--depts .ws-drawer__row { text-transform: uppercase; letter-spacing: 0.06em; font-family: var(--font-display); font-weight: 700; font-size: 0.9375rem; color: var(--black); border-bottom-color: rgba(10,10,10,.12); }
.ws-drawer__menu--depts > li:last-child > a, .ws-drawer__menu--depts > li:last-child .ws-drawer__row { border-bottom: 0; }
.ws-drawer__menu--depts .ws-drawer__row a { color: var(--black); }
.ws-drawer__menu--depts .ws-drawer__acc { background: rgba(255,255,255,.55); color: var(--black); }
.ws-drawer__menu--depts .ws-drawer__sub { border-left-color: rgba(10,10,10,.2); }
.ws-drawer__menu--depts .ws-drawer__sub ul a { color: var(--black); text-transform: none; letter-spacing: 0; }
.ws-drawer__menu--depts .ws-drawer__sublabel { color: var(--black); }
.ws-payments svg, .ws-payment-icon { width: 46px; height: 30px; }

/* Phones: floor photo on top that fades softly into the cream text panel */
@media (max-width: 899.98px) {
  .ws-hero { min-height: 0; flex-direction: column; align-items: stretch; background: var(--cream); }
  .ws-hero__media { position: relative; inset: auto; height: 92vw; max-height: 500px; margin-bottom: -1px; }
  .ws-hero__media img { object-position: 40% 100%; }
  .ws-hero__media::after { display: block; background: linear-gradient(180deg, rgba(248,244,238,0) 0%, rgba(248,244,238,0) 64%, rgba(248,244,238,.75) 84%, var(--cream) 94%, var(--cream) 100%); bottom: -2px; }
  .ws-hero__inner { position: relative; z-index: 1; margin-top: -60px; padding: 0 16px 28px; }
  .ws-hero h1 { font-size: clamp(2rem, 9.4vw, 2.6rem); line-height: 1.02; }
  .ws-hero__text { font-size: 1rem; }
  .ws-hero__actions { display: grid; grid-template-columns: 1fr; gap: 10px; }
  .ws-hero__actions .ws-btn { width: 100%; justify-content: center; }
  .ws-hero .ws-inline-usps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 20px; }
  .ws-hero .ws-inline-usps li { flex-direction: column; align-items: flex-start; gap: 6px; border: 0; margin: 0; padding: 0; width: auto; font-size: 0.8125rem; line-height: 1.25; }
}
.ws-pdp__delivery { display: flex; gap: 12px; align-items: flex-start; margin-top: 14px; padding: 14px 16px; background: var(--mist); border-radius: var(--radius-lg); }
.ws-pdp__delivery svg { flex: none; width: 22px; height: 22px; stroke: var(--ink); fill: none; stroke-width: 1.6; margin-top: 2px; }
.ws-pdp__delivery p { margin: 0; font-size: 0.9375rem; line-height: 1.45; color: var(--graphite); }
.ws-pdp__delivery strong { color: var(--ink); margin-right: 4px; }
.ws-pdp__delivery-more { border: 0; background: none; padding: 0; font: inherit; font-weight: 600; color: var(--ink); text-decoration: underline; cursor: pointer; }

/* ==========================================================================
   Phones: rotating top bar, logo centred, menu left, search and basket right
   ========================================================================== */
.ws-topbar__rotator { display: none; }
@media (max-width: 899.98px) {
  .ws-topbar__group--contact, .ws-topbar__group--usps, .ws-topbar__group--right { display: none; }
  .ws-topbar__inner { justify-content: center; padding-block: 8px; }
  .ws-topbar__rotator { display: grid; justify-items: center; width: 100%; }
  .ws-topbar__rotator .ws-topbar__item { grid-area: 1 / 1; padding: 0; border: 0; opacity: 0; transform: translateY(6px); transition: opacity .35s ease, transform .35s ease; pointer-events: none; }
  .ws-topbar__rotator .ws-topbar__item.is-active { opacity: 1; transform: none; pointer-events: auto; }
  .ws-topbar__rotator .ws-topbar__item span, .ws-topbar__rotator .ws-topbar__item a { color: #fff; }

  .ws-header__inner { grid-template-columns: 44px 44px minmax(0, 1fr) 44px 44px; gap: 0; padding-block: 10px; }
  .ws-header__actions { display: contents; }
  .ws-burger { grid-column: 1; grid-row: 1; justify-self: start; }
  .ws-logo { grid-column: 3; grid-row: 1; justify-self: center; }
  .ws-hact--search { grid-column: 4; grid-row: 1; }
  #ws-basket { grid-column: 5; grid-row: 1; }
  .ws-hact--account, .ws-hact--wishlist, .ws-header__cta, .ws-header__divider { display: none; }
  .ws-hact { min-width: 44px; padding: 4px; }
  .ws-hact span:not(.ws-hact__count) { display: none; }
  .ws-logo img { width: clamp(118px, 34vw, 150px); }
}
@media (prefers-reduced-motion: reduce) { .ws-topbar__rotator .ws-topbar__item { transition: none; transform: none; } }

/* Photos that sit small in a white square are zoomed to fill their frame (values in snippets/image-zoom.liquid) */
img[data-zoomed] { transform: scale(var(--zs, 1)) translate(var(--zx, 0%), var(--zy, 0%)); transform-origin: center; }
.ws-cgrid--list img[data-zoomed] { transform: none; }
.ws-pdp__main { overflow: hidden; }

/* Shop By Type line icons (Plank / Herringbone / Tile Effect) */
.ws-mega__icon--line { border-radius: 6px; background: #fff; color: var(--ink, #1a1a1a); }
.ws-type-icon { width: 30px; height: 30px; display: block; }

/* Small phones (320px): keep grids and rows inside the viewport */
.ws-pdp { grid-template-columns: minmax(0, 1fr); }
.ws-pdp > *, .ws-pdp__info > *, .ws-pdp__features > *, .ws-pdp__usps > *, .ws-usps__inner > * { min-width: 0; }
.ws-usps__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ws-pdp__features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 600px) { .ws-pdp__features { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 900px) { .ws-usps__inner { grid-template-columns: repeat(4, minmax(0, 1fr)); } .ws-pdp { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); } }
@media (max-width: 380px) {
  .ws-usp { gap: 8px; padding-left: 10px; min-width: 0; }
  .ws-usp__copy { min-width: 0; overflow-wrap: anywhere; }
  .ws-usps__inner { gap: 14px 12px; }
  .ws-usp__icon { width: 34px; height: 34px; }
  .ws-usp__icon svg { width: 28px; height: 28px; }
  .ws-pdp__buy { flex-wrap: wrap; }
  .ws-pdp__buy .ws-btn { flex-basis: 100%; }
  .ws-pdp__secondary .ws-btn { min-width: 0; }
  .ws-toolbar > * { min-width: 0; max-width: 100%; }
  .ws-toolbar select { max-width: 100%; }
}