/* ============================================
   БАННЫЕ ЧАНЫ ИВАНА — ДИЗАЙН-СИСТЕМА v1.0
   Этап 1: Базовые переменные и типографика
   ============================================ */

/* --- ПОДКЛЮЧЕНИЕ ШРИФТОВ --- */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400&family=Jost:wght@300;400;500&display=swap');

/* --- ЦВЕТОВЫЕ ТОКЕНЫ --- */
:root {
  --charcoal:  #1E2820; /* Уголь — текст, хедер */
  --forest:    #3D5C3D; /* Лес — тёмные блоки */
  --moss:      #5B7A5E; /* Мох — лейблы, линии */
  --larch:     #8B6F3A; /* Лиственница — тёплые акценты */
  --gold:      #C4A35A; /* Золото — CTA, hover ★ ГЛАВНЫЙ */
  --birch:     #D4C4A0; /* Берёза — разделители, плашки */
  --cream:     #F0E8D0; /* Крем — фон светлых секций */

  /* --- ШРИФТЫ --- */
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'Jost', sans-serif;

  /* --- ОТСТУПЫ (8px сетка) --- */
  --space-xs:  8px;
  --space-s:   16px;
  --space-m:   32px;
  --space-l:   64px;
  --space-xl:  96px;
  --space-xxl: 128px;

  /* --- РАДИУСЫ --- */
  --radius-s: 4px;
  --radius-m: 8px;
  --radius-l: 16px;

  /* --- ТЕНИ --- */
  --shadow-soft: 0 4px 32px rgba(61, 92, 61, 0.12);
  --shadow-card: 0 8px 48px rgba(30, 40, 32, 0.15);
}

/* --- БАЗОВЫЕ СТИЛИ --- */
body {
  font-family: var(--font-body);
  color: var(--charcoal);
  background: var(--cream);
  -webkit-font-smoothing: antialiased;
}

/* --- ТИПОГРАФИКА ЗАГОЛОВКОВ --- */
.t-zero h1, .t-zero h2, .t-zero h3 {
  font-family: var(--font-display);
  font-weight: 400;
  line-height: 1.1;
}

/* Display (Hero) */
.tn-display {
  font-family: var(--font-display);
  font-size: clamp(48px, 7vw, 96px);
  font-weight: 300;
  line-height: 0.95;
  letter-spacing: -0.02em;
}

/* H1 — главные заголовки */
.tn-h1 {
  font-family: var(--font-display);
  font-size: clamp(36px, 5vw, 64px);
  font-weight: 400;
  line-height: 1.05;
}

/* H2 — заголовки секций */
.tn-h2 {
  font-family: var(--font-display);
  font-size: clamp(28px, 3.5vw, 42px);
  font-weight: 400;
  line-height: 1.15;
}

/* Лейбл-подпись (CAPS) */
.tn-label {
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--moss);
}

/* --- CTA-КНОПКА (PRIMARY) --- */
.btn-bchi-primary {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--gold);
  color: var(--charcoal);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 16px 36px;
  border-radius: var(--radius-s);
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.25s, transform 0.2s, box-shadow 0.25s;
  box-shadow: 0 4px 20px rgba(196, 163, 90, 0.35);
}

.btn-bchi-primary:hover {
  background: #D4B26A;
  transform: translateY(-2px);
  box-shadow: 0 8px 30px rgba(196, 163, 90, 0.45);
}

/* --- CTA-КНОПКА (SECONDARY) --- */
.btn-bchi-secondary {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: transparent;
  color: var(--charcoal);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 15px 35px;
  border-radius: var(--radius-s);
  border: 1px solid var(--charcoal);
  cursor: pointer;
  text-decoration: none;
  transition: all 0.25s;
}

.btn-bchi-secondary:hover {
  background: var(--charcoal);
  color: var(--cream);
}

/* --- GHOST (на тёмном фоне) --- */
.btn-bchi-ghost {
  display: inline-flex;
  align-items: center;
  background: transparent;
  color: var(--cream);
  font-family: var(--font-body);
  font-size: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 15px 35px;
  border-radius: var(--radius-s);
  border: 1px solid rgba(240, 232, 208, 0.4);
  cursor: pointer;
  text-decoration: none;
  transition: all 0.25s;
}

.btn-bchi-ghost:hover {
  border-color: var(--gold);
  color: var(--gold);
}

/* --- РАЗДЕЛИТЕЛЬ-ЛИНИЯ --- */
.divider-bchi {
  height: 1px;
  background: linear-gradient(to right, transparent, var(--birch), transparent);
  margin: var(--space-xl) 0;
}

/* --- ОВЕРЛЕЙ Hero (стандартный) --- */
.overlay-hero {
  background: linear-gradient(
    to top,
    rgba(30, 40, 32, 0.80) 0%,
    rgba(30, 40, 32, 0.30) 50%,
    rgba(30, 40, 32, 0.10) 100%
  );
}

/* --- СКРЫТЬ СТАНДАРТНЫЕ ЭЛЕМЕНТЫ TILDA --- */
.t-feed__title { font-family: var(--font-display) !important; }
.t-btn { letter-spacing: 0.1em !important; }