/* ============================================================
   Павлин Мавлин · тёплая восточно-ресторанная система
   Сериф Cormorant + Manrope. Фото-герой, золото и изумруд.
   ============================================================ */

:root{
  --bg:      #17110d;
  --bg-soft: #1f1710;
  --panel:   #241a12;
  --gold:    #d8a94b;
  --gold-2:  #f2d089;
  --emerald: #14655a;
  --teal:    #2a9d92;
  --ember:   #c9502e;
  --cream:   #f4ead6;
  --dim:     rgba(244,234,214,.62);
  --line:    rgba(244,234,214,.14);
  --wrap:    1200px;
  --f-serif: 'Cormorant', Georgia, serif;
  --f-sans:  'Manrope', system-ui, sans-serif;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  background:var(--bg); color:var(--cream);
  font-family:var(--f-sans); font-size:17px; line-height:1.65;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; }

/* фото-обработка: единый тёплый грейд */
figure img, .hero-bg img, .band-bg img, .menu-photo img{
  width:100%; height:100%; object-fit:cover;
  filter:saturate(1.06) contrast(1.04) brightness(.97);
}

/* общие типо-элементы */
.eyebrow{
  font-family:var(--f-sans); font-weight:600; font-size:.72rem;
  letter-spacing:.24em; text-transform:uppercase; color:var(--gold);
  margin-bottom:1rem;
}
.h-serif{
  font-family:var(--f-serif); font-weight:600;
  font-size:clamp(2.1rem, 4.8vw, 3.6rem); line-height:1.06;
  letter-spacing:.005em; color:var(--cream); margin-bottom:1.4rem;
}
.muted{ color:var(--dim); font-size:.92rem; }
p{ color:var(--dim); }

