/* ============================================
   Mobile-first improvements for GR Gestión
   Touched in addition to the per-component
   media queries already in the other css files.
   ============================================ */

/* --- General mobile pass: <720px --- */
@media (max-width: 720px) {
  body { font-size: 15px; }

  /* HERO */
  .hero {
    min-height: auto;
    padding: 56px 0 80px;
  }
  .hero-shell { padding-top: 24px; }
  .hero-eyebrow { font-size: 11px; padding: 6px 12px; }
  .hero-title { margin-bottom: 14px; }
  .hero-title-sub { font-size: 10px; letter-spacing: 0.12em; margin-top: 10px; }
  .hero-lede { font-size: 15px; margin-bottom: 28px; }
  .hero-stats { gap: 18px; margin-top: 28px; }
  .hero-stats strong { font-size: 28px; }
  .hero-stats span { font-size: 10px; }
  .hero-stats .divider { display: none; }
  .hero-scroll { display: none; }

  /* SEARCH BAR */
  .search-bar { padding: 14px 14px 12px; border-radius: 18px; margin-bottom: 36px; }
  .search-fields { grid-template-columns: 1fr 1fr !important; }
  .search-field { padding: 10px 6px; border-right: none !important; border-bottom: 1px solid var(--line); }
  .search-field label { font-size: 9px; }
  .search-field select { font-size: 13px; }
  .search-submit {
    grid-column: 1 / -1 !important;
    margin-left: 0 !important;
    margin-top: 10px;
    padding: 14px !important;
    justify-content: center;
    width: 100%;
  }
  .search-hint { font-size: 11px; line-height: 1.4; }

  /* HEADER */
  .header-shell { height: 64px; gap: 0; }
  .logo-full { height: 30px; }
  .logo-icon { height: 32px; }
  .logo-badge img { height: 32px; width: 32px; }
  .logo-badge-name { font-size: 18px; }
  .logo-badge-sub { font-size: 8px; }
  .mobile-menu { padding: 8px 16px 16px; }

  /* SECTION HEADS */
  .section-head { flex-direction: column; align-items: flex-start; gap: 16px; margin-bottom: 36px; }
  .section-head.center { align-items: center; }
  .section-aside { max-width: 100%; }

  /* TRUST */
  .trust-strip { padding: 24px 0; margin-top: -32px; border-radius: 24px 24px 0 0; }
  .trust-grid { grid-template-columns: 1fr; gap: 16px; }
  .trust-item { gap: 14px; }
  .trust-icon { width: 38px; height: 38px; border-radius: 10px; }

  /* SERVICES */
  .services-grid { gap: 32px; }
  .service-card { padding: 22px; gap: 10px; }
  .service-card-wide { padding: 22px; }
  .service-title { font-size: 19px; }
  .service-num { font-size: 24px; }
  .service-bullets li { font-size: 13px; }

  /* MAP */
  .map-surface { height: 320px; border-radius: 16px; }
  .map-bg text { font-size: 3.2px !important; }
  .map-pin-price { font-size: 9px; padding: 2px 5px; }
  .map-pin-dot { width: 11px; height: 11px; }
  .map-active-card { border-radius: 16px; }
  .map-active-card img { height: 180px; }
  .map-active-body { padding: 16px; }
  .map-active-body h4 { font-size: 18px; }
  .map-legend { font-size: 11px; padding: 12px 14px; gap: 12px; flex-wrap: wrap; }

  /* ABOUT (home) */
  .about-media { height: 320px; }
  .about-years {
    padding: 16px 20px;
    bottom: 4%;
  }
  .about-years strong { font-size: 40px; }
  .about-years span { font-size: 9px; }
  .about-stats { gap: 16px; margin: 24px 0; padding: 20px 0; }
  .about-stats strong { font-size: 24px; }
  .about-stats span { font-size: 11px; }

  /* TESTIMONIALS */
  .testi-card { padding: 22px; }
  .testi-text { font-size: 16px; }

  /* PUBLISH CTA */
  .publish-cta {
    padding: 36px 24px;
    border-radius: 20px;
  }
  .publish-cta-actions { gap: 12px; }
  .publish-cta-stat { padding: 20px; }
  .publish-cta-stat strong { font-size: 24px; }

  /* PROP CARDS */
  .prop-card { border-radius: 16px; }
  .prop-body { padding: 16px; }
  .prop-title { font-size: 19px; }
  .prop-price { font-size: 22px; }
  .prop-specs { gap: 10px 14px; padding: 10px 0; margin-bottom: 14px; }
  .prop-actions { gap: 6px; }
  .prop-actions .btn-secondary,
  .prop-actions .wa-btn { padding: 10px 12px; font-size: 12px; }

  /* LISTING */
  .listing-head { padding: 28px 0 32px; }
  .listing-title { font-size: 28px; gap: 10px; }
  .listing-count { font-size: 11px; }
  .listing-shell { padding-top: 24px; gap: 24px; }
  .filter-side {
    position: static;
    padding: 20px 18px;
    border-radius: 14px;
  }
  .filter-side h3 { font-size: 19px; margin-bottom: 18px; padding-bottom: 14px; }
  .filter-group { margin-bottom: 22px; }
  .listing-toolbar {
    flex-wrap: wrap;
    gap: 12px;
  }
  .view-switch button { padding: 7px 12px; font-size: 12px; }
  .sort { font-size: 12px; }
  .sort select { padding: 7px 26px 7px 10px; font-size: 12px; }

  /* LISTING MAP VIEW */
  .listing-map { gap: 12px; }
  .listing-map-canvas { height: 320px; }
  .listing-map-list { max-height: 380px; }

  /* DETAIL */
  .detail-head { padding: 16px 20px 0; }
  .detail-title-block h1 { font-size: 26px; }
  .detail-price { font-size: 28px !important; }
  .detail-tags .badge { font-size: 9px; }
  .gallery-main { border-radius: 14px; }
  .gallery-nav { width: 36px; height: 36px; }
  .gallery-nav.prev { left: 12px; }
  .gallery-nav.next { right: 12px; }
  .gallery-thumbs { grid-template-columns: repeat(4, 1fr); gap: 6px; }
  .gallery-thumbs .thumb:nth-child(n+5) { display: none; }
  .detail-body { gap: 32px; }
  .detail-specs-row { padding: 18px 14px; gap: 8px; }
  .spec-tile strong { font-size: 20px; }
  .spec-tile span { font-size: 10px; }
  .detail-tabs { overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; }
  .detail-tabs::-webkit-scrollbar { display: none; }
  .detail-tabs button { white-space: nowrap; padding: 12px 14px; font-size: 13px; }
  .detail-section h3 { font-size: 21px; }
  .features-list { grid-template-columns: 1fr; }
  .agent-card { padding: 14px; }
  .visit-form { padding: 18px; }

  /* ABOUT PAGE */
  .about-hero { padding: 56px 0 40px; }
  .about-hero-title { font-size: 36px; margin-bottom: 18px; }
  .timeline-list { margin-top: 28px; }
  .timeline-list::before { left: 8px; }
  .timeline-list li { grid-template-columns: 60px 1fr; gap: 14px; padding: 18px 0; }
  .timeline-list li::before { left: 4px; }
  .t-year { font-size: 18px; padding-top: 2px; }
  .timeline-list h4 { font-size: 18px; }
  .timeline-list p { font-size: 14px; }
  .team-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .team-card { padding: 22px 14px; }
  .team-avatar { width: 64px; height: 64px; font-size: 22px; }
  .team-card h3 { font-size: 17px; }

  /* PUBLISH */
  .publish-hero { padding: 56px 0; }
  .publish-hero h1 { font-size: 30px; margin-bottom: 24px; }
  .publish-benefits { gap: 10px; }
  .publish-benefits li { font-size: 12px; padding: 8px 12px; }
  .publish-form-shell { padding-top: 32px; }
  .publish-form { padding: 24px 20px; border-radius: 16px; }
  .form-step h2 { font-size: 22px; margin-bottom: 20px; }
  .form-progress { margin-bottom: 32px; gap: 4px; }
  .progress-step em { font-size: 9px; }
  .progress-step span { width: 28px; height: 28px; font-size: 12px; }
  .form-progress::before { top: 14px; left: 16%; right: 16%; }
  .form-radio-grid { grid-template-columns: 1fr; }
  .radio-card { padding: 18px; }
  .form-actions .btn-primary,
  .form-actions .btn-secondary { padding: 12px 16px; font-size: 13px; }
  .publish-success { padding: 40px 24px; border-radius: 16px; margin: 40px 0; }
  .publish-success h1 { font-size: 26px; }
  .success-icon { width: 68px; height: 68px; }

  /* CONTACT */
  .page-contact { padding: 56px 0; }
  .contact-shell h1 { font-size: 32px; }
  .contact-grid { grid-template-columns: 1fr; gap: 12px; margin-top: 32px; }
  .contact-card { padding: 24px; }
  .contact-card h3 { font-size: 20px; }

  /* FOOTER */
  .site-footer { padding: 48px 0 0; }
  .footer-cols { grid-template-columns: repeat(2, 1fr); gap: 24px; }
  .footer-bottom { padding: 20px 20px; font-size: 11px; }

  /* WHATSAPP BUTTONS — restore solid green on the big button at mobile since
     it acts as the page's primary CTA when the floating btn is small */
  .wa-btn-lg {
    padding: 14px 18px;
    gap: 10px;
  }
  .wa-btn-lg strong { font-size: 14px; }
  .wa-btn-lg em { font-size: 11px; }
}

/* --- Very small phones: <420px --- */
@media (max-width: 420px) {
  .shell { padding: 0 16px; }
  .hero-title { font-size: 40px !important; }
  .section-title { font-size: 28px !important; }
  .footer-cols { grid-template-columns: 1fr; }
  .form-progress em { display: none; }
  .form-progress::before { top: 14px; }
  .header-cta { display: none !important; }
  .listing-toolbar { justify-content: space-between; }
  .gallery-thumbs { grid-template-columns: repeat(3, 1fr); }
  .gallery-thumbs .thumb:nth-child(n+4) { display: none; }
}

/* Prevent body horizontal scroll just in case */
html, body { overflow-x: hidden; }