/* =========================================================================
   /seo/ — страница SEO-продвижения. Базовый слой (токены, кнопки, шапка,
   футер, FAQ, форма) — /home/assets/home.css; здесь только общее для секций /seo/.
   Секционные стили — в assets/css/NN-slug.css. Все классы — с префиксом seo-.
   ========================================================================= */

/* ---------- общие утилиты ---------- */
.fmf2 .seo-nowrap{white-space:nowrap}

/* .seo-cut — рамка из линий с «разрывами» на углах (как .geo-cut): каждая ячейка
   рисует 4 линии с отступом --cut от углов. Соседние ячейки в сетке перекрываются
   на 1px (margin -1px), общие линии совпадают. */
.fmf2 .seo-cut{--cut:8px;--cut-c:var(--c-line);position:relative}
.fmf2 .seo-cut::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(var(--cut-c),var(--cut-c)) var(--cut) 0/calc(100% - 2 * var(--cut)) 1px no-repeat,
    linear-gradient(var(--cut-c),var(--cut-c)) var(--cut) 100%/calc(100% - 2 * var(--cut)) 1px no-repeat,
    linear-gradient(var(--cut-c),var(--cut-c)) 0 var(--cut)/1px calc(100% - 2 * var(--cut)) no-repeat,
    linear-gradient(var(--cut-c),var(--cut-c)) 100% var(--cut)/1px calc(100% - 2 * var(--cut)) no-repeat}
.fmf2 .section--dark .seo-cut{--cut-c:#48474B}

/* ---------- ленты (assets/js/slider.js) ----------
   Трек — горизонтальный scroll-snap без полосы прокрутки; точки и стрелки под лентой.
   Цвета управления задаются переменными, у тёмных секций свои. */
.fmf2 .seo-slider__track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.fmf2 .seo-slider__track::-webkit-scrollbar{display:none}
.fmf2 .seo-slider__track > *{scroll-snap-align:start;flex:0 0 auto}
.fmf2 .seo-slider__controls{--sl-off:var(--c-line);--sl-line:var(--c-line);
  display:flex;align-items:flex-end;justify-content:space-between;margin-top:24px;
  padding-bottom:16px;border-bottom:1px solid var(--sl-line)}
.fmf2 .seo-slider__controls[hidden]{display:none}
.fmf2 .section--dark .seo-slider__controls{--sl-off:#48474B;--sl-line:#48474B}
.fmf2 .seo-slider__dots{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.fmf2 .seo-slider__dot{width:6px;height:6px;padding:0;border:0;background:var(--sl-off);cursor:pointer;transition:width .2s ease,background .2s ease}
.fmf2 .seo-slider__dot.is-active{width:32px;background:var(--c-accent)}
.fmf2 .seo-slider__arrows{display:flex;gap:6px}
.fmf2 .seo-slider__arrow{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:0;
  background:var(--sl-off);color:#fff;cursor:pointer;transition:background .2s ease}
.fmf2 .seo-slider__arrow .ic-svg{width:24px;height:24px}
.fmf2 .seo-slider__arrow .ic-svg *{stroke:currentColor}
.fmf2 .seo-slider__arrow:hover:not(:disabled){background:var(--c-accent-grad)}
.fmf2 .seo-slider__arrow:disabled{opacity:.45;cursor:default}
/* светлые секции (Figma 388:3996, 388:6198): точки rgba(102,87,194,.2), доступная стрелка — фиолетовая */
.fmf2 .section:not(.section--dark) .seo-slider__dot:not(.is-active){background:rgba(102,87,194,.2)}
.fmf2 .section:not(.section--dark) .seo-slider__arrow:not(:disabled){background:var(--c-accent)}
.fmf2 .section:not(.section--dark) .seo-slider__arrow:not(:disabled):hover{background:var(--c-accent-grad)}
.fmf2 .section:not(.section--dark) .seo-slider__arrow:disabled{opacity:1;background:var(--c-line)}
@media (max-width:640px){
  /* зона нажатия стрелок — 44px (ТЗ, п. 5) */
  .fmf2 .seo-slider__arrow{width:44px;height:44px}
}
@media (prefers-reduced-motion:reduce){
  .fmf2 .seo-slider__dot,.fmf2 .seo-slider__arrow{transition:none}
}