/* кнопки */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--f-sans); font-weight:600; font-size:.98rem;
  padding:.9rem 1.7rem; border-radius:2px; transition:.28s ease;
  border:1px solid transparent; letter-spacing:.01em;
}
.btn-gold{ background:var(--gold); color:#20140a; }
.btn-gold:hover{ background:var(--gold-2); transform:translateY(-2px); }
.btn-line{ border-color:var(--line); color:var(--cream); }
.btn-line:hover{ border-color:var(--gold); color:var(--gold-2); }
.btn-sm{ padding:.55rem 1.15rem; font-size:.9rem; background:var(--gold); color:#20140a; }
.btn-sm:hover{ background:var(--gold-2); }

/* ============ ШАПКА ============ */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:40;
  display:flex; align-items:center; gap:1.5rem;
  padding:1.1rem clamp(18px,4vw,44px);
  transition:background .35s, padding .35s, border-color .35s;
  border-bottom:1px solid transparent;
}
.nav.scrolled{
  background:rgba(18,13,9,.86); backdrop-filter:blur(12px);
  border-bottom-color:var(--line); padding-top:.8rem; padding-bottom:.8rem;
}
.brand{ display:flex; align-items:center; gap:.6rem; font-family:var(--f-serif);
  font-weight:600; font-size:1.3rem; letter-spacing:.01em; }
.brand-eye{ width:26px; height:auto; }
.nav-links{ display:flex; gap:1.8rem; margin-left:auto; }
.nav-links a{ font-weight:500; font-size:.96rem; color:var(--dim); transition:color .25s; }
.nav-links a:hover{ color:var(--cream); }
.nav-right{ display:flex; align-items:center; gap:1.1rem; }
.nav-phone{ font-weight:600; font-size:.95rem; color:var(--cream); }
.nav-phone:hover{ color:var(--gold-2); }

.burger{ display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:6px; margin-left:auto; }
.burger span{ width:26px; height:2px; background:var(--cream); transition:.3s; }
.mobile-menu{ display:none; }

/* ============ HERO ============ */
.hero{ position:relative; min-height:100svh; display:flex; align-items:center; justify-content:center;
  text-align:center; padding:120px 20px 90px; overflow:hidden; }
.hero-bg{ position:absolute; inset:0; z-index:0; }
.hero-bg img{ animation:kenburns 24s ease-in-out infinite alternate; }
@keyframes kenburns{ from{ transform:scale(1.02) } to{ transform:scale(1.12) translateY(-1.5%) } }
.hero::after{ content:""; position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(180deg, rgba(15,10,7,.72) 0%, rgba(15,10,7,.28) 30%, rgba(15,10,7,.55) 72%, rgba(15,10,7,.94) 100%),
    radial-gradient(120% 80% at 50% 60%, transparent 40%, rgba(15,10,7,.5) 100%);
}
.hero-inner{ position:relative; z-index:2; max-width:820px; }
.hero-title{ font-family:var(--f-serif); font-weight:600;
  font-size:clamp(3.2rem, 9vw, 7rem); line-height:.98; letter-spacing:.01em;
  color:var(--cream); text-shadow:0 4px 40px rgba(0,0,0,.5); margin:.3rem 0 .1rem; }
.hero .eyebrow{ color:var(--gold-2); }
.hero-tag{ font-size:clamp(1.05rem,2.3vw,1.35rem); color:#efe6d6;
  max-width:36ch; margin:1.4rem auto 2rem; text-shadow:0 2px 20px rgba(0,0,0,.5); }
.hero-cta{ display:flex; gap:.9rem; justify-content:center; flex-wrap:wrap; }
.hero-hours{ margin-top:1.6rem; font-size:.9rem; letter-spacing:.05em; color:#d9cdb8; }
.scroll-cue{ position:absolute; bottom:22px; left:50%; transform:translateX(-50%); z-index:2;
  width:24px; height:40px; border:1.5px solid rgba(244,234,214,.4); border-radius:14px;
  display:flex; justify-content:center; padding-top:7px; }
.scroll-cue span{ width:3px; height:8px; border-radius:3px; background:var(--gold-2); animation:sd 1.7s infinite; }
@keyframes sd{ 0%{ transform:translateY(0);opacity:1 } 70%{ transform:translateY(13px);opacity:0 } 100%{opacity:0} }

/* ============ О РЕСТОРАНЕ ============ */
.about{ max-width:var(--wrap); margin:0 auto; padding:clamp(80px,12vh,150px) clamp(18px,4vw,44px);
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,72px); align-items:center; }
.about-copy p{ margin-bottom:1rem; font-size:1.06rem; }
.feature-line{ list-style:none; display:flex; flex-wrap:wrap; gap:.5rem 1.4rem; margin-top:1.8rem;
  font-family:var(--f-serif); font-size:1.15rem; color:var(--cream); }
.feature-line li{ position:relative; padding-left:1.1rem; }
.feature-line li::before{ content:""; position:absolute; left:0; top:.55em; width:6px; height:6px;
  border-radius:50%; background:var(--gold); }
.feature-line.col{ flex-direction:column; gap:.7rem; font-size:1.1rem; }

.about-art{ position:relative; height:min(60vh,540px); }
.about-main{ position:absolute; inset:0 12% 14% 0; border-radius:3px; overflow:hidden;
  box-shadow:0 40px 80px -40px rgba(0,0,0,.8); }
.about-inset{ position:absolute; right:0; bottom:0; width:52%; height:44%; border-radius:3px;
  overflow:hidden; border:5px solid var(--bg); box-shadow:0 30px 60px -30px rgba(0,0,0,.8); }
.about-feather{ position:absolute; left:-34px; top:-30px; width:64px; height:auto; opacity:.9;
  transform:rotate(-12deg); filter:drop-shadow(0 8px 16px rgba(0,0,0,.5)); }

/* ============ БАНД-ЦИТАТА ============ */
.band{ position:relative; min-height:52vh; display:flex; align-items:center; justify-content:center;
  text-align:center; padding:14vh 20px; overflow:hidden; }
.band-bg{ position:absolute; inset:0; z-index:0; }
.band-bg img{ animation:kenburns 26s ease-in-out infinite alternate; }
.band::after{ content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(90deg, rgba(15,10,7,.82), rgba(15,10,7,.55) 55%, rgba(15,10,7,.82)); }
.band-text{ position:relative; z-index:2; font-family:var(--f-serif); font-weight:500;
  font-size:clamp(1.8rem,4.4vw,3.2rem); line-height:1.2; color:var(--cream);
  text-shadow:0 3px 30px rgba(0,0,0,.6); }

/* ============ МЕНЮ ============ */
.menu{ max-width:var(--wrap); margin:0 auto; padding:clamp(70px,10vh,130px) clamp(18px,4vw,44px); }
.menu-head{ text-align:center; max-width:640px; margin:0 auto 3rem; }
.menu-wrap{ display:grid; grid-template-columns:340px 1fr; gap:clamp(30px,4vw,60px); align-items:start; }
.menu-photo{ position:sticky; top:100px; height:560px; border-radius:3px; overflow:hidden;
  box-shadow:0 40px 80px -40px rgba(0,0,0,.8); }

.mtabs{ display:flex; flex-wrap:wrap; gap:.9rem 1.4rem; padding-bottom:1.3rem;
  margin-bottom:1.8rem; border-bottom:1px solid var(--line); }
.mtab{ font-family:var(--f-sans); font-weight:600; font-size:.95rem; cursor:pointer;
  background:none; border:0; color:var(--dim); padding:.15rem 0 .5rem; position:relative; transition:color .25s; }
.mtab:hover{ color:var(--cream); }
.mtab.is-active{ color:var(--cream); }
.mtab.is-active::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--gold); }

