/* ============================================================
   Золотой Заяц — UI-оснастка: гласс-шапка, бургер-оверлей, гласс-футер.
   Токены согласованы со страницей меню (template-menu.php).
   ============================================================ */
:root{
	--zz-bg:#f7f2e9;
	--zz-txt:#33291b;
	--zz-brown:#4d3a19;
	--zz-gold:#a6873f;
	--zz-gold-soft:#c6af85;
	--zz-muted:#95886f;
	--zz-line:rgba(77,58,25,.15);
	--zz-f-display:'CenturyGothic','Jost','Questrial',system-ui,sans-serif;
	--zz-f-body:'GothamPro','Montserrat',system-ui,sans-serif;
	--zz-f-accent:'Angst','CenturyGothic','Jost','Questrial',serif; /* заголовки/акценты, ТОЛЬКО прямое начертание */
	--zz-f-deco:'Angst','CenturyGothic',serif;        /* Angst — только латиница, только regular */
	/* liquid glass */
	--zz-glass-bg:rgba(255,254,252,.38);
	--zz-glass-grad:linear-gradient(180deg,rgba(255,255,255,.52),rgba(255,255,255,.06) 48%,rgba(255,255,255,.02) 72%,rgba(255,255,255,.26));
	--zz-glass-blur:blur(28px) saturate(1.3) brightness(1.05);
	--zz-glass-border:1px solid rgba(255,255,255,.5);
	--zz-glass-shadow:0 20px 50px -24px rgba(77,58,25,.45),
		inset 0 1.5px 0 rgba(255,255,255,.95),
		inset 1px 0 0 rgba(255,255,255,.35),
		inset -1px 0 0 rgba(255,255,255,.35),
		inset 0 -1px 0 rgba(255,255,255,.2);
	--zz-radius:12px;
	--zz-hdr-h:74px;
}

/* ---------- ссылки: фирменное золото вместо браузерного синего ---------- */
a{color:var(--zz-gold)}
a:hover{color:#8a6d3d}

/* ---------- фирменная кнопка ---------- */
.zbtn{display:inline-flex;align-items:center;gap:12px;font-family:var(--zz-f-display);font-size:12px;
	letter-spacing:.24em;text-transform:uppercase;color:var(--zz-txt);text-decoration:none;background:none;border:0;
	padding:10px 0;cursor:pointer;transition:color .25s}
.zbtn svg{width:18px;height:18px;flex:none;stroke:currentColor;stroke-width:1.1;fill:none}
.zbtn:after{content:"";width:44px;height:1px;background:currentColor;opacity:.75;transition:width .3s ease}
.zbtn:hover{color:var(--zz-gold)}
.zbtn:hover:after{width:66px}
.zbtn--lg{font-size:14px;letter-spacing:.26em;gap:14px;padding:14px 0}
.zbtn--lg:after{width:64px;height:1px}
.zbtn--lg:hover:after{width:96px}
.zbtn--sm{font-size:10.5px;letter-spacing:.2em;gap:9px}
.zbtn--sm svg{width:15px;height:15px}
.zbtn--sm:after{width:28px}
.zbtn--sm:hover:after{width:44px}
.zbtn--noline:after{display:none}

/* ---------- шапка ---------- */
.zz-hdr{position:sticky;top:14px;z-index:40;max-width:1326px;margin:14px auto 0;padding:0 32px;
	transition:transform .35s ease,opacity .35s ease}
.zz-hdr-in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:var(--zz-hdr-h);
	padding:0 26px;border-radius:var(--zz-radius);
	background-color:var(--zz-glass-bg);background-image:var(--zz-glass-grad);
	-webkit-backdrop-filter:var(--zz-glass-blur);backdrop-filter:var(--zz-glass-blur);
	border:var(--zz-glass-border);box-shadow:var(--zz-glass-shadow)}
body.zz-hdr-hidden .zz-hdr{transform:translateY(-140%);opacity:0;pointer-events:none}
body.admin-bar .zz-hdr{top:46px}
@media(max-width:782px){body.admin-bar .zz-hdr{top:56px}}
.zz-hdr-in>*{position:relative;z-index:1;transform:translateZ(0)}
.zz-hdr-side{display:flex;align-items:center;gap:36px}
.zz-hdr-l{justify-content:flex-start}
.zz-hdr-r{justify-content:flex-end}
.zz-hdr-side a{font-family:var(--zz-f-display);font-size:13px;letter-spacing:.2em;text-transform:uppercase;
	color:var(--zz-txt);text-decoration:none;transition:color .22s;white-space:nowrap}
