/* ---- brindle (Brindle — Dog gear & kennel goods 82) ------------------------
   THE STRUCTURAL MOVE: the funding band is WELDED to the underside of the hero
   — zero top margin, full bleed, a near-solid saddle-tan rule laid across the
   page before a single word of content — and then the page goes quiet inside
   one contained column for almost its whole length before the heaviest block
   on the platform, a six-up gapless yard wall, lands hard at the very bottom.
   The two strips are told apart by COUNT, never by position: a row that owns a
   fifth card is the wall, anything else is the four-tile category row. */
body.t-brindle {
  background: #f4f1ea;
  color: #45403a;
  --radius: 0;
  --shadow: none;
  --header-bg: #f4f1ea;
  --surface: #f4f1ea;
  --surface-2: #eae5da;
  --line: #ded7c9;
  --line-strong: #c6bca8;
  --heading: #1c1a17;
  --text: #45403a;
  --muted: #7c7367;
}
/* a plain solid bar of type on bone under one charcoal rule — it never turns to
   glass over the hero photograph and it never floats */
body.t-brindle .sf-header, body.t-brindle .sf-footer { background: #f4f1ea; backdrop-filter: none; -webkit-backdrop-filter: none; border-color: #1c1a17; }
body.t-brindle .sf-name, body.t-brindle .sf-navlink, body.t-brindle .sf-cats a { text-transform: uppercase; letter-spacing: 0.2em; font-size: 12px; font-weight: 700; }
body.t-brindle .btn.brand { background: #a8703f; border-color: #a8703f; color: #fdfaf4; box-shadow: none; text-transform: uppercase; letter-spacing: 0.14em; font-size: 11px; font-weight: 700; padding: 14px 28px; }
body.t-brindle .btn.brand:hover { background: #8d5a2f; border-color: #8d5a2f; }
body.t-brindle .sc-h2 { text-align: left; font-size: clamp(21px, 2.6vw, 30px); font-weight: 700; letter-spacing: -0.01em; color: #1c1a17; }

/* the opener stops short of the fold on purpose — three-quarter height, so the
   band underneath is already showing when the page lands */
body.t-brindle .sc-hero { min-height: 74vh; }

/* THE WELD — no top margin, no gutter, a tan wash heavy enough that the yard
   photograph survives only as grain under it */
body.t-brindle .sc-banner { margin: 0 calc(50% - 50vw); min-height: 0; padding: 26px 22px; box-shadow: inset 0 0 0 100vmax rgba(168, 112, 63, 0.9); }
body.t-brindle .sc-banner-inner { max-width: 1040px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 14px 30px; }
body.t-brindle .sc-banner h2 { margin: 0; font-size: clamp(14px, 1.7vw, 18px); font-weight: 600; text-shadow: none; }
body.t-brindle .sc-banner .btn.brand { background: #1c1a17; border-color: #1c1a17; padding: 12px 24px; }

/* four category tiles pushed together on a two-pixel gutter */
body.t-brindle .sc-strip { padding: 78px 20px 8px; }
body.t-brindle .sc-strip-row { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2px; }
body.t-brindle .sc-strip-label { margin-top: 11px; text-transform: uppercase; letter-spacing: 0.2em; font-size: 10.5px; font-weight: 700; }

/* THE WALL — the fifth card is the tell. Six photographs, three across twice,
   edge to edge with no gutter and the captions dropped inside the frame */
body.t-brindle .sc-strip:has(.sc-strip-card:nth-child(5)) { max-width: none; padding: 100px 0 0; }
body.t-brindle .sc-strip:has(.sc-strip-card:nth-child(5)) .sc-strip-row { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
body.t-brindle .sc-strip:has(.sc-strip-card:nth-child(5)) .sc-strip-card { position: relative; }
body.t-brindle .sc-strip:has(.sc-strip-card:nth-child(5)) .sc-strip-img { aspect-ratio: 4 / 3; border: 0; }
body.t-brindle .sc-strip:has(.sc-strip-card:nth-child(5)) .sc-strip-label { position: absolute; left: 15px; bottom: 12px; margin: 0; color: #f4f1ea; text-shadow: 0 1px 9px rgba(0, 0, 0, 0.75); }

/* the middle: one tall lead frame carries the rest, and the tan is only ever a
   tick sitting on top of a number */
body.t-brindle .sc-look-media img { aspect-ratio: 1; }
body.t-brindle .sc-look-row:nth-child(2) .sc-look-media img { aspect-ratio: 4 / 5; }
body.t-brindle .sc-look-p, body.t-brindle .sc-buy-p { display: inline-block; border-top: 2px solid #a8703f; padding-top: 8px; color: #1c1a17; font-weight: 700; }
body.t-brindle .sc-buy-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 46px 32px; }
body.t-brindle .sc-buy-card { align-items: flex-start; text-align: left; }
body.t-brindle .sc-contact-split { border-top: 1px solid #ded7c9; gap: 64px; padding: 78px 20px 94px; }

@media (max-width: 900px) {
  body.t-brindle .sc-strip-row, body.t-brindle .sc-buy-grid,
  body.t-brindle .sc-strip:has(.sc-strip-card:nth-child(5)) .sc-strip-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* NIGHT — the yard after lights-out: bone goes to unlit stone, the tan warms */
html[data-theme="dark"] body.t-brindle {
  background: #14130f;
  color: #c3bcae;
  --header-bg: #100f0c;
  --surface: #14130f;
  --surface-2: #1d1b15;
  --line: #2b2820;
  --line-strong: #3f3a30;
  --heading: #f3efe6;
  --text: #c3bcae;
  --muted: #8b8377;
}
html[data-theme="dark"] body.t-brindle .sf-header, html[data-theme="dark"] body.t-brindle .sf-footer { background: #100f0c; border-color: #2b2820; }
html[data-theme="dark"] body.t-brindle .sc-h2 { color: #f3efe6; }
html[data-theme="dark"] body.t-brindle .btn.brand { background: #c98a4f; border-color: #c98a4f; color: #14130f; }
html[data-theme="dark"] body.t-brindle .btn.brand:hover { background: #d99c62; border-color: #d99c62; }
html[data-theme="dark"] body.t-brindle .sc-banner { box-shadow: inset 0 0 0 100vmax rgba(140, 90, 48, 0.92); }
html[data-theme="dark"] body.t-brindle .sc-banner .btn.brand { background: #14130f; border-color: #14130f; color: #f3efe6; }
html[data-theme="dark"] body.t-brindle .sc-look-p, html[data-theme="dark"] body.t-brindle .sc-buy-p { border-top-color: #c98a4f; color: #f3efe6; }
html[data-theme="dark"] body.t-brindle .sc-contact-split { border-top-color: #2b2820; }