:root{
  --ink:#10151f;        /* ночное небо, фон */
  --ink-2:#161d2b;      /* панели */
  --ink-3:#1e2838;      /* бордеры */
  --paper:#f3efe6;      /* тёплый лунный свет, текст */
  --muted:#9aa6bb;      /* приглушённый */
  --brass:#c69a53;      /* латунь — акцент */
  --brass-soft:#d8b876;
  --sky:#5a7a9c;        /* дневное небо для второстепенного */
  --maxw:1120px;
  --r:4px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:"Spectral",Georgia,serif;
  font-size:18px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.nav-logo{font-family:"Fraunces","Spectral",Georgia,serif;font-weight:600;line-height:1.1;letter-spacing:-.01em}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(16,21,31,.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--ink-3)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:72px}
.nav-logo{font-size:24px;display:flex;align-items:center;gap:10px}
.nav-logo .mark{width:28px;height:28px}
.nav-links{display:flex;gap:28px;align-items:center}
.nav-links a{font-family:"Spectral",serif;font-size:16px;color:var(--muted);transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:var(--paper)}
.nav-cta{border:1px solid var(--brass);color:var(--brass);padding:9px 18px;border-radius:var(--r);font-size:15px}
.nav-cta:hover{background:var(--brass);color:var(--ink)}
.nav-burger{display:none;background:none;border:0;color:var(--paper);font-size:26px;cursor:pointer}

/* hero */
.hero{position:relative;padding:120px 0 90px;overflow:hidden}
.hero h1{font-size:clamp(40px,7vw,78px);margin:0 0 20px;max-width:14ch}
.hero p.lead{font-size:clamp(18px,2.4vw,23px);color:var(--muted);max-width:52ch;margin:0 0 36px}
.hero-stats{display:flex;gap:48px;flex-wrap:wrap;margin-top:56px}
.hero-stats .s b{font-family:"Fraunces",serif;font-size:40px;color:var(--brass);display:block;line-height:1}
.hero-stats .s span{color:var(--muted);font-size:15px}
.hero-glow{position:absolute;right:-10%;top:-20%;width:60%;height:140%;background:radial-gradient(ellipse at center,rgba(198,154,83,.14),transparent 62%);pointer-events:none}

.btn{display:inline-block;background:var(--brass);color:var(--ink);padding:14px 28px;border-radius:var(--r);font-family:"Spectral",serif;font-size:16px;border:0;cursor:pointer;transition:transform .15s}
.btn:hover{transform:translateY(-2px)}
.btn-ghost{background:transparent;border:1px solid var(--ink-3);color:var(--paper)}

/* sections */
section{padding:84px 0}
.eyebrow{color:var(--brass);font-family:"Spectral",serif;font-size:15px;margin:0 0 14px}
.s-head{font-size:clamp(28px,4vw,44px);margin:0 0 18px;max-width:20ch}
.s-sub{color:var(--muted);max-width:56ch;margin:0 0 44px}

.grid{display:grid;gap:28px}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-2{grid-template-columns:repeat(2,1fr)}
.card{background:var(--ink-2);border:1px solid var(--ink-3);border-radius:var(--r);padding:30px}
.card h3{font-size:22px;margin:0 0 10px}
.card p{color:var(--muted);font-size:16px;margin:0}

.panel{background:var(--ink-2);border:1px solid var(--ink-3);border-radius:var(--r);overflow:hidden}

/* footer */
footer{border-top:1px solid var(--ink-3);padding:56px 0 40px;color:var(--muted);font-size:15px}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;margin-bottom:40px}
.foot-grid h4{color:var(--paper);font-family:"Spectral",serif;font-size:16px;margin:0 0 14px}
.foot-grid a{display:block;color:var(--muted);margin-bottom:8px}
.foot-grid a:hover{color:var(--paper)}
.foot-bot{border-top:1px solid var(--ink-3);padding-top:24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:14px}

@media(max-width:860px){
  .nav-links{display:none}
  .nav-burger{display:block}
  .g-3,.g-2,.foot-grid{grid-template-columns:1fr}
  .hero-stats{gap:28px}
}

/* mobile menu */
.mobile-menu{display:none;flex-direction:column;background:var(--ink-2);border-bottom:1px solid var(--ink-3)}
.mobile-menu a{padding:14px 24px;color:var(--muted);border-top:1px solid var(--ink-3)}
body.menu-open .mobile-menu{display:flex}

/* progress / cameras */
.cam-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.cam{background:#000;border:1px solid var(--ink-3);border-radius:var(--r);overflow:hidden;position:relative;aspect-ratio:16/9}
.cam .ph{width:100%;height:100%;object-fit:cover;opacity:.85}
.cam .live{position:absolute;top:12px;left:12px;background:rgba(0,0,0,.6);color:#fff;font-family:"Spectral",serif;font-size:13px;padding:4px 10px;border-radius:3px;display:flex;align-items:center;gap:7px}
.cam .live::before{content:"";width:8px;height:8px;border-radius:50%;background:#e5533c;box-shadow:0 0 0 0 rgba(229,83,60,.6);animation:pulse 1.8s infinite}
.cam .cap{position:absolute;bottom:0;left:0;right:0;padding:10px 12px;background:linear-gradient(transparent,rgba(0,0,0,.8));font-size:14px}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(229,83,60,.6)}70%{box-shadow:0 0 0 7px rgba(229,83,60,0)}100%{box-shadow:0 0 0 0 rgba(229,83,60,0)}}

/* timeline */
.tl{border-left:2px solid var(--ink-3);margin-left:8px;padding-left:28px}
.tl .it{position:relative;padding-bottom:34px}
.tl .it::before{content:"";position:absolute;left:-36px;top:4px;width:14px;height:14px;border-radius:50%;background:var(--ink);border:2px solid var(--brass)}
.tl .it.done::before{background:var(--brass)}
.tl .it h4{margin:0 0 4px;font-family:"Spectral",serif;font-size:18px}
.tl .it span{color:var(--brass);font-size:14px}
.tl .it p{color:var(--muted);font-size:15px;margin:6px 0 0}

/* plans */
.plan{background:var(--ink-2);border:1px solid var(--ink-3);border-radius:var(--r);padding:24px;text-align:center}
.plan svg{margin:0 auto 16px}
.plan .area{font-family:"Fraunces",serif;font-size:30px;color:var(--brass)}
.plan .rooms{font-size:16px;margin:4px 0 2px}
.plan .price{color:var(--muted);font-size:15px}

/* table */
.tbl{width:100%;border-collapse:collapse;font-size:16px}
.tbl th,.tbl td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--ink-3)}
.tbl th{color:var(--muted);font-family:"Spectral",serif;font-weight:400;font-size:14px}

/* form */
.form{display:grid;gap:16px;max-width:460px}
.form input,.form textarea{background:var(--ink);border:1px solid var(--ink-3);border-radius:var(--r);color:var(--paper);padding:14px 16px;font-family:"Spectral",serif;font-size:16px}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--brass)}
.contact-split{display:grid;grid-template-columns:1fr 1fr;gap:56px}
@media(max-width:860px){.cam-grid,.contact-split{grid-template-columns:1fr}}
