.elementor-2348 .elementor-element.elementor-element-b4wz2z4{--display:flex;--padding-top:40px;--padding-bottom:60px;--padding-left:60px;--padding-right:60px;}/* Start custom CSS *//* =====================================================
   AI Guide — Infographic Layout (Flexbox-based, v3)
   The section divs already have display:flex inline.
   We control sizing + mobile stacking via these rules.
   ===================================================== */

/* Image wrapper: occupy up to 40% of the flex row */
.npn-section > div:has(> .npn-infographic) {
  flex: 0 0 40%;
  max-width: 40%;
}

/* Image fills its wrapper naturally */
.npn-section .npn-infographic {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  float: none;
}

/* Text container takes remaining space */
.npn-section > div:not(:has(.npn-infographic)) {
  flex: 1;
  min-width: 0;
}

/* Clearfix on outer guide wrapper */
.npn-guide-content::after {
  content: "";
  display: table;
  clear: both;
}

/* =====================================================
   Mobile: stack image above text, full width
   ===================================================== */
@media (max-width: 767px) {
  /* Override inline flex-direction to stack vertically */
  .npn-section {
    flex-direction: column !important;
    gap: 16px !important;
  }

  /* Image wrapper: full width, appears first regardless of DOM order */
  .npn-section > div:has(> .npn-infographic) {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    order: -1;
    margin: 0 !important;
  }

  /* Text container: full width */
  .npn-section > div:not(:has(.npn-infographic)) {
    flex: 0 0 100% !important;
    width: 100% !important;
    min-width: 0;
  }
}


/* =====================================================
   Hide duplicate WordPress page title
   (Elementor provides its own H1 heading on this page)
   ===================================================== */
.page-header {
  display: none !important;
}


/* =====================================================
   Mobile: push page content below sticky nav header
   Nav is ~70–80px tall on mobile; 80px top padding
   ensures the Elementor H1 clears it on all devices.
   ===================================================== */
@media (max-width: 767px) {
  .elementor-2348 {
    padding-top: 80px !important;
  }
}/* End custom CSS */