/* fhb-mobile.css: phone/tablet refinements for the Forever Home Buyers static copy.
   Every rule sits inside a max-width media query, so desktop (>1024px) is untouched. */

/* ---------- Tablet and below (<=1024px) ---------- */
@media (max-width: 1024px) {
  /* clip (not hidden) so position:sticky on the header keeps working;
     Avada also sets body overflow-y:scroll, which would make body the scroller */
  html { overflow-x: clip; }
  body { overflow-x: clip !important; overflow-y: visible !important; }
  img { max-width: 100%; height: auto; }

  /* Hamburger: enlarge the tap area without moving the icon */
  .fusion-mobile-menu-icons a.awb-icon-bars,
  .fusion-mobile-menu-icons a.fusion-icon-bars {
    display: inline-block;
    padding: 12px;
    margin: -12px;
  }

  /* Form inputs: 16px stops iOS zoom-on-focus */
  .gform_wrapper input[type="text"],
  .gform_wrapper input[type="email"],
  .gform_wrapper input[type="tel"],
  .gform_wrapper select,
  .gform_wrapper textarea { font-size: 16px !important; }
}

/* ---------- Tablet portrait (<=900px) ---------- */
@media (max-width: 900px) {
  /* About Us: the 3 comparison cards are too narrow at 768-900, stack them */
  .vc_row.vc_column-gap-20 > .vc_col-sm-4:has(.card-text-design-in-row) {
    width: 100%;
    float: none;
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
  }
  /* those cards carry a fixed 440px min-height for desktop equal heights;
     once stacked it just leaves empty space */
  .vc_row.card-text-design-in-row { min-height: 0 !important; padding-bottom: 30px; }

  /* Get An Offer: the tablet-only "3 Easy Steps" row used half-width cards
     and a 510px image, leaving the right half empty. Make them full width. */
  .wpb_wrapper:has(> .vc_row > .vc_hidden-lg) > .vc_row.vc_inner > .vc_col-sm-6:not(.vc_hidden-sm) {
    width: 100%;
    float: none;
  }
  .asdddddddddasd .vc_figure,
  .asdddddddddasd .vc_single_image-wrapper,
  .asdddddddddasd img {
    width: 100% !important;
  }
  .asdddddddddasd img {
    max-height: 380px;
    object-fit: cover;
  }

  /* Testimonial carousels: green circle arrows hang half off screen.
     Dots and swipe remain, so hide those arrows on touch widths. */
  .ult-carousel-wrapper .slick-arrow.circle-bg { display: none !important; }

  /* Default slick arrows (home): give them a 44px tap area */
  .ult-carousel-wrapper .slick-arrow.default {
    width: 44px;
    height: 44px;
    line-height: 44px;
    text-align: center;
  }
  .ult-carousel-wrapper .slick-dots li button { min-width: 24px; min-height: 24px; }

}

/* ---------- Phones (<=767px) ---------- */
@media (max-width: 767px) {
  /* Lead form card: column had 50px side padding, squeezing inputs to ~230px */
  .vc_row .wpb_column.vc_column_container:has(.gform_wrapper) {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  .gform_wrapper,
  .gform_wrapper form,
  .gform_wrapper .gform_body,
  .gform_wrapper .gform_fields,
  .gform_wrapper .gfield,
  .gform_wrapper .ginput_container { width: 100% !important; max-width: 100% !important; }
  .gform_wrapper .ginput_container input,
  .gform_wrapper .ginput_container select,
  .gform_wrapper .ginput_container textarea {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }
  /* Name field had an extra 6px gutter that made it narrower than the others */
  .gform_wrapper .ginput_container_name { margin-left: 0 !important; margin-right: 0 !important; }
  .gform_wrapper .ginput_container_name .gform-grid-col { padding-left: 0 !important; padding-right: 0 !important; width: 100%; flex: 1 1 100%; }
  .gform_wrapper .gform_page_footer .gform_next_button,
  .gform_wrapper .gform_page_footer .button { min-height: 48px; min-width: 160px; }

  /* Privacy page: stacked "Forever Home Buyers" / "Privacy Policy" headings
     were left/right aligned; align both left on phones */
  #content .wpb_text_column h3[style*="text-align: right"] { text-align: left !important; }

  /* Long words / emails in legal pages never push the layout */
  .post-content p, .post-content li { overflow-wrap: anywhere; }
}

/* ---------- Small phones (<=480px) ---------- */
@media (max-width: 480px) {
  .vc_row.vc_column-gap-20 > .vc_col-sm-4:has(.card-text-design-in-row) { max-width: none; }
}

/* =====================================================================
   Global fixes (header, back-to-top, menu, footer, type)
   ===================================================================== */

/* ---------- All widths ---------- */
/* Button labels: the Ultimate buttons fell back to the browser serif */
.ubtn-link, .ubtn-link * {
  font-family: "Open Sans", Arial, sans-serif !important;
  font-weight: 700 !important;
}
/* Provicali ships one weight; stop the browser faking bold (smudged <strong>) */
h1, h2, h3, h4, h5, h6, h1 *, h2 *, h3 *, h4 *, h5 *, h6 * { font-synthesis: none; }
h1, h2, h3, h4 { text-wrap: balance; }

/* Back-to-top in brand blue instead of #333 */
#toTop, .to-top-container #toTop, #toTop:active, #toTop:focus {
  --totop_background: #1b75d0;
  --totop_background_hover: #155ea8;
  background-color: #1b75d0;
}
#toTop:hover, .to-top-container #toTop:hover { background-color: #155ea8; }

