/* ==========================================================================
   Totality Estates — Mobile experience (phones, <= 640px)
   Consolidated on a fresh path so it is delivered clean past any cache.
   Loaded LAST, so these rules win the cascade.
   Contains: swipe carousels, dot indicators, tidy article rows, docked FAB.
   ========================================================================== */

/* Base (all widths): dots hidden until mobile JS shows them; article label stacks. */
.te-dots { display: none; }
.te-article__cat { display: block; }
.te-article__title { display: block; }

/* Find-My-Property pill tucks away on scroll-down, returns on scroll-up (chrome.js). */
.te-fab { transition: transform .32s cubic-bezier(.2, .8, .2, 1), opacity .28s ease; }
.te-fab--hidden {
  animation: none !important;              /* cancel the entrance/glow animation so the hide transform wins */
  transform: translateY(160%) !important;
  opacity: 0;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .te-fab { transition: opacity .2s ease; }
  .te-fab--hidden { transform: none !important; }
}

@media (max-width: 640px) {

  /* ---- Swipe carousels: each card grid becomes a horizontal scroll-snap rail ---- */
  .te-featured__grid,
  .te-how__grid,
  .te-areas__grid,
  .te-whyt__grid,
  .te-pathways__grid,
  .te-tst__grid {
    display: flex;
    grid-template-columns: none;
    gap: 13px;
    margin-top: 22px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 2px 2px 6px;
    scroll-padding-left: 2px;
    overscroll-behavior-x: contain;
  }
  .te-featured__grid::-webkit-scrollbar,
  .te-how__grid::-webkit-scrollbar,
  .te-areas__grid::-webkit-scrollbar,
  .te-whyt__grid::-webkit-scrollbar,
  .te-pathways__grid::-webkit-scrollbar,
  .te-tst__grid::-webkit-scrollbar { display: none; }

  .te-featured__grid > .te-pcard { flex: 0 0 84%; scroll-snap-align: start; aspect-ratio: auto; height: 468px; }
  .te-featured__grid > .te-pcard[hidden] { display: none !important; }
  .te-featured__grid .te-pcard__body { padding: 18px; }
  .te-featured__grid .te-pcard__title { font-size: 23px; line-height: 1.1; }
  .te-featured__grid .te-pcard__area { font-size: 13px; }
  .te-featured__grid .te-pcard__specs { gap: 7px 12px; margin: 4px 0; }
  .te-featured__grid .te-pcard__spec { font-size: 12.5px; }
  .te-featured__grid .te-pcard__price { font-size: 21px; }
  .te-featured__grid .te-pcard__price-label { font-size: 12px; }
  .te-featured__grid .te-pcard__cta { padding: 11px 16px; font-size: 13px; }
  .te-featured__grid .te-pcard__badges { top: 14px; left: 14px; gap: 7px; }
  .te-featured__grid .te-pcard__fav { top: 12px; right: 12px; }
  .te-how__grid > .te-step { flex: 0 0 74%; scroll-snap-align: start; }
  .te-areas__grid > .te-acard { flex: 0 0 80%; scroll-snap-align: start; }
  .te-whyt__grid > .te-fcard { flex: 0 0 80%; scroll-snap-align: start; }
  .te-pathways__grid > .te-fcard { flex: 0 0 80%; scroll-snap-align: start; }
  .te-tst__grid > .te-tcard { flex: 0 0 86%; scroll-snap-align: start; }
  .te-featured__empty { flex: 0 0 100%; }

  .te-featured__control { margin-top: 18px; }
  .te-how__foot, .te-areas__foot, .te-featured__foot, .te-tst__investors { margin-top: 24px; }
  .te-section__sub { margin-bottom: 2px; }

  /* ---- Dot indicators ---- */
  .te-dots { display: flex; gap: 6px; justify-content: center; padding: 15px 0 2px; }
  .te-dots[hidden] { display: none !important; }
  .te-dots i { width: 6px; height: 6px; border-radius: 999px; background: var(--te-border); transition: width .25s, background .25s; }
  .te-dots i.on { background: var(--te-accent); width: 20px; }

  /* ---- Latest articles: tidy thumbnail + label/title row ---- */
  .te-article { grid-template-columns: 82px 1fr; gap: 13px; align-items: center; }
  .te-article__thumb { height: 64px; }
  .te-article__cat { font-size: 11px; letter-spacing: 0.1em; }
  .te-article__title { font-size: 15px; line-height: 1.3; margin-top: 3px; }
  .te-article__chevron { display: none; }
  .te-articles { gap: 16px; }

  /* ---- Dock the Find-My-Property pill as a bottom bar ---- */
  .te-fab { left: var(--te-gutter); right: var(--te-gutter); bottom: 12px; justify-content: center; gap: 8px; }
  .te-fab__pill { flex: 1; justify-content: center; padding: 15px 18px; box-shadow: 0 10px 30px rgba(8,14,26,0.38); }
  .te-fab__dismiss { width: 46px; height: 46px; }
  .te-footer { padding-bottom: 92px; }
}