:root{
  --bg:#f6f8fc; --panel:#ffffff; --text:#101318; --muted:#5b6472; --brand:#ff9a1a;
  --nav:#0f151d; --nav-fg:#dbe2ea; --nav-fg2:#ffffff; --link:#1d4ed8;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1200px;margin:0 auto;padding:0 16px}
.page{padding-top:6px}
/* Header / nav */
.header{position:sticky;top:0;z-index:1200;background:var(--nav);border-bottom:1px solid #0008;color:var(--nav-fg)}
.header .row{max-width:1200px;margin:0 auto;padding:10px 16px;display:flex;gap:18px;align-items:center}
.brand{display:flex;gap:10px;align-items:center;color:#fff;text-decoration:none}
.brand img{width:34px;height:34px;object-fit:contain;border-radius:6px}
.brand .title{line-height:1}
.brand .subtitle{font-size:12px;color:#9fb0c8}
.nav{margin-left:auto;display:flex;gap:18px;align-items:center;height:46px}
.nav > a,.nav .has-sub > a{display:inline-flex;align-items:center;justify-content:center;height:46px;padding:0 12px;color:#cfd6e4;border-bottom:3px solid transparent;font-weight:500;transition:border-color .18s,color .18s}
.nav > a:hover,.nav .has-sub:hover > a{color:#fff;border-bottom-color:var(--brand)}
.nav > a.active,.nav .has-sub.active > a{color:#fff;border-bottom-color:var(--brand)}
.has-sub{position:relative}
.sub{position:absolute;left:0;top:46px;min-width:220px;background:#0f151d;border:1px solid #ffffff22;border-radius:12px;padding:10px 0;box-shadow:0 18px 48px #0007;display:none}
.has-sub:hover .sub{display:block}
.sub a{display:block;color:#e7ecf3;padding:10px 16px;border-bottom:none;height:auto}
.sub a:hover{background:#151d29;color:#fff}

/* Hero */
.hero{position:relative;border-radius:16px;overflow:hidden;background:#e8eef6;box-shadow:0 6px 30px #0001}
.hero img{width:100%;height:420px;object-fit:cover;display:block}
.hero .cap{position:absolute;left:24px;bottom:24px;background:linear-gradient(#0000,#000000bb);color:#fff;padding:16px 20px;border-radius:12px;max-width:680px}
.hero .cap h1{margin:0 0 6px}
.hero .badge{display:inline-block;background:#0008;color:#fff;padding:4px 10px;border-radius:999px;font-size:12px}

/* layout */
.main-grid{display:grid;grid-template-columns:1fr 340px;gap:16px;margin-top:16px}
@media (max-width: 1024px){ .main-grid{grid-template-columns:1fr} }
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.card{background:var(--panel);border-radius:14px;padding:16px;box-shadow:0 2px 16px #0001}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.gallery a{display:block}
.gallery img{width:100%;height:140px;object-fit:cover;border-radius:12px}

/* Footer */
.footer{margin-top:40px;background:#e9edf4;border-top:1px solid #0001}
.footer .cols{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.footer a{color:#1d4ed8}
.footer .note{color:#556}

/* Forms / modal */
form .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:640px){form .row{grid-template-columns:1fr}}
input,textarea{width:100%;padding:12px;border-radius:10px;border:1px solid #cbd5e1;background:#fff}
textarea{min-height:140px;resize:vertical}
button{background:var(--brand);color:#000;border:0;padding:12px 16px;border-radius:12px;cursor:pointer;font-weight:700}
.note{color:#556;font-size:14px}
.modal{position:fixed;inset:0;background:#0b1220cc;display:flex;align-items:center;justify-content:center;z-index:2000;backdrop-filter:blur(2px)}
.modal.hidden{display:none}
.modal__box{
  background:#fff;
  color:#111;
  /* 👉 Ограничение по ширине */
  max-width:520px;          /* максимум по ширине в пикселях */
  width:min(520px, 96vw);   /* адаптив: не шире 96% ширины окна */

  /* 👉 Ограничение по высоте */
  max-height:80vh;          /* не выше 80% высоты окна */
  overflow:auto;            /* если контента много — прокрутка внутри модалки */

  border-radius:16px;       /* красивые скругления (можно подправить под дизайн) */
  box-shadow:0 20px 60px #0006;
  padding:24px 24px 20px;
  position:relative;
}

.modal__close{position:absolute;right:10px;top:8px;border:0;background:#0000;font-size:28px;line-height:1;cursor:pointer;color:#667}
.modal__close:hover{color:#000}
.modal__content{white-space:pre-line;text-align:center;font-size:16px}

.news-block {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 20px;
  margin-bottom: 25px;
  background: #fafafa;
  border-radius: 12px;
  padding: 12px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}

.news-left img {
  width: 220px;
  height: 150px;
  object-fit: cover;
  border-radius: 10px;
  flex-shrink: 0;
}

.news-right {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: #333;
  font-size: 15px;
  line-height: 1.5;
}

.news-right p {
  margin: 0;
}



/* unified wrap widths */
.wrap, .wrap.wide, .wrap-wide, main.wrap, main.wrap.wide{
  max-width: 1200px;
  margin: 0 auto;
  padding-left: 16px;
  padding-right: 16px;
  box-sizing: border-box;
}

/* Floating contact button */
.contact-fab{
  position:fixed;
  right:20px;
  bottom:90px;
  width:52px;
  height:52px;
  border-radius:50%;
  border:none;
  background:#111827;
  color:#f9fafb;
  box-shadow:0 10px 30px rgba(0,0,0,.35);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:2100;
}
.contact-fab__icon{font-size:22px;line-height:1;}
.contact-fab:hover{background:#ff9a1a;}

.grecaptcha-badge{visibility:hidden !important;}

/* Заголовки правых блоков (Новости, Галерея) */
.side-title{
  font-size:16px;
  font-weight:600;
  margin-bottom:8px;
}


/* Нижний блок на главной (index-bottom) */
.bottom-block-list{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.bottom-item{
  display:flex;
  gap:16px;
  align-items:flex-start;
}

.bottom-item-left img{
  width:220px;
  height:140px;
  object-fit:cover;
  border-radius:8px;
  display:block;
}

.bottom-item-right{
  flex:1;
}

@media (max-width:768px){
  .bottom-item{
    flex-direction:column;
  }
  .bottom-item-left img{
    width:100%;
    height:auto;
  }
}

/* Service/Standard subpages: two-column blocks with image + text */
.gallery.gallery-blocks {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin-top: 32px;
}

.service-block {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  background: #ffffff;
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06);
}

.service-block__img img {
  width: 200px;
  height: 150px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}

.service-block__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.service-block__title {
  font-weight: 600;
  font-size: 16px;
}

.service-block__desc {
  font-size: 14px;
  line-height: 1.5;
  color: #6b7280;
}

@media (max-width: 900px) {
  .gallery.gallery-blocks {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .service-block {
    flex-direction: column;
  }
  .service-block__img img {
    width: 100%;
    height: auto;
  }
  .service-block {
    padding: 12px;
    gap: 12px;
  }
  .service-block__title {
    font-size: 15px;
  }
  .service-block__desc {
    font-size: 13px;
  }
}

/* MatriAxe: extra mobile adaptations */
@media (max-width: 768px) {
  .header .row {
    flex-wrap: wrap;
    gap: 10px;
  }
  .nav {
    margin-left: 0;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 14px;
    height: auto;
    padding-bottom: 4px;
  }
}

@media (max-width: 600px) {
  .hero img {
    height: 260px;
  }
  .footer .cols {
    grid-template-columns: 1fr;
  }
  .news-block {
    flex-direction: column;
  }
  .news-left img {
    width: 100%;
    height: auto;
  }
}
/* MatriAxe – уменьшенный H1 на подстраницах услуг */
.h1-small {
    font-size: 16px;
    line-height: 1.3;
    font-weight: 600;
    margin: 0 0 12px 0;
    color: var(--text);
}