/* ============================================================
   ФОГЕЛЬ — дизайн-система v2 «Хроматический след»
   Тёмная фото-центричная версия (редизайн 19.08.2026).
   Референс подачи — evavlasova.ru; палитра выращена из живого
   лого артиста: белый мазок с красно-циановым 3D-сдвигом.
   Единственный источник стилей компонентов v2.
   ============================================================ */

/* Sofia Sans Extra Condensed — акцидентный шрифт заголовков.
   Вариативный (вес 100–1000), OFL, файлы локально в makety/src/fonts/. */
@font-face{
  font-family:'Sofia Sans Extra Condensed';
  font-style:normal;
  font-weight:100 1000;
  font-display:block;
  src:url(fonts/SofiaSansExtraCondensed-cyr.woff2) format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:'Sofia Sans Extra Condensed';
  font-style:normal;
  font-weight:100 1000;
  font-display:block;
  src:url(fonts/SofiaSansExtraCondensed-lat.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+2000-206F,U+2122;
}

:root{
  /* палитра */
  --v2-bg:#0B0B10;            /* фон — чернила с сине-фиолетовым подтоном */
  --v2-text:#F2F1F5;          /* основной текст, 17.5:1 AAA */
  --v2-mute:#A7A5B4;          /* приглушённый текст, 7.5:1 на реальных фонах (стекло/фото) */
  --v2-red:#FF4655;           /* акцент — красный из хроматического сдвига лого */
  --v2-cyan:#4CD9E6;          /* микроакцент — циан из того же сдвига */
  --v2-line:rgba(242,241,245,.10);  /* тонкие обводки и разделители */

  /* стекло */
  --v2-glass-bg:rgba(21,21,28,.55);
  --v2-glass-blur:blur(24px) saturate(120%);

  /* геометрия */
  --v2-r:20px;                /* скругление панелей и карточек */
  --v2-seam:300px;            /* глубина шва: вертикальный фейд фото-подложки */
  --v2-seam-out:160px;        /* вынос фото-подложки за границы секции */
}

/* ---------- типографика ---------- */

/* заголовки-«высотки»: сверхузкий капс с воздухом */
.v2-display{
  font-family:'Sofia Sans Extra Condensed','Golos Text',sans-serif;
  font-weight:840;
  text-transform:uppercase;
  letter-spacing:.04em;
  line-height:.92;
  color:var(--v2-text);
}

/* фирменный хроматический след — только у главного «ФОГЕЛЬ» */
.v2-chroma{
  text-shadow:-3px 0 rgba(255,70,85,.38), 3px 0 rgba(76,217,230,.32);
}

/* служебная строка: мелкий капс с большой разрядкой */
.v2-eyebrow{
  font-family:'Golos Text',sans-serif;
  font-weight:600;
  font-size:11px;
  letter-spacing:.2em;word-spacing:.1em; /* длинный капс разваливался: межсловный пробел тонул */
  text-transform:uppercase;
  color:var(--v2-mute);
}

/* ---------- стекло ---------- */
/* Стекло = blur + ровная обводка + тень + фото/свечение позади.
   ВНИМАНИЕ: внутренний градиент-блик ЗАПРЕЩЁН — рисует светлую полосу
   под верхней кромкой («жирная обводка») и несимметрично красит
   1px-линии обводки (квирк Chrome, доказано стендом 26.08). */
.v2-glass{
  background:var(--v2-glass-bg);
  -webkit-backdrop-filter:var(--v2-glass-blur);
  backdrop-filter:var(--v2-glass-blur);
  border:1px solid rgba(242,241,245,.14); /* ровная по всему контуру */
  border-radius:var(--v2-r);
  box-shadow:0 24px 60px rgba(0,0,0,.45);
}

/* ---------- кнопки: пилюли ---------- */

.v2-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-family:'Golos Text',sans-serif;
  font-weight:600;
  font-size:13px;
  letter-spacing:.14em;
  text-indent:.14em; /* центровка надписи */
  text-transform:uppercase;
  text-decoration:none;
  border-radius:999px;
  padding:17px 34px;
  transition:background .22s ease,color .22s ease,border-color .22s ease,box-shadow .22s ease;
  white-space:nowrap;
}
.v2-btn--primary{
  background:var(--v2-red);
  color:#FFFFFF;
  box-shadow:0 10px 40px rgba(255,70,85,.30); /* CTA светится */
}
.v2-btn--primary:hover{
  background:#E63344;
  box-shadow:0 8px 40px rgba(255,70,85,.42);
}
.v2-btn--glass{
  background:var(--v2-glass-bg);
  -webkit-backdrop-filter:var(--v2-glass-blur);
  backdrop-filter:var(--v2-glass-blur);
  border:1px solid rgba(242,241,245,.16); /* ровная по всему контуру */
  color:var(--v2-text);
}
.v2-btn--glass:hover{
  border-color:rgba(76,217,230,.55);
  color:var(--v2-cyan);
}

