/* Nearby Electrician - mobile hardening patch
   Added 2026-08-14. Loaded last so it can safely correct page-specific fixed widths. */

html, body { max-width: 100%; overflow-x: hidden; }
*, *::before, *::after { box-sizing: border-box; }
img, svg, video, iframe { max-width: 100%; }
img { height: auto; }
iframe { display: block; }

/* Prevent long contact details, URLs and labels from forcing horizontal scroll. */
a, p, li, span, strong, h1, h2, h3, h4, h5, h6 { overflow-wrap: anywhere; }
input, select, textarea, button { max-width: 100%; }

/* Header / navigation */
@media (max-width: 991px) {
  .ne-header { position: relative; z-index: 1000; }
  .ne-nav { min-height: 78px; gap: 12px; }
  .ne-brand, .ne-brand-image { flex: 0 1 auto; min-width: 0; }
  .ne-brand-image img { max-width: 140px; height: auto; }
  .ne-mobile-toggle { flex: 0 0 auto; }
  .ne-mobile-menu { width: 100%; max-height: calc(100vh - 78px); overflow-y: auto; overscroll-behavior: contain; }
  .ne-mobile-menu a { min-height: 46px; display: flex; align-items: center; }
}

@media (max-width: 575px) {
  .container { width: 100%; padding-left: 18px; padding-right: 18px; }
  .ne-nav { min-height: 70px; }
  .ne-brand-image img { max-width: 122px; }
  .ne-mobile-toggle { width: 44px; height: 44px; }
}

/* Generic heroes */
@media (max-width: 767px) {
  .ne-page-hero,
  .ne-registration-hero,
  .ne-contact-hero,
  .ne-about-hero {
    height: auto !important;
    min-height: 300px;
    padding: 105px 0 58px !important;
    background-position: center !important;
  }
  .ne-page-hero h1,
  .ne-registration-hero h1,
  .ne-contact-hero h1,
  .ne-about-hero h1 { font-size: clamp(34px, 10vw, 42px) !important; line-height: 1.06; }
  .ne-page-hero .lead,
  .ne-registration-hero .lead,
  .ne-contact-hero .lead { font-size: 16px; line-height: 1.65; }
}

@media (max-width: 420px) {
  .ne-page-hero,
  .ne-registration-hero,
  .ne-contact-hero,
  .ne-about-hero { min-height: 270px; padding: 92px 0 48px !important; }
  .ne-page-hero h1,
  .ne-registration-hero h1,
  .ne-contact-hero h1,
  .ne-about-hero h1 { font-size: 33px !important; }
}

/* Homepage hero + actions */
@media (max-width: 767px) {
  .ne-hero-editorial { min-height: auto !important; }
  .ne-hero-shell { min-height: auto !important; }
  .ne-hero-copy { padding-top: 62px !important; padding-bottom: 92px !important; }
  .ne-hero-actions { width: 100%; }
  .ne-hero-actions .ne-btn { max-width: 100%; white-space: normal; text-align: center; }
  .ne-hero-proof { max-width: 100%; }
}
@media (max-width: 480px) {
  .ne-hero-editorial h1 { font-size: 36px !important; line-height: 1.05; }
  .ne-hero-copy { padding-bottom: 72px !important; }
}

/* Homepage quick directory search */
@media (max-width: 991px) {
  .ne-home-filter-grid { grid-template-columns: 1fr 1fr !important; gap: 12px !important; }
  .ne-home-filter-grid > * { min-width: 0 !important; width: 100% !important; }
  .ne-home-location { grid-column: 1 / -1; width: 100% !important; white-space: normal !important; text-align: center; justify-content: center; }
  .ne-home-submit { width: 100% !important; max-width: 100% !important; min-width: 0 !important; }
}
@media (max-width: 767px) {
  .ne-home-filter-grid { grid-template-columns: 1fr !important; }
  .ne-home-location { grid-column: auto; min-height: 58px; padding-left: 16px !important; padding-right: 16px !important; }
  .ne-home-filter-field,
  .ne-home-filter-grid .ne-themed-select-toggle { min-height: 58px !important; height: 58px !important; font-size: 16px !important; }
  .ne-showcase-benefits { flex-direction: column !important; align-items: stretch !important; gap: 14px !important; }
  .ne-showcase-benefit { width: 100% !important; }
}

