/* ==========================================================================
   3. AMENITIES PAGE SPECIFIC STYLES (開發時請移至 styles.css)
   ========================================================================== */

/* Section 1: Hero Banner (半屏綠色遮罩) */
.hero-half {
  position: relative;
  height: 55vh;
  min-height: 450px;
  display: flex;
  align-items: center;
  background-size: cover;
  background-position: center;
}
.hero-overlay-teal {
  position: absolute;
  inset: 0;
  background: rgba(30, 92, 84, 0.75); /* 綠色 overlay 效果 */
}
.hero-half-content {
  position: relative;
  z-index: 2;
  padding-top: 4rem; /* 避開 Navbar */
}
.hero-half-title {
  font-size: clamp(2.5rem, 4vw, 4rem);
  line-height: 1.15;
  color: var(--white);
  max-width: 800px;
}

/* Section 2: All-inclusive Concept */
.concept-intro {
  background-color: white;
  color: var(--white);
  padding: 5rem 0;
}
.concept-grid-wrapper {
  position: relative;
  padding: 6rem 0;
  background-size: cover;
  background-position: center;
  background-attachment: fixed; /* 視差滾動高級感 */
}
.overlay-dark {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.65); /* 背景圖片暗化處理突顯格子 */
}
.amenity-card {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  padding: 2.5rem;
  border-radius: var(--border-radius-md);
  height: 100%;
  transition: var(--transition-smooth);
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}
.amenity-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 40px rgba(0,0,0,0.2);
}
.amenity-icon {
  font-size: 2.5rem;
  color: var(--secondary-orange);
  margin-bottom: 1.5rem;
}
.amenity-title {
  font-weight: 600;
  font-size: 1.25rem;
  color: var(--primary-teal-dark);
  margin-bottom: 0.75rem;
}
.amenity-desc {
  color: var(--text-muted);
  font-size: 0.95rem;
  line-height: 1.6;
  margin: 0;
}

/* Section 3: Shared Space Showcase */
.shared-space-section {
  padding: 6rem 0;
  background-color: var(--bg-light);
}
.shared-space-img {
  width: 100%;
  height: 450px;
  object-fit: cover;
  border-radius: var(--border-radius-lg);
  box-shadow: 0 8px 25px rgba(0,0,0,0.08);
}
.shared-space-text {
  padding: 2rem 3rem;
}
.shared-space-title {
  color: var(--primary-teal-dark);
  font-size: 2.2rem;
  margin-bottom: 1.2rem;
}

@media (max-width: 991.98px) {
  .shared-space-text { padding: 2rem 0; }
  .shared-space-img { height: 300px; }
  .reverse-mobile { flex-direction: column-reverse; }
}