/* maze — садовый лабиринт. namespace .mz */

:root{
  --mzHedgeDark:#14231a;
  --mzPanel:#1c2f22;
  --mzGravel:#d9d2c2;
  --mzStone:#8a9a8b;
  --mzRose:#d94f70;
  --mzText:#ccd6c9;
  --mzMuted:#8a9a8b;
  --mzLine:rgba(138,154,139,.34);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{-webkit-text-size-adjust:100%}

body.mz{
  background:var(--mzHedgeDark);
  color:var(--mzText);
  font:400 16px/1.68 "Golos Text","Segoe UI",Arial,sans-serif;
  overflow-x:hidden;
}

.mz h1,.mz h2,.mz h3,.mz .mzBig{
  font-family:"Ysabeau Infant","Golos Text",Georgia,serif;
  font-weight:700;
  letter-spacing:.2px;
  margin:0;
}

.mz p{margin:0 0 14px}
.mz ul{margin:0 0 14px;padding:0 0 0 18px}
.mz li{margin:0 0 7px}
.mz a{color:var(--mzRose)}

.mzWrap{max-width:1128px;margin:0 auto;padding:0 20px}

/* ---------- шапка ---------- */
.mzGate{
  border-bottom:1px solid var(--mzLine);
  background:linear-gradient(180deg,#182a1e,#14231a);
  position:relative;
}
.mzGateIn{display:flex;align-items:center;gap:14px;padding:14px 20px;max-width:1128px;margin:0 auto}
.mzSign{display:flex;align-items:center;gap:11px;text-decoration:none}
.mzSign svg{display:block;flex:0 0 auto}
.mzSignTx{display:flex;flex-direction:column;line-height:1.1}
.mzSignTx b,.mzSignTx span{font-weight:400}
.mzSignName{font-family:"Ysabeau Infant","Golos Text",serif;font-size:21px;font-weight:700;color:var(--mzGravel)}
.mzSignSub{font-size:11px;color:var(--mzMuted);letter-spacing:1.6px;text-transform:uppercase}
.mzGateGap{flex:1 1 auto}

.mz a.mzGo{
  display:inline-block;
  background:var(--mzRose);
  color:#17110f;
  text-decoration:none;
  font-family:"Golos Text",Arial,sans-serif;
  font-weight:600;
  font-size:15px;
  line-height:1.2;
  padding:12px 20px;
  border:0;
  clip-path:polygon(0 0,calc(100% - 13px) 0,100% 13px,100% 100%,13px 100%,0 calc(100% - 13px));
  white-space:nowrap;
}
.mz a.mzGo:hover{background:#e56682;color:#17110f}
.mz a.mzGoWide{padding:15px 30px;font-size:17px}
.mz a.mzGoGhost{background:transparent;color:var(--mzGravel);border:2px solid var(--mzStone)}
.mz a.mzGoGhost:hover{background:rgba(138,154,139,.16);color:var(--mzGravel)}

/* ---------- первый экран ---------- */
.mzLead{padding:34px 0 8px}
.mzTag{
  display:inline-block;font-size:11px;letter-spacing:2.4px;text-transform:uppercase;
  color:var(--mzRose);margin-bottom:14px;
}
.mzLead h1{font-size:40px;line-height:1.1;max-width:20ch;margin-bottom:8px;color:#eef1e8}
.mzLeadLine{font-family:"Ysabeau Infant",serif;font-size:22px;color:var(--mzStone);margin:0 0 16px}
.mzLead p{max-width:74ch}
.mzLeadGo{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0 4px}

.mzTiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:26px 0 8px}
.mzTile{
  background:var(--mzPanel);
  border-top:4px solid var(--mzStone);
  padding:15px 14px;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%);
}
.mzTile .mzBig{display:block;font-size:26px;line-height:1.1;color:var(--mzGravel)}
.mzTile span.mzTileTx{display:block;font-size:12.5px;color:var(--mzMuted);margin-top:5px}

/* ---------- нога лабиринта ---------- */
.mzLeg{display:grid;grid-template-columns:70px 1fr;gap:0;align-items:stretch}
.mzPlan{position:relative;min-width:0;min-height:100%}
.mzHedge{position:absolute;top:8px;bottom:8px;left:0;right:0}
.mzHedge::before{
  content:"";position:absolute;top:0;bottom:0;width:3px;background:var(--mzStone);opacity:.5;
}
.mzHedge::after{
  content:"";position:absolute;top:0;bottom:0;width:26px;
  background:repeating-linear-gradient(180deg,var(--mzStone) 0 3px,transparent 3px 27px);
  opacity:.33;
}
.mzLegEven .mzHedge::before{left:34px}
.mzLegEven .mzHedge::after{left:8px}
.mzLegOdd .mzHedge::before{right:34px}
.mzLegOdd .mzHedge::after{right:8px}

.mzTurn{position:relative;min-width:0;padding:26px 24px 22px;border-top:6px solid var(--mzRose)}
.mzLegEven .mzTurn{border-left:6px solid var(--mzRose)}
.mzLegOdd .mzTurn{border-right:6px solid var(--mzRose)}
.mzMark{
  position:absolute;top:-22px;width:40px;height:40px;border-radius:50%;
  background:var(--mzHedgeDark);border:3px solid var(--mzRose);
  display:flex;align-items:center;justify-content:center;
  font-family:"Ysabeau Infant",serif;font-weight:700;font-size:17px;color:var(--mzGravel);
}
.mzLegEven .mzMark{left:-23px}
.mzLegOdd .mzMark{right:-23px}

/* ---------- гравийная дорожка под заголовком ---------- */
.mzGravel{
  background-color:var(--mzGravel);
  background-image:
    radial-gradient(circle at 18% 36%,rgba(20,35,26,.30) 1.3px,transparent 1.4px),
    radial-gradient(circle at 63% 72%,rgba(20,35,26,.22) 1.6px,transparent 1.7px),
    radial-gradient(circle at 88% 22%,rgba(138,154,139,.55) 1.2px,transparent 1.3px);
  background-size:19px 19px,27px 27px,33px 33px;
  padding:13px 18px;
  margin:0 0 18px;
}
.mzGravel h2{font-size:27px;line-height:1.18;color:#12200f;max-width:30ch}

.mz h3{font-size:19px;color:var(--mzGravel);margin:20px 0 8px}

/* ---------- развилка между секциями ---------- */
.mzFork{position:relative;height:56px}
.mzFork i{
  position:absolute;top:2px;left:50%;width:3px;height:52px;
  background:var(--mzStone);opacity:.45;transform-origin:top center;display:block;
}
.mzFork i:first-child{transform:rotate(20deg)}
.mzFork i:last-child{transform:rotate(-20deg)}

/* ---------- зелёные комнаты каталога ---------- */
.mzRooms{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin:18px 0 20px}
.mzRoom{
  background:var(--mzPanel);
  border:1px solid var(--mzLine);
  padding:16px 13px 15px;
  text-align:center;
  clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,0 100%);
}
.mzRoomName{font-family:"Golos Text",Arial,sans-serif;font-weight:600;font-size:14px;color:var(--mzGravel);display:block;min-height:38px}
.mzMeta{font-size:12px;color:var(--mzMuted);margin:8px 0 0;line-height:1.35}
.mzRtp{display:block;font-family:"Ysabeau Infant",serif;font-weight:700;font-size:33px;line-height:1.05;color:var(--mzRose);margin:3px 0}

/* ---------- вложенные контуры клуба ---------- */
.mzRings{margin:18px 0 6px}
.mzRing{
  border:2px solid var(--mzLine);
  padding:13px 15px 15px;
  background:rgba(28,47,34,.45);
}
.mzRing + .mzRingTail{margin-top:10px}
.mzRingHead{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:baseline;margin:0 0 11px}
.mzRingName{font-family:"Ysabeau Infant",serif;font-weight:700;font-size:20px;color:var(--mzGravel)}
.mzRingCash{color:var(--mzRose);font-weight:600;font-size:14px}
.mzRingReq{color:var(--mzMuted);font-size:13px}
.mzRingCore{text-align:center;padding:6px 4px 2px}

/* ---------- таблица кассы ---------- */
.mzScroll{overflow-x:auto;max-width:100%;margin:16px 0 18px;-webkit-overflow-scrolling:touch}
.mzDesk{border-collapse:collapse;width:100%;min-width:620px;font-size:14px}
.mzDesk th,.mzDesk td{border-bottom:1px solid var(--mzLine);padding:10px 11px;text-align:left;vertical-align:top}
.mzDesk th{
  font-family:"Golos Text",Arial,sans-serif;font-weight:600;font-size:12.5px;
  color:var(--mzHedgeDark);background:var(--mzStone);
}
.mzDesk td:first-child{color:var(--mzGravel);font-weight:500}
.mzDesk td.mzExit{color:var(--mzRose);font-weight:600;white-space:nowrap}

/* ---------- ступени пакета ---------- */
.mzSteps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0}
.mzStep{
  background:var(--mzPanel);border-left:4px solid var(--mzRose);padding:14px 14px 12px;
}
.mzStepNo{display:block;font-size:11px;letter-spacing:1.8px;text-transform:uppercase;color:var(--mzMuted)}
.mzStep .mzBig{display:block;font-size:25px;color:var(--mzGravel);margin:5px 0 2px}
.mzStepFs{font-size:13px;color:var(--mzStone)}

/* ---------- врезка отзыва ---------- */
.mzVoice{
  border-left:4px solid var(--mzRose);
  background:rgba(28,47,34,.6);
  padding:14px 16px 12px;
  margin:18px 0;
}
.mzVoice p{margin:0 0 9px;font-size:15px}
.mzVoiceWho{font-size:12.5px;color:var(--mzMuted);letter-spacing:.4px}

/* ---------- FAQ ---------- */
.mzAsk{border-bottom:1px solid var(--mzLine);padding:2px 0}
.mzAsk summary{
  cursor:pointer;list-style:none;padding:12px 30px 12px 0;position:relative;
  font-family:"Golos Text",Arial,sans-serif;font-weight:600;font-size:15.5px;color:var(--mzGravel);
}
.mzAsk summary::-webkit-details-marker{display:none}
.mzAsk summary::after{content:"+";position:absolute;right:4px;top:10px;color:var(--mzRose);font-size:20px}
.mzAsk[open] summary::after{content:"–"}
.mzAsk p{margin:0 0 13px;font-size:15px}

/* ---------- заметка автора и подвал ---------- */
.mzNote{
  border:1px dashed var(--mzLine);padding:18px 20px;margin:34px 0 0;background:rgba(28,47,34,.35);
}
.mzNote h3{font-size:20px;color:var(--mzGravel);margin:0 0 9px}
.mzNote p{font-size:14px;color:var(--mzStone)}
.mzRoot{border-top:1px solid var(--mzLine);margin-top:34px;padding:24px 0 40px}
.mzRoot p{font-size:13px;color:var(--mzMuted);max-width:88ch}
.mzAge{
  display:inline-block;border:2px solid var(--mzRose);color:var(--mzRose);
  font-weight:600;font-size:13px;padding:2px 9px;margin-right:9px;
}

.mzKeep{color:var(--mzGravel)}
.mzNum{color:var(--mzRose);font-weight:600}

/* ---------- адаптив ---------- */
@media (max-width:980px){
  .mzRooms{grid-template-columns:repeat(3,1fr)}
  .mzTiles{grid-template-columns:repeat(2,1fr)}
  .mzSteps{grid-template-columns:repeat(2,1fr)}
  .mzLead h1{font-size:34px}
}
@media (max-width:720px){
  .mzWrap{padding:0 14px}
  .mzLeg{grid-template-columns:22px 1fr}
  .mzHedge{top:4px;bottom:4px}
  .mzHedge::after{width:12px}
  .mzLegEven .mzHedge::before{left:14px}
  .mzLegEven .mzHedge::after{left:1px}
  .mzLegOdd .mzHedge::before{right:14px}
  .mzLegOdd .mzHedge::after{right:1px}
  .mzTurn{padding:24px 0 18px;border-left-width:4px;border-right-width:4px}
  .mzLegEven .mzTurn{padding-left:13px}
  .mzLegOdd .mzTurn{padding-right:13px}
  .mzMark{width:32px;height:32px;top:-18px;font-size:14px}
  .mzLegEven .mzMark{left:-18px}
  .mzLegOdd .mzMark{right:-18px}
  .mzGravel{padding:11px 13px;margin-left:-2px}
  .mzGravel h2{font-size:22px;max-width:none}
  .mzLead{padding:24px 0 4px}
  .mzLead h1{font-size:27px;max-width:none}
  .mzLeadLine{font-size:18px}
  .mzRooms{grid-template-columns:repeat(2,1fr);gap:10px}
  .mzGateIn{padding:11px 14px;gap:10px}
  .mzSignName{font-size:18px}
  .mzSignSub{font-size:9.5px;letter-spacing:1.1px}
  .mz a.mzGo{font-size:13.5px;padding:10px 13px}
  .mz a.mzGoWide{font-size:15px;padding:13px 20px}
  .mzLeadGo a.mzGo{flex:1 1 100%;text-align:center}
  .mzRtp{font-size:27px}
  .mzDesk{min-width:540px;font-size:13px}
  .mzDesk th,.mzDesk td{padding:8px 8px}
  .mzRing{padding:10px 10px 12px}
  .mzRingName{font-size:17px}
}
@media (max-width:400px){
  .mzSignSub{display:none}
  .mzTiles{gap:9px}
}
