/* IFG mobile layer (Mobile Review 2026-10-03, phase M1; owner decisions D1a, D2 hide, D3 16px, D4 hide — 2026-10-08).
 * Phones only: 767px is Elementor's mobile breakpoint (kit viewport_md 768), so this matches its own device mode.
 * Desktop and tablet never see these rules. Element IDs are from the shared templates every page and region renders:
 * IFG_header 2269 (top bar ca1a8f5 → countries_top 8382 menu 295f8400), mainmenu 8557, footer_globe 8349,
 * contactbottom_with_form_us2a 9011. Rollback: delete this file (the loader skips it when missing). */
@media (max-width: 767px) {

  /* D1a: top bar on one row (flags + Client Login), ~44px instead of 97px. It stops being sticky on phones via the
     Elementor patch (M2, sticky_on desktop/tablet); the logo row stays sticky. */
  .elementor-element-ca1a8f5 .elementor-element-295f8400 .elementor-nav-menu { flex-wrap: nowrap; justify-content: flex-end; }
  .elementor-element-ca1a8f5 .elementor-element-295f8400 .elementor-nav-menu > li > a.elementor-item {
    padding: 10px 6px; font-size: 13px; line-height: 1.2; white-space: nowrap; min-height: 44px; box-sizing: border-box; display: flex; align-items: center;
  }
  .elementor-element-ca1a8f5 .elementor-element-295f8400 .elementor-nav-menu > li > a img._mi { width: 20px !important; height: 20px; margin-right: 4px; }
  .elementor-element-ca1a8f5 .elementor-column:empty, .elementor-element-ca1a8f5 .elementor-element-64a04381 { display: none; }
  .elementor-element-ca1a8f5.elementor-section-height-min-height > .elementor-container { min-height: 0; }

  /* Main menu dropdown (full width comes from the M2 patch): readable rows, 44px targets.
     "Stretch" turns the dropdown into an absolute overlay; two column wraps in the logo row (c749fdd, 1dc5633) have
     overflow:hidden and clipped it to nothing (live 13:09–fix on 2026-10-08) — let them overflow on phones. */
  .elementor-element-ab633c7 .elementor-widget-wrap { overflow: visible !important; }
  .elementor-element-490d442a .elementor-nav-menu--dropdown a.elementor-item { font-size: 16px !important; padding-top: 12px; padding-bottom: 12px; }

  /* D2: "Where to Find Us" — no globe on phones (the loader also skips the 189KB WebGL library), no 188px desktop gap */
  .elementor-element-51f5977.earth_wrap, .earth_wrap { display: none !important; }
  .elementor-element-74560fc3 > .elementor-widget-wrap { margin-top: 0 !important; }

  /* Footer inquiry form (WPForms 5921): full-width card, one field per row, Turnstile uncut, 16px inputs (no iOS zoom) */
  .elementor-element-76ffaf6b { padding-left: 0 !important; padding-right: 0 !important; }
  .elementor-element-6fe89e02 > .elementor-widget-wrap { margin-left: 0 !important; margin-right: 0 !important; padding-left: 12px !important; padding-right: 12px !important; }
  #wpforms-5921 .wpforms-one-half, #wpforms-5921 .wpforms-first { width: 100% !important; margin-left: 0 !important; float: none !important; }
  #wpforms-5921 .wpforms-field-row-block + .wpforms-field-row-block { margin-top: 12px; }
  #wpforms-5921 input, #wpforms-5921 select, #wpforms-5921 textarea { font-size: 16px !important; min-height: 44px; }
  #wpforms-5921 .wpforms-recaptcha-container { overflow: visible; }

  /* Elementor popups 3510 / 7221: 16px fields (iOS zooms on anything smaller), one per row, 40px close button */
  .elementor-popup-modal .elementor-field-group { width: 100% !important; max-width: 100%; flex-basis: 100%; }
  .elementor-popup-modal .elementor-field, .elementor-popup-modal .elementor-field-textual, .elementor-popup-modal select { font-size: 16px !important; min-height: 44px; }
  .elementor-popup-modal .dialog-close-button { width: 40px; height: 40px; font-size: 24px; display: flex; align-items: center; justify-content: center; }

  /* D3: body copy at least 16px — max() keeps the pages that are already larger (Labs 20px, whitepaper 18.4px) */
  .elementor-widget-text-editor, .elementor-widget-text-editor p, .elementor-widget-text-editor li { font-size: max(16px, 1em); line-height: 1.55; }

  /* Tap targets: footer link lists, Insights "Read More", pagination */
  .elementor-location-footer .elementor-icon-list-item > a, .elementor-location-footer .elementor-nav-menu a { padding-top: 10px; padding-bottom: 10px; }
  .elementor-post__read-more { font-size: 14px; display: inline-block; padding: 8px 0; }
  .elementor-pagination .page-numbers { display: inline-block; min-width: 32px; padding: 6px 10px; text-align: center; }

  /* D4: the cookie-law-info "revisit" button is orphaned while the consent bar is off (W3 pending) — hide on regional pages */
  .ifg-region-uk #cookie-law-info-again, .ifg-region-ie #cookie-law-info-again, .ifg-region-au #cookie-law-info-again { display: none !important; }

  /* IFG Labs media carousel (page 3371, widget 48073fd): already one slide per view on phones, but a fixed 780px height
     with background-size cover showed a narrow strip of each portrait cover (1978×2560). Height ≈ width × 1.3, whole cover. */
  .elementor-widget-media-carousel .elementor-carousel-image { background-size: contain !important; background-repeat: no-repeat; }
  .elementor-element-48073fd .elementor-main-swiper { height: 460px !important; }
  .elementor-widget-media-carousel .elementor-swiper-button { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; }

  /* Decorative animated circles (wp-image-5637, absolute-positioned image widget on buyer, supplier, digital-invoice,
     partnership + regional copies) sat 330→514px on a 375px screen: only a broken sliver showed. Owner chose to hide it
     on phones (2026-10-08). Matched by the image it contains so every copy is covered; pre-:has browsers keep the sliver. */
  .elementor-widget-image.elementor-absolute:has(img.wp-image-5637) { display: none !important; }

  /* Financial Institutions hero illustration (wp-image-7430) cropped on the right */
  img.wp-image-7430 { max-width: 100%; height: auto; object-fit: contain; }
}
