/*
 * Performance overlays for the zusenew Next.js site.
 * Loaded LAST so it overrides anything plugin CSS sets.
 * Do NOT add layout/visual rules here — only render-perf hints.
 *
 * @font-face override mechanism: per CSS Fonts Module Level 4, when two
 * @font-face rules share the same font-family + style + weight, the LAST
 * declaration's descriptors (including font-display) win. By re-declaring
 * each plugin-loaded icon font here with font-display: swap, we eliminate
 * the FOIT window without modifying the plugin CSS files themselves.
 */

/* Font Awesome 5 Free (Elementor's icon font) — original is font-display:block
 * which causes up to 3s of invisible icons. */
@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("/wp-content/plugins/elementor/assets/lib/font-awesome/webfonts/fa-solid-900.woff2") format("woff2"),
       url("/wp-content/plugins/elementor/assets/lib/font-awesome/webfonts/fa-solid-900.woff") format("woff");
}

@font-face {
  font-family: 'Font Awesome 5 Brands';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/wp-content/plugins/elementor/assets/lib/font-awesome/webfonts/fa-brands-400.woff2") format("woff2"),
       url("/wp-content/plugins/elementor/assets/lib/font-awesome/webfonts/fa-brands-400.woff") format("woff");
}

/* Elementor's "eicons" icon font — original has no font-display so falls
 * back to "auto" (block-like). */
@font-face {
  font-family: 'eicons';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/wp-content/plugins/elementor/assets/lib/eicons/fonts/eicons.woff2?5.48.0") format("woff2"),
       url("/wp-content/plugins/elementor/assets/lib/eicons/fonts/eicons.woff?5.48.0") format("woff");
}

/* Reduce layout shift / forced reflow caused by below-the-fold sections by
 * giving them `content-visibility: auto`. Browser skips painting offscreen
 * content. Targets clearly footer / late sections; safe because Elementor
 * doesn't rely on these elements being fully painted for its observers. */
footer,
footer.elementor-element,
section.elementor-section-footer,
[data-elementor-type="footer"] {
  content-visibility: auto;
  contain-intrinsic-size: 0 600px;
}

/* Hint browsers to prioritize hero LCP image decoding on the home page. */
.elementor-section.hero img,
.elementor-element[data-id*="hero"] img,
.elementor-section[data-id*="hero"] img,
.zuse-hero img {
  fetchpriority: high;
}