
:root{
  --bg:#F7FAFD;
  --panel:#FFFFFF;
  --soft:#FFFFFF;
  --text:#0B1220;
  --muted:#475569;
  --line:rgba(11,18,32,.14);
  --glass:rgba(255,255,255,.78);
  --accent:#5B6CFF;
  --accent2:#14C98A;

  --radius:10px;
  --radius2:10px;
  --shadow: 0 20px 60px rgba(11,18,32,.14);
  --shadow2: 0 14px 40px rgba(11,18,32,.12);

  --container: 1160px;
}

*{box-sizing:border-box}
html,body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Liberation Sans", sans-serif;
  background:
    radial-gradient(900px 600px at 10% -10%, rgba(91,108,255,.22), transparent 55%),
    radial-gradient(700px 500px at 90% 0%, rgba(20,201,138,.14), transparent 55%),
    var(--bg);
  color:var(--text);
  line-height:1.45;
  -webkit-hyphens: none;
  hyphens: none;
  word-break: normal;
  overflow-wrap: normal;
}

a{color:inherit; text-decoration:none}
strong{font-weight:650}
img{max-width:100%; display:block}

.skip{
  position:absolute; left:-999px; top:0;
  padding:10px 12px; background:#fff; color:#000;
}
.skip:focus{left:12px; top:12px; z-index:9999; border-radius:10px}

.container{
  width:min(var(--container), calc(100% - 40px));
  margin-inline:auto;
}

.h1{font-size: clamp(30px, 4.4vw, 54px); line-height:1.05; letter-spacing:-.02em; margin: 12px 0 12px}
.h2{font-size: clamp(24px, 3vw, 36px); line-height:1.1; letter-spacing:-.02em; margin:0}
.h3{font-size: 20px; line-height:1.2; margin:0}
.h4{font-size: 16px; letter-spacing:-.01em; margin:0 0 8px}

.muted{color:var(--muted)}
.lead{font-size: 16px; color: rgba(11,18,32,.78); margin:0}
.kicker{
  display:inline-flex; gap:10px; align-items:center;
  color: rgba(11,18,32,.84);
  font-weight:700;
  letter-spacing:.02em;
  text-transform:uppercase;
  font-size:12px;
  padding:8px 12px;
  border:1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255,255,255,.82);
}

.badge{
  display:inline-flex;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255,255,255,.78);
  color: rgba(11,18,32,.86);
  font-size: 13px;
  font-weight:700;
}


.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border-radius: var(--radius);
  border:1px solid var(--line);
  padding: 12px 16px;
  font-weight:650;
  letter-spacing:-.01em;
  background: rgba(255,255,255,.86);
  color: var(--text);
  cursor:pointer;
  transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
  user-select:none;
}
.btn:hover{transform: translateY(-1px); border-color: rgba(11,18,32,.22); background: rgba(255,255,255,.98)}
.btn:active{transform: translateY(0px)}
.btn--primary{
  border-color: rgba(91,108,255,.55);
  background: linear-gradient(135deg, rgba(91,108,255,.96), rgba(20,201,138,.38));
  box-shadow: 0 12px 34px rgba(91,108,255,.18);
  color: #FFFFFF;
}
.btn--primary:hover{box-shadow: 0 16px 44px rgba(91,108,255,.22)}
.btn--ghost{background: rgba(255,255,255,.02)}
.btn--lg{padding: 14px 18px; font-size: 14px}
.btn--full{width:100%}

.chip{
  display:inline-flex;
  align-items:center;
  padding:10px 12px;
  border-radius: var(--radius);
  border:1px solid var(--line);
  background: rgba(255,255,255,.78);
  font-weight:750;
}


.header{
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: blur(14px);
  background: rgba(7,10,15,.55);
  border-bottom: 1px solid var(--line);
}
.header__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding: 14px 0;
}
.brand{display:flex; align-items:center; gap:12px; min-width: 220px}
.brand__mark{
  width:40px; height:40px;
  border-radius: var(--radius);
  display:grid; place-items:center;
  font-weight:800;
  background: linear-gradient(135deg, rgba(124,92,255,.95), rgba(49,214,163,.42));
  box-shadow: 0 12px 30px rgba(124,92,255,.22);
}
.brand__title{font-weight:750; letter-spacing:-.02em}
.brand__subtitle{display:block; font-size:12px; color: var(--muted); margin-top:2px; white-space:nowrap}

.header__actions{
  display:flex; align-items:center; gap:10px;
}
.nav{display:flex; align-items:center; gap:10px}
.nav__panel{display:flex; align-items:center; gap:18px}
.nav__link{
  color: rgba(233,237,247,.92);
  font-weight:600;
  font-size:13px;
  padding:10px 10px;
  border-radius: var(--radius);
  transition: background .18s ease, color .18s ease;
}
.nav__link:hover{background: rgba(11,18,32,.04); color: var(--text)}
.nav__toggle{
  display:none;
  width:44px; height:44px;
  border-radius: var(--radius);
  border:1px solid var(--line);
  background: rgba(255,255,255,.82);
  cursor:pointer;
}
.nav__toggle span{
  display:block;
  width:18px; height:2px;
  background: rgba(233,237,247,.9);
  margin: 4px auto;
  border-radius: var(--radius);
}

.hero{
  position:relative;
  min-height: 92vh;
  display:flex;
  align-items:stretch;
  overflow:hidden;
  border-bottom: 1px solid var(--line);
}
.hero__bg{position:absolute; inset:0; z-index:0}
.hero__video{
  width:100%; height:100%;
  object-fit: cover;
  filter: saturate(1.10) contrast(1.04) brightness(.96);
  transform: scale(1.02);
}
.hero__overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(900px 500px at 18% 18%, rgba(91,108,255,.26), transparent 62%),
    radial-gradient(900px 500px at 80% 10%, rgba(20,201,138,.18), transparent 62%),
    linear-gradient(180deg, rgba(11,18,32,.30), rgba(11,18,32,.55) 42%, rgba(11,18,32,.72));
}

.hero__inner{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 28px;
  padding: 64px 0 40px;
}
.hero__copy{padding-top: 6px}
.hero__badges{display:flex; gap:10px; flex-wrap:wrap; margin: 18px 0 18px}
.hero__cta{display:flex; gap:12px; flex-wrap:wrap; margin: 22px 0 18px}
.hero__mini{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 18px;
}
.mini{
  border:1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255,255,255,.86);
  padding: 12px 14px;
}
.mini__label{font-weight:700; letter-spacing:-.01em}
.mini__value{font-size: 18px; font-weight:800; margin-top:4px}
.mini__note{font-size: 12px; color: var(--muted); margin-top:2px}

.card{
  border-radius: var(--radius2);
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.86);
    backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
box-shadow: var(--shadow2);
}
.card--glass{
  background: var(--glass);
  backdrop-filter: blur(16px);
}
.card--soft{
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
  box-shadow: none;
}
.card__head{padding: 18px 18px 0}
.form{padding: 14px 18px 18px}
.form__row{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 12px;
}
.field{display:block}
.field__label{
  display:block;
  font-size:12px;
  font-weight:650;
  color: rgba(15,23,42,.78);
  margin-bottom: 6px;
}
.field__control{
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  width:100%;
  height:  46px;
  padding: 12px 14px;
  border-radius: var(--radius);
  border:1px solid rgba(11,18,32,.16);
  background: rgba(255,255,255,.92);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65), 0 1px 0 rgba(11,18,32,.03);
  color: var(--text);
  outline:none;
  transition: border-color .18s ease, box-shadow .18s ease;
}
.field__control:focus{border-color: rgba(91,108,255,.75); box-shadow: 0 0 0 4px rgba(91,108,255,.14), inset 0 1px 0 rgba(255,255,255,.65);}
.field__control--textarea{min-height: 92px; resize: vertical}
.form__actions{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 10px;
}
.form__note{
  margin: 10px 0 0;
  color: rgba(86,97,117,.92);
  font-size:12px;
}
.form__status{
  margin-top: 12px;
  font-size: 13px;
  color: rgba(11,18,32,.86);
}

.hero__card{align-self:start}
.hero__bottom{
  position:absolute;
  left:0; right:0; bottom:0;
  z-index:1;
  background: linear-gradient(180deg, transparent, rgba(11,18,32,.62));
}
.hero__metrics{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  padding: 18px 0 18px;
}
.metric{
  border:1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255,255,255,.86);
  padding: 12px 14px;
}
.metric__value{font-weight:900; font-size: 18px}
.metric__label{font-size: 12px; color: var(--muted); margin-top:4px}

