/* Подключаем шрифты: Alice (для текста) и Inter (для массивных заголовков) */
@import url('https://fonts.googleapis.com/css2?family=Alice&family=Inter:wght@400;500;700;900&display=swap');

:root{
  --bg:#0a0708;
  --ink:#f3ece4;
  --accent:#dc3858;
  --muted:#7a6f6c;
  --grid:rgba(220,56,88,.08);
}
*{box-sizing:border-box;margin:0;padding:0}

html,body{background:var(--bg);color:var(--ink);font-family:"Inter","Helvetica Neue",Arial,sans-serif;overflow-x:hidden}

body.home { overflow: hidden; }

body{
  min-height:100vh;
  position:relative;
  background:
    radial-gradient(ellipse 80% 60% at 50% 110%, rgba(220,56,88,.18), transparent 60%),
    radial-gradient(ellipse 50% 40% at 50% -10%, rgba(220,56,88,.06), transparent 60%),
    var(--bg);
}
body::before{
  content:"";position:fixed;inset:-50%;pointer-events:none;z-index:50;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/></svg>");
  opacity:.18;mix-blend-mode:overlay;
  animation:grain 1.2s steps(2) infinite;
  will-change:transform;
}
@keyframes grain{
  0%{transform:translate(0,0)}
  50%{transform:translate(-1.5%,1%)}
  100%{transform:translate(0,0)}
}
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:49;
  background:repeating-linear-gradient(to bottom,rgba(255,255,255,.015) 0 1px,transparent 1px 3px);
  mix-blend-mode:overlay;
}

/* NAV */
header{
  position:fixed;top:0;left:0;right:0;z-index:70;
  padding:26px 48px;
  display:flex;align-items:center;justify-content:space-between;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  background:linear-gradient(to bottom,rgba(10,7,8,.6),rgba(10,7,8,0));
  transition: padding 0.4s ease;
}

/* ЛОГОТИП В ШАПКЕ */
.brand{
  font-family:"Inter", sans-serif; 
  font-weight: 900; 
  letter-spacing: normal; 
  font-size: 14px; 
  color:var(--ink);
  text-transform:uppercase;
  display:flex;
  align-items: baseline; /* ВАЖНО: Выравниваем текст строго по нижней линии букв */
  gap: 10px; /* Отступ теперь работает только между красной точкой и текстом */
  position: relative;
  z-index: 71;
  text-decoration: none;
  transition: opacity 0.3s ease;
}
.brand:hover {
  opacity: 0.8;
}
.brand .dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 14px var(--accent);
  animation:pulse 2.6s ease-in-out infinite;
  align-self: center; /* ВАЖНО: Красную точку оставляем ровно по центру */
  margin-bottom: 1px; /* Оптическая компенсация для точки */
}

/* Вторая часть логотипа (@anatolypyryaev) */
.brand .lowercase {
  text-transform: lowercase;
  font-weight: 500; 
}

/* Вторая часть логотипа (@anatolypyryaev) */
.brand .lowercase {
  text-transform: lowercase;
  font-weight: 500; 
}

/* Точка-разделитель в логотипе */
.brand .separator {
  margin: 0 8px; /* 8px - это отступ слева и справа. Можете менять эту цифру (например, 6px или 10px) */
  opacity: 0.8; /* Слегка приглушили саму точку, чтобы она смотрелась элегантнее */
}

@keyframes pulse{50%{opacity:.35;transform:scale(.85)}}

.desktop-nav ul{list-style:none;display:flex;gap:38px;}
.desktop-nav a{
  color:var(--ink);text-decoration:none;font-size:12px;letter-spacing:.22em;
  text-transform:uppercase;opacity:.75;position:relative;padding:6px 0;
  transition:opacity .4s ease, color .4s ease, letter-spacing .4s ease;
}
.desktop-nav a::before{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--accent);
  transition:width .45s cubic-bezier(.7,0,.2,1);
}
.desktop-nav a:hover{opacity:1;color:#fff;letter-spacing:.26em}
.desktop-nav a:hover::before{width:100%}

.social-links {
  display: flex;
  gap: 12px;
  align-items: center;
  position: relative;
  z-index: 71;
}
.tg{
  display:inline-flex;align-items:center;gap:10px;
  border:1px solid rgba(243,236,228,.18);padding:9px 16px;border-radius:999px;
  font-size:11px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--ink);text-decoration:none;
  transition:background .4s ease, border-color .4s ease, color .4s ease;
  position: relative;z-index: 71;
}
.tg:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.tg svg{width:13px;height:13px}

