/* Внутренняя страница мероприятия (первая свёрстанная — митап «Разбор PWN-тасков»).

   Живёт в палитре и ритме лендинга (`.lp` в landing.css): фон #08090a, карточка
   #0f1314, рамка #1d1e1e, радиус 15, полоса контента 1840, ритм между блоками
   180, внутренний отступ карточки 27. Здесь ничего этого не переопределяем.

   Единственная собственная переменная — `--ev-accent`. Акцент страницы —
   зелёный платформы, один на все мероприятия: цвет направления (оранжевый у
   pwn, синий у веба) уводил бы страницу в свою палитру на каждом митапе,
   и статус набора переставал бы быть единственным зелёным пятном.

   Главный блок — программа: ось времени слева, у разборов — карточка
   настоящего таска с платформы. На неё и работает вся остальная тишина. */

.lp-ev {
  --ev-accent: var(--lp-green);
  padding-top: 40px;
}

/* ── Главный экран ─────────────────────────────────────────────────────────
   Раскладка из Figma (node 282:4142): обложка 1220 и карточка записи 600 в
   ряд, под ними четыре факта. Ширины взяты долями от полосы 1840, чтобы на
   промежуточных ширинах не оставалось дыры: 1840 − 20 (зазор) − 600 = 1220. */
.lp-ev__hero-nav {
  display: flex;
  align-items: flex-start;
}

.lp-ev__hero-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 600px;
  gap: var(--lp-gap);
  margin-top: 24px;
}

/* Подложка — как у возврата в блоге (.lp-art__back в public-post.css): ссылка
   стоит одна над героем и без заливки не читается как контрол */
.lp-ev__back {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 40px;
  padding: 0 16px;
  /* Белая плашка — та же, что у .lp-btn в landing.css */
  background: #fff;
  border-radius: 10px;
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1.05;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: #333;
  transition: background var(--t);
}
.lp-ev__back:hover {
  background: #e4e4e6;
}
.lp-ev__back:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 4px;
  border-radius: 4px;
}

/* Название и строка под ним лежат на обложке — отсюда кегль меньше обычного
   h1 лендинга: заголовок делит место с картинкой, а не открывает пустую полосу */
.lp-ev__title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 40px;
  line-height: 1.05;
  letter-spacing: -0.8px;
  color: var(--lp-title);
}

.lp-ev__tagline {
  margin: 20px 0 0;
  font-size: var(--lp-body-size);
  line-height: 1.2;
  letter-spacing: -0.44px;
  color: var(--lp-body);
}

/* Развёрнутый рассказ — уже не на картинке, а на своей подложке под фактами:
   поверх обложки четыре предложения не читаются. Подложка во всю ширину и
   того же кроя, что карточки фактов, — ряд читается как продолжение шапки */
.lp-ev__lead {
  margin: var(--lp-gap) 0 0;
  padding: 30px var(--lp-pad);
  background: var(--lp-card);
  border: 1.5px solid var(--lp-card-border);
  border-radius: 10px;
  font-size: var(--lp-body-size);
  line-height: 1.35;
  letter-spacing: -0.44px;
  color: var(--lp-body);
}

/* Факты — четыре карточки в ряд: подпись моно, значение дисплеем. Не чипы:
   это справка, а не набор ярлыков. */
.lp-ev__facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--lp-gap);
  margin: var(--lp-gap) 0 0;
}
.lp-ev__fact {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 159px;
  padding: 30px var(--lp-pad);
  background: var(--lp-card);
  border: 1.5px solid var(--lp-card-border);
  border-radius: 10px;
}
.lp-ev__fact dt {
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1.05;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: var(--lp-eyebrow);
}
.lp-ev__fact dd {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 18px 0 0;
}
.lp-ev__fact dd b {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 26px;
  line-height: 1.05;
  letter-spacing: -0.52px;
  color: #fff;
}
.lp-ev__fact dd i {
  font-family: var(--font-mono);
  font-style: normal;
  font-size: 14px;
  line-height: 1.2;
  color: var(--lp-eyebrow);
}

/* ── Карточка записи ───────────────────────────────────────────────────── */
/* Не липкая: теперь карточка задаёт высоту ряду вместе с обложкой, и на
   `position: sticky` низы у них разъезжались бы при прокрутке */
