/* ---- quarry (Quarry — Stained glass 58) — bone white, one lead grey --------
   THE STRUCTURAL MOVE: the catalogue is not a grid of cards, it is ONE LEADED
   MOSAIC. The showcase panels are pulled in from two across to three, held
   inside the page column instead of running full-bleed, and every gap is closed
   to a single grey line so the ground shows between the quarries exactly the
   way lead came does. The caption is dropped BELOW each photograph with flex
   order — nothing is ever written over the glass. Because that mosaic is
   contained, the four-up strip beneath it is the only thing on the whole page
   that reaches the edges, which is the entire reason it lands.
   There is no hero: the page opens cold on a 540px paragraph with more air
   above it than type in it, so the first photograph a visitor sees is the
   top-left product. Zero colour in the furniture — buttons are flat ink slabs,
   rules are hairlines — so all of the colour comes out of the glass, which is
   shot backlit on white and multiplied onto the bone ground rather than boxed
   into a photo card. */
body.t-quarry { background: #faf9f6; color: #141414; --heading: #141414; --text: #141414; --muted: #4a4a46; --line: #e3e2dc; --surface: #faf9f6; --surface-2: #faf9f6; }
body.t-quarry .sf-head, body.t-quarry .sf-foot { background: #faf9f6; border-color: #e3e2dc; }
/* static, never sticky, never transparent — no photograph reaches the top of
   the page, so there is nothing for the bar to float over */
body.t-quarry .sf-header { position: static; background: #faf9f6; backdrop-filter: none; -webkit-backdrop-filter: none; border-bottom: 1px solid #e3e2dc; }
body.t-quarry .sc-showcase, body.t-quarry .sc-richtext, body.t-quarry .sc-contact { scroll-margin-top: 0; }
body.t-quarry .sc-h2 { text-transform: uppercase; letter-spacing: 0.22em; font-weight: 700; font-size: clamp(11px, 1.2vw, 13px); color: #8b8b86; margin-bottom: 34px; }

/* the cold opener that replaces the hero: one narrow column, hoarded air */
body.t-quarry .sc-richtext { max-width: 540px; padding: 118px 20px 66px; }

/* THE MOSAIC — three across, contained on the page column, hairline lead
   between every quarry and a lead line right round the outside */
body.t-quarry .sc-show-grid { grid-template-columns: repeat(3, 1fr); gap: 1px; background: #8b8b86; border: 1px solid #8b8b86; max-width: 1080px; width: calc(100% - 40px); margin: 0 auto 92px; }
body.t-quarry .sc-show-inner { min-height: 0; padding: 34px 26px 30px; }
body.t-quarry .sc-show-media { order: 1; flex: none; padding: 0; }
body.t-quarry .sc-show-media img { max-width: 100%; max-height: 300px; mix-blend-mode: multiply; }
body.t-quarry .sc-show-t { order: 2; margin-top: 26px; font-size: 15px; font-weight: 600; text-transform: none; letter-spacing: 0; }
body.t-quarry .sc-show-cat { order: 3; margin-top: 5px; color: #8b8b86; letter-spacing: 0.2em; font-size: 10px; }
body.t-quarry .sc-show-price { order: 4; font-size: 15px; font-weight: 600; margin: 15px 0 16px; }
body.t-quarry .sc-show-buy, body.t-quarry .sc-show-btn { order: 5; }
body.t-quarry .sc-show-rule { display: none; }
/* alternating scale, so the wall reads as cut pieces and not a spec sheet */
body.t-quarry .sc-show-item:nth-child(odd) .sc-show-media img { max-height: 220px; }

/* the one full-bleed moment on the page, and the only break in the rhythm */
body.t-quarry .sc-strip { max-width: none; width: 100vw; max-width: 100vw; margin: 0 calc(50% - 50vw); padding: 0 0 8px; }
body.t-quarry .sc-strip-row { grid-template-columns: repeat(4, 1fr); gap: 0; }
body.t-quarry .sc-strip-img { aspect-ratio: 4 / 3; border: 0; border-radius: 0; }

/* closes the way it opened: bare bone white, Send centred under the fields */
body.t-quarry .sc-contact { padding: 82px 20px 98px; }
body.t-quarry .sc-contact-form .btn { align-self: center; }
body.t-quarry .sc-field input, body.t-quarry .sc-field textarea, body.t-quarry .product-card, body.t-quarry .product-card .ph { border-radius: 0; }
body.t-quarry .btn.brand { background: #141414; color: #faf9f6; border-radius: 0; text-transform: uppercase; letter-spacing: 0.18em; font-size: 11px; font-weight: 700; padding: 14px 30px; box-shadow: none; }
body.t-quarry .btn.brand:hover { background: #8b8b86; color: #141414; }

/* NIGHT — the studio after the lamps go on. The lead line lifts so the mosaic
   still reads as one jointed object, and the multiply is dropped: on a dark
   ground the shots stop being sheets on white and become lit panels on a wall,
   which is the same thing the glass does at night. */
html[data-theme="dark"] body.t-quarry { background: #141414; color: #e6e5e0; --heading: #f4f3ee; --text: #e6e5e0; --muted: #9d9b94; --line: #2b2b28; --surface: #141414; --surface-2: #141414; }
html[data-theme="dark"] body.t-quarry .sf-head, html[data-theme="dark"] body.t-quarry .sf-foot { background: #141414; border-color: #2b2b28; }
html[data-theme="dark"] body.t-quarry .sf-header { background: #141414; border-bottom-color: #2b2b28; }
html[data-theme="dark"] body.t-quarry .sc-show-grid { background: #4d4d49; border-color: #4d4d49; }
html[data-theme="dark"] body.t-quarry .sc-show-media img { mix-blend-mode: normal; }
html[data-theme="dark"] body.t-quarry .sc-field input, html[data-theme="dark"] body.t-quarry .sc-field textarea { background: #1c1c1a; border-color: #2b2b28; color: #e6e5e0; }
html[data-theme="dark"] body.t-quarry .btn.brand { background: #f4f3ee; color: #141414; }
html[data-theme="dark"] body.t-quarry .btn.brand:hover { background: #8b8b86; color: #141414; }