/* ---- makisu (Makisu — Sushi counter & Japanese pantry 192) ------------------
   THE CONTAINED SPINE. The reference has exactly two full-bleed elements on the
   whole page — the stage and the dark foot — and everything between them sits
   inside one identical width. The shared showcase breaks that: it runs its
   panels edge to edge and would hand the page a third bleed. So the single
   structural move this theme makes is pulling `.sc-show-grid` back inside the
   same 1080px measure as the strips, the split and the buy grid, and switching
   the checkerboard off so the pantry reads as part of the spine rather than as
   a second wall. Everything else is colour discipline: the ground is crushed
   ice, the mid-tones are wet slate, the ink is near-black, and the one tuna red
   is spent ONLY on price figures and the buy controls — the category labels are
   pushed off the brand colour to muted so nothing else in the page points. */
body.t-makisu {
  background: #f1f4f6;
  color: #2c3539;
  --mk-tuna: #a81f2d;
  --bg-flat: #f1f4f6;
  --surface: #ffffff;
  --surface-2: #e4e9ec;
  --line: #d6dcdf;
  --line-strong: #b6c0c5;
  --heading: #0e1315;
  --text: #2c3539;
  --muted: #6d787d;
  --header-bg: #f1f4f6;
  --radius: 0;
  --shadow: none;
}

/* flat stainless bar, wordmark hard left — nothing glassy, nothing blurred */
body.t-makisu .sf-header, body.t-makisu .sf-head,
body.t-makisu .sf-footer, body.t-makisu .sf-foot, body.t-makisu .sf-cats {
  background: #f1f4f6; border-color: #d6dcdf;
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
body.t-makisu .sf-name { font-weight: 600; font-size: 15px; letter-spacing: 0.2em; text-transform: uppercase; }
body.t-makisu .btn.brand { background: var(--mk-tuna); border-color: var(--mk-tuna); color: #ffffff; box-shadow: none; font-weight: 600; padding: 13px 28px; }
body.t-makisu .btn.brand:hover { background: #86141f; border-color: #86141f; }

/* BLEED ONE — the whole first screen, three plates crossing, copy dead centre */
body.t-makisu .sc-hero { min-height: 100vh; padding: 24px 20px; }
body.t-makisu .sc-hero h1 { font-weight: 500; font-size: clamp(34px, 6.4vw, 76px); line-height: 1.05; letter-spacing: -0.03em; }

body.t-makisu .sc-h2 { color: var(--heading); font-weight: 500; font-size: clamp(21px, 2.7vw, 30px); letter-spacing: 0.005em; margin-bottom: 30px; }

/* square tiles, caption always UNDER the picture: four across on the headingless
   run under the stage, three across on the six-up gallery lower down */
body.t-makisu .sc-strip, body.t-makisu .sc-buygrid { padding: 76px 20px 40px; }
body.t-makisu .sc-strip-row { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
body.t-makisu .sc-strip:not(:has(.sc-h2)) .sc-strip-row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body.t-makisu .sc-strip-label { margin-top: 12px; font-weight: 500; font-size: 13.5px; color: var(--muted); }

/* the page's one asymmetric moment */
body.t-makisu .sc-about-split { gap: 62px; padding: 88px 20px 84px; }

/* the counter pass — four priced lines across one row that fills */
body.t-makisu .sc-buy-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 40px 26px; }

/* THE MOVE — the pantry pulled inside the spine, checkerboard off, so the page
   still ends the day with exactly two full-bleeds */
body.t-makisu .sc-show-grid { max-width: 1080px; margin: 0 auto; padding: 0 20px; gap: 26px; }
body.t-makisu .sc-show-item,
body.t-makisu .sc-show-item:nth-child(4n + 2),
body.t-makisu .sc-show-item:nth-child(4n + 3) { background: var(--surface); border-top: 1px solid var(--line-strong); }
body.t-makisu .sc-show-inner { min-height: 440px; padding: 42px 34px 46px; }
body.t-makisu .sc-show-t { text-transform: none; font-weight: 500; letter-spacing: 0; font-size: clamp(17px, 1.9vw, 22px); }

/* the accent is rationed: labels go muted, only the figures stay tuna */
body.t-makisu .sc-buy-cat, body.t-makisu .sc-show-cat { color: var(--muted); letter-spacing: 0.22em; font-size: 10px; }
body.t-makisu .sc-buy-p, body.t-makisu .sc-show-price { color: var(--mk-tuna); font-weight: 700; }

/* the voice block — narrow, centred, headingless, attribution on its own line */
body.t-makisu .sc-richtext { max-width: 640px; padding: 84px 20px 92px; }
body.t-makisu .sc-richtext:not(:has(.sc-h2)) p { white-space: pre-line; text-align: center; font-size: 19px; line-height: 1.7; color: var(--heading); }

/* BLEED TWO — the dark slate foot, flat colour and nothing behind it */
body.t-makisu .sc-contact-band { background: #161c1f; color: #eef3f5; padding: 88px 0 96px; }
body.t-makisu .sc-contact-band .sc-h2, body.t-makisu .sc-contact-band .sc-contact-sub { color: #eef3f5; }
body.t-makisu .sc-contact-band .sc-field input, body.t-makisu .sc-contact-band .sc-field textarea { background: #1f272b; border-color: #303a3f; color: #eef3f5; }

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

/* NIGHT — the ice goes to wet slate at the bottom of a cold room, the tuna
   lifts a couple of steps so it still carries every price on its own, and the
   foot drops below the page ground so the second bleed stays readable as one. */
html[data-theme="dark"] body.t-makisu {
  background: #0f1315;
  color: #b9c3c7;
  --mk-tuna: #d9505d;
  --bg-flat: #0f1315;
  --surface: #171d20;
  --surface-2: #1d2427;
  --line: #2a3237;
  --line-strong: #3e484e;
  --heading: #eef3f5;
  --text: #b9c3c7;
  --muted: #7e888d;
  --header-bg: #0f1315;
}
html[data-theme="dark"] body.t-makisu .sf-header, html[data-theme="dark"] body.t-makisu .sf-head,
html[data-theme="dark"] body.t-makisu .sf-footer, html[data-theme="dark"] body.t-makisu .sf-foot,
html[data-theme="dark"] body.t-makisu .sf-cats { background: #0f1315; border-color: #2a3237; }
html[data-theme="dark"] body.t-makisu .sc-show-item,
html[data-theme="dark"] body.t-makisu .sc-show-item:nth-child(4n + 2),
html[data-theme="dark"] body.t-makisu .sc-show-item:nth-child(4n + 3) { background: #171d20; border-top-color: #3e484e; }
html[data-theme="dark"] body.t-makisu .sc-contact-band { background: #070a0b; }
html[data-theme="dark"] body.t-makisu .sc-contact-band .sc-field input,
html[data-theme="dark"] body.t-makisu .sc-contact-band .sc-field textarea { background: #141a1d; border-color: #2a3237; }
html[data-theme="dark"] body.t-makisu .btn.brand { color: #140a0c; }