.section{
  padding: 64px 0;
}
.section--alt{
  background:
    radial-gradient(700px 480px at 30% 0%, rgba(91,108,255,.10), transparent 62%),
    radial-gradient(700px 480px at 75% 10%, rgba(20,201,138,.08), transparent 62%);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.section__head{display:flex; align-items:flex-end; justify-content:space-between; gap: 18px; margin-bottom: 18px}
.section__head p{max-width: 560px; margin:0}

.grid{display:grid; gap: 14px}
.grid--2{grid-template-columns: 1fr 1fr}
.grid--3{grid-template-columns: 1fr 1fr 1fr}

.equip{
  display:grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 14px;
  border:1px solid var(--line);
  border-radius: var(--radius2);
  background: rgba(255,255,255,.86);
  overflow:hidden;
}
.equip__media{
  position:relative;
  aspect-ratio: 16 / 9;
  min-height: 220px;
  background: rgba(255,255,255,.82);
}
.equip__mediaFrame{
  position:absolute; inset:0;
  background-size: cover;
  background-position: center;
  filter: saturate(1.06) contrast(1.03) brightness(.98);
  transform: scale(1.02);
}
.equip__media::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(11,18,32,.08), rgba(11,18,32,.48));
}
.equip__tag{
  position:absolute; left:14px; top:14px; z-index:2;
  padding: 8px 10px;
  border-radius: var(--radius);
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.18);
  font-size:12px;
  font-weight:650;
}
.equip__body{padding: 16px 16px}
.equip__price{margin: 8px 0 12px; color: var(--text)}
.equip__cta{display:flex; gap:10px; flex-wrap:wrap; margin-top: 12px}

.spec{list-style:none; padding:0; margin:0; display:grid; gap: 8px}
.spec li{
  display:flex; align-items:center; justify-content:space-between; gap: 10px;
  padding: 10px 12px;
  border:1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255,255,255,.82);
}
.spec span{color: var(--muted); font-size: 12px}
.spec b{font-weight:800}

.noteBar{
  margin-top: 16px;
  border:1px solid var(--line);
  border-radius: var(--radius2);
  background: rgba(255,255,255,.86);
  padding: 16px;
  display:flex; align-items:center; justify-content:space-between; gap: 12px;
}
.noteBar__title{font-weight:800}
.noteBar__text{color: var(--muted); flex:1}
.noteBar__action{font-weight:750; color: rgba(11,18,32,.88); text-decoration: underline; text-underline-offset: 3px}

.steps{
  margin-top: 18px;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.step{
  border:1px solid var(--line);
  border-radius: var(--radius2);
  background: rgba(255,255,255,.82);
  padding: 14px 14px;
  display:flex; gap: 12px;
}
.step__num{
  width:44px; height:44px;
  border-radius: var(--radius);
  display:grid; place-items:center;
  font-weight:900;
  background: rgba(124,92,255,.18);
  border:1px solid rgba(124,92,255,.25);
}
.step__title{font-weight:800}
.step__text{color: var(--muted); font-size: 13px; margin-top:4px}

.geo{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.geo__card{
  border:1px solid var(--line);
  border-radius: var(--radius2);
  background: rgba(255,255,255,.86);
  padding: 16px;
}
.list{margin: 10px 0 0; padding-left: 18px; color: var(--muted)}
.list li{margin: 6px 0}
.geo__cta{
  grid-column: 1 / -1;
  border-radius: var(--radius2);
  border:1px solid var(--line);
  background: linear-gradient(135deg, rgba(124,92,255,.16), rgba(49,214,163,.08));
  padding: 16px;
}
.geo__ctaInner{
  display:flex; align-items:center; justify-content:space-between; gap: 12px;
}
.geo__ctaTitle{font-weight:900; font-size: 18px}

.gallery{
  column-count: 3;
  column-gap: 14px;
}
.gallery__item{
  break-inside: avoid;
  margin: 0 0 14px;
  border-radius: var(--radius2);
  overflow:hidden;
  border:1px solid var(--line);
  background: rgba(255,255,255,.82);
  box-shadow: var(--shadow2);
  cursor: zoom-in;
  position:relative;
}
.gallery__item::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, transparent, rgba(11,18,32,.26));
  opacity:0;
  transition: opacity .18s ease;
}
.gallery__item:hover::after{opacity:1}
.gallery__img{width:100%; height:auto; display:block; filter: saturate(1.05) contrast(1.03) brightness(.96)}
.gallery__cap{
  position:absolute; left:12px; right:12px; bottom:10px;
  font-size:12px;
  color: rgba(11,18,32,.86);
  opacity:0;
  transform: translateY(6px);
  transition: opacity .18s ease, transform .18s ease;
  z-index:1;
}
.gallery__item:hover .gallery__cap{opacity:1; transform: translateY(0)}

.faq{display:grid; gap: 10px}
.faq__item{
  border:1px solid var(--line);
  border-radius: var(--radius2);
  background: rgba(255,255,255,.86);
  padding: 14px 14px;
}
.faq__item summary{
  cursor:pointer;
  font-weight:750;
  list-style:none;
}
.faq__item summary::-webkit-details-marker{display:none}
.faq__body{margin-top: 10px; color: var(--muted)}

.contactGrid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.kv{display:grid; grid-template-columns: 190px 1fr; gap: 10px; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.06)}
.kv:last-child{border-bottom:none}
.kv__k{color: var(--muted); font-size: 13px}
.kv__v a{text-decoration: underline; text-underline-offset: 3px}
.contactActions{display:flex; gap: 10px; flex-wrap:wrap; margin-top: 14px}

.footerCta{
  margin-top: 18px;
  border-radius: var(--radius2);
  border:1px solid var(--line);
  background: linear-gradient(135deg, rgba(124,92,255,.22), rgba(49,214,163,.10));
  padding: 18px;
}
.footerCta__inner{display:flex; align-items:center; justify-content:space-between; gap: 12px}
.footerCta__title{font-weight:900; font-size: 18px}

.footer{
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}
.footer__row{
  display:flex; align-items:center; justify-content:space-between; gap: 12px;
  padding-bottom: 18px;
}
.footer__brand{font-weight:850}
.footer__meta{font-size: 12px}
.footer__right{display:flex; gap: 14px; flex-wrap:wrap}
.footer__link{color: rgba(11,18,32,.78); font-weight:650}
.footer__link:hover{text-decoration: underline; text-underline-offset: 3px}

/* Lightbox */
.lightbox{
  position:fixed; inset:0;
  display:none;
  z-index: 80;
}
.lightbox.is-open{display:block}
.lightbox__backdrop{
  position:absolute; inset:0;
  background: rgba(11,18,32,.62);
  backdrop-filter: blur(10px);
}
.lightbox__dialog{
  position:relative;
  width:min(1100px, calc(100% - 24px));
  margin: 40px auto;
  border-radius: var(--radius2);
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.94);
  box-shadow: var(--shadow);
  overflow:hidden;
}
.lightbox__figure{margin:0}
.lightbox__img{width:100%; height: auto; display:block; max-height: calc(100vh - 170px); object-fit: contain}
.lightbox__cap{padding: 10px 14px}
.lightbox__close{
  position:absolute; right:10px; top:10px;
  width:44px; height:44px;
  border-radius: var(--radius);
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.86);
  color: var(--text);
  cursor:pointer;
}
.lightbox__nav{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width:46px; height:46px;
  border-radius: var(--radius);
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.86);
  color: var(--text);
  cursor:pointer;
  font-size: 28px;
  display:grid; place-items:center;
}
.lightbox__nav--prev{left:10px}
.lightbox__nav--next{right:10px}

/* Responsive */
@media (max-width: 980px){
  .header__actions .chip{display:none}
  .hero__inner{grid-template-columns: 1fr; padding-top: 44px}
  .hero__card{order: 2}
  .hero__metrics{grid-template-columns: 1fr}
  .grid--2{grid-template-columns: 1fr}
  .grid--3{grid-template-columns: 1fr}
  .equip{grid-template-columns: 1fr}
  .form__row{grid-template-columns: 1fr}
  .form__actions{grid-template-columns: 1fr}
  .steps{grid-template-columns: 1fr}
  .geo{grid-template-columns: 1fr}
  .contactGrid{grid-template-columns: 1fr}
  .gallery{column-count: 2}
  .nav__toggle{display:inline-block}
  .nav__panel{
    display:none;
    position:absolute;
    right: 20px;
    top: 64px;
    padding: 12px;
    border-radius: var(--radius);
    border:1px solid var(--line);
    background: rgba(255,255,255,.94);
    backdrop-filter: blur(16px);
    box-shadow: var(--shadow2);
    flex-direction:column;
    align-items:stretch;
    min-width: 220px;
  }
  .nav.is-open .nav__panel{display:flex}
  .nav__link{padding: 12px 12px}
}

@media (max-width: 560px){
  .gallery{column-count: 1}
  .header__actions .btn--ghost{display:none}
  .brand__subtitle{display:none}
}


/* Text wrapping (no forced переносы/переносы по слогам) */
h1,h2,h3,h4,p,li,summary{ -webkit-hyphens:none; hyphens:none; }
h1,h2,h3{ text-wrap: balance; }

