/* АплАрт — телефонная версия. Подключается последней и действует только до 767 px.
   Принципы: заголовки читаются с первого взгляда, но не занимают весь экран;
   парные блоки стоят по два в ряд; длинные ряды превращаются в ленты под палец. */

@media (max-width: 767px) {

  :root { --gutter: 16px; --header: 56px; }
  body { font-size: 15px; }

  /* ---------- Шапка и меню ---------- */
  .header, .header.is-solid { height: 56px; gap: 10px; }
  .hdr-meta { display: none; }
  .logo { font-size: 22px; gap: 8px; }
  .logo-mark { width: 24px; height: 24px; }
  .burger { width: 44px; height: 44px; border-radius: 0; background: none; margin-left: auto; margin-right: -8px; }
  .burger i { left: 10px; right: 10px; height: 2px; }
  .burger i:first-child { top: 17px; }
  .burger i:last-child { top: 25px; right: 18px; transition: transform 0.4s var(--e-out), top 0.4s var(--e-out), right 0.3s var(--e-out); }
  .menu-open .burger i:first-child, .menu-open .burger i:last-child { top: 21px; right: 10px; }

  .drawer { padding: calc(var(--header) + 8px) var(--gutter) calc(20px + env(safe-area-inset-bottom)); background: var(--bg); }
  .drawer nav { counter-reset: nav; border-top: 1px solid var(--line); }
  .drawer nav a {
    counter-increment: nav;
    display: flex;
    align-items: baseline;
    gap: 14px;
    padding: 14px 0 10px;
    font-family: var(--poster);
    font-weight: 900;
    font-size: 44px;
    line-height: 0.9;
    letter-spacing: 0;
    text-transform: uppercase;
    border-bottom: 1px solid var(--line);
    transform: translateY(14px);
    opacity: 0;
    transition: transform 0.5s var(--e-out), opacity 0.4s;
  }
  .drawer nav a::after { content: "→"; margin-left: auto; font-family: var(--font); font-weight: 400; font-size: 22px; color: var(--faint); }
  .menu-open .drawer nav a { transform: none; opacity: 1; }
  .menu-open .drawer nav a:nth-child(2) { transition-delay: 0.04s; }
  .menu-open .drawer nav a:nth-child(3) { transition-delay: 0.08s; }
  .menu-open .drawer nav a:nth-child(4) { transition-delay: 0.12s; }
  .menu-open .drawer nav a:nth-child(5) { transition-delay: 0.16s; }
  .drawer-foot { gap: 10px; font-size: 14px; }
  .drawer-foot a:first-child { font-size: 22px; font-weight: 700; color: var(--fg); letter-spacing: -0.02em; }
  .drawer-foot .btn { height: 52px; margin-top: 8px; }

  /* плавающий билет: компактнее и не закрывает текст */
  .tcta { right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); grid-template-columns: auto 38px; }
  .tcta-main { padding: 7px 11px 8px; }
  .tcta-main small { display: none; }
  .tcta-main b { font-size: 13px; }
  .tcta-stub { font-size: 15px; }

  /* ---------- Размеры текста ---------- */
  .h2 { font-size: 12.5vw; }
  .page-title { font-size: 15vw; }
  .signup-title { font-size: 14vw; }
  .curtain-word { font-size: 22vw; }
  .poster-title { font-size: 19vw; }
  .lead { font-size: 16px; }
  .cue { font-size: 9.5px; margin-bottom: 10px; }
  .sec-head { gap: 14px; margin-bottom: 32px; }
  .sec, section.tone-paper, section.tone-red { padding-top: 64px !important; padding-bottom: 64px; }
  .statement-text { font-size: 26px; line-height: 1.12; }
  .quote-body p { font-size: 26px; }
  .rv-big { font-size: 30px; }
  .rv-full { font-size: 14px; }
  .step-body h3 { font-size: 34px; }
  .step-num { font-size: 56px; margin-bottom: 4px; }
  .step-body p { font-size: 15px; }
  .teacher h3 { font-size: 30px; overflow-wrap: anywhere; }
  .gain b { font-size: 40px; }
  .gain span { font-size: 15px; }
  .rep-title { font-size: 30px; }
  .film-title span { font-size: 17vw; }
  .ticker { padding: 10px 0 8px; }
  .ticker-track span { font-size: 10vw; }
  .ticker-track { animation-duration: 26s; gap: 22px; padding-right: 22px; }
  .ticker-track i { width: 12px; height: 12px; }
  .tk-title { font-size: 32px; }
  .tk-price b { font-size: 30px; }
  .acc summary { font-size: 30px; padding: 18px 0; }
  .acc summary::after { width: 38px; height: 38px; font-size: 20px; }
  .age h3, .plan-body h3, .course h3 { font-size: 30px; }
  .booked-title { font-size: 32px; }
  .signup .contacts .big { font-size: 24px; }
  .form { padding: 20px 16px; }

  /* ---------- Первый экран: входы в одну строку ---------- */
  .intro .hero-foot { gap: 16px; }
  .intro .doors { grid-template-columns: auto auto; column-gap: 22px; justify-content: start; }
  .intro .doors .label { grid-column: 1 / -1; font-size: 10px; margin-bottom: 6px; }
  .intro .door { font-size: 11.5vw; }
  .now { padding-right: 0; }
  .now-show { font-size: 16px; }

  /* ---------- «Взрослым / Детям»: две карточки рядом ---------- */
  .split { flex-direction: row !important; height: auto !important; gap: 6px; padding: 6px; }
  .split-side { flex: 1 1 50% !important; height: 64svh !important; min-height: 420px !important; }
  .split-top { top: 12px; left: 12px; right: 12px; }
  .split-top .label:first-child { display: none; }
  .split-top .label { font-size: 10px; }
  .split-body { left: 12px; right: 12px; bottom: 12px; gap: 10px; }
  .split-body h2 { font-size: 11.5vw; }
  .split-list { display: none; }
  .split-cta { padding-top: 10px; gap: 8px; }
  .split-price { font-size: 15px; line-height: 1.1; }
  .split-price small { display: block; margin: 2px 0 0; font-size: 11px; }
  .split-go { width: 38px; height: 38px; font-size: 16px; flex: none; }

  /* ---------- Цифры школы 2×2 ---------- */
  .facts { grid-template-columns: 1fr 1fr; }
  .fact, .fact + .fact { padding: 18px 12px 18px 0; border-left: 0; margin-top: 0; border-top: 0; }
  .fact:nth-child(even) { padding-left: 14px; border-left: 1px solid var(--line); }
  .fact:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .fact b { font-size: 11vw; }
  .fact span { font-size: 13px; }

  /* ---------- Путь: карточки компактнее ---------- */
  .path-track { gap: 14px; }
  .step { padding: 12px; gap: 14px; }
  .step-photo { aspect-ratio: 16 / 10; }

  /* ---------- Ленты под палец: педагоги, возрастные группы ---------- */
  .teachers, .ages {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    margin: 0 calc(-1 * var(--gutter));
    padding: 0 var(--gutter) 6px;
    scroll-padding-inline: var(--gutter); /* без этого карточка прилипает к краю экрана */
    scrollbar-width: none;
  }
  .teachers::-webkit-scrollbar, .ages::-webkit-scrollbar { display: none; }
  .teacher, .age { flex: none; width: 78vw; scroll-snap-align: start; grid-column: auto !important; }
  .teacher p { font-size: 14px; }
  .teacher-photo { aspect-ratio: 4 / 5; }
  .disc { font-size: 10px; }
  .age-photo b { font-size: 16vw; }

  /* ---------- Отзывы ---------- */
  .rv { width: 82vw; min-height: 0; gap: 14px; padding: 20px; }
  .rv:nth-child(n) { --rot: 0deg; --lift: 0px; }

  /* ---------- Афиша ---------- */
  .poster { height: 62svh; }

  /* ---------- Репертуар: фильтры в одну строку ---------- */
  .filters { flex-wrap: nowrap; overflow-x: auto; margin: 0 calc(-1 * var(--gutter)); padding: 0 var(--gutter); scrollbar-width: none; }
  .filters::-webkit-scrollbar { display: none; }
  .filters button { flex: none; height: 38px; padding: 0 14px; font-size: 13px; }
  .rep-group { font-size: 11px; padding: 5px 9px; }

  /* ---------- Видео: главное широкое, остальные по два ---------- */
  .videos { grid-template-columns: 1fr 1fr !important; gap: 10px; }
  .video--main { grid-column: 1 / -1; }
  .videos .video:not(.video--main) { aspect-ratio: 4 / 5; }
  .video-row { grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
  .video-row .offer { grid-column: 1 / -1; }
  .video-play { padding: 12px; }
  .video-play .play { width: 40px; height: 40px; font-size: 14px; }
  .video-play b { font-size: 14px; }
  .video-play small { font-size: 11px; }
  .video .marks { display: none; }

  /* ---------- Контрамарки рядом ---------- */
  .deals { grid-template-columns: 1fr 1fr; }
  .deal { grid-template-columns: 1fr; gap: 8px; padding: 32px 12px 32px 0; align-items: start; }
  .deal + .deal { border-left: 1px solid var(--line); border-top: 0; padding-left: 14px; }
  .deal-num { font-size: 26vw; }
  .deal h3 { font-size: 7.4vw; }
  .deal p { font-size: 13px; }
  .deal-body .cue { font-size: 9px; }

  /* ---------- Билеты ---------- */
  .tk-main { padding: 16px 16px 18px; gap: 8px; }
  .tk-meta { gap: 6px; }
  .tk-meta dd { font-size: 13px; }
  .tk-sub { font-size: 14px; }

  /* ---------- Внутренние страницы ---------- */
  .page-meta { grid-template-columns: 1fr 1fr; gap: 12px; align-items: start; } /* перенос в одной ячейке не сдвигает соседнюю */
  .page-meta span { font-size: 11px; }
  .page-meta b { font-size: 14px; }
  .courses { grid-template-columns: 1fr 1fr; }
  .course { min-height: 0; padding: 16px; }
  .course h3 { font-size: 24px; }
  .course p { font-size: 13px; }
  .course--wide { grid-column: 1 / -1; }
  .mini-teacher { grid-template-columns: 72px 1fr; padding: 10px; gap: 12px; }
  .mini-teacher img { width: 72px; height: 72px; }
  .checks li { font-size: 15px; }

  /* ---------- Подвал: списки по два ---------- */
  .footer { grid-template-columns: 1fr 1fr; gap: 24px 16px; }
  .footer > :first-child, .footer .curtain-line, .footer-bottom { grid-column: 1 / -1; }
  .foot-logo img { width: 90px; height: 90px; }
}

