/* === ЗАМЕТНЫЙ, НО ЛЁГКИЙ АНИМИРОВАННЫЙ ФОН === */

body {
  margin: 0;
  padding: 0;
  background-color: #141414; /* Резервный цвет */
}

/* 1. Основной градиент (контрастные оттенки, крупный размер для заметного движения) */
body::before {
  content: '';
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: linear-gradient(
    135deg,
    #0f0f0f 0%,
    #2a2a2a 35%,
    #1a1a1a 50%,
    #333333 65%,
    #121212 100%
  );
  background-size: 300% 300%; /* Чем больше размер, тем заметнее сдвиг */
  animation: gradientShift 10s ease-in-out infinite;
  z-index: -2;
  will-change: background-position;
}

/* 2. Плывущий световой акцент (делает движение "живым") */
body::after {
  content: '';
  position: fixed;
  top: -40%; left: -40%;
  width: 180%; height: 180%;
  background: radial-gradient(
    circle at 50% 50%,
    rgba(227, 220, 200, 0.18) 0%, /* Чуть ярче, чтобы было видно */
    transparent 55%
  );
  animation: lightDrift 12s ease-in-out infinite alternate;
  z-index: -1;
  will-change: transform;
  pointer-events: none;
}

/* Анимация градиента (быстрее и чётче) */
@keyframes gradientShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* Анимация светового пятна (плавно перемещается по экрану) */
@keyframes lightDrift {
  0%   { transform: translate(0, 0) scale(1); }
  100% { transform: translate(40px, -40px) scale(1.15); }
}

/* === ПРИМЕНЯЕМ КО ВСЕМ БЛОКАМ TILDA === */
.tilda-block,
.tilda-container,
[data-tilda-block],
.tilda-cover,
.tilda-bgimage,
.t-zero-block,
.t396__artboard,
.t-rec {
  background: transparent !important;
}

/* === ОПТИМИЗАЦИЯ ПОД УСТРОЙСТВА === */
@media (max-width: 1024px) {
  body::before { animation-duration: 14s; background-size: 250% 250%; }
  body::after  { animation-duration: 16s; opacity: 0.8; }
}

@media (max-width: 768px) {
  body::before { animation-duration: 18s; }
  body::after  { opacity: 0.5; }
}

/* На слабых телефонах фон статичный (0% нагрузки) */
@media (max-width: 480px) {
  body::before {
    animation: none;
    background-size: 100% 100%;
    background: linear-gradient(135deg, #141414 0%, #262626 100%);
  }
  body::after { display: none; }
}
/* ==========================================
   1. УВЕЛИЧЕННЫЕ РАЗМЕРЫ ШРИФТОВ
   ========================================== */
body, .t-records, .t-records *, .t396__artboard, .t396__elem, .t396__elem * {
  font-family: 'Outfit', 'Syne', sans-serif !important;
  font-size: 18px !important; /* Базовый текст крупнее */
  line-height: 1.65 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6, .t-title, .t-heading, .t396__elem .t-title {
  font-size: 3.4rem !important; /* ~54px */
  line-height: 1.15 !important;
  font-weight: 700 !important;
}

.t-text, .t-descr, .t-small, .t-label, .t396__elem .t-text, .t396__elem .t-descr {
  font-size: 1.25rem !important; /* ~20px */
  line-height: 1.6 !important;
  font-weight: 400 !important;
}

.t-btn, .t-submit, .t-menu__link, .t-menu__item {
  font-size: 1.15rem !important;
  font-weight: 600 !important;
}

/* ==========================================
   2. ЭФФЕКТ «БАБЛ» (Bubble Design System)
   ========================================== */