.zz-hdr-side a:hover{color:var(--zz-gold)}
.zz-hdr-logo{display:inline-flex;align-items:center;gap:14px;text-decoration:none;padding:0 30px}
.zz-hdr-logo img{height:44px;filter:drop-shadow(0 3px 8px rgba(77,58,25,.25))}
/* оригинальный леттеринг «ЗОЛОТОЙ ЗАЯЦ» через маску wordmark.png */
.zz-word{display:block;width:186px;height:14px;
	background:linear-gradient(100deg,#8a6d3d,#b3924f 45%,#6d5527 80%,#8a6d3d);
	-webkit-mask:url('/promo/assets/wordmark.png') center/contain no-repeat;
	mask:url('/promo/assets/wordmark.png') center/contain no-repeat}
.zz-burger{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;
	background:none;border:0;cursor:pointer;color:var(--zz-txt);padding:0;transition:color .22s;text-decoration:none}
.zz-burger svg{width:24px;height:24px;stroke:currentColor;stroke-width:1.3;fill:none}
.zz-burger:hover{color:var(--zz-gold)}
.zz-hdr-call{display:none}

/* тёмная вариация шапки (тёмные hero: главная, 404) */
.zz-hdr--dark .zz-hdr-in{background-color:rgba(38,30,20,.38);
	background-image:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.02) 50%,rgba(255,255,255,.06));
	border-color:rgba(255,255,255,.16);
	box-shadow:0 20px 50px -24px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.22)}
