/* "Now leasing" teaser on the homepage — see homes-for-rent/page_content/home-teaser.php
   Layout: the copy and button across the top, the three newest homes full-width underneath
   (side by side from 768px, a swipe row on phones). */
.alt-teaser { background: #fbf7f0; padding: 4.5rem 0; }
.alt-teaser-inner {
  background: #fff; border-radius: 24px; padding: 2.75rem; box-shadow: 0 18px 44px rgba(9, 56, 71, .10);
}
.alt-teaser-copy {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 2.5rem; align-items: end;
  margin-bottom: 2.25rem;
}
.alt-teaser-copy > .alt-teaser-eyebrow, .alt-teaser-copy > .alt-teaser-title, .alt-teaser-copy > .alt-teaser-lead { grid-column: 1; }
.alt-teaser-copy > .btn { grid-column: 2; grid-row: 1 / span 3; align-self: end; margin-bottom: .25rem; white-space: nowrap; }
.alt-teaser-eyebrow {
  justify-self: start;
  display: inline-flex; align-items: center; gap: .45rem; background: #eef6e4; color: #477703;
  font-weight: 700; font-size: .8rem; letter-spacing: .06em; text-transform: uppercase;
  padding: .4rem .9rem; border-radius: 999px; margin-bottom: 1rem;
}
.alt-teaser-eyebrow i { font-size: 1rem; }
.alt-teaser-title { font-size: clamp(1.7rem, 3vw, 2.4rem); line-height: 1.15; color: #093847; font-weight: 700; margin-bottom: .75rem; max-width: 46rem; }
.alt-teaser-lead { font-size: 1.1rem; line-height: 1.6; color: #5b6b72; margin: 0; max-width: 42rem; }
.alt-teaser .btn-primary { background: #599404; border-color: #599404; }
.alt-teaser .btn-primary:hover, .alt-teaser .btn-primary:focus { background: #477703; border-color: #477703; }

.alt-teaser-homes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.alt-home {
  display: flex; flex-direction: column; background: #fff; border: 1px solid #e7e2d7; border-radius: 16px; overflow: hidden;
  color: #1d2b31; transition: transform .2s ease, box-shadow .2s ease;
}
.alt-home:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(9, 56, 71, .14); color: #1d2b31; }
.alt-home:focus-visible { outline: 3px solid #f4b740; outline-offset: 2px; }
.alt-home-photo { display: block; position: relative; aspect-ratio: 16 / 10; background: #e9ece6; overflow: hidden; }
.alt-home-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.alt-home:hover .alt-home-photo img { transform: scale(1.04); }
.alt-home-body { display: flex; flex-direction: column; gap: .2rem; padding: 1rem 1.15rem 1.15rem; }
.alt-home-body strong { font-size: 1.45rem; color: #093847; line-height: 1.1; white-space: nowrap; }
.alt-home-body small { font-size: .9rem; color: #5b6b72; font-weight: 600; margin-left: .1rem; }
.alt-home-facts { font-weight: 600; font-size: .95rem; }
.alt-home-city { color: #5b6b72; font-size: .9rem; }

@media (max-width: 991.98px) {
  .alt-teaser-inner { padding: 2rem 1.5rem; }
  .alt-teaser-copy { grid-template-columns: minmax(0, 1fr); margin-bottom: 1.75rem; }
  .alt-teaser-copy > .btn { grid-column: 1; grid-row: auto; justify-self: start; margin: 1.5rem 0 0; }
}
@media (max-width: 767.98px) {
  .alt-teaser { padding: 3rem 0; }
  .alt-teaser-homes {
    grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(230px, 78%);
    overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .5rem;
    margin: 0 -1.5rem; padding-left: 1.5rem; padding-right: 1.5rem;
  }
  .alt-home { scroll-snap-align: start; }
}