/* ---- kelder (Kelder — Wine estate & bottle sales 123) — limewash chalk,
   charcoal ink, one vine-leaf olive ------------------------------------------
   THE STRUCTURAL MOVE: the header is STACKED, CENTRED and NOT STICKY. The
   .sf-header .container turns into a column so the serif wordmark stands alone
   on its own line with the whole menu ruled underneath it and centred across
   the full width; the category row below is centred on the same axis; and the
   bar scrolls away with the hero instead of following the page. Everything
   under it hangs off that one vertical centre line — eight bottle flat-lays
   four across on white, four gapless category tiles, one edge-to-edge
   photograph — and the about block sets a 32ch measure inside a half column so
   the gutter is deliberately wider than the paragraph. Olive is rationed to
   exactly three homes: the solid slab, the hero outline and the rand figure.
   Burgundy, purple and gold — the wine-generic colours — appear nowhere. */
body.t-kelder {
  background: #f2efe8;
  color: #16181a;
  --kd-olive: #7d8a5c;
  --sf-serif: 'Fraunces', Georgia, 'Times New Roman', serif;
  --radius: 0;
  --header-bg: #f2efe8;
  --surface: #ffffff;
  --surface-2: #e7e3d9;
  --line: #d9d5ca;
  --line-strong: #bdb9ad;
  --heading: #16181a;
  --text: #16181a;
  --muted: #6f7276;
}

/* flat limewash ground on the chrome, and the bar goes with the hero */
body.t-kelder .sf-header, body.t-kelder .sf-footer, body.t-kelder .sf-cats {
  position: static; background: #f2efe8; border-color: #d9d5ca;
  backdrop-filter: none; -webkit-backdrop-filter: none;
}

/* THE MOVE — wordmark alone on line one, the menu ruled beneath it, both
   centred, and the category row centred on the same axis */
/* header stays one row, brand hard left — house rule; kelder keeps its serif
   wordmark and its ruled second tier, it just does not centre or stack them */
