/* KhmerFinds layout stability fix Load this stylesheet in immediately AFTER styles.css. Purpose: - Applies the existing small-phone layout before the first paint - Prevents home.js from resizing the hero and header after the page appears - Targets the PageSpeed CLS culprits: .marketplace-hero-inner / hero area Post Free Listing header button */ html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; } @media (max-width: 480px) { html, body { max-width: 100%; overflow-x: hidden; } .site-header { padding-left: 10px !important; padding-right: 10px !important; } .site-header a, .site-header button { white-space: nowrap !important; } .site-header .header-actions .button, .site-header .auth-account-button, .site-header [data-auth-nav] a, .site-header [data-auth-nav] button { min-height: 42px !important; padding: 8px 10px !important; font-size: 13px !important; line-height: 1.1 !important; border-radius: 12px !important; } .marketplace-hero { padding-left: 14px !important; padding-right: 14px !important; } .marketplace-hero-inner { width: 100% !important; max-width: 100% !important; } .marketplace-hero-copy h1 { max-width: 100% !important; margin-left: auto !important; margin-right: auto !important; font-size: clamp(34px, 10vw, 44px) !important; line-height: 1.05 !important; letter-spacing: -0.035em !important; overflow-wrap: normal !important; word-break: normal !important; } .marketplace-hero-copy p, .marketplace-hero-inner p { max-width: 100% !important; font-size: 15px !important; line-height: 1.55 !important; } .marketplace-hero-cta { width: 100% !important; max-width: 100% !important; min-height: 54px !important; padding: 12px 14px !important; font-size: 16px !important; line-height: 1.35 !important; white-space: normal !important; text-align: center !important; } #homepage-search-form { width: 100% !important; max-width: 100% !important; grid-template-columns: minmax(0, 1fr) !important; gap: 10px !important; padding: 14px !important; } #homepage-search-form input, #homepage-search-form select, #homepage-search-form button { width: 100% !important; max-width: 100% !important; min-width: 0 !important; min-height: 52px !important; font-size: 16px !important; } #category-chips { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; } #category-chips > * { min-width: 0 !important; } .marketplace-section-heading h2 { font-size: 26px !important; line-height: 1.15 !important; letter-spacing: -0.02em !important; } } @media (max-width: 380px) { .site-header .header-actions .button, .site-header .auth-account-button, .site-header [data-auth-nav] a, .site-header [data-auth-nav] button { padding-left: 8px !important; padding-right: 8px !important; font-size: 12px !important; } .marketplace-hero-copy h1 { font-size: 34px !important; } #category-chips { grid-template-columns: 1fr !important; } }