/* Golfi Real Estate — Mobile Experience */

/* ═══════════════════════════════════════════════
     WORLD-CLASS MOBILE EXPERIENCE
  ═══════════════════════════════════════════════ */

  /* ── MOBILE HEADER ─────────────────────────── */
  @media (max-width: 991px) {
    .mobile-header.mobile-header2 {
      position: sticky !important;
      top: 0;
      z-index: 9999;
      background: #ffffff !important;
      box-shadow: 0 2px 16px rgba(0,0,0,0.10) !important;
      padding: 10px 0 !important;
      border-bottom: 2px solid #003DA5;
    }
    .mobile-header-elements {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 0 4px;
    }
    .mobile-logo a img {
      max-height: 38px !important;
      width: auto !important;
    }
    /* Style the hamburger + icon buttons */
    .mobile-right .circle-button {
      width: 38px !important;
      height: 38px !important;
      border-radius: 8px !important;
      background: #f4f5f7 !important;
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      border: none !important;
    }
    .mobile-right .circle-button svg path { fill: #0D1B3E !important; }
    .mobile-nav-icon.dots-menu {
      width: 42px !important;
      height: 42px !important;
      border-radius: 8px !important;
      background: #0D1B3E !important;
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      cursor: pointer;
    }
    .mobile-nav-icon.dots-menu svg { fill: #ffffff !important; width: 20px; height: 20px; }
  }

  /* ── MOBILE SIDEBAR ───────────────────────── */
  @media (max-width: 991px) {
    .mobile-sidebar.mobile-sidebar2 {
      background: #0D1B3E !important;
      width: 300px !important;
    }
    .mobile-nav-list li a {
      color: #ffffff !important;
      font-size: 15px !important;
      font-weight: 500 !important;
      padding: 12px 0 !important;
      border-bottom: 1px solid rgba(255,255,255,0.08) !important;
    }
    .mobile-nav-list li a:hover { color: #003DA5 !important; }
    .mobile-sidebar .side-logo img { max-height: 44px !important; }
    .mobile-sidebar .side-close { color: #fff !important; }
  }

  /* ── HERO SECTION MOBILE ──────────────────── */
  @media (max-width: 767px) {
    .hero2-slider-area::after { display: none; }
    .hero2-slider-area .container { padding-bottom: 32px; }

    /* Hero text sizing */
    .hero2-slider-area h1,
    .hero2-slider-area .hero-heading {
      font-size: 28px !important;
      line-height: 1.25 !important;
    }
    .hero2-slider-area p {
      font-size: 15px !important;
      line-height: 1.65 !important;
    }
    /* Hero search box */
    .hero2-search-form,
    .hero-search-area {
      border-radius: 12px !important;
      padding: 16px !important;
    }
    .hero2-search-form .search-input,
    .hero-search-area input {
      font-size: 15px !important;
      padding: 14px 16px !important;
      border-radius: 8px !important;
    }
    .hero2-search-form .theme-btn,
    .hero-search-area .theme-btn {
      width: 100% !important;
      padding: 14px !important;
      font-size: 15px !important;
      font-weight: 600 !important;
      border-radius: 8px !important;
      margin-top: 8px;
    }
  }

  /* ── PROPERTY CARDS MOBILE ────────────────── */
  @media (max-width: 767px) {
    .property-card,
    .property-item,
    .property-box {
      border-radius: 14px !important;
      overflow: hidden !important;
      box-shadow: 0 4px 20px rgba(0,0,0,0.09) !important;
      margin-bottom: 20px !important;
    }
    .property-card img,
    .property-item img,
    .property-box img {
      border-radius: 0 !important;
    }
    .property-card .property-info,
    .property-item .property-content,
    .property-box .property-content {
      padding: 16px !important;
    }
    .property-card h4, .property-card h3,
    .property-item h4, .property-item h3 {
      font-size: 16px !important;
      line-height: 1.35 !important;
      margin-bottom: 6px !important;
    }
    /* Price styling */
    .property-card .price,
    .property-item .price,
    .property-price {
      font-size: 18px !important;
      font-weight: 700 !important;
      color: #003DA5 !important;
    }
    /* Feature icons row */
    .property-features,
    .property-meta {
      gap: 12px !important;
      font-size: 13px !important;
    }
  }

  /* ── SECTION HEADERS MOBILE ───────────────── */
  @media (max-width: 767px) {
    .section-title, .section-header h2,
    .heading-area h2 {
      font-size: 24px !important;
      line-height: 1.3 !important;
    }
    .section-desc, .section-header p,
    .heading-area p {
      font-size: 15px !important;
    }
    /* Section vertical padding */
    section, .section-area {
      padding-top: 52px !important;
      padding-bottom: 52px !important;
    }
  }

  /* ── AGENT/TEAM CARDS MOBILE ──────────────── */
  @media (max-width: 767px) {
    .agent-card, .team-card, .agent-item {
      border-radius: 14px !important;
      overflow: hidden !important;
      box-shadow: 0 4px 20px rgba(0,0,0,0.08) !important;
    }
    .agent-card img, .team-card img { height: 220px !important; object-fit: cover !important; }
    .agent-info, .team-info { padding: 16px !important; }
    .agent-info h4, .team-info h4 { font-size: 16px !important; }
  }

  /* ── FOOTER MOBILE ────────────────────────── */
  @media (max-width: 767px) {
    .footer2-section-area { padding-top: 56px !important; padding-bottom: 100px !important; }
    .footer-brand-row { flex-wrap: wrap; gap: 12px; }
    .footer2-section-area h3 { font-size: 16px !important; margin-bottom: 16px !important; }
    .footer2-section-area li { margin-bottom: 10px !important; }
    .footer2-section-area .copyright { text-align: center; }
  }

  /* ── CTA SECTION MOBILE ───────────────────── */
  @media (max-width: 767px) {
    .golfi-cta-area { padding: 48px 0 !important; }
    .golfi-cta-area .cta-header h2 { font-size: 24px !important; }
    .golfi-cta-area .cta-header p { font-size: 15px !important; }
    .golfi-cta-btn, .golfi-cta-phone { padding: 16px 24px !important; font-size: 15px !important; }
    /* Stack on mobile */
    .golfi-cta-actions { margin-top: 28px !important; }
  }

  /* ── FLOATING MOBILE ACTION BAR ───────────── */
  .mobile-action-bar {
    display: none;
  }
  @media (max-width: 991px) {
    .mobile-action-bar {
      display: flex;
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      z-index: 9998;
      background: #0D1B3E;
      padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
      gap: 10px;
      box-shadow: 0 -4px 24px rgba(0,0,0,0.22);
    }
    .mobile-action-bar a {
      flex: 1;
      display: flex !important;
      align-items: center;
      justify-content: center;
      gap: 7px;
      padding: 13px 12px;
      border-radius: 10px;
      font-size: 14px;
      font-weight: 600;
      text-decoration: none;
      letter-spacing: 0.3px;
    }
    .mobile-action-bar .mab-call {
      background: #003DA5;
      color: #fff !important;
    }
    .mobile-action-bar .mab-listings {
      background: rgba(255,255,255,0.10);
      color: #fff !important;
      border: 1.5px solid rgba(255,255,255,0.25);
    }
    .mobile-action-bar .mab-listings:hover,
    .mobile-action-bar .mab-call:hover { opacity: 0.92; }
    /* Push page content above the bar */
    body { padding-bottom: 76px !important; }
  }

  /* ── BUTTONS — min touch target 44px ─────── */
  @media (max-width: 991px) {
    .theme-btn, .theme-btn3, .btn, button {
      min-height: 44px !important;
    }
    a { -webkit-tap-highlight-color: rgba(0,61,165,0.15); }
  }

  /* ── COUNTERS/STATS MOBILE ────────────────── */
  @media (max-width: 767px) {
    .counter-section-area .col-6,
    .counter-section .col-6 { margin-bottom: 24px; }
    .counter, .counter-number { font-size: 32px !important; }
  }

  /* ── PRELOADER — hidden for local file preview ── */
  .preloader { display: none !important; }
  body { overflow: auto !important; }
  .loading { border-color: #003DA5 transparent transparent transparent !important; }
  /* ── AGENT CARDS ─────────────────────────────── */
  .agent-social a:hover { background: #003DA5 !important; }
  /* ── HERO REMAX BADGE ────────────────────────── */
  .remax-hero-badge { position: absolute; bottom: 32px; right: 5%; display: flex; flex-direction: column; align-items: center; gap: 6px; z-index: 10; opacity: 0.92; }
  /* ── HERO LEFT PANEL — RE/MAX BLUE OVERLAY ───── */
  .hero2-slider-area { position: relative; }
  .hero2-slider-area::after {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 44%;
    height: 100%;
    background: linear-gradient(to right,
      rgba(0, 61, 165, 0.52) 0%,
      rgba(0, 61, 165, 0.32) 72%,
      rgba(0, 61, 165, 0.00) 100%
    );
    pointer-events: none;
    z-index: 1;
  }
  .hero2-slider-area .container { position: relative; z-index: 2; }