/* ---- cairn (Cairn — Coaching tools 79) -------------------------------------
   STRUCTURAL MOVE — THE RIBBON. The reference opens on a full-viewport
   photograph with the type standing straight on it in the left third, and then
   every contained block that follows is pulled to ONE narrow measure with wide
   side margins and a lot of air, so the rest of the page reads as a single
   column of content rather than a stack of full-width bands. The closing
   richtext is narrowed further still: it is the quietest block on the page and
   deliberately the last prose on it, which is why it gets the hairline and the
   loosest leading in the theme.
   Bone paper, slate ink, one dusty heather-mauve kept for buttons, the price
   and links — the category labels stay grey so the accent never spreads.
   Every day rule below is written against tokens, which is what keeps the
   night block to five rules instead of twenty. */
body.t-cairn {
  background: #f7f5ef;
  color: #4d545d;
  --radius: 0;
  --header-bg: rgba(247, 245, 239, 0.82);
  --surface: #ffffff;
  --surface-2: #efebe1;
  --line: #e2ded4;
  --line-strong: #cdc7b9;
  --heading: #2c3138;
  --text: #4d545d;
  --muted: #7e848c;
}
body.t-cairn .sf-head, body.t-cairn .sf-foot, body.t-cairn .sf-footer { background: #f7f5ef; border-color: #e2ded4; }
body.t-cairn .sc-h2 { color: var(--heading); font-weight: 400; font-size: clamp(22px, 2.9vw, 32px); letter-spacing: -0.02em; margin-bottom: 34px; }
body.t-cairn .btn.brand { background: #74648c; color: #f7f5ef; box-shadow: none; }
body.t-cairn .btn.brand:hover { background: #61517a; }

/* the opener: full viewport, no card and no second scrim — the headline sits on
   the photograph itself, held to the left third by a narrow inner measure */
body.t-cairn .sc-hero { min-height: 100vh; padding: 0 clamp(24px, 8vw, 120px); }
body.t-cairn .sc-hero .sc-hero-inner { max-width: 470px; }
body.t-cairn .sc-hero h1 { font-weight: 400; font-size: clamp(34px, 5.6vw, 64px); line-height: 1.05; letter-spacing: -0.03em; }

/* THE RIBBON — one measure, one rhythm, for every contained block on the page */
body.t-cairn .sc-about-split, body.t-cairn .sc-strip, body.t-cairn .sc-buygrid { max-width: 920px; padding: 96px 20px; }
body.t-cairn .sc-about-split { grid-template-columns: 5fr 6fr; gap: 56px; }

/* six habits, three across twice — the label sits UNDER the picture, never on it */
body.t-cairn .sc-strip-row { grid-template-columns: repeat(3, 1fr); gap: 34px 28px; }
body.t-cairn .sc-strip-img { aspect-ratio: 4 / 5; border-color: var(--line); }
body.t-cairn .sc-strip-label, body.t-cairn .sc-buy-cat { margin-top: 14px; text-transform: uppercase; letter-spacing: 0.24em; font-size: 10.5px; font-weight: 600; color: var(--muted); }
body.t-cairn .sc-buy-grid { grid-template-columns: repeat(3, 1fr); gap: 56px 34px; }
body.t-cairn .sc-buy-p { color: #74648c; font-weight: 600; }

/* the quietest block on the page, and the last prose on it: a bare narrow
   column, set left, opened by a short hairline and leaded wide open */
body.t-cairn .sc-richtext { max-width: 580px; padding: 100px 20px 108px; border-top: 1px solid var(--line); text-align: left; }
body.t-cairn .sc-richtext .sc-h2 { text-align: left; }
body.t-cairn .sc-richtext p { font-size: 16.5px; line-height: 2.1; color: var(--text); }

/* closes flat — one wide band, three fields, no second ask */
body.t-cairn .sc-contact-band { padding: 82px 0 92px; }

@media (max-width: 900px) {
  body.t-cairn .sc-about-split { grid-template-columns: 1fr; gap: 34px; }
}
@media (max-width: 760px) {
  body.t-cairn .sc-strip-row, body.t-cairn .sc-buy-grid { grid-template-columns: repeat(2, 1fr); }
}

/* NIGHT — the paper drops to a cold slate near-black and the ink comes up to
   bone. The heather lifts to a paler mauve so it still carries on the price and
   the buttons; everything else is already riding the tokens redefined here. */
html[data-theme="dark"] body.t-cairn {
  background: #16181b;
  color: #a9aeb5;
  --header-bg: rgba(22, 24, 27, 0.82);
  --surface: #1c1f23;
  --surface-2: #21252a;
  --line: #2b2f35;
  --line-strong: #3a3f46;
  --heading: #eceae4;
  --text: #a9aeb5;
  --muted: #838a92;
}
html[data-theme="dark"] body.t-cairn .sf-head, html[data-theme="dark"] body.t-cairn .sf-foot,
html[data-theme="dark"] body.t-cairn .sf-footer { background: #16181b; border-color: #2b2f35; }
html[data-theme="dark"] body.t-cairn .sc-buy-p { color: #b6a6cf; }
html[data-theme="dark"] body.t-cairn .btn.brand { background: #b6a6cf; color: #16181b; }
html[data-theme="dark"] body.t-cairn .btn.brand:hover { background: #c8bade; }