/* маленькая пилюля («Билеты», «Смотреть») */
.v2-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-family:'Golos Text',sans-serif;
  font-weight:600;
  font-size:13px;
  letter-spacing:.14em;
  text-indent:.14em; /* хвост разрядки уводил надпись влево от центра */
  text-transform:uppercase;
  text-decoration:none;
  border-radius:999px;
  padding:12px 26px;
  color:#FF6B77; /* чистый красный давал 4.2:1 при 12px */
  border:1px solid rgba(255,70,85,.5);
  background:transparent;
  transition:background .22s ease,color .22s ease,border-color .22s ease;
  white-space:nowrap;
}
.v2-pill:hover{
  background:var(--v2-red);
  border-color:var(--v2-red);
  color:#FFFFFF;
}

/* пилюля трека/соцсети: стекло, ховер — циановая кромка */
.v2-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-family:'Golos Text',sans-serif;
  font-weight:600;
  font-size:13px;
  letter-spacing:normal;
  text-decoration:none;
  border-radius:999px;
  padding:12px 24px;
  color:var(--v2-text);
  background:var(--v2-glass-bg);
  -webkit-backdrop-filter:var(--v2-glass-blur);
  backdrop-filter:var(--v2-glass-blur);
  border:1px solid rgba(242,241,245,.16); /* ровная по всему контуру: блик на мелком читается браком */
  transition:border-color .22s ease,color .22s ease;
  white-space:nowrap;
}
.v2-chip:hover{
  border-color:rgba(76,217,230,.55);
  color:var(--v2-cyan);
}

/* ---------- карточка-статистика (вместо квадратных вставок) ---------- */

.v2-stat{
  display:block;
  text-decoration:none;
  padding:25px 32px 33px; /* оптический центр пары цифра+подпись */
  background:var(--v2-glass-bg);
  -webkit-backdrop-filter:var(--v2-glass-blur);
  backdrop-filter:var(--v2-glass-blur);
  border:1px solid rgba(242,241,245,.14); /* ровная по всему контуру */
  border-radius:var(--v2-r);
  box-shadow:0 16px 44px rgba(0,0,0,.4);
  transition:border-color .22s ease,transform .22s ease;
}
.v2-stat:hover{
  border-color:rgba(76,217,230,.5); /* циан = карточки; красный только у CTA */
  transform:translateY(-3px);
}
.v2-stat-num{
  font-family:'Sofia Sans Extra Condensed','Golos Text',sans-serif;
  font-weight:840;
  font-size:58px;
  line-height:1;
  color:var(--v2-text);
  margin-bottom:12px;
}

/* ---------- строка афиши ---------- */

.v2-row{
  display:grid;
  grid-template-columns:170px 1fr 190px;
  gap:32px;
  align-items:center;
  padding:24px 40px;
  text-decoration:none;
  transition:background .22s ease;
}
.v2-row + .v2-row{border-top:1px solid var(--v2-line)}
.v2-row:hover{background:rgba(242,241,245,.045)}
.v2-row-date{
  font-family:'Sofia Sans Extra Condensed','Golos Text',sans-serif;
  font-weight:760;
  font-size:30px;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--v2-text);
}
.v2-row-city{
  font-family:'Sofia Sans Extra Condensed','Golos Text',sans-serif;
  font-weight:760;
  font-size:30px;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--v2-text);
}
.v2-row-cap{
  font-family:'Golos Text',sans-serif;
  font-weight:600;
  font-size:11px;
  letter-spacing:.16em;word-spacing:.08em;
  text-transform:uppercase;
  color:var(--v2-mute);
  margin-top:12px;
}