.lp-ev__book {
  display: flex;
  flex-direction: column;
  padding: var(--lp-pad);
  background: var(--lp-card);
  border: 2px solid var(--lp-card-border);
  border-radius: 15px;
}


.lp-ev__book-top {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 34px;
  padding-bottom: 34px;
  border-bottom: 1px solid var(--lp-card-border);
}

.lp-ev__countdown {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0;
}
/* Дисплейным, как заголовки: в строке остались только дни, и посимвольная
   ширина моно, которая держала ровным тикающий таймер, больше не нужна */
.lp-ev__countdown-value {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 38px;
  line-height: 1;
  letter-spacing: -0.76px;
  color: #fff;
}
.lp-ev__countdown-label {
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1.05;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: var(--lp-eyebrow);
}

.lp-ev__seats {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 30px 0;
}
.lp-ev__seats-line {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
  letter-spacing: -0.36px;
  color: var(--lp-body);
}
.lp-ev__seats-line b {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 22px;
  color: #fff;
}
.lp-ev__seats-bar {
  display: block;
  height: 6px;
  border-radius: 100px;
  background: rgba(255, 255, 255, 0.08);
  overflow: hidden;
}
.lp-ev__seats-bar i {
  display: block;
  height: 100%;
  border-radius: 100px;
  background: var(--ev-accent);
}

.lp-ev__book-btn {
  width: 100%;
  height: 70px;
  font-size: 18px;
  letter-spacing: -0.36px;
}
.lp-ev__book-btn:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

/* Форма-обёртка вокруг кнопки записи не должна влиять на раскладку карточки:
   кнопка остаётся тем же блоком во всю ширину, что и раньше ссылка */
.lp-ev__book form,
.lp-ev__final form {
  display: contents;
}

/* «Запись закрыта» / «Мест нет» / «Отменить запись» — то же место и размер,
   но не зовут нажать: белая заливка приберегается за действием */
.lp-ev__book-btn--off {
  background: transparent;
  border: 1.5px solid var(--lp-chip-border);
  color: var(--lp-chip-text);
}
.lp-ev__book-btn--off:hover {
  border-color: rgba(255, 255, 255, 0.55);
  color: #fff;
}
span.lp-ev__book-btn--off {
  cursor: default;
}
span.lp-ev__book-btn--off:hover {
  border-color: var(--lp-chip-border);
  color: var(--lp-chip-text);
}

.lp-ev__book-note {
  margin: 20px 0 0;
  font-size: 16px;
  line-height: 1.35;
  color: var(--lp-eyebrow);
}

/* ── Обложка ───────────────────────────────────────────────────────────────
   Высоту задаёт соседняя карточка записи: обложка растягивается по строке
   грида, а картинка внутри абсолютная и в высоту не вкладывается. Поэтому
   ряд меряется только карточкой, и низы у них всегда совпадают. */
.lp-ev__cover {
  position: relative;
  min-height: 420px;
  margin: 0;
  border: 1.5px solid var(--lp-card-border);
  border-radius: 15px;
  overflow: hidden;
}
.lp-ev__cover img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Затемнение снизу — под белый текст: у этой обложки низ светло-зелёный,
   и без него ни заголовок, ни строка под ним не читаются */
.lp-ev__cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(8, 9, 10, 0) 42%, rgba(8, 9, 10, 0.92) 100%);
  pointer-events: none;
}

.lp-ev__cover-text {
  position: absolute;
  z-index: 1;
  right: 30px;
  bottom: 20px;
  left: 30px;
  max-width: 860px;
}

/* Подпись к снимку — в противоположном углу от названия: рядом они читались
   бы как одна подпись к событию, а это цифра прошлого митапа */
.lp-ev__cover-note {
  position: absolute;
  z-index: 1;
  top: 20px;
  left: 20px;
  margin: 0;
  padding: 10px 14px;
  background: rgba(8, 9, 10, 0.72);
  border: 1px solid var(--lp-chip-border);
  border-radius: 10px;
  backdrop-filter: blur(6px);
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1.05;
  letter-spacing: 0.3px;
  color: var(--lp-chip-text);
}

