:root{--bg:#F2F4EE;--bg2:#E3E9DE;--ink:#1E2B24;--muted:#5F6E64;--line:#D3DBCD;--sage:#C9D6C3;--coral:#D9573A;--coral2:#BF4328;--dark:#22332A;--card:#FAFBF8;--maxw:1180px;--hf:'Prata',Georgia,serif;--bf:'Nunito Sans',system-ui,sans-serif}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{background:var(--bg);color:var(--ink);font:400 17px/1.7 var(--bf);overflow-x:clip;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--hf);font-weight:400;line-height:1.1;text-wrap:balance}
h2{font-size:clamp(32px,4.2vw,52px)}
em{font-style:normal;color:var(--coral)}
:focus-visible{outline:2px solid var(--coral);outline-offset:3px}
.eyebrow{font:800 12px var(--bf);letter-spacing:.2em;text-transform:uppercase;color:var(--coral);margin-bottom:16px}

/* header */
.top{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:28px;padding:16px 40px;background:rgba(242,244,238,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.logo{display:flex;align-items:center;gap:10px;font:400 26px var(--hf);text-decoration:none;margin-right:auto}
.dot{width:14px;height:14px;border-radius:50%;background:var(--coral);display:block}
.top nav{display:flex;gap:30px}
.top nav a{font-size:15px;font-weight:600;text-decoration:none;color:var(--muted);transition:color .15s}
.top nav a:hover{color:var(--ink)}
.status{font-size:13px;font-weight:700;padding:7px 14px;border:1px solid var(--line);border-radius:99px;white-space:nowrap;background:var(--card)}
.status::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--muted);margin-right:8px}
.status.open::before{background:#2FA566}
.status.closed::before{background:var(--coral)}
.burger{display:none;background:none;border:0;width:40px;height:40px;position:relative;cursor:pointer}
.burger span{position:absolute;left:9px;right:9px;height:2px;background:var(--ink);transition:.2s}
.burger span:first-child{top:16px}.burger span:last-child{top:24px}
.burger[aria-expanded=true] span:first-child{top:20px;transform:rotate(45deg)}
.burger[aria-expanded=true] span:last-child{top:20px;transform:rotate(-45deg)}

.btn{display:inline-flex;align-items:center;justify-content:center;padding:16px 32px;border:1.5px solid transparent;border-radius:99px;font:700 15px var(--bf);text-decoration:none;cursor:pointer;transition:.2s;background:none;color:inherit}
.btn.dark{background:var(--dark);color:#fff}
.btn.dark:hover{background:var(--coral)}
.btn.line{border-color:var(--ink)}
.btn.line:hover{background:var(--ink);color:var(--bg)}

/* hero */
.hero{max-width:var(--maxw);margin:0 auto;padding:56px 40px 24px;display:grid;grid-template-columns:1fr 1.05fr;gap:56px;align-items:center}
.hero h1{font-size:clamp(44px,6.2vw,84px);margin-bottom:24px}
.lead{max-width:44ch;font-size:19px;color:var(--muted);margin-bottom:32px}
.cta-row{display:flex;gap:14px;flex-wrap:wrap}
.hero-facts{list-style:none;padding:0;display:flex;gap:36px;margin-top:44px;padding-top:24px;border-top:1px solid var(--line)}
.hero-facts b{display:block;font:400 24px var(--hf)}
.hero-facts span{font-size:13px;color:var(--muted)}
.hero-art{position:relative}
.hero-art img{width:100%;aspect-ratio:5/6;object-fit:cover;border-radius:220px 220px 28px 28px}
.sticker{position:absolute;left:-26px;bottom:44px;width:116px;height:116px;border-radius:50%;background:var(--coral);color:#fff;display:grid;place-items:center;text-align:center;font:800 12px/1.25 var(--bf);letter-spacing:.04em;transform:rotate(-10deg)}

/* sections */
.section{max-width:var(--maxw);margin:0 auto;padding:112px 40px 0}
.head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:44px}
.tabs{display:flex;gap:8px;flex-wrap:wrap}
.tab{padding:10px 20px;border:1px solid var(--line);border-radius:99px;background:none;font:700 14px var(--bf);cursor:pointer;color:var(--muted);transition:.15s}
.tab:hover{border-color:var(--ink);color:var(--ink)}
.tab[aria-selected=true]{background:var(--ink);border-color:var(--ink);color:var(--bg)}

.menu-wrap{display:grid;grid-template-columns:1.5fr 1fr;gap:56px;align-items:start}
.menu{display:grid;gap:0}
.item{display:flex;align-items:baseline;gap:16px;padding:20px 0;border-bottom:1px solid var(--line)}
.item h3{font:400 22px var(--hf);display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.item p{font-size:14px;color:var(--muted);line-height:1.5;margin-top:4px}
.item .pr{margin-left:auto;font:400 22px var(--hf);white-space:nowrap}
.badge{font:800 10px var(--bf);padding:3px 10px;border-radius:99px;background:var(--coral);color:#fff;text-transform:uppercase;letter-spacing:.08em}
.badge.v{background:var(--dark)}
.menu-photos{display:grid;grid-template-columns:1fr 1fr;gap:14px;position:sticky;top:96px}
.menu-photos img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:18px}
.menu-photos img:last-child{margin-top:40px}
.note{margin-top:20px;font-size:14px;color:var(--muted)}

.about{display:grid;grid-template-columns:1fr .9fr;gap:72px;align-items:center}
.about-art{position:relative;padding-bottom:70px}
.about-art .a1{width:84%;aspect-ratio:4/3;object-fit:cover;border-radius:20px}
.about-art .a2{position:absolute;right:0;bottom:0;width:46%;aspect-ratio:3/4;object-fit:cover;border-radius:20px;border:8px solid var(--bg)}
.about-text h2{margin-bottom:20px}
.about-text p{margin-bottom:14px;color:var(--muted)}
.ticks{list-style:none;padding:0;margin-top:22px;display:grid;gap:10px}
.ticks li{position:relative;padding-left:28px;font-weight:600;font-size:15px}
.ticks li::before{content:"";position:absolute;left:0;top:.62em;width:12px;height:12px;border-radius:50%;background:var(--coral)}

.loyalty{margin-top:112px;padding:0 40px}
.loy{max-width:var(--maxw);margin:0 auto;padding:64px;background:var(--dark);color:var(--bg);border-radius:32px;display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.loy .eyebrow{color:#F0A892}
.loy h2{margin-bottom:16px}
.loy p{color:#C4D0C6}
.stamps{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.stamps i{aspect-ratio:1;border-radius:50%;border:1.5px dashed #6C8374;display:grid;place-items:center;font:normal 400 18px var(--hf);color:#6C8374}
.stamps i.on{background:var(--coral);border:1.5px solid var(--coral);color:#fff}
.stamps i.gift{background:var(--bg);border:1.5px solid var(--bg);color:var(--dark)}

.rv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
#reviews figure{padding:36px;background:var(--card);border:1px solid var(--line);border-radius:22px}
#reviews blockquote{font:400 19px/1.55 var(--hf);margin-bottom:24px}
#reviews figcaption b{display:block;font-size:15px}
#reviews figcaption span{font-size:13px;color:var(--muted)}
.demo-note{margin-top:20px;font-size:12px;color:var(--muted)}

.tb-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:64px;align-items:start}
.tb-side h2{margin-bottom:16px}
.tb-side p:not(.eyebrow){color:var(--muted);margin-bottom:28px;max-width:40ch}
.tb-side img{width:100%;max-width:360px;aspect-ratio:4/5;object-fit:cover;border-radius:20px}
.form{background:var(--card);border:1px solid var(--line);border-radius:28px;padding:36px;display:grid;gap:20px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.field{display:grid;gap:7px;align-content:start}
label{font:700 13px var(--bf);color:var(--muted)}
input,select{width:100%;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:var(--bg);font:600 16px var(--bf);color:var(--ink);appearance:none}
input:focus,select:focus{outline:none;border-color:var(--ink)}
select{background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 22px) 55%,calc(100% - 16px) 55%;background-size:6px 6px;background-repeat:no-repeat;padding-right:40px}
.guests{display:flex;gap:8px;flex-wrap:wrap}
.g{width:46px;height:46px;border:1px solid var(--line);border-radius:50%;background:var(--bg);font:400 17px var(--hf);cursor:pointer;color:var(--ink);transition:.15s}
.g:hover{border-color:var(--ink)}
.g[aria-checked=true]{background:var(--dark);border-color:var(--dark);color:#fff}
.err{color:var(--coral2);font-weight:700;min-height:1.2em;font-size:14px}
.send{display:flex;gap:12px;flex-wrap:wrap}
.send .btn{flex:1 1 190px}

.contacts{margin-top:112px;background:var(--bg2);padding:96px 40px}
.ct-in{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.ct-in h2{margin-bottom:28px}
.info{display:grid;grid-template-columns:100px 1fr;gap:14px 16px;margin-bottom:32px}
.info dt{font:800 12px var(--bf);letter-spacing:.14em;text-transform:uppercase;color:var(--coral2);padding-top:5px}
.info a{text-decoration:none;border-bottom:1px solid var(--sage)}
.info a:hover{border-color:var(--coral)}
.ct-in img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:220px 220px 24px 24px;max-width:420px;margin-left:auto}

.foot{background:var(--dark);color:#C4D0C6;padding:24px 40px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px}
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);background:var(--dark);color:#fff;padding:14px 26px;border-radius:99px;font-weight:600;font-size:14px;opacity:0;pointer-events:none;transition:.3s;z-index:60;max-width:92vw;text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}

@media (max-width:960px){
  .hero,.about,.tb-grid,.ct-in,.loy,.menu-wrap,.rv-grid{grid-template-columns:1fr}
  .hero{padding:28px 20px 8px;gap:36px}
  .hero-art{max-width:460px}
  .sticker{left:auto;right:-6px;bottom:30px;width:100px;height:100px;font-size:11px}
  .section{padding:72px 20px 0}
  .menu-photos{display:none}
  .about{gap:40px}
  .loyalty{margin-top:72px;padding:0 20px}
  .loy{padding:36px 24px;gap:32px}
  .contacts{margin-top:72px;padding:64px 20px}
  .ct-in{gap:40px}
  .ct-in img{margin:0;max-width:340px}
  .top{padding:12px 20px;gap:12px}
  .top nav{position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:var(--bg);padding:6px 20px 18px;display:none;border-bottom:1px solid var(--line)}
  .top nav.open{display:flex}
  .top nav a{padding:14px 0;border-bottom:1px solid var(--line);font-size:16px}
  .burger{display:block}
  .foot{padding:22px 20px}
}
@media (max-width:520px){
  .row2{grid-template-columns:1fr}
  .status{display:none}
  .form{padding:22px}
  .hero-facts{gap:20px}
  .hero-facts b{font-size:19px}
  .info{grid-template-columns:84px 1fr}
  .stamps{gap:8px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
