/* Rooms page extracted styles (from views/pages/rooms.php) */
.h-screen { height: 100vh; }

.rooms-gallery { background: white; margin: 0 auto; }

.rooms-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; }
.room-item { display: flex; flex-direction: column; align-items: center; }
.room-title {  font-weight: 500; color: #1f2937; text-transform: uppercase; margin-bottom: 1rem; letter-spacing: 0.05em; text-align: center; }
.room-card { background: white; border-radius: 8px; box-shadow: 0 4px 6px rgba(0,0,0,0.1); overflow: hidden; transition: all 0.3s ease; width: 100%; }
.room-card:hover { box-shadow: 0 20px 25px rgba(0,0,0,0.15); transform: translateY(-4px); }
.room-image { height: 20rem; overflow: hidden; }
.room-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
.room-card:hover .room-image img { transform: scale(1.05); }
.room-content { padding: 1.5rem; background-color: #6b8a99; color: white; text-align: center; }
.room-subtitle { color: white; font-style: italic; font-family: 'Montserrat', serif; }

/* Tablet - 2 columnas */
@media (min-width: 768px) {
  .rooms-grid { grid-template-columns: repeat(2, 1fr); gap: 3rem; }
}

/* Desktop - 3 columnas */
@media (min-width: 1024px) {
  .rooms-grid { grid-template-columns: repeat(3, 1fr); gap: 3rem; }
  .room-image { height: 450px; }
}