/* ── Программа ─────────────────────────────────────────────────────────── */
/* Сигнатурный блок страницы. Слева — время на вертикальной оси, справа —
   пункт; у разборов дополнительно карточка таска. Порядок здесь несёт смысл
   (это расписание), поэтому маркеры — реальные часы, а не «01 / 02 / 03». */

.lp-ev__agenda {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Положение оси держат три числа, и они обязаны совпадать: колонка времени,
   линия и точка. Держим их в переменных — адаптивы меняют только `--ev-axis`,
   и линия с точкой едут следом. `--ev-dot` — высота, на которой стоит точка:
   она же обрезает линию у первого и последнего пункта. */
.lp-ev__slot {
  --ev-axis: 200px;
  --ev-gap: 60px;
  --ev-dot: 44px;
  position: relative;
  display: grid;
  grid-template-columns: var(--ev-axis) minmax(0, 1fr);
  column-gap: var(--ev-gap);
  padding: 36px 0;
}
/* Ось: линия сплошная, потому что у каждой строки она идёт от края до края */
.lp-ev__slot::before {
  content: "";
  position: absolute;
  left: var(--ev-axis);
  top: 0;
  bottom: 0;
  width: 1px;
  background: var(--lp-card-border);
}
.lp-ev__slot:first-child::before {
  top: var(--ev-dot);
}
.lp-ev__slot:last-child::before {
  bottom: auto;
  height: var(--ev-dot);
}
/* Точка на оси. Заполненная и в цвете направления — только у разборов:
   так по одной колонке видно, ради чего вообще стоит приходить. */
.lp-ev__slot::after {
  content: "";
  position: absolute;
  left: calc(var(--ev-axis) - 4px);
  top: var(--ev-dot);
  width: 9px;
  height: 9px;
  border-radius: 100px;
  background: var(--lp-bg);
  box-shadow: inset 0 0 0 1px var(--lp-chip-border);
}
.lp-ev__slot--task::after {
  background: var(--ev-accent);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--ev-accent) 16%, transparent);
}

.lp-ev__slot-time {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-right: 34px;
  text-align: right;
}
.lp-ev__slot-time b {
  font-family: var(--font-mono);
  font-weight: 400;
  font-size: 30px;
  line-height: 1;
  letter-spacing: -0.6px;
  font-variant-numeric: tabular-nums;
  color: #fff;
}
.lp-ev__slot--task .lp-ev__slot-time b {
  color: var(--ev-accent);
}
.lp-ev__slot-time i {
  font-family: var(--font-mono);
  font-style: normal;
  font-size: 13px;
  line-height: 1.05;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: var(--lp-eyebrow);
}

.lp-ev__slot-title {
  display: flex;
  align-items: baseline;
  gap: 18px;
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 32px;
  line-height: 1.05;
  letter-spacing: -0.64px;
  color: var(--lp-title);
}
.lp-ev__slot-speaker {
  font-family: var(--font-mono);
  font-size: 15px;
  letter-spacing: 0.3px;
  color: var(--ev-accent);
}
.lp-ev__slot-text {
  max-width: 900px;
  margin: 16px 0 0;
  font-size: 20px;
  line-height: 1.35;
  letter-spacing: -0.4px;
  color: var(--lp-body);
}

/* Карточка таска — компонент платформы (`.zf-lcard`, task-card.css) на
   публичной поверхности. Структура и типографика компонентные, меняются
   только две вещи: подложка берётся из палитры лендинга (#171718 платформы
   на фоне #08090a смотрелся бы чужой заплаткой) и содержимое встаёт в строку —
   тизера и звезды здесь нет, а в колонку три коротких элемента растягивали
   пункт программы вниз без пользы. */
.lp-ev__task {
  flex-direction: row;
  align-items: center;
  gap: 24px;
  /* Половина полосы пункта: во всю ширину строка растягивалась так, что
     между названием и статистикой оставалось пустое поле в пол-экрана */
  max-width: 50%;
  margin-top: 26px;
  padding: 18px var(--lp-pad);
  background: var(--lp-card);
  border: 1.5px solid var(--lp-card-border);
}
.lp-ev__task .zf-lcard__tags {
  flex: none;
  padding-right: 0;
}
/* Название забирает остаток строки, статистика прижимается к правому краю —
   как в прежней строке таска, чтобы цифры всех пунктов стояли по одной оси */
