/* База */
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:"Inter",sans-serif;background:#f9f6f1;color:#222;line-height:1.6;transition:background .4s,color .4s}
body.dark{background:#111;color:#eee}
canvas#bg{position:fixed;top:0;left:0;z-index:-1}

/* Шапка */
header{
  display:flex;justify-content:space-between;align-items:center;
  padding:1rem 2rem;background:rgba(255,255,255,.8);backdrop-filter:blur(10px);
  position:sticky;top:0;z-index:10;border-bottom:1px solid rgba(0,0,0,.06)
}
body.dark header{background:rgba(20,20,20,.8);border-bottom:1px solid rgba(255,255,255,.08)}
header .logo{font-family:"Playfair Display",serif;font-size:1.5rem;font-weight:700}
header nav a{margin:0 1rem;text-decoration:none;color:inherit;transition:color .3s}
header nav a:hover{color:#c59d5f}
#themeToggle{background:none;border:none;font-size:1.2rem;cursor:pointer}

/* Быстрые контакты в шапке */
.quick-contacts{display:flex;gap:.8rem;align-items:center;margin-right:.8rem}
.quick-contacts .qc{color:inherit;text-decoration:none;padding:.35rem .7rem;border-radius:999px;border:1px solid rgba(0,0,0,.08)}
.quick-contacts .qc:hover{color:#c59d5f;border-color:#c59d5f}
body.dark .quick-contacts .qc{border-color:rgba(255,255,255,.12)}
body.dark .quick-contacts .qc:hover{border-color:#c59d5f}

/* Hero */
.hero{text-align:center;padding:6rem 2rem}
.hero h1{font-family:"Playfair Display",serif;font-size:3rem}
.hero p{margin:1rem 0}
.btn{
  display:inline-block;padding:.8rem 1.6rem;background:#c59d5f;color:#fff;border-radius:30px;text-decoration:none;transition:background .3s,opacity .3s
}
.btn:hover{background:#a87c43}
.btn-ghost{background:rgba(197,157,95,.1);color:#a87c43;border:1px solid rgba(197,157,95,.4)}
.btn-ghost:hover{background:rgba(197,157,95,.18)}
.btn.disabled{opacity:.55;pointer-events:none}

/* Sections */
section{padding:4rem 2rem;max-width:1000px;margin:auto}
h2{font-family:"Playfair Display",serif;text-align:center;margin-bottom:2rem}

/* О компании (визитка) */
.about-visitka p{margin-bottom:14px}
.badges{margin-top:14px;display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.badges span{
  background:rgba(255,255,255,.8);border:1px solid rgba(0,0,0,.08);
  padding:6px 14px;border-radius:20px;font-size:14px;font-weight:600;color:#9a7c2f;
  box-shadow:0 2px 8px rgba(0,0,0,.08)
}
body.dark .badges span{background:rgba(40,40,40,.8);border-color:rgba(255,255,255,.1);color:#d4af37}

/* Проекты */
.project-card{
  margin:2rem auto;border-radius:16px;overflow:hidden;max-width:900px;
  box-shadow:0 6px 20px rgba(0,0,0,.1);transition:transform .3s, box-shadow .3s;position:relative
}
.project-card img{width:100%;display:block}
.project-card:hover{transform:translateY(-5px);box-shadow:0 12px 30px rgba(0,0,0,.2)}
.project-info{padding:1.5rem;background:#fff}
body.dark .project-info{background:#222}
.project-actions{margin-top:12px}
.badge-current{
  position:absolute;left:16px;top:16px;background:#c59d5f;color:#111;padding:.4rem .7rem;border-radius:999px;font-weight:700;font-size:.85rem;box-shadow:0 6px 16px rgba(0,0,0,.25)
}
.current-type{outline:2px solid rgba(197,157,95,.55)}

/* Мини-прайс */
.mini-pricing{
  margin-top:10px;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;color:#333
}
.mini-pricing>div{
  padding:6px 10px;border:1px dashed rgba(0,0,0,.2);border-radius:10px;background:rgba(0,0,0,.035)
}
body.dark .mini-pricing{color:#eee}
body.dark .mini-pricing>div{border-color:rgba(255,255,255,.2);background:rgba(255,255,255,.05)}

/* Наши услуги — сетка */
.services{overflow:visible}
.services .svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:14px}
.svc-card{
  position:relative; z-index:1;
  background:rgba(255,255,255,.8);border:1px solid rgba(0,0,0,.08);
  border-radius:16px;overflow:visible;box-shadow:0 6px 20px rgba(0,0,0,.08)
}
body.dark .svc-card{background:rgba(40,40,40,.8);border-color:rgba(255,255,255,.1)}
.svc-head{display:flex;align-items:center;justify-content:space-between;padding:14px 14px}
.svc-title{display:flex;flex-direction:column;gap:4px}
.svc-name{font-weight:700}
.svc-price{color:#c59d5f;font-weight:700}
.svc-toggle{
  border:1px solid rgba(0,0,0,.12);background:rgba(197,157,95,.08);color:#a87c43;
  border-radius:10px;padding:8px 10px;cursor:pointer;display:flex;align-items:center;gap:8px;transition:background .25s,border-color .25s
}
.svc-toggle:hover{background:rgba(197,157,95,.14);border-color:rgba(197,157,95,.45)}
body.dark .svc-toggle{border-color:rgba(255,255,255,.15)}
.svc-toggle .chev{width:18px;height:18px;transition:transform .25s}
.svc-toggle[aria-expanded="true"] .chev{transform:rotate(180deg)}
/* Контент внутри карточки оставляем скрытым (источник данных для модалки) */
.svc-body{display:none}

/* Демо-примечание */
.demo-note{
  margin-top:60px;padding:40px 20px;background:rgba(0,0,0,.04);
  border-radius:14px;box-shadow:0 6px 28px rgba(0,0,0,.15);backdrop-filter:blur(8px)
}
body.dark .demo-note{background:rgba(255,255,255,.06)}
.demo-note__title{font-family:"Playfair Display",serif;font-size:28px;margin-bottom:16px;text-align:center;color:#9a7c2f}
.demo-note__text{font-size:16px;line-height:1.7}
.demo-note__for{font-weight:600;margin-bottom:12px;color:#c4a34b}

/* Footer */
footer{background:#111;color:#fff;text-align:center;padding:2rem;margin-top:4rem}
.footer-tel{color:#c59d5f;text-decoration:none}
.footer-tel:hover{color:#fff}

/* Reveal */
.reveal{opacity:0;transform:translateY(50px);transition:opacity .8s ease, transform .8s ease}
.reveal.visible{opacity:1;transform:translateY(0)}

/* ====== ГЛОБАЛЬНЫЙ ОВЕРЛЕЙ ДЛЯ "ПОДРОБНЕЕ" ====== */
body.ovl-open{overflow:hidden} /* блокируем скролл страницы */
.svc-overlay{
  position:fixed; inset:0; z-index:9999;
  display:none; /* включаем display:block из JS при открытии */
}
.svc-overlay__backdrop{
  position:absolute; inset:0;
  background:rgba(0,0,0,.45);
  backdrop-filter: blur(3px);
  opacity:0; transition:opacity .18s ease;
}
.svc-overlay__panel{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%) translateY(12px);
  width:min(860px, 92vw); max-height:min(82vh, 880px);
  background:#fff; color:#222; border-radius:16px;
  box-shadow:0 30px 80px rgba(0,0,0,.35), 0 0 0 1px rgba(0,0,0,.06) inset;
  overflow:auto; padding:18px 18px 16px 18px;
  opacity:0; transition:opacity .22s ease, transform .22s ease;
}
body.dark .svc-overlay__panel{ background:#222; color:#eee; box-shadow:0 30px 80px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.08) inset; }
.svc-overlay__hdr{
  display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;
  position:sticky; top:0; background:inherit; padding-bottom:8px;
}
.svc-overlay__title{font-weight:800}
.svc-overlay__close{
  border:1px solid rgba(0,0,0,.12); background:transparent; color:inherit;
  border-radius:10px; padding:8px 10px; cursor:pointer;
}
body.dark .svc-overlay__close{border-color:rgba(255,255,255,.18)}

/* Состояние открыто */
.svc-overlay.is-open{display:block}
.svc-overlay.is-open .svc-overlay__backdrop{opacity:1}
.svc-overlay.is-open .svc-overlay__panel{opacity:1; transform:translate(-50%,-50%)}

/* Адаптив */
@media (max-width:960px){
  .services .svc-grid{grid-template-columns:1fr}
}
@media (max-width:620px){
  header{padding:.8rem 1rem}
  .quick-contacts{display:none}
  .hero h1{font-size:2.2rem}
}