body.t-kelder .sf-header .container { gap: clamp(14px, 3vw, 30px); padding: 26px 0 22px; }
body.t-kelder .sf-name { font-family: var(--sf-serif); font-weight: 400; font-size: clamp(26px, 4vw, 40px); letter-spacing: 0.01em; }
body.t-kelder .sf-header-right { gap: clamp(15px, 3vw, 34px); }
body.t-kelder .sf-cats .container { justify-content: center; }
body.t-kelder .sf-cart, body.t-kelder .sf-cats a { text-transform: uppercase; letter-spacing: 0.22em; font-size: 10.5px; font-weight: 600; color: #6f7276; }

/* OLIVE 1 of 3 — the one solid slab on the page */
body.t-kelder .btn.brand { background: var(--kd-olive); border-color: var(--kd-olive); color: #f7f6f1; box-shadow: none; text-transform: uppercase; letter-spacing: 0.16em; font-size: 11px; font-weight: 600; padding: 14px 28px; }

/* full-viewport three-slide stage, every line on the centre axis */
body.t-kelder .sc-hero { min-height: 100vh; }
body.t-kelder .sc-hero h1 { font-family: var(--sf-serif); font-weight: 400; font-size: clamp(36px, 6.4vw, 82px); line-height: 1.04; letter-spacing: -0.02em; }
/* OLIVE 2 of 3 — the hero outline, the only control that is not a slab */
body.t-kelder .sc-hero .btn.brand.sc-hero-ghost { background: transparent; border: 1px solid var(--kd-olive); color: #f6f4ee; }
body.t-kelder .sc-hero .btn.brand.sc-hero-ghost:hover { background: var(--kd-olive); color: #16181a; }

body.t-kelder .sc-h2 { font-family: var(--sf-serif); font-weight: 400; font-size: clamp(23px, 3vw, 34px); letter-spacing: -0.01em; color: #16181a; margin-bottom: clamp(26px, 3.4vw, 40px); }

/* the goods land second: four bottles across, twice, floated on white so the
   flat-lays read as objects rather than as cards */
body.t-kelder .sc-buy-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 46px 26px; }
body.t-kelder .sc-buy-media img { aspect-ratio: 3 / 4; object-fit: contain; background: #ffffff; padding: 24px 18px; }
body.t-kelder .sc-buy-cat, body.t-kelder .sc-strip-label { text-transform: uppercase; letter-spacing: 0.2em; font-size: 10px; font-weight: 600; color: #6f7276; }
/* OLIVE 3 of 3 — the rand figure, and nothing else below the fold */
body.t-kelder .sc-buy-p { color: var(--kd-olive); font-weight: 600; font-size: 15px; }

/* the cellar photograph takes a whole half; the measure in the other half is
   narrower than the gutter between them, which is the point of the block */
body.t-kelder .sc-about-split { gap: clamp(44px, 9vw, 132px); padding: clamp(66px, 9vw, 110px) 20px; }
body.t-kelder .sc-about-copy { max-width: 32ch; }
body.t-kelder .sc-about-media img, body.t-kelder .sc-strip-img { aspect-ratio: 3 / 4; border: 0; }

/* four tiles as one slab, then the single edge-to-edge photograph */
body.t-kelder .sc-strip-row { grid-template-columns: repeat(4, 1fr); gap: 2px; }
body.t-kelder .sc-banner { margin: clamp(52px, 7vw, 84px) calc(50% - 50vw); min-height: 58vh; }

/* the stockist list is TYPE between two rules — no logos, no generated marks */
body.t-kelder .sc-richtext { max-width: 620px; padding: clamp(58px, 8vw, 92px) 20px clamp(18px, 3vw, 32px); }
body.t-kelder .sc-richtext p { color: #16181a; font-size: 15px; line-height: 2.1; border-top: 1px solid #d9d5ca; border-bottom: 1px solid #d9d5ca; padding: 26px 0; }

body.t-kelder .sc-contact-split { gap: clamp(40px, 7vw, 96px); padding: clamp(56px, 7vw, 88px) 20px clamp(66px, 8vw, 100px); }
body.t-kelder .sc-contact-lead p { white-space: pre-line; line-height: 2.05; font-size: 14.5px; color: #16181a; }

@media (max-width: 900px) {
  body.t-kelder .sc-buy-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.t-kelder .sc-strip-row { grid-template-columns: repeat(2, 1fr); }
}

/* NIGHT — the limewash goes to a wet cellar-floor grey rather than to black,
   the olive lifts a stop so prices still read against it, and the eight
   flat-lays keep a warm off-white so a screen of bottles stops glaring. */
html[data-theme="dark"] body.t-kelder {
  background: #191b1a;
  color: #b6b9b6;
  --kd-olive: #9dab77;
  --header-bg: #191b1a;
  --surface: #202321;
  --surface-2: #262a27;
  --line: #2e322f;
  --line-strong: #3d423e;
  --heading: #eeece5;
  --text: #b6b9b6;
  --muted: #83877f;
}
html[data-theme="dark"] body.t-kelder .sf-header, html[data-theme="dark"] body.t-kelder .sf-footer,
html[data-theme="dark"] body.t-kelder .sf-cats { background: #191b1a; border-color: #2e322f; }
html[data-theme="dark"] body.t-kelder .sc-h2 { color: #eeece5; }
html[data-theme="dark"] body.t-kelder .sc-buy-media img { background: #f4f2eb; }
html[data-theme="dark"] body.t-kelder .sc-richtext p { color: #b6b9b6; border-color: #2e322f; }
html[data-theme="dark"] body.t-kelder .sc-contact-lead p { color: #b6b9b6; }
html[data-theme="dark"] body.t-kelder .btn.brand { color: #14160f; }
html[data-theme="dark"] body.t-kelder .sc-hero .btn.brand.sc-hero-ghost:hover { color: #14160f; }