/* ============================================================
   AURÉLIS — Responsive
   Desktop-first, fluid down to mobile.
   ============================================================ */

/* Contact map placeholder (rendered on wide + tablet) */
.contact { grid-template-areas: "text form"; }
.contact__map {
  position: relative; inset: auto; height: auto; opacity: 1;
  grid-column: 1 / -1; margin-top: 2rem;
  aspect-ratio: 21/6; border-radius: var(--radius); overflow: hidden;
  border: 1px solid var(--line); background: radial-gradient(circle at 30% 50%, #141414, #0a0a0a);
}
.contact__map-grid { display: block; position: absolute; inset: 0;
  background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 40px 40px;
  mask-image: radial-gradient(circle at 30% 50%, #000 20%, transparent 75%);
  -webkit-mask-image: radial-gradient(circle at 30% 50%, #000 20%, transparent 75%); }
.contact__map-pin { display: block; position: absolute; left: 30%; top: 50%; width: 14px; height: 14px; border-radius: 50%; background: var(--gold); transform: translate(-50%, -50%); }
.contact__map-pin::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 1px solid var(--gold); animation: ping 2.6s var(--ease-out) infinite; }

/* ---------- Large laptop ---------- */
@media (max-width: 1200px) {
  .properties__grid { grid-template-columns: repeat(2, 1fr); }
  .why__grid { grid-template-columns: repeat(3, 1fr); }
  .agents__grid { grid-template-columns: repeat(2, 1fr); }
  .hero__cards { position: static; flex-direction: row; margin-top: 3rem; max-width: var(--maxw); margin-left: auto; margin-right: auto; flex-wrap: wrap; }
  .hero__card { flex: 1 1 180px; }
}

/* ---------- Tablet ---------- */
@media (max-width: 960px) {
  :root { --nav-h: 70px; }
  .nav__links { display: none; }
  .nav__cta { display: none; }
  .nav__burger { display: flex; }

  .mega { display: none; }

  /* Hero: let it breathe, keep stats as a compact strip */
  .hero { min-height: auto; padding-top: calc(var(--nav-h) + 3rem); padding-bottom: 3rem; }
  .hero__title { font-size: clamp(2.8rem, 11vw, 5rem); }
  .hero__cards { margin-top: 2.4rem; gap: 0.7rem; }
  .hero__scroll { display: none; }

  .search__panel { grid-template-columns: 1fr 1fr; }
  .search__submit { grid-column: 1 / -1; }

  .map, .about, .calc, .faq, .contact { grid-template-columns: 1fr; }
  .contact { grid-template-areas: "text" "form" "map"; }
  .contact__text { grid-area: text; } .contact__form { grid-area: form; } .contact__map { grid-area: map; }
  .about__media { max-width: 520px; margin: 0 auto; width: 100%; }
  .numbers { grid-template-columns: repeat(2, 1fr); }
  .journal__grid { grid-template-columns: 1fr 1fr; }
  .post--lead { grid-column: 1 / -1; }
  .newsletter__inner { grid-template-columns: 1fr; }
  .footer__top { grid-template-columns: 1fr; }
  .modal__card { grid-template-columns: 1fr; max-height: 92vh; overflow-y: auto; }
  .modal__gallery { min-height: 260px; height: 260px; }
  .section-head { flex-direction: column; align-items: flex-start; }
  .section-head--center { align-items: center; }
  .services__row { grid-template-columns: 60px 1fr; grid-template-areas: "no title" "no desc" ". arrow"; row-gap: 0.4rem; }
  .services__no { grid-area: no; } .services__row h3 { grid-area: title; } .services__row p { grid-area: desc; } .services__arrow { grid-area: arrow; justify-self: start; }
}

/* ---------- Large phone ---------- */
@media (max-width: 680px) {
  :root { --radius: 14px; }
  .properties__grid { grid-template-columns: 1fr; }
  .why__grid { grid-template-columns: 1fr; }
  .agents__grid { grid-template-columns: 1fr 1fr; gap: 1rem; }
  .search__panel { grid-template-columns: 1fr; }
  .gallery__grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 160px; }
  .gallery__item--wide { grid-column: span 2; }
  .journal__grid { grid-template-columns: 1fr; }
  .calc__results { grid-template-columns: 1fr; }
  .about__stats { flex-wrap: wrap; gap: 1.4rem 2rem; }
  .footer__cols { grid-template-columns: 1fr 1fr; }
  .footer__bottom { flex-direction: column; text-align: center; }
  /* Stats as a tidy 3-up strip rather than tall stacked cards */
  .hero__cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; flex-wrap: nowrap; }
  .hero__card { flex: none; min-width: 0; padding: 0.9rem 0.7rem; }
  .hero__card-num { font-size: 1.35rem; }
  .hero__card-label { font-size: 0.56rem; letter-spacing: 0.1em; }
  .quote { width: 300px; padding: 1.6rem; }
  .quote p { font-size: 1.1rem; }
  /* Slightly smaller floating actions on phones */
  .fab__btn { width: 46px; height: 46px; }
  .fab { gap: 0.6rem; }
}

/* ---------- Small phone ---------- */
@media (max-width: 420px) {
  .agents__grid { grid-template-columns: 1fr; }
  .gallery__grid { grid-template-columns: 1fr; }
  .gallery__item--wide { grid-column: span 1; }
  .footer__cols { grid-template-columns: 1fr; }
  .btn { --_pad: 0.9rem 1.6rem; font-size: 0.76rem; }
  .fab { right: 1rem; bottom: 1rem; }
}

/* ---------- Touch devices: disable custom cursor + refine ---------- */
@media (hover: none) {
  .card__view { opacity: 1; transform: none; }        /* CTAs always visible on touch */
  .agent__socials { opacity: 1; transform: none; }
}