/* ============================================================
   Locatie-detail — La Belle Beauté
   Schakelaar, praktische info + kaart, openingstijden.
   (De fotogalerij gebruikt de gedeelde .gallery uit subpages.css.)
   ============================================================ */

/* ---------- Locatie-schakelaar (pills in de donkere hero) ---------- */
.loc-switch { display:inline-flex; flex-wrap:wrap; gap:8px; margin-top:2.2em; }
.ls {
  font-size:       .72rem;
  letter-spacing:  .1em;
  text-transform:  uppercase;
  padding:         .7em 1.3em;
  border:          1px solid var(--line-dark);
  border-radius:   40px;
  color:           rgba(246,241,234,.82);
  transition:      .4s var(--ease);
}
.ls:hover { border-color:var(--gold); color:var(--gold); }
.ls.active { background:var(--gold); color:var(--black); border-color:var(--gold); }

/* ---------- 2-koloms: info links, kaart rechts ---------- */
.loc-grid { display:grid; grid-template-columns:.95fr 1.05fr; gap:clamp(34px,5vw,64px); align-items:start; }
@media(max-width:860px){ .loc-grid{ grid-template-columns:1fr; } }

.loc-info .blk { padding:24px 0; border-top:1px solid var(--line-cream); }
.loc-info .blk:first-child { border-top:none; padding-top:0; }
.loc-info h3 { font-size:.7rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gold); margin-bottom:.8em; }
.loc-info .addr { font-family:var(--ff-display); font-size:1.5rem; color:var(--black); line-height:1.3; }
.loc-info p { color:var(--taupe); font-size:.98rem; }
.loc-info a:hover { color:var(--copper); }

/* ---------- Openingstijden ---------- */
.hours { display:flex; flex-direction:column; gap:.4em; margin-top:1em; }
.hours .row { display:flex; justify-content:space-between; gap:20px; max-width:300px; font-size:.92rem; color:var(--taupe); }
.hours .row.open b { color:var(--black); font-weight:500; }
.hours .row.closed { color:var(--taupe-soft); }

.loc-cta { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }

/* ---------- Kaart-embed ---------- */
.loc-map { border:1px solid var(--line-cream); border-radius:var(--radius); overflow:hidden; aspect-ratio:4/3; background:#e8e0d6; }
.loc-map iframe { width:100%; height:100%; border:0; display:block; filter:grayscale(.25) contrast(.95); }