.menu-toggle {
  display: none;background: none;border: none;color: var(--ink);
  font-family: "Inter", sans-serif;font-size: 10px;letter-spacing: .2em;
  text-transform: uppercase;cursor: pointer;padding: 10px;
  position: relative;z-index: 71;opacity: 0.8;
}

.mobile-overlay {
  position: fixed;top: 0; left: 0; width: 100%; height: 100vh;
  background: rgba(10, 7, 8, 0.95);backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);z-index: 65;
  display: flex;flex-direction: column;align-items: center;justify-content: center;
  opacity: 0;pointer-events: none;transition: opacity 0.4s ease;
}
.mobile-overlay.active {opacity: 1;pointer-events: auto;}
.mobile-overlay nav {display: flex;flex-direction: column;gap: 30px;text-align: center;}
.mobile-overlay a {
  color: var(--ink);text-decoration: none;
  font-family: "Alice", serif; 
  font-size: 28px;letter-spacing: .05em;text-transform: uppercase;
  opacity: 0;transform: translateY(20px);
  transition: opacity 0.4s ease, transform 0.4s ease, color 0.3s ease;
}
.mobile-overlay.active a {opacity: 1;transform: translateY(0);}
.mobile-overlay.active a:nth-child(1) { transition-delay: 0.1s; }
.mobile-overlay.active a:nth-child(2) { transition-delay: 0.15s; }
.mobile-overlay.active a:nth-child(3) { transition-delay: 0.2s; }
.mobile-overlay.active a:nth-child(4) { transition-delay: 0.25s; }
.mobile-overlay.active a:nth-child(5) { transition-delay: 0.3s; }
.mobile-overlay.active a:nth-child(6) { transition-delay: 0.35s; }
.mobile-overlay a:hover { color: var(--accent); }

/* META corners */
.meta{
  position:fixed;z-index:55;
  font-family: "Alice", serif; 
  font-size:12px;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);
  transition: top 0.4s, bottom 0.4s, left 0.4s, right 0.4s;
}
.meta.tl{top:90px;left:48px}
.meta.tr{top:90px;right:48px;text-align:right}
.meta.bl{bottom:40px;left:48px}
.meta.br{bottom:40px;right:48px;text-align:right}