.mcat{ display:none; }
.mcat.is-active{ display:block; animation:fade .4s ease; }
@keyframes fade{ from{opacity:0; transform:translateY(8px)} to{opacity:1;transform:none} }
.mcat-title{ display:none; }

.dish{ padding:1rem 0; border-bottom:1px solid var(--line); }
.d-top{ display:flex; align-items:baseline; gap:.4rem; }
.d-name{ font-family:var(--f-serif); font-weight:600; font-size:1.28rem; color:var(--cream); }
.lead{ flex:1; border-bottom:1px dotted rgba(244,234,214,.3); transform:translateY(-5px); min-width:20px; }
.d-price{ font-family:var(--f-serif); font-weight:600; font-size:1.18rem; color:var(--gold-2); white-space:nowrap; }
.d-desc{ font-size:.9rem; color:var(--dim); margin-top:.15rem; }

/* без JS: показываем все категории с заголовками, таб-бар прячем */
html:not(.js) .mtabs{ display:none; }
html:not(.js) .mcat{ display:block; margin-bottom:2rem; }
html:not(.js) .mcat-title{ display:block; font-family:var(--f-serif); font-weight:600;
  font-size:1.5rem; color:var(--gold-2); margin:1.5rem 0 .4rem; }

/* ============ АТМОСФЕРА ============ */
.atmo{ max-width:var(--wrap); margin:0 auto; padding:clamp(60px,8vh,110px) clamp(18px,4vw,44px); }
.atmo-grid{ display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:210px; gap:14px; }
.tile{ position:relative; border-radius:3px; overflow:hidden; grid-column:span 2; }
.tile img{ transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.tile:hover img{ transform:scale(1.06); }
.tile::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(15,10,7,.82), transparent 55%); }
.tile figcaption{ position:absolute; left:1.1rem; bottom:.95rem; z-index:2;
  font-family:var(--f-serif); font-weight:600; font-size:1.15rem; color:#fff; text-shadow:0 2px 12px rgba(0,0,0,.6); }
.tile.t-big{ grid-column:span 4; grid-row:span 2; }
.tile.t-wide{ grid-column:span 4; }

/* ============ ПРАЗДНИКИ ============ */
.events{ max-width:var(--wrap); margin:0 auto; padding:clamp(70px,10vh,130px) clamp(18px,4vw,44px);
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,72px); align-items:center; }
.events-img{ height:min(58vh,520px); border-radius:3px; overflow:hidden;
  box-shadow:0 40px 80px -40px rgba(0,0,0,.8); }
.events-copy p{ margin-bottom:1.4rem; font-size:1.06rem; }
.events-copy .btn{ margin-top:1.8rem; }

/* ============ КОНТАКТЫ ============ */
.contacts{ max-width:var(--wrap); margin:0 auto; padding:clamp(60px,8vh,110px) clamp(18px,4vw,44px);
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,64px); align-items:stretch; }
.c-row{ display:grid; grid-template-columns:110px 1fr; gap:1rem; padding:1.05rem 0; border-bottom:1px solid var(--line); }
.c-label{ font-weight:600; color:var(--gold); font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; }
.c-row a:hover{ color:var(--gold-2); }
.c-actions{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2rem; }
.contacts-map{ min-height:400px; border-radius:3px; overflow:hidden; border:1px solid var(--line); }
.contacts-map iframe{ width:100%; height:100%; min-height:400px; border:0; filter:grayscale(.3) contrast(1.05); }

