/* ============================================================
   Oh!Mumbai — MINIMAL
   One considered layer. Replaces the 10 polish-* stacks.
   Brand tokens + fonts come from styles.css (compiled base).
   Direction: calm, editorial, confident. Two actions: Меню + Забронировать.
   ============================================================ */

:root{
  --ink:        var(--color-biege, #ede2d1);   /* text on dark */
  --bg:         var(--color-chocolate, #4d362e);
  --bg-soft:    #573e35;                        /* raised panels on chocolate */
  --line:       color-mix(in srgb, var(--color-biege) 18%, transparent);
  --accent:     var(--color-terracotta, #b25b37);
  --accent-hov: var(--color-terracotta-hover, #9c4b2c);
  --olive:      var(--color-green, #848a4d);
  --muted:      color-mix(in srgb, var(--color-biege) 62%, transparent);

  --wrap: 76rem;                 /* 1216px — generous, not sprawling */
  --pad:  clamp(1.25rem, 5vw, 3rem);
  --sec:  clamp(4.5rem, 9vw, 8.5rem);
  --radius: 6px;

  --f-display: "TT Gertika", Georgia, serif;
  --f-body:    "Geometria", system-ui, sans-serif;
  --ease: cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--f-body); font-weight:500;
  line-height:1.55; -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; border-radius:2px; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad); }
.sec{ padding-block:var(--sec); }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
/* keyboard skip link — hidden until focused */
.skip-link{ position:fixed; top:-100px; left:1rem; z-index:200; background:var(--accent); color:#fff;
  padding:.75rem 1.1rem; border-radius:var(--radius); font-size:.95rem; transition:top .2s var(--ease); }
.skip-link:focus{ top:1rem; }

/* ---- Type scale ---- */
h1,h2,h3{ font-family:var(--f-display); font-weight:700; margin:0; line-height:1.06; letter-spacing:-.02em; }
h1{ font-size:clamp(2.6rem, 6.5vw, 4.75rem); }
h2{ font-size:clamp(2rem, 4vw, 3rem); }
h3{ font-size:clamp(1.35rem, 2.2vw, 1.75rem); font-weight:400; letter-spacing:-.01em; }
p{ margin:0; }
.lead{ font-size:clamp(1.1rem, 1.6vw, 1.4rem); line-height:1.5; }
.eyebrow{ font-family:var(--f-body); font-weight:500; text-transform:uppercase;
  letter-spacing:.24em; font-size:.72rem; color:var(--accent); margin:0 0 1.1rem; }
.muted{ color:var(--muted); }

/* ---- Buttons ---- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-family:var(--f-body); font-weight:500; font-size:1rem; line-height:1;
  padding:.95rem 1.6rem; border-radius:var(--radius); border:1px solid transparent;
  cursor:pointer; transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease); }
.btn-primary{ background:var(--accent); color:#fff; }
.btn-primary:hover{ background:var(--accent-hov); }
.btn-ghost{ background:transparent; color:var(--ink); border-color:var(--line); }
.btn-ghost:hover{ border-color:var(--ink); }
.btn-light{ background:var(--ink); color:var(--bg); }
.btn-light:hover{ background:#fff; }

/* link with animated underline */
.link{ display:inline-flex; align-items:center; gap:.4rem; position:relative; }
.link::after{ content:""; position:absolute; left:0; right:0; bottom:-3px; height:1px;
  background:currentColor; transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease); }
.link:hover{ color:var(--accent); }
.link:hover::after{ transform:scaleX(1); }
.link svg{ transition:transform .3s var(--ease); }
.link:hover svg{ transform:translateX(4px); }

/* ============================================================
   HEADER — minimal, obvious. No mega-panel.
   ============================================================ */
.mh{ position:sticky; top:0; z-index:50; background:var(--bg);
  border-bottom:1px solid var(--line);
  transition:background .3s var(--ease), border-color .3s var(--ease); }

/* On pages with a full-bleed hero, the header floats transparent over the image
   and solidifies once scrolled — a calmer, more cinematic entrance. */
.has-hero .mh{ position:fixed; inset:0 0 auto; background:transparent; border-color:transparent; }
.has-hero .mh.is-scrolled{ background:color-mix(in srgb, var(--bg) 88%, transparent);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border-color:var(--line); }
.mh-in{ display:flex; align-items:center; gap:2rem; height:76px; }
.mh-logo{ display:flex; align-items:center; }
.mh-logo img{ width:118px; height:auto; }
.mh-nav{ display:flex; gap:1.75rem; margin-left:.5rem; }
.mh-nav a{ position:relative; padding:.4rem 0; font-size:1rem; color:var(--ink); transition:color .2s; }
.mh-nav a::after{ content:""; position:absolute; left:0; right:0; bottom:-2px; height:1px;
  background:var(--accent); transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease); }
.mh-nav a:hover{ color:var(--accent); }
.mh-nav a:hover::after,.mh-nav a[aria-current="page"]::after{ transform:scaleX(1); }
.mh-nav a[aria-current="page"]{ color:var(--accent); }
.mh-cta{ margin-left:auto; }
.mh-burger{ display:none; margin-left:auto; width:44px; height:44px; background:none; border:0;
  cursor:pointer; flex-direction:column; align-items:center; justify-content:center; gap:6px; }
.mh-burger span{ display:block; width:24px; height:2px; background:var(--ink); transition:transform .3s var(--ease), opacity .2s; }
.mh-mobile{ display:none; }

/* ============================================================
   HERO
   ============================================================ */
.hero{ position:relative; min-height:100vh; display:flex; align-items:center;
  overflow:hidden; }
.hero img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(31,21,17,.55) 0%, rgba(31,21,17,.28) 34%, rgba(31,21,17,.30) 55%, rgba(31,21,17,.85) 100%); }
.hero-in{ position:relative; z-index:2; text-align:center; max-width:50rem; margin-inline:auto; padding-block:6rem; }
.hero .kicker{ text-transform:uppercase; letter-spacing:.28em; font-size:.8rem; font-weight:500;
  color:var(--ink); margin:0 0 1.4rem; opacity:.9; }
