:root{
  --ink:#0c2a30;--ink-2:#33555c;--teal:#0e5a66;--teal-dark:#0a3f47;
  --sand:#f5efe4;--cream:#faf7f1;--line:#d9cfbe;--gold:#c08433;
  --maxw:1180px;
}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:inherit;font-weight:700;font-size:14px;
  padding:12px 22px;border-radius:999px;cursor:pointer;border:none;
  transition:transform .2s, box-shadow .2s, background .2s;
}
.btn-primary{background:var(--gold);color:#fff;box-shadow:0 10px 24px -10px rgba(192,132,51,.7)}
.btn-primary:hover{transform:translateY(-2px);background:#ad7226}
.btn-light{background:#fff;color:var(--teal-dark)}
.btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.6)}
/* ---------- Header ---------- */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:50;
  transition:background .3s, box-shadow .3s;
}
.site-header.scrolled{background:rgba(250,247,241,.94);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--line)}
.nav{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  height:72px;
}
.brand{display:flex;align-items:center;gap:10px}
.brand img{height:30px;width:auto;filter:brightness(0) invert(1);transition:filter .3s}
.site-header.scrolled .brand img{filter:none}
.nav-links{display:flex;align-items:center;gap:28px;font-size:14px;font-weight:600}
.nav-links a{color:#fff;transition:color .3s}
.site-header.scrolled .nav-links a{color:var(--ink-2)}
.nav-links a:hover{color:#f3d9b0}
.site-header.scrolled .nav-links a:hover{color:var(--teal)}
.nav-links a.active{color:#f3d9b0}
.site-header.scrolled .nav-links a.active{color:var(--teal)}
.nav-right{display:flex;align-items:center;gap:14px}
.phone{font-weight:700;font-size:15px;color:#fff;white-space:nowrap;transition:color .3s}
.site-header.scrolled .phone{color:var(--ink)}
.menu-toggle{display:none;background:none;border:none;cursor:pointer;color:#fff;transition:color .3s}
.site-header.scrolled .menu-toggle{color:var(--ink)}
.icon-btn{
  width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  background:var(--teal);color:#fff;transition:transform .2s,background .2s;
}
.icon-btn:hover{background:var(--teal-dark);transform:translateY(-1px)}
.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:inherit;font-weight:700;font-size:14px;
  padding:12px 22px;border-radius:999px;cursor:pointer;border:none;
  transition:transform .2s, box-shadow .2s, background .2s;
}
.btn-primary{background:var(--gold);color:#fff;box-shadow:0 10px 24px -10px rgba(192,132,51,.7)}
.btn-primary:hover{transform:translateY(-2px);background:#ad7226}
.btn-light{background:#fff;color:var(--teal-dark)}
.btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.6)}
.btn-ghost:hover{background:rgba(255,255,255,.12)}

/* ---------- Footer ---------- */
footer{background:var(--teal-dark);color:#cfe0e2;padding:56px 0 30px}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:30px;margin-bottom:40px}
.foot-brand img{height:30px;margin-bottom:14px}
.foot-brand p{font-size:13.5px;color:#bcd3d6;max-width:280px}
footer h5{color:#fff;font-size:13px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px}
footer ul{list-style:none}
footer li{margin-bottom:8px}
footer li a{font-size:14px;color:#cfe0e2;transition:color .2s}
footer li a:hover{color:#fff}
.foot-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:12.5px;color:#9bb4b7}
.rekvizit{font-size:12.5px;color:#9bb4b7}

/* ---------- Floating CTA mobile ---------- */
.float-cta{position:fixed;bottom:18px;right:18px;z-index:40;display:none}


.site-chrome .site-header{position:fixed;top:0;left:0;right:0;z-index:100}
.mockup-page .hero{padding-top:72px}

/* Header & hero text over photo background */
.mockup-page .site-header:not(.scrolled) {
  background: linear-gradient(180deg, oklch(0.12 0.03 240 / 0.78) 0%, oklch(0.12 0.03 240 / 0.42) 65%, transparent 100%);
}
.mockup-page .site-header:not(.scrolled) .nav-links a {
  color: #fff;
  text-shadow: 0 1px 3px oklch(0 0 0 / 0.5);
}
.mockup-page .site-header:not(.scrolled) .nav-links a:hover,
.mockup-page .site-header:not(.scrolled) .nav-links a.active {
  color: #f3d9b0;
}
.mockup-page .site-header:not(.scrolled) .phone {
  color: #fff;
  text-shadow: 0 1px 3px oklch(0 0 0 / 0.5);
}
.mockup-page .hero-eyebrow {
  color: #f3d9b0;
  text-shadow: 0 1px 4px oklch(0 0 0 / 0.55);
}
.mockup-page .hero-media::after {
  background: linear-gradient(
    180deg,
    oklch(0.12 0.03 240 / 0.72) 0%,
    oklch(0.12 0.03 240 / 0.45) 35%,
    oklch(0.12 0.03 240 / 0.35) 55%,
    oklch(0.12 0.03 240 / 0.9) 100%
  );
}

@media (max-width:680px){.site-chrome .float-cta{display:inline-flex}}
.form-message{margin-top:12px;padding:12px 14px;border-radius:12px;font-size:14px;font-weight:600}
.form-message.ok{background:#e3f1e8;color:#2f6b3d}
.form-message.error{background:#fbeed1;color:#8a5a14}
.form-note{font-size:var(--text-sm);color:var(--color-text-muted);margin-bottom:var(--space-4)}
@media (max-width:980px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:680px){
  .nav-links,.phone{display:none}
  .menu-toggle{display:grid;place-items:center;width:40px;height:40px}
  .nav-right .btn{display:none}
  .foot-grid{grid-template-columns:1fr}
}