.hero{ color:#F6F8FF; }
.hero .muted{ color: rgba(246,248,255,.78); }
.hero .lead{ color: rgba(246,248,255,.86); }
.hero .badge, .hero .kicker{ background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.22); color: rgba(246,248,255,.92); }

/* Spec tables */
.specTable{
  width:100%;
  border-collapse: separate;
  border-spacing: 0;
  margin-top: 12px;
  border:1px solid var(--line);
  border-radius: var(--radius);
  overflow:hidden;
  background: rgba(255,255,255,.82);
}
.specTable th,
.specTable td{
  padding: 10px 12px;
  font-size: 13px;
  text-align:left;
  vertical-align: top;
  border-bottom: 1px solid var(--line);
}
.specTable tr:last-child th,
.specTable tr:last-child td{ border-bottom: none; }
.specTable th{
  width: 46%;
  color: rgba(11,18,32,.78);
  font-weight: 750;
  background: rgba(11,18,32,.02);
}
.specTable td{
  font-weight: 650;
  color: rgba(11,18,32,.90);
}
.specTable--compact th,
.specTable--compact td{
  padding: 9px 10px;
  font-size: 12.5px;
}

/* Header: premium contrast on scroll */
.header.is-scrolled{
  background: rgba(255,255,255,.92);
  border-bottom: 1px solid rgba(11,18,32,.10);
}
.header.is-scrolled .nav__link{color: rgba(15,23,42,.88);}
.header.is-scrolled .nav__link:hover{background: rgba(11,18,32,.04); color: rgba(15,23,42,1);}
.header.is-scrolled .nav__toggle span{background: rgba(15,23,42,.9);}


/* Modal (lead) */
.modal{
  position: fixed;
  inset: 0;
  z-index: 200;
  display: none;
}
.modal.is-open{display:block;}
.modal__backdrop{
  position:absolute;
  inset:0;
  background: rgba(11,18,32,.56);
  backdrop-filter: blur(6px);
}
.modal__dialog{
  position: relative;
  width: min(680px, calc(100% - 28px));
  margin: 8vh auto 0;
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(11,18,32,.10);
  border-radius: var(--radius);
  box-shadow: 0 28px 80px rgba(11,18,32,.22);
  padding: 18px;
}
.modal__close{
  font-family: inherit;
  font-weight: 650;
  position:absolute;
  top: 10px;
  right: 10px;
  width: 38px;
  height: 38px;
  border-radius: var(--radius);
  border: 1px solid rgba(11,18,32,.10);
  background: rgba(255,255,255,.9);
  color: rgba(15,23,42,.82);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.modal__close:hover{
  background: rgba(11,18,32,.03);
  color: rgba(15,23,42,1);
}
.modal__header{padding: 6px 6px 12px;}
.modal__kicker{
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: rgba(91,108,255,.95);
}
.modal__title{margin: 8px 0 6px; font-size: 22px; letter-spacing: -.02em;}
.modal__subtitle{margin:0; color: rgba(15,23,42,.72); font-size: 14px; line-height: 1.5;}
.modal__grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 12px;
  padding: 6px;
}
@media (min-width: 680px){
  .modal__grid{grid-template-columns: 1fr 1fr 1fr;}
}
.modal__option{
  text-decoration:none;
  text-align:left;
  border-radius: var(--radius);
  border: 1px solid rgba(11,18,32,.12);
  background: rgba(255,255,255,.92);
  padding: 14px 14px;
  cursor:pointer;
  color: rgba(15,23,42,1);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.modal__option:hover{
  transform: translateY(-1px);
  border-color: rgba(91,108,255,.30);
  box-shadow: 0 18px 40px rgba(11,18,32,.10);
  background: rgba(255,255,255,1);
}
.modal__optionTitle{font-weight: 750; letter-spacing:-.01em;}
.modal__optionMeta{margin-top: 6px; color: rgba(15,23,42,.68); font-size: 13px; line-height: 1.35;}
.modal__note{padding: 6px 6px 2px; color: rgba(15,23,42,.58); font-size: 12px;}

html.is-modal-open, html.is-modal-open body{overflow:hidden;}


/* Modal typography normalization */
.modal__dialog, .modal__dialog *{
  font-family: inherit;
}
.modal__title{
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: rgba(15,23,42,1);
}
.modal__kicker{
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
}
.modal__subtitle{
  font-size: 14px;
  line-height: 1.55;
  color: rgba(15,23,42,.72);
}
.modal__option{
  font: inherit;
}
.modal__optionTitle{
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -0.01em;
}
.modal__optionMeta{
  font-size: 13px;
  line-height: 1.45;
}
button.modal__option{
  appearance: none;
  -webkit-appearance: none;
  background: rgba(255,255,255,.92);
}


/* === Premium tuning + hero spacing fixes (v7 overrides) === */

/* 1) Prevent hero metrics from overlapping the lead form */
.hero{
  padding-bottom: clamp(110px, 12vh, 170px);
}
.hero__inner{
  padding-bottom: clamp(120px, 14vh, 190px);
}
@media (max-width: 980px){
  .hero{
    padding-bottom: 220px;
  }
  .hero__inner{
    padding-bottom: 240px;
  }
}

/* Make the bottom metrics sit above content and be slightly smaller */
.hero__bottom{
  pointer-events: none;
}
.hero__metrics{
  pointer-events: auto;
  gap: 10px;
}
.metric{
  padding: 12px 14px;
}

/* 2) Premium palette: reduce “fireworks”, use one accent */
:root{
  --bg:#F7FAFD;
  --panel:#FFFFFF;
  --soft:#F3F6FF;
  --text:#0F172A;
  --muted:#475569;
  --line:rgba(15,23,42,.12);
  --accent:#4F46E5;       /* indigo */
  --accent2:#4F46E5;      /* keep same to avoid multi-color */
}

/* Background: subtle, not multi-radial */
body{
  background: radial-gradient(900px 520px at 15% -10%, rgba(79,70,229,.10), transparent 58%),
              #F7FAFD;
  color: var(--text);
}

/* Header: calmer, premium */
.header{
  background: rgba(255,255,255,.70);
  border-bottom: 1px solid rgba(15,23,42,.08);
}
.brand__mark{
  background: rgba(79,70,229,1);
  box-shadow: 0 12px 26px rgba(79,70,229,.18);
}

/* Hero overlay: remove colored bursts */
.hero__overlay{
  background:
    linear-gradient(180deg, rgba(15,23,42,.55), rgba(15,23,42,.64) 42%, rgba(15,23,42,.74));
}

/* Buttons: solid accent, not gradient */
.btn--primary{
  border-color: rgba(79,70,229,.55);
  background: rgba(79,70,229,1);
  box-shadow: 0 12px 28px rgba(79,70,229,.22);
  color: #FFFFFF;
}
.btn--primary:hover{
  box-shadow: 0 16px 34px rgba(79,70,229,.26);
}
.btn--ghost{
  background: rgba(255,255,255,.75);
  border-color: rgba(15,23,42,.12);
  color: rgba(15,23,42,.90);
}
.btn--ghost:hover{
  background: rgba(255,255,255,.92);
  border-color: rgba(15,23,42,.16);
}

/* Badges: neutral */
.badge{
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.18);
  color: rgba(255,255,255,.92);
}

/* Cards and blocks: unified premium whites */
.card, .equip, .geo__card, .noteBar, .metric, .step, .faq__item{
  background: rgba(255,255,255,.92);
  border-color: rgba(15,23,42,.10);
}
.card--glass{
  background: rgba(255,255,255,.86);
  border-color: rgba(255,255,255,.22);
}
.section--alt{
  background: rgba(79,70,229,.05);
  border-top: 1px solid rgba(15,23,42,.06);
  border-bottom: 1px solid rgba(15,23,42,.06);
}

/* Inputs: less contrast, premium surface */
.field__control{
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(15,23,42,.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75), 0 1px 0 rgba(15,23,42,.03);
  color: rgba(15,23,42,1);
}
.field__control::placeholder{color: rgba(71,85,105,.70)}
.field__label{color: rgba(15,23,42,.78)}
.field__control:focus{
  border-color: rgba(79,70,229,.60);
  box-shadow: 0 0 0 4px rgba(79,70,229,.14), inset 0 1px 0 rgba(255,255,255,.75);
}

/* Footer CTA: calm */
.footerCta{
  background: rgba(79,70,229,.06);
  border-color: rgba(15,23,42,.10);
}

/* Lightbox/modal surfaces remain consistent */
.lightbox__dialog{
  background: rgba(255,255,255,.96);
  border-color: rgba(15,23,42,.10);
}
.modal__dialog{
  background: rgba(255,255,255,.96);
  border-color: rgba(15,23,42,.10);
}