.hero h1{ color:#fff; margin:0; font-size:clamp(3.25rem, 9vw, 6.5rem); line-height:.98; }
.hero-sub{ color:#f3ece1; max-width:36rem; margin:1.5rem auto 2.25rem; font-size:clamp(1rem,1.4vw,1.2rem);
  line-height:1.5; opacity:.94; }
.hero-actions{ display:flex; gap:.9rem; justify-content:center; flex-wrap:wrap; }
.hero-actions .btn{ min-width:210px; }

/* ============================================================
   EDITORIAL SECTIONS
   ============================================================ */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,5rem); align-items:start; }
.split-narrow{ grid-template-columns:.9fr 1.1fr; }
.stack > * + *{ margin-top:1.25rem; }
.sec-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:2rem;
  flex-wrap:wrap; margin-bottom:clamp(2rem,4vw,3.25rem); }
.sec-head .eyebrow{ margin-bottom:.6rem; }
.sec-head h2{ max-width:22ch; }

.figure{ overflow:hidden; border-radius:var(--radius); background:var(--bg-soft); }
.figure img{ width:100%; height:100%; object-fit:cover; }
.figure-wide{ aspect-ratio:16/7; }
.figure-tall{ aspect-ratio:4/5; }

.quote{ font-family:var(--f-display); font-weight:400; font-size:clamp(1.25rem,2vw,1.6rem);
  line-height:1.4; letter-spacing:-.01em; }

/* ---- Dishes preview (home) ---- */
.dishes{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(1rem,2vw,1.5rem); }
.dish{ display:flex; flex-direction:column; gap:.85rem; }
.dish .ph{ aspect-ratio:3/4; overflow:hidden; border-radius:var(--radius); background:var(--bg-soft); position:relative; }
.dish .ph img{ width:100%; height:100%; object-fit:cover; }
.dish .name{ font-size:1.05rem; }

/* ---- Menu highlights (home): one feature photo + real menu leaders ---- */
.feature{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.feature-media{ aspect-ratio:4/5; }
.feature-media img{ width:100%; height:100%; object-fit:cover; }
.hl{ list-style:none; margin:0; padding:0; }
.hl li{ display:flex; align-items:baseline; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--line); }
.hl li:first-child{ padding-top:0; }
.hl-name{ font-family:var(--f-display); font-size:clamp(1.2rem,1.8vw,1.5rem); font-weight:400; }
.hl-price{ margin-left:auto; color:var(--ink); font-weight:500; white-space:nowrap; }
.hl-note{ display:block; border-bottom:0; color:var(--muted); font-size:.95rem; padding-bottom:0; }