.lp-ev__task .zf-lcard__title {
  flex: 1 1 auto;
  min-width: 0;
}
/* Крупнее компонентных 11px: на платформе эта строка — сноска под тизером, а
   здесь она половина содержимого карточки и читается наравне с названием */
.lp-ev__task .zf-lcard__meta {
  flex: none;
  margin-top: 0;
  font-size: 14px;
}

/* ── Кто разбирает ─────────────────────────────────────────────────────── */
.lp-ev__speakers {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--lp-gap);
}

.lp-ev__person {
  display: flex;
  flex-direction: column;
  padding: var(--lp-pad);
  background: var(--lp-card);
  border: 2px solid var(--lp-card-border);
  border-radius: 15px;
}
/* Вместо фотографии — монограмма ника: у сообщества, где представляются
   никами, портрет был бы выдумкой */
.lp-ev__person-mark {
  display: grid;
  place-items: center;
  width: 76px;
  height: 76px;
  border: 1px solid color-mix(in srgb, var(--ev-accent) 45%, transparent);
  border-radius: 12px;
  background: color-mix(in srgb, var(--ev-accent) 10%, transparent);
  font-family: var(--font-mono);
  font-size: 26px;
  line-height: 1;
  text-transform: uppercase;
  color: var(--ev-accent);
}
.lp-ev__person-id {
  margin-top: 30px;
}
.lp-ev__person-nick {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 30px;
  line-height: 1.05;
  letter-spacing: -0.6px;
  color: #fff;
}
.lp-ev__person-role {
  margin: 12px 0 0;
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1.05;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: var(--lp-eyebrow);
}
.lp-ev__person-text {
  margin: 24px 0 40px;
  font-size: 18px;
  line-height: 1.4;
  letter-spacing: -0.36px;
  color: var(--lp-body);
}
.lp-ev__person-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin: auto 0 0;
  padding-top: 26px;
  border-top: 1px solid var(--lp-card-border);
}
.lp-ev__person-stats > div + div {
  padding-left: 24px;
  border-left: 1px solid var(--lp-card-border);
}
.lp-ev__person-stats dt {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 26px;
  line-height: 1.05;
  letter-spacing: -0.52px;
  color: #fff;
}
.lp-ev__person-stats dd {
  margin: 12px 0 0;
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1.15;
  letter-spacing: 0.3px;
  color: var(--lp-eyebrow);
}

/* ── Формат ────────────────────────────────────────────────────────────── */
/* Правила — не последовательность, поэтому без нумерации и вообще без
   маркера: заголовок карточки сам себе метка */
.lp-ev__rules {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--lp-gap);
}
.lp-ev__rule {
  padding: var(--lp-pad);
  background: var(--lp-card);
  border: 2px solid var(--lp-card-border);
  border-radius: 15px;
}
.lp-ev__rule-title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 28px;
  line-height: 1.05;
  letter-spacing: -0.56px;
  color: var(--lp-title);
}
.lp-ev__rule-text {
  margin: 20px 0 0;
  font-size: 20px;
  line-height: 1.35;
  letter-spacing: -0.4px;
  color: var(--lp-body);
}

/* ── Место ─────────────────────────────────────────────────────────────── */
.lp-ev__venue {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: var(--lp-gap);
}
.lp-ev__venue-card,
.lp-ev__bring {
  padding: var(--lp-pad);
  background: var(--lp-card);
  border: 2px solid var(--lp-card-border);
  border-radius: 15px;
}
.lp-ev__venue-city {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1.05;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: var(--lp-eyebrow);
}
.lp-ev__venue-address {
  margin: 24px 0 40px;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 46px;
  line-height: 1.05;
  letter-spacing: -0.92px;
  color: #fff;
}
.lp-ev__venue-lines > div {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 30px;
  padding: 20px 0;
  border-top: 1px solid var(--lp-card-border);
}
/* Линия и под последней строкой: список читается как таблица, у которой есть
   низ, а не как перечисление, оборванное на полуслове */
