/* ---- sheave (Sheave — Bearings, belts & drives 176) ------------------------
   THE STRUCTURAL MOVE: the page is a light–dark ladder. Every contained column
   stands on zinc white, and exactly twice it breaks its container and drops to
   full-bleed oiled-steel charcoal — the six-up capability strip and the four-up
   strip near the foot — with the contact band closing on that same ground.
   There is no photograph in the library for a strip tile and none is invented:
   the empty media box is redrawn as a small orange bearing ring above a centred
   label, and the lower band strips the ring out entirely so it reads as four
   text blocks on flat steel. That band is matched by CHILD COUNT, never by
   element position, because both strips are <section> and the hero is first.
   Product tiles are the only pure white here, separated by 1px zinc gaps rather
   than card borders, so the shop floor is the brightest thing on the page. One
   machine orange — buttons, ring, rand figures. Headings stay graphite. */
body.t-sheave {
  background: #eff1f2;
  color: #2b3034;
  --radius: 0;
  --header-bg: #eff1f2;
  --surface: #ffffff;
  --surface-2: #e2e5e8;
  --line: #d5d9dc;
  --line-strong: #b9bfc4;
  --heading: #1b1e21;
  --text: #2b3034;
  --muted: #666e74;
}
/* the bar rides over the slide stage with no ground of its own. Scoped by :has
   because cart, search and product pages have no hero and need the solid bar. */