/* ============ FOOTER ============ */
.footer{ text-align:center; padding:clamp(60px,8vh,100px) 20px clamp(80px,10vh,120px); border-top:1px solid var(--line); }
.foot-eye{ width:40px; height:auto; margin:0 auto 1rem; opacity:.95; }
.foot-name{ font-family:var(--f-serif); font-weight:600; font-size:1.9rem; color:var(--cream); }
.foot-links{ display:flex; gap:1.5rem; justify-content:center; margin:1.5rem 0 1rem; flex-wrap:wrap; }
.foot-links a{ font-weight:500; color:var(--cream); }
.foot-links a:hover{ color:var(--gold-2); }
.foot-copy{ font-size:.82rem; color:var(--dim); }

/* ============ ПЛАВАЮЩИЙ WHATSAPP ============ */
.wa-float{ position:fixed; right:20px; bottom:20px; z-index:50; width:54px; height:54px;
  display:flex; align-items:center; justify-content:center; border-radius:50%;
  background:linear-gradient(135deg,#25d366,#128c4b); color:#fff;
  box-shadow:0 12px 30px -8px rgba(18,140,75,.6); opacity:0; transform:translateY(16px);
  pointer-events:none; transition:.4s; }
.wa-float.show{ opacity:1; transform:none; pointer-events:auto; }
.wa-float:hover{ transform:scale(1.06); }

/* ============ REVEAL (JS) ============ */
.js .reveal{ opacity:0; transform:translateY(30px); transition:opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1); }
.js .reveal.in{ opacity:1; transform:none; }
.js .up{ opacity:0; transform:translateY(22px); animation:up .95s cubic-bezier(.2,.7,.2,1) forwards; }
.js .up.d1{ animation-delay:.12s } .js .up.d2{ animation-delay:.24s }
.js .up.d3{ animation-delay:.36s } .js .up.d4{ animation-delay:.48s }
@keyframes up{ to{ opacity:1; transform:none } }

/* ============ АДАПТИВ ============ */
@media (max-width:900px){
  .nav-links, .nav-right{ display:none; }
  .burger{ display:flex; }
  .nav.open .burger span:first-child{ transform:translateY(3.5px) rotate(45deg); }
  .nav.open .burger span:last-child{ transform:translateY(-3.5px) rotate(-45deg); }
  .mobile-menu{ position:fixed; inset:0 0 auto 0; z-index:39; display:flex; flex-direction:column;
    gap:.2rem; padding:84px 24px 24px; background:rgba(18,13,9,.97); backdrop-filter:blur(10px);
    transform:translateY(-100%); transition:transform .4s ease; }
  .mobile-menu.open{ transform:none; }
  .mobile-menu a{ padding:.9rem 0; font-size:1.15rem; border-bottom:1px solid var(--line); }
  .about, .events, .contacts{ grid-template-columns:1fr; }
  .about-art{ order:-1; height:56vh; }
  .events-img{ order:-1; }
  .menu-wrap{ grid-template-columns:1fr; }
  .menu-photo{ display:none; }
}
@media (max-width:640px){
  .atmo-grid{ grid-template-columns:1fr 1fr; grid-auto-rows:150px; }
  .tile, .tile.t-big, .tile.t-wide{ grid-column:span 2; grid-row:span 1; }
  .band::after{ background:linear-gradient(rgba(15,10,7,.6),rgba(15,10,7,.75)); }
}
@media (max-width:520px){
  .hero-title{ font-size:2.9rem; }
  .hero-cta{ flex-direction:column; align-items:stretch; width:100%; max-width:330px; margin:0 auto; }
  .hero-cta .btn{ width:100%; }
  .c-actions .btn{ flex:1 1 100%; }
}

/* ============ SHOT (debug: фикс высот для full-page скринов) ============ */
.shot .hero{ min-height:auto; padding:110px 20px 70px; }
.shot .band{ min-height:auto; padding:80px 20px; }
.shot .hero-bg img, .shot .band-bg img{ animation:none; }

/* ============ REDUCED MOTION ============ */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ animation-duration:.001s !important; transition-duration:.01s !important; }
  .js .reveal{ opacity:1; transform:none; }
  .js .up{ opacity:1; transform:none; }
  .hero-bg img, .band-bg img{ animation:none; }
}