/* Базовые стили: reset, типографика, каркас, хедер/футер */
* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }
html[data-motion='reduced'] * { transition: none !important; animation: none !important; }

body {
  background-color: var(--bg);
  /* Текстура брёвен под лёгкой вуалью (как canvas в веб-аппе) */
  background-image: linear-gradient(var(--wood-veil), var(--wood-veil)), var(--wood-img);
  background-size: cover;
  background-position: center;
  color: var(--text);
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
.sr-only {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}

/* ── Типографика ─────────────────────────────────────────── */
h1, h2, h3, .caps {
  font-family: var(--font-head);
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 4px;
  line-height: 1.25;
}
h1 { font-size: clamp(28px, 3vw, 44px); letter-spacing: 8px; }
h2 { font-size: clamp(20px, 2vw, 28px); }
h3 { font-size: 16px; letter-spacing: 3px; }
.eyebrow { font-size: 10px; letter-spacing: 4px; text-transform: uppercase; color: var(--muted); }
.quote { font-style: italic; font-size: 16px; line-height: 1.7; letter-spacing: 0.3px; }
.muted { color: var(--muted); }
.small { font-size: 12px; }
.center { text-align: center; }

/* ── Каркас ──────────────────────────────────────────────── */
.wrap { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 40px; }
.section { padding: 72px 0; }
.section + .section { border-top: 1px solid var(--line); }
.stack > * + * { margin-top: var(--gap); }

/* ── Хедер ───────────────────────────────────────────────── */
.site-header {
  position: sticky; top: 0; z-index: 50;
  backdrop-filter: blur(14px);
  background: color-mix(in srgb, var(--bg) 62%, transparent);
  border-bottom: 1px solid var(--line);
}
.site-header__row { display: flex; align-items: center; gap: 24px; height: 76px; }
.logo { display: flex; align-items: center; gap: 12px; }
.logo__mark { height: 44px; width: 44px; border-radius: 10px; }
.logo__text { display: flex; flex-direction: column; line-height: 1.15; }
.logo__line1 { font-family: var(--font-head); font-size: 17px; letter-spacing: 5px; text-transform: uppercase; color: var(--accent-ui); }
.logo__line2 { font-family: var(--font-body); font-size: 8px; font-weight: 700; letter-spacing: 6px; text-transform: uppercase; color: var(--muted); }
.site-nav { display: flex; gap: 22px; margin-left: auto; }
.site-nav a { font-size: 11px; letter-spacing: 3px; text-transform: uppercase; color: var(--muted); transition: color var(--dur); }
.site-nav a:hover, .site-nav a[aria-current='page'] { color: var(--accent-ui); }
.theme-toggle {
  border: 1px solid var(--line); background: var(--surface); color: var(--accent-ui);
  border-radius: 999px; padding: 8px 14px; font-size: 11px; letter-spacing: 2px; text-transform: uppercase;
}

/* ── Футер ───────────────────────────────────────────────── */
.site-footer { border-top: 1px solid var(--line); padding: 40px 0; margin-top: 40px; }
.site-footer__row { display: flex; gap: 24px; align-items: center; flex-wrap: wrap; }
.site-footer a:hover { color: var(--accent); }

/* ── Главная: единый «стеклянный» блок (текст + кнопки) ─── */
body.is-landing { min-height: 100vh; display: flex; flex-direction: column; }
body.is-landing main.hero { flex: 1; min-height: calc(100vh - 76px); align-items: flex-end; padding-bottom: 100px; }
/* Обёртка и панель — поверх слоя градиента (иначе плашка «уходит под него» по глубине) */
.hero > .wrap { position: relative; z-index: 2; }

.hero__panel {
  position: relative; z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 440px);
  background: var(--panel-bg);
  backdrop-filter: blur(18px) saturate(120%);
  -webkit-backdrop-filter: blur(18px) saturate(120%);
  border: 1px solid color-mix(in srgb, var(--accent-ui) 30%, var(--line));
  border-radius: 28px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
  overflow: hidden;
}
/* Левая колонка — редакционный блок: ритм, кегли, вертикальное центрирование */
.hero__text {
  padding: 48px 56px;
  display: flex; flex-direction: column; justify-content: center;
}
.hero__eyebrow { color: var(--accent-ui); font-size: 11px; letter-spacing: 3px; margin-bottom: 20px; }
.hero__title { margin: 0; font-size: clamp(34px, 3.4vw, 52px); line-height: 1.02; }
.hero__rule { display: block; width: 72px; height: 1px; background: color-mix(in srgb, var(--accent-ui) 75%, transparent); margin: 22px 0; }
.hero__menu {
  margin: 0; max-width: none; padding: 34px 38px;
  border-left: 1px solid var(--line); align-self: stretch; justify-content: center;
}
/* Светлая тема: у кнопок заливка остаётся lightAccent (коричневый), иконки — олива */
html[data-theme='light'] .hero__menu .menu__main,
html[data-theme='light'] .hero__menu .menu__side {
  background: color-mix(in srgb, var(--accent) 12%, transparent);
}
html[data-theme='light'] .menu__ico,
html[data-theme='light'] .menu__side { color: var(--accent-ui); }
.hero__eyebrow.is-justified { display: flex; justify-content: space-between; letter-spacing: 0; }
.hero__eyebrow.is-justified span { letter-spacing: 0; }
@media (max-width: 1100px) {
  .hero__panel { grid-template-columns: 1fr; }
  .hero__menu { border-left: 0; border-top: 1px solid var(--line); padding: 26px 30px; }
}

/* Внутренние страницы: контент занимает экран, футер — ниже фолда (появляется после скролла) */
body:not(.is-landing) .section:first-of-type { min-height: calc(100vh - 76px); }