.meta span{
  color:var(--ink);
  display:block;
  margin-top:6px;
  letter-spacing:.1em;
  font-style:italic;
  text-transform:none;
  font-size:14px;
  opacity:.8;
}
.meta a {
  color: inherit; text-decoration: none;border-bottom: 1px solid rgba(243,236,228,.2);
  padding-bottom: 1px; transition: border-color .3s ease, color .3s ease;
}
.meta a:hover { color: #fff; border-color: var(--accent); }

/* HERO (Главная) */
.hero-main{
  position:relative;height:100vh;width:100%;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.tagline{
  position:absolute;top:48%;left:50%;text-align:center;z-index:5;
  pointer-events:none;will-change:transform;transform:translate(-50%,-50%);
  width: 100%; padding: 0 20px;
}
.eyebrow{
  font-family: "Alice", serif; 
  font-style:italic;font-size:15px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--accent);
  margin-bottom:22px;opacity:0;animation:fade 1.4s .4s forwards;
}
.headline{
  font-family: "Alice", serif; 
  font-weight: 400; 
  font-size:clamp(32px, 4.5vw, 72px);
  line-height:1.02;letter-spacing:-.01em;color:var(--ink);max-width:900px;margin: 0 auto;
  opacity:0;animation:fade 1.6s .8s forwards;
}
.headline em{font-style:italic;color:var(--accent)}
@keyframes fade{to{opacity:1}}

/* =========================================
   ЛОГОТИП И СВЕЧЕНИЕ В ПОДВАЛЕ
   ========================================= */

/* По умолчанию (для внутренних страниц) - логотип скроллится и находится под текстом */
.logo-stage{
  position:relative; /* Встает в поток документа после текста */
  left:50%;
  width:min(140vw,1700px);
  margin-top: 120px; /* Отступ от контента */
  padding-bottom: 60px; /* Отступ от самого низа страницы */
  z-index:3;
  pointer-events:none;
  will-change:transform;
  transform:translateX(-50%);
}
.logo-stage::before{
  content:"";position:absolute;left:50%;bottom:8%;width:80%;height:55%;
  transform:translateX(-50%);
  background:radial-gradient(ellipse at center, rgba(220,56,88,.42), rgba(220,56,88,.16) 40%, transparent 70%);
  filter:blur(50px);z-index:-1;opacity:.95;pointer-events:none;
}
.logo-wrap{position:relative;width:100%;padding-top:24%;}
.logo-wrap img{width:100%;height:auto;display:block;position:absolute;left:0;bottom:0;}
.logo-wrap img.a{opacity:1}
.logo-wrap img.b{opacity:0}

.glow{
  position:absolute; /* Привязывается к низу всей страницы */
  left:50%;
  bottom:0;
  width:90vw;
  height:60vh;
  background:radial-gradient(ellipse at center, rgba(220,56,88,.26), transparent 60%);
  filter:blur(40px);z-index:2;transform:translateX(-50%);pointer-events:none;
}

/* ТОЛЬКО ДЛЯ ГЛАВНОЙ СТРАНИЦЫ - логотип фиксируется на экране */
body.home .logo-stage {
  position: fixed;
  bottom: -6vw;
  margin-top: 0;
  padding-bottom: 0;
}
body.home .glow {
  position: fixed;
  bottom: -20vh;
}

/* СТИЛИ ДЛЯ ВНУТРЕННИХ СТРАНИЦ */
.page-content {
  max-width: 900px;
  margin: 0 auto;
  padding: 140px 20px 100px 20px;
  position: relative;
  z-index: 10;
}
.page-content-wide {
  max-width: 1200px;
  margin: 0 auto;
  padding: 140px 20px 100px 20px;
  position: relative;
  z-index: 10;
}
.page-content h1, .page-content-wide h1 {
  font-family: "Inter", sans-serif; 
  font-weight: 900; 
  font-size: clamp(32px, 4vw, 48px);
  margin-bottom: 40px;
  color: var(--accent);
  letter-spacing: -0.02em; 
}
.page-content p, .page-content-wide p {
  font-family: "Alice", serif; 
  font-size: 20px; 
  line-height: 1.7;
  margin-bottom: 20px;
  opacity: 0.85;
}

/* СТИЛИ ДЛЯ РАЗДЕЛА "СТИХИ" */
.poem-list {
  list-style: none;
  padding-left: 0;
  margin-top: 40px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.poem-list a {
  font-family: "Alice", serif; 
  color: var(--ink);
  text-decoration: none;
  font-size: 22px; 
  opacity: 0.8;
  transition: opacity 0.3s ease, color 0.3s ease, padding-left 0.3s ease;
  display: inline-block;
}
.poem-list a:hover {
  opacity: 1;
  color: var(--accent);
  padding-left: 10px;
}

.poem-text {
  font-family: "Alice", serif; 
  font-size: 22px; 
  line-height: 1.6;
  white-space: pre-wrap;
  opacity: 0.9;
  margin-bottom: 40px;
}
.back-link {
  display: inline-block;
  margin-bottom: 30px;
  font-size: 12px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--muted);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color 0.3s ease, border-color 0.3s ease;
}
.back-link:hover {
  color: var(--ink);
  border-color: var(--accent);
}

/* Блок для центрирования стиха на странице */
.poem-center-block {
  width: fit-content; /* Блок становится шириной с самую длинную строчку стиха */
  margin: 0 auto; /* Центрируем сам блок внутри зоны 1200px */
}
.poem-center-block h1 {
  text-align: center; /* Центрируем заголовок (звездочки) относительно стиха */
}
.poem-center-block .poem-date {
  color: var(--muted);
  font-size: 14px;
  font-style: italic;
  text-align: right; /* Дату красиво прижимаем к правому краю стиха */
  margin-top: -20px;
}

/* =========================================
   СТИЛИ ДЛЯ РАЗДЕЛА "ПЕСНИ" (СЕТКА)
   ========================================= */
.songs-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3 колонки одинаковой ширины */
  gap: 40px; /* Расстояние между карточками */
  margin-top: 40px;
}

.song-card {
  text-decoration: none;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: transform 0.4s ease;
}

.song-card:hover {
  transform: translateY(-8px); /* Карточка слегка "всплывает" при наведении */
}