/* ---------- Tablet and below (<=1024px) ---------- */
@media (max-width: 1024px) {
  /* Sticky header (Avada turns its own off on tablet/phone) */
  html { scroll-padding-top: 88px; }
  .fusion-header-wrapper {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 10010;
    background: #fff;
    box-shadow: 0 2px 10px rgba(16, 24, 40, .08);
  }
  .fusion-header-wrapper .fusion-header {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    background: #fff;
  }
  .fusion-header-wrapper .fusion-logo { margin-top: 0 !important; margin-bottom: 0 !important; }
  .fusion-header-wrapper .fusion-logo img { max-height: 56px !important; width: auto; }
  /* desktop-style menu (shown above ~800px): match the 56px logo row */
  .fusion-header-wrapper .fusion-main-menu > ul > li > a { height: 56px !important; }

  /* Mobile menu: keep the open list inside the screen, soft shadow, current page */
  .fusion-mobile-nav-holder > ul {
    max-height: calc(100vh - 72px);
    max-height: calc(100dvh - 72px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    box-shadow: 0 10px 18px -8px rgba(16, 24, 40, .18);
  }
  .fusion-mobile-nav-holder .fusion-mobile-current-nav-item > a,
  .fusion-mobile-nav-holder .fusion-mobile-current-nav-item > a .menu-text {
    color: #d63f44 !important;
  }
  .fusion-mobile-nav-holder .fusion-mobile-current-nav-item > a {
    box-shadow: inset 4px 0 0 #d63f44;
  }
  /* Hamburger toggles to an X (class added by fhb-mobile.js) */
  .fusion-mobile-menu-icons a.fhb-menu-open:before { content: "\00d7"; font-family: Arial, sans-serif; font-size: 34px; font-weight: 400; line-height: 1; }

  /* Back-to-top: Avada hides it on mobile; show a 44px round button */
  .no-mobile-totop .to-top-container { display: block !important; }
  .to-top-container #toTop,
  #toTop {
    right: 16px !important;
    left: auto !important;
    bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 12px rgba(16, 24, 40, .25);
  }
  #toTop:before { line-height: 44px !important; color: #fff; }
  .fusion-footer-copyright-area { padding-bottom: 76px !important; }

  /* Footer link tap targets */
  .fusion-footer .textwidget p { margin-top: 0; margin-bottom: 0; }
  .fusion-footer .textwidget p a {
    display: inline-block;
    padding: 10px 0;
    line-height: 1.4;
  }
  /* Contact rows: fixed-width icons so the text lines up */
  .fusion-footer .textwidget p:has(> i) {
    display: flex;
    align-items: center;
    min-height: 44px;
  }
  .fusion-footer .textwidget p > i {
    flex: 0 0 22px;
    width: 22px;
    margin-right: 10px;
    text-align: center;
  }
  /* Copyright: even line spacing; links stay inline, padding only grows the tap area */
  .fusion-footer .fusion-copyright-notice,
  .fusion-footer .fusion-copyright-notice b { line-height: 1.9; }
  .fusion-footer .fusion-copyright-notice a {
    display: inline;
    padding: 10px 0;
  }
}

/* Footer as a 2-column grid on large phones / tablets */
@media (min-width: 600px) and (max-width: 1024px) {
  .fusion-footer .fusion-footer-widget-area .fusion-columns {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    column-gap: 32px;
    row-gap: 8px;
  }
  .fusion-footer-widget-area .fusion-columns > .fusion-column {
    width: auto !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .fusion-footer-widget-area .fusion-columns > .fusion-column:first-child { grid-column: 1 / -1; }
  .fusion-footer-widget-area .fusion-columns > .fusion-clearfix { display: none; }
}

/* Phones: smaller footer logo */
@media (max-width: 599px) {
  .fusion-footer-widget-area #media_image-2 img { max-width: 170px !important; }
}
