/* Formlab lead forms - injected via nginx sub_filter, scoped with .fl- prefix.
   Palette taken from the site: accent #ef463b / #d93a2f, primary #1e262d / #141a1f */
.fl-sec{background:#1e262d;color:#fff;padding:56px 20px}
.fl-wrap{max-width:960px;margin:0 auto}
.fl-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
@media(max-width:820px){.fl-grid{grid-template-columns:1fr;gap:28px}.fl-sec{padding:40px 16px}}
.fl-h{font-size:30px;line-height:1.2;font-weight:700;margin:0 0 12px}
@media(max-width:820px){.fl-h{font-size:24px}}
.fl-p{color:#b3bbc1;font-size:15px;line-height:1.6;margin:0 0 18px}
.fl-ul{list-style:none;padding:0;margin:0;color:#d9dde0;font-size:14px}
.fl-ul li{position:relative;padding-left:26px;margin-bottom:10px;line-height:1.5}
.fl-ul li:before{content:"";position:absolute;left:0;top:6px;width:12px;height:7px;
  border-left:2px solid #ef463b;border-bottom:2px solid #ef463b;transform:rotate(-45deg)}
.fl-card{background:#fff;border-radius:16px;padding:26px}
.fl-card .fl-h2{color:#1e262d;font-size:20px;font-weight:700;margin:0 0 4px}
.fl-card .fl-sub{color:#667884;font-size:13px;margin:0 0 18px;line-height:1.5}
.fl-field{margin-bottom:12px}
.fl-label{display:block;font-size:13px;font-weight:500;color:#323e48;margin-bottom:5px}
.fl-input,.fl-ta{width:100%;box-sizing:border-box;padding:11px 13px;border:1px solid #d9dde0;
  border-radius:9px;font-size:14px;color:#1e262d;font-family:inherit;background:#fff;outline:none;
  transition:border-color .15s,box-shadow .15s}
.fl-ta{resize:vertical;min-height:84px}
.fl-input:focus,.fl-ta:focus{border-color:#ef463b;box-shadow:0 0 0 3px rgba(239,70,59,.15)}
.fl-input::placeholder,.fl-ta::placeholder{color:#98a3ac}
.fl-btn{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:#ef463b;color:#fff;border:0;border-radius:9px;padding:13px 20px;font-size:15px;
  font-weight:600;font-family:inherit;cursor:pointer;transition:background .15s}
.fl-btn:hover{background:#d93a2f}
.fl-btn[disabled]{opacity:.55;cursor:default}
.fl-consent{display:flex;gap:9px;align-items:flex-start;margin:12px 0 14px;
  font-size:12px;color:#667884;line-height:1.45}
.fl-consent input{margin:2px 0 0;flex:0 0 auto;width:15px;height:15px;accent-color:#ef463b}
.fl-consent a{color:#667884;text-decoration:underline}
.fl-err{background:#fdecea;color:#c0271b;border-radius:8px;padding:9px 12px;font-size:13px;margin-bottom:10px}
.fl-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;
  opacity:0!important;pointer-events:none!important}
.fl-done{text-align:center;padding:26px 6px}
.fl-done .fl-tick{width:54px;height:54px;border-radius:50%;background:#ef463b;margin:0 auto 16px;
  position:relative}
.fl-done .fl-tick:after{content:"";position:absolute;left:19px;top:16px;width:14px;height:24px;
  border-right:3px solid #fff;border-bottom:3px solid #fff;transform:rotate(45deg)}
.fl-done h3{color:#1e262d;font-size:19px;margin:0 0 8px;font-weight:700}
.fl-done p{color:#667884;font-size:14px;margin:0;line-height:1.55}

/* Кнопки, перенесённые со старого сайта: в контенте у них остался инлайновый
   background-color (#ff8400, #00bedb, #0578d5), а цвет текста наследовался от
   ссылок - получалось нечитаемо. Красим текст и придаём вид кнопки. */
.wp-block-button__link,
a[class*="wp-block-button"],
.wp-block-buttons a[style*="background-color"]{
  display:inline-block !important;
  padding:13px 24px !important;
  border-radius:9px !important;
  color:#fff !important;
  text-decoration:none !important;
  font-weight:600 !important;
  font-size:15px !important;
  line-height:1.35 !important;
  box-shadow:0 2px 10px rgba(0,0,0,.14) !important;
  transition:filter .15s, transform .15s !important;
  cursor:pointer;
  border:0 !important;
}
.wp-block-button__link:hover,
a[class*="wp-block-button"]:hover{
  filter:brightness(.92);
  color:#fff !important;
  transform:translateY(-1px);
}
.wp-block-button{margin:20px 0 !important}
.wp-block-buttons{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0}

/* Обложки услуг вместо эмодзи. Эмодзи зашиты в скомпилированный бандл Next.js,
   поэтому подменяем их на реальные фото проектов клиента уже в браузере. */
.fl-cover{
  margin:0 0 16px !important;
  border-radius:10px;
  overflow:hidden;
  background:#f0f2f3;
  line-height:0;
}
.fl-cover img{
  display:block;
  width:100%;
  height:150px;
  object-fit:cover;
  transition:transform .35s ease;
}
.group:hover .fl-cover img{transform:scale(1.04)}
@media(max-width:640px){.fl-cover img{height:170px}}

/* Картинки в контенте идут по одной в <li> - каждая с новой строки.
   Раскладываем плиткой: 4 в ряд, 3 на планшете, 2 на телефоне. */
.prose-body ul.fl-imggrid,
.prose-body ol.fl-imggrid{
  list-style:none !important;
  padding-left:0 !important;
  margin:24px 0 !important;
  display:grid !important;
  gap:14px;
  grid-template-columns:repeat(4,minmax(0,1fr));
}
@media(max-width:1100px){
  .prose-body ul.fl-imggrid,.prose-body ol.fl-imggrid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:640px){
  .prose-body ul.fl-imggrid,.prose-body ol.fl-imggrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
}
.fl-imggrid > li{
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}
.fl-imggrid > li::marker{content:"" !important}
.fl-imggrid > li img{
  width:100% !important;
  aspect-ratio:4/3;
  height:auto !important;
  object-fit:cover;
  display:block;
  margin:0 !important;
  border-radius:10px;
  background:#f0f2f3;
}

/* popup */
.fl-ov{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;
  justify-content:center;padding:16px;background:rgba(0,0,0,.62);backdrop-filter:blur(3px);
  opacity:0;transition:opacity .18s}
.fl-ov.fl-on{opacity:1}
.fl-modal{position:relative;background:#fff;border-radius:18px;width:100%;max-width:440px;
  max-height:92vh;overflow-y:auto;box-shadow:0 24px 60px rgba(0,0,0,.35);
  transform:scale(.96);transition:transform .18s}
.fl-ov.fl-on .fl-modal{transform:scale(1)}
.fl-x{position:absolute;top:12px;right:12px;width:32px;height:32px;border:0;background:transparent;
  color:#98a3ac;font-size:24px;line-height:1;cursor:pointer;border-radius:50%}
.fl-x:hover{background:#f0f2f3;color:#323e48}
.fl-modal .fl-card{padding:28px 24px 24px}