/*
 *  PropertyVisibles — Responsive Breakpoints
 *  Tablet: 769–1024px | Phone: ≤768px
 *  Desktop styles are NEVER overridden here.
 */

/* ═══════════════════════════════════════════════
   TABLET (769–1024px)
   ═══════════════════════════════════════════════ */
@media (max-width: 1024px) {

  /* ── Global ── */
  .wrap { padding: 0 1.5rem; }

  /* ── Pillars ── */
  .pillars-grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
  }
  .p-newdev { grid-column: 1 / -1; grid-row: auto; min-height: 280px; }
  .p-resi   { grid-column: 1 / -1; grid-row: auto; min-height: 190px; }
  .p-comm   { grid-column: auto; grid-row: auto; min-height: 190px; }
  .p-plots  { grid-column: auto; grid-row: auto; min-height: 190px; }

  /* ── Insights ── */
  .insights-grid { grid-template-columns: 1fr 1fr; }

  /* ── AI Finder ── */
  .ai-title { font-size: 1.4rem; }

  /* ── Area Links ── */
  .area-grid { grid-template-columns: repeat(2, 1fr); }

  /* ── Services ── */
  .services-grid { grid-template-columns: 1fr; }
  .srv-card--large { grid-row: auto; }

  /* ── Contact ── */
  .contact-grid {
    grid-template-columns: 1fr 1fr;
  }

  /* ── Agents ── */
  .agents-grid { grid-template-columns: repeat(2, 1fr); }

  /* ── Footer ── */
  .pv-foot-inner,
  .foot-inner {
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }

  /* ── Featured ── */
  .featured-head { padding: 0 1.5rem; }
}


/* ═══════════════════════════════════════════════
   PHONE (≤768px)
   ═══════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* ── Global ── */
  .wrap,
  .pv-foot-inner,
  .foot-inner { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }
  .section { padding: 2.5rem 0; }
  .section-head { flex-direction: column; align-items: flex-start; gap: .75rem; }

  /* ── Hero ── */
  .hero { min-height: auto; }
  h1.hero-title { font-size: 1.8rem; }
  .hero-sub { font-size: .75rem; max-width: none; }
  .hero-btns { flex-wrap: wrap; }
  .hero-stats { gap: 1.5rem; flex-wrap: wrap; }
  .hs-num { font-size: 1.1rem; }
  .hsp-inner { padding: 1.2rem 1rem; }

  /* ── Pillars ── */
  .pillars-grid {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }
  .p-newdev,
  .p-resi,
  .p-comm,
  .p-plots {
    grid-column: auto;
    grid-row: auto;
    min-height: 200px;
  }

  /* ── Featured ── */
  .featured-head {
    flex-direction: column;
    align-items: flex-start;
    gap: .75rem;
    padding: 0 1rem;
  }

  /* ── Insights ── */
  .insights-grid { grid-template-columns: 1fr; }

  /* ── AI Finder ── */
  .ai-split,
  .ai-section-inner {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .ai-title { font-size: 1.4rem; }
  .ai-messages { min-height: 220px; }

  /* AI floating widget — full width */
  .ai-float-panel {
    width: calc(100vw - 2rem);
    right: 1rem;
  }

  /* ── Area Links ── */
  .area-grid { grid-template-columns: 1fr; }

  /* ── Services ── */
  .services-grid { grid-template-columns: 1fr; }
  .srv-card--large { grid-row: auto; }

  /* ── About ── */
  .about-grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .about-portrait { min-height: 280px; }
  .about-exp-badges { grid-template-columns: repeat(2, 1fr); }

  /* ── Mortgage ── */
  .mortgage-grid { grid-template-columns: 1fr; }

  /* ── Newsletter ── */
  .newsletter-inner {
    flex-direction: column;
    gap: 1.5rem;
    text-align: center;
  }
  .nl-form { max-width: 100%; }
  .nl-text { text-align: center; }

  /* ── Contact ── */
  .contact-grid { grid-template-columns: 1fr; }
  .cfc-row { grid-template-columns: 1fr; }
  .cf-row { grid-template-columns: 1fr; }

  /* ── Agents ── */
  .agents-grid { grid-template-columns: 1fr; }

  /* ── Footer ── */
  .pv-foot-inner,
  .foot-inner {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .pv-foot-bottom,
  .foot-bottom {
    flex-direction: column;
    text-align: center;
    gap: .75rem;
  }

  /* ── Touch targets ── */
  .arr-btn { min-width: 44px; min-height: 44px; }
  .nav-link { min-height: 44px; }
  .area-chip { min-height: 44px; }
}
