/* Lush — access page */

.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 48px 64px; align-items: start; }
.section-note { margin: 24px 0 0; font-size: 12px; line-height: 2; letter-spacing: .12em; color: var(--muted); }

/* Shop info */
.info { margin: 0; border-top: 1px solid var(--rule); }
.info__row {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  gap: 8px 32px;
  padding: 20px 8px;
  border-bottom: 1px solid var(--rule);
}
.info dt { font-size: 13px; letter-spacing: .2em; color: var(--muted); }
.info dd { margin: 0; font-size: 15px; letter-spacing: .1em; }
.info__rooms { line-height: 1.9; }
.info__tel { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.info dd.info__mail { font-size: 1rem; } /* line box is set by the 16px base size, as in the design */
.tel-link {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 8px 20px 8px 16px;
  border: 1px solid var(--rule-gold);
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 18px;
  letter-spacing: .1em;
  color: var(--gold);
  transition: .3s ease;
}
.tel-link:hover { background: var(--gold); color: var(--bg); }
.tel-link span { font-size: 10px; letter-spacing: .3em; }
.tel-hint { font-size: 11px; letter-spacing: .12em; color: var(--muted); }
.mail-link { font-family: var(--font-en); font-weight: 300; font-size: 15px; letter-spacing: .06em; color: var(--gold); word-break: break-all; }

/* Rooms */
.rooms { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 32px; }
.rooms--cards { margin-top: 48px; }
.rooms--maps { margin-top: 32px; }
.room {
  background: rgba(21, 21, 27, .82);
  border: 1px solid var(--rule);
  padding: 40px clamp(20px, 4vw, 40px);
}
.room h3 { margin: 12px 0 0; font-size: 22px; font-weight: 400; letter-spacing: .2em; }
.room__info { margin: 24px 0 0; border-top: 1px solid var(--rule); }
.room__info > div {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid var(--rule);
  font-size: 13px;
  letter-spacing: .1em;
  line-height: 1.8;
}
.room__info dt { color: var(--muted); }
.room__info dd { margin: 0; }
.room__stations { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; }
.room__stations li { display: flex; gap: 10px; align-items: baseline; }
.room__stations li::before { content: ''; flex: none; width: 6px; height: 1px; background: var(--gold); position: relative; top: -4px; }

/* Maps */
.map__head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 12px; }
.map__head span { font-size: 13px; letter-spacing: .2em; }
.map__head a { font-size: 11px; letter-spacing: .3em; color: var(--gold); }
.map__frame { aspect-ratio: 4 / 3; border: 1px solid var(--rule); background: var(--surface); overflow: hidden; }
.map__frame iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  filter: invert(.92) hue-rotate(180deg) saturate(.4) brightness(.9);
}
.rooms-note { margin: 32px 0 0; font-size: 15px; line-height: 2; letter-spacing: .08em; text-align: center; }

@media (max-width: 639px) {
  .split { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .info__row { grid-template-columns: minmax(0, 1fr); gap: 4px 0; }
}