/* Контейнер для обложки (чтобы она всегда была квадратной) */
.song-cover {
  width: 100%;
  aspect-ratio: 1 / 1; /* Делает блок идеальным квадратом */
  background-color: rgba(243, 236, 228, 0.05); /* Легкий фон, пока картинка грузится */
  border-radius: 4px;
  overflow: hidden;
  position: relative;
}

.song-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* Картинка заполняет квадрат без искажений */
  transition: transform 0.6s ease;
}

.song-card:hover .song-cover img {
  transform: scale(1.05); /* Легкий зум картинки при наведении */
}

/* Текст под обложкой */
.song-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.song-title {
  font-family: "Inter", sans-serif;
  font-weight: 700;
  font-size: 18px;
  color: var(--ink);
  letter-spacing: -0.01em;
}

.song-artist {
  font-family: "Alice", serif;
  font-size: 15px;
  color: var(--muted);
  font-style: italic;
}

/* Фильтр исполнителей */
.artist-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 40px;
}
.filter-btn {
  background: transparent;
  border: 1px solid rgba(243,236,228,.18);
  color: var(--ink);
  padding: 8px 16px;
  border-radius: 999px;
  font-family: "Inter", sans-serif;
  font-size: 12px;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}
.filter-btn:hover {
  border-color: var(--accent);
}
.filter-btn.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

/* Класс для скрытия карточек при фильтрации */
.song-card.hidden {
  display: none;
}

/* =========================================
   СТИЛИ ДЛЯ СТРАНИЦЫ ОДНОЙ ПЕСНИ (СИНГЛА)
   ========================================= */
.single-layout {
  max-width: 600px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.single-cover {
  width: 100%;
  max-width: 400px;
  aspect-ratio: 1 / 1;
  border-radius: 8px;
  box-shadow: 0 20px 50px rgba(0,0,0,0.5); /* Глубокая тень для объема */
  margin-bottom: 30px;
  object-fit: cover;
}
.single-title {
  font-family: "Inter", sans-serif;
  font-weight: 900;
  font-size: clamp(28px, 4vw, 42px);
  color: var(--ink);
  margin-bottom: 8px;
  letter-spacing: -0.02em;
}
.single-artist {
  font-family: "Alice", serif;
  font-size: 18px;
  color: var(--muted);
  font-style: italic;
  margin-bottom: 40px;
}

/* Кнопки стримингов */
.streaming-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-bottom: 60px;
  width: 100%;
}
.stream-btn {
  display: inline-block;
  padding: 10px 20px;
  border: 1px solid rgba(243,236,228,.18);
  border-radius: 999px;
  color: var(--ink);
  text-decoration: none;
  font-family: "Inter", sans-serif;
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
  transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}
.stream-btn:hover {
  border-color: var(--accent);
  background: var(--accent);
  color: #fff;
}

/* Блок с текстом песни */
.single-lyrics-wrapper {
  width: 100%;
  text-align: left; /* Текст по левому краю */
}
.single-lyrics-label {
  font-family: "Inter", sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 20px;
  border-bottom: 1px solid rgba(243,236,228,.1);
  padding-bottom: 10px;
}

/* =========================================
   СТИЛИ ДЛЯ РАЗДЕЛА "ВИДЕО"
   ========================================= */
.video-section-title {
  font-family: "Inter", sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 60px 0 20px 0;
  border-bottom: 1px solid rgba(243,236,228,.1);
  padding-bottom: 10px;
}

/* Сетка для горизонтальных видео (16:9) */
.video-grid-horizontal {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 2 видео в ряд */
  gap: 40px;
}

/* Сетка для вертикальных видео (9:16) */
.video-grid-vertical {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 4 видео в ряд */
  gap: 30px;
}

/* Общие стили для карточки видео */
.video-card {
  text-decoration: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: transform 0.4s ease;
}
.video-card:hover {
  transform: translateY(-6px);
}

/* Контейнеры для миниатюр с правильными пропорциями */
.video-thumb {
  width: 100%;
  background-color: rgba(243, 236, 228, 0.05);
  border-radius: 6px;
  overflow: hidden;
  position: relative;
}
.video-thumb.horizontal {
  aspect-ratio: 16 / 9;
}
.video-thumb.vertical {
  aspect-ratio: 9 / 16;
}

.video-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease, opacity 0.3s ease;
}
.video-card:hover .video-thumb img {
  transform: scale(1.03);
  opacity: 0.8;
}