body.t-sheave:has(.sc-hero) .sf-header { position: absolute; left: 0; right: 0; background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; border-bottom: 0; }
body.t-sheave:has(.sc-hero) .sf-name, body.t-sheave:has(.sc-hero) .sf-cart, body.t-sheave:has(.sc-hero) .sf-navlink, body.t-sheave:has(.sc-hero) .theme-toggle { color: #f2f4f5; }
body.t-sheave .btn.brand { background: #d15c0d; border: none; color: #ffffff; box-shadow: none; text-transform: uppercase; letter-spacing: 0.14em; font-size: 11px; font-weight: 700; padding: 16px 32px; }
body.t-sheave .btn.brand:hover { background: #b44d07; opacity: 1; }

/* three slides carry the whole first screen; nothing is welded under them */
body.t-sheave .sc-hero { min-height: 100vh; padding: 150px 20px 100px; }
body.t-sheave .sc-hero h1 { font-weight: 700; letter-spacing: -0.015em; font-size: clamp(30px, 5.2vw, 60px); line-height: 1.05; }

/* the quiet first thing after the fold: one narrow paragraph, no heading, no
   picture, and more air around it than anything else on the page gets */
body.t-sheave .sc-richtext { max-width: 620px; padding: clamp(84px, 13vh, 138px) 20px; }
body.t-sheave .sc-richtext p { font-size: 18px; line-height: 1.8; color: var(--text); }

/* BAND ONE and BAND TWO — the container breaks and the ground goes to steel */
body.t-sheave .sc-strip { width: 100vw; max-width: 100vw; margin: 0 calc(50% - 50vw); background: #23272b; padding: clamp(54px, 8vh, 82px) clamp(20px, 5vw, 60px); }
body.t-sheave .sc-strip .sc-h2 { color: #f2f4f5; margin-bottom: 34px; }
body.t-sheave .sc-strip-row { max-width: 1040px; margin: 0 auto; grid-template-columns: repeat(auto-fit, minmax(158px, 1fr)); gap: 30px 22px; }
body.t-sheave .sc-strip-img { width: 32px; height: 32px; aspect-ratio: auto; margin: 0 auto 16px; background: none; border: 2px solid #d15c0d; border-radius: 50%; overflow: visible; position: relative; }
body.t-sheave .sc-strip-img::after { content: ''; position: absolute; inset: 8px; border-radius: 50%; background: #8b9298; }
body.t-sheave .sc-strip-label { margin-top: 0; color: #eceff1; text-transform: uppercase; letter-spacing: 0.15em; font-size: 11px; font-weight: 700; line-height: 1.6; }
/* the lower band repeats the four-across count and strips the marks out */
body.t-sheave .sc-strip-row:not(:has(> :nth-child(5))) .sc-strip-img { display: none; }
body.t-sheave .sc-strip-row:not(:has(> :nth-child(5))) .sc-strip-label { border-top: 2px solid #d15c0d; padding-top: 16px; letter-spacing: 0.18em; }

/* two contained splits back to back; the second mirrors, addressed by its own
   anchor id (richtext #3) rather than by position among the sections */
body.t-sheave .sc-about-split { padding: clamp(74px, 10vh, 108px) 20px; gap: clamp(30px, 5vw, 60px); }
body.t-sheave #about-3 .sc-about-media { order: 2; }

/* the shop floor: eight tiles, four across twice, pure white on hairline zinc */
body.t-sheave .product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; padding: 0; margin: 26px 0 clamp(74px, 10vh, 108px); background: #d5d9dc; }
body.t-sheave .product-card, body.t-sheave .product-card:hover, body.t-sheave .product-card .ph { background: #ffffff; border: 0; box-shadow: none; transform: none; }
body.t-sheave .product-card .p { color: #d15c0d; font-weight: 700; font-variant-numeric: tabular-nums; }

/* the page closes on the same steel the bands are cut from, two fields wide */
body.t-sheave .sc-contact-band { background: #23272b; padding: clamp(66px, 9vh, 96px) 0 clamp(74px, 10vh, 106px); }
body.t-sheave .sc-contact-band .sc-h2, body.t-sheave .sc-contact-band .sc-field label { color: #f2f4f5; }
body.t-sheave .sc-contact-band .sc-contact-sub { color: #a3abb1; }
body.t-sheave .sc-contact-band .sc-contact-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
body.t-sheave .sc-contact-band .sc-field:has(textarea), body.t-sheave .sc-contact-band .btn { grid-column: 1 / -1; }
body.t-sheave .sc-contact-band input, body.t-sheave .sc-contact-band textarea { background: #2e3339; border-color: #3d444a; color: #eceff1; }
@media (max-width: 860px) {
  body.t-sheave .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.t-sheave .sc-strip-row { grid-template-columns: repeat(2, 1fr); }
  body.t-sheave .sc-contact-band .sc-contact-form { grid-template-columns: 1fr; }
}

/* NIGHT — the ladder inverts. The ground drops to cold shadow and the two bands
   lift OFF it instead of sinking into it, so the light-dark rhythm survives the
   toggle rather than collapsing into one flat dark sheet. */
html[data-theme="dark"] body.t-sheave {
  background: #14171a;
  color: #b3babf;
  --header-bg: #14171a;
  --surface: #1c2023;
  --surface-2: #23282c;
  --line: #2b3136;
  --line-strong: #3a4146;
  --heading: #eceff1;
  --text: #b3babf;
  --muted: #7c858b;
}
html[data-theme="dark"] body.t-sheave .sc-strip, html[data-theme="dark"] body.t-sheave .sc-contact-band { background: #20262a; }
html[data-theme="dark"] body.t-sheave .product-grid { background: #2b3136; }
html[data-theme="dark"] body.t-sheave .product-card, html[data-theme="dark"] body.t-sheave .product-card:hover, html[data-theme="dark"] body.t-sheave .product-card .ph { background: #1c2023; }
html[data-theme="dark"] body.t-sheave .btn.brand { background: #ef7415; color: #14171a; }
html[data-theme="dark"] body.t-sheave .btn.brand:hover { background: #d8620a; }
html[data-theme="dark"] body.t-sheave .product-card .p { color: #ef7415; }
html[data-theme="dark"] body.t-sheave .sc-strip-img, html[data-theme="dark"] body.t-sheave .sc-strip-row:not(:has(> :nth-child(5))) .sc-strip-label { border-color: #ef7415; }