/* Hero lead card: ensure readable dark typography on light card */
.hero .card--glass{
  color: var(--text);
}
.hero .card--glass .muted{
  color: rgba(15,23,42,.72);
}
.hero .card--glass .field__label{
  color: rgba(15,23,42,.78);
}
.hero .card--glass .form__note{
  color: rgba(15,23,42,.58);
}
.hero .card--glass .form__status{
  color: rgba(15,23,42,.86);
}


/* === Hero contrast fix (v9) === */
.hero .hero__title{color: rgba(255,255,255,.96);}
.hero .hero__subtitle{color: rgba(255,255,255,.78);}
.hero .hero__pricing,
.hero .hero__pricing *{
  color: rgba(255,255,255,.90);
}
.hero .hero__pricing strong{color: rgba(255,255,255,.98); font-weight: 750;}
/* Metrics in hero should be glass-on-dark, not white cards */
.hero .metric{
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.18);
  color: rgba(255,255,255,.95);
  box-shadow: 0 18px 40px rgba(0,0,0,.18);
}
.hero .metric__label{color: rgba(255,255,255,.78);}
.hero .metric__value{color: rgba(255,255,255,.98);}


/* === Hero + header + equipment layout fixes (v10) === */

/* HERO pricing: dark text on light/glass surface */
.hero .hero__pricing,
.hero .hero__pricing *{
  color: rgba(15,23,42,.92) !important;
}
.hero .hero__pricing strong{
  color: rgba(15,23,42,1) !important;
}
.hero .hero__pricing{
  background: rgba(255,255,255,.62) !important;
  border: 1px solid rgba(15,23,42,.12) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 18px 44px rgba(15,23,42,.14);
}

/* If there are per-item chips inside pricing */
.hero .hero__pricing .badge,
.hero .hero__pricing .chip{
  background: rgba(15,23,42,.06) !important;
  border-color: rgba(15,23,42,.10) !important;
  color: rgba(15,23,42,.88) !important;
}

/* HEADER: dark by default (before scroll) */
.header .nav__link{
  color: rgba(15,23,42,.88) !important;
}
.header .nav__link:hover{
  background: rgba(15,23,42,.04) !important;
  color: rgba(15,23,42,1) !important;
}
.header .nav__toggle span{
  background: rgba(15,23,42,.90) !important;
}

/* EQUIPMENT cards: stack vertically (one under another) */
.equipGrid{
  grid-template-columns: 1fr !important;
}


/* === v11: hero mini + header subtitle + fleet cards layout === */

/* Header subtitle: dark on light header */
.brand__subtitle{
  color: rgba(15,23,42,.66) !important;
}

/* HERO mini pricing cards: dark text on light-glass surface */
.hero .mini{
  background: rgba(255,255,255,.62);
  border: 1px solid rgba(15,23,42,.12);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 18px 44px rgba(15,23,42,.14);
}
.hero .mini__label{color: rgba(15,23,42,.78) !important;}
.hero .mini__value{color: rgba(15,23,42,1) !important;}
.hero .mini__note{color: rgba(15,23,42,.64) !important;}

/* Fleet section: stack items and make cards horizontal */
#fleet .grid--2{
  grid-template-columns: 1fr !important;
}

/* Horizontal card layout on desktop */
#fleet .equip{
  display: grid;
  grid-template-columns: minmax(320px, 1.25fr) 1fr;
  gap: 18px;
  align-items: stretch;
}
#fleet .equip__media{
  min-height: 260px;
}
#fleet .equip__mediaFrame{
  aspect-ratio: 16 / 9;
}
#fleet .equip__body{
  padding-left: 6px;
}
@media (max-width: 980px){
  #fleet .equip{
    grid-template-columns: 1fr;
  }
  #fleet .equip__media{
    min-height: unset;
  }
}

/* Ensure spec table doesn't overflow on small widths */
.specTable{
  width: 100%;
  table-layout: fixed;
}
.specTable th{
  width: 58%;
}
.specTable td{
  width: 42%;
  overflow-wrap: anywhere;
}


/* === CTST brand logo === */
.brand__logo{
  height:40px;
  width:auto;
  display:block;
  border-radius: 10px;
  box-shadow: 0 12px 30px rgba(15,23,42,.14);
}
@media (max-width: 720px){
  .brand__logo{height:36px;}
}


/* === Footer logo === */
.footer__brand{
  display:flex;
  align-items:center;
  gap:12px;
}
.footer__logo{
  height:42px;
  width:auto;
  border-radius:10px;
  box-shadow: 0 14px 34px rgba(15,23,42,.14);
}
.footer__brandTitle{
  font-weight: 800;
  letter-spacing: -0.01em;
}
.footer__brandSub{
  margin-top: 2px;
  font-size: 13px;
}
@media (max-width: 720px){
  .footer__logo{height:38px;}
  .footer__brandSub{display:none;}
}