.lp-ev__venue-lines > div:last-child {
  border-bottom: 1px solid var(--lp-card-border);
}
.lp-ev__venue-lines dt {
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1.4;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: var(--lp-eyebrow);
}
.lp-ev__venue-lines dd {
  margin: 0;
  font-size: 18px;
  line-height: 1.4;
  letter-spacing: -0.36px;
  color: var(--lp-body);
}

.lp-ev__bring-head {
  margin: 0 0 30px;
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 1.05;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: var(--lp-eyebrow);
}
.lp-ev__bring-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.lp-ev__bring-list li {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 18px 0;
  border-top: 1px solid var(--lp-card-border);
  font-size: 18px;
  line-height: 1.4;
  letter-spacing: -0.36px;
  color: var(--lp-body);
}
/* Линия и под последним пунктом — та же причина, что у списка «Место» рядом */
.lp-ev__bring-list li:last-child {
  border-bottom: 1px solid var(--lp-card-border);
}
.lp-ev__bring-list svg {
  flex: none;
  width: 20px;
  height: 20px;
  margin-top: 2px;
  color: var(--ev-accent);
}

/* ── Финальная полоса ──────────────────────────────────────────────────── */
.lp-ev__final {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 60px;
  padding: 50px;
  background: var(--lp-card);
  border: 2px solid var(--lp-card-border);
  border-radius: 15px;
}
.lp-ev__final-title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 40px;
  line-height: 1.05;
  letter-spacing: -0.8px;
  color: #fff;
}
.lp-ev__final-text {
  margin: 18px 0 0;
  font-size: 20px;
  line-height: 1.3;
  letter-spacing: -0.4px;
  color: var(--lp-body);
}
.lp-ev__final-btn {
  flex: none;
  width: 320px;
  height: 70px;
  font-size: 18px;
  letter-spacing: -0.36px;
}
.lp-ev__final-btn:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

