/*
 * Utility classes used in the PHP markup but missing from assets/app.css.
 *
 * app.css is a compiled Tailwind bundle inherited from the retired React app.
 * It was built by scanning that React source, so utilities that appear only in
 * the newer PHP markup were purged and silently do nothing. This file backfills
 * the ones whose absence causes a visible defect — it is not a full rebuild.
 *
 * Before adding a rule here, confirm the class really is missing:
 *   grep -c '\.the-class{' assets/app.css
 * and that no hand-written sheet or inline <style> already defines it.
 */

/* home.php:1250 — room-card tag badge. Without this the badge gets top:auto,
   drops below the 16:9 image, and is erased by .custom-room-card-image's
   overflow:hidden, hiding PREMIUM / POPULAR / NEW entirely. */
.top-4 {
  top: 1rem;
}

/* locations.php, partials/amenities.php, partials/services.php, testimonial.php —
   keeps native hash jumps clear of the 80px sticky header. Does not affect
   assets/page-hero-scroll.js, which does its own window.scrollTo math. */
.scroll-mt-28 {
  scroll-margin-top: 7rem;
}

/* partials/blogs.php:44 — hero scrim behind the white heading. */
.bg-black\/50 {
  background-color: rgb(0 0 0 / 0.5);
}

/* partials/amenities.php:21 — collage tiles. Without a width they size to each
   image's aspect ratio and the strip renders ragged. */
.w-\[200px\] {
  width: 200px;
}

/* partials/blogs.php:42 and partials/blog-single.php — hero proportions. */
.h-\[40vh\] {
  height: 40vh;
}

.h-\[42vh\] {
  height: 42vh;
}

.min-h-\[280px\] {
  min-height: 280px;
}

@media (min-width: 768px) {
  .md\:w-\[260px\] {
    width: 260px;
  }

  .md\:h-\[50vh\] {
    height: 50vh;
  }

  .md\:h-\[52vh\] {
    height: 52vh;
  }
}