@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  .drawer nav a { transform: none; opacity: 1; }
}

/* Размытие под шапкой и подписями на телефоне пересчитывается на каждом кадре прокрутки — заменяем плотной подложкой */
@media (max-width: 767px) {
  .header.is-solid { background: rgba(13, 12, 11, 0.94); backdrop-filter: none; -webkit-backdrop-filter: none; }
  .split-list span, .gallery figcaption { backdrop-filter: none; -webkit-backdrop-filter: none; background: rgba(13, 12, 11, 0.72); }
}

/* бывшие встроенные стили из разметки */
.sec.sec--flush { padding-top: 0; }
.footer .foot-about { margin-top: 14px; max-width: 32ch; }
.video.video--43 { aspect-ratio: 4 / 3; }
.video-row.video-row--flush { margin-top: 0; }
.offer.offer--auto { min-height: 0; }
.label.label--white { color: #fff; }
.offer .offer-h { font-size: clamp(28px, 2.4vw, 40px); }
.offer .offer-p { margin-top: 10px; }

/* Политика обработки персональных данных */
.legal { padding-top: calc(var(--header-h, 72px) + clamp(48px, 8vh, 96px)); padding-bottom: clamp(64px, 10vh, 120px); max-width: 860px; }
.legal .legal-title { color: var(--fg); font-family: var(--poster); font-weight: 900; text-transform: uppercase; font-size: clamp(44px, 6vw, 88px); line-height: 0.92; margin: 0 0 clamp(28px, 4vh, 48px); }
.legal h2 { color: var(--fg); font-size: 18px; font-weight: 700; margin: 36px 0 0; }
.legal p { margin: 12px 0 0; font-size: 15px; line-height: 1.65; color: var(--soft); }

/* Второй вариант цены в билете (детская группа, 1 раз в неделю) */
.tk-price.tk-price--alt { margin-top: 2px; }
.tk-price.tk-price--alt b { font-size: clamp(22px, 1.9vw, 30px); }