/* ── Появление пунктов программы ───────────────────────────────────────── */
/* Прячем только когда скрипт жив: без JS страница должна остаться читаемой */
.lp-ev[data-reveal-on] [data-reveal] {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 500ms ease, transform 500ms ease;
}
.lp-ev[data-reveal-on] [data-reveal].is-in {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .lp-ev[data-reveal-on] [data-reveal] {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* ══ Адаптивы ═══════════════════════════════════════════════════════════════

   Ступени те же, что у лендинга (landing.css): 1024 — планшет, 720 — телефон,
   430 — узкий телефон. Кегли `--lp-h1`/`--lp-h2`/`--lp-body-size` там же и
   пересчитываются сами; здесь правим только собственную геометрию страницы.

   Главное решение: ось программы не разбирается. Обычный ход — на телефоне
   схлопнуть её в плоский список (время строкой над заголовком, линия долой),
   но ось и есть то, чем эта страница отличается от любой другой страницы
   мероприятия. Поэтому она просто уменьшается: колонка времени 200 → 68,
   зазор 60 → 18, линия и точка едут за `--ev-axis`. Грамматика
   «время | ось | пункт» сохраняется в треть размера. */

/* ── Планшет ───────────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .lp-ev {
    padding-top: 28px;
  }

  /* Карточка записи уходит под обложку: в одну колонку 600px рядом с
     картинкой уже не встают. Высоту обложке тогда задаёт не сосед, а своя
     пропорция — иначе она схлопнется в полосу. */
  .lp-ev__hero-main {
    grid-template-columns: minmax(0, 1fr);
  }
  .lp-ev__cover {
    min-height: 0;
    aspect-ratio: 2.44 / 1;
  }

  .lp-ev__title {
    font-size: 34px;
    letter-spacing: -0.68px;
  }
  .lp-ev__tagline {
    margin-top: 14px;
  }
  .lp-ev__lead {
    margin-top: 30px;
  }
  /* Факты в две колонки уже здесь: в четырёх на 768 значения («26 сентября»,
     «15:00 — 19:30») перестают помещаться в строку и ломаются пополам */
  .lp-ev__facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .lp-ev__fact {
    min-height: 0;
    padding: 24px 22px;
  }
  .lp-ev__fact dd b {
    font-size: 22px;
  }

  .lp-ev__slot {
    --ev-axis: 140px;
    --ev-gap: 36px;
    --ev-dot: 38px;
    padding: 28px 0;
  }
  .lp-ev__slot-time {
    padding-right: 24px;
  }
  .lp-ev__slot-time b {
    font-size: 24px;
  }
  .lp-ev__slot-title {
    font-size: 26px;
  }
  .lp-ev__slot-text {
    font-size: 18px;
  }
  /* Карточка таска обратно во всю ширину пункта: в половине полосы на 1024
     под название остаётся сотня пикселей, и оно ломается по слогам */
  .lp-ev__task {
    max-width: none;
  }

  .lp-ev__speakers {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .lp-ev__venue-address {
    font-size: 34px;
  }
  .lp-ev__final {
    padding: 36px;
    gap: 32px;
  }
  .lp-ev__final-title {
    font-size: 32px;
  }
  .lp-ev__final-btn {
    width: 240px;
    height: 60px;
  }
}

/* ── Телефон ───────────────────────────────────────────────────────────── */
@media (max-width: 720px) {
  .lp-ev {
    padding-top: 20px;
  }

  /* Обложка вытягивается почти в квадрат: на 375 в пропорции планшета под
     текстом остаётся полоска в полсотни пикселей, и затемнение съедает
     картинку целиком */
  .lp-ev__cover {
    aspect-ratio: 1.2 / 1;
  }
  .lp-ev__cover-text {
    right: 18px;
    left: 18px;
  }
  .lp-ev__cover-note {
    top: 14px;
    left: 14px;
    padding: 8px 11px;
    font-size: 11px;
  }
  .lp-ev__title {
    font-size: 26px;
    letter-spacing: -0.52px;
  }
  .lp-ev__tagline {
    margin-top: 10px;
    font-size: 15px;
  }
  .lp-ev__lead {
    margin-top: 24px;
  }

  /* Решётка фактов та же, что на планшете (см. ступень 1024) — здесь только
     поджимаем отступы и кегли под узкую полосу */
  .lp-ev__facts {
    gap: 10px;
  }
  .lp-ev__fact {
    padding: 16px 14px;
  }
  .lp-ev__fact dt {
    font-size: 11px;
    letter-spacing: 1px;
  }
  .lp-ev__fact dd {
    gap: 6px;
    margin-top: 12px;
  }
  .lp-ev__fact dd b {
    font-size: 18px;
    letter-spacing: -0.36px;
  }
  .lp-ev__fact dd i {
    font-size: 12px;
  }

  /* ── Карточка записи ─────────────────────────────────────────────────── */
  .lp-ev__book {
    margin-top: 28px;
  }
  .lp-ev__book-top {
    gap: 20px;
    padding-bottom: 22px;
  }
  .lp-ev__countdown {
    gap: 8px;
  }
  .lp-ev__countdown-value {
    font-size: 30px;
  }
  .lp-ev__countdown-label {
    font-size: 11px;
    letter-spacing: 1px;
  }
  .lp-ev__seats {
    gap: 10px;
    padding: 20px 0;
  }
  .lp-ev__seats-line {
    font-size: 16px;
  }
  .lp-ev__seats-line b {
    font-size: 19px;
  }
  .lp-ev__book-btn {
    height: 54px;
    font-size: 16px;
  }
  .lp-ev__book-note {
    margin-top: 14px;
    font-size: 14px;
  }

  /* ── Программа ───────────────────────────────────────────────────────── */
  .lp-ev__slot {
    --ev-axis: 68px;
    --ev-gap: 18px;
    --ev-dot: 24px;
    padding: 20px 0;
  }
  .lp-ev__slot-time {
    padding-right: 12px;
    gap: 6px;
  }
  .lp-ev__slot-time b {
    font-size: 16px;
    letter-spacing: -0.32px;
  }
  .lp-ev__slot-time i {
    font-size: 10px;
    letter-spacing: 0.6px;
  }
  /* Ник докладчика уходит под заголовок, а не встаёт с ним в строку: в 272px
     он иначе отрывался от последнего слова и висел один */
  .lp-ev__slot-title {
    flex-wrap: wrap;
    gap: 6px 12px;
    font-size: 20px;
    letter-spacing: -0.4px;
  }
  .lp-ev__slot-speaker {
    font-size: 13px;
  }
  .lp-ev__slot-text {
    margin-top: 10px;
    font-size: 15px;
    line-height: 1.4;
  }

  /* Обратно в колонку и во всю ширину: в строку на 375 название таска
     ужимается до пары символов, а статистика упирается в чипы */
  .lp-ev__task {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    max-width: none;
    margin-top: 16px;
    padding: 16px 18px;
  }
  .lp-ev__task .zf-lcard__meta {
    margin-top: 0;
  }

  /* ── Кто разбирает / формат / место ──────────────────────────────────── */
  .lp-ev__speakers,
  .lp-ev__rules,
  .lp-ev__venue {
    grid-template-columns: minmax(0, 1fr);
  }
  .lp-ev__person-mark {
    width: 56px;
    height: 56px;
    font-size: 20px;
  }
  .lp-ev__person-id {
    margin-top: 20px;
  }
  .lp-ev__person-nick {
    font-size: 24px;
  }
  .lp-ev__person-text {
    margin: 16px 0 28px;
    font-size: 16px;
  }
  .lp-ev__person-stats {
    padding-top: 18px;
  }
  .lp-ev__person-stats dt {
    font-size: 20px;
  }
  .lp-ev__person-stats dd {
    margin-top: 8px;
    font-size: 11px;
  }

  .lp-ev__rule-title {
    font-size: 21px;
    letter-spacing: -0.42px;
  }
  .lp-ev__rule-text {
    margin-top: 14px;
    font-size: 15px;
  }

  .lp-ev__venue-address {
    margin: 16px 0 26px;
    font-size: 26px;
    letter-spacing: -0.52px;
  }
  .lp-ev__venue-lines > div {
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 14px;
    padding: 14px 0;
  }
  .lp-ev__venue-lines dt {
    font-size: 11px;
    letter-spacing: 1px;
  }
  .lp-ev__venue-lines dd {
    font-size: 15px;
  }
  .lp-ev__bring-head {
    margin-bottom: 18px;
  }
  .lp-ev__bring-list li {
    gap: 12px;
    padding: 14px 0;
    font-size: 15px;
  }
  .lp-ev__bring-list svg {
    width: 17px;
    height: 17px;
  }

  /* ── Финальная полоса ────────────────────────────────────────────────── */
  .lp-ev__final {
    flex-direction: column;
    align-items: stretch;
    gap: 22px;
    padding: 24px 20px;
  }
  .lp-ev__final-title {
    font-size: 24px;
    letter-spacing: -0.48px;
  }
  .lp-ev__final-text {
    margin-top: 10px;
    font-size: 15px;
  }
  .lp-ev__final-btn {
    width: 100%;
    height: 54px;
    font-size: 16px;
  }
}

/* ── Узкий телефон ─────────────────────────────────────────────────────── */
/* Полоса контента здесь 288−320: правим только то, что в неё перестаёт
   помещаться. */
@media (max-width: 430px) {
  .lp-ev__fact dd b {
    font-size: 16px;
  }
  .lp-ev__countdown-value {
    font-size: 26px;
  }
  /* Кадр ещё выше: на 375 в заголовок уходит три строки, и текст с подписью
     сходятся в одной половине картинки */
  .lp-ev__cover {
    aspect-ratio: 1 / 1;
  }
  /* На 11px подпись занимала почти всю ширину кадра и читалась полосой, а не
     плашкой — возвращаем ей пропорцию таблички */
  .lp-ev__cover-note {
    padding: 7px 10px;
    font-size: 10px;
    letter-spacing: 0.2px;
  }

  .lp-ev__slot {
    --ev-axis: 60px;
    --ev-gap: 14px;
  }
  .lp-ev__slot-time {
    padding-right: 10px;
  }
  .lp-ev__slot-time b {
    font-size: 15px;
  }
  .lp-ev__slot-title {
    font-size: 18px;
  }

  .lp-ev__venue-address {
    font-size: 22px;
  }
  /* Подпись и значение перестают быть парой колонок: 92px под «Адрес» и
     «Как добраться» уже мало, а остатку не хватает на строку */
  .lp-ev__venue-lines > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
  }
}