/* Start:/local/templates/floralmile/assets/css/formy-tovary.css?17876756289372*/
/* =========================================================================
   ОБЩИЕ БЛОКИ: товарная полоса из каталога и форма заявки.
   Подключаются и в разделе услуг, и в блоге. Один источник правды:
   держать копию в uslugi.css нельзя, правки разъедутся.
   ========================================================================= */
.fm-tovbl,.fm-zsec{--fm-font:'Montserrat',Arial,sans-serif}

/* =========================================================================
   ТОВАРЫ ИЗ КАТАЛОГА
   Карточка без своей красной кнопки: иначе ряд превращается в четыре
   одинаковых призыва и спорит с главной кнопкой страницы.
   ========================================================================= */
.fm-tovbl{margin:0 0 52px}
.fm-tovbl__shapka{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  padding:0 0 18px;border-bottom:1px solid #ededea;margin:0 0 24px}
.fm-tovbl__kicker{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:#c0392b}
.fm-tovbl__kicker::before{content:"";width:18px;height:1px;background:#e54e3a}
.fm-tovbl__h2{margin:10px 0 0;font-size:clamp(21px,2.1vw,27px);font-weight:400;line-height:1.2;color:#252525}
.fm-tovbl__p{margin:10px 0 0;max-width:640px;font-size:15px;line-height:1.65;color:#6f6f6f}
.fm-tovbl__vse{flex:0 0 auto;font-size:12.5px;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:#c0392b;white-space:nowrap;transition:color .16s}
.fm-tovbl__vse:hover{color:#e54e3a}
.fm-tovbl__ryad{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.fm-tovk{display:block;text-decoration:none;min-width:0}
.fm-tovk__pic{display:block;aspect-ratio:1/1;border-radius:12px;overflow:hidden;background:#f7f5f2}
.fm-tovk__pic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.fm-tovk:hover .fm-tovk__pic img{transform:scale(1.04)}
.fm-tovk__name{display:block;margin:14px 0 0;font-size:14.5px;line-height:1.45;color:#3f3f3f;
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.fm-tovk:hover .fm-tovk__name{color:#c0392b}
.fm-tovk__cena{display:block;margin:7px 0 0;font-size:16px;color:#252525}

/* =========================================================================
   ЗАЯВКА: единственный финал страницы
   Тёплая подложка, не серая. Форма внутри белая, тени нет.
   ========================================================================= */
.fm-zsec{margin:64px 0 0;padding:52px 46px 54px;border-radius:16px;
  background:#fbfaf8;border:1px solid #ededea}
/* ⭐ Колонки одной высоты (просьба Вени 25.08.2026): было слева 409px, справа 646px.
   Правая ужата, а левая тянется до её низа за счёт stretch. Провалов между строками
   маршрутов не делаем, вниз уходит только строка про города. */
.fm-zsec__in{display:grid;grid-template-columns:minmax(280px,0.85fr) minmax(420px,1.15fr);
  gap:clamp(36px,5vw,84px);align-items:stretch}
.fm-zsec__levo,.fm-zsec__pravo{display:flex;flex-direction:column}
.fm-zsec__levo .fm-zsec__geo{margin-top:auto;padding-top:22px}
.fm-zsec__kicker{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:#c0392b}
.fm-zsec__kicker::before{content:"";width:18px;height:1px;background:#e54e3a}
.fm-zsec__h2{margin:12px 0 0;font-size:clamp(22px,2.2vw,29px);font-weight:400;line-height:1.2;color:#252525}
.fm-zsec__lead{margin:12px 0 0;font-size:16px;line-height:1.65;color:#5f5f5f}
.fm-zsec__pam{margin:26px 0 0;padding:20px 22px;background:#fff;border:1px solid #ededea;border-radius:12px}
.fm-zsec__pamz{font-size:12px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:#8a8a8a}
.fm-zsec__pam ul{margin:12px 0 0;padding:0;list-style:none}
.fm-zsec__pam li{position:relative;padding:0 0 0 16px;margin:0 0 8px;font-size:14.5px;
  line-height:1.5;color:#5f5f5f}
.fm-zsec__pam li:last-child{margin-bottom:0}
.fm-zsec__pam li::before{content:"";position:absolute;left:0;top:9px;width:5px;height:1px;background:#c9c4bd}
.fm-zsec__geo{margin:22px 0 0;font-size:14px;line-height:1.6;color:#8d8d8d}
.fm-zsec__geo a{color:#c0392b;border-bottom:1px solid rgba(192,57,43,.3)}
.fm-zsec__geo a:hover{color:#e54e3a}

/* маршруты по задаче внутри секции заявки (витрина) */
.fm-zsec__marsh{margin:22px 0 0}
/* строки дышат шире: правая колонка с формой выше по своей природе, и без этого
   слева оставалась дыра в двести пикселей (замер 25.08.2026) */
.fm-zsec__row{display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:26px 2px;border-top:1px solid #e7e3de;text-decoration:none;color:#252525;
  transition:color .16s,padding .16s}
.fm-zsec__row:last-child{border-bottom:1px solid #e7e3de}
.fm-zsec__row strong{display:block;font-size:17px;font-weight:500}
.fm-zsec__row small{display:block;margin:5px 0 0;font-size:13.5px;color:#8a8a8a}
.fm-zsec__row svg{flex:0 0 auto;color:#c9c4bd;transition:transform .18s,color .18s}
.fm-zsec__row:hover{color:#c0392b;padding-left:8px}
.fm-zsec__row:hover svg{color:#e54e3a;transform:translateX(4px)}

/* сама форма */
/* Форма ужата, чтобы её высота сошлась с левой колонкой: поля 30/32 стали 24/26,
   зазоры между полями 18/20 стали 14/18, поле текста 112 стало 96. Ничего не убрано. */
.fm-zform{padding:22px 24px 24px;background:#fff;border:1px solid #e5e5e5;border-radius:14px}
.fm-zsec__pravo .fm-zform{margin:22px 0 0}
.fm-zform__lovushka{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fm-zform__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}
.fm-zfield{display:block;min-width:0}
.fm-zfield--vsya{grid-column:1/-1}
.fm-zfield__p{display:block;margin:0 0 8px;font-size:11.5px;font-weight:600;letter-spacing:.09em;
  text-transform:uppercase;color:#8a8a8a}
.fm-zfield__v{width:100%;height:46px;padding:0 15px;font:400 15px/1.4 var(--fm-font,inherit);
  color:#252525;background:#fff;border:1px solid #dcdcd8;border-radius:8px;outline:none;
  transition:border-color .16s}
.fm-zfield__v:focus{border-color:#e54e3a}
/* ⚠️ height:auto тут не работал: у textarea высоту задаёт атрибут rows, и поле
   держалось на 112px независимо от min-height. Ставим высоту явно, растянуть
   поле мышью по-прежнему можно. */
.fm-zfield__t{height:96px;min-height:96px;padding:13px 15px;resize:vertical}
select.fm-zfield__v{appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5 6 6.5l5-5' stroke='%23999' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 15px center;padding-right:38px}
.fm-zform__niz{display:flex;align-items:center;flex-wrap:wrap;gap:14px 20px;margin:18px 0 0}
.fm-zform__knopka{flex:0 0 auto;height:46px;padding:0 30px;border:0;border-radius:8px;
  background:#e54e3a;color:#fff;font:600 12.5px/1 var(--fm-font,inherit);letter-spacing:.09em;
  text-transform:uppercase;cursor:pointer;transition:background .16s}
.fm-zform__knopka:hover{background:#d9432f}
.fm-zform__sogl{margin:0;flex:1 1 240px;font-size:12px;line-height:1.5;color:#9a948c}
.fm-zform__err{margin:0 0 20px;padding:14px 16px;border:1px solid #f0c8c1;border-radius:8px;
  background:#fdf4f2}
.fm-zform__err p{margin:0 0 6px;font-size:14px;line-height:1.5;color:#b8402f}
.fm-zform__err p:last-child{margin:0}
.fm-zform__ok{padding:8px 0}
.fm-zform__okz{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:#3f8a5c}
.fm-zform__okz::before{content:"";width:18px;height:1px;background:#3f8a5c}
.fm-zform__ok p{margin:12px 0 0;font-size:16px;line-height:1.6;color:#3f3f3f}


/* ---------- адаптив общих блоков ---------- */
@media (max-width:1250px){
  .fm-zsec__in{grid-template-columns:minmax(0,1fr);gap:36px}
  .fm-zsec__pravo .fm-zform{margin:18px 0 0}
}
@media (max-width:1100px){
  .fm-tovbl__ryad{grid-template-columns:repeat(3,minmax(0,1fr))}
  .fm-tovk:nth-child(4){display:none}
}
@media (max-width:860px){
  .fm-zsec{padding:34px 24px 36px;margin-top:48px}
  .fm-zform{padding:24px 22px 26px}
  .fm-tovbl__shapka{flex-direction:column;align-items:flex-start;gap:14px}
}
@media (max-width:620px){
  .fm-zform__grid{grid-template-columns:minmax(0,1fr)}
  .fm-tovbl__ryad{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}
  .fm-tovk:nth-child(4){display:block}
}

/* End */


/* Start:/local/templates/floralmile/assets/css/blog.css?178775354126441*/
/* =========================================================================
   Блог: витрина и статья.
   Тот же язык, что у услуг и брендов: один шрифт, курсива нет, заголовки
   тонкие, красный только акцентом, рамки еле заметные, теней нет.
   Всё под .fm-blist и .fm-art, общий шаблон каталога не трогаем.
   ========================================================================= */

.fm-blist,.fm-art{--ramka:#ededea;--tepl:#fbfaf8;--ink:#252525;--tekst:#5f5f5f;
  --kras:#e54e3a;--kras-t:#c0392b}

/* мелкая красная надпись над заголовком секции */
.fm-bsecl{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:#c0392b}
.fm-bsecl::before{content:"";width:18px;height:1px;background:#e54e3a}

/* =========================================================================
   ВИТРИНА
   ========================================================================= */
.fm-blist__intro{max-width:760px;margin:0 0 30px;font-size:16.5px;line-height:1.65;color:#5f5f5f}

/* карточка статьи, четыре вида */
.fm-bk{display:block;text-decoration:none;min-width:0}
.fm-bk__pic{display:block;overflow:hidden;border-radius:14px;background:#f4f1ed}
.fm-bk__pic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.fm-bk:hover .fm-bk__pic img{transform:scale(1.03)}
.fm-bk__meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px}
.fm-bk__rub{font-size:11px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:#c0392b}
.fm-bk__date{font-size:12.5px;color:#9a948c}
.fm-bk__t{display:block;margin:10px 0 0;line-height:1.25;color:#252525;transition:color .16s}
.fm-bk:hover .fm-bk__t{color:#c0392b}
.fm-bk__l{display:block;margin:10px 0 0;font-size:14.5px;line-height:1.6;color:#6f6f6f}
/* ⭐ Симметрия текста и кадра (просьба Вени 25.08.2026). Заголовок и лид держат
   одинаковое число строк во всех карточках одного вида, иначе соседние блоки
   текста рядом с одинаковыми кадрами выглядят рваными. */
.fm-bk--wide .fm-bk__t,.fm-bk--vert .fm-bk__t,.fm-bk--row .fm-bk__t{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fm-bk--wide .fm-bk__l,.fm-bk--vert .fm-bk__l,.fm-bk--row .fm-bk__l{
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.fm-bk--row .fm-bk__l{-webkit-line-clamp:2}

/* главный материал: разворот, текст слева, кадр справа */
.fm-blead{margin:0 0 24px}
.fm-bk--lead{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:stretch;
  background:#fbfaf8;border:1px solid #ededea;border-radius:16px;overflow:hidden;
  transition:border-color .2s,box-shadow .2s}
.fm-bk--lead:hover{border-color:#ddd7cf;box-shadow:0 12px 34px rgba(90,78,64,.12)}
.fm-bk--lead .fm-bk__body{order:-1;display:block;padding:44px 46px;align-self:center}
.fm-bk--lead .fm-bk__pic{border-radius:0;min-height:330px}
.fm-bk--lead .fm-bk__t{font-size:clamp(24px,2.4vw,33px)}
.fm-bk--lead .fm-bk__l{margin-top:14px;font-size:16px}
/* строка-приглашение внизу главной карточки: без неё колонка текста кончалась
   на середине кадра и низ разворота пустовал */
.fm-bk--lead .fm-bk__body::after{content:"Читать статью";display:inline-flex;align-items:center;
  gap:8px;margin:22px 0 0;font-size:12px;font-weight:600;letter-spacing:.09em;
  text-transform:uppercase;color:#c0392b}
.fm-bk--lead:hover .fm-bk__body::after{color:#e54e3a}

/* пара широких под главным */
.fm-bpara{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:0 0 24px}
.fm-bk--wide .fm-bk__pic{aspect-ratio:16/9}
.fm-bk--wide .fm-bk__body{display:block;padding:18px 2px 0}
.fm-bk--wide .fm-bk__t{font-size:21px}

/* мозаика: три в ряд */
.fm-bmoz{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 24px;margin:0 0 56px}
.fm-bk--vert .fm-bk__pic{aspect-ratio:4/3}
.fm-bk--vert .fm-bk__body{display:block;padding:16px 2px 0}
.fm-bk--vert .fm-bk__t{font-size:18.5px}

/* ранние материалы: строки, картинка слева */
.fm-barch{margin:0 0 56px}
.fm-barch__h{padding:0 0 18px;border-bottom:1px solid #ededea;margin:0 0 22px}
.fm-barch__h h2{margin:10px 0 0;font-size:clamp(21px,2.1vw,27px);font-weight:400;color:#252525}
.fm-barch__l{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 34px}
.fm-bk--row{display:grid;grid-template-columns:172px minmax(0,1fr);gap:18px;align-items:center}
.fm-bk--row .fm-bk__pic{aspect-ratio:4/3}
.fm-bk--row .fm-bk__body{display:block;padding:2px 0}
.fm-bk--row .fm-bk__t{margin-top:8px;font-size:16.5px}
.fm-bk--row .fm-bk__l{margin-top:8px;font-size:13.5px;line-height:1.55}

/* финал витрины: не пустой центрированный призыв, а рабочая полоса */
.fm-bend{display:grid;grid-template-columns:minmax(0,1.4fr) auto;gap:30px;align-items:center;
  padding:38px 42px;border-radius:16px;background:#fbfaf8;border:1px solid #ededea}
.fm-bend h2{margin:10px 0 0;font-size:clamp(21px,2.1vw,27px);font-weight:400;color:#252525}
.fm-bend p{margin:12px 0 0;max-width:680px;font-size:15.5px;line-height:1.65;color:#5f5f5f}
.fm-bend__k{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px}
.fm-bend__b{display:inline-flex;align-items:center;height:48px;padding:0 28px;border-radius:8px;
  background:#e54e3a;color:#fff;font-size:12.5px;font-weight:600;letter-spacing:.09em;
  text-transform:uppercase;transition:background .16s}
.fm-bend__b:hover{background:#d9432f}
.fm-bend__s{font-size:12.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:#c0392b;transition:color .16s}
.fm-bend__s:hover{color:#e54e3a}

/* =========================================================================
   СТАТЬЯ
   ========================================================================= */
.fm-art__hero{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(28px,3.4vw,52px);
  align-items:center;margin:0 0 52px}
.fm-art__pic{border-radius:16px;overflow:hidden;background:#f4f1ed}
.fm-art__pic img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.fm-art__rub{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:#c0392b}
.fm-art__rub::before{content:"";width:18px;height:1px;background:#e54e3a}
.fm-art__zag h1{margin:14px 0 0;font-size:clamp(26px,3vw,40px);font-weight:400;line-height:1.14;color:#252525}
.fm-art__meta{display:flex;align-items:center;gap:12px;margin:16px 0 0;font-size:13.5px;color:#9a948c}
.fm-art__tochka{width:3px;height:3px;border-radius:50%;background:#c9c4bd}
.fm-art__lid{margin:18px 0 0;font-size:17px;line-height:1.65;color:#4a4a4a}
.fm-art__share{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px;margin:26px 0 0;
  padding:18px 0 0;border-top:1px solid #ededea}
.fm-art__sharet{font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#a8a29a}
/* кнопки «поделиться» стали кружками с иконками, подчёркивание им не нужно */

/* текст и оглавление */
.fm-art__ryad{display:grid;grid-template-columns:210px minmax(0,1fr);gap:clamp(30px,3.4vw,54px);
  align-items:start;margin:0 0 60px}
/* ⭐ Правую полосу с пояснениями Веня попросил убрать 26.08.2026, а текст
   растянуть на её место. Колонки две: оглавление и широкая колонка чтения.
   Кегль поднят до 18px: при ширине около тысячи пикселей строка иначе даёт
   больше ста знаков и читается тяжело. */
/* ⚠️ Именно 1101, а не 1100: боковое оглавление скрывается правилом
   max-width:1100, и на ровно 1100 колонка под него оставалась пустой дырой
   шириной 250px (поймано замером 26.08.2026). Границы разведены на пиксель. */
@media (min-width:1101px){
  .fm-art__ryad{grid-template-columns:250px minmax(0,1fr);gap:clamp(36px,3.4vw,56px)}
}
/* ⭐ Боковая колонка целиком (26.08.2026): оглавление, три услуги из базы и три
   случайные статьи. Липкость перенесена с оглавления на обёртку, иначе при
   прокрутке уезжали услуги и «Интересное».
   ⛔ align-self:stretch обязателен: у сетки стоит align-items:start, колонка от
   него получает высоту по содержимому, и липнуть внутри становится нечему
   (эти же грабли ловились на прежней правой полосе).
   ⚠️ Ограничение по высоте с прокруткой внутри нужно для невысоких экранов: на
   1440x900 три блока выше рабочей области, и без него нижний блок был бы не
   виден никогда. */
.fm-art__bok{align-self:stretch;min-width:0}
/* ⭐ Колонка цепляется НИЗОМ к низу экрана (просьба Вени 26.08.2026). Когда она
   выше окна, скрипт внизу страницы ставит ей отрицательный `top`, и при
   прокрутке вниз нижний край стоит в 24px от низа окна: услуги и «Интересное»
   всегда целиком в кадре. Когда колонка ниже окна, `top` остаётся 24px и она
   липнет верхом, как обычно.
   ⛔ Чистый `bottom:24px` эту задачу не решает, проверено замером 26.08.2026:
   он лишь запрещает элементу опускаться ниже порога, а уехать вверх при
   прокрутке не мешает. Замер показал низ колонки в 3606px выше края окна.
   ⛔ Прежние ограничения высоты сняты: прокрутка внутри оглавления и растяжка-
   подсказка снизу были костылями против нехватки места, теперь место есть.
   ⚠️ align-self:stretch оставляем: у сетки align-items:start, без растяжки
   родителя sticky не работает вовсе. */
.fm-art__bokw{position:sticky;top:24px;display:flex;flex-direction:column;gap:18px}
/* ⭐ Оглавление сделано заметнее (просьба Вени 26.08.2026): своя карточка на
   тёплом фоне, красная метка сверху, номера пунктов и подсветка при наведении.
   Раньше это была почти невидимая колонка серых ссылок. */
.fm-art__ogl{padding:22px 20px 18px;border:1px solid var(--ramka);
  border-radius:14px;background:var(--tepl)}
.fm-art__ogll{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;color:var(--kras-t);padding:0 0 14px}
.fm-art__ogll::before{content:"";width:16px;height:1px;background:var(--kras)}
.fm-art__ogl nav{display:flex;flex-direction:column;counter-reset:ogl}
.fm-art__ogl nav a{position:relative;counter-increment:ogl;padding:11px 0 11px 26px;
  border-top:1px solid #eeeae5;font-size:14.5px;line-height:1.4;color:#4a4a4a;
  transition:color .16s}
.fm-art__ogl nav a::before{content:counter(ogl);position:absolute;left:0;top:12px;
  font-size:12px;font-weight:600;color:#b9b2a8;transition:color .16s}
.fm-art__ogl nav a:hover{color:var(--kras-t)}
.fm-art__ogl nav a:hover::before{color:var(--kras)}
.fm-art__oglm{display:none}

/* ⭐ Услуги и «Интересное» в боковой колонке. Оглавление держим на тёплом фоне,
   эти два блока белые: так видно, что главное в колонке оглавление, а они
   дополнение, и колонка не превращается в три одинаковых пятна. */
.fm-bokb{padding:18px 18px 16px;border:1px solid var(--ramka);border-radius:14px;background:#fff}
.fm-bokb__l{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;color:var(--kras-t);padding:0 0 12px}
.fm-bokb__l::before{content:"";width:16px;height:1px;background:var(--kras)}
.fm-bokb__l + a{border-top:0;padding-top:0}
.fm-bokb__v{display:inline-block;margin:12px 0 0;font-size:13px;color:var(--kras-t);
  border-bottom:1px solid rgba(192,57,43,.3);transition:color .16s}
.fm-bokb__v:hover{color:var(--kras)}

/* ⭐ Миниатюра услуги в колонке (просьба Вени 26.08.2026): 48px, столько же
   съедает строка названия, поэтому высота блока почти не выросла. */
.fm-boku{display:flex;gap:11px;align-items:center;padding:10px 0;border-top:1px solid #f0ece7}
.fm-boku img{flex:0 0 48px;width:48px;height:48px;border-radius:10px;object-fit:cover;display:block}
.fm-boku__t{min-width:0;font-size:14px;line-height:1.3;color:#2f2f2f;transition:color .16s}
.fm-boku:hover .fm-boku__t{color:var(--kras-t)}

.fm-boki{display:flex;gap:11px;align-items:center;padding:11px 0;border-top:1px solid #f0ece7}
.fm-boki img{flex:0 0 54px;width:54px;height:54px;border-radius:10px;object-fit:cover;display:block}
/* ⚠️ Заголовок поста держим в трёх строках: у новогодних статей названия
   длинные, а обрезка на второй строке съедала смысл («Символ и цвета 2027
   года: что...»). Три строки ровно совпадают по высоте с миниатюрой. */
.fm-boki__t{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  min-width:0;font-size:13.5px;line-height:1.35;color:#2f2f2f;transition:color .16s}
.fm-boki:hover .fm-boki__t{color:var(--kras-t)}

.fm-art__telo{max-width:1040px;font-size:18px;line-height:1.75;color:#3f3f3f}
.fm-art__telo > p{margin:0 0 20px}
.fm-art__telo h2{margin:52px 0 18px;font-size:clamp(22px,2.3vw,30px);font-weight:400;line-height:1.2;
  color:#252525;scroll-margin-top:24px}
.fm-art__telo h2:first-child{margin-top:0}
.fm-art__telo h3{margin:34px 0 14px;font-size:20px;font-weight:500;color:#252525}
.fm-art__telo ul,.fm-art__telo ol{margin:0 0 20px;padding:0 0 0 2px;list-style:none}
.fm-art__telo li{position:relative;padding:0 0 0 20px;margin:0 0 10px}
.fm-art__telo ul li::before{content:"";position:absolute;left:0;top:13px;width:7px;height:1px;background:#c9c4bd}
.fm-art__telo ol{counter-reset:sh}
.fm-art__telo ol li{counter-increment:sh;padding-left:28px}
.fm-art__telo ol li::before{content:counter(sh);position:absolute;left:0;top:0;font-size:13px;
  font-weight:600;color:#c0392b}
.fm-art__telo a{color:#c0392b;border-bottom:1px solid rgba(192,57,43,.3)}
.fm-art__telo a:hover{color:#e54e3a}
.fm-art__telo blockquote{margin:34px 0;padding:2px 0 2px 22px;border-left:2px solid #e54e3a;
  font-size:20px;line-height:1.5;color:#333}
.fm-art__telo figure{margin:34px 0}
.fm-art__telo figure img{width:100%;height:auto;border-radius:14px;display:block}
/* ⚠️ height:auto обязателен: без него браузер берёт высоту из атрибута height
   картинки (1024) при ширине колонки 800 и растягивает кадр в портрет. */
.fm-art__telo figcaption{margin:11px 0 0;font-size:13.5px;line-height:1.5;color:#9a948c}
.fm-art__telo .fm-tovbl{margin:44px 0}

/* переход к услуге внутри статьи */
.fm-art__usl{margin:44px 0 0;padding:26px 28px;background:#fbfaf8;border:1px solid #ededea;border-radius:14px}
.fm-art__uslk{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:#c0392b}
.fm-art__uslk::before{content:"";width:18px;height:1px;background:#e54e3a}
.fm-art__usl p{margin:12px 0 0;font-size:15.5px;line-height:1.6;color:#5f5f5f}
.fm-art__usl a{display:inline-block;margin:14px 0 0;font-size:12.5px;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;color:#c0392b;border:0}
.fm-art__usl a:hover{color:#e54e3a}

.fm-art__tegi{display:flex;flex-wrap:wrap;gap:8px;margin:38px 0 0;padding:22px 0 0;
  border-top:1px solid #ededea}
.fm-art__tegi a{display:inline-flex;align-items:center;height:30px;padding:0 13px;border-radius:6px;
  background:#f6f4f1;font-size:13px;color:#6f6f6f;border:0;transition:background .16s,color .16s}
.fm-art__tegi a:hover{background:#efe9e3;color:#c0392b}

/* =========================================================================
   Врезки внутри текста
   Раньше это была правая полоса. Веня попросил 26.08.2026 полосу убрать, текст
   растянуть на её место, а пояснения оставить: они переехали во врезки.
   ========================================================================= */
.fm-vrez{margin:34px 0;padding:24px 26px 26px;border-radius:14px;background:var(--tepl);
  border:1px solid var(--ramka)}
.fm-art__telo > .fm-vrez:first-child{margin-top:0}
.fm-vrez--kor{border-left:3px solid var(--kras)}
.fm-vrez__l{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;color:var(--kras-t)}
.fm-vrez__l::before{content:"";width:16px;height:1px;background:var(--kras)}
.fm-vrez ul{margin:14px 0 0;padding:0;list-style:none}
.fm-vrez li{position:relative;margin:0 0 10px;padding:0 0 0 20px;font-size:16px;line-height:1.6;
  color:#4a4a4a;overflow-wrap:break-word}
.fm-vrez li:last-child{margin-bottom:0}
.fm-vrez li::before{content:"";position:absolute;left:0;top:12px;width:8px;height:1px;
  background:var(--kras)}
.fm-vrez--uch li::before{background:#c9c4bd}

/* =========================================================================
   Услуги под статьёй
   ========================================================================= */
.fm-art__uslugi{margin:0 0 52px}
.fm-art__uslh{padding:0 0 18px;border-bottom:1px solid var(--ramka);margin:0 0 24px}
.fm-art__uslh h2{margin:10px 0 0;font-size:clamp(21px,2.1vw,27px);font-weight:400;color:var(--ink)}
.fm-art__uslg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
/* ⭐ Миниатюра в карточке услуги (просьба Вени 26.08.2026). Внутренние отступы
   переехали с самой карточки на текстовую часть, иначе картинка не дотянулась бы
   до краёв и по бокам осталась бы полоса фона. */
.fm-uslk{display:flex;flex-direction:column;border-radius:14px;overflow:hidden;
  background:var(--tepl);border:1px solid var(--ramka);text-decoration:none;
  transition:border-color .2s,box-shadow .2s}
.fm-uslk:hover{border-color:#ddd7cf;box-shadow:0 10px 28px rgba(90,78,64,.10)}
.fm-uslk__pic{display:block;background:#f0ece7}
/* ⚠️ height:auto обязателен: у картинки стоят атрибуты width и height (они
   держат место до загрузки и убирают скачок вёрстки), и без сброса высоты
   браузер берёт 405px из атрибута, а `aspect-ratio` не применяется вовсе.
   Поймано замером 26.08.2026: карточка была 443x405 вместо 443x249. */
.fm-uslk__pic img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block;
  transition:transform .35s ease}
.fm-uslk:hover .fm-uslk__pic img{transform:scale(1.03)}
.fm-uslk__b{display:flex;flex-direction:column;padding:22px 24px 22px}
.fm-uslk__t{font-size:19px;line-height:1.25;color:var(--ink);transition:color .16s}
.fm-uslk:hover .fm-uslk__t{color:var(--kras-t)}
.fm-uslk__p{margin:12px 0 0;font-size:15px;line-height:1.6;color:var(--tekst)}
.fm-uslk__s{margin:18px 0 0;font-size:12px;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:var(--kras-t)}

/* =========================================================================
   Кнопки «поделиться»
   Иконки встроенные SVG: ноль запросов, около трёхсот байт на штуку.
   Цвет один, фирменный акцент появляется при наведении: разноцветные логотипы
   спорили бы со спокойной шапкой статьи.
   ========================================================================= */
.fm-shk{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;
  border-radius:50%;border:1px solid var(--ramka);background:#fff;color:#8b857c;
  transition:color .16s,border-color .16s,background .16s}
/* на телефоне палец требует зоны от 44px (замечание Кодекса 26.08.2026) */
@media (max-width:860px){.fm-shk{width:44px;height:44px}}
.fm-shk:hover{color:var(--kras);border-color:rgba(229,78,58,.45);background:var(--tepl)}
.fm-shk svg{display:block}

/* ещё кадры: то, что не влезло в текст, идёт лентой перед соседними статьями */
.fm-art__gal{margin:0 0 52px}
.fm-art__galh{padding:0 0 18px;border-bottom:1px solid var(--ramka);margin:0 0 24px}
.fm-art__galh h2{margin:10px 0 0;font-size:clamp(21px,2.1vw,27px);font-weight:400;color:var(--ink)}
.fm-art__galg{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}
.fm-art__galk{margin:0}
.fm-art__galk img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:14px;
  display:block;background:#f4f1ed}
.fm-art__galk figcaption{margin:11px 2px 0;font-size:13.5px;line-height:1.5;color:#9a948c}

/* читайте также */
.fm-art__also{margin:0 0 8px}
.fm-art__alsoh{padding:0 0 18px;border-bottom:1px solid #ededea;margin:0 0 24px}
.fm-art__alsoh h2{margin:10px 0 0;font-size:clamp(21px,2.1vw,27px);font-weight:400;color:#252525}
/* статей внизу четыре (просьба Вени 26.08.2026), поэтому четыре колонки */
.fm-art__alsog{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}

/* =========================================================================
   Адаптив
   ========================================================================= */
@media (max-width:900px){
  .fm-art__uslg{grid-template-columns:minmax(0,1fr);gap:16px}
  .fm-vrez{padding:20px 20px 22px}
}
@media (max-width:1100px){
  .fm-art__telo{font-size:17px}
  .fm-bk--lead{grid-template-columns:minmax(0,1fr)}
  .fm-bk--lead .fm-bk__body{order:0;padding:28px 26px 30px}
  .fm-bk--lead .fm-bk__pic{min-height:0;aspect-ratio:16/9;order:-1}
  .fm-bmoz{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fm-art__hero{grid-template-columns:minmax(0,1fr);gap:26px}
  .fm-art__pic{order:-1}
  .fm-art__ryad{grid-template-columns:minmax(0,1fr);gap:26px}
  /* ⛔ Ниже 1101 боковая колонка убирается целиком, а не одно оглавление:
     оглавление заменяет раскрывающийся список, услуги и статьи и без того
     стоят под текстом. Показывать их дважды на узком экране незачем. */
  .fm-art__bok{display:none}
  .fm-art__oglm{display:block;border:1px solid #ededea;border-radius:12px;background:#fbfaf8}
  .fm-art__oglm summary{list-style:none;cursor:pointer;padding:15px 18px;font-size:14px;
    font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#6f6f6f;
    display:flex;align-items:center;justify-content:space-between}
  .fm-art__oglm summary::-webkit-details-marker{display:none}
  .fm-art__oglm summary span{font-size:12px;color:#a8a29a}
  .fm-art__oglm nav{display:flex;flex-direction:column;padding:0 18px 8px}
  .fm-art__oglm nav a{padding:10px 0;border-top:1px solid #ededea;font-size:14.5px;color:#5f5f5f}
  /* ⚠️ Полностью снимать ограничение нельзя: на 1100px строка вырастала до
     1040 пикселей, это около ста десяти знаков при норме от шестидесяти до
     девяноста. Держим потолок и центрируем колонку в своей ячейке, чтобы не
     появилась дыра сбоку (замер 26.08.2026). */
  .fm-art__telo{max-width:900px;margin-inline:auto}
  .fm-art__alsog{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  .fm-bpara{grid-template-columns:minmax(0,1fr);gap:26px}
  .fm-barch__l{grid-template-columns:minmax(0,1fr)}
  .fm-bend{grid-template-columns:minmax(0,1fr);gap:22px;padding:28px 24px}
  .fm-art__telo{font-size:16.5px}
}
@media (max-width:620px){
  .fm-bmoz{grid-template-columns:minmax(0,1fr);gap:26px}
  .fm-bk--row{grid-template-columns:110px minmax(0,1fr);gap:14px}
  .fm-bk--lead .fm-bk__body{padding:24px 20px 26px}
  .fm-art__alsog{grid-template-columns:minmax(0,1fr)}
  .fm-art__alsog .fm-bk:nth-child(3){display:block}
  .fm-art__telo blockquote{font-size:18px}
}

/* End */
/* /local/templates/floralmile/assets/css/formy-tovary.css?17876756289372 */
/* /local/templates/floralmile/assets/css/blog.css?178775354126441 */