/* ============================================================
   INTERIOR — curated carousel (2-4 hero photos)
   ============================================================ */
.carousel{ position:relative; }
.car-viewport{ overflow:hidden; border-radius:var(--radius); background:var(--bg-soft); }
.car-track{ display:flex; transition:transform .6s var(--ease); }
.car-slide{ min-width:100%; }
.car-slide img{ width:100%; aspect-ratio:16/9; object-fit:cover; }
.car-ctrl{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:1.25rem; }
.car-dots{ display:flex; gap:.55rem; }
.car-dot{ width:9px; height:9px; border-radius:50%; border:0; cursor:pointer; padding:0;
  background:var(--line); transition:background .25s, transform .25s; }
.car-dot.is-active{ background:var(--accent); transform:scale(1.25); }
.car-arrows{ display:flex; gap:.6rem; }
.car-arrow{ width:46px; height:46px; border-radius:50%; border:1px solid var(--line);
  background:transparent; color:var(--ink); cursor:pointer; display:grid; place-items:center;
  transition:border-color .2s, background .2s; }
.car-arrow:hover{ border-color:var(--ink); background:var(--bg-soft); }

/* ============================================================
   MENU PAGE  (menu.js renders into #menu-app)
   ============================================================ */
.menu-hero{ padding-block:clamp(3rem,6vw,5rem) clamp(1rem,3vw,2rem); }
.mn-controls{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem;
  flex-wrap:wrap; border-bottom:1px solid var(--line); padding-bottom:1.25rem; margin-bottom:clamp(2rem,4vw,3rem); }
.mn-tabs{ display:flex; gap:.5rem; flex-wrap:wrap; }
.mn-tab{ font-family:var(--f-body); font-weight:500; font-size:1rem; color:var(--muted);
  background:none; border:0; cursor:pointer; padding:.55rem .9rem; border-radius:100px; transition:color .2s, background .2s; }
.mn-tab:hover{ color:var(--ink); }
.mn-tab.is-active{ color:#fff; background:var(--accent); }
.mn-view{ position:relative; display:inline-flex; padding:4px; border:1px solid var(--line); border-radius:100px; }
.mn-view button{ position:relative; z-index:2; font-family:var(--f-body); font-size:.9rem; color:var(--muted);
  background:none; border:0; cursor:pointer; padding:.45rem 1rem; border-radius:100px; transition:color .2s; }
.mn-view button.is-active{ color:var(--bg); }
.mn-view-ind{ position:absolute; z-index:1; top:4px; bottom:4px; left:0; background:var(--ink);
  border-radius:100px; transition:transform .35s var(--ease), width .35s var(--ease); }
.mn-body{ transition:opacity .22s var(--ease), transform .22s var(--ease); }
.mn-body.is-out{ opacity:0; transform:translateY(8px); }
.mn-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(1.25rem,2.5vw,2rem) clamp(1rem,2vw,1.5rem); }
.mn-card{ display:flex; flex-direction:column; gap:.5rem; }
.mn-img{ position:relative; aspect-ratio:3/4; overflow:hidden; border-radius:var(--radius); background:var(--bg-soft); }
.mn-img img{ width:100%; height:100%; object-fit:cover; }
.mn-name{ font-family:var(--f-display); font-weight:400; font-size:1.15rem; margin-top:.35rem; }
.mn-meta{ display:flex; justify-content:space-between; align-items:baseline; gap:1rem;
  font-size:.95rem; color:var(--muted); }
.mn-meta span:last-child{ color:var(--ink); font-weight:500; }
.mn-desc{ font-size:.9rem; color:var(--muted); line-height:1.45; }
.mn-pill{ position:absolute; top:.6rem; left:.6rem; font-size:.72rem; padding:.3rem .6rem;
  border-radius:100px; background:rgba(31,21,17,.72); color:var(--ink); backdrop-filter:blur(4px); }