/* === v16: Bigger logo + crop padding === */
.brand__logo{
  height: 120px !important;
  width: auto !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
@media (max-width: 720px){
  .brand__logo{ height: 96px !important; }
}

/* Make header height accommodate larger logo without breaking */
.siteHeader{
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}
.siteHeader__inner{
  align-items: center !important;
}

/* Footer logo */
.footer__logo{
  height: 126px !important;
  width: auto !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
@media (max-width: 720px){
  .footer__logo{ height: 96px !important; }
}


/* === v18: Mobile header — title must not overlap burger === */
@media (max-width: 720px){
  .brand{flex: 1 1 auto; min-width: 0;}
  .brand__text{min-width:0; max-width:100%;}
  .brand__title{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
  }
  .nav{flex: 0 0 auto;}
  .header__actions{flex: 0 0 auto;}
  .header__actions .btn--primary{padding:10px 12px; font-size:13px;}
}
@media (max-width: 560px){
  .brand__title{font-size: 15px;}
}


/* === v19: Mobile hero form slightly more transparent to reveal video/photo background === */
@media (max-width: 720px){
  .hero__card .card--glass{
    background: rgba(255,255,255,.62);
  }
}


/* === v21: Mobile header/footer layout fixes === */
@media (max-width: 720px){
  /* Header: prevent title from sliding under button/burger */
  .header__inner{
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
  }
  .brand{
    order: 1;
    flex: 1 1 auto;
    min-width: 0;
    align-items: center;
  }
  .brand__logo{
    /* keep big, but ensure it doesn't force overlap */
    height: 86px !important;
  }
  .header__actions{
    order: 2;
    flex: 0 0 auto;
  }
  .nav{
    order: 3;
    flex: 0 0 auto;
  }
  .brand__text{
    order: 4;
    flex: 1 1 100%;
    min-width: 0;
    margin-top: -4px;
    padding-right: 6px;
  }
  .brand__title{
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    line-height: 1.15;
  }
  .brand__subtitle{
    margin-top: 4px;
    font-size: 12px;
  }
}

@media (max-width: 560px){
  .brand__logo{ height: 78px !important; }
  .brand__title{ font-size: 15px; }
  .header__actions .btn--primary{ padding: 10px 12px; font-size: 13px; }
}

/* Footer: align by grid on mobile */
@media (max-width: 720px){
  .footer__row{
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    align-items: start;
  }
  .footer__left{
    width: 100%;
  }
  .footer__right{
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .footer__brand{
    align-items: center;
  }
  .footer__logo{
    height: 76px !important;
  }
}

/* === Geo links === */
.geoLinks__item{display:block; text-decoration:none; color: inherit;}
.geoLinks__item:hover{transform: translateY(-1px); box-shadow: 0 18px 44px rgba(15,23,42,.10);}
.geoLinks__city{font-weight: 800; letter-spacing: -.01em; margin-bottom: 6px;}


/* === v25: Hero responsive grid (mobile) === */
@media (max-width: 980px){
  .hero{min-height: auto;}
  .hero__inner{
    grid-template-columns: 1fr !important;
    padding: 44px 0 28px !important;
    gap: 18px !important;
  }
  .hero__copy{padding-top: 0;}
}
@media (max-width: 720px){
  .hero__inner{
    padding: 34px 0 22px !important;
    gap: 14px !important;
  }
  .hero__video{filter: saturate(1.08) contrast(1.02) brightness(.98);}
}


/* === v27: Desktop header alignment (grid, nav centered) === */
@media (min-width: 981px){
  .header__inner{
    display: grid !important;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 18px;
  }
  .brand{
    justify-self: start;
  }
  .nav{
    justify-self: center;
    width: 100%;
    justify-content: center;
  }
  .nav__panel{
    justify-content: center;
    flex: 1;
  }
  .header__actions{
    justify-self: end;
    justify-content: flex-end;
  }
}


/* === v28: Brand text alignment in header === */
@media (min-width: 981px){
  .brand{
    align-items: center;
    gap: 14px;
  }
  .brand__text{
    display:flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
  }
  .brand__title{
    line-height: 1.08;
    margin: 0;
  }
  .brand__subtitle{
    margin-top: 5px;
    line-height: 1.2;
  }
}

/* === Prose === */
.prose p{margin: 0 0 12px; color: rgba(15,23,42,.86);}
.prose strong{color: rgba(15,23,42,1);}

/* === Cases cards === */
.caseCard{display:block; text-decoration:none; color:inherit; overflow:hidden;}
.caseCard__img{width:100%; height:200px; object-fit:cover; display:block; border-radius:10px;}
.caseCard__body{margin-top:12px;}
.caseCard__title{font-weight:800; letter-spacing:-.01em; margin-bottom:6px;}
@media (max-width: 720px){
  .caseCard__img{height:180px;}
}

/* === v34: Comfortable spacing + softer cards (no 'oval' look) === */
.card--pad{padding: 18px;}
@media (max-width: 720px){
  .card--pad{padding: 16px;}
}

.geoLinks__item{padding: 18px;}


/* === v35: Global spacing & soft UI (premium, not cramped) === */
:root{
  --space-1: 6px;
  --space-2: 10px;
  --space-3: 14px;
  --space-4: 18px;
  --space-5: 24px;
}

body{
  line-height: 1.55;
}

.section__head{
  margin-bottom: 22px;
}
.section__head .muted{
  margin-top: 8px;
  line-height: 1.55;
}

.card{
  padding: 18px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
@media (max-width: 720px){
  .section{padding: 52px 0;}
  .card{padding: 16px;}
}

.badge, .noteBar, .metric, .mini{
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.badge{padding: 10px 14px;}
.noteBar{padding: 16px 18px;}
.metric, .mini{padding: 12px 16px;}

.geoLinks__item{
  padding: 18px;
}

.field{gap: 6px;}
.field__label{margin-bottom: 6px;}
.field__control{
  padding: 12px 14px;
  line-height: 1.3;
  background: rgba(255,255,255,.80);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.field__control--textarea{padding: 12px 14px;}

.btn{
  padding: 12px 16px;
}


/* === v37: Spacing polish across all UI blocks === */
:root{
  --radius2: 10px;
}

/* Cards + soft blocks */
.card{
  padding: 22px;
}
@media (max-width: 720px){
  .card{padding: 18px;}
}

.card--soft{
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: none;
}

/* Headings & paragraphs inside cards */
.card .h4{margin: 0 0 10px;}
.card .h3{margin: 0 0 10px;}
.card p{margin: 8px 0 0;}
.card p:first-child{margin-top: 0;}

/* UI pills / bars */
.badge{padding: 10px 14px; border-radius: 10px;}
.noteBar{padding: 16px 18px; border-radius: 10px;}
.metric{padding: 14px 16px; border-radius: 10px;}
.mini{padding: 14px 16px; border-radius: 10px;}
.step{padding: 16px 18px; border-radius: 10px;}

/* Key-value blocks (contacts / requisites) */
.kv{
  padding: 12px 0;
}
.kv__k{padding-right: 6px;}
.kv__v{color: rgba(15,23,42,.92); font-weight: 600; line-height: 1.45;}
@media (max-width: 720px){
  .kv{grid-template-columns: 1fr; gap: 6px;}
  .kv__k{font-size: 12px;}
}

/* Inputs should not look like ovals */
.field__control{
  border-radius: 10px;
  padding: 12px 14px;
}
.btn{
  border-radius: 10px;
}

/* Geo links and case cards: more air */
.geoLinks__item{padding: 18px;}


/* === v38: Toast + success modal === */
.toast{
  position: fixed;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  z-index: 9999;
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(15,23,42,.12);
  border-radius: 10px;
  padding: 12px 14px;
  box-shadow: 0 18px 50px rgba(15,23,42,.16);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: rgba(0,0,0,.92); /* user asked: black */
  font-weight: 600;
  max-width: min(560px, calc(100vw - 24px));
  width: max-content;
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}
.toast.is-open{
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(-2px);
}

.modalX{
  position: fixed;
  inset: 0;
  z-index: 9998;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: rgba(15,23,42,.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.modalX.is-open{display:flex;}
.modalX__panel{
  width: min(520px, 100%);
  border-radius: 10px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(15,23,42,.12);
  box-shadow: 0 30px 90px rgba(15,23,42,.24);
  padding: 18px;
}
.modalX__top{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
}
.modalX__brand{
  display:flex;
  align-items:center;
  gap: 12px;
}
.modalX__logo{
  width: 42px;
  height: 42px;
  object-fit: contain;
}
.modalX__title{
  font-weight: 900;
  letter-spacing: -.01em;
  color: rgba(15,23,42,.96);
}
.modalX__close{
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.7);
  cursor: pointer;
}
.modalX__close:hover{background: rgba(255,255,255,.9);}
.modalX__body{margin-top: 14px;}
.modalX__body p{margin: 0 0 10px; color: rgba(15,23,42,.86); line-height: 1.55;}
.modalX__actions{
  display:flex;
  gap: 10px;
  margin-top: 14px;
  flex-wrap: wrap;
}
.modalX__actions .btn{flex: 1 1 auto; justify-content: center;}
@media (max-width: 480px){
  .modalX__actions .btn{width: 100%;}
}


/* === v39: Fix equipment media overflow/cropping === */
.equip__media{
  overflow: hidden;
}
.equip__mediaFrame{
  transform: none; /* prevent visual spill / mis-crop */
  will-change: auto;
}
@media (min-width: 721px){
  .equip__media{
    border-radius: 10px 0 0 10px;
  }
}
@media (max-width: 720px){
  .equip__media{
    border-radius: 10px 10px 0 0;
  }
}


/* === v40: Prevent equipment photo bleeding into text === */
.equip__media{z-index: 1;}
.equip__body{
  position: relative;
  z-index: 2;
  background: rgba(255,255,255,.92);
  padding: 18px 18px;
}
@media (max-width: 720px){
  .equip__body{padding: 16px 16px;}
}

/* MVA_LOGO_SCALE_V1 */
/* Goal: increase header logo ~2.5x on desktop, keep sane size on mobile */
@media (min-width: 980px) {
  .header .brand__logo {
    height: 80px !important;
    width: auto !important;
  }
  .header .header__inner {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
}
@media (max-width: 979px) {
  .header .brand__logo {
    height: 56px !important;
    width: auto !important;
  }
}
/* /MVA_LOGO_SCALE_V1 */

/* MVA_SPECS_UNIFY_V1
   Goal: force readable logo size + unify specs cards (Caterpillar D6R / AMMANN ASC 150)
   NOTE: append-only block; safe rollback via BKDIR.
*/

/* --- LOGO: make it big and prevent clipping --- */
.header .header__inner{ min-height: 96px !important; align-items: center !important; }
.header .brand{ gap: 12px !important; align-items: center !important; }
.header .brand__logo{
  height: 80px !important;
  width: auto !important;
  max-height: none !important;
  max-width: none !important;
  display: block !important;
  object-fit: contain !important;
}
@media (max-width: 640px){
  .header .header__inner{ min-height: 72px !important; }
  .header .brand__logo{ height: 56px !important; }
}

/* --- SPECS: same visual rhythm for both cards --- */
#specs .grid--2{ align-items: stretch !important; }
#specs .card.card--soft{
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}
#specs .card__head{ min-height: 64px !important; }
#specs .card__body{ flex: 1 1 auto !important; }
#specs .specTable{ width: 100% !important; border-collapse: collapse !important; }
#specs .specTable th, #specs .specTable td{ padding: 10px 12px !important; vertical-align: top !important; }
#specs .specTable th{ width: 56% !important; font-weight: 600 !important; }
#specs .specTable tr + tr th, #specs .specTable tr + tr td{ border-top: 1px solid rgba(0,0,0,.06) !important; }

/* Docs block (works for both cards if present) */
#specs .card__docs{
  margin-top: 14px !important;
  padding-top: 12px !important;
  border-top: 1px solid rgba(0,0,0,.06) !important;
}
#specs .docs__title{
  font-weight: 700 !important;
  margin-bottom: 10px !important;
}
#specs .docs__actions{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}
#specs .card__docs a{
  text-decoration: none !important;
}

/* MVA_METEOR_SPECSLOGO_CSS_V1
   Goals:
   - Force header logo size (real, readable)
   - Standardize specs cards + docs blocks
   Notes:
   - Use conservative selectors + !important
*/

/* --- Header logo: make it big and non-clipped --- */
header, .header {
  min-height: 96px !important;
}

/* Try multiple common logo wrappers */
header a[href="/"],
.header a[href="/"],
header a.logo,
.header a.logo,
header .logo,
.header .logo,
header [class*="logo"],
.header [class*="logo"],
header [class*="brand"],
.header [class*="brand"] {
  display: flex !important;
  align-items: center !important;
}

header a[href="/"] img,
.header a[href="/"] img,
header a.logo img,
.header a.logo img,
header .logo img,
.header .logo img,
header [class*="logo"] img,
.header [class*="logo"] img,
header [class*="brand"] img,
.header [class*="brand"] img {
  height: 80px !important;
  width: auto !important;
  max-height: none !important;
}

header a[href="/"] svg,
.header a[href="/"] svg,
header a.logo svg,
.header a.logo svg,
header .logo svg,
.header .logo svg,
header [class*="logo"] svg,
.header [class*="logo"] svg,
header [class*="brand"] svg,
.header [class*="brand"] svg {
  height: 80px !important;
  width: auto !important;
}

@media (max-width: 768px) {
  header, .header { min-height: 72px !important; }
  header a[href="/"] img,
  .header a[href="/"] img,
  header a.logo img,
  .header a.logo img,
  header .logo img,
  .header .logo img,
  header [class*="logo"] img,
  .header [class*="logo"] img,
  header [class*="brand"] img,
  .header [class*="brand"] img {
    height: 56px !important;
  }
  header a[href="/"] svg,
  .header a[href="/"] svg,
  header a.logo svg,
  .header a.logo svg,
  header .logo svg,
  .header .logo svg,
  header [class*="logo"] svg,
  .header [class*="logo"] svg,
  header [class*="brand"] svg,
  .header [class*="brand"] svg {
    height: 56px !important;
  }
}

/* --- Specs cards unify --- */
#specs .mva-spec-card-v1 {
  display: flex !important;
  flex-direction: column !important;
}

#specs .mva-docs-v1 {
  margin-top: 14px !important;
  padding-top: 12px !important;
  border-top: 1px solid rgba(0,0,0,.08) !important;
}

#specs .mva-docs-title {
  font-weight: 700 !important;
  font-size: 14px !important;
  margin: 0 0 10px 0 !important;
}

#specs .mva-docs-list {
  display: flex !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

#specs .mva-docs-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  border-radius: 10px !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  background: #fff !important;
}

