/* ---- kleuter (Kleuter — Kids' clothes, takkies & sun gear 213) --------------
   THE STRUCTURAL MOVE: this page is a shop archive wearing a homepage. The
   stage is cut to roughly a third of the window and set hard left, so the
   priced wall — three across, two rows that fill, every tile a plain white
   plate the flat-lay merges into — breaks the fold almost immediately. The
   category row comes AFTER the goods rather than in a sidebar beside them,
   there is one short band and not three, and the only prose on the page is
   the block before the form. One sun yellow, on the buttons and the short
   rule under each price, nowhere else. (That rule stands in for the
   reference's star line — we will not print a five-star rating on a live
   merchant's product that nobody has actually reviewed.) */
body.t-kleuter { background: #faf9f7; color: #1f1e1c; }
body.t-kleuter .sf-head, body.t-kleuter .sf-foot { background: #faf9f7; border-color: #e6e2dc; }
/* a third of the window and no more — a cinematic hero would bury the catalogue */
body.t-kleuter .sc-hero { min-height: 34vh; padding: 46px 20px 54px; }
body.t-kleuter .sc-hero h1 { font-weight: 300; font-size: clamp(30px, 4.6vw, 54px); letter-spacing: -0.02em; line-height: 1.06; }
body.t-kleuter .sc-h2 { font-weight: 300; font-size: clamp(19px, 2.4vw, 27px); letter-spacing: -0.01em; margin-bottom: 26px; }
/* no centred section title anywhere the goods are — the contact band keeps its own */
body.t-kleuter .sc-buygrid .sc-h2, body.t-kleuter .sc-strip .sc-h2 { text-align: left; }
/* six tiles, three across, two rows that fill, on plain white plates */
body.t-kleuter .sc-buygrid { padding: 26px 20px 58px; }
body.t-kleuter .sc-buy-grid { grid-template-columns: repeat(3, 1fr); gap: 46px 26px; }
@media (max-width: 900px) { body.t-kleuter .sc-buy-grid { grid-template-columns: repeat(2, 1fr); gap: 34px 18px; } }
body.t-kleuter .sc-buy-media { background: #ffffff; border-radius: 0; }
body.t-kleuter .sc-buy-media img { aspect-ratio: 3 / 4; }
body.t-kleuter .sc-buy-cat { color: #8b867d; letter-spacing: 0.2em; font-size: 10px; }
body.t-kleuter .sc-buy-p { color: #1f1e1c; font-weight: 600; font-size: 15px; }
body.t-kleuter .sc-buy-p::after { content: ''; display: block; width: 26px; height: 2px; margin: 12px auto 0; background: #e8b027; }
/* the reference's sidebar Categories widget, laid on its side: one row of four */
body.t-kleuter .sc-strip { border-top: 1px solid #e6e2dc; padding-top: 46px; }
body.t-kleuter .sc-strip-row { grid-template-columns: repeat(4, 1fr); gap: 18px; }
body.t-kleuter .sc-strip-img { aspect-ratio: 4 / 5; border-radius: 0; border-color: #e6e2dc; }
body.t-kleuter .sc-strip-label { text-transform: uppercase; letter-spacing: 0.16em; font-size: 10.5px; font-weight: 700; }
/* one short band carrying a button and nothing else */
body.t-kleuter .sc-banner { min-height: 26vh; display: flex; align-items: center; padding: 34px 28px; }
body.t-kleuter .sc-about-media img, body.t-kleuter .product-card, body.t-kleuter .product-card .ph { border-radius: 0; }
body.t-kleuter .sc-about-copy p { font-size: 16px; line-height: 1.8; color: #4b4740; }
body.t-kleuter .sc-contact-band { background: #ffffff; border-top: 1px solid #e6e2dc; padding: 66px 0 78px; }
body.t-kleuter .btn.brand { background: #e8b027; color: #1f1e1c; border-radius: 0; text-transform: uppercase; letter-spacing: 0.16em; font-size: 11px; font-weight: 700; padding: 13px 26px; box-shadow: none; }
body.t-kleuter .btn.brand:hover { background: #d29c15; }

/* night — the same bone room with the lights off: warm near-black ground, the
   plates dropped to a soft charcoal so the flat-lays still sit on their own
   panel, and the sun yellow left exactly where it was */
html[data-theme="dark"] body.t-kleuter { background: #161513; color: #d9d5cd; }
html[data-theme="dark"] body.t-kleuter .sf-head, html[data-theme="dark"] body.t-kleuter .sf-foot { background: #161513; border-color: #2b2925; }
html[data-theme="dark"] body.t-kleuter .sc-buy-media { background: #1f1d1a; }
html[data-theme="dark"] body.t-kleuter .sc-buy-t, html[data-theme="dark"] body.t-kleuter .sc-buy-p { color: #f2efe8; }
html[data-theme="dark"] body.t-kleuter .sc-buy-cat { color: #918b80; }
html[data-theme="dark"] body.t-kleuter .sc-strip { border-top-color: #2b2925; }
html[data-theme="dark"] body.t-kleuter .sc-strip-img { border-color: #2b2925; }
html[data-theme="dark"] body.t-kleuter .sc-about-copy p { color: #b9b4aa; }
html[data-theme="dark"] body.t-kleuter .sc-contact-band { background: #1c1a17; border-top-color: #2b2925; }
html[data-theme="dark"] body.t-kleuter .btn.brand { background: #e8b027; color: #161513; }
html[data-theme="dark"] body.t-kleuter .btn.brand:hover { background: #f0c04a; }