What could be causing the globe image to overlap the dropdown/accordion content on the dark section of the homepage on iPhones in Webflow? Additionally, why is the Italic accent font not displaying properly on iPhones in certain areas on the site?

The overlapping issue could be caused by a few factors. First, check the positioning and z-index of the elements involved. Make sure that the dropdown/accordion content has a higher z-index value than the globe image, and that the positioning is set to relative or absolute to properly control their placement.

If the overlapping issue persists, it's possible that the issue is related to the viewport height or the screen size of iPhones. Mobile devices have smaller screens, so elements may need to be adjusted accordingly to fit within the available space. Double-check the dimensions and positioning of the elements to ensure they are properly aligned and constrained within the visible viewport area.

Regarding the font display issue on iPhones, it could be caused by incompatible font formats or incorrect font settings. Ensure that the italic accent font you are using is supported by all modern browsers and devices. It's recommended to use widely supported font formats like WOFF or WOFF2.

Additionally, check the font settings in your Webflow project. Make sure that the font is properly declared and assigned to the respective elements throughout the site. You can use the Webflow Designer's typography panel to select and configure the font styles for different device sizes, ensuring that the italic accent font is applied consistently across all platforms.

It's important to note that font rendering can vary between different operating systems and devices, so it's always a good practice to test your site on multiple devices and browsers to ensure consistent font display. If the font issue persists, consider using a web-safe font as a fallback or explore alternative font options that are better supported across different devices.