/* ==========================================================================
   Sushi Market — Base: reset, типографика, лэйаут
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 64px); }
html, body { overflow-x: clip; }
a, button, label, input, select, textarea { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
body.has-cart-bar { padding-bottom: calc(var(--cart-bar-h) + var(--safe-bottom)); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }

body {
  margin: 0;
  min-height: 100vh; min-height: 100dvh;
  display: flex; flex-direction: column;
  font-family: var(--font-body);
  font-size: var(--fs-md);
  line-height: var(--lh-base);
  color: var(--text-primary);
  background: var(--bg-page);
  -webkit-font-smoothing: antialiased;
}

img, svg, video { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
ul, ol { margin: 0; padding: 0; list-style: none; }

:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-sm); }

/* ---------- Заголовки ---------- */
h1, h2, h3, h4 {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: 600;
  line-height: var(--lh-tight);
  letter-spacing: -0.01em;
}
.h1 { font-size: clamp(var(--fs-2xl), 5vw, var(--fs-4xl)); font-weight: 700; }
.h2 { font-size: clamp(var(--fs-xl), 3.4vw, var(--fs-3xl)); }
.h3 { font-size: var(--fs-xl); }
.h4 { font-size: var(--fs-lg); }

p { margin: 0 0 var(--space-4); }
.text-sm  { font-size: var(--fs-sm); }
.text-xs  { font-size: var(--fs-xs); }
.text-lg  { font-size: var(--fs-lg); }
.text-muted  { color: var(--text-secondary); }
.text-accent { color: var(--text-accent); }
.text-center { text-align: center; }
.fw-600 { font-weight: 600; }
.fw-700 { font-weight: 700; }
.fw-800 { font-weight: 800; }

/* ---------- Лэйаут ---------- */
.container {
  width: 100%;
  max-width: calc(var(--container-max) + var(--gutter) * 2);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.section { padding-block: var(--space-5); }
@media (min-width: 768px) { .section { padding-block: var(--space-7); } }
.section__head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: var(--space-4); margin-bottom: var(--space-5);
}

.stack > * + * { margin-top: var(--space-4); }
.row   { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }

/* Сетка карточек товаров: 2 → 3 → 4 колонки */
.grid-products {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-2);
}
@media (min-width: 768px)  { .grid-products { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); } }
@media (min-width: 1024px) { .grid-products { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-5); } }

.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}

/* Подвал всегда внизу, даже на коротких страницах (корзина, заказ) */
body > main { flex: 1 0 auto; width: 100%; }
body > .footer { flex: none; }