/* Find Electrician - explicitly neutralise desktop min-width/nowrap rules */
@media (max-width: 991px) {
  .directory-showcase .directory-main-grid { grid-template-columns: 1fr 1fr !important; gap: 12px !important; }
  .directory-showcase .directory-main-field,
  .directory-showcase .directory-main-grid .ne-themed-select,
  .directory-showcase .directory-main-grid .ne-themed-select-toggle,
  .directory-showcase .directory-main-grid .ne-home-filter-field,
  .directory-showcase .directory-main-location { min-width: 0 !important; width: 100% !important; }
  .directory-showcase .directory-main-location { grid-column: 1 / -1; white-space: normal !important; min-height: 64px !important; height: auto !important; padding: 14px 18px !important; }
  .directory-showcase .directory-main-submit { min-width: 0 !important; width: 100% !important; max-width: 100% !important; }
  .directory-showcase .directory-main-benefits { flex-wrap: wrap !important; width: 100% !important; gap: 18px !important; }
}
@media (max-width: 767px) {
  .directory-showcase .directory-main-grid { grid-template-columns: 1fr !important; }
  .directory-showcase .directory-main-field:first-child,
  .directory-showcase .directory-main-location { grid-column: auto !important; }
  .directory-showcase .directory-main-grid .ne-home-filter-field,
  .directory-showcase .directory-main-grid .ne-themed-select-toggle { min-height: 58px !important; height: 58px !important; font-size: 16px !important; padding-left: 16px !important; padding-right: 16px !important; }
  .directory-showcase .directory-main-benefits { flex-direction: column !important; align-items: stretch !important; max-width: 100% !important; }
  .directory-showcase .directory-main-benefits .ne-showcase-benefit { width: 100% !important; }
  .directory-results-meta { flex-wrap: wrap; gap: 10px; }
}

/* Forms / registration / payment */
@media (max-width: 767px) {
  .ne-registration-shell,
  .ne-login-shell,
  .ne-payment-layout { width: 100%; max-width: 100%; }
  .ne-form-card { padding: 22px 18px !important; border-radius: 13px; }
  .ne-form-grid.two,
  .ne-check-grid,
  .ne-upload-grid,
  .ne-payment-layout { grid-template-columns: 1fr !important; }
  .ne-form-card-head { gap: 12px; }
  .ne-form-card-head > span { min-width: 42px; width: 42px; height: 42px; }
  .ne-plan-summary,
  .ne-payment-placeholder { flex-direction: column; align-items: flex-start; }
  .ne-plan-summary strong { font-size: 28px; }
  .ne-payment-logos { display: flex; flex-wrap: wrap; gap: 10px; }
  .ne-order-summary { position: static !important; }
  .ne-summary-row,
  .ne-summary-total { gap: 12px; }
}

/* Contact cards + map */
@media (max-width: 767px) {
  .ne-contact-details-grid { grid-template-columns: 1fr !important; }
  .ne-contact-detail-card,
  .ne-contact-email-card { grid-column: auto !important; width: 100%; }
  .ne-contact-detail-line { flex-wrap: wrap; justify-content: center; row-gap: 8px; text-align: center; }
  .ne-contact-detail-value { width: 100%; text-align: center; }
  .ne-contact-map-section iframe { width: 100% !important; min-height: 340px; height: 52vh; max-height: 480px; border-radius: 12px; }
}