#specs .mva-docs-btn:hover {
  filter: brightness(0.98) !important;
}

/* Hide legacy docs blocks inside specs to prevent duplicates.
   Our JS will rebuild a single unified docs block per card. */
#specs .card__docs { display: none !important; }

/* ================================
   MVA_QUARTZ_LOGOAUTHORITY_CSS_V1
   Goals:
   - Force logo BIG (unmissable)
   - Ensure header doesn't clip logo
   - Ensure PDF links clickable in specs
   - Standardize docs block look
   ================================ */

header.header#top, .header#top, header#top {
  min-height: 160px !important;
}

header.header#top .header__inner, .header#top .header__inner, header#top .header__inner {
  min-height: 160px !important;
  overflow: visible !important;
  align-items: center !important;
}

header.header#top a.brand, .header#top a.brand, header#top a.brand {
  align-items: center !important;
  gap: 14px !important;
  overflow: visible !important;
  transform: none !important;
}

header.header#top img.brand__logo, .header#top img.brand__logo, header#top img.brand__logo,
header.header#top .brand__logo, .header#top .brand__logo, header#top .brand__logo {
  height: 140px !important;
  width: auto !important;
  max-height: none !important;
  max-width: none !important;
  display: block !important;
  transform: none !important;
}

/* Make sure nothing sits above PDF buttons in specs */
#specs a.btn, #specs .btn,
#specs .mva-docs-block, #specs .mva-docs-block * {
  position: relative !important;
  z-index: 5 !important;
  pointer-events: auto !important;
}

#specs .specCard::before, #specs .specCard::after,
#specs .card::before, #specs .card::after {
  pointer-events: none !important;
}

/* Unified docs block */
#specs .mva-docs-block {
  margin-top: 14px !important;
  padding-top: 12px !important;
  border-top: 1px solid rgba(15, 23, 42, 0.10) !important;
}

#specs .mva-docs-block__title {
  font-weight: 700 !important;
  margin-bottom: 10px !important;
}

#specs .mva-docs-block__row {
  display: flex !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

/* On small screens: still big, but not ridiculous */
@media (max-width: 640px) {
  header.header#top img.brand__logo, .header#top img.brand__logo, header#top img.brand__logo,
  header.header#top .brand__logo, .header#top .brand__logo, header#top .brand__logo {
    height: 72px !important;
  }
  header.header#top, .header#top, header#top,
  header.header#top .header__inner, .header#top .header__inner, header#top .header__inner {
    min-height: 92px !important;
  }
}


/* MVA_HEADER_ORDER_PREMIUM_V1
   Goal: premium header layout after large logo + prevent nav overlap
   Scope: header only (#top)
*/
header#top {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

header#top .mva-header-row {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
}

header#top .mva-header-row--top {
  justify-content: space-between !important;
  flex-wrap: nowrap !important;
}

header#top .mva-header-row--bottom {
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: 8px !important;
}

header#top .mva-header-row--bottom nav {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

header#top .mva-header-row--bottom nav a {
  display: inline-flex !important;
  align-items: center !important;
  padding: 10px 12px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}

/* keep large logo as is, but prevent it from shrinking */
header#top img.brand__logo {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
}

/* Specs cards: standardize docs blocks */
#specs .card__docs,
#specs .mva-docs-single {
  margin-top: 14px !important;
  padding-top: 12px !important;
  border-top: 1px solid rgba(0,0,0,0.08) !important;
}

#specs .card__docs .docs__title {
  font-weight: 700 !important;
  margin-bottom: 10px !important;
}

#specs .card__docs a,
#specs .mva-docs-single a,
#specs a.docs__btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  text-decoration: none !important;
  position: relative !important;
  z-index: 3 !important;
  pointer-events: auto !important;
}

/* protect against invisible overlays swallowing clicks */
#specs .card__docs,
#specs .mva-docs-single {
  position: relative !important;
  z-index: 2 !important;
  pointer-events: auto !important;
}


/* MVA_OPAL_HEADERPOLISH_CSS_V1
   Goal:
   - Keep the already-large logo as-is (no size changes here)
   - Premium header layout: logo | nav | CTA aligned right, no overlaps
   - Standard docs block styling in #specs cards
*/
.header#top .header__inner{
  display:grid !important;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  column-gap:24px;
  row-gap:12px;
}
.header#top .nav{ justify-self:center !important; }
.header#top .header__actions{ justify-self:end !important; }
.header#top .nav__panel{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:18px;
}
@media (max-width: 980px){
  .header#top .header__inner{
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "brand actions"
      "nav nav";
  }
  .header#top .brand{ grid-area: brand; }
  .header#top .nav{ grid-area: nav; justify-self:start !important; }
  .header#top .header__actions{ grid-area: actions; }
  .header#top .nav__panel{ justify-content:flex-start; gap:14px; }
}

#specs .mva-docs-block{
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid rgba(0,0,0,.08);
}
#specs .mva-docs-title{
  font-weight:700;
  margin:0 0 10px 0;
}
#specs .mva-docs-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
#specs a.mva-doc-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border:1px solid rgba(0,0,0,.10);
  border-radius:10px;
  text-decoration:none;
  line-height:1;
}
#specs a.mva-doc-link:hover{
  border-color: rgba(0,0,0,.18);
}

/* MVA_HEADER_SINGLELINE_V1_START
   Goal: keep header premium, single-line nav (no wrapping) on desktop, reduce header vertical height.
   Notes: does NOT change logo size itself; only layout/spacing.
*/

@media (min-width: 1024px) {
  header#top {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

  header#top .header__inner,
  header#top .header-inner,
  header#top .topbar,
  header#top .header__row,
  header#top .container {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    flex-wrap: nowrap !important;
  }

  header#top .brand,
  header#top .logo,
  header#top .header__brand {
    flex: 0 0 auto !important;
    margin: 0 !important;
  }

  header#top nav,
  header#top .nav,
  header#top .header__nav {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  header#top nav::-webkit-scrollbar,
  header#top .nav::-webkit-scrollbar,
  header#top .header__nav::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
  }

  header#top nav ul,
  header#top .nav ul,
  header#top .header__nav ul,
  header#top nav .nav__list,
  header#top .nav__list {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
    gap: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  header#top nav a,
  header#top .nav a,
  header#top .header__nav a {
    display: inline-flex !important;
    align-items: center !important;
    padding: 8px 10px !important;
    font-size: 14px !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
  }

  header#top .header__cta,
  header#top .cta,
  header#top .header__actions,
  header#top .actions,
  header#top .btn-cta,
  header#top a.btn,
  header#top button.btn {
    margin-left: auto !important;
    flex: 0 0 auto !important;
  }
}

/* MVA_HEADER_SINGLELINE_V1_END */

/* MVA_PRISM_HEADERTRIM_CSS_V1
   Goal: remove "Услуги" + "Характеристики" from header nav; keep header in one premium line; do not change logo size.
*/
header#top .nav__panel .nav__link[href="#services"],
header#top .nav__panel .nav__link[href="#specs"]{
  display:none !important;
}

