/* ============================================================================
   BRIDGES 31-50 — twenty themes. Each carries the one structural move that makes
   its reference recognisable; the rest is left to the shared stylesheet.
   ==========================================================================*/
/* ---- fleece (Weft — Wool & mohair 50) — fleece cream, madder plum ----------
   THE MOVE: the header is an opaque bar sitting ABOVE the hero that does NOT
   stick — it scrolls away and never comes back, so the eight-tile catalogue in
   the middle of the page reads with no chrome over it at all. Everything else
   follows from that: a deliberately shallow letterbox hero carrying one huge
   serif display line, and every heading after it dropped four sizes to small
   tracked caps, so the type contrast is the loudest thing on the page. */
body.t-fleece { --sf-serif: 'Fraunces', Georgia, 'Times New Roman', serif; background: #efe7da; color: #241c16; }
body.t-fleece .sf-head, body.t-fleece .sf-foot { background: #efe7da; border-color: #d9cdb8; }
body.t-fleece .sf-header { position: static; background: #efe7da; backdrop-filter: none; -webkit-backdrop-filter: none; border-bottom: 1px solid #d9cdb8; }
/* nothing sticky is left to clear, so the anchor offset would only leave a gap */
body.t-fleece .sc-hero, body.t-fleece .sc-buygrid, body.t-fleece .sc-richtext, body.t-fleece .sc-contact { scroll-margin-top: 0; }
body.t-fleece .sc-hero { min-height: 46vh; padding: 44px 20px; }
body.t-fleece .sc-hero h1 { font-family: var(--sf-serif); font-weight: 400; font-size: clamp(46px, 9.5vw, 118px); line-height: 0.95; letter-spacing: -0.03em; margin-bottom: 12px; }
body.t-fleece .sc-hero p { text-transform: uppercase; letter-spacing: 0.22em; font-size: 11px; font-weight: 600; }
body.t-fleece .sc-h2 { text-transform: uppercase; letter-spacing: 0.24em; font-weight: 700; font-size: clamp(11px, 1.2vw, 13px); margin-bottom: 34px; }
/* two narrow columns of words bracket the grid — neither ever sits beside a photograph */
body.t-fleece .sc-richtext { max-width: 620px; padding: 74px 20px 60px; }
body.t-fleece .sc-richtext p { font-size: 16.5px; line-height: 1.8; }
/* eight tiles, four across, two clean rows, real cream showing between them */
body.t-fleece .sc-buy-grid { grid-template-columns: repeat(4, 1fr); gap: 46px 30px; }
@media (max-width: 1000px) { body.t-fleece .sc-buy-grid { grid-template-columns: repeat(2, 1fr); gap: 38px 22px; } }
body.t-fleece .sc-buy-media, body.t-fleece .product-card, body.t-fleece .product-card .ph { border-radius: 0; }
body.t-fleece .sc-buy-media img { aspect-ratio: 1; }
body.t-fleece .sc-buy-cat { letter-spacing: 0.2em; font-size: 10px; }
body.t-fleece .sc-banner { min-height: 32vh; display: flex; align-items: center; justify-content: center; }
/* the strip is demoted BELOW the banner, so it reads as a process feed, not a category rail */
body.t-fleece .sc-strip { padding-top: 58px; }
body.t-fleece .sc-strip-img { aspect-ratio: 1; border-radius: 0; border-color: #d9cdb8; }
body.t-fleece .sc-strip-label { text-transform: uppercase; letter-spacing: 0.16em; font-size: 10.5px; font-weight: 700; }
/* the stockist form is a rule under the page rather than a section on it */
body.t-fleece .sc-contact { max-width: 540px; border-top: 1px solid #d9cdb8; padding: 26px 20px 66px; }
body.t-fleece .btn.brand { background: #6d4260; color: #ffffff; border-radius: 0; text-transform: uppercase; letter-spacing: 0.16em; font-size: 11px; font-weight: 700; padding: 14px 28px; box-shadow: none; }
body.t-fleece .btn.brand:hover { background: #57344c; }

/* night — the same shed after dark: warm near-black ground, the madder lifted
   to a plum that still carries white-on-plum weight for the buy buttons */
html[data-theme="dark"] body.t-fleece { background: #1a1512; color: #d6ccbe; }
html[data-theme="dark"] body.t-fleece .sf-head, html[data-theme="dark"] body.t-fleece .sf-foot { background: #1a1512; border-color: #2f2720; }
html[data-theme="dark"] body.t-fleece .sf-header { background: #1a1512; border-bottom-color: #2f2720; }
html[data-theme="dark"] body.t-fleece .sc-buy-t { color: #f0e8db; }
html[data-theme="dark"] body.t-fleece .sc-buy-cat { color: #c08bb0; }
html[data-theme="dark"] body.t-fleece .sc-richtext p, html[data-theme="dark"] body.t-fleece .sc-contact-sub { color: #c9bfb0; }
html[data-theme="dark"] body.t-fleece .sc-strip-img { border-color: #2f2720; }
html[data-theme="dark"] body.t-fleece .sc-contact { border-top-color: #2f2720; }
html[data-theme="dark"] body.t-fleece .btn.brand { background: #c08bb0; color: #1a1512; }
html[data-theme="dark"] body.t-fleece .btn.brand:hover { background: #d3a6c3; }