/* ============================================
   SterkeMerkenHotel - Location Page Styles
   ============================================ */

/* Breadcrumb */
.breadcrumb { background: var(--color-neutral-50); border-bottom: 1px solid var(--color-border-light); }
.breadcrumb__list { display: flex; gap: var(--space-3); padding: var(--space-3) 0; font-size: var(--font-size-sm); color: var(--color-text-secondary); }
.breadcrumb__list li + li::before { content: "/"; margin-right: var(--space-3); color: var(--color-neutral-400); }

/* Hero */
.hero-location { position: relative; background: radial-gradient(1000px 500px at 10% 10%, rgba(212,160,23,0.08), transparent), linear-gradient(0deg, rgba(10,22,40,0.75), rgba(10,22,40,0.75)), url('/assets/images/location-hero.webp') center/cover no-repeat; color: var(--color-text-inverse); }
.hero-location__inner { display: grid; grid-template-columns: 1fr; min-height: 46vh; align-items: center; }
.hero-location__content { max-width: 720px; }
.hero-location h1 { color: var(--color-text-inverse); }
.hero-location p { color: var(--color-neutral-100); }
.hero-location__actions { display: flex; gap: var(--space-4); margin-top: var(--space-6); flex-wrap: wrap; }

/* Lists with points */
.list-points { display: grid; gap: var(--space-2); }
.list-points li { position: relative; padding-left: 1.25rem; }
.list-points li::before { content: ""; position: absolute; left: 0; top: 0.6em; width: 8px; height: 8px; border-radius: 50%; background: var(--color-accent-500); box-shadow: var(--shadow-accent); }

/* Media figure */
.media-figure { display: grid; gap: var(--space-2); }
.media-figure figcaption { font-size: var(--font-size-sm); }

/* Map */
.map-embed { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-md); background: var(--color-surface-elevated); }
.map-embed iframe { display: block; width: 100%; aspect-ratio: 16/9; border: 0; }

/* Weather */
.weather__controls { display: flex; gap: var(--space-3); flex-wrap: wrap; }
.weather__status { font-size: var(--font-size-sm); }
.weather__widget { margin-top: var(--space-6); }
.weather__panel { display: grid; gap: var(--space-4); grid-template-columns: 1fr; }
.weather__current { display: flex; align-items: center; justify-content: space-between; padding: var(--space-6); border: 1px solid var(--color-border-light); border-radius: var(--radius-lg); background: linear-gradient(135deg, var(--color-neutral-50), #fff); box-shadow: var(--shadow-sm); }
.weather__current h3 { margin: 0; font-size: var(--font-size-lg); }
.weather__meta { color: var(--color-text-secondary); font-size: var(--font-size-sm); }
.weather__forecast { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.weather__day { padding: var(--space-4); border: 1px solid var(--color-border-light); border-radius: var(--radius-default); background: #fff; text-align: center; box-shadow: var(--shadow-xs); }

/* Gallery */
.gallery__item { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-sm); background: #fff; }
.gallery__item img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Cards adjustments */
.card .h4, .card .h5 { font-family: var(--font-family-heading); }

/* Responsive */
@media (max-width: 768px) {
  .hero-location__inner { min-height: 38vh; }
  .weather__forecast { grid-template-columns: 1fr; }
}