/* Shop cards, variants and cart */
@media (max-width: 767px) {
  .ne-shop-grid > [class*="col-"] { width: 100%; }
  .ne-product-card .cover { height: clamp(230px, 78vw, 330px) !important; }
  .ne-product-card .cover img { object-fit: contain; }
  .ne-card-body { padding: 20px 18px; }
  .ne-variant-options { grid-template-columns: 1fr !important; }
  .ne-variant-btn { min-height: 48px; white-space: normal; }
  .ne-product-card .ne-btn { width: 100%; justify-content: center; }
  .ne-cart-drawer { width: 100% !important; max-width: 100% !important; }
  .ne-cart-head { padding: 18px; }
  .ne-cart-body { padding: 14px 16px; }
  .ne-cart-footer { padding: 16px 16px 20px; }
}
@media (max-width: 420px) {
  .ne-cart-item { grid-template-columns: 70px minmax(0,1fr); gap: 10px; }
  .ne-cart-item img { width: 70px; height: 70px; }
  .ne-cart-item-controls { flex-wrap: wrap; }
  .ne-cart-remove { margin-left: 0; }
}

/* Member benefits */
@media (max-width: 767px) {
  .ne-benefits-hero { padding: 92px 0 58px !important; background-position: center !important; }
  .ne-benefits-hero h1 { font-size: clamp(34px, 10vw, 42px) !important; }
  .ne-benefits-grid-section { padding: 52px 0; }
  .ne-benefits-grid { grid-template-columns: 1fr !important; gap: 18px; }
  .ne-benefit-card { padding: 24px 20px; }
  .ne-benefit-btn { width: 100%; justify-content: center; }
  .ne-benefits-cta { padding: 28px 20px; gap: 20px; }
  .ne-benefits-cta-body { min-width: 0 !important; width: 100%; }
  .ne-benefits-cta .ne-btn { width: 100%; min-width: 0 !important; justify-content: center; }
  .ne-updates-grid { grid-template-columns: 1fr !important; }
}

/* Footer - keep recent alignment work but make it robust on tablets/phones. */
@media (max-width: 991px) {
  .ne-footer { padding-top: 54px; }
  .ne-footer .row.g-4 > [class*="col-"] { text-align: center; }
  .ne-footer .row.g-4 > .col-lg-4:first-child .ne-brand-image,
  .ne-footer .row.g-4 > .col-lg-4:first-child > p { margin-left: auto !important; margin-right: auto !important; }
  .ne-footer .row.g-4 > .col-lg-4:first-child .ne-brand-image img { transform: none !important; margin-top: 0 !important; margin-bottom: 0 !important; width: min(220px, 70vw) !important; }
  .ne-footer .row.g-4 > .col-lg-4:first-child > p { width: min(100%, 360px) !important; margin-top: 18px !important; }
  .ne-footer .ne-social { width: 100% !important; justify-content: center !important; margin: 16px auto 0 !important; }
  .ne-footer ul { display: inline-block; text-align: left; }
  .ne-footer .col-lg-4:last-child p { max-width: 520px; margin-left: auto; margin-right: auto; }
}
@media (max-width: 575px) {
  .ne-footer { padding-top: 44px; }
  .ne-footer .row.g-4 > .col-6 { width: 100%; }
  .ne-footer h4 { margin-top: 6px; margin-bottom: 12px; }
  .ne-footer ul { display: block; text-align: center; }
  .ne-footer-bottom { margin-top: 28px; }
  .ne-footer-bottom .container,
  .ne-footer-bottom { text-align: center; }
}

/* Floating WhatsApp button: keep away from device edges / browser bars. */
@media (max-width: 575px) {
  .ne-whatsapp-float { right: max(14px, env(safe-area-inset-right)); bottom: max(14px, env(safe-area-inset-bottom)); }
}

/* Tables / wide embedded content from legacy pages */
@media (max-width: 767px) {
  table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  pre, code { max-width: 100%; overflow-x: auto; }
}
