/* Accommodation Cards */
.accommodation-card {
  background: var(--color-white);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-md);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.accommodation-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.accommodation-card__image { aspect-ratio: 16/9; overflow: hidden; }
.accommodation-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.accommodation-card:hover .accommodation-card__image img { transform: scale(1.05); }
.accommodation-card__content { padding: var(--space-8); }
.accommodation-card__content h3 { font-family: var(--font-display); font-size: var(--text-2xl); color: var(--color-primary); margin-bottom: var(--space-4); }
.accommodation-card__content p { color: var(--color-gray-600); margin-bottom: var(--space-6); line-height: 1.7; }
.accommodation-card__amenities { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); margin-bottom: var(--space-6); }
.accommodation-card__amenities li { font-size: var(--text-sm); color: var(--color-secondary); font-weight: 500; }
.accommodation-card__amenities li::before { content: "✓ "; color: var(--color-accent); }

/* Gallery */
.gallery-filters { display: flex; gap: var(--space-3); flex-wrap: wrap; justify-content: center; margin-bottom: var(--space-12); }
.gallery-filter-btn { padding: var(--space-2) var(--space-6); border: 2px solid var(--color-primary); border-radius: var(--radius-full); background: transparent; color: var(--color-primary); font-family: var(--font-body); font-size: var(--text-sm); font-weight: 600; letter-spacing: 0.05em; cursor: pointer; transition: all 0.3s ease; }
.gallery-filter-btn:hover, .gallery-filter-btn.active { background: var(--color-primary); color: var(--color-white); }
.gallery-grid { columns: 3; column-gap: var(--space-4); }
.gallery-item { break-inside: avoid; margin-bottom: var(--space-4); border-radius: var(--radius-md); overflow: hidden; cursor: pointer; position: relative; }
.gallery-item img { width: 100%; display: block; transition: transform 0.4s ease; }
.gallery-item:hover img { transform: scale(1.04); }
.gallery-item__overlay { position: absolute; inset: 0; background: rgba(27,45,91,0.5); opacity: 0; transition: opacity 0.3s ease; display: flex; align-items: center; justify-content: center; }
.gallery-item:hover .gallery-item__overlay { opacity: 1; }
.gallery-item__overlay svg { width: 40px; height: 40px; fill: white; }
.gallery-item[data-hidden="true"] { display: none; }

/* Lightbox */
.lightbox { position: fixed; inset: 0; background: rgba(0,0,0,0.95); z-index: 9999; display: none; align-items: center; justify-content: center; }
.lightbox.active { display: flex; }
.lightbox__img { max-width: 90vw; max-height: 90vh; object-fit: contain; border-radius: var(--radius-md); }
.lightbox__close { position: absolute; top: var(--space-6); right: var(--space-6); background: transparent; border: none; color: white; font-size: 2.5rem; cursor: pointer; line-height: 1; }
.lightbox__prev, .lightbox__next { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,0.1); border: none; color: white; font-size: 2rem; width: 56px; height: 56px; border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background 0.3s; }
.lightbox__prev:hover, .lightbox__next:hover { background: var(--color-accent); }
.lightbox__prev { left: var(--space-6); }
.lightbox__next { right: var(--space-6); }

/* FAQ */
.faq-item { border-bottom: 1px solid var(--color-gray-200); }
.faq-question { width: 100%; background: transparent; border: none; display: flex; justify-content: space-between; align-items: center; padding: var(--space-6) 0; font-family: var(--font-body); font-size: var(--text-lg); font-weight: 600; color: var(--color-primary); cursor: pointer; text-align: left; }
.faq-question svg { width: 20px; height: 20px; flex-shrink: 0; transition: transform 0.3s ease; fill: var(--color-accent); }
.faq-item.open .faq-question svg { transform: rotate(180deg); }
.faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; }
.faq-answer p { padding-bottom: var(--space-6); color: var(--color-gray-600); line-height: 1.7; }

/* Packages */
.package-card { background: var(--color-white); border-radius: var(--radius-lg); padding: var(--space-10); box-shadow: var(--shadow-md); border-top: 4px solid var(--color-accent); transition: transform 0.3s ease, box-shadow 0.3s ease; display: flex; flex-direction: column; }
.package-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.package-card__icon { font-size: 3rem; margin-bottom: var(--space-6); }
.package-card h3 { font-family: var(--font-display); font-size: var(--text-2xl); color: var(--color-primary); margin-bottom: var(--space-4); }
.package-card p { color: var(--color-gray-600); line-height: 1.7; margin-bottom: var(--space-6); flex: 1; }
.package-card__features { list-style: none; padding: 0; margin-bottom: var(--space-8); }
.package-card__features li { padding: var(--space-2) 0; border-bottom: 1px solid var(--color-gray-100); color: var(--color-gray-700); font-size: var(--text-sm); }
.package-card__features li::before { content: "✓ "; color: var(--color-accent); font-weight: 700; }

/* Contact */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-16); align-items: start; }
.contact-form { background: var(--color-white); border-radius: var(--radius-lg); padding: var(--space-10); box-shadow: var(--shadow-md); }
.form-group { margin-bottom: var(--space-6); }
.form-group label { display: block; font-size: var(--text-sm); font-weight: 600; color: var(--color-primary); margin-bottom: var(--space-2); letter-spacing: 0.05em; text-transform: uppercase; }
.form-group input, .form-group textarea, .form-group select { width: 100%; padding: var(--space-4); border: 2px solid var(--color-gray-200); border-radius: var(--radius-md); font-family: var(--font-body); font-size: var(--text-base); color: var(--color-gray-800); background: var(--color-gray-50); transition: border-color 0.3s ease; }
.form-group input:focus, .form-group textarea:focus, .form-group select:focus { outline: none; border-color: var(--color-secondary); background: white; }
.form-group textarea { resize: vertical; min-height: 120px; }
.contact-info { display: flex; flex-direction: column; gap: var(--space-6); }
.contact-card { background: var(--color-white); border-radius: var(--radius-lg); padding: var(--space-8); box-shadow: var(--shadow-md); display: flex; gap: var(--space-4); align-items: flex-start; }
.contact-card__icon { font-size: 2rem; flex-shrink: 0; }
.contact-card h4 { font-family: var(--font-display); color: var(--color-primary); margin-bottom: var(--space-2); }
.contact-card a { color: var(--color-secondary); text-decoration: none; font-weight: 500; }
.contact-card a:hover { color: var(--color-accent); }
.contact-map { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-md); }

/* Hero short variant */
.hero--short { min-height: 60vh; }
.hero__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Includes grid */
.includes-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-4); }
.include-item { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-4); background: var(--color-gray-50); border-radius: var(--radius-md); }
.include-item span:first-child { font-size: 1.5rem; }
.include-item span:last-child { font-weight: 500; color: var(--color-gray-700); }

@media (max-width: 768px) {
  .gallery-grid { columns: 2; }
  .contact-grid { grid-template-columns: 1fr; }
  .includes-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .gallery-grid { columns: 1; }
}