.mn-pdf{ grid-column:1/-1; }
.mn-pdf-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:1rem; }
.mn-pdf-page{ border:1px solid var(--line); border-radius:var(--radius); }
.ph-slot{ aspect-ratio:3/4; max-width:520px; margin-inline:auto; display:grid; place-items:center;
  color:var(--muted); text-align:center; padding:2rem; }
/* keep menu.js CHILI tag legible without the old utility stack */
.mn-img .bg-red{ background:var(--color-red,#600000); }
.mn-img [class*="rounded-full"]{ border-radius:100px; }

/* ============================================================
   BOOKING POPUP  (built by minimal.js)
   ============================================================ */
.bk-overlay{ position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:1.5rem;
  background:rgba(20,13,10,.6); backdrop-filter:blur(6px); opacity:0; visibility:hidden;
  transition:opacity .3s var(--ease), visibility .3s; }
.bk-overlay.is-open{ opacity:1; visibility:visible; }
.bk-card{ position:relative; width:100%; max-width:560px; background:var(--color-seashell,#faf6f1);
  color:var(--bg); border-radius:12px; padding:clamp(2rem,4vw,3rem); transform:translateY(16px) scale(.98);
  transition:transform .35s var(--ease); }
.bk-overlay.is-open .bk-card{ transform:none; }
.bk-close{ position:absolute; top:1rem; right:1rem; width:40px; height:40px; border:0; background:none;
  color:var(--bg); cursor:pointer; border-radius:50%; display:grid; place-items:center; transition:background .2s; }
.bk-close:hover{ background:rgba(77,54,46,.1); }
.bk-title{ font-family:var(--f-display); font-weight:700; font-size:1.6rem; line-height:1.1; margin:0 0 1.75rem; max-width:16ch; }
.bk-cols{ display:grid; grid-template-columns:1fr 1fr; gap:1.75rem; }
.bk-label{ text-transform:uppercase; letter-spacing:.16em; font-size:.7rem; color:var(--accent); margin:0 0 .6rem; }
.bk-phone{ font-family:var(--f-display); font-size:1.5rem; color:var(--bg); }
.bk-phone:hover{ color:var(--accent); }
.bk-icons{ display:flex; gap:.75rem; }
.bk-icons a{ display:inline-flex; }
.bk-icons svg{ width:44px; height:44px; }

/* ============================================================
   FOOTER — minimal. Logo + one contact line + socials. No map, no nav.
   ============================================================ */
.mf{ background:var(--olive); color:#fff; }
.mf-in{ display:flex; align-items:center; justify-content:space-between; gap:2rem;
  flex-wrap:wrap; padding-block:clamp(2.5rem,5vw,4rem); }
.mf-brand img{ width:150px; height:auto; }
.mf-contact{ text-align:center; }
.mf-contact a{ transition:color .2s; }
.mf-contact a:hover{ color:var(--color-biege); }
.mf-contact .addr{ font-family:var(--f-display); font-size:1.25rem; }
.mf-contact .row{ margin-top:.35rem; color:#f2efe4; }
.mf-social{ display:flex; gap:.75rem; }
.mf-social a{ display:inline-flex; color:#fff; opacity:.9; transition:opacity .2s, transform .2s; }
.mf-social a:hover{ opacity:1; transform:translateY(-2px); }
.mf-social svg{ width:40px; height:40px; }
.mf-legal{ border-top:1px solid rgba(255,255,255,.22); }
.mf-legal .wrap{ display:flex; gap:1.5rem; align-items:center; flex-wrap:wrap;
  padding-block:1.25rem; font-size:.85rem; color:#eef0e2; }
.mf-legal a:hover{ color:#fff; }
.mf-legal .copy{ margin-left:auto; }

/* ============================================================
   SCROLL REVEAL (subtle; respects reduced motion)
   ============================================================ */
/* progressive enhancement: content is visible by default; only hidden once
   JS adds .reveal-on to <html>, so no-JS users (and static captures) always see it. */
.reveal-on .rv{ opacity:0; transform:translateY(18px); transition:opacity .7s var(--ease), transform .7s var(--ease); transition-delay:var(--d,0ms); }
.reveal-on .rv.rv-in{ opacity:1; transform:none; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:900px){
  .split,.split-narrow,.feature{ grid-template-columns:1fr; }
  .feature-media{ aspect-ratio:16/10; }
  .dishes{ grid-template-columns:repeat(2,1fr); }
  .mn-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:768px){
  .mh-nav,.mh-cta{ display:none; }
  .mh-burger{ display:flex; }
  .mh.is-open .mh-burger span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
  .mh.is-open .mh-burger span:nth-child(2){ opacity:0; }
  .mh.is-open .mh-burger span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }
  /* mobile nav panel: animated open AND close (no display:none swap) */
  .mh-mobile{ display:flex; position:fixed; inset:76px 0 0; z-index:49; background:var(--bg);
    padding:2rem var(--pad); flex-direction:column; gap:.5rem;
    opacity:0; visibility:hidden; transform:translateY(-10px);
    transition:opacity .3s var(--ease), transform .38s var(--ease), visibility .3s; }
  .mh.is-open .mh-mobile{ opacity:1; visibility:visible; transform:none; }
  .mh-mobile > a{ font-family:var(--f-display); font-size:1.75rem; padding:.6rem 0; border-bottom:1px solid var(--line); }
  /* staggered reveal of the nav rows once the panel opens */
  .mh-mobile > a, .mh-mobile > .mh-mobile-actions{ opacity:0; transform:translateY(10px);
    transition:opacity .3s var(--ease), transform .35s var(--ease); }
  .mh.is-open .mh-mobile > a, .mh.is-open .mh-mobile > .mh-mobile-actions{ opacity:1; transform:none; }
  .mh.is-open .mh-mobile > *:nth-child(1){ transition-delay:.06s; }
  .mh.is-open .mh-mobile > *:nth-child(2){ transition-delay:.11s; }
  .mh.is-open .mh-mobile > *:nth-child(3){ transition-delay:.16s; }
  .mh.is-open .mh-mobile > *:nth-child(4){ transition-delay:.21s; }
  .mh-mobile-actions{ display:flex; flex-direction:column; gap:.75rem; margin-top:1.5rem; }
  .mh-mobile-actions .btn{ margin-top:0; width:100%; }
  .bk-cols{ grid-template-columns:1fr; gap:1.5rem; }
  .mf-in{ flex-direction:column; text-align:center; }
  .car-ctrl{ flex-direction:row; }
}
@media (max-width:600px){
  .hero-actions{ flex-direction:column; width:100%; max-width:22rem; margin-inline:auto; }
  .hero-actions .btn{ width:100%; min-width:0; }
}
@media (max-width:520px){
  .dishes,.mn-grid{ grid-template-columns:1fr 1fr; }
}
@media (prefers-reduced-motion:reduce){
  *{ scroll-behavior:auto !important; }
  .rv{ opacity:1 !important; transform:none !important; }
  .car-track{ transition:none; }
  .macc-panel{ transition:none; }
  .macc-fig img{ transition:none; opacity:1; transform:none; }
  .deck-card{ transition:none; }
  .bk-fab{ transition:opacity .001s; }
}

/* ============================================================
   HOME MENU ACCORDION — tap an item, its photo reveals inline
   ============================================================ */
.macc{ max-width:54rem; }
.macc-list{ list-style:none; margin:0; padding:0; }
.macc-item{ border-bottom:1px solid var(--line); }
.macc-item:first-child{ border-top:1px solid var(--line); }
.macc-head{ display:flex; align-items:baseline; gap:1rem; width:100%; text-align:left;
  background:none; border:0; cursor:pointer; color:var(--ink); font-family:var(--f-body);
  padding:1.15rem 0; transition:color .2s var(--ease); }
.macc-head:hover{ color:var(--accent); }
.macc-head .hl-name{ font-family:var(--f-display); font-weight:400; font-size:clamp(1.2rem,1.8vw,1.5rem); }
.macc-head .hl-price{ margin-left:auto; font-weight:500; white-space:nowrap; color:var(--ink); }
.macc-chev{ flex:none; color:var(--muted); transition:transform .35s var(--ease), color .2s; }
.macc-item.is-open .macc-head{ color:var(--accent); }
.macc-item.is-open .macc-head .hl-price{ color:var(--accent); }
.macc-item.is-open .macc-chev{ transform:rotate(180deg); color:var(--accent); }
.macc-panel{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s var(--ease); }
.macc-item.is-open .macc-panel{ grid-template-rows:1fr; }
.macc-panel-in{ overflow:hidden; min-height:0; }
.macc-fig{ display:block; margin:.35rem 0 1.3rem; aspect-ratio:16/9; max-height:60vh;
  border-radius:var(--radius); overflow:hidden; background:var(--bg-soft); }
.macc-fig img{ width:100%; height:100%; object-fit:cover;
  opacity:0; transform:scale(1.04); transition:opacity .5s var(--ease) .08s, transform .7s var(--ease) .08s; }
.macc-item.is-open .macc-fig img{ opacity:1; transform:none; }

/* ============================================================
   INTERIOR DECK — stacked-card carousel, swipeable on touch
   ============================================================ */
.deck{ position:relative; }
.deck-stage{ position:relative; aspect-ratio:16/10; touch-action:pan-y; user-select:none;
  -webkit-user-select:none; }
.deck-card{ position:absolute; inset:0; margin:0; border-radius:var(--radius); overflow:hidden;
  background:var(--bg-soft); box-shadow:0 18px 44px rgba(20,13,10,.38);
  transform:translate(var(--dx,0), var(--dy,0)) scale(var(--sc,1)); opacity:var(--op,1); z-index:var(--z,1);
  transition:transform .5s var(--ease), opacity .5s var(--ease); will-change:transform; }
.deck-stage.is-dragging{ cursor:grabbing; }
.deck-stage.is-dragging .deck-card{ transition:none; }
.deck-card img{ width:100%; height:100%; object-fit:cover; pointer-events:none; }
.deck-ctrl{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:1.5rem; }
.deck-dots{ display:flex; gap:.5rem; flex-wrap:wrap; }
.deck-dot{ width:9px; height:9px; border-radius:50%; border:0; cursor:pointer; padding:0;
  background:var(--line); transition:background .25s, transform .25s; }
.deck-dot.is-active{ background:var(--accent); transform:scale(1.25); }
.deck-arrows{ display:flex; gap:.6rem; }
.deck-arrow{ width:46px; height:46px; border-radius:50%; border:1px solid var(--line);
  background:transparent; color:var(--ink); cursor:pointer; display:grid; place-items:center;
  transition:border-color .2s, background .2s; }
.deck-arrow:hover{ border-color:var(--ink); background:var(--bg-soft); }
/* swipe on touch; arrows are the desktop control */
@media (max-width:768px){ .deck-arrows{ display:none; } }

/* ============================================================
   MOBILE FLOATING BOOKING BUTTON — appears after the hero
   ============================================================ */
.bk-fab{ display:none; }
@media (max-width:768px){
  .bk-fab{ position:fixed; right:1rem; bottom:1rem; z-index:60; min-width:0;
    padding:.85rem 1.3rem; box-shadow:0 10px 26px rgba(20,13,10,.4);
    opacity:0; visibility:hidden; transform:translateY(16px) scale(.95); pointer-events:none;
    transition:opacity .3s var(--ease), transform .3s var(--ease), visibility .3s;
    display:inline-flex; }
  .bk-fab.is-visible{ opacity:1; visibility:visible; transform:none; pointer-events:auto; }
  /* hide the floating button while the burger menu is open */
  .mh.is-open ~ .bk-fab{ opacity:0 !important; visibility:hidden !important; pointer-events:none !important; }
}

/* ============================================================
   FOOTER — compact, no logo, Yandex.Maps button
   ============================================================ */
.mf-in{ padding-block:clamp(1.75rem,3.5vw,2.75rem); }
.mf-contact{ text-align:left; }
.mf-map{ border:1px solid rgba(255,255,255,.45); color:#fff; background:transparent;
  gap:.55rem; padding:.72rem 1.15rem; font-size:.95rem; white-space:nowrap; }
.mf-map:hover{ background:rgba(255,255,255,.14); border-color:#fff; }
.mf-map svg{ flex:none; }
@media (max-width:768px){
  .mf-in{ flex-direction:column; text-align:center; gap:1.5rem; }
  .mf-contact{ text-align:center; }
}