/* Общий блок «Партнёры + футер» (partials/shared/partners-footer.html). Подключается и на главной (после landing-sections.css), и на страницах треков. Блок самодостаточен: токены и базовые glassbg-правила продублированы со скоупом .partners-footer-band, чтобы страницы треков не тянули landing-sections.css. Мобильная версия главной по-прежнему переопределяется в styles/mobile-home.css. */ .partners-footer-band { /* Токены — зеркало styles/live-track-base.css :root */ --font-display: 'IBM Plex Sans Condensed', sans-serif; --font-ui: Manrope, sans-serif; --font-body: Inter, sans-serif; /* Моноширинный нужен футеру: дата в талоне и почта набраны им. Шрифт подключается в страниц вместе с остальными тремя. */ --font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace; --text-2xs: 10px; --text-xs: 11px; --text-sm: 13px; --text-md: 15px; --text-h1: clamp(36px, 4vw, 56px); --ls-caps: 0.16em; --color-text: #f3f0ea; --color-text-muted: #a8adb7; --glass-tint: 22, 25, 30; --glass-line: rgba(255, 255, 255, 0.16); --glass-shadow: 0 24px 60px rgba(0, 0, 0, 0.36); --film-line: rgba(243, 240, 234, 0.12); } /* База glassbg в скоупе блока (на главной дублирует landing-sections.css) */ .partners-footer-band { position: relative; overflow: clip; isolation: isolate; background: transparent !important; border-top: 1px solid rgba(232, 195, 106, 0.26); /* Перекрываем субпиксельный шов с низом FAQ непрозрачным верхом «вуали». */ margin-top: -3px; } /* После FAQ золотая кромка не нужна; заезжаем вверх под низ FAQ, чтобы сплошной #16191c не читался отдельной полосой над стадионом. */ .faq-section + .partners-footer-band { border-top: none; margin-top: clamp(-64px, -7vw, -40px); } .faq-section + .partners-footer-band .partners-band__intro { padding-top: clamp(3.25rem, 7vw, 5rem); } /* Запас под фиксированный .stage-console — только в дев-режиме (?dev=1). Без него посетитель видит пустую полосу ~72px под копирайтом. */ html.dev-tools-on .partners-footer-band { padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)); } .partners-footer-band::after { display: none; } .partners-footer-band > .partners-band, .partners-footer-band > .site-footer { position: relative; z-index: 3; } .partners-footer-band .glassbg__veil { position: absolute; inset: 0; z-index: 1; pointer-events: none; } .partners-footer-band .lock-shell { width: min(100% - 2.5rem, 1220px); margin: 0 auto; } @media (min-width: 721px) { .partners-footer-band .lock-shell { width: min(100% - 2rem, 1220px); } } /* Под блоком настоящий кадр (стадион), поэтому стекло здесь работает. Ступени по роли: крупная карточка — рабочая, плитка сетки — мелкая. */ .partners-footer-band.partners-glass--light .partners-roster__item, .partners-footer-band.partners-glass--light .partners-card { background: var(--glass); backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat)); -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat)); border-color: var(--glass-line); } .partners-footer-band.partners-glass--light .partners-card { background: rgba(255, 255, 255, 0.025); border-color: var(--line-soft); } /* Partners + footer — single vertical night-arena background */ /* Ночной кадр из чаши: мачты за козырьком, свет пятнами по трибуне. Тон запечён в файл (средняя 32, верх 25, низ 20, зерно 6.9) — блок не выныривает из глубины светлым пятном, а стыкуется с базой страницы. Исходник генератора шёл со средней 36 и зерном 13.7; крупу сбил слабый гаусс, зоны — тональной маской, не CSS-фильтром: фильтр на большом фоновом слое дорог. */ .partners-footer-band__bg { position: absolute; inset: 0; z-index: 0; background-color: var(--bg-base-deep, #050607); background-image: url('../images/partners-footer-bg-arena-interior.webp'); background-repeat: no-repeat; background-size: 100% auto; /* 62% было подобрано под кадр с флагами. У арены на этой высоте в полосу попадало пустое небо — поднято, чтобы вошли батареи и верх трибуны. */ background-position: center 42%; pointer-events: none; } .glassbg--partners-footer .partners-footer-band__veil { background: /* Мост к низу FAQ: старт в --faq-gradient-bottom (#16191c), без прыжка в #070a0c — иначе на стыке видна тёмная горизонтальная полоса. */ linear-gradient( 180deg, #16191c 0px, rgba(22, 25, 28, 0.94) 36px, rgba(22, 25, 28, 0.55) 100px, rgba(22, 25, 28, 0.18) 170px, rgba(22, 25, 28, 0) 240px ), linear-gradient( 180deg, rgba(var(--glass-tint), 0) 0px, rgba(var(--glass-tint), 0.24) 150px, rgba(var(--glass-tint), 0.4) 40%, rgba(var(--glass-tint), 0.52) 65%, rgba(5, 6, 8, 0.76) 84%, rgba(5, 6, 8, 0.9) 100% ), radial-gradient(ellipse 90% 70% at 50% 18%, transparent 30%, rgba(5, 6, 8, 0.28) 100%); } .partners-band { position: relative; background: transparent; } .partners-band__intro { display: grid; gap: 2rem; padding-top: clamp(3.5rem, 8vw, 5.5rem); padding-bottom: clamp(2rem, 5vw, 3rem); } .partners-band__glass-switch-wrap { display: flex; justify-content: flex-end; grid-column: 1 / -1; } .partners-footer-band.partners-glass--dark .partners-roster__item { background: linear-gradient(180deg, rgba(6, 8, 12, 0.86) 0%, rgba(3, 5, 8, 0.9) 100%); backdrop-filter: blur(var(--glass-blur-strong)) saturate(var(--glass-sat)); -webkit-backdrop-filter: blur(var(--glass-blur-strong)) saturate(var(--glass-sat)); border-color: var(--line); } .partners-footer-band.partners-glass--dark .partners-card { background: rgba(0, 0, 0, 0.24); border-color: var(--line-soft); } .partners-band__intro-copy h1, .partners-band__intro-copy h2 { margin: 0; max-width: 16ch; color: #f6f2ea; font: 700 var(--text-h1) / 0.98 var(--font-display); letter-spacing: -0.03em; text-wrap: balance; } .partners-band__lead { max-width: 34rem; margin: 1rem 0 0; color: rgba(243, 240, 234, 0.74); line-height: 1.68; } /* Ростер: три карточки одного веса — организатор и два партнёра. */ .partners-band__roster-wrap { padding-bottom: clamp(1.25rem, 3vw, 2rem); } .partners-band__contact { scroll-margin-top: clamp(84px, 9vw, 116px); padding-top: clamp(2rem, 5vw, 3.25rem); padding-bottom: clamp(1.25rem, 3vw, 2rem); } .partners-roster { display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; } .partners-roster__item { display: grid; grid-template-rows: auto auto auto 1fr; gap: 0.85rem; padding: 1.1rem; border: 1px solid var(--glass-line); border-radius: var(--radius-lg); background: var(--glass); backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat)); -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat)); box-shadow: var(--glass-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.08); } .partners-roster__tier { color: var(--color-text-muted); font: 900 var(--text-2xs)/1.2 var(--font-ui); letter-spacing: var(--ls-caps); text-transform: uppercase; } .partners-roster__name { margin: 0; color: var(--color-text); font: 600 var(--text-md)/1.25 var(--font-display); letter-spacing: -0.01em; } .partners-roster__desc { margin: 0; color: rgba(243, 240, 234, 0.62); font-size: var(--text-sm); line-height: 1.55; } .partners-card { display: flex; align-items: center; justify-content: center; min-height: 8rem; padding: 1rem 1.25rem; border: 1px solid var(--line-soft); border-radius: var(--radius-md); background: rgba(255, 255, 255, 0.025); color: rgba(243, 240, 234, 0.58); text-decoration: none; transition: border-color 180ms ease, background-color 180ms ease, transform 180ms ease; } /* Наведение окрашивает плитку: она становится светлой подложкой, монохром гаснет, проступает фирменный цвет. Иначе нельзя — цветные версии знаков нарисованы под светлый фон (тёмно-синий VSporte, графит Технопарка на тёмном стекле просто исчезли бы). Селектор с .partners-footer-band — иначе тематические правила выше (0,3,0) перебивают состояние. */ .partners-footer-band .partners-card--linked:focus-visible { border-color: rgba(243, 240, 234, 0.42); background: rgba(243, 240, 234, 0.94); outline: 2px solid var(--gold, #e8c36a); outline-offset: 3px; } /* На тач-экране :hover залипает после тапа — окрашивание только там, где есть настоящий курсор. Фокусное состояние выше работает везде. */ @media (hover: hover) { .partners-footer-band .partners-card:hover { border-color: rgba(243, 240, 234, 0.42); background: rgba(243, 240, 234, 0.94); transform: translateY(-1px); } } /* Два знака лежат в одной ячейке грида — при кроссфейде ничего не съезжает. */ .partners-card__mark { display: grid; place-items: center; max-width: 100%; } /* Высота задаётся под каждый знак: у логотипов разная пропорция (Технопарк — 3.7:1, VSporte — 5.6:1, ДНК — 1.57:1, Т-Бизнес — 4:1 вместе с плашкой), одинаковый max-height дал бы разный оптический вес. Внутри clamp() высоты подобраны на равную оптическую площадь, vw-середина ужимает знаки на узких десктопах, где карточка сама сужается. */ .partners-card__logo { grid-area: 1 / 1; width: auto; height: var(--logo-h, 2.6rem); max-width: 100%; object-fit: contain; transition: opacity 200ms ease; } .partners-card__logo--color { opacity: 0; } .partners-card--linked:focus-visible .partners-card__logo--mono { opacity: 0; } .partners-card--linked:focus-visible .partners-card__logo--color { opacity: 1; } @media (hover: hover) { .partners-card:hover .partners-card__logo--mono { opacity: 0; } .partners-card:hover .partners-card__logo--color { opacity: 1; } } .partners-card__mark--technopark { --logo-h: clamp(2.2rem, 4.6vw, 3.9rem); } .partners-card__mark--vsporte { --logo-h: clamp(1.7rem, 3.1vw, 2.6rem); } .partners-card__mark--dnk { --logo-h: clamp(3rem, 5.1vw, 4.4rem); } /* Т-Бизнес — 5.8:1, самый длинный лок-ап в ростере: он упирается не в высоту, а в ширину плитки, и при общих полях читается мельче соседей. Потолок высоты поднят с запасом (её всё равно ограничит ширина), а полям этой карточки отдано место — знак идёт почти во всю плитку. */ .partners-card__mark--tbank { --logo-h: clamp(2rem, 4.2vw, 3.5rem); } .partners-roster__item:has(.partners-card__mark--tbank) .partners-card { padding-inline: 0.55rem; } @media (prefers-reduced-motion: reduce) { .partners-footer-band .partners-card:hover { transform: none; } } @media (min-width: 760px) { .partners-band__intro { grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr); gap: clamp(2rem, 5vw, 4rem); align-items: start; } /* Партнёров четверо: до 1040px это каре 2×2, дальше одна линия. */ .partners-roster { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; } } @media (min-width: 1040px) { .partners-roster { grid-template-columns: repeat(4, minmax(0, 1fr)); } } /* ============================================================ Site footer — «Билет», редакция «Тихая строка» (стенд footer-variants-2.html, вариант C) Футер единственный на странице выходит из оси .lock-shell на всю ширину экрана: талон с датой должен вставать встык с правым краем, иначе он не талон, а карточка у обочины. Слева отступ --footer-edge; на ПК копирайт в `.site-footer__sign` тянется к правому краю экрана. Раскладка колонки: кикер и реестр треков сверху, тихая строка со служебными ссылками и подпись — снизу. Талон вынут из потока сетки и приколот к правому верхнему углу: его верх встаёт вровень с кикером, а высоту строки он не задаёт — вертикальная печать выше реестра, и в потоке она утащила бы тихую строку вниз за собой. Горизонтальные линии колонки не border, а псевдоэлементы: им нужен градиент — линии тянутся через зазор до самой грани талона и гаснут, подходя к нему. Контакт (роль + имя / почта / Telegram) стоит сразу под ростером партнёров. Дата осталась крупной в талоне у правого края. ============================================================ */ .site-footer { position: relative; --footer-edge: clamp(20px, 4vw, 60px); /* Зазор между колонкой и талоном. На узких экранах талон стоит в потоке, линиям тянуться некуда — отсюда 0. */ --footer-gap: 0px; /* Без линии над футером: секция партнёров и подвал — один блок. */ border-top: none; background: transparent; color: var(--color-text-muted); padding: clamp(2.5rem, 6vw, 4rem) 0 calc(clamp(1.5rem, 4vw, 2rem) + env(safe-area-inset-bottom, 0px)); } /* Кикер лежит внутри .site-footer__cols, поля колонки уже отбиты — свои ему больше не нужны. */ .site-footer__head { margin-bottom: clamp(1.5rem, 4vw, 2.4rem); } .site-footer__kicker { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin: 0; color: var(--color-text-muted); font: 900 clamp(12px, 1.15vw, 15px)/1.2 var(--font-ui); letter-spacing: var(--ls-caps); text-transform: uppercase; } .site-footer__kicker-dot { flex: none; } .site-footer__cols { position: relative; display: grid; gap: clamp(1.75rem, 4vw, 2.5rem); padding: 0 var(--footer-edge); align-items: start; } .site-footer__top { min-width: 0; } .site-footer__contact { display: grid; justify-items: center; gap: 0.95rem; text-align: center; } .site-footer__role { color: var(--color-text-muted); font: 600 clamp(15px, 1.35vw, 18px)/1.4 var(--font-ui); letter-spacing: 0.04em; } .site-footer__contact-row { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 0.75rem 1.6rem; } .site-footer__name { color: var(--color-text); font: 700 clamp(24px, 2.4vw, 36px)/1.15 var(--font-display); letter-spacing: -0.02em; } .site-footer__mail { position: relative; display: inline-block; max-width: 100%; padding-bottom: 3px; color: var(--color-text); font: 500 clamp(22px, 2.2vw, 34px)/1.15 var(--font-mono); letter-spacing: -0.02em; text-decoration: none; overflow-wrap: anywhere; } .site-footer__mail::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: var(--line-strong); transform-origin: left; transition: background-color 220ms ease, transform 220ms ease; } .site-footer__mail:hover::after, .site-footer__mail:focus-visible::after { background: var(--gold); transform: scaleY(2); } .site-footer__tg { position: relative; display: inline-block; max-width: 100%; padding-bottom: 3px; color: var(--color-text); font: 500 clamp(22px, 2.2vw, 34px)/1.15 var(--font-mono); letter-spacing: -0.02em; text-decoration: none; overflow-wrap: anywhere; } .site-footer__tg::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: var(--line-strong); transform-origin: left; transition: background-color 220ms ease, transform 220ms ease; } .site-footer__tg:hover::after, .site-footer__tg:focus-visible::after { background: var(--gold); transform: scaleY(2); } /* Реестр треков 01–05. Кегль ниже, чем у заголовков секций: реестр не должен спорить с датой в талоне. Линии — псевдоэлементы, а не border: им нужен градиент с затуханием в сторону талона. */ .site-footer__tracks { position: relative; } .site-footer__tracks::before { content: ''; position: absolute; left: 0; right: calc(-1 * var(--footer-gap)); top: 0; height: 1px; background: linear-gradient(90deg, var(--line) 0%, var(--line) 42%, rgba(255, 255, 255, 0) 100%); } /* Отрицательный margin с равным ему padding: текст остаётся на оси колонки, а место под золотой штрих берётся слева от неё. */ .site-footer__track { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 0 clamp(0.75rem, 1.8vw, 1.15rem); margin-left: -14px; padding: clamp(0.6rem, 1.2vw, 0.8rem) 0 clamp(0.6rem, 1.2vw, 0.8rem) 14px; color: inherit; text-decoration: none; } .site-footer__track::after { content: ''; position: absolute; left: 0; right: calc(-1 * var(--footer-gap)); bottom: 0; height: 1px; background: linear-gradient( 90deg, var(--line-soft) 0%, var(--line-soft) 48%, rgba(255, 255, 255, 0) 100% ); } /* Штрих слева — состояние, а не украшение: золото загорается только под курсором и с клавиатуры. */ .site-footer__track::before { content: ''; position: absolute; left: 0; top: -1px; bottom: -1px; width: 2px; background: var(--gold); transform: scaleY(0); transition: transform 200ms ease; } .site-footer__track:hover, .site-footer__track:focus-visible { background: linear-gradient(90deg, rgba(255, 255, 255, 0.032), rgba(255, 255, 255, 0)); } .site-footer__track:hover::before, .site-footer__track:focus-visible::before { transform: scaleY(1); } .site-footer__track-num { color: rgba(243, 240, 234, 0.32); font: 500 var(--text-2xs)/1 var(--font-mono); letter-spacing: 0.16em; transition: color 200ms ease; } .site-footer__track:hover .site-footer__track-num, .site-footer__track:focus-visible .site-footer__track-num { color: var(--gold-text, #e1b14f); } .site-footer__track-name { color: rgba(243, 240, 234, 0.84); font: 600 clamp(15px, 1.45vw, 19px)/1.25 var(--font-display); letter-spacing: -0.01em; transition: color 200ms ease; } .site-footer__track:hover .site-footer__track-name, .site-footer__track:focus-visible .site-footer__track-name { color: var(--color-text); } /* Тихая строка: разделы и экосистема в подбор через точки. */ .site-footer__end { display: grid; gap: 1rem; padding-top: clamp(1.5rem, 3vw, 2rem); } .site-footer__line { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; margin: 0; padding: 0; list-style: none; /* Та же капс-типографика, что у .site-footer__kicker */ font: 900 clamp(12px, 1.15vw, 15px)/1.2 var(--font-ui); letter-spacing: var(--ls-caps); text-transform: uppercase; } .site-footer__line a { color: var(--color-text-muted); text-decoration: none; transition: color 180ms ease; } .site-footer__line a:hover, .site-footer__line a:focus-visible { color: var(--color-text); } /* Разделитель только между ссылками — в начале строки точки нет. */ .site-footer__line li + li::before { content: '·'; margin-right: 14px; color: rgba(243, 240, 234, 0.26); } .site-footer__sign { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 1.5rem; padding-top: clamp(1rem, 2.2vw, 1.35rem); } /* Последняя линия подвала гаснет туда же, куда остальные, — иначе она единственная упирается в правый край сплошной. */ .site-footer__sign::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient( 90deg, var(--line-soft) 0%, var(--line-soft) 48%, rgba(255, 255, 255, 0) 100% ); } /* Лаймовый знак Технопарка стоит в подписи, слева от копирайта (официальный block-ru: лайм #B1EC52 + светлый wordmark). */ .site-footer__org { display: inline-flex; text-decoration: none; transition: opacity 180ms ease; } .site-footer__org:hover, .site-footer__org:focus-visible { opacity: 0.88; } .site-footer__org-logo { display: block; width: auto; height: clamp(2.2rem, 3.8vw, 3.1rem); } /* На мобиле логотип Технопарка в подписи не нужен (как на главной) */ @media (max-width: 720px) { .partners-band__contact { padding-bottom: 12px; } .site-footer__org { display: none; } .partners-band__lead { display: none; } /* Кикер в две строки: «Премия…» / «Лидеры индустрии» */ .site-footer__kicker { width: 100%; flex-direction: column; flex-wrap: nowrap; align-items: center; justify-content: center; gap: 0.28rem; line-height: 1.25; text-align: center; } .site-footer__kicker-dot { display: none; } /* Технопарк на мобиле иначе мельче ДНК/Вспорте из‑за широкого SVG */ .partners-card__mark--technopark { --logo-h: 68px; } .partners-card__mark--vsporte { --logo-h: 36px; } .partners-card__mark--dnk { --logo-h: 66px; } .partners-card__mark--tbank { --logo-h: 46px; } /* Строка разделов над талоном: дети .site-footer__end входят в сетку колонок */ .site-footer__cols { display: flex; flex-direction: column; /* Базовый .site-footer__cols { align-items: start } сжимает детей по контенту — без stretch копирайт остаётся узким блоком у левого края. */ align-items: stretch; } .site-footer__top { order: 1; } .site-footer__end { display: contents; } .site-footer__line { display: none; } .site-footer__ticket { order: 3; margin-top: 20px; } .site-footer__sign { order: 4; margin-top: 12px; padding-top: 0.75rem; } } /* Талон: перфорация по левому краю, дата в одну строку. */ .site-footer__ticket { position: relative; display: grid; align-content: center; gap: 0.85rem; padding: clamp(1.35rem, 2.4vw, 1.9rem); padding-left: clamp(2.5rem, 4vw, 3.5rem); border: 1px solid var(--line-strong); border-radius: var(--radius-lg); background: var(--glass); backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat)); -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat)); box-shadow: var(--glass-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.08); } .site-footer__ticket::before { content: ''; position: absolute; left: clamp(1.1rem, 1.8vw, 1.6rem); top: 1.1rem; bottom: 1.1rem; width: 1px; background: repeating-linear-gradient(180deg, var(--line-strong) 0 5px, transparent 5px 11px); } .site-footer__ticket-key { color: var(--color-text-muted); font: 900 var(--text-2xs)/1 var(--font-ui); letter-spacing: var(--ls-caps); text-transform: uppercase; } .site-footer__date { color: var(--color-text); font: 500 clamp(38px, 4.2vw, 68px)/1 var(--font-mono); font-variant-numeric: tabular-nums; letter-spacing: -0.02em; } .site-footer__date i { font-style: normal; color: rgba(243, 240, 234, 0.3); } .site-footer__ticket-note { color: rgba(243, 240, 234, 0.72); font-size: var(--text-sm); line-height: 1.5; } .site-footer__copy { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 0.45em; font-size: var(--text-sm); line-height: 1.5; } @media (min-width: 900px) { /* Вторая колонка остаётся пустой — талон вынут из потока, — но держит ширину, чтобы текст под него не заезжал. */ .site-footer__cols { --footer-gap: clamp(2rem, 5vw, 4.5rem); grid-template-columns: minmax(0, 1fr) clamp(160px, 15vw, 230px); column-gap: var(--footer-gap); row-gap: 0; padding-right: 0; } .site-footer__top { grid-column: 1; } /* Строка разделов + копирайт на всю ширину: © у правого края экрана (с учётом --footer-edge), как у талона «Финал». */ .site-footer__end { grid-column: 1 / -1; } .site-footer__copy { margin-left: auto; text-align: right; } /* Талон встык с краем экрана: правой границы нет, скруглены левые углы. Печать идёт вдоль полосы, как на настоящем отрывном талоне: writing-mode разворачивает сетку — строки становятся колонками справа налево, «Финал» оказывается у внешнего края, пояснение уходит к перфорации. Читается наклоном головы вправо, порядок строк при этом сохраняется. */ .site-footer__ticket { position: absolute; top: 0; right: 0; width: clamp(160px, 15vw, 230px); writing-mode: vertical-rl; align-content: center; justify-content: center; justify-items: center; border-right: 0; border-radius: var(--radius-lg) 0 0 var(--radius-lg); padding-right: clamp(1.5rem, 3vw, 2.5rem); } /* В вертикали кегль даты меряется не шириной плашки, а высотой левой колонки: «12.11.2026» набирается вдоль неё и на прежних 68px не влезло бы. */ .site-footer__date { font-size: clamp(30px, 3.4vw, 56px); } } /* После базового .site-footer__copy (align-items: baseline) — иначе центрирование на мобиле перебивается правилом выше по файлу. */ @media (max-width: 720px) { .site-footer { border-top: none; padding-bottom: calc(0.85rem + env(safe-area-inset-bottom, 0px)); } .site-footer__ticket { justify-items: center; text-align: center; } .site-footer__ticket-key, .site-footer__date, .site-footer__ticket-note { text-align: center; } .site-footer__sign { width: 100%; justify-content: center; } .site-footer__sign::before { display: none; } .site-footer__copy { display: flex; width: 100%; box-sizing: border-box; flex-direction: column; flex-wrap: nowrap; align-items: center; justify-content: center; gap: 0.2rem; margin-left: 0; text-align: center; } .site-footer__copy > span { display: block; width: 100%; text-align: center; } }