/* Иконка Play поверх миниатюры */
.play-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 48px;
  height: 48px;
  background: rgba(10, 7, 8, 0.6);
  backdrop-filter: blur(4px);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  opacity: 0;
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.video-card:hover .play-icon {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1.1);
}
.play-icon svg {
  width: 20px;
  height: 20px;
  margin-left: 4px; /* Центрируем треугольник визуально */
}

/* Текст под видео */
.video-title {
  font-family: "Inter", sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: var(--ink);
  line-height: 1.4;
}
.video-date {
  font-family: "Alice", serif;
  font-size: 14px;
  color: var(--muted);
  font-style: italic;
}

/* =========================================
   СТИЛИ ДЛЯ СТРАНИЦЫ ОДНОГО ВИДЕО
   ========================================= */
.single-video-layout {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

/* Обложка видео (Ограничили размер как у песен) */
.single-video-cover {
  width: 100%;
  max-width: 400px; /* Ограничение ширины, чтобы не была огромной */
  aspect-ratio: 16 / 9;
  border-radius: 8px;
  box-shadow: 0 20px 50px rgba(0,0,0,0.5);
  margin-bottom: 30px;
  object-fit: cover;
}

.single-video-title {
  font-family: "Inter", sans-serif;
  font-weight: 900;
  font-size: clamp(24px, 4vw, 36px);
  color: var(--ink);
  margin-bottom: 12px;
  line-height: 1.2;
}

.single-video-meta {
  font-family: "Alice", serif;
  font-size: 16px;
  color: var(--muted);
  font-style: italic;
  margin-bottom: 60px; /* Увеличенный отступ перед кнопками */
}

/* Описание под видео */
.video-description {
  width: 100%;
  max-width: 600px; /* Ограничили ширину текста для удобства чтения */
  text-align: left;
  font-family: "Alice", serif;
  font-size: 18px;
  line-height: 1.7;
  opacity: 0.9;
  margin-bottom: 40px;
}

/* =========================================
   СТИЛИ ДЛЯ СТРАНИЦЫ "ПОЛИТИКА"
   ========================================= */
.policy-content {
  max-width: 800px;
  margin: 0 auto;
  padding: 140px 20px 100px 20px;
  position: relative;
  z-index: 10;
}
.policy-content h1 {
  font-family: "Inter", sans-serif;
  font-weight: 900;
  font-size: clamp(28px, 4vw, 42px);
  margin-bottom: 40px;
  color: var(--accent);
  letter-spacing: -0.02em;
}
.policy-content h2 {
  font-family: "Inter", sans-serif;
  font-weight: 700;
  font-size: 20px;
  margin: 40px 0 15px 0;
  color: var(--ink);
}
.policy-content p, .policy-content li {
  font-family: "Inter", sans-serif; /* Для документов лучше использовать шрифт без засечек */
  font-size: 15px;
  line-height: 1.6;
  margin-bottom: 15px;
  opacity: 0.8;
}
.policy-content ul {
  margin-left: 20px;
  margin-bottom: 20px;
}
.policy-content a {
  color: var(--accent);
  text-decoration: none;
  border-bottom: 1px solid rgba(220,56,88,.3);
  transition: border-color 0.3s ease, color 0.3s ease;
}
.policy-content a:hover {
  border-color: var(--accent);
  color: #fff;
}

/* =========================================
   ПЛАШКА COOKIES
   ========================================= */
.cookie-banner {
  position: fixed;
  bottom: -100px; /* Спрятана за экраном по умолчанию */
  left: 50%;
  transform: translateX(-50%);
  background: rgba(10, 7, 8, 0.85);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(243,236,228,.1);
  padding: 16px 24px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 20px;
  z-index: 9999;
  opacity: 0;
  transition: bottom 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.5s ease;
  width: max-content;
  max-width: 90vw;
}
.cookie-banner.show {
  bottom: 30px; /* Выезжает снизу */
  opacity: 1;
}
.cookie-text {
  font-family: "Inter", sans-serif;
  font-size: 13px;
  color: var(--ink);
  opacity: 0.8;
  line-height: 1.4;
}
.cookie-text a {
  color: var(--accent);
  text-decoration: none;
}
.cookie-btn {
  background: var(--accent);
  color: #fff;
  border: none;
  padding: 8px 16px;
  border-radius: 4px;
  font-family: "Inter", sans-serif;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: .05em;
  transition: opacity 0.3s ease;
  white-space: nowrap;
}
.cookie-btn:hover {
  opacity: 0.8;
}

/* Адаптив для плашки на мобильных */
@media (max-width: 480px) {
  .cookie-banner {
    flex-direction: column;
    gap: 12px;
    text-align: center;
    padding: 16px;
    bottom: -150px;
  }
  .cookie-banner.show {
    bottom: 20px;
  }
  .cookie-btn {
    width: 100%;
  }
}

/* =========================================
   СТИЛИ ДЛЯ СТРАНИЦ-ЗАГЛУШЕК (В РАЗРАБОТКЕ)
   ========================================= */
.coming-soon-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
  text-align: center;
  position: relative;
  z-index: 10;
  padding: 0 20px;
}
.coming-soon-title {
  font-family: "Inter", sans-serif;
  font-weight: 900;
  font-size: clamp(40px, 8vw, 80px);
  color: var(--ink);
  line-height: 1;
  margin-bottom: 20px;
  letter-spacing: -0.02em;
}
.coming-soon-text {
  font-family: "Alice", serif;
  font-size: clamp(18px, 3vw, 24px);
  color: var(--muted);
  margin-bottom: 40px;
  max-width: 500px;
}

