@font-face {
    font-family: 'eicons';
    src: url('https://pendulee.com/wp-content/plugins/elementor/assets/lib/eicons/fonts/eicons.woff2?5.47.0') format('woff2');
    font-display: swap;
}

@font-face {
    font-family: 'Josefin Sans';
    src: url('https://fonts.wp.com/s/josefinsans/v34/Qw3PZQNVED7rKGKxtqIqX5E-AVSJrOCfjY46_DjQbMZhLybvUVw.woff2') format('woff2');
    font-display: swap;
}

@font-face {
    font-family: 'Karla';
    src: url('https://fonts.wp.com/s/karla/v33/qkB9XvYC6trAT55ZBi1ueQVIjQTD-JrIH2G7nytkHRyQ8p4wUje6bmMorHA.woff2') format('woff2');
    font-display: swap;
}

@font-face {
    font-family: 'Karla';
    src: url('https://fonts.wp.com/s/karla/v33/qkB_XvYC6trAT7RQNNK2EG7SIwPWMNlCVytER0IPh7KX59Z0CnSKbGkvjnJSTw.woff2') format('woff2');
    font-display: swap;
}

@font-face {
    font-family: 'Josefin Sans';
    src: url('https://fonts.wp.com/s/josefinsans/v34/Qw3PZQNVED7rKGKxtqIqX5E-AVSJrOCfjY46_DjQbMZhLybpUVzEEQ.woff2') format('woff2');
    font-display: swap;
}

/* ================================
   GLOBAL CLS (LAYOUT SHIFT) FIXES
   ================================ */

/* 1. Images: preserve intrinsic sizing */
img {
  max-width: 100%;
  height: auto;
  aspect-ratio: attr(width) / attr(height);
  display: block;
}

/* Gutenberg image & gallery blocks */
.wp-block-image img,
.wp-block-gallery img {
  width: 100%;
  height: auto;
}

/* 2. Cover blocks (major CLS offender) */
.wp-block-cover {
  min-height: 50vh;
}

/* 3. Videos & embeds */
.wp-block-embed iframe,
.wp-block-video video,
iframe,
video {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
}

/* 4. Header / navigation stability */
.site-header,
header {
  min-height: 80px;
}

/* 5. Buttons & links (font-load shift prevention) */
button,
.wp-block-button__link {
  line-height: 1.2;
  min-height: 44px;
}

/* 6. Font loading stability */
html {
  font-size-adjust: 0.5;
}

/* 7. Lazy-loaded image placeholder */
img[loading="lazy"] {
  background-color: #f2f2f2;
}

/* 8. Prevent iframe/embed collapse before load */
.wp-block-embed__wrapper {
  min-height: 200px;
}

/* 9. Avoid content jumping due to late-loaded elements */
main,
.site-content {
  overflow-anchor: none;
}
/* ======================================
   PERFORMANCE: NETWORK PAYLOAD REDUCTION
   (CSS-ONLY STRATEGIES)
   ====================================== */

/* 1. Defer offscreen rendering (HUGE win)
   Prevents below-the-fold content from loading immediately */
main > * {
  content-visibility: auto;
  contain-intrinsic-size: 1000px;
}

/* 2. Images: prevent oversized rendering */
img {
  max-width: 100%;
  height: auto;
}

/* 3. Hide heavy embeds until user interaction */
.wp-block-embed iframe,
.wp-block-video video {
  display: none;
}

/* Reveal embeds on interaction */
.wp-block-embed:has(:hover) iframe,
.wp-block-video:has(:hover) video {
  display: block;
}

/* 4. Prevent background images from loading immediately */
.wp-block-cover {
  background-image: none !important;
  background-color: #f2f2f2;
}

/* Load cover background on interaction */
.wp-block-cover:hover {
  background-image: inherit;
}

/* 5. Reduce font rendering cost */
html {
  font-size-adjust: 0.5;
}

/* 6. Force system font fallback immediately */
body {
  font-family: system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* 7. Limit animation & transition overhead */
* {
  animation-duration: 0.01ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0.01ms !important;
}

/* 8. SVG icons scale without extra payload */
svg {
  max-width: 100%;
  height: auto;
}

/* 9. Prevent hidden elements from loading early */
[hidden],
.is-hidden,
.display-none {
  display: none !important;
}

/* ======================================
   MAIN THREAD PERFORMANCE OPTIMIZATIONS
   (Style & Layout)
   ====================================== */

/* 1. Skip rendering offscreen content
   MASSIVE reduction in layout + paint cost */
.elementor-section,
.elementor-container,
.elementor-widget {
  content-visibility: auto;
  contain-intrinsic-size: 800px;
}

/* 2. Isolate layout calculations
   Prevents reflow from cascading */
.elementor-section,
.elementor-widget {
  contain: layout style paint;
}

/* 3. Kill expensive animations & transitions */
.elementor *,
.elementor-widget * {
  animation: none !important;
  transition: none !important;
}

/* 4. Prevent hover-based layout recalculation */
.elementor-widget:hover {
  transform: none !important;
}

/* 5. Reduce font-triggered reflow */
body {
  text-rendering: optimizeSpeed;
}

/* 6. Simplify flex/grid recalculations */
.elementor-container {
  align-items: stretch;
}

/* 7. Prevent invisible widgets from calculating layout */
.elementor-hidden-desktop,
.elementor-hidden-tablet,
.elementor-hidden-mobile {
  display: none !important;
}

/* 8. Stabilize headings to avoid reflow */
h1, h2, h3, h4, h5, h6 {
  line-height: 1.2;
  max-width: 100%;
}

/* 9. Reduce repaint from box-shadows */
* {
  box-shadow: none !important;
}

/* 10. Disable scroll-linked effects */
html {
  scroll-behavior: auto;
}

/* 
 
/* ======================================
CSS BLOATS - GET RID OF    ====================================== */

/* Safely hide only the body, with a backup to show it after 2 seconds no matter what */
body {
    animation: fadeIn 0.5s ease-in both;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ======================================
FIX LOGO ISSUES =====================================