/* ---------- фоновое свечение (чтобы стекло жило) ---------- */

/* Свечение — свет, а не фигура. Профиль — квазигауссов спад из 8
   остановок с хвостом до самой кромки бокса: контура эллипса нет
   (старый обрыв на 72% читался границей пятна). Пики ниже прежних
   (.27/.21 -> .24/.13) — пятна не давят на фото. z-index:1 поднимает
   пятно над фото-подложками СОСЕДНИХ секций: вынос подложки
   (--v2-seam-out) больше не режет чужой хвост по прямой кромке.
   Правила прежние: красный у левого края, циан у правого (как сдвиг
   каналов лого); пик — за краем/фото/стеклом; форма — лежачий эллипс. */
/* Пятна больше и максимально размыты (blur поверх квазигауссова
   профиля); координаты в разметке — через calc(50% - Npx): пятно
   привязано к ЦЕНТРУ композиции, а не к краю вьюпорта — на широких
   мониторах не уползает к кромкам экрана. */
.v2-glow{
  position:absolute;
  pointer-events:none;
  z-index:1;
  background-repeat:no-repeat;
  background-size:100% 100%;
}
/* Пятна — PNG с дизерингом (шум добавлен ДО квантования альфы):
   CSS-градиент в 8 бит полосит «кольцами» на любых остановках,
   дизер ломает полосы на уровне пикселей. Перегенерация — скрипт
   в истории: гаусс sigma .34, пики .16/.085, окно к краю. */
.v2-glow--red{background-image:url(foto/glow-red.png?v=9)}
.v2-glow--cyan{background-image:url(foto/glow-cyan.png?v=9)}

/* ---------- фото-подложка секции ---------- */
/* ШОВ (26.08): подложка ВЫХОДИТ за секцию на 160px вверх и вниз — призрак
   фото живёт в соседних тёмных секциях, у структурной границы нет «полки».
   ОБЯЗАТЕЛЬНО: первым слоем каждого секционного ::after — вертикальный
   eased-фейд глубиной var(--v2-seam) (300px = 160px выноса + 140px внутри),
   остановки .97/.86/.62/.34/.12 на 18/38/56/72/87% глубины — плавный сход
   без «ступеньки» на концах; короткий линейный или %-фейд режет фото полкой. */
.v2-section-bg{position:absolute;left:0;right:0;top:calc(-1*var(--v2-seam-out,160px));bottom:calc(-1*var(--v2-seam-out,160px));overflow:hidden;pointer-events:none}
.v2-section-bg img{width:100%;height:100%;object-fit:cover}
.v2-section-bg::after{content:"";position:absolute;inset:0}

/* ---------- плёночное зерно ---------- */
.v2-grain{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='280' height='280'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:280px 280px}

/* ---------- фоновая вотермарка ---------- */
.v2-wm-clip{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.v2-wm{position:absolute;pointer-events:none;user-select:none;white-space:nowrap;
  font-family:'Sofia Sans Extra Condensed','Golos Text',sans-serif;font-weight:840;
  text-transform:uppercase;line-height:.78;letter-spacing:.02em;
  color:transparent;-webkit-text-stroke:1.5px rgba(242,241,245,.055)}

/* СКВОЗНЫЕ ПЯТНА (26.08): каждый стык секций накрыт пятном из СЛЕДУЮЩЕЙ
   секции с отрицательным top — свет живёт по обе стороны границы.
   z-index:1 у .v2-glow сам держит пятно поверх любых фото-подложек и
   оверлеев hero — отдельные z-index экземплярам не нужны. Исключение:
   красное пятно «Об артисте» несёт z-index:2 — оно ДЕЛИКАТНО
   подкрашивает ч/б фото поверх контента (эффект-эталон «красное на
   фото», как пятно контактов подкрашивает футер). */

/* ---------- фокус с клавиатуры ---------- */

a:focus-visible{outline:2px solid var(--v2-cyan);outline-offset:3px;border-radius:inherit}