/* Oh!Mumbai — frontend polish, fourth pass (small, targeted).
   Loads LAST. Four specific improvements the previous passes missed. */

/* ─── 1. Burger button focus-visible ring ─────────────────────────────────── */
/* character.css establishes a saffron focus ring on
   :where(a,button,input,select,textarea). The burger IS a <button> so the
   ring applies — but at the mobile viewport the ring is clipped by the
   header's border-bottom. Bring it inside so keyboard users see it. */
@media (max-width:768px){
  .nav-burger:focus-visible{
    outline:2px solid var(--color-saffron, #d4a256);
    outline-offset:-4px;
    border-radius:10px;
    background:color-mix(in srgb, var(--color-saffron, #d4a256) 10%, transparent);
  }
  .site-header.is-nav .nav-burger:focus-visible{
    outline-color:var(--color-terracotta);
    background:color-mix(in srgb, var(--color-terracotta) 8%, transparent);
  }
}

/* ─── 2. Header "Забронировать" — soft warm glow on hover ─────────────────── */
/* The primary header CTA already has an inset highlight from character.css.
   Add a very soft warm glow that expands on hover — reinforces this is the
   primary action without shouting. */
.site-header header > button.bg-terracotta,
.hero button.bg-terracotta{
  transition:box-shadow .45s var(--ease-out-quart, cubic-bezier(.25,1,.5,1)),
             filter .3s ease,
             transform .3s var(--ease-spring);
}
.site-header header > button.bg-terracotta:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 12px 30px -14px rgba(174,63,36,.55),
    0 0 0 6px color-mix(in srgb, var(--color-terracotta) 10%, transparent);
}
.hero button.bg-terracotta:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 14px 34px -14px rgba(41,27,22,.75),
    0 0 0 8px color-mix(in srgb, var(--color-saffron, #d4a256) 12%, transparent);
}
.hero button.bg-terracotta:active,
.site-header header > button.bg-terracotta:active{
  filter:brightness(.98);
  transform:translateY(1px);
}

/* ─── 3. Section-head "see more" link — parent warms on hover ─────────────── */
/* The `.sec-head > a` (Подробнее / Перейти в раздел) already changes to
   terracotta on hover. Extend the interaction: when the link is hovered,
   the section head's hairline warms toward saffron too, so the whole
   header reads as a single interactive band. */
.sec-head{
  transition:border-bottom-color .45s ease;
}
.sec-head:has(> a:hover){
  border-bottom-color:color-mix(in srgb, var(--color-saffron, #d4a256) 65%, transparent);
}

/* ─── Bonus: booking / lightbox overlay — click-outside cursor hint ───────── */
/* When the overlay is open, hovering the empty backdrop area should signal
   "click here to close". `cursor:zoom-out` reads as "collapse". */
.bk-overlay.is-open{cursor:zoom-out}
.bk-overlay.is-open .bk-card{cursor:default}
.lb.is-open{cursor:zoom-out}
.lb.is-open img,
.lb.is-open .lb-btn,
.lb.is-open .lb-count{cursor:default}
.lb.is-open img{cursor:default}