/*
 * Марка на страницах до входа.
 *
 * Отдельным файлом, а не строками в entry.css: тот уже перерос порог из
 * CLAUDE.md, и дописывать в него — увеличивать нарушение.
 *
 * Подключается в helpers/layout/entry_page для всех страниц до входа, но
 * саму разметку зовёт пока только регистрация. Захотим марку на входе и
 * на восстановлении пароля — там будет ровно одна строка, стили уже на
 * месте.
 */

/* Знак — буква в слове, а не значок рядом. Отсюда выравнивание по низу
   и почти отсутствующий зазор: между литерами в слове его и не бывает. */
.entry__brand {
	display: flex;
	align-items: flex-end;
	gap: 1px;
	margin-bottom: 28px;
}

/* Знак приходит из общего помощника <picture>; размер задаётся здесь,
   потому что ui2/surfaces.css на страницах до входа не подключён. */
.entry__brand-mark { display: block; line-height: 0; flex: 0 0 auto; }

.entry__brand-mark img {
	display: block;
	height: 34px;
	width: auto;
}

/* Строка садится на ножки знака.
 *
 * При выравнивании по низу совпадают нижние края КОРОБОК, а у текстовой
 * коробки снизу остаётся место под хвосты букв — из-за него слово
 * вставало выше основания «М». Отрицательный отступ убирает этот запас.
 *
 * Величина не на глаз: измерено в браузере, где проходит линия букв
 * (Manrope 800: ascent 33 и descent 9 при кегле 31) относительно нижней
 * точки знака. Полный запас в 0.22em опускал строку на три пикселя ниже
 * ножек. Значение в em — держится на любом кегле.
 */
.entry__brand-name {
	font-size: 26px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.9px;
	color: var(--entry-title);
	white-space: nowrap;
	margin-bottom: -0.113em;
}

.entry__brand-name b { color: var(--entry-accent); font-weight: 800; }

.entry__brand-name i {
	font-style: normal;
	font-weight: 700;
	color: var(--entry-muted);
}

@media (max-width: 900px) {

	/* На телефоне снимок становится верхней полосой, а содержимое
	   наезжает на него снизу (margin-top: -132px в entry.css). Марка идёт
	   первой и попадала ровно туда, где затемнение ещё слабое, — белые
	   буквы ложились на светлую одежду. Отступ опускает её в ту часть
	   полосы, где затемнение уже почти сплошное; наезд заголовка на
	   снимок при этом сохраняется. Правило живёт здесь, а не в entry.css,
	   потому что нужно оно только странице с маркой. */
	/* Полоса снимка укорочена до 280 пикселей (entry.css), и затемнение
	   теперь начинается выше — прежний отступ в 58 пикселей опускал марку
	   слишком низко и съедал первый экран. */
	.entry__brand { padding-top: 20px; gap: 1px; margin-bottom: 14px; }

	.entry__brand-mark img { height: 28px; }
	.entry__brand-name { font-size: 21px; letter-spacing: -0.7px; }
}
