/* ===== Правки 02.10.2026 ===== */ /* ===== Правки 02.10.2026, часть 2 ===== */ /* 1. СТРАНИЦА «ПЛАВАЛА» ПАЛЬЦЕМ ВБОК. На телефоне Chrome расширял layout viewport с 375 до 532 px: страницу можно было сдвинуть пальцем и увидеть чёрное поле справа. Расширение вызывают два блока — лента тарифов #prices>.wrap (прокручиваемая .tar шире контейнера) и плитки .tiles.c3. contain:paint обрезает именно это переполнение; overflow-x:clip не помогает, а на html он вдобавок ломает position:sticky (см. предупреждение выше). */ @media (max-width:620px){ #prices > .wrap{contain:paint} .tiles.c3{contain:paint} } /* 2. АРХИВ: папка выше, каналы отправки под ней, подпись под каналами. Каналы стояли в потоке и ложились на папку, а подпись «Отправка архива…» уезжала под самый низ. Ниже мессенджеры встают в поток, а у сцены появляется запас снизу (--archto) — его считает fitArch в ad-sv-fix.js. */ @media (max-width:620px){ /* Каналы встают по координате от низа папки (--archtop считает ad-sv-fix.js), а не в потоке — иначе ложились прямо на неё. Селектор по id: ниже есть такое же правило для .archto в потоке, и оно перебивало бы это по порядку. */ #archTo{position:absolute;left:0;right:0;width:auto;transform:none; top:var(--archtop,250px);margin-top:0;gap:12px} .arch-stage{padding-bottom:var(--archtail,190px)} .arch-cap{margin-top:12px} .arch-steps{margin-top:12px;margin-bottom:26px} } /* 3. ЛОГОБУК: подпись формата — в правый верхний угол и мельче. Внизу слева она налезала на расширение файла. */ @media (max-width:620px){ .af.is-book .af-badge{place-items:start end;padding:6% 6% 0 0} .af.is-book .af-badge b{padding:2px 6px;border-radius:4px; font-size:clamp(7px,.62cqw,10px);letter-spacing:.06em} } /* 3a. Блок «21 файл и логобук»: плашка «1 файл» / «отдельная поставка · PDF» на телефоне была во всю ширину и наезжала на название формата. Уменьшаем, а место под неё резервирует ad-sv-fix.js — по реальной ширине. */ @media (max-width:760px){ .file{padding:18px 14px 16px} .file-sz{top:10px;right:10px;font-size:9.5px;font-weight:600; padding:3px 8px;line-height:1.25;max-width:calc(100% - 20px)} .file-ext{padding-right:0;font-size:15px} } /* 4. ИЗБРАННЫЕ ЗНАКИ НА ТЕЛЕФОНЕ. Подпись знака была прижата к низу квадрата и накрывала сам знак — теперь это обычная строка под картинкой, квадрат стал прямоугольным. Стрелки заменены полосой прокрутки: занимали место и ничего не говорили. */ @media (max-width:620px){ .pick-card{flex:0 0 min(300px,80vw);aspect-ratio:auto;min-height:300px; padding:20px 20px 0;display:flex;flex-direction:column;align-items:center; justify-content:flex-start} .pick-card img{max-width:100%;max-height:210px;flex:0 0 auto} .pick-card .pc-cap{position:static;margin-top:auto;padding:14px 0 16px; background:none;font-size:12.5px;text-align:center} .pick-card .pc-cap b{display:block} .pick-ctrl{margin-top:16px;margin-bottom:34px; display:grid;justify-items:center;gap:16px} .pick-ctrl .pad{display:none} .pick-ctrl .pick-n{margin-left:0;text-align:center;font-size:12px} /* Полоса занимает всю ширину панели, а не схлопывается в ноль flex-элементом */ .pick-ctrl .pick-bar{width:100%;margin:0} /* Крестик и подпись — на своих местах, поверх картинки ничего нет */ .pick-top{padding:12px 14px;background:rgba(6,6,7,.92)} .pick-view figure{border-radius:18px} .pick-cap{padding-bottom:6px} } /* Полоса прокрутки ленты «Избранные знаки» */ .pick-bar{position:relative;height:4px;border-radius:2px;background:rgba(255,255,255,.14); margin:0 12px;overflow:hidden;cursor:pointer} .pick-bar i{position:absolute;top:0;left:0;bottom:0;width:22%;border-radius:2px; background:var(--acc);transform-origin:left center; transition:transform .18s linear} @media (min-width:621px){ .pick-bar{display:none} } /* 5. ПОЯСНЕНИЕ МОДУЛЯ ART-OS — ПОД НАЖАТЫМ БЛОКОМ. Пояснение больше не полоса под сеткой, а отдельная строка самой сетки: ad-sv-fix.js переносит .chip-exp-row сразу после последнего блока того ряда, который нажали, и растягивает на всю ширину (grid-column:1/-1). Ряды ниже сдвигаются вниз ровно на высоту пояснения — блоки раздвигаются, но по горизонтали не едут. Почему не иначе. Пока .chip-exp был последним элементом .chip-legend, авторазмещение сетки уводило его в последний ряд: клик по 02 показывал пояснение внизу, у блока 09. Вариант с position:absolute и зарезервированным padding-bottom убирал пояснение из потока совсем — блоки не двигались ни на пиксель, чего не просят. Обёртка —
  • , а не
    : внутри
      допустим только
    1. , иначе разметка невалидна. Сам .chip-exp, который создаёт ad-sv.js, живёт внутри обёртки, и ссылка скрипта на него остаётся рабочей. Рамки нет — это подпись, а не карточка. Отступ сверху и снизу даёт margin плюс ряд-gap сетки (10px на десктопе, 8px на телефоне), а внутри — padding у .chip-exp__in. */ .chip-exp-row{grid-column:1/-1;display:none;list-style:none;margin:4px 0} .chip-exp-row.is-shown{display:block} /* Появление и уход. Анимируем содержимое, а не высоту: строка сетки меняет размер сразу, блоки под ней расходятся мгновенно, а текст доезжает — без «прыжка» высоты в момент открытия. */ .chip-exp-row.is-shown .chip-exp__in{animation:svExpIn .32s var(--ease) both} .chip-exp-row.is-out .chip-exp__in{animation:svExpOut .26s ease both} @keyframes svExpIn{from{opacity:0;transform:translateY(-9px)}to{opacity:1;transform:none}} @keyframes svExpOut{from{opacity:1}to{opacity:0}} /* Снимаем оформление ad-sv.css: рамка, заливка, max-height:0 и opacity:0 там заданы, и без этого строка схлопывалась бы в ноль. */ .chip-exp-row .chip-exp{margin:0;max-height:none;opacity:1;overflow:visible; background:none;border:0;border-radius:0;box-shadow:none} .chip-exp-row .chip-exp__in{padding:5px 2px} /* Заголовок и описание пояснения — отдельные строки. Без этого они слипались в одно («СтратегияПозиционирование, ценности…»). */ .chip-exp-row .chip-exp__t, .chip-exp-row .chip-exp__d{display:block} /* 5a. ГЕРОЙ: убрать подпрыгивающую подпись. В .hero-beat ad-sv.js по очереди пишет названия и описания модулей («Модульная сетка — сначала задаю поле…», «Объём — та же геометрия, только повёрнутая…»). Длины разные — от одной строки до трёх, — и весь первый экран подпрыгивал при каждой смене кадра. По просьбе текст убран: остаётся сам знак. Скрипт продолжает писать в скрытый узел, на геометрию это не влияет — размеры он не читает. */ .hero-beat{display:none} /* 6. ПОРТФОЛИО: клик по логотипу открывает окно просмотра. По просьбе подложка квадратная, знак по центру, а кнопка «Открыть проект» из окна убрана (см. ad-sv-fix.js). */ .lcard{cursor:zoom-in} /* figure обтягивался по картинке, и знак 360x85 лежал полосой 4:1. Теперь подложка всегда квадрат, знак вписан в неё по центру. 620px — потолок, чтобы знак не раздувался мылом на больших мониторах. */ .lbx figure{ aspect-ratio:1/1; width:min(100%, 100svh - 2*clamp(16px,4vw,56px), 620px); max-width:100%;max-height:100%;height:auto; padding:clamp(14px,3.6vmin,46px); } .lbx img{width:100%;height:100%;max-width:none;max-height:none; object-fit:contain;object-position:50% 50%} /* 7. Полный экран избранного знака: картинка не показывается, пока не вписана в рамку — иначе на первом кадре мелькал обрезанный логотип. */ .pick-view img{opacity:0;transition:opacity .16s linear} .pick-view img.is-fit{opacity:1} /* ВНИМАНИЕ. Не ставить на html ни overflow-x:hidden, ни overflow-x:clip. Проверено на живой странице 02.10.2026: clip на html ОТКЛЮЧАЕТ position:sticky у потомков — герой перестаёт прилипать (pin.top уехал на -2037 вместо 0), и вся прокручиваемая анимация разваливается. Горизонтальное переполнение на блоке тарифов лечить иначе. */ /* Плавающая панель: её left:50% считался от раздутой ширины и уводил панель вправо. Прибиваем к краям экрана. */ @media (max-width:620px){ .mega,.mega-in,.sheet,.sheet-bd,.sheet-in, .pick-full,.pick-top,.pick-view{max-width:100vw !important} .mega-in,.sheet-in{width:100% !important} .dock{left:10px !important;right:auto !important; width:calc(100vw - 20px) !important;max-width:calc(100vw - 20px) !important; transform:none !important} .dock-r{min-width:0;flex-wrap:wrap} } /* ДОК 02.10.2026 (правка dock на 375). При глубокой прокрутке Chrome расширяет layout viewport: innerWidth становится 532, clientWidth и visualViewport остаются 375. Причина — переполнение по X в блоке тарифов #prices (.tar с отрицательными полями и scroll-контентом 968px), которое Chrome компенсирует расширением ICB вместо горизонтальной прокрутки (body{overflow-x:hidden} уходит на вьюпорт, поэтому scrollX всегда 0). Из-за этого dock с left:10px;right:10px растягивался до 512px и уходил за край: кнопка «Обзор» обрезалась (right 406 при экране 375), «Обсудить» была полностью за экраном (left 414, right 513). Лечится шириной в vw, а не в left/right: vw считается от visualViewport (всегда 375) и не раздувается. Проверено на боевой странице: dock 355px, обе кнопки в кадре (Обзор 158–249, Обсудить 257–356), состояние одинаково наверху, в середине и внизу; sticky-герой не сломан (position:sticky и top:0 на месте). */ /* В архиве каналы отправки стояли абсолютом (top:64%) и на невысоком экране наезжали на подпись «Отправка…» и на точки тактов. */ @media (max-width:620px){ .archto{position:static;left:auto;top:auto;transform:none;width:100%;margin-top:12px} .arch-cap{margin-top:10px} .arch-steps{margin-top:12px;margin-bottom:4px} } /* ---------- полный экран знака на телефоне ---------- Четыре жалобы, одна причина: колонка .pick-full — flex, и при нехватке высоты дети сжимаются, а не выносятся наружу. 1) Белая карточка логотипа на 375px: ширина 347px, aspect-ratio 1/1 даёт высоту 347px, но блок .pick-view — 340px. Карточка вылезала на ~4px и накрывала подпись «Берёзка · ресторан» — белым по белому. Лечится потолком 100% и клипом внутри .pick-view. 2) .pick-thumbs требует 48px миниатюры + 18px отступа снизу = 66px, а получал 49px. Отступ съедался, логотипы липли к самому краю экрана. Лечится flex:0 0 auto — блок перестаёт сжиматься. 3) Стрелки ‹ › — это .pick-nav. На телефоне лишние: листает свайп по логотипу и миниатюры. Убираем. 4) inset:0 на iOS — это layout viewport, он ВЫШЕ видимой области, когда адресная строка Safari не убрана. Нижняя часть уходила под панель браузера, а body уже заблокирован (overflow:hidden) — прокрутиться и закрыть оверлей было нечем. 100dvh берёт реально видимую высоту, safe-area отодвигает края от чёлки и «дома». */ .pick-full{ height:100vh; height:100dvh; /* видимая высота, без полосы Safari */ padding-top:env(safe-area-inset-top); padding-bottom:env(safe-area-inset-bottom); overflow-y:auto; /* страховка: не влезло — прокрутится */ overscroll-behavior:contain; } .pick-top{flex:0 0 auto} .pick-view{flex:1 1 auto;min-height:200px;overflow:hidden} .pick-view figure{max-height:100%} /* карточка не вылезает в подпись */ .pick-meta{flex:0 0 auto} .pick-cap{padding-top:14px} /* подпись не липнет к логотипу */ .pick-thumbs{flex:0 0 auto;padding-bottom:18px} @media (max-width:640px){ .pick-nav{display:none} /* стрелки на телефоне не нужны */ .pick-thumbs{padding-bottom:max(18px,calc(env(safe-area-inset-bottom) + 8px))} } /* На телефоне safe-area уже учтена на самом оверлее — второй раз не отодвигаем */ @media (max-width:640px) and (padding:0px){ .pick-thumbs{padding-bottom:18px} } /* ---------- 12 знаков: логотип по центру квадрата ---------- .pick-card — flex-колонка высотой 300px. align-items:center центрирует по горизонтали, а по вертикали стоит flex-start, поэтому картинка прижималась к верхнему краху (y=20), подпись уходила вниз (y=234), а между ними зияли 153 пустых пикселя — читалось как сломанный контейнер. Авто-margin'ы разбирают свободное место поровну и ставят логотип в середину той области, что над подписью. */ @media (max-width:620px){ .pick-card > img{margin-top:auto;margin-bottom:auto} /* У .pc-cap был свой margin-top:50.8px. Вместе с двумя auto у картинки свободное место делилось на троих, и логотип уезжал выше середины. Обнуляем — остаются ровно два auto, и центр сходится. */ .pick-card > .pc-cap{margin-top:0} } /* ---------- архив на телефоне: иконки не наезжают на текст ---------- .archto — absolute внутри .arch-box. На десктопе top:64%/72% попадает в свободное поле, а на 375px блок всего 276px, и иконки вылезали: начинались на 556px при нижней границе блока 584px, а кончались на 681px, тогда как «N из 21 файла» начиналась на 679px — наложение 2px. Опускаем ряд целиком под блок (top:100%) и уменьшаем иконки: 46px вместо 76px. Ряд становится ~72px и укладывается в промежуток 584…679 с запасом. По центру: justify-content:center. Иконки — часть скролл-анимации (opacity ставит ad-sv.js), поэтому блок остаётся absolute и в покое не занимает место. */ @media (max-width:620px){ /* .arch-stage даёт отступы по 20px, то есть доступно 335px, а .arch-box был задан в 92vw = 345px. Выходил за колонку на 10px вправо: рамка 20…365 вместо 20…355. Из-за этого иконки мессенджеров, отцентрованные внутри блока, уезжали на 5px вправо от центра экрана, и блок давал лишнее горизонтальное переполнение. 100% считается от полосы набора внутри отступов и всегда в неё помещается. */ .arch-box{width:min(560px,100%,58svh)} /* Положение ряда иконок задаёт #archTo{top:var(--archtop)} — это селектор по id, он перебивает любые правила по классу. Считает --archtop и --archtail функция fit() в ad-sv-fix.js. */ .archto{width:100%} .at-row{width:100%;gap:10px;justify-content:center} .at-c{gap:5px} /* Кружки с иконками мессенджеров делаем крупнее: 46px выглядели мелко на телефоне. 4×58 плюс три зазора по 10px = 262px — в колонку 335px помещается свободно. */ .at-c svg{width:58px;height:58px;padding:14px} .at-c b{font-size:12px;letter-spacing:0} /* Подпись шага убираем. Текст подставляет ad-sv.js (setCap) — на последнем шаге это «Отправка. Архив уходит вам на почту, в Telegram или WhatsApp — куда удобнее отвечать», и он висел прямо под иконками мессенджеров, о которых уже говорит сама строка с иконками. На телефоне он занимал 67px и ломал композицию. На десктопе оставляем. */ #archive .arch-cap{display:none} } /* Низкие экраны (iPhone SE и подобные — до 720px по высоте). Заголовок «Что вы получаете» на них занимает больше половины экрана, и сцене остаётся около 324px, тогда как блок с каналами требует больше: ряд иконок наезжал на счётчик «21 из 21 файла». Место берём у заголовка — он статичный. Сам .arch-box не трогаем: это container-type:size, от его высоты считается вся анимация, и любая перезапись дёргает раздел. */ @media (max-width:620px) and (max-height:720px){ .arch-pin{padding-top:calc(var(--nav) + 14px)} .arch-head{margin-bottom:6px} .arch-head .h2{font-size:24px} .arch-head .eye{margin-bottom:6px} .arch-sub{font-size:11.5px;margin-top:8px;line-height:1.4} } /* ---------- плашка PDF на строку с заголовком ---------- .af-badge лежит абсолютом внутри .af.is-book — обложки, которую ad-sv.js двигает через translate3d/scale/rotateY. Вытащить её оттуда средствами CSS нельзя: она повязана с трансформацией обложки. Поэтому на телефоне прячем её и рисуем такую же метку рядом с заголовком раздела. По просьбе: текст оранжевый, а не серый, и вдвое короче прежней (24x17 с красной заливкой -> компактная метка в рамке). */ @media (max-width:620px){ .af.is-book .af-badge{display:none} #archive .arch-head .h2{display:inline-block} #archive .arch-head .h2::after{ content:'PDF'; display:inline-block;vertical-align:middle; margin-left:10px;padding:2px 8px; font-size:11px;font-weight:700;letter-spacing:.08em;line-height:1.4; color:#ff9a00; background:rgba(255,154,0,.12); border:1px solid rgba(255,154,0,.34); border-radius:6px; } } /* На десктопе .chipwrap — две колонки с align-items:center. Когда полоса раскрывается, легенда становится выше и вся сетка центрируется заново: блоки уезжают вверх. Легенду прибиваем к верху строки, а картинку чипа оставляем по центру — сдвигается только она, и то незаметно: знак всё равно анимируется при прокрутке. */ @media (min-width:901px){ .chipwrap{align-items:start} .chipwrap > .chip{align-self:center} } /* ---------- «21 файл и логобук»: плашка на строку с «Логобук» ---------- На узких экранах ad-sv.css ставит .lb-tag абсолютом (position:absolute;right:22px;top:22px) — плашка уезжала в правый верхний угол карточки, на 200px выше слова «Логобук». Возвращаем её в поток и ставим в ту же строку, что и заголовок: «Логобук» слева, плашка справа. Заодно мельче: на телефоне она занимала 187x23px. */ @media (max-width:760px){ .file-lb{ grid-template-columns:auto minmax(0,1fr); grid-template-areas: "cover cover" "ext tag" "d d" "list list" "why why"; column-gap:12px; } .file-lb .lb-tag{ position:static;right:auto;top:auto;margin:0; justify-self:end;align-self:center; font-size:7px;letter-spacing:.06em;padding:2px 8px; } } /* ---------- «Логобук»: плашка «PDF · передаётся файлом» как «Отдельная поставка · PDF» Эталон — плашка .lb-tag у слова «Логобук» в карточке блока «21 файл»: обводка 1px rgba(254,74,35,.42), радиус 980px, шрифт 10px, letter-spacing .07em, отступы 3px/9px. На обложке стоял другой элемент (.cover-pdf из ad-sv.css — заливка, радиус 99px, 11.5px, 5px/11px), и два рядом стоящих «PDF» выглядели как разные кнопки. Теперь обложечная плашка повторяет эталон, а на телефоне обе уменьшаются одинаково: 7px и 2px/8px. Короткая плашка «PDF» на плитке галереи не тронута — её задаёт .gcard .gcover .cover-pdf, и её переопределяет правило ниже. */ .cover-body .cover-pdf{ font-size:10px;letter-spacing:.07em; padding:3px 9px;border-radius:980px; border:1px solid rgba(254,74,35,.42); } @media (max-width:760px){ .cover-body .cover-pdf{font-size:7px;letter-spacing:.06em;padding:2px 8px} } /* ---------- шапка: иконки мессенджеров рядом с бургером ---------- В шапке стояли только трубка и конверт. Теперь там весь набор из подвала (Telegram, WhatsApp, Instagram, почта, телефон) — пять кнопок плюс бургер на 375px не влезали, поэтому на телефоне они мельче, а зазор между ними меньше. */ @media (max-width:620px){ .gnav-ic{gap:3px} .gnav-ic .icbtn,.gnav-ic .burg{width:30px;height:30px} .gnav-ic .icbtn svg{width:16px;height:16px} .gnav-ic .burg i{left:8px;width:14px} } /* ---------- ТЕЛЕФОН: СТРАНИЦА НЕ ДЁРГАЕТСЯ И НЕ ЗУМИТСЯ ---------- Две жалобы на iPhone, одна причина в основе — браузер отдавал жест масштабированию и ленте самой. 1) Двойной тап (на стрелку, на блок, на карточку) увеличивал страницу. В метатеге стоит только width=device-width, initial-scale=1 — масштабирование не запрещено, значит двойной тап его запускает. touch-action:manipulation отключает именно двойной тап, но НЕ щипок: пинч-зум (приближение щипком) остаётся. Ставить user-scalable=no и maximum-scale=1 нельзя — это ломает доступность (WCAG 1.4.4: страницу обязан уметь увеличить и человек с нарушением зрения). 2) Зажал и повёл влево-вправо — страницу мотало. Ленты внизу — обычные горизонтальные прокрутки, но у .pick-rail стоял scroll-snap-type:x mandatory. Он не «держит» палец, а после отпускания притягивает ленту к ближайшей карточке, из-за чего жест выглядит как рывок. Смягчили до proximity — лента по инерции, без притягивания. Остальные ленты уже были на proximity. overscroll-behavior-x:none гасит горизонтальный резиновый отскок на краях документа (свайп от левого края конфликтует с жестом «назад»). На html/body ставим ТОЛЬКО его: overflow-x на html здесь нельзя — он ломает position:sticky у героя (см. предупреждение выше). */ html,body{ touch-action:manipulation; overscroll-behavior-x:none; } .pick-rail{scroll-snap-type:x proximity} /* 08.10.2026: шапка — иконки как в подвале, номер телефона текстом на компьютере, порядок: звонок → мессенджеры → почта → соцсеть */ .gnav-ic .icbtn{width:40px;height:40px} .gnav-ic .icbtn svg{width:24px!important;height:24px!important} .gnav-ic .icbtn__num{display:none} @media(min-width:1024px){.gnav-ic .icbtn--tel{width:auto;padding:0 12px 0 8px;border-radius:999px;display:inline-flex;align-items:center;gap:8px;color:#f5f5f7;text-decoration:none} .gnav-ic .icbtn--tel .icbtn__num{display:inline;font-size:14px;font-weight:500;white-space:nowrap}} @media(max-width:768px){.gnav-ic .icbtn{width:36px;height:36px}.gnav-ic .icbtn svg{width:22px!important;height:22px!important}} /* «Решения для ниш» — строки с иконкой, как модули ART-OS: без фоновых картинок и описаний */ .niches{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .niche{aspect-ratio:auto;flex-direction:row;align-items:center;justify-content:flex-start;gap:12px;padding:10px 14px 10px 10px;min-height:0;border-radius:14px} .niche:hover{transform:none;background:#2a2a2d} .niche .ic{position:static;display:flex;align-items:center;justify-content:center;width:36px;height:36px;flex:0 0 36px;border-radius:50%;background:#000;color:#fff} .niche .ic svg{width:22px;height:22px} .niche .tx{flex:1;min-width:0} .niche .tx b{font-size:15px;font-weight:500} .niche .n{position:static;order:3;background:none;padding:0;color:var(--acc,#fe4a23);font-size:13px;font-weight:600} @media(max-width:768px){.niches{grid-template-columns:1fr}} /* 11.10 — узкие Android (Samsung с крупным системным шрифтом = экран ~320px): ничего не вылезает вбок */ /* html{overflow-x:clip} НЕЛЬЗЯ: body перестаёт отдавать прокрутку окну — ломаются sticky (герой, нижняя кнопка, стопка до/после) */ @media (max-width:760px){ .lf-time{white-space:normal} .lf-time *{white-space:normal} } @media (max-width:560px){ .pill{white-space:normal;text-align:center;line-height:1.25;max-width:100%} .cmp-price{white-space:normal} .zip-b,.zip-b i{white-space:normal;max-width:100%} /* карточки файлов в две колонки: иконка над текстом, а не сбоку — иначе на текст остаётся 65px */ .file:not(.file-lb){grid-template-columns:1fr;grid-template-areas:"ic" "ext" "d" "sz" "go" "more";padding:16px 14px} .file:not(.file-lb) .file-ic{align-self:start;margin-bottom:8px} .file:not(.file-lb) .file-ext{padding-right:0;align-self:start} .file:not(.file-lb) .file-d{overflow-wrap:anywhere} /* межблочные отступы: на телефоне 224px пустоты читались как пропавший блок */ .svk .sec{padding:84px 0} .svk .sec.tight{padding:64px 0} }