.zz-hdr--dark .zz-hdr-side a{color:#f1e8d6}
.zz-hdr--dark .zz-hdr-side a:hover{color:#e8d9ad}
.zz-hdr--dark .zz-burger{color:#f1e8d6}
.zz-hdr--dark .zz-word{background:linear-gradient(100deg,#b89a5e,#f0e6c8 45%,#c9ad72 75%,#e7d9ad)}

@media(max-width:900px){
	.zz-hdr{padding:0 14px;top:10px;margin-top:10px}
	.zz-hdr-in{grid-template-columns:42px 1fr 42px;padding:0 12px;height:60px}
	.zz-hdr-side a:not(.zz-burger){display:none}
	.zz-hdr-call{display:inline-flex}
	.zz-hdr-call svg{width:20px;height:20px}
	.zz-hdr-logo{justify-content:center;padding:0;gap:10px}
	.zz-hdr-logo img{height:34px}
	.zz-word{width:132px;height:10px}
}

/* ---------- соцсети: двухбуквенные бейджи ---------- */
.zz-soc{display:flex;gap:12px;justify-content:center;margin-top:20px}
.zz-soc--left{justify-content:flex-start;margin-top:14px}
.zz-soc-b{width:42px;height:42px;border:1px solid var(--zz-line);border-radius:50%;
	display:inline-flex;align-items:center;justify-content:center;
	font-family:var(--zz-f-display);font-size:12px;letter-spacing:.06em;
	color:var(--zz-brown);text-decoration:none;transition:.22s;background:rgba(255,255,255,.25)}
.zz-soc-b:hover{border-color:var(--zz-gold);color:var(--zz-gold);transform:translateY(-2px)}

/* ---------- pdf-ссылки в футере ---------- */
.zz-foot-pdf{display:inline-flex;align-items:center;gap:8px}
.zz-foot-pdf svg{width:14px;height:15px;stroke:var(--zz-gold);stroke-width:1.2;fill:none;flex:none}

/* ---------- попап бронирования ---------- */
.zz-bk-ov{position:fixed;inset:0;z-index:97;opacity:0;pointer-events:none;transition:opacity .3s ease}
.zz-bk-ov.zz-open{opacity:1;pointer-events:auto}
.zz-bk-bg{position:absolute;inset:0;background:rgba(51,41,27,.3);
	-webkit-backdrop-filter:blur(22px) saturate(1.3);backdrop-filter:blur(22px) saturate(1.3)}
.zz-bk-panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.97);width:min(440px,calc(100% - 28px));
	max-height:calc(100dvh - 28px);overflow-y:auto;padding:40px 34px 30px;border-radius:12px;text-align:center;
	background-color:rgba(252,249,243,.88);background-image:var(--zz-glass-grad);
	-webkit-backdrop-filter:var(--zz-glass-blur);backdrop-filter:var(--zz-glass-blur);
	border:var(--zz-glass-border);box-shadow:var(--zz-glass-shadow);transition:transform .3s ease}
.zz-bk-ov.zz-open .zz-bk-panel{transform:translate(-50%,-50%)}
.zz-bk-panel>*{position:relative;z-index:1}
.zz-bk-x{position:absolute!important;top:14px;right:14px;width:38px;height:38px;border:0;border-radius:50%;
	background:rgba(77,58,25,.06);color:var(--zz-txt);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.22s;z-index:2}
.zz-bk-x svg{width:17px;height:17px;stroke:currentColor;stroke-width:1.4;fill:none}
.zz-bk-x:hover{background:rgba(77,58,25,.12)}
.zz-bk-hare{height:46px;width:auto;align-self:center;margin:0 auto 10px;filter:drop-shadow(0 5px 14px rgba(77,58,25,.25))}
.zz-bk-title{font-family:var(--zz-f-accent);font-size:21px;letter-spacing:.16em;text-indent:.16em;text-transform:uppercase;color:var(--zz-brown)}
.zz-bk-sub{font-family:var(--zz-f-body);font-weight:300;font-size:12.5px;color:var(--zz-muted);margin:6px 0 18px}
.zz-bk-form{display:flex;flex-direction:column}
.zz-hp{position:absolute;left:-5000px;width:1px;height:1px;opacity:0}
.zz-f{display:flex;flex-direction:column;gap:5px;text-align:left;margin-bottom:12px}
.zz-f span{font-family:var(--zz-f-display);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--zz-muted)}
.zz-f input,.zz-f select,.zz-f textarea{font-family:var(--zz-f-body);font-weight:300;font-size:15px;color:var(--zz-txt);
	background:rgba(255,255,255,.55);border:1px solid rgba(77,58,25,.18);border-radius:8px;padding:11px 14px;outline:none;
	transition:border-color .22s,background .22s;-webkit-appearance:none;appearance:none;width:100%}
.zz-f input:focus,.zz-f select:focus,.zz-f textarea:focus{border-color:var(--zz-gold);background:rgba(255,255,255,.8)}
/* подсветка ошибок в полях */
.zz-f input.zz-err,.zz-f select.zz-err,.zz-f textarea.zz-err{border-color:#b0472a;background:rgba(176,71,42,.06)}
.zz-f input.zz-err::placeholder,.zz-f textarea.zz-err::placeholder{color:#b0472a;opacity:1}
.zz-agree.zz-err span{color:#b0472a}
.zz-agree.zz-err input{outline:2px solid rgba(176,71,42,.55);outline-offset:1px;border-radius:3px}
.zz-f textarea{resize:vertical;min-height:52px}
.zz-f2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.zz-agree{display:flex;align-items:flex-start;gap:9px;text-align:left;margin:4px 0 8px;cursor:pointer}
.zz-agree input{width:15px;height:15px;margin-top:2px;accent-color:var(--zz-gold)}
.zz-agree span{font-size:11px;color:var(--zz-muted);line-height:1.5}
.zz-bk-err{min-height:16px;font-size:11.5px;color:#a04628;margin-bottom:4px}
.zz-bk-submit{font-family:var(--zz-f-display);font-size:12px;letter-spacing:.24em;text-indent:.24em;text-transform:uppercase;
	color:#fdfaf4;background:linear-gradient(120deg,#8a6d3d,#a6873f 55%,#8a6d3d);border:0;border-radius:999px;
	padding:15px 20px;cursor:pointer;transition:filter .22s,transform .22s;box-shadow:0 10px 26px -12px rgba(138,109,61,.7)}
.zz-bk-submit:hover{filter:brightness(1.07)}
.zz-bk-submit:active{transform:translateY(1px)}
.zz-bk-submit[disabled]{opacity:.6;cursor:wait}
.zz-bk-alt{display:block;margin-top:14px;font-family:var(--zz-f-display);font-size:10.5px;letter-spacing:.14em;
	color:var(--zz-muted);text-decoration:none}
.zz-bk-alt:hover{color:var(--zz-gold)}
.zz-bk-done{display:flex;flex-direction:column;align-items:center;padding:20px 0 6px}
.zz-bk-done[hidden],.zz-bk-form[hidden]{display:none!important}
.zz-bk-done .zz-bk-submit{margin-top:20px;min-width:180px}

/* ---------- плавающая CTA ---------- */
.zz-fab{position:fixed;right:22px;bottom:22px;z-index:60;display:inline-flex;align-items:center;gap:10px;
	font-family:var(--zz-f-display);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--zz-brown);
	text-decoration:none;padding:15px 22px;border-radius:999px;
	background-color:var(--zz-glass-bg);background-image:var(--zz-glass-grad);
	-webkit-backdrop-filter:var(--zz-glass-blur);backdrop-filter:var(--zz-glass-blur);
	border:var(--zz-glass-border);box-shadow:var(--zz-glass-shadow);
	opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .3s,transform .3s,color .22s}
.zz-fab svg{width:16px;height:16px;stroke:currentColor;stroke-width:1.2;fill:none;position:relative;z-index:1}
.zz-fab span{position:relative;z-index:1}
.zz-fab:hover{color:var(--zz-gold)}
body.zz-fab-on .zz-fab{opacity:1;transform:none;pointer-events:auto}
@media(max-width:560px){.zz-fab{right:14px;bottom:14px;padding:14px 18px}}

/* ---------- бургер-оверлей (полноэкранный, по мотивам мишки) ---------- */
.zz-nav-ov{position:fixed;inset:0;z-index:80;opacity:0;pointer-events:none;transition:opacity .35s ease}
.zz-nav-ov.zz-open{opacity:1;pointer-events:auto}
.zz-nav-ov-panel{position:absolute;inset:0;overflow-y:auto;
	background:rgba(252,249,243,.9);
	-webkit-backdrop-filter:var(--zz-glass-blur);backdrop-filter:var(--zz-glass-blur);
	transform:translateY(-12px);transition:transform .4s ease}
.zz-nav-ov.zz-open .zz-nav-ov-panel{transform:none}
.zz-nav-ov-mark{display:inline-flex;height:54px;align-self:flex-start;margin:0 0 38px 3px;
	filter:drop-shadow(0 4px 12px rgba(77,58,25,.2))}
.zz-nav-ov-mark img{height:100%;width:auto}
.zz-nav-ov-close{position:absolute;top:30px;right:40px}
.zz-nav-ov-grid{display:grid;grid-template-columns:1.15fr 1fr;min-height:100%;max-width:1326px;margin:0 auto;
	padding:28px 40px 64px;gap:60px;align-items:stretch}
.zz-nav-ov-links{display:flex;flex-direction:column;align-items:flex-start;gap:2px;justify-content:flex-start;
	padding-left:76px}
.zz-nav-ov-links a{font-family:var(--zz-f-display);font-weight:300;font-size:clamp(22px,2.4vw,32px);
	letter-spacing:.015em;color:#bfb49c;text-decoration:none;padding:5px 0;line-height:1.3;transition:color .25s,transform .25s}
.zz-nav-ov-links a:hover{color:var(--zz-brown);transform:translateX(6px)}
.zz-nav-ov-side{border-left:1px solid var(--zz-line);padding-left:64px;display:flex;flex-direction:column;
	align-items:flex-start;justify-content:flex-end;padding-bottom:8px}
.zz-ct{margin-bottom:26px}
.zz-ct-l{display:block;font-family:var(--zz-f-display);font-size:10px;letter-spacing:.3em;text-transform:uppercase;
	color:var(--zz-muted);margin-bottom:8px}
.zz-ct-v{font-family:var(--zz-f-body);font-weight:300;font-size:19px;color:var(--zz-txt)}
.zz-ct-v a{color:inherit;text-decoration:none;transition:color .22s}
.zz-ct-v a:hover{color:var(--zz-gold)}
.zz-ct-s{font-family:var(--zz-f-body);font-weight:300;font-size:12.5px;color:var(--zz-muted);margin-top:4px}
.zz-nav-ov-rule{width:100%;max-width:320px;height:1px;margin:6px 0 24px;background:var(--zz-line)}
@media(max-width:860px){
	/* моб: заяц маленький, на одной линии с «Закрыть»; контент поднят и компактен,
	   чтобы «Забронировать стол» был виден без скролла */
	.zz-nav-ov-mark{position:absolute;top:14px;left:22px;height:36px;margin:0}
	.zz-nav-ov-close{top:20px;right:18px}
	.zz-nav-ov-grid{grid-template-columns:1fr;gap:22px;padding:64px 26px 30px;align-items:start}
	.zz-nav-ov-links{padding-left:0}
	.zz-nav-ov-links a{font-size:clamp(22px,5.8vw,28px);padding:4px 0}
	.zz-nav-ov-side{border-left:0;border-top:1px solid var(--zz-line);padding-left:0;padding-top:22px;justify-content:flex-start}
	.zz-ct{margin-bottom:12px}
	.zz-ct-l{font-size:9px;margin-bottom:3px}
	.zz-ct-v{font-size:15px}
	.zz-ct-s{font-size:11px;margin-top:2px}
	.zz-nav-ov-rule{margin:2px 0 12px}
	.zz-nav-ov-side .zbtn{padding:6px 0}
	.zz-soc--left{margin-top:8px}
	.zz-soc-b{width:36px;height:36px;font-size:11px}
}

/* ---------- футер ---------- */
.zz-foot{position:relative;z-index:1;max-width:1326px;margin:90px auto 0;padding:0 32px 32px}
.zz-foot-glass{border-radius:12px;padding:52px 56px 0;
	background-color:var(--zz-glass-bg);background-image:var(--zz-glass-grad);
	-webkit-backdrop-filter:var(--zz-glass-blur);backdrop-filter:var(--zz-glass-blur);
	border:var(--zz-glass-border);box-shadow:var(--zz-glass-shadow)}
.zz-foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.3fr;gap:40px;padding-bottom:44px}
.zz-foot-brand img{height:64px;filter:drop-shadow(0 6px 18px rgba(77,58,25,.22))}
.zz-foot-name{font-family:var(--zz-f-accent);font-size:19px;letter-spacing:.22em;text-transform:uppercase;
	color:var(--zz-brown);margin-top:14px}
.zz-foot-tag{font-family:var(--zz-f-display);font-size:10px;letter-spacing:.3em;text-transform:uppercase;
	color:var(--zz-muted);margin-top:6px}
.zz-foot-h{font-family:var(--zz-f-display);font-size:10.5px;letter-spacing:.28em;text-transform:uppercase;
	color:var(--zz-gold);margin-bottom:16px}
.zz-foot-col{display:flex;flex-direction:column;align-items:flex-start;gap:9px}
.zz-foot-col a,.zz-foot-col span{font-family:var(--zz-f-body);font-weight:300;font-size:13.5px;color:var(--zz-txt);
	text-decoration:none;transition:color .22s}
.zz-foot-col a:hover{color:var(--zz-gold)}
.zz-foot-dim{color:var(--zz-muted)!important;font-size:11.5px!important}
.zz-foot-phone{font-family:var(--zz-f-display)!important;font-size:16px!important;letter-spacing:.06em;color:var(--zz-brown)!important}
.zz-foot-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;
	border-top:1px solid var(--zz-line);padding:18px 0 22px;
	font-family:var(--zz-f-display);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--zz-muted)}
.zz-foot-bottom a{color:var(--zz-muted);text-decoration:none;transition:color .22s}
.zz-foot-bottom a:hover{color:var(--zz-gold)}

@media(max-width:900px){
	.zz-foot{padding:0 14px 18px;margin-top:60px}
	.zz-foot-glass{padding:38px 26px 0}
	.zz-foot-grid{grid-template-columns:1fr 1fr;gap:30px}
	.zz-foot-brand{grid-column:1/-1;text-align:center}
	.zz-foot-brand img{height:52px}
	.zz-foot-contacts{grid-column:1/-1}
	.zz-foot-bottom{flex-direction:column;gap:6px;text-align:center}
}