/** Shopify CDN: Minification failed

Line 228:0 Unexpected "}"

**/
/* ==========================================================================
   Binowee Group brand tokens
   --------------------------------------------------------------------------
   Self hosted faces and brand custom properties, layered over Horizon.

   Horizon drives colour and type from theme settings, so the colour palette
   is set in config/settings_data.json rather than here. This file carries
   only what the settings cannot express: the self hosted faces, the brand
   spacing and type scale, and a small number of semantic aliases the custom
   sections use.

   Typography per the brand guidelines, with Figtree standing in for Mont,
   which is a commercial licence and was not supplied. Figtree matches Mont's
   double storey a, single storey g and tall x height.

     Tenor Sans   headings
     Figtree      subheadings (600) and body (400)
     Lexend Mega  accents, used sparingly

   No third party font CDN: every face is a theme asset, per brief 5.4.
   ========================================================================== */

/* ----------------------------------------------------------------- faces */
@font-face {
  font-family: 'Tenor Sans';
  src: url('tenor-sans-latin-400-normal.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Figtree';
  src: url('figtree-latin-400-normal.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Figtree';
  src: url('figtree-latin-500-normal.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Figtree';
  src: url('figtree-latin-600-normal.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Figtree';
  src: url('figtree-latin-700-normal.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Lexend Mega';
  src: url('lexend-mega-latin-400-normal.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* ---------------------------------------------------------------- tokens */
:root {
  /* Brand palette. Single source of truth: no hex value appears anywhere
     else in the theme, per brief 5.4. */
  --bw-dunes: #fcf3dc;
  --bw-copper-earth: #781c08;
  --bw-river-stone: #7a8b91;
  --bw-eucalypt-grey: #6d705f;
  --bw-charcoal-stone: #3f3f3c;
  --bw-ochre: #cc7722;

  /* Semantic roles, taken from the brand guidelines' own usage notes */
  --bw-surface: var(--bw-dunes);
  --bw-surface-alt: var(--bw-river-stone);
  --bw-text: var(--bw-charcoal-stone);
  --bw-text-on-dark: var(--bw-dunes);
  --bw-accent: var(--bw-copper-earth);
  --bw-accent-soft: var(--bw-ochre);
  --bw-rule: var(--bw-eucalypt-grey);

  /* Families */
  --bw-font-heading: 'Tenor Sans', Georgia, 'Times New Roman', serif;
  --bw-font-body: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI',
    Roboto, Helvetica, Arial, sans-serif;
  --bw-font-accent: 'Lexend Mega', var(--bw-font-body);

  /* 8 point spacing scale */
  --bw-space-1: 0.5rem;
  --bw-space-2: 1rem;
  --bw-space-3: 1.5rem;
  --bw-space-4: 2rem;
  --bw-space-5: 3rem;
  --bw-space-6: 4rem;
  --bw-space-7: 6rem;
  --bw-space-8: 8rem;

  /* Modular type scale, 1.25 ratio off a 16px base */
  --bw-text-xs: 0.75rem;
  --bw-text-sm: 0.875rem;
  --bw-text-base: 1rem;
  --bw-text-lg: 1.25rem;
  --bw-text-xl: 1.5625rem;
  --bw-text-2xl: 1.953rem;
  --bw-text-3xl: 2.441rem;
  --bw-text-4xl: 3.052rem;

  /* Commercial UI, used by the stream and enquiry components */
  --bw-radius: 2px;
  --bw-border: 1px solid color-mix(in srgb, var(--bw-rule) 40%, transparent);
  --bw-focus-ring: 2px solid var(--bw-copper-earth);
  --bw-focus-offset: 2px;
}

/* ------------------------------------------------- override Horizon's own */
/* Horizon generates its families from theme settings, which can only pick
   from Shopify's font library. Figtree, Tenor Sans and Lexend Mega are self
   hosted instead, so the four family variables are repointed here. Every
   other Horizon type token (sizes, weights, cases, spacing) is left alone
   and stays editable in the theme editor. */
:root {
  --font-body--family: var(--bw-font-body);
  --font-subheading--family: var(--bw-font-body);
  --font-heading--family: var(--bw-font-heading);
  --font-accent--family: var(--bw-font-accent);
}

/* --------------------------------------------------------- accessibility */
/* Copper Earth on Dunes measures 8.9:1 and Charcoal Stone on Dunes 9.7:1,
   both clearing WCAG AA for body text. Ochre on Dunes is 2.6:1 and fails,
   so Ochre is never used for text on a light ground: it is a rule, icon and
   fill colour only. Brief 13 asked for these to be measured, not assumed. */
.bw-accent-text {
  color: var(--bw-accent);
}

:where(a, button, summary, [tabindex]):focus-visible {
  outline: var(--bw-focus-ring);
  outline-offset: var(--bw-focus-offset);
}

/* ------------------------------------------------------- stream displays */
/* Shared by price-display, enquire-modal and enquiry-list. Kept here so the
   sections carry structure and behaviour only. */
.bw-price {
  font-family: var(--bw-font-body);
  font-weight: 600;
  color: var(--bw-text);
}

.bw-price__primary {
  font-size: var(--bw-text-lg);
}

.bw-price__secondary,
.bw-price__note {
  display: block;
  font-weight: 400;
  font-size: var(--bw-text-sm);
  color: var(--bw-eucalypt-grey);
}

.bw-price--guide .bw-price__label {
  font-family: var(--bw-font-accent);
  font-size: var(--bw-text-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--bw-accent);
  display: block;
  margin-block-end: var(--bw-space-1);
}

.bw-callout {
  border: var(--bw-border);
  border-inline-start: 3px solid var(--bw-accent);
  background: color-mix(in srgb, var(--bw-dunes) 60%, transparent);
  padding: var(--bw-space-2);
  margin-block: var(--bw-space-3);
  font-size: var(--bw-text-sm);
  line-height: 1.5;
}

.bw-callout__title {
  font-family: var(--bw-font-body);
  font-weight: 700;
  display: block;
  margin-block-end: var(--bw-space-1);
}

/* Toppling Furniture Information Standard 2024. The alert word, the
   statement and the symbol are mandatory where this renders, so it must not
   be possible to style it out of sight. */
.bw-toppling {
  display: flex;
  gap: 0.6rem;
  align-items: flex-start;
  margin-block: var(--bw-space-2);
  padding: 0.5rem 0.6rem;
  border: 1px solid var(--bw-copper-earth);
  font-size: 0.75rem;
  line-height: 1.45;
}
.bw-toppling__pictogram { flex: 0 0 auto; width: 36px; height: 36px; }
.bw-toppling__text { margin: 0; }
.bw-toppling__alert {
  display: inline-flex;
  align-items: center;
  gap: 0.25em;
  margin-inline-end: 0.25em;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--bw-copper-earth);
}
.bw-toppling__symbol { flex: 0 0 auto; }
}

/* ---------------------------------------------------------- content pages */
/* Horizon's page template renders the page body as a single rich text block
   with no typographic scale of its own, so the content pages carry it here.
   Scoped to .bw-page so nothing leaks into product or collection templates. */
.bw-page {
  max-width: 68ch;
  margin-inline: auto;
  font-family: var(--bw-font-body);
  font-size: var(--bw-text-base);
  line-height: 1.6;
  color: var(--bw-text);
}

.bw-page > * + * {
  margin-block-start: var(--bw-space-2);
}

.bw-page h2 {
  font-family: var(--bw-font-heading);
  font-size: var(--bw-text-2xl);
  line-height: 1.2;
  font-weight: 400;
  margin-block-start: var(--bw-space-5);
  margin-block-end: var(--bw-space-2);
}

.bw-page h3 {
  font-family: var(--bw-font-body);
  font-size: var(--bw-text-lg);
  font-weight: 600;
  margin-block-start: var(--bw-space-3);
  margin-block-end: var(--bw-space-1);
}

/* First line of a page. Larger than body, but still body face: the heading
   face at this length reads as a pull quote rather than an opening. */
.bw-lede {
  font-size: var(--bw-text-lg);
  line-height: 1.45;
  color: var(--bw-charcoal-stone);
  margin-block-end: var(--bw-space-4);
}

.bw-page ul,
.bw-page ol {
  padding-inline-start: var(--bw-space-3);
}

.bw-page li + li {
  margin-block-start: var(--bw-space-1);
}

.bw-page a {
  color: var(--bw-accent);
  text-underline-offset: 0.15em;
}

/* Certification and contact tables. Scrolls rather than squeezes on a phone:
   a certification row squeezed to two words per line is unreadable, and these
   tables are the ones a procurement officer reads on a handset. */
.bw-page table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--bw-text-sm);
  display: block;
  overflow-x: auto;
}

.bw-page th,
.bw-page td {
  text-align: start;
  vertical-align: top;
  padding: var(--bw-space-1) var(--bw-space-2);
  border-block-end: var(--bw-border);
}

.bw-page th {
  font-weight: 600;
  white-space: nowrap;
  border-block-end: 2px solid var(--bw-rule);
}

.bw-button {
  display: inline-block;
  padding: var(--bw-space-1) var(--bw-space-3);
  background: var(--bw-copper-earth);
  color: var(--bw-dunes);
  border-radius: var(--bw-radius);
  text-decoration: none;
  font-weight: 600;
}

.bw-button:hover,
.bw-button:focus-visible {
  background: var(--bw-charcoal-stone);
  color: var(--bw-dunes);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}


/* Buttons inside page content: keep light text on the copper fill (page link colour was overriding it) */
.bw-page a.bw-button,
.bw-page a.bw-button:visited {
  color: var(--bw-dunes);
  text-decoration: none;
}
.bw-page a.bw-button:hover,
.bw-page a.bw-button:focus-visible {
  background: var(--bw-charcoal-stone);
  color: var(--bw-dunes);
}
