/*! First Clip — мелкие CSS-правки поверх живого бандла (без пересборки).
 *  Подключается в dist/index.html: <link rel="stylesheet" href="/firstclip-fixes.css?v=1">
 *  Удалить — убрать тег <link> из index.html.
 *
 *  1) Мобильная шапка шире экрана (на 390 px страница раскладывалась на ~583 px).
 *     На узких экранах прячем дублирующую кнопку «Попробовать с фото» / «Студия»
 *     (они есть в hero и в «Меню»), уплотняем кнопки. На < 360 px прячем и «Войти»
 *     (пункт «Войти» есть в «Меню»).
 *  2) Ссылки в нижнем подвале сайта (footer.foot) стояли в одну строку без переноса
 *     и тоже расширяли страницу. Разрешаем перенос, увеличиваем зону нажатия.
 *  3) Планшеты 981–1199 px: пункты меню + кнопки не помещались в шапку (страница
 *     раскладывалась на ~1140 px). Прячем дублирующую кнопку «Попробовать с фото»
 *     (для гостя; «Студия» у вошедшего остаётся) и чуть уплотняем меню.
 *  4) Первый экран (hero) прижат к левому краю (x = 0) на всех ширинах: правило
 *     .hero-grid{width:100%} перебивает ширину .page-pad. Возвращаем ограничение ширины
 *     и боковые отступы (1200 px, чтобы логотип «First Clip» оставался в одну строку).
 */
.hero > .page-pad.hero-grid { width: min(1200px, calc(100% - 40px)); margin-left: auto; margin-right: auto; }
@media (min-width: 981px) and (max-width: 1199px) {
  .nav-end > a.btn-primary[href="/try"] { display: none; }
  .nav { padding-left: 20px; padding-right: 20px; }
  .nav-links { gap: 16px; font-size: 13.5px; }
}
.foot nav { flex-wrap: wrap; row-gap: 4px; }
@media (max-width: 640px) {
  .foot { padding-left: 16px; padding-right: 16px; }
  .foot nav { column-gap: 14px; }
  .foot nav a { display: inline-block; padding: 8px 0; }
}
@media (max-width: 640px) {
  .nav { gap: 10px; }
  .nav .brand { flex-shrink: 0; white-space: nowrap; }
  .nav-end { gap: 8px; min-width: 0; }
  .nav-end > a.btn-primary { display: none; }
  .nav-end > .btn,
  .nav-end > a.btn,
  .nav-end > .menu-btn { padding-left: 12px; padding-right: 12px; }
}
@media (max-width: 359px) {
  .nav-end > a.btn-ghost[href="/login"] { display: none; }
  .nav .brand { font-size: .95rem; gap: 8px; }
}

/* fc-mobile-smooth: no floating/blur on phones */
@media (max-width: 980px) {
  .clip-stage.on .clip-still, .try-still, .clip-still { animation: none !important; transform: none !important; }
  .nav, .pill, .share-overlay, .pay-overlay { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
}

/* fc-trial-packs */
@media (min-width: 981px) { .packs { grid-template-columns: repeat(4, 1fr) !important; } }