/* ---- chalkline (Chalkline — Bespoke tailoring & cloth 191) -----------------
   THE STRUCTURAL MOVE: the catalogue's first pass is a WALL, not a grid. The
   lookbook section is turned into a four-across surface with zero gutters and
   every caption block deleted, so eight cloth tiles touch edge to edge with no
   names and no prices on them — the buyable four-up is held back until after
   the banner. Under that, the hours band is welded straight onto the bottom of
   a full-viewport picture with no strip and no rule between them.
   Ground is warm bone paper between graphite bleeds; one tailor's-chalk blue
   carries the section hairlines, the small labels and the ghost button edge. */
body.t-chalkline {
  background: #ece7dd;
  color: #1e1f21;
  --brand: #52739e;
  --ck-graphite: #17181a;
  --bg-flat: #ece7dd;
  --surface: #f5f2ea;
  --surface-2: #e0dacd;
  --line: #d6cfc0;
  --line-strong: #bdb4a1;
  --heading: #131416;
  --text: #1e1f21;
  --muted: #6a675f;
  --header-bg: #ece7dd;
  --radius: 0;
  --shadow: none;
}

/* the bar stays bone with a graphite hairline — the dark on this page belongs
   to the picture, the hours band and the banner, not to the furniture */
body.t-chalkline .sf-header, body.t-chalkline .sf-head,
body.t-chalkline .sf-footer, body.t-chalkline .sf-foot {
  background: #ece7dd; border-color: #c9c1af;
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
body.t-chalkline .btn.brand {
  background: var(--ck-graphite); border-color: var(--ck-graphite); color: #f4f0e7;
  box-shadow: none; font-weight: 600; letter-spacing: 0.05em; padding: 13px 30px;
}

/* THE STAGE — one still photograph at full viewport, copy set hard LEFT in the
   lower third so the right half of the frame stays empty picture */
body.t-chalkline .sc-hero { min-height: 100vh; align-items: flex-end; padding: 0 clamp(20px, 6vw, 88px) clamp(70px, 13vh, 128px); }
body.t-chalkline .sc-hero h1 { font-family: var(--sf-serif); font-weight: 500; font-size: clamp(32px, 5.4vw, 60px); line-height: 1.05; letter-spacing: -0.02em; }
body.t-chalkline .sc-hero .btn.brand.sc-hero-ghost { border-width: 1px; border-color: var(--brand); color: #f4f0e7; }

/* THE WELD — the hours band fused to the bottom edge of the picture: same dark,
   no gap, no rule, contained type on an edge-to-edge ground */
body.t-chalkline .sc-about-overlay { padding: 58px 20px 64px; box-shadow: inset 0 0 0 100vmax rgba(19, 20, 22, 0.6); }
body.t-chalkline .sc-about-overlay .sc-h2 { text-align: center; text-transform: uppercase; letter-spacing: 0.26em; font-size: 11.5px; font-weight: 600; color: #9db6d4; margin-bottom: 18px; }
body.t-chalkline .sc-about-overlay p { max-width: 620px; margin: 0 auto; font-size: 15.5px; line-height: 1.9; }

/* THE WALL — the lookbook rebuilt as one gapless four-across surface. The row
   grid collapses to a single cell, the caption column is dropped entirely, and
   the tiles touch, so the cloth reads as fabric rather than as cards. */
body.t-chalkline .sc-lookbook { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; padding: 0; }
body.t-chalkline .sc-lookbook > .container { grid-column: 1 / -1; padding-top: 76px; padding-bottom: 26px; }
body.t-chalkline .sc-look-row { display: block; }
body.t-chalkline .sc-look-copy { display: none; }
body.t-chalkline .sc-look-media img, body.t-chalkline .sc-buy-media img { aspect-ratio: 3 / 4; }

body.t-chalkline .sc-h2 { font-family: var(--sf-serif); font-weight: 500; text-align: left; font-size: clamp(21px, 2.8vw, 30px); letter-spacing: -0.015em; color: var(--heading); }

/* after the wall the page goes quiet: contained, calm, plenty of air */
body.t-chalkline .sc-about-split { gap: 64px; padding: 86px 20px 76px; }
body.t-chalkline .sc-about-copy p, body.t-chalkline .sc-contact-lead p { color: var(--text); font-size: 16.5px; line-height: 1.85; white-space: pre-line; }

/* THE ONE SENTENCE — the headingless richtext, alone on a plain ground with
   more space above and below it than anything else on the page gets */
body.t-chalkline .sc-richtext:not(:has(.sc-h2)) { max-width: 620px; padding: 112px 20px 118px; }
body.t-chalkline .sc-richtext:not(:has(.sc-h2)) p { font-family: var(--sf-serif); color: var(--heading); font-size: clamp(19px, 2.5vw, 27px); line-height: 1.55; }

body.t-chalkline .sc-banner { min-height: 58vh; display: flex; align-items: center; justify-content: center; margin: 0 calc(50% - 50vw) 44px; }

/* the only priced block on the page: four across, two rows that fill */
body.t-chalkline .sc-buy-grid { grid-template-columns: repeat(4, 1fr); gap: 40px 26px; }
/* the chalk hairline, spent only here and on the closing band */
body.t-chalkline .sc-buygrid, body.t-chalkline .sc-contact-split { border-top: 1px solid var(--brand); }

@media (max-width: 900px) {
  body.t-chalkline .sc-lookbook { grid-template-columns: repeat(2, 1fr); }
  body.t-chalkline .sc-buy-grid { grid-template-columns: repeat(2, 1fr); }
}

/* NIGHT — the bone paper drops to a chalkboard ground, the graphite bleeds stay
   where they were, and the controls invert to chalk so the solid slabs are the
   lit thing on the page instead of disappearing into it. The blue lifts, because
   it is still carrying every hairline and every label on its own. */
html[data-theme="dark"] body.t-chalkline {
  background: #131416;
  color: #c6c2b9;
  --brand: #8fb0d8;
  --bg-flat: #131416;
  --surface: #1a1c1e;
  --surface-2: #202325;
  --line: #2a2c2f;
  --line-strong: #3d4044;
  --heading: #f2eee5;
  --text: #c6c2b9;
  --muted: #85817a;
  --header-bg: #131416;
}
html[data-theme="dark"] body.t-chalkline .sf-header, html[data-theme="dark"] body.t-chalkline .sf-head,
html[data-theme="dark"] body.t-chalkline .sf-footer, html[data-theme="dark"] body.t-chalkline .sf-foot { background: #131416; border-color: #2a2c2f; }
html[data-theme="dark"] body.t-chalkline .btn.brand { background: #e9e4d9; border-color: #e9e4d9; color: #131416; }
html[data-theme="dark"] body.t-chalkline .sc-look-media, html[data-theme="dark"] body.t-chalkline .sc-buy-media { background: #1a1c1e; }
