/* mf_home_perf — homepage only (body.mf-home). SEO text stays in HTML. */

/* A: Circe — только woff + swap (перекрывает main.min.css с svg/otf) */
@font-face {
  font-family: CirceBold;
  src: url("/local/templates/main/fonts/Circe-Bold.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: CirceRegular;
  src: url("/local/templates/main/fonts/Circe-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* B: мягкий скелетон только для картинок (текст уже в DOM) */
.mf-home img.lazy:not(.loaded):not(.img-eager),
.mf-home img[data-src]:not([src]):not(.img-eager),
.mf-home .item img.lazy:not(.loaded) {
  background-color: #ececec;
  background-image: linear-gradient(90deg, #ececec 0%, #f4f4f4 50%, #ececec 100%);
  background-size: 200% 100%;
  animation: mf-skel 1.2s ease-in-out infinite;
}

@keyframes mf-skel {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}

.mf-home .video {
  background-color: #ececec;
  background-size: cover;
  background-position: center;
  min-height: 200px;
}

.mf-home video.mf-lazy-video {
  background-color: #ececec;
  background-size: cover;
  background-position: center;
}

/* C: ниже hello — отложенная отрисовка, HTML для бота на месте */
.mf-home > main > .products.slider-section,
.mf-home main .products.slider-section,
.mf-home main > .container.section,
.mf-home main section.spacer-lg,
.mf-home main section.slider-section.spacer,
.mf-home main section.about,
.mf-home main section.partners,
.mf-home main section.news-section,
.mf-home main section.form-section,
.mf-home main section.journal,
.mf-home main section.text-wrapper.seo-text {
  content-visibility: auto;
  contain-intrinsic-size: 1px 720px;
}

/* object-map include (если обёрнут / сосед) */
.mf-home main .object-map,
.mf-home main #object-map,
.mf-home main .mf-salon-map,
.mf-home main .map-section {
  content-visibility: auto;
  contain-intrinsic-size: 1px 480px;
}