/* АДАПТИВНОСТЬ */
@media (max-width: 1536px) {
  header { padding: 24px 36px; }
  .meta.tl { left: 36px; } .meta.tr { right: 36px; }
  .meta.bl { left: 36px; } .meta.br { right: 36px; }
}
@media (max-width: 1366px) {
  header { padding: 20px 28px; }
  .desktop-nav ul { gap: 28px; }
  .meta.tl { left: 28px; } .meta.tr { right: 28px; }
  .meta.bl { left: 28px; bottom: 32px; } .meta.br { right: 28px; bottom: 32px; }
}
@media (max-width: 1024px) {
  header { padding: 18px 24px; }
  .desktop-nav ul { gap: 20px; }
  .desktop-nav a { font-size: 11px; }
  .meta.tl, .meta.tr { top: 80px; }
  .meta.tl { left: 24px; } .meta.tr { right: 24px; }
  .meta.bl { left: 24px; bottom: 24px; } .meta.br { right: 24px; bottom: 24px; }
  .logo-stage { width: 150vw; bottom: -5vw; }
  .songs-grid { grid-template-columns: repeat(2, 1fr); gap: 30px; } /* 2 в ряд на планшетах */
  .video-grid-vertical { grid-template-columns: repeat(3, 1fr); gap: 20px; } /* 3 вертикальных на планшете */
}
@media (max-width: 768px) {
  header { padding: 16px 20px; }
  .desktop-nav { display: none; }
  .menu-toggle { display: block; }
  .meta.tl, .meta.tr { top: 70px; left: 20px; right: 20px; font-size: 10px; }
  .meta.bl, .meta.br { bottom: 20px; left: 20px; right: 20px; font-size: 10px; }
  .tagline { top: 42%; }
  .headline { font-size: clamp(26px, 6vw, 42px); }
  .logo-stage { width: 180vw; bottom: -8vw; }
  .songs-grid { grid-template-columns: 1fr; gap: 40px; } /* 1 в ряд на телефонах */
  .video-grid-horizontal { grid-template-columns: 1fr; gap: 30px; } /* 1 горизонтальное на телефоне */
  .video-grid-vertical { grid-template-columns: repeat(2, 1fr); gap: 16px; } /* 2 вертикальных на телефоне */
}
@media (max-width: 480px) {
  header { padding: 14px 16px; }
  .brand { font-size: 11px; gap: 6px; letter-spacing: normal; }
  .brand .lowercase { font-size: 14px; }
  .brand .dot { width: 5px; height: 5px; }
  .tg { padding: 8px; }
  .tg span { display: none; }
  .tg svg { width: 15px; height: 15px; }
  .meta.tl, .meta.tr { top: 65px; left: 16px; right: 16px; font-size: 9px; }
  .meta.bl, .meta.br { bottom: 16px; left: 16px; right: 16px; font-size: 9px; }
  .meta span { font-size: 10px; margin-top: 4px; }
  .tagline { top: 40%; }
  .eyebrow { font-size: 11px; margin-bottom: 16px; }
  .headline { font-size: clamp(24px, 7.5vw, 32px); }
  .logo-stage { width: 220vw; bottom: -10vw; }
}