/* Desktop premium one-line header */
@media (min-width: 1024px){
  header#top{
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }
  header#top .header__inner{
    display:flex !important;
    align-items:center !important;
    flex-wrap:nowrap !important;
    gap: 18px !important;
  }

  header#top .brand{
    display:flex !important;
    align-items:center !important;
    gap: 12px !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
  }
  header#top .brand__text{
    line-height: 1.05 !important;
  }
  header#top .brand__title{
    line-height: 1.05 !important;
    margin: 0 !important;
  }
  header#top .brand__subtitle{
    line-height: 1.1 !important;
    margin-top: 2px !important;
  }

  header#top .nav{
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
  header#top .nav__toggle{
    display:none !important;
  }
  header#top .nav__panel{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex-wrap:nowrap !important;
    gap: 16px !important;
    white-space:nowrap !important;

    /* in case screen is narrow: allow smooth horizontal scroll without visible scrollbar */
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; /* Firefox */
  }
  header#top .nav__panel::-webkit-scrollbar{ display:none; }

  header#top .nav__link{
    white-space:nowrap !important;
    padding: 10px 8px !important;
    line-height: 1 !important;
  }

  header#top .header__actions{
    flex: 0 0 auto !important;
    margin-left:auto !important;
    display:flex !important;
    align-items:center !important;
  }
}

/* MVA_THANKS_VIDEO_CSS_V1
   After successful lead submit: show full-screen video overlay, then auto-close.
   Keep premium look, no layout impact.
*/
#mva-thanks-video-overlay{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.70);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
#mva-thanks-video-overlay .mva-tv-card{
  width:min(900px, 92vw);
  border-radius:18px;
  overflow:hidden;
  box-shadow: 0 20px 70px rgba(0,0,0,.45);
  background:#000;
  position:relative;
}
#mva-thanks-video-overlay video{
  width:100%;
  height:auto;
  display:block;
  background:#000;
}
#mva-thanks-video-overlay .mva-tv-close{
  position:absolute;
  top:10px;
  right:10px;
  width:40px;
  height:40px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.25);
  background:rgba(0,0,0,.35);
  color:#fff;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  line-height:1;
}
#mva-thanks-video-overlay .mva-tv-hint{
  position:absolute;
  left:14px;
  bottom:12px;
  right:14px;
  color:rgba(255,255,255,.85);
  font-size:14px;
  text-shadow: 0 2px 12px rgba(0,0,0,.55);
  display:none;
}
#mva-thanks-video-overlay.mva-tv-needs-tap .mva-tv-hint{ display:block; }
/* MVA_HEADER_ONELINE_V1_BEGIN */
@media (min-width: 981px){
  .header__inner{padding:6px 0 !important; gap:10px !important; flex-wrap:nowrap !important;}
  .brand{min-width:0 !important; gap:10px !important;}
  .brand__text{min-width:0 !important;}
  .brand__title{font-size:14px !important; line-height:1.1 !important;}
  .brand__subtitle{font-size:11px !important; line-height:1.1 !important;}
  .nav{flex:1 1 auto !important; min-width:0 !important;}
  .nav__panel{flex-wrap:nowrap !important; white-space:nowrap !important; gap:12px !important; overflow-x:auto !important; overflow-y:hidden !important; scrollbar-width:none;}
  .nav__panel::-webkit-scrollbar{display:none;}
  .nav__link{white-space:nowrap !important; padding:8px 10px !important;}
  .header__actions{flex:0 0 auto !important; gap:10px !important;}
  .header__actions .btn{white-space:nowrap !important;}
}
@media (max-width: 1240px){
  .brand__subtitle{display:none !important;}
}
/* MVA_HEADER_ONELINE_V1_END */

/* MVA_MOBILE_BURGER_V1_CSS_BEGIN */
/* Mobile header premium burger dropdown (<=980px). Keeps big logo, moves CTA into menu. */
@media (max-width: 980px){
  /* Keep header compact */
  .header{padding: 8px 0 !important}
  .header__inner{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap: 12px !important;
  }

  /* Brand: keep logo, reduce text footprint */
  .brand{min-width: 0 !important}
  .brand__text{min-width:0 !important}
  .brand__title{font-size: 13px !important; line-height: 1.1 !important}
  .brand__subtitle{font-size: 11px !important; white-space: nowrap !important; overflow:hidden !important; text-overflow: ellipsis !important; max-width: 46vw !important}

  /* Hide desktop actions on mobile; CTA will be moved into burger panel by JS */
  .header__actions{display:none !important}

  /* Burger toggle visible & on the right */
  .nav{position:relative !important}
  .nav__toggle{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:42px !important;
    height:42px !important;
  }

  /* Dropdown panel: premium */
  .nav__panel{
    display:flex !important; /* we will control visibility via opacity/pointer-events */
    position:absolute !important;
    right: 0 !important;
    top: calc(100% + 10px) !important;
    padding: 10px !important;
    border-radius: 16px !important;
    border: 1px solid rgba(255,255,255,.16) !important;
    background: rgba(18, 24, 37, .94) !important;
    backdrop-filter: blur(14px) !important;
    box-shadow: 0 18px 50px rgba(0,0,0,.35) !important;
    flex-direction: column !important;
    align-items: stretch !important;
    min-width: min(92vw, 360px) !important;
    z-index: 3000 !important;

    opacity: 0 !important;
    transform: translateY(-6px) scale(.98) !important;
    pointer-events: none !important;
    transition: opacity .16s ease, transform .16s ease !important;
  }
  .nav.is-open .nav__panel{
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
    pointer-events: auto !important;
  }

  .nav__link{
    display:block !important;
    padding: 12px 12px !important;
    border-radius: 14px !important;
    color: rgba(233,237,247,.94) !important;
    background: rgba(255,255,255,.04) !important;
  }
  .nav__link:hover{background: rgba(255,255,255,.07) !important}

  /* CTA inside panel */
  .mva-nav-cta{
    margin-top: 8px !important;
    padding-top: 8px !important;
    border-top: 1px solid rgba(255,255,255,.10) !important;
  }
  .mva-nav-cta .btn{
    width: 100% !important;
    justify-content: center !important;
    padding: 12px 14px !important;
    border-radius: 14px !important;
  }

  /* Make clicks always land (avoid overlays eating taps) */
  .nav__panel, .nav__panel *{pointer-events:auto !important}
}
/* MVA_MOBILE_BURGER_V1_CSS_END */

/* MVA_MOBILE_BURGER_V2_CSS_BEGIN */
/* Mobile header/menu refinement (<=980px): fit ALL menu items, scrollable premium panel, desktop untouched. */
@media (max-width: 980px){

  /* Lock background scroll when menu is open (class is set by JS) */
  html.mva-nav-open, html.mva-nav-open body{
    overflow: hidden !important;
    height: 100% !important;
  }

  /* Measure-driven top offset (set by JS), fallback 64px */
  :root{ --mva-mhdr-h: 64px; }

  /* Upgrade dropdown panel to full-height premium sheet */
  .nav__panel{
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    top: calc(var(--mva-mhdr-h) + 10px) !important;
    bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;

    min-width: 0 !important;
    max-height: none !important;

    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;

    padding: 12px !important;
    border-radius: 18px !important;

    /* keep premium glass look, but make it readable */
    background: rgba(14, 18, 30, .96) !important;
    border: 1px solid rgba(255,255,255,.16) !important;
    backdrop-filter: blur(16px) !important;
    box-shadow: 0 26px 70px rgba(0,0,0,.45) !important;
  }

  /* Ensure burger button stays above the sheet */
  .nav__toggle{
    position: relative !important;
    z-index: 3300 !important;
  }

  /* Panel header (injected by JS) stays visible during scroll */
  .mva-panel-head{
    position: sticky !important;
    top: 0 !important;
    z-index: 1 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;

    padding: 10px 6px 12px !important;
    margin: -6px -6px 10px !important;

    background: rgba(14, 18, 30, .96) !important;
    backdrop-filter: blur(16px) !important;
    border-bottom: 1px solid rgba(255,255,255,.10) !important;
  }
  .mva-panel-title{
    font-size: 11px !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
    color: rgba(233,237,247,.82) !important;
  }
  .mva-panel-close{
    width: 40px !important;
    height: 40px !important;
    border-radius: 14px !important;
    background: rgba(255,255,255,.05) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    color: rgba(233,237,247,.92) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 22px !important;
    line-height: 1 !important;
    cursor: pointer !important;
  }
  .mva-panel-close:active{transform: scale(.98) !important}

  /* Menu list layout (works whether it's UL or simple container) */
  .nav__panel .nav__list{
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
  }

  /* Links: bigger tap targets, clearer typography */
  .nav__link{
    display: block !important;
    padding: 13px 12px !important;
    border-radius: 16px !important;

    font-size: 15px !important;
    line-height: 1.2 !important;
    font-weight: 500 !important;

    color: rgba(233,237,247,.96) !important;
    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.07) !important;
  }
  .nav__link:hover{ background: rgba(255,255,255,.07) !important; }
  .nav__link:active{ transform: translateY(1px) !important; }

  /* CTA area (from V1): keep it always visible and full width */
  .mva-nav-cta{
    margin-top: 10px !important;
    padding-top: 10px !important;
    border-top: 1px solid rgba(255,255,255,.10) !important;
  }
  .mva-nav-cta .btn{
    width: 100% !important;
    justify-content: center !important;
    padding: 13px 14px !important;
    border-radius: 16px !important;
  }

  /* Small polish: make menu feel less cramped if title/subtitle exist */
  .brand__subtitle{ max-width: 52vw !important; }
}
/* MVA_MOBILE_BURGER_V2_CSS_END */

/* OBSERVATORY_HEADER_SYSTEM_V1 */
header#top,
.header#top{
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  background: rgba(255,255,255,.94) !important;
  -webkit-backdrop-filter: blur(14px) saturate(140%) !important;
  backdrop-filter: blur(14px) saturate(140%) !important;
  border-bottom: 1px solid rgba(15,23,42,.08) !important;
  box-shadow: 0 1px 0 rgba(15,23,42,.05) !important;
}

header#top .header__inner,
.header#top .header__inner{
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  column-gap: 28px !important;
  min-height: 78px !important;
  padding: 12px 0 !important;
}

header#top .brand,
.header#top .brand{
  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
  min-width: 0 !important;
}

header#top .brand__logo,
.header#top .brand__logo{
  display: block !important;
  width: auto !important;
  height: 54px !important;
  max-width: none !important;
  object-fit: contain !important;
}

header#top .brand__text,
.header#top .brand__text{
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
}

header#top .brand__title,
.header#top .brand__title{
  display: block !important;
  font-size: 15px !important;
  line-height: 1.1 !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
  color: rgba(15,23,42,.96) !important;
}

header#top .brand__subtitle,
.header#top .brand__subtitle{
  display: block !important;
  margin: 0 !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
  color: rgba(71,85,105,.82) !important;
  white-space: nowrap !important;
}

header#top .nav,
.header#top .nav{
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

header#top .nav__panel,
.header#top .nav__panel{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  min-width: 0 !important;
  width: 100% !important;
  white-space: nowrap !important;
}

header#top .nav__link,
.header#top .nav__link{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  color: rgba(15,23,42,.78) !important;
  font-size: 14px !important;
  line-height: 1.15 !important;
  font-weight: 650 !important;
  transition: background .16s ease, color .16s ease, transform .16s ease !important;
}

header#top .nav__link:hover,
.header#top .nav__link:hover{
  background: rgba(15,23,42,.05) !important;
  color: rgba(15,23,42,.98) !important;
}

header#top .nav__toggle,
.header#top .nav__toggle{
  display: none !important;
}

header#top .header__actions,
.header#top .header__actions{
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

header#top .header__actions .btn,
.header#top .header__actions button,
.header#top .header__actions a.btn,
.header#top .header__actions a,
.header#top .header__actions button.btn,
.header#top .header__actions .btn--primary,
.header#top .header__actions [data-open-lead-modal],
.header#top #dCta,
.header#top #mBtn,
.header#top #mPanel,
.header#top #dNav,
.header#top > div > nav,
.header#top > div > button,
.header#top > div > div,
.header#top > div > a,
.header#top > div,
.header#top .btn{
}

header#top .header__actions .btn,
.header#top .header__actions .btn--primary,
.header#top .header__actions [data-open-lead-modal],
.header#top #dCta,
.header#top .btn.btn--primary{
  min-height: 48px !important;
  padding: 0 20px !important;
  border-radius: 14px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  box-shadow: 0 14px 34px rgba(91,108,255,.20) !important;
}

@media (max-width: 1200px){
  header#top .header__inner,
  .header#top .header__inner{
    column-gap: 18px !important;
    min-height: 74px !important;
  }
  header#top .brand__logo,
  .header#top .brand__logo{
    height: 48px !important;
  }
  header#top .brand__subtitle,
  .header#top .brand__subtitle{
    display: none !important;
  }
  header#top .nav__link,
  .header#top .nav__link{
    padding: 9px 10px !important;
    font-size: 13px !important;
  }
}

@media (max-width: 980px){
  html.mva-header-open,
  html.mva-header-open body{
    overflow: hidden !important;
  }

  body::before{
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(8,10,18,.34);
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
    z-index: 998;
  }
  html.mva-header-open body::before{
    opacity: 1;
    pointer-events: auto;
  }

  header#top .header__inner,
  .header#top .header__inner{
    grid-template-columns: minmax(0, 1fr) auto !important;
    column-gap: 12px !important;
    min-height: 66px !important;
    padding: 10px 0 !important;
  }

  header#top .brand,
  .header#top .brand{
    gap: 10px !important;
  }

  header#top .brand__logo,
  .header#top .brand__logo{
    height: 42px !important;
  }

  header#top .brand__title,
  .header#top .brand__title{
    font-size: 14px !important;
  }

  header#top .brand__subtitle,
  .header#top .brand__subtitle{
    display: none !important;
  }

  header#top .header__actions,
  .header#top .header__actions{
    display: none !important;
  }

  header#top .nav,
  .header#top .nav{
    justify-content: flex-end !important;
  }

  header#top .nav__toggle,
  .header#top .nav__toggle{
    width: 44px !important;
    height: 44px !important;
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    border-radius: 14px !important;
    border: 1px solid rgba(15,23,42,.10) !important;
    background: rgba(15,23,42,.04) !important;
    color: rgba(15,23,42,.84) !important;
    box-shadow: 0 10px 28px rgba(15,23,42,.08) !important;
    padding: 0 !important;
  }

  header#top .nav__toggle span,
  .header#top .nav__toggle span{
    display: block !important;
    width: 18px !important;
    height: 2px !important;
    margin: 0 !important;
    background: currentColor !important;
    border-radius: 99px !important;
  }

  header#top .nav__panel,
  .header#top .nav__panel{
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    top: 76px !important;
    bottom: 12px !important;
    z-index: 999 !important;
    width: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    padding: 16px !important;
    border-radius: 22px !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    background: rgba(12,14,18,.94) !important;
    -webkit-backdrop-filter: blur(14px) saturate(140%) !important;
    backdrop-filter: blur(14px) saturate(140%) !important;
    box-shadow: 0 26px 64px rgba(0,0,0,.34) !important;
    overflow-y: auto !important;
    white-space: normal !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(-14px) scale(.985) !important;
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease !important;
  }

  header#top .nav__panel::before,
  .header#top .nav__panel::before{
    content: 'Навигация';
    display: block;
    padding: 2px 4px 8px;
    color: rgba(255,255,255,.62);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
  }

  header#top .nav.is-open .nav__panel,
  .header#top .nav.is-open .nav__panel{
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) scale(1) !important;
  }

  header#top .nav__link,
  .header#top .nav__panel .nav__link,
  .header#top .nav.is-open .nav__panel .nav__link,
  .header#top .nav__panel a,
  .header#top .nav.is-open .nav__panel a,
  .header#top .nav__panel .btn,
  .header#top .nav__panel button,
  .header#top .nav__panel div,
  .header#top .nav__panel span,
  .header#top .nav__panel *,
  .header#top .nav__panel::before,
  .header#top .nav__panel::after,
  .header#top .nav__panel .nav__toggle,
  .header#top .nav__panel .brand,
  .header#top .nav__panel .header__actions,
  .header#top .nav__panel .brand__title,
  .header#top .nav__panel .brand__subtitle,
  .header#top .nav__panel .brand__text,
  .header#top .nav__panel .brand__logo,
  .header#top .nav__panel .container,
  .header#top .nav__panel .nav,
  .header#top .nav__panel .header__inner,
  .header#top .nav__panel .nav__panel,
  .header#top .nav__panel .nav__link[href="#services"],
  .header#top .nav__panel .nav__link[href="#specs"]{
  }

  header#top .nav__panel .nav__link,
  .header#top .nav__panel .nav__link{
    display: block !important;
    width: 100% !important;
    padding: 15px 16px !important;
    border-radius: 16px !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    background: rgba(255,255,255,.06) !important;
    color: rgba(255,255,255,.92) !important;
    font-size: 16px !important;
    font-weight: 650 !important;
    text-align: left !important;
  }

  header#top .nav__link:hover,
  .header#top .nav__link:hover{
    background: rgba(255,255,255,.09) !important;
    color: rgba(255,255,255,.98) !important;
  }
}
/* /OBSERVATORY_HEADER_SYSTEM_V1 */
