:root{
  --green:#0b8f31;
  --green-light:#13a83d;
  --green-dark:#067427;
  --dark:#15191b;
  --muted:#5e6468;
  --line:#e5e8e8;
  --soft:#f3f4f4;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Inter",Arial,sans-serif;color:var(--dark);background:#fff;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
button,input{font:inherit}
button{white-space:nowrap}
.container{width:min(1080px,calc(100% - 80px));margin:0 auto;min-width:0}

/* HEADER */
.site-header{background:#fff;position:relative;z-index:30}
.header-top{height:78px;display:grid;grid-template-columns:210px minmax(180px,1fr) minmax(210px,1.08fr) 205px;gap:20px;align-items:center}
.brand{min-width:0}
.brand img{width:182px;height:auto}
.header-caption{font-size:10.5px;line-height:1.35;color:#4f5357;text-transform:uppercase;min-width:0}
.header-info{display:flex;align-items:flex-start;gap:11px;font-size:11px;line-height:1.42;color:#4f5659;min-width:0}
.header-info img{width:20px;height:20px;margin-top:1px;flex:0 0 20px}
.header-right{width:205px;justify-self:end;display:flex;flex-direction:column;align-items:stretch;gap:7px}
.header-phone{height:22px;display:flex;align-items:center;gap:9px;justify-content:center;white-space:nowrap}
.header-phone img{width:20px;height:20px;flex:0 0 20px}
.header-phone a{font-weight:800;font-size:18px;letter-spacing:-.3px}
.btn{border:0;border-radius:5px;display:inline-flex;align-items:center;justify-content:center;gap:10px;font-weight:700;cursor:pointer;transition:.18s ease;line-height:1;white-space:nowrap}
.btn img{width:18px;height:18px;flex:0 0 18px}
.btn:hover{transform:translateY(-1px)}
.btn-green{color:#fff;background:linear-gradient(180deg,#17aa42 0%,#0c9033 55%,#067729 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 4px 12px rgba(0,102,32,.14)}
.btn-call{width:100%;height:34px;font-size:12px}
.nav{height:37px;background:#f4f5f5;border-top:1px solid #eceeee;border-bottom:1px solid #e7eaea}
.nav-row{height:100%;display:flex;align-items:stretch}
.nav a{display:flex;align-items:center;justify-content:center;padding:0 17px;font-size:11px;font-weight:600;white-space:nowrap}
.nav a.active,.nav a:hover{background:linear-gradient(180deg,#12a43a,#08842c);color:#fff}
.burger{display:none}

/* HERO */
.hero-wrap{padding:0}
.hero{
  aspect-ratio:1916 / 821;
  width:100%;
  position:relative;
  background:url("assets/img/hero.webp") center center/100% 100% no-repeat;
  overflow:hidden;
}
.hero-copy{
  position:absolute;
  left:30px;
  top:50%;
  transform:translateY(-50%);
  width:430px;
  max-width:42%;
  min-width:0;
}
.hero h1{font-size:54px;line-height:.98;letter-spacing:-2px;margin:0 0 14px;font-weight:800}
.hero h1 em{font-style:normal;color:var(--green)}
.hero p{font-size:15px;line-height:1.38;margin:0 0 20px;max-width:420px}
.hero-buttons{display:flex;gap:12px;align-items:center;flex-wrap:nowrap}
.btn-hero{height:52px;padding:0 18px;font-size:13px;border-radius:6px;white-space:nowrap}
.hero-buttons .btn-green{min-width:230px}
.btn-hero-call{min-width:165px;background:rgba(255,255,255,.72);border:1px solid rgba(21,25,27,.26);color:#202527;backdrop-filter:blur(2px);box-shadow:0 2px 8px rgba(0,0,0,.05)}
.btn-hero-call:hover{background:rgba(255,255,255,.86)}

/* QUICK ADVANTAGES */
.quick-wrap{position:relative;margin-top:-26px;z-index:5}
.quick-row{height:82px;background:rgba(255,255,255,.97);display:grid;grid-template-columns:repeat(5,minmax(0,1fr));box-shadow:0 1px 0 #eceeee inset,0 1px 0 #eceeee}
.quick-item{min-width:0;display:flex;align-items:center;gap:12px;padding:0 17px;border-right:1px solid #e6e8e8;font-size:12px;line-height:1.16}
.quick-item:last-child{border-right:0}
.quick-item img{width:48px;height:48px;object-fit:contain;flex:0 0 48px}
.quick-item b{min-width:0}

/* SERVICE CARDS */
.section{padding:22px 0}
.services{padding-top:18px}
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.card{min-width:0;border-radius:6px;overflow:hidden;background:#f3f4f4;box-shadow:0 0 0 1px #e7eaea}
.card>img{width:100%;height:145px;object-fit:cover}
.card-body{background:#f2f3f3;padding:15px 16px 16px;min-height:126px;overflow:hidden}
.card h3{font-size:16px;line-height:1.18;margin:0 0 8px;font-weight:700;overflow-wrap:anywhere}
.card p{font-size:11px;line-height:1.3;color:#5e6568;margin:0 0 15px;min-height:29px;overflow-wrap:anywhere}
.card a{display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:600;white-space:nowrap}
.card a span{width:29px;height:29px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:21px;background:linear-gradient(180deg,#13a63c,#087c29);flex:0 0 29px}

/* WHY */
h2{font-size:25px;line-height:1.12;margin:0 0 8px;letter-spacing:-.5px;font-weight:800}
.accent{width:40px;height:4px;background:var(--green);margin-bottom:22px}
.why{padding-top:5px;padding-bottom:24px}
.why-layout{display:grid;grid-template-columns:minmax(0,1fr) 410px;gap:26px;align-items:start}
.why-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 18px;padding-top:2px}
.why-item{min-width:0;display:grid;grid-template-columns:43px minmax(0,1fr);gap:10px;align-items:start;border-right:1px solid #eceeee;padding-right:10px}
.why-item:nth-child(3),.why-item:nth-child(6){border-right:0}
.why-item img{width:42px;height:42px;object-fit:contain}
.why-item h4{font-size:12px;line-height:1.2;margin:0 0 7px;font-weight:700;overflow-wrap:anywhere}
.why-item p{font-size:10.5px;line-height:1.35;margin:0;color:#676d70;overflow-wrap:anywhere}
.why-card{min-width:0;display:grid;grid-template-columns:56% 44%;height:258px;background:#f4f5f5;border-radius:5px;overflow:hidden;align-self:start}
.why-card>img{width:100%;height:100%;object-fit:cover;object-position:42% center}
.why-card-copy{padding:18px 18px 14px;min-width:0}
.why-card-copy h3{font-size:18px;line-height:1.12;margin:0 0 10px;color:var(--green);font-weight:800;overflow-wrap:normal;word-break:normal}
.why-card-copy .accent{margin-bottom:10px;width:36px;height:3px}
.why-card-copy p{font-size:10.5px;line-height:1.42;color:#3f4649;margin:0;overflow-wrap:normal;word-break:normal}

/* DOCUMENTS */
.docs{padding-top:7px;padding-bottom:28px}
.docs-row{
  display:grid;
  grid-template-columns:126px repeat(2,minmax(72px,1fr)) 126px repeat(4,minmax(72px,1fr)) 164px;
  gap:10px;
  align-items:stretch;
  width:100%;
}
.doc-count{height:106px;background:#f4f5f5;border-radius:4px;padding:13px 12px;display:flex;flex-direction:column;justify-content:space-between;min-width:0}
.doc-count strong{font-size:10px;line-height:1.15}
.doc-meta{display:flex;align-items:flex-end;gap:8px;white-space:nowrap}
.doc-count b{font-size:52px;line-height:.82;color:var(--green);letter-spacing:-2px}
.doc-count small{font-size:11px;line-height:1;padding-bottom:5px}
.doc{height:106px;padding:0;border:0;background:#eee;border-radius:4px;overflow:hidden;position:relative;cursor:pointer;min-width:0}
.doc img{width:100%;height:100%;object-fit:cover}
.doc i{position:absolute;right:6px;bottom:6px;width:29px;height:29px;border-radius:50%;background:rgba(50,55,58,.78);color:#fff;font-style:normal;display:grid;place-items:center;font-size:17px}
.all-docs{height:70px;align-self:center;border:1px solid var(--green);border-radius:4px;background:#fff;padding:0 14px;text-align:left;font-size:10px;line-height:1.25;font-weight:700;display:flex;align-items:center;justify-content:space-between;min-width:0}
.all-docs img{width:20px;height:20px;flex:0 0 20px}

/* CTA */
.cta{
  min-height:145px;
  background:
    linear-gradient(90deg,rgba(11,51,31,.30) 0%,rgba(12,54,33,.18) 44%,rgba(8,38,24,.38) 100%),
    url("assets/img/cta.webp") center/cover no-repeat;
  color:#fff;
}
.cta-inner{min-height:145px;display:grid;grid-template-columns:1.08fr .92fr;gap:34px;align-items:center}
.cta h2{font-size:27px;line-height:1.05;margin:0 0 9px;color:#fff}
.cta p{font-size:12px;margin:0;color:#f2f4f3}
.cta-actions{display:grid;grid-template-columns:minmax(220px,1fr) minmax(165px,.82fr);gap:10px;min-width:0}
.btn-cta-green{color:#fff;background:linear-gradient(180deg,rgba(20,171,64,.88),rgba(10,140,49,.88));border:1px solid rgba(255,255,255,.32);box-shadow:inset 0 1px 0 rgba(255,255,255,.16)}
.btn-darkline{background:rgba(13,34,25,.10);color:#fff;border:1px solid rgba(255,255,255,.75)}
.btn-lg{height:53px;padding:0 19px;font-size:13px;white-space:nowrap}
.cta-notes{grid-column:1/-1;display:flex;justify-content:space-around;font-size:11px;color:#eef2ef}
.cta-notes span{display:flex;align-items:center;gap:10px;white-space:nowrap}
.cta-notes img{width:34px;height:34px;object-fit:contain;flex:0 0 34px}

/* FOOTER */
footer{background:#24292d;color:#e8ebec;padding-top:23px}
.footer-top{display:grid;grid-template-columns:190px minmax(250px,1.6fr) minmax(190px,1.05fr) minmax(200px,1.2fr);gap:26px;align-items:start}
.footer-logo{width:124px;filter:grayscale(1) brightness(3)}
.footer-links{display:grid;grid-template-columns:1fr 1fr;gap:8px 22px;font-size:10px;color:#d0d5d7;min-width:0}
.footer-links a{white-space:nowrap}
.footer-contact{display:flex;flex-direction:column;gap:10px}
.footer-contact a,.footer-address{font-size:11px;line-height:1.42;color:#eef2f2}
.footer-contact a{display:flex;align-items:center;gap:10px;font-weight:600;white-space:nowrap}
.footer-contact img,.footer-address img{width:20px;height:20px;flex:0 0 20px}
.footer-address{display:flex;align-items:flex-start;gap:10px;color:#d0d5d7;min-width:0}
.footer-bottom{margin-top:20px;padding:14px 0 17px;border-top:1px solid #484f52;display:flex;justify-content:space-between;font-size:9px;color:#a2aaad}

/* MODAL */
.modal,.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.62);display:none;align-items:center;justify-content:center;z-index:100;padding:20px}
.modal.open,.lightbox.open{display:flex}
.modal-box{position:relative;width:min(430px,100%);background:#fff;border-radius:8px;padding:25px}
.modal-box h3{margin:0 0 8px}
.modal-box p{color:#666;font-size:13px}
.modal-box form{display:grid;gap:10px}
.modal-box input{height:44px;padding:0 12px;border:1px solid #d6d9da;border-radius:4px}
.close,.lightbox-close{position:absolute;right:13px;top:8px;border:0;background:none;font-size:30px;cursor:pointer}
.lightbox img{max-width:min(900px,92vw);max-height:90vh;background:#fff}
.lightbox-close{color:#fff;font-size:40px;right:25px;top:15px}

/* RESPONSIVE */
@media(max-width:1020px){
  .container{width:min(100% - 34px,1080px)}
  .header-top{grid-template-columns:180px 1fr 205px}
  .header-caption{display:none}
  .header-address{justify-self:end}
  .burger{display:block;border:0;background:none;font-size:25px}
  .nav{display:none;height:auto}
  .nav.open{display:block}
  .nav-row{height:auto;flex-direction:column;padding:6px 0}
  .nav a{min-height:40px;justify-content:flex-start}
  .hero-copy{left:24px;width:400px}
  .hero h1{font-size:47px}
  .hero p{font-size:14px}
  .hero-buttons .btn-green{min-width:210px}
  .btn-hero{font-size:12px}
  .quick-row{grid-template-columns:repeat(3,minmax(0,1fr));height:auto}
  .quick-item{min-height:72px;border-bottom:1px solid #e6e8e8}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .why-layout{grid-template-columns:1fr}
  .why-card{max-width:650px}
  .docs-row{grid-template-columns:126px repeat(2,1fr) 126px repeat(2,1fr) 164px}
  .doc:nth-of-type(5),.doc:nth-of-type(6){display:none}
  .footer-top{grid-template-columns:170px 1.5fr 1fr}
  .footer-address{grid-column:3}
}
@media(max-width:760px){
  .header-top{height:68px;grid-template-columns:1fr auto auto;gap:10px}
  .brand img{width:150px}
  .header-address{display:none}
  .header-right{width:auto}
  .header-right .btn-call{display:none}
  .header-phone a{font-size:0}
  .header-phone a:after{content:"+7 (962) 446-12-12";font-size:16px}
  .hero{aspect-ratio:auto;min-height:430px;background-position:62% center;background-size:cover}
  .hero-copy{position:relative;left:auto;top:auto;transform:none;width:100%;max-width:100%;padding:34px 20px 28px}
  .hero h1{font-size:39px}
  .hero p{font-size:14px;max-width:330px}
  .hero-buttons{display:grid;max-width:300px}
  .hero-buttons .btn-green,.btn-hero-call{width:100%;min-width:0}
  .quick-wrap{margin-top:-20px}
  .quick-row{grid-template-columns:1fr 1fr}
  .quick-item img{width:43px;height:43px;flex-basis:43px}
  .quick-item:last-child{grid-column:1/-1}
  .cards{grid-template-columns:1fr}
  .card>img{height:205px}
  .why-list{grid-template-columns:1fr 1fr}
  .why-item{border-right:0}
  .why-card{grid-template-columns:1fr}
  .why-card>img{height:230px}
  .docs-row{grid-template-columns:1fr 1fr 1fr}
  .doc-count{height:110px}
  .doc{height:110px}
  .all-docs{grid-column:1/-1;height:70px}
  .cta{padding:28px 0}
  .cta-inner{grid-template-columns:1fr}
  .cta-actions{grid-template-columns:1fr}
  .cta-notes{display:none}
  .footer-top{grid-template-columns:1fr}
  .footer-address{grid-column:auto}
  .footer-links a{white-space:normal}
  .footer-bottom{gap:8px;flex-direction:column}
}
@media(max-width:430px){
  .hero h1{font-size:34px}
  .why-list{grid-template-columns:1fr}
  .docs-row{grid-template-columns:1fr 1fr}
  .doc-count{grid-column:1/-1}
}


/* ===== v8 block-reference corrections ===== */
@media (min-width:1021px){
  /* Keep desktop proportions close to the supplied 992–1041 px reference slices. */
  .why-item img{
    width:38px;
    height:38px;
    padding:2px;
    object-fit:contain;
  }

  .quick-item img{
    width:45px;
    height:45px;
    padding:2px;
    object-fit:contain;
    flex-basis:45px;
  }

  .header-info img,
  .header-phone img{
    width:20px;
    height:20px;
    flex-basis:20px;
  }

  .why-list{
    gap:24px 17px;
  }

  .why-item{
    grid-template-columns:42px minmax(0,1fr);
    gap:10px;
  }

  .why-item h4{
    font-size:12px;
    line-height:1.18;
    margin-bottom:6px;
  }

  .why-item p{
    font-size:10px;
    line-height:1.34;
  }

  .docs-row{
    grid-template-columns:126px repeat(2,minmax(72px,1fr)) 126px repeat(4,minmax(72px,1fr)) 164px;
    gap:10px;
  }

  .doc-count,.doc{
    height:96px;
  }

  .doc-count{
    padding:11px 12px;
  }

  .doc-count b{
    font-size:48px;
  }

  .doc-count small{
    font-size:10px;
    padding-bottom:4px;
  }

  .doc i{
    width:27px;
    height:27px;
    font-size:16px;
  }

  .cta h2{
    font-size:26px;
  }

  .cta p{
    font-size:11px;
  }

  .cta-notes{
    font-size:11px;
  }

  .footer-links{
    font-size:10px;
  }

  .footer-contact a,.footer-address{
    font-size:11px;
  }
}

/* Do not allow desktop text to escape its visual block. */
.card-body,
.why-item > div,
.why-card-copy,
.doc-count,
.all-docs,
.cta-inner > div,
.footer-top > *{
  min-width:0;
}

.card h3,
.card p,
.why-item h4,
.why-item p,
.why-card-copy h3,
.why-card-copy p,
.all-docs,
.footer-address span{
  max-width:100%;
}

/* Buttons must remain one line like the mockup. */
.btn-hero,
.btn-lg,
.btn-call{
  white-space:nowrap;
}


/* ============================================================
   v9 — precise visual corrections from the latest markup notes
   ============================================================ */

/* Header icon parity: location marker is optically narrower, so make it larger. */
.header-address img{
  width:25px !important;
  height:25px !important;
  flex:0 0 25px !important;
  margin-top:0 !important;
}
.header-phone img{
  width:20px !important;
  height:20px !important;
  flex:0 0 20px !important;
}

/* Subtle concrete texture/transparency for the green action buttons. */
.btn-green,
.btn-cta-green{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    linear-gradient(180deg,rgba(15,169,61,.90),rgba(5,126,42,.92)),
    url("assets/img/button-concrete.webp") center/cover no-repeat !important;
  border:1px solid rgba(0,92,31,.68);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -1px 0 rgba(0,65,23,.18),
    0 3px 8px rgba(0,92,31,.16);
}
.btn-green::after,
.btn-cta-green::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,rgba(255,255,255,.06),transparent 35%,rgba(0,0,0,.04));
  pointer-events:none;
}
.btn-call{
  border-radius:4px;
}

/* Hero fades into the page at the bottom, like the mockup. */
.hero::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:78px;
  background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.72) 72%,#fff 100%);
  pointer-events:none;
  z-index:1;
}
.hero-copy{
  z-index:2;
}

/* Advantages overlap the hero more noticeably. */
.quick-wrap{
  margin-top:-38px !important;
  z-index:6 !important;
}
.quick-row{
  position:relative;
  z-index:2;
  min-height:84px;
  height:84px;
  background:rgba(255,255,255,.97);
}

/* No transparent outer padding: icons are tightly cropped and sized by visible height. */
.quick-item img{
  width:auto !important;
  height:44px !important;
  max-width:52px;
  object-fit:contain;
  flex:0 0 auto !important;
  padding:0 !important;
}
.quick-item{
  gap:12px !important;
}
.quick-item b{
  font-size:12px;
  line-height:1.23;
}

/* Why block: same visible icon scale as quick strip; two rows visually approach the card height. */
.why-layout{
  align-items:start !important;
}
.why-list{
  grid-auto-rows:116px;
  row-gap:22px !important;
  align-content:start;
}
.why-item{
  height:116px;
  align-content:start;
  padding-top:4px;
}
.why-item img{
  width:auto !important;
  height:44px !important;
  max-width:52px;
  object-fit:contain;
  padding:0 !important;
  flex:0 0 auto;
}
.why-item h4{
  font-size:12px !important;
  line-height:1.22 !important;
}
.why-item p{
  font-size:10.5px !important;
  line-height:1.38 !important;
}
.why-card{
  height:254px !important;
  min-height:254px !important;
}
.why-card-copy{
  padding:17px 18px 14px !important;
}
.why-card-copy h3{
  font-size:17px !important;
  line-height:1.16 !important;
  margin-bottom:9px !important;
  color:var(--green) !important;
}
.why-card-copy h3 .black-word{
  color:#15191b;
}
.why-card-copy p{
  font-size:10px !important;
  line-height:1.42 !important;
}

/* CTA utility icons: much larger, tightly cropped, same visible height. */
.cta-notes{
  margin-top:3px;
}
.cta-notes span{
  gap:10px !important;
  font-size:11px;
}
.cta-notes img{
  width:auto !important;
  height:48px !important;
  max-width:56px;
  object-fit:contain;
  flex:0 0 auto !important;
}

/* Footer: mail + location white; phone stays green as in the mockup. */
.footer-contact a[href^="mailto"] img,
.footer-address img{
  filter:brightness(0) invert(1);
  opacity:.98;
}
.footer-contact a[href^="tel"] img{
  filter:none;
}

/* Keep action labels strictly inside buttons. */
.btn,
.btn span,
.btn a{
  white-space:nowrap;
}
.btn-hero,
.btn-lg,
.btn-call{
  overflow:hidden;
  text-overflow:clip;
}

/* Prevent any content from escaping its box. */
.card,
.card-body,
.why-item,
.why-item>div,
.why-card,
.why-card-copy,
.doc-count,
.all-docs,
.cta-actions,
.footer-top>div{
  min-width:0;
  overflow:hidden;
}

/* Desktop fine tuning */
@media(min-width:1021px){
  .why-card{
    align-self:start;
  }
  .why-list{
    min-height:254px;
  }
}

/* Tablet/mobile keep the same visible icon proportions without giant whitespace. */
@media(max-width:1020px){
  .why-list{
    grid-auto-rows:auto;
  }
  .why-item{
    height:auto;
    min-height:92px;
  }
  .why-card{
    height:auto !important;
    min-height:0 !important;
  }
}
@media(max-width:760px){
  .quick-wrap{margin-top:-24px !important}
  .quick-item img{height:40px !important}
  .why-item img{height:40px !important}
  .cta-notes img{height:40px !important}
}


/* ============================================================
   v10 — more motion, fixed footer logo, tighter equal icon heights
   ============================================================ */

/* Dedicated footer logo instead of filter-converted main logo */
.footer-logo{
  width:138px !important;
  filter:none !important;
  display:block;
}

/* ----- Equal visible heights for icons ----- */

/* Under hero: use the truck as the reference scale; no max-width cap that could reduce height. */
.quick-item img{
  height:42px !important;
  width:auto !important;
  max-width:none !important;
  object-fit:contain !important;
  display:block;
}
.quick-item{
  gap:13px !important;
}

/* Why block icons: same visual height as the strip under hero */
.why-item img{
  height:42px !important;
  width:auto !important;
  max-width:none !important;
  object-fit:contain !important;
  display:block;
}

/* CTA note icons: exactly equal height */
.cta-notes{
  align-items:center;
}
.cta-notes span{
  align-items:center !important;
}
.cta-notes img{
  height:42px !important;
  width:auto !important;
  max-width:none !important;
  object-fit:contain !important;
  display:block;
}

/* ----- More motion / hover life ----- */

:root{
  --ease-rioks:cubic-bezier(.2,.75,.22,1);
}

/* Global polish */
html{
  scroll-behavior:smooth;
}
a, button, .card, .doc, .quick-item, .why-item, .why-card, .all-docs{
  transition:
    transform .32s var(--ease-rioks),
    box-shadow .32s var(--ease-rioks),
    background-color .28s var(--ease-rioks),
    border-color .28s var(--ease-rioks),
    color .28s var(--ease-rioks),
    opacity .28s var(--ease-rioks),
    filter .28s var(--ease-rioks);
}

/* Buttons */
.btn-green:hover,
.btn-cta-green:hover{
  transform:translateY(-2px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.38),
    0 10px 22px rgba(9,103,42,.20);
}
.btn-darkline:hover,
.btn-hero-call:hover{
  transform:translateY(-2px);
  background:rgba(255,255,255,.12);
  box-shadow:0 10px 22px rgba(0,0,0,.12);
}
.btn:active{
  transform:translateY(0);
}

/* Header/nav */
.nav a{
  position:relative;
}
.nav a::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:8px;
  height:2px;
  border-radius:2px;
  background:var(--green);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .26s var(--ease-rioks);
}
.nav a:hover::after,
.nav a.active::after{
  transform:scaleX(1);
}

/* Quick advantages */
.quick-row{
  box-shadow:0 8px 24px rgba(16,29,20,.06);
}
.quick-item:hover{
  transform:translateY(-4px);
}
.quick-item:hover img{
  transform:scale(1.05);
  transition:transform .32s var(--ease-rioks);
}

/* Service cards */
.card{
  overflow:hidden;
}
.card img{
  transition:transform .55s var(--ease-rioks), filter .35s var(--ease-rioks);
}
.card:hover{
  transform:translateY(-5px);
  box-shadow:0 16px 28px rgba(18,33,23,.10);
}
.card:hover img{
  transform:scale(1.04);
}
.card-body a span{
  transition:transform .28s var(--ease-rioks);
}
.card:hover .card-body a span{
  transform:translateX(2px);
}

/* Why block */
.why-item:hover{
  transform:translateY(-3px);
}
.why-card:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 30px rgba(18,33,23,.10);
}
.why-card img{
  transition:transform .55s var(--ease-rioks);
}
.why-card:hover img{
  transform:scale(1.03);
}

/* Docs */
.doc:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 22px rgba(18,33,23,.12);
}
.doc img{
  transition:transform .38s var(--ease-rioks);
}
.doc:hover img{
  transform:scale(1.02);
}
.all-docs:hover{
  transform:translateY(-4px);
  box-shadow:0 10px 22px rgba(18,33,23,.10);
}

/* CTA */
.cta-actions .btn:hover{
  transform:translateY(-2px);
}
.cta-notes span:hover{
  transform:translateY(-2px);
}
.cta-notes span:hover img{
  transform:scale(1.06);
  transition:transform .3s var(--ease-rioks);
}

/* Footer */
.footer-links a:hover,
.footer-contact a:hover{
  opacity:1;
  transform:translateX(2px);
}
.footer-address:hover{
  transform:translateX(2px);
}

/* Scroll reveal classes */
.reveal{
  opacity:0;
  transform:translateY(26px);
  transition:
    opacity .62s var(--ease-rioks),
    transform .62s var(--ease-rioks);
  will-change:opacity, transform;
}
.reveal.is-visible{
  opacity:1;
  transform:none;
}
.reveal-delay-1{transition-delay:.05s}
.reveal-delay-2{transition-delay:.11s}
.reveal-delay-3{transition-delay:.17s}
.reveal-delay-4{transition-delay:.23s}
.reveal-delay-5{transition-delay:.29s}

/* Maintain readable layouts on smaller screens */
@media(max-width:760px){
  .footer-logo{width:128px !important}
  .quick-item img,
  .why-item img,
  .cta-notes img{
    height:38px !important;
  }
}


/* ============================================================
   v11 — final ultra-pass: header, hero+quick, why, cta+footer
   ============================================================ */

/* 1) Header */
.header-top{
  grid-template-columns:210px minmax(184px,1fr) minmax(230px,1.16fr) 212px;
  gap:18px;
}
.header-info{
  gap:10px;
  font-size:11px;
  line-height:1.34;
}
.header-address img{
  width:24px !important;
  height:24px !important;
  flex:0 0 24px !important;
  margin-top:-1px;
}
.header-phone{
  gap:10px;
  height:24px;
}
.header-phone img{
  width:22px !important;
  height:22px !important;
  flex:0 0 22px !important;
}
.header-phone a{
  font-size:17px;
}
.btn-call{
  height:36px;
  font-size:12px;
  letter-spacing:.01em;
}

/* 2) Hero + advantages */
.hero-copy{
  width:402px;
  max-width:40.5%;
}
.hero h1{
  margin-bottom:16px;
}
.hero p{
  font-size:17px !important;
  line-height:1.22 !important;
  font-weight:600;
  max-width:380px;
  margin-bottom:20px;
}
.hero-buttons{
  gap:11px;
}
.btn-hero{
  height:54px;
  padding:0 18px;
  font-size:12.5px;
}
.hero-buttons .btn-green{
  min-width:224px;
}
.btn-hero img,
.btn-hero-call img{
  width:17px;
  height:17px;
  flex:0 0 17px;
}
.btn-hero-call{
  background:rgba(255,255,255,.58) !important;
  border:1px solid rgba(33,37,39,.22);
}
.quick-wrap{
  margin-top:-41px !important;
}
.quick-row{
  min-height:88px !important;
  height:88px !important;
}
.quick-item{
  gap:11px !important;
  padding:0 15px !important;
}
.quick-item img{
  height:38px !important;
  width:auto !important;
  flex:0 0 auto !important;
}
.quick-item b{
  font-size:12px;
  line-height:1.2;
}

/* 3) Why block */
.why-layout{
  grid-template-columns:minmax(0,1fr) 400px;
  gap:24px;
}
.why-list{
  grid-auto-rows:118px;
  row-gap:18px !important;
}
.why-item{
  height:118px;
  grid-template-columns:38px minmax(0,1fr);
  gap:12px;
  padding-top:6px;
}
.why-item img{
  height:38px !important;
}
.why-item h4{
  font-size:12px !important;
  line-height:1.19 !important;
  margin-bottom:7px;
}
.why-item p{
  font-size:10.5px !important;
  line-height:1.37 !important;
}
.why-card{
  grid-template-columns:54% 46% !important;
  height:254px !important;
  min-height:254px !important;
}
.why-card-copy{
  padding:18px 18px 16px !important;
}
.why-card-copy h3{
  font-size:15px !important;
  line-height:1.14 !important;
  letter-spacing:-.02em;
  color:#15191b !important;
  margin-bottom:10px !important;
}
.why-card-copy h3 .green-word{
  color:var(--green);
}
.why-card-copy h3 .black-word{
  color:#15191b !important;
}
.why-card-copy p{
  font-size:10px !important;
  line-height:1.42 !important;
  color:#4a5053 !important;
}

/* 4) Docs block minor geometry */
.docs-row{
  grid-template-columns:126px repeat(2,minmax(74px,1fr)) 126px repeat(4,minmax(74px,1fr)) 146px;
  gap:9px;
}
.all-docs{
  height:74px;
  padding:0 10px;
  font-size:10px;
  line-height:1.2;
}

/* 5) CTA + footer */
.cta{
  background:
    linear-gradient(90deg,rgba(11,51,31,.22) 0%,rgba(12,54,33,.13) 42%,rgba(8,38,24,.28) 100%),
    url("assets/img/cta.webp") center/cover no-repeat;
}
.cta-inner{
  min-height:152px;
  gap:32px;
}
.cta h2{
  font-size:28px;
  line-height:1.04;
}
.cta-actions{
  grid-template-columns:minmax(238px,1fr) minmax(174px,.82fr);
  gap:10px;
}
.btn-lg{
  height:56px;
  font-size:12.5px;
}
.cta-notes{
  padding-top:3px;
  justify-content:space-between;
}
.cta-notes span{
  gap:12px !important;
  font-size:11px;
}
.cta-notes img{
  height:34px !important;
  width:auto !important;
  flex:0 0 auto !important;
}
footer{
  padding-top:22px;
}
.footer-top{
  grid-template-columns:170px minmax(240px,1.55fr) minmax(190px,1.05fr) minmax(210px,1.2fr);
  gap:28px;
}
.footer-logo{
  width:136px !important;
  height:auto;
  filter:none !important;
}
.footer-contact a,.footer-address{
  font-size:11px;
}
.footer-contact a[href^="mailto"] img,
.footer-address img{
  width:19px;
  height:19px;
}
.footer-bottom{
  margin-top:18px;
}

/* More polished motion without being aggressive */
.btn,
.quick-item,
.card,
.why-item,
.why-card,
.doc,
.all-docs,
.footer-links a,
.footer-contact a,
.footer-address{
  transition:
    transform .28s cubic-bezier(.2,.75,.22,1),
    box-shadow .32s cubic-bezier(.2,.75,.22,1),
    opacity .24s ease,
    filter .24s ease,
    background-color .24s ease,
    border-color .24s ease;
}
.quick-item:hover,
.why-item:hover,
.cta-notes span:hover{
  transform:translateY(-3px);
}

@media(max-width:1020px){
  .header-top{grid-template-columns:180px 1fr 205px}
  .hero-copy{width:390px;max-width:46%}
  .hero p{font-size:16px !important}
  .quick-row{height:auto !important;min-height:0 !important}
  .why-layout{grid-template-columns:1fr}
  .why-card{grid-template-columns:54% 46% !important;max-width:650px}
  .docs-row{grid-template-columns:126px repeat(2,1fr) 126px repeat(2,1fr) 146px}
}
@media(max-width:760px){
  .hero p{font-size:15px !important;max-width:300px}
  .quick-wrap{margin-top:-24px !important}
  .quick-item img,
  .why-item img,
  .cta-notes img{height:34px !important}
  .why-card{grid-template-columns:1fr !important}
  .footer-logo{width:128px !important}
}


/* ============================================================
   v12 hotfix — hero vertical anchor + always-visible footer
   ============================================================ */

/* The hero text must be anchored near the top-left of the white zone,
   not vertically centered (which moved it down after shortening the copy). */
.hero-copy{
  top:56px !important;
  transform:none !important;
  left:30px !important;
}

/* Keep footer critical information visible regardless of reveal observer state. */
footer .reveal,
footer .reveal.is-visible,
.footer-top > *,
.footer-bottom > *{
  opacity:1 !important;
  transform:none !important;
  transition:none !important;
}

/* Ensure all footer columns actually render and have adequate contrast. */
.footer-logo{
  display:block !important;
  opacity:1 !important;
}
.footer-links,
.footer-contact,
.footer-address{
  display:grid;
  opacity:1 !important;
  visibility:visible !important;
}
.footer-contact{display:flex !important}
.footer-address{display:flex !important}
.footer-links a,
.footer-contact a,
.footer-address span{
  color:#d7dcde !important;
  opacity:1 !important;
}
.footer-contact a{
  color:#eef2f2 !important;
}

@media(max-width:1020px){
  .hero-copy{
    top:42px !important;
    left:24px !important;
  }
}
@media(max-width:760px){
  .hero-copy{
    position:relative !important;
    top:auto !important;
    left:auto !important;
    transform:none !important;
  }
}


/* ============================================================
   v13 — final layout additions from approved direction
   ============================================================ */

/* HEADER: all primary elements start from the same top line */
.header-top{
  height:82px;
  align-items:start !important;
  padding-top:12px;
}
.brand,
.header-caption,
.header-address,
.header-right{
  margin-top:0 !important;
}
.brand img{
  display:block;
}
.header-caption{
  padding-top:0;
}
.header-address{
  padding-top:0;
}
.header-right{
  padding-top:0;
  align-items:flex-end;
  gap:5px;
}
.header-phone{
  height:23px;
  justify-content:flex-end;
}
.header-phone a{
  font-size:18px;
}

/* Header callback is deliberately secondary to the phone number */
.btn-call-soft{
  width:148px;
  height:30px;
  padding:0 14px;
  font-size:11px;
  color:#252a2d;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(37,42,45,.23);
  box-shadow:0 2px 8px rgba(0,0,0,.04);
  backdrop-filter:blur(2px);
}
.btn-call-soft:hover{
  background:rgba(255,255,255,.94);
  border-color:rgba(11,143,49,.42);
  box-shadow:0 6px 16px rgba(0,0,0,.07);
}

/* HERO: full-width decorative continuation for large screens,
   while the actual composition remains constrained to the site container. */
.hero-wrap{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
@media(min-width:1181px){
  .hero-wrap::before{
    content:"";
    position:absolute;
    z-index:-2;
    inset:0;
    background:
      linear-gradient(90deg,#fff 0%,rgba(255,255,255,.42) 9%,rgba(255,255,255,0) 20%,rgba(255,255,255,0) 80%,rgba(255,255,255,.45) 91%,#fff 100%),
      url("assets/img/hero.webp") center/auto 100% no-repeat;
    opacity:.46;
    filter:saturate(.92);
  }
  .hero-wrap::after{
    content:"";
    position:absolute;
    z-index:-1;
    left:0;right:0;bottom:0;
    height:115px;
    background:linear-gradient(180deg,rgba(255,255,255,0),#fff 96%);
    pointer-events:none;
  }
}

/* Services heading creates the same section logic as other blocks */
.services{
  padding-top:24px;
}
.services .accent{
  margin-bottom:18px;
}

/* CONTACTS */
.contacts-section{
  padding-top:12px;
  padding-bottom:30px;
}
.contacts-layout{
  display:grid;
  grid-template-columns:36% minmax(0,1fr);
  gap:18px;
  align-items:stretch;
}
.contacts-card,
.map-card{
  border-radius:6px;
  overflow:hidden;
  box-shadow:0 0 0 1px #e5e8e8;
  background:#f4f5f5;
}
.contacts-card{
  padding:22px 24px 20px;
}
.contacts-card h3{
  margin:0 0 7px;
  font-size:21px;
  line-height:1.1;
  color:var(--green);
}
.contacts-lead{
  margin:0 0 18px;
  color:#62696c;
  font-size:11px;
  line-height:1.45;
  max-width:320px;
}
.contact-row{
  display:grid;
  grid-template-columns:24px minmax(0,1fr);
  gap:12px;
  align-items:start;
  padding:11px 0;
  border-top:1px solid #e2e5e5;
}
.contact-row img{
  width:22px;
  height:22px;
  object-fit:contain;
}
.contact-row span{
  display:block;
  margin-bottom:3px;
  color:#7b8285;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.07em;
}
.contact-row strong,
.contact-row a{
  color:#242a2d;
  font-size:12px;
  line-height:1.38;
  font-weight:650;
}
.contacts-actions{
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:10px;
  margin-top:15px;
}
.contact-btn{
  min-width:0;
  height:42px;
  padding:0 12px;
  font-size:10.5px;
}
.contact-btn img{
  width:16px;
  height:16px;
}
.contact-btn-primary{
  color:#fff;
  background:
    linear-gradient(180deg,rgba(18,166,60,.90),rgba(7,126,42,.92)),
    url("assets/img/button-concrete.webp") center/cover no-repeat;
  border:1px solid rgba(0,92,31,.54);
}
.contact-btn-secondary{
  color:#252a2d;
  background:#fff;
  border:1px solid #cfd4d5;
}
.map-card{
  min-height:340px;
  background:#e8eaea;
}
.map-card iframe{
  display:block;
  width:100%;
  height:100%;
  min-height:340px;
  border:0;
}

/* Retain gentle motion for the new block */
.contacts-card,
.map-card{
  transition:transform .32s var(--ease-rioks),box-shadow .32s var(--ease-rioks);
}
.contacts-card:hover,
.map-card:hover{
  transform:translateY(-3px);
  box-shadow:0 14px 28px rgba(18,33,23,.08);
}

/* RESPONSIVE */
@media(max-width:1020px){
  .header-top{
    align-items:center !important;
    padding-top:0;
    height:74px;
  }
  .contacts-layout{
    grid-template-columns:42% minmax(0,1fr);
  }
}
@media(max-width:760px){
  .header-top{
    height:68px;
  }
  .contacts-layout{
    grid-template-columns:1fr;
  }
  .map-card,
  .map-card iframe{
    min-height:300px;
  }
  .contacts-actions{
    grid-template-columns:1fr;
  }
}


/* ============================================================
   v14 — reviews, requisites, more air between logical sections
   ============================================================ */

/* More vertical air between the page's logical blocks.
   Inner content density stays compact. */
.services.section{
  padding-top:30px;
  padding-bottom:38px;
}
.why.section{
  padding-top:28px;
  padding-bottom:42px;
}
.docs.section{
  padding-top:28px;
  padding-bottom:42px;
}
.reviews.section{
  padding-top:26px;
  padding-bottom:46px;
}
.contacts-section.section{
  padding-top:28px;
  padding-bottom:48px;
}

/* Reviews heading */
.section-head-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:24px;
  margin-bottom:20px;
}
.section-head-row .accent{
  margin-bottom:10px;
}
.section-intro{
  margin:0;
  font-size:11px;
  line-height:1.45;
  color:#6a7174;
}
.reviews-all-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:4px;
  padding:10px 13px;
  border:1px solid #cfd4d5;
  border-radius:4px;
  background:#fff;
  color:#2a3033;
  font-size:10.5px;
  font-weight:700;
  white-space:nowrap;
}
.reviews-all-link span{
  font-size:17px;
  line-height:1;
}
.reviews-all-link:hover{
  border-color:var(--green);
  color:var(--green);
  transform:translateY(-2px);
}

/* Reviews cards: 3 columns, 6 real reviews */
.reviews-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}
.review-card{
  min-width:0;
  min-height:210px;
  display:flex;
  flex-direction:column;
  padding:18px 18px 16px;
  border:1px solid #e5e8e8;
  border-radius:6px;
  background:#fff;
  box-shadow:0 5px 18px rgba(21,31,25,.035);
  transition:
    transform .3s var(--ease-rioks),
    box-shadow .3s var(--ease-rioks),
    border-color .3s ease;
}
.review-card:hover{
  transform:translateY(-4px);
  border-color:#d6dcda;
  box-shadow:0 14px 28px rgba(18,33,23,.08);
}
.review-top{
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  margin-bottom:13px;
}
.review-avatar{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#eef6f0;
  color:var(--green);
  font-size:11px;
  font-weight:800;
}
.review-author{
  min-width:0;
}
.review-author strong{
  display:block;
  margin-bottom:3px;
  font-size:11.5px;
  line-height:1.2;
}
.review-author span{
  display:block;
  color:#81878a;
  font-size:9.5px;
}
.review-stars{
  color:#f5b700;
  font-size:12px;
  letter-spacing:1px;
  white-space:nowrap;
}
.review-card p{
  margin:0 0 16px;
  color:#3d4346;
  font-size:10.5px;
  line-height:1.52;
}
.review-source{
  margin-top:auto;
  padding-top:11px;
  border-top:1px solid #eef0f0;
  color:#8a9092;
  font-size:9px;
}
.reviews-mobile-link{
  display:none;
}

/* Company-card / requisites row */
.contact-row-doc img{
  filter:saturate(.75);
}
.contact-row-doc small{
  display:block;
  margin-top:3px;
  color:#7b8285;
  font-size:9.5px;
  line-height:1.35;
}
.company-card-link{
  display:inline-flex;
  align-items:center;
  gap:5px;
  color:var(--green) !important;
}
.company-card-link:hover{
  text-decoration:underline;
}

/* Keep the contacts card balanced after adding requisites */
.contacts-card{
  padding-bottom:18px;
}
.contacts-actions{
  margin-top:14px;
}

/* Slightly clearer transition from contacts into CTA */
.contacts-section + .cta{
  margin-top:4px;
}

/* Desktop breathing room */
@media(min-width:1021px){
  .services.section,
  .why.section,
  .docs.section,
  .reviews.section,
  .contacts-section.section{
    scroll-margin-top:125px;
  }
}

@media(max-width:1020px){
  .reviews-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .section-head-row{
    align-items:end;
  }
}

@media(max-width:760px){
  .services.section,
  .why.section,
  .docs.section,
  .reviews.section,
  .contacts-section.section{
    padding-top:24px;
    padding-bottom:32px;
  }
  .section-head-row{
    display:block;
    margin-bottom:16px;
  }
  .reviews-all-link{
    display:none;
  }
  .reviews-grid{
    grid-template-columns:1fr;
    gap:16px;
  }
  .review-card{
    min-height:0;
  }
  .reviews-mobile-link{
    display:block;
    margin-top:16px;
  }
  .reviews-mobile-link .btn{
    width:100%;
  }
  .review-top{
    grid-template-columns:38px minmax(0,1fr);
  }
  .review-stars{
    grid-column:2;
    justify-self:start;
  }
}


/* ============================================================
   v15 — section striping / better visual separation of blocks
   ============================================================ */
.services.section,
.why.section,
.docs.section,
.reviews.section,
.contacts-section.section,
.cta,
footer{position:relative}

.services.section{background:#fff}

.why.section{
  background:linear-gradient(180deg,#fbfbfb 0%,#f5f6f6 100%);
  border-top:1px solid #eef1f1;
  border-bottom:1px solid #eef1f1;
}

.docs.section{
  background:linear-gradient(180deg,#f4f7f5 0%,#edf2ee 100%);
  border-top:1px solid #dfe7e1;
  border-bottom:1px solid #dfe7e1;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75), inset 0 -1px 0 rgba(255,255,255,.55);
}
.docs .container{position:relative}
.docs .accent{margin-bottom:20px}
.docs .doc-count,
.docs .doc,
.docs .all-docs{box-shadow:0 0 0 1px rgba(212,220,214,.75)}
.docs .all-docs{background:rgba(255,255,255,.82)}

.reviews.section{background:#fff}

.contacts-section.section{
  background:linear-gradient(180deg,#fafbfb 0%,#f3f5f5 100%);
  border-top:1px solid #eceff0;
  border-bottom:1px solid #eceff0;
}

.services.section{padding-top:34px;padding-bottom:42px}
.why.section{padding-top:34px;padding-bottom:46px}
.docs.section{padding-top:34px;padding-bottom:46px}
.reviews.section{padding-top:34px;padding-bottom:48px}
.contacts-section.section{padding-top:34px;padding-bottom:50px}

.why-card,
.contacts-card,
.map-card{
  box-shadow:0 0 0 1px #e4e8e6,0 8px 22px rgba(18,33,23,.03);
}
.review-card{box-shadow:0 5px 18px rgba(21,31,25,.04)}

@media(max-width:760px){
  .services.section{padding-top:26px;padding-bottom:34px}
  .why.section{padding-top:26px;padding-bottom:34px}
  .docs.section{padding-top:26px;padding-bottom:34px}
  .reviews.section{padding-top:26px;padding-bottom:34px}
  .contacts-section.section{padding-top:26px;padding-bottom:36px}
}


/* ============================================================
   v16 — internal service pages
   ============================================================ */
.inner-page{background:#fff}
.inner-hero-wrap{
  position:relative;
  overflow:hidden;
  background:#f6f7f7;
}
.inner-hero{
  min-height:390px;
  position:relative;
  overflow:hidden;
  border-radius:0;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
}
.inner-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.92) 31%,rgba(255,255,255,.58) 48%,rgba(255,255,255,.08) 68%,rgba(255,255,255,0) 100%);
}
.inner-hero::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:72px;
  background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.84));
}
.inner-hero-copy{
  position:relative;
  z-index:2;
  width:520px;
  max-width:58%;
  padding:58px 0 48px;
}
.inner-hero-kicker{
  display:inline-block;
  margin-bottom:12px;
  color:var(--green);
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.inner-hero h1{
  margin:0 0 14px;
  font-size:46px;
  line-height:1.02;
  letter-spacing:-1.6px;
  font-weight:800;
}
.inner-hero p{
  max-width:470px;
  margin:0 0 22px;
  color:#3f4649;
  font-size:15px;
  line-height:1.45;
}
.inner-hero-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.inner-hero-actions .btn{
  height:48px;
  padding:0 18px;
  font-size:12px;
}
.inner-hero-actions .btn-hero-call{
  min-width:145px;
}
.hero-concrete{background-image:url("assets/img/service-concrete.webp")}
.hero-zhbi{background-image:url("assets/img/service-zhbi.webp")}
.hero-equipment{background-image:url("assets/img/service-equipment.webp")}
.hero-materials{background-image:url("assets/img/service-materials.webp")}

.inner-content-section{
  padding:46px 0;
}
.inner-content-section.alt{
  background:linear-gradient(180deg,#fafbfb,#f4f6f5);
  border-top:1px solid #edf0ef;
  border-bottom:1px solid #edf0ef;
}
.inner-lead{
  max-width:860px;
  margin:0;
  color:#4f5659;
  font-size:14px;
  line-height:1.65;
}
.info-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  margin-top:24px;
}
.info-card{
  min-width:0;
  padding:20px;
  border:1px solid #e4e8e6;
  border-radius:6px;
  background:#fff;
  box-shadow:0 8px 22px rgba(18,33,23,.035);
}
.info-card h3{
  margin:0 0 10px;
  font-size:15px;
  line-height:1.2;
}
.info-card p,
.info-card li{
  color:#5d6568;
  font-size:11px;
  line-height:1.5;
}
.info-card ul{
  margin:0;
  padding-left:18px;
}
.info-card strong{
  color:#202628;
}
.product-columns{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-top:24px;
}
.product-group{
  padding:20px;
  border-radius:6px;
  background:#f4f5f5;
  border:1px solid #e4e7e7;
}
.product-group h3{
  margin:0 0 14px;
  font-size:15px;
}
.product-list{
  display:grid;
  gap:8px;
}
.product-list div{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding-bottom:7px;
  border-bottom:1px solid #e0e3e3;
  font-size:11px;
  line-height:1.25;
}
.product-list div:last-child{border-bottom:0;padding-bottom:0}
.product-list span:last-child{
  color:#6e7578;
  text-align:right;
}
.feature-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px 22px;
  margin-top:24px;
}
.feature-row{
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  gap:12px;
  align-items:start;
  padding:16px 0;
  border-top:1px solid #e7eaea;
}
.feature-row img{
  width:36px;
  height:36px;
  object-fit:contain;
}
.feature-row h3{
  margin:0 0 5px;
  font-size:13px;
}
.feature-row p{
  margin:0;
  color:#636a6d;
  font-size:10.5px;
  line-height:1.48;
}
.warning-box{
  margin-top:24px;
  padding:22px 24px;
  border-radius:6px;
  background:#f4f5f5;
  border-left:4px solid var(--green);
}
.warning-box h3{
  margin:0 0 12px;
  font-size:16px;
}
.warning-box ul{
  margin:0;
  padding-left:18px;
  display:grid;
  gap:8px;
}
.warning-box li{
  color:#535a5d;
  font-size:11px;
  line-height:1.5;
}
.equipment-table{
  width:100%;
  margin-top:24px;
  border-collapse:collapse;
  overflow:hidden;
  border-radius:6px;
  background:#fff;
  box-shadow:0 0 0 1px #e3e7e5;
}
.equipment-table th,
.equipment-table td{
  padding:11px 14px;
  border-bottom:1px solid #e7eaea;
  text-align:left;
  vertical-align:top;
  font-size:11px;
  line-height:1.35;
}
.equipment-table th{
  background:#f1f4f2;
  color:#2b3133;
  font-weight:800;
}
.equipment-table tr:last-child td{border-bottom:0}
.equipment-table td:first-child{
  width:54px;
  color:var(--green);
  font-weight:800;
}
.inner-cta{
  padding:32px 0;
}
.inner-cta-card{
  display:grid;
  grid-template-columns:1fr auto;
  gap:24px;
  align-items:center;
  padding:26px 28px;
  border-radius:7px;
  color:#fff;
  background:
    linear-gradient(90deg,rgba(8,114,39,.94),rgba(7,85,32,.84)),
    url("assets/img/cta.webp") center/cover no-repeat;
}
.inner-cta-card h2{
  margin:0 0 7px;
  color:#fff;
  font-size:23px;
}
.inner-cta-card p{
  margin:0;
  color:rgba(255,255,255,.88);
  font-size:11px;
}
.inner-cta-card .btn{
  min-width:210px;
  height:48px;
  border:1px solid rgba(255,255,255,.65);
  color:#fff;
  background:rgba(0,0,0,.08);
}
.inner-cta-card .btn:hover{background:rgba(255,255,255,.1)}
.page-source-note{
  margin-top:16px;
  color:#8a9092;
  font-size:9px;
}
.inner-page .contacts-section{
  margin-top:0;
}

@media(min-width:1181px){
  .inner-hero-wrap::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.22) 12%,rgba(255,255,255,0) 26%,rgba(255,255,255,0) 74%,rgba(255,255,255,.28) 89%,#fff 100%);
    pointer-events:none;
  }
}
@media(max-width:1020px){
  .inner-hero{min-height:350px}
  .inner-hero-copy{max-width:64%;padding-top:48px}
  .inner-hero h1{font-size:39px}
  .info-grid,.product-columns{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .inner-hero{
    min-height:430px;
    background-position:62% center;
  }
  .inner-hero::before{
    background:linear-gradient(180deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.84) 53%,rgba(255,255,255,.26) 100%);
  }
  .inner-hero-copy{
    width:100%;
    max-width:100%;
    padding:34px 0 120px;
  }
  .inner-hero h1{font-size:36px}
  .inner-hero p{font-size:13px}
  .info-grid,.product-columns,.feature-list{grid-template-columns:1fr}
  .inner-content-section{padding:32px 0}
  .equipment-table{display:block;overflow-x:auto}
  .inner-cta-card{grid-template-columns:1fr}
  .inner-cta-card .btn{width:100%}
}


/* ============================================================
   v18 — approved experiment bundle over return point v16
   ============================================================ */

/* Sticky compact header */
.site-header{position:sticky;top:0;z-index:80;box-shadow:0 1px 0 rgba(0,0,0,.05);transition:box-shadow .25s ease}
.header-top{height:70px!important;padding-top:0!important;display:grid!important;grid-template-columns:190px minmax(350px,1fr) auto!important;gap:24px!important;align-items:center!important}
.header-caption{display:none!important}
.brand img{width:172px!important;transition:width .28s var(--ease-rioks)}
.header-address{align-items:center!important;white-space:nowrap;font-size:11px!important;color:#42484b}
.header-address img{width:21px!important;height:21px!important;flex:0 0 21px!important;margin:0!important}
.header-right{width:auto!important;display:flex!important;flex-direction:row!important;align-items:center!important;justify-self:end!important;gap:12px!important}
.header-phone{justify-content:flex-start!important;height:auto!important;gap:8px!important}
.header-phone a{font-size:18px!important}
.btn-call-soft{width:auto!important;min-width:135px;height:31px!important;padding:0 14px!important}
.nav{transition:height .28s var(--ease-rioks)}
.site-header.is-compact{box-shadow:0 8px 22px rgba(20,30,24,.08)}
.site-header.is-compact .header-top{height:50px!important}
.site-header.is-compact .brand img{width:116px!important}
.site-header.is-compact .header-address{font-size:10px!important}
.site-header.is-compact .header-address img{width:17px!important;height:17px!important;flex-basis:17px!important}
.site-header.is-compact .header-phone img{width:18px!important;height:18px!important;flex-basis:18px!important}
.site-header.is-compact .header-phone a{font-size:15px!important}
.site-header.is-compact .btn-call-soft{height:28px!important;font-size:10px!important;min-width:118px}
.site-header.is-compact .nav{height:32px!important}
.site-header.is-compact .nav a{font-size:10px!important}

/* Quick icons: black, same visual height based on tight-cropped graphics */
.quick-item img{height:36px!important;width:auto!important;max-width:none!important;filter:brightness(0)!important;opacity:.92}
.quick-item{gap:13px!important}

/* Services: green titles, calm right-aligned text link, no green circle */
.card-body{display:flex;flex-direction:column}
.card h3.service-title{color:var(--green)!important}
.card .service-more{margin-top:auto!important;align-self:flex-end!important;display:inline-flex!important;gap:7px!important;align-items:center!important;font-weight:650!important;color:#2e3436!important}
.card .service-more .service-more-arrow{width:auto!important;height:auto!important;border:0!important;border-radius:0!important;background:none!important;color:var(--green)!important;font-size:16px!important;display:inline!important;transform:none!important}
.card:hover .service-more{color:var(--green)!important}

/* Documents — vertical A4 rhythm */
.docs-row-a4{display:grid!important;grid-template-columns:112px repeat(2,86px) 112px repeat(4,86px) 122px!important;gap:10px!important;align-items:stretch!important}
.doc-a4,.doc-count-a4,.all-docs-a4{height:136px!important;border-radius:5px!important}
.doc-a4{background:#fff!important;border:1px solid #dce4de!important;box-shadow:0 4px 15px rgba(25,38,29,.045)!important}
.doc-a4 img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:top!important}
.doc-count-a4{padding:12px!important;background:rgba(255,255,255,.86)!important;border:1px solid #dce4de!important;display:flex!important;flex-direction:column!important;justify-content:space-between!important;color:#202628!important}
.doc-count-a4 .doc-meta{display:block!important}
.doc-count-a4 b{display:block;font-size:44px!important;line-height:.92!important;margin-bottom:3px}
.doc-count-a4 small{font-size:9px!important;padding:0!important}
.doc-category-link{font-size:8.5px;line-height:1.2;color:var(--green);font-weight:700}
.all-docs-a4{align-self:stretch!important;padding:13px!important;background:#fff!important;border:1px solid var(--green)!important;font-size:10px!important;display:flex!important;flex-direction:column!important;justify-content:space-between!important;align-items:flex-start!important;color:#1f2527!important}
.all-docs-a4 img{width:22px!important;height:22px!important;align-self:flex-end}

/* Internal hero high-quality sources */
.hero-concrete-hq{background-image:url("assets/img/hero-concrete-hq.webp")!important}
.hero-zhbi-hq{background-image:url("assets/img/hero-zhbi-hq.webp")!important}

/* Proof links on concrete / zhbi */
.text-link,.quality-proof a{display:inline-flex;margin-top:9px;color:var(--green);font-size:10.5px;font-weight:750}
.quality-proof{margin-top:18px;padding:16px 18px;border-radius:5px;background:#fff;border:1px solid #dfe7e1;display:grid;gap:5px}
.quality-proof strong{font-size:12px}.quality-proof span{font-size:10.5px;color:#646b6e}.quality-proof a{margin-top:4px}
.zhbi-proof{margin-top:22px;max-width:600px}

/* Contacts map: clean coordinate-based map + custom green marker */
.map-card{position:relative;min-height:340px!important}
.kub-map{width:100%;height:100%;min-height:340px;background:#e9eded}
.leaflet-container{font-family:"Inter",Arial,sans-serif}
.kub-marker-wrap{background:transparent!important;border:0!important}
.kub-marker{display:flex;align-items:center;gap:7px;white-space:nowrap;transform:translate(-7px,-14px)}
.kub-marker-pin{width:22px;height:22px;border-radius:50% 50% 50% 0;background:var(--green);transform:rotate(-45deg);box-shadow:0 3px 8px rgba(0,0,0,.2);border:2px solid #fff}
.kub-marker-label{padding:6px 9px;border-radius:4px;background:#fff;color:#1f2527;font-size:10px;font-weight:800;box-shadow:0 3px 10px rgba(0,0,0,.15)}

/* Footer full logo + legal links */
.footer-logo{width:160px!important;max-width:100%;height:auto!important;object-fit:contain!important;object-position:left top!important}
.footer-bottom{align-items:center!important;gap:14px}
.footer-legal{display:flex;gap:14px;flex-wrap:wrap}
.footer-legal a{color:#aeb5b8}.footer-legal a:hover{color:#fff}

/* Full request form */
.modal-box{width:min(540px,100%)!important;padding:28px 30px!important}
.modal-box form{gap:12px!important}
.modal-box select{height:46px;padding:0 12px;border:1px solid #d6d9da;border-radius:4px;background:#fff;color:#333}
.field-label{margin-bottom:-6px;font-size:10px;color:#777;text-transform:uppercase;letter-spacing:.05em}
.consent-check{display:grid;grid-template-columns:18px 1fr;gap:9px;align-items:start;margin-top:3px;font-size:10px;line-height:1.45;color:#60676a}
.consent-check input{width:16px;height:16px;margin:1px 0 0;accent-color:var(--green)}
.consent-check a{color:var(--green);text-decoration:underline;text-underline-offset:2px}
.modal-actions{display:grid;grid-template-columns:1fr 150px;gap:10px;margin-top:4px}
.modal-call{height:56px;border:1px solid #cbd0d1;background:#fff;color:#252a2d}
.modal-call img{width:17px;height:17px}

/* Lightbox navigation */
.lightbox{position:fixed!important}
.lightbox img{max-width:min(920px,82vw)!important;max-height:88vh!important;object-fit:contain}
.lightbox-prev,.lightbox-next{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:58px;border:0;border-radius:6px;background:rgba(255,255,255,.12);color:#fff;font-size:44px;line-height:1;cursor:pointer;backdrop-filter:blur(2px)}
.lightbox-prev{left:24px}.lightbox-next{right:24px}
.lightbox-counter{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);padding:6px 10px;border-radius:20px;background:rgba(0,0,0,.45);color:#fff;font-size:10px}

/* Document archive pages */
.page-title-band{padding:42px 0 36px;background:linear-gradient(180deg,#fafbfb,#f2f5f3);border-bottom:1px solid #e5eae7}
.page-title-band h1{margin:0 0 10px;font-size:36px;line-height:1.05}.page-title-band p{margin:0;max-width:720px;color:#60686b;font-size:12px;line-height:1.55}
.archive-section{padding:42px 0}.archive-section.alt{background:#f5f7f6;border-top:1px solid #e6ebe8}
.archive-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.archive-head-link{margin-top:4px;color:var(--green);font-size:10px;font-weight:750}
.archive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:22px}
.archive-doc{border:1px solid #e0e5e2;border-radius:6px;background:#fff;padding:12px;cursor:pointer;text-align:left;box-shadow:0 7px 22px rgba(23,36,27,.04);transition:transform .28s var(--ease-rioks),box-shadow .28s var(--ease-rioks)}
.archive-doc:hover{transform:translateY(-4px);box-shadow:0 15px 30px rgba(23,36,27,.08)}
.archive-doc img{width:100%;aspect-ratio:210/297;object-fit:cover;object-position:top;border:1px solid #eef0ef;background:#fafafa}
.archive-doc span{display:block;margin-top:10px;font-size:11px;font-weight:700;color:#343a3d}

/* Legal pages */
.legal-section{padding:42px 0}.legal-copy{max-width:900px}.legal-copy h2{margin-top:28px;font-size:20px}.legal-copy h2:first-child{margin-top:0}.legal-copy p{font-size:12px;line-height:1.7;color:#50575a}.legal-copy a{color:var(--green);text-decoration:underline}.legal-note{margin-top:28px;padding:14px 16px;background:#f4f6f5;border-left:3px solid var(--green)}

@media(max-width:1180px){
  .header-top{grid-template-columns:165px minmax(260px,1fr) auto!important;gap:16px!important}.brand img{width:150px!important}.header-address{font-size:10px!important}.header-phone a{font-size:16px!important}.btn-call-soft{min-width:120px!important}
  .docs-row-a4{grid-template-columns:105px repeat(2,80px) 105px repeat(3,80px) 116px!important}.docs-row-a4 .doc-a4:nth-of-type(7){display:none}
}
@media(max-width:1020px){
  .header-top{grid-template-columns:155px 1fr auto!important}.header-address{justify-self:center!important}.header-right{gap:8px!important}.btn-call-soft{display:none!important}
  .docs-row-a4{grid-template-columns:105px repeat(2,1fr) 105px repeat(2,1fr) 116px!important}.docs-row-a4 .doc-a4:nth-of-type(7),.docs-row-a4 .doc-a4:nth-of-type(8){display:none}
  .archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .site-header{position:sticky}.header-top{grid-template-columns:1fr auto!important;height:64px!important}.header-address{display:none!important}.header-right{width:auto!important}.header-phone a{font-size:0!important}.header-phone a::after{content:"+7 (962) 446-12-12";font-size:14px}.site-header.is-compact .header-top{height:54px!important}.site-header.is-compact .brand img{width:112px!important}
  .quick-item img{height:32px!important}
  .docs-row-a4{grid-template-columns:repeat(2,minmax(0,1fr))!important}.doc-a4,.doc-count-a4,.all-docs-a4{height:170px!important}.doc-count-a4,.all-docs-a4{min-height:170px}.all-docs-a4{grid-column:1/-1;height:90px!important;min-height:90px!important}.all-docs-a4{flex-direction:row!important;align-items:center!important}
  .modal-actions{grid-template-columns:1fr}.modal-call{height:50px}.modal-box{padding:24px 20px!important}
  .archive-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.archive-doc{padding:8px}.page-title-band h1{font-size:30px}
  .lightbox-prev,.lightbox-next{width:40px;height:52px;font-size:38px}.lightbox-prev{left:8px}.lightbox-next{right:8px}.lightbox img{max-width:88vw!important;max-height:82vh!important}
  .footer-bottom{align-items:flex-start!important}.footer-legal{gap:8px;flex-direction:column}
}
@media(max-width:430px){.archive-grid{grid-template-columns:1fr}.doc-a4,.doc-count-a4{height:190px!important}}


/* ============================================================
   v20 — confirmed checklist pass
   ============================================================ */

/* HEADER — professional composition */
.site-header{
  position:sticky;
  top:0;
  z-index:95;
  background:#fff;
  box-shadow:0 1px 0 rgba(18,29,22,.06);
}
.header-top{
  height:76px !important;
  padding:0 !important;
  display:grid !important;
  grid-template-columns:190px minmax(360px,1fr) auto !important;
  gap:28px !important;
  align-items:center !important;
}
.brand img{
  width:176px !important;
  height:auto !important;
  transition:width .25s ease;
}
.header-caption{display:none !important;}
.header-address{
  justify-self:center !important;
  display:flex !important;
  align-items:center !important;
  gap:11px !important;
  white-space:nowrap !important;
  color:#51585b !important;
  font-size:12px !important;
  line-height:1.2 !important;
}
.header-address img{
  width:22px !important;
  height:22px !important;
  flex:0 0 22px !important;
  margin:0 !important;
}
.header-right{
  width:auto !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  gap:14px !important;
  justify-self:end !important;
}
.header-phone{
  height:auto !important;
  display:flex !important;
  align-items:center !important;
  gap:9px !important;
  justify-content:flex-start !important;
  padding-right:2px;
}
.header-phone img{
  width:23px !important;
  height:23px !important;
  flex:0 0 23px !important;
}
.header-phone a{
  font-size:18px !important;
  font-weight:800 !important;
  letter-spacing:-.25px !important;
}
.btn-call-soft{
  width:auto !important;
  min-width:152px !important;
  height:38px !important;
  padding:0 18px !important;
  font-size:12px !important;
  border-radius:6px !important;
  color:#303638 !important;
  background:#fff !important;
  border:1px solid #cfd4d6 !important;
  box-shadow:0 2px 8px rgba(20,30,24,.035) !important;
}
.btn-call-soft:hover{
  border-color:#9fa9a3 !important;
  box-shadow:0 6px 15px rgba(20,30,24,.06) !important;
}
.nav{height:38px !important;transition:none !important;}

/* Compact sticky state. Hysteresis in JS prevents repeated toggling/flicker. */
.site-header.is-compact{box-shadow:0 8px 22px rgba(20,30,24,.08);}
.site-header.is-compact .header-top{height:58px !important;}
.site-header.is-compact .brand img{width:126px !important;}
.site-header.is-compact .header-address{font-size:11px !important;}
.site-header.is-compact .header-address img{width:18px !important;height:18px !important;flex-basis:18px !important;}
.site-header.is-compact .header-phone img{width:20px !important;height:20px !important;flex-basis:20px !important;}
.site-header.is-compact .header-phone a{font-size:16px !important;}
.site-header.is-compact .btn-call-soft{height:32px !important;min-width:136px !important;font-size:11px !important;}

/* QUICK ADVANTAGES — black icons with equal visible height */
.quick-item img{
  height:34px !important;
  width:auto !important;
  max-width:none !important;
  padding:0 !important;
  object-fit:contain !important;
  filter:brightness(0) saturate(0) !important;
  opacity:.94 !important;
}
.quick-item b{font-size:12.5px !important;line-height:1.18 !important;}

/* SERVICES — important direction block */
.card-body{
  padding:18px 20px 18px !important;
  min-height:158px !important;
  display:flex !important;
  flex-direction:column !important;
}
.card h3.service-title{
  color:#171b1d !important;
  font-size:19px !important;
  line-height:1.17 !important;
  font-weight:800 !important;
  margin:0 0 10px !important;
}
.card p{
  font-size:12px !important;
  line-height:1.42 !important;
  margin:0 0 18px !important;
}
.card .service-more{
  margin-top:auto !important;
  align-self:flex-end !important;
  font-size:13px !important;
  font-weight:700 !important;
  gap:7px !important;
}
.card .service-more .service-more-arrow{
  width:auto !important;height:auto !important;border:0 !important;border-radius:0 !important;
  background:none !important;color:var(--green) !important;font-size:17px !important;display:inline !important;
}

/* DOCUMENTS — A4 proportions, picture breathing room, compact final CTA */
.docs-row-a4{
  display:grid !important;
  grid-template-columns:128px repeat(2,98px) 128px repeat(4,98px) 150px !important;
  gap:11px !important;
  align-items:stretch !important;
}
.doc-a4,.doc-count-a4{height:148px !important;}
.doc-a4{
  padding:3px !important;
  background:#fff !important;
  border:1px solid #dbe3dd !important;
  box-shadow:0 4px 14px rgba(20,35,25,.045) !important;
}
.doc-a4 img{
  width:100% !important;height:100% !important;object-fit:cover !important;object-position:top center !important;
  border-radius:2px !important;
}
.doc-count-a4{
  padding:13px !important;
  background:rgba(255,255,255,.88) !important;
  border:1px solid #dbe3dd !important;
}
.doc-count-a4 strong{font-size:11px !important;line-height:1.18 !important;}
.doc-count-a4 b{font-size:46px !important;}
.doc-count-a4 small{font-size:10px !important;}
.all-docs-a4{
  height:76px !important;
  min-height:76px !important;
  align-self:end !important;
  padding:13px 14px !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:space-between !important;
  background:#fff !important;
}
.all-docs-a4 span{font-size:11px !important;line-height:1.22 !important;}
.all-docs-a4 img{width:20px !important;height:20px !important;flex:0 0 20px !important;}

/* CONTACTS — Yandex map with custom overlay marker */
.map-card{position:relative !important;min-height:360px !important;overflow:hidden !important;background:#eef1f1 !important;}
.yandex-map-shell{position:relative;width:100%;height:100%;min-height:360px;overflow:hidden;}
.yandex-map-frame{display:block;width:100%;height:100%;min-height:360px;border:0;}
.kub-map-overlay{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-100%);
  display:flex;align-items:center;gap:8px;pointer-events:none;z-index:4;
}
.kub-map-pin{
  width:25px;height:25px;background:var(--green);border:3px solid #fff;
  border-radius:50% 50% 50% 0;transform:rotate(-45deg);box-shadow:0 4px 10px rgba(0,0,0,.22);
}
.kub-map-label{
  padding:7px 10px;border-radius:5px;background:#fff;color:#202628;font-size:11px;font-weight:800;
  box-shadow:0 4px 14px rgba(0,0,0,.16);white-space:nowrap;
}

/* FOOTER — unified white contact icons */
.footer-contact img,.footer-address img{filter:brightness(0) invert(1) !important;opacity:1 !important;}
.footer-contact a[href^="tel"] img{filter:none !important;}
.footer-contact a[href^="tel"] img[src$="phone-white.svg"]{filter:none !important;}
.footer-logo{filter:none !important;}

/* MODAL — unified fields and buttons */
.modal-box{width:min(560px,100%) !important;padding:30px 32px !important;}
.modal-box h3{font-size:23px !important;line-height:1.15 !important;margin:0 0 8px !important;}
.modal-box p{font-size:13px !important;line-height:1.45 !important;margin:0 0 14px !important;}
.modal-box form{gap:12px !important;}
.modal-box input,
.modal-box select{
  height:52px !important;
  padding:0 15px !important;
  font-size:16px !important;
  font-weight:400 !important;
  color:#23292b !important;
  background:#fff !important;
  border:1px solid #d2d7d8 !important;
  border-radius:5px !important;
}
.modal-box input::placeholder{font-size:16px !important;color:#737b7e !important;opacity:1 !important;}
.field-label{
  margin:1px 0 -4px !important;
  font-size:14px !important;
  line-height:1.3 !important;
  color:#737b7e !important;
  text-transform:none !important;
  letter-spacing:0 !important;
}
.consent-check{font-size:11px !important;line-height:1.45 !important;}
.modal-actions{grid-template-columns:minmax(0,1fr) 170px !important;gap:12px !important;}
.modal-actions .btn-green,
.modal-call{
  height:56px !important;
  font-size:15px !important;
  font-weight:700 !important;
  border-radius:6px !important;
}
.modal-call{background:#fff !important;border:1px solid #cfd5d6 !important;color:#272d30 !important;}
.modal-call img{width:19px !important;height:19px !important;}

/* INNER HERO IMAGES */
.hero-concrete-v20{background-image:url("assets/img/hero-concrete-v20.webp") !important;background-position:center center !important;}
.hero-zhbi-v20{background-image:url("assets/img/hero-zhbi-v20.webp") !important;background-position:center center !important;}
.hero-equipment-v20{background-image:url("assets/img/hero-equipment-v20.webp") !important;background-position:center center !important;}
.hero-materials-v20{background-image:url("assets/img/hero-materials-v20.webp") !important;background-position:center center !important;}

/* ARCHIVE DOCUMENTS — keep 2–3 column A4 behavior */
.archive-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
.archive-doc{padding:10px !important;}
.archive-doc img{aspect-ratio:210/297 !important;object-fit:cover !important;object-position:top !important;padding:2px;background:#fff !important;}

@media(max-width:1180px){
  .header-top{grid-template-columns:160px minmax(260px,1fr) auto !important;gap:18px !important;}
  .brand img{width:150px !important;}
  .header-address{font-size:11px !important;}
  .header-phone a{font-size:16px !important;}
  .btn-call-soft{min-width:136px !important;}
  .docs-row-a4{grid-template-columns:118px repeat(2,1fr) 118px repeat(3,1fr) 140px !important;}
}
@media(max-width:1020px){
  .header-top{grid-template-columns:150px 1fr auto !important;height:70px !important;}
  .header-address{justify-self:center !important;}
  .btn-call-soft{display:none !important;}
  .docs-row-a4{grid-template-columns:112px repeat(2,1fr) 112px repeat(2,1fr) 132px !important;}
  .archive-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
}
@media(max-width:760px){
  .header-top{grid-template-columns:1fr auto !important;height:64px !important;gap:10px !important;}
  .header-address{display:none !important;}
  .site-header.is-compact .header-top{height:56px !important;}
  .quick-item img{height:30px !important;}
  .card-body{min-height:0 !important;}
  .card h3.service-title{font-size:22px !important;}
  .docs-row-a4{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .doc-count-a4,.doc-a4{height:174px !important;}
  .all-docs-a4{grid-column:1/-1 !important;height:82px !important;min-height:82px !important;align-self:stretch !important;}
  .map-card,.yandex-map-shell,.yandex-map-frame{min-height:300px !important;}
  .modal-actions{grid-template-columns:1fr !important;}
  .modal-call{height:52px !important;}
}
@media(max-width:430px){
  .archive-grid{grid-template-columns:1fr !important;}
}


/* v20 responsive header correction */
@media(max-width:1020px){
  .header-top{grid-template-columns:150px 1fr auto !important;gap:12px !important;}
  .header-address{display:none !important;}
  .header-right{justify-self:end !important;}
}
@media(max-width:760px){
  .header-top{grid-template-columns:1fr auto auto !important;}
  .header-right{justify-self:end !important;}
  .burger{justify-self:end !important;}
}


/* ============================================================
   v21 — bugfix pass after v20
   ============================================================ */

/* Prevent accidental horizontal page expansion / browser mobile auto-scaling */
html, body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
}
img, iframe, video{
  max-width:100%;
}

/* Document archive: show each sheet completely from top to bottom */
.archive-grid{
  align-items:start;
}
.archive-doc{
  overflow:hidden;
}
.archive-doc img{
  width:100% !important;
  height:auto !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  object-position:center top !important;
  padding:3px !important;
  background:#fff !important;
  border:1px solid #eef1ef !important;
}
.archive-doc span{
  margin-top:10px !important;
}

/* Main page document previews also keep the actual page fully visible */
.doc-a4 img{
  object-fit:contain !important;
  object-position:center top !important;
  background:#fff !important;
}

/* Concrete quality block: positive proof and educational signs are separate */
.quality-compare{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  margin-top:26px;
}
.quality-good,
.quality-bad{
  min-width:0;
  padding:24px 26px;
  border-radius:7px;
}
.quality-good{
  background:linear-gradient(180deg,#f4faf6 0%,#edf6f0 100%);
  border:1px solid #d9e9dd;
  border-left:4px solid var(--green);
}
.quality-bad{
  background:#f4f5f5;
  border:1px solid #e1e5e4;
}
.quality-good h3,
.quality-bad h3{
  margin:0 0 12px;
  font-size:17px;
  line-height:1.25;
}
.quality-good p{
  margin:0;
  color:#535b5e;
  font-size:11.5px;
  line-height:1.55;
}
.quality-good .text-link{
  margin-top:14px;
  font-size:11px;
}
.quality-bad ul{
  margin:0;
  padding-left:18px;
  display:grid;
  gap:9px;
}
.quality-bad li{
  color:#535a5d;
  font-size:11px;
  line-height:1.5;
}

/* Contacts: real Yandex marker is part of the map itself */
.map-card{
  min-height:360px !important;
}
.yandex-map-frame{
  display:block;
  width:100%;
  height:100%;
  min-height:360px;
  border:0;
}

/* Retire the old fixed overlay mechanism completely */
.yandex-map-shell,
.kub-map-overlay,
.kub-map-pin,
.kub-map-label{
  display:contents;
}

/* Mobile layout hardening */
@media(max-width:760px){
  .container{
    width:calc(100% - 24px) !important;
    max-width:100% !important;
  }

  .site-header{
    width:100%;
    max-width:100%;
  }
  .header-top{
    grid-template-columns:minmax(0,1fr) auto auto !important;
    gap:8px !important;
    width:calc(100% - 24px) !important;
  }
  .brand{
    min-width:0;
  }
  .brand img{
    width:128px !important;
    max-width:100% !important;
  }
  .header-right{
    min-width:0 !important;
    gap:0 !important;
  }
  .header-phone{
    min-width:0 !important;
  }
  .header-phone a{
    display:none !important;
  }
  .header-phone img{
    width:22px !important;
    height:22px !important;
    flex-basis:22px !important;
  }
  .burger{
    display:block !important;
    width:38px;
    height:38px;
    padding:0;
    flex:0 0 38px;
  }

  .nav.open{
    width:100vw;
    max-width:100vw;
    overflow:hidden;
  }
  .nav-row{
    width:calc(100% - 24px) !important;
  }

  .hero,
  .inner-hero{
    width:100%;
    max-width:100%;
    overflow:hidden;
  }
  .inner-hero-copy{
    max-width:100% !important;
  }

  .quick-row,
  .cards,
  .why-layout,
  .why-list,
  .reviews-grid,
  .contacts-layout,
  .quality-compare{
    min-width:0;
    max-width:100%;
  }

  .quality-compare{
    grid-template-columns:1fr;
  }

  .contacts-actions{
    grid-template-columns:1fr !important;
  }

  .map-card,
  .yandex-map-frame{
    min-height:300px !important;
  }

  .cta-inner,
  .cta-actions,
  .inner-cta-card{
    min-width:0;
    max-width:100%;
  }
  .btn,
  .btn-lg,
  .btn-hero,
  .modal-call{
    max-width:100%;
  }

  .modal{
    padding:12px !important;
  }
  .modal-box{
    width:100% !important;
    max-width:100% !important;
    padding:22px 16px !important;
  }
  .modal-box input,
  .modal-box select{
    width:100%;
    max-width:100%;
  }

  .archive-grid{
    grid-template-columns:1fr !important;
  }
  .archive-doc{
    width:100%;
  }
}

/* Slightly wider mobile/tablet breakpoint safety */
@media(min-width:761px) and (max-width:1020px){
  .container{
    width:calc(100% - 32px) !important;
  }
  .header-top{
    width:calc(100% - 32px) !important;
  }
}


/* ============================================================
   v21.1 HOTFIX — document archive must show full A4 sheets
   Root cause: .archive-doc also had class .doc, and .doc height:106px
   was clipping the vertical document previews.
   ============================================================ */
.archive-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:22px !important;
  align-items:start !important;
}
.archive-doc.doc{
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
  display:flex !important;
  flex-direction:column !important;
  padding:12px !important;
  border:1px solid #e0e5e2 !important;
  border-radius:6px !important;
  background:#fff !important;
  text-align:left !important;
}
.archive-doc.doc img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  aspect-ratio:400 / 565 !important;
  object-fit:contain !important;
  object-position:center top !important;
  padding:3px !important;
  background:#fff !important;
  border:1px solid #eef0ef !important;
  border-radius:3px !important;
}
.archive-doc.doc span{
  display:block !important;
  margin-top:10px !important;
  font-size:11px !important;
  line-height:1.3 !important;
  font-weight:700 !important;
  color:#343a3d !important;
}
@media(max-width:1020px){
  .archive-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
}
@media(max-width:760px){
  .archive-grid{grid-template-columns:1fr !important;gap:16px !important;}
  .archive-doc.doc{padding:10px !important;}
}


/* ============================================================
   v22 — approved UX/mobile refinement pass
   ============================================================ */

/* Global brand rule: KUB-SK must never split between lines */
.brand-nowrap{white-space:nowrap !important;display:inline-block;}

/* Service cards: entire block clickable, calmer 'Подробнее', green title on hover */
.service-card-link{
  display:flex !important;
  flex-direction:column !important;
  color:inherit !important;
  cursor:pointer !important;
}
.service-card-link>img{flex:0 0 auto;}
.service-card-link .card-body{flex:1 1 auto;}
.service-card-link .service-title{
  transition:color .24s ease !important;
}
.service-card-link:hover .service-title{
  color:var(--green) !important;
}
.service-card-link .service-more{
  margin-top:auto !important;
  align-self:flex-end !important;
  color:#62696c !important;
  font-size:12px !important;
  font-weight:400 !important;
  line-height:1.35 !important;
  white-space:nowrap !important;
}
.service-card-link:hover .service-more{color:#343a3d !important;}

/* Footer: use exact colored header logo, no recolor/filter */
.footer-logo{
  width:150px !important;
  height:auto !important;
  filter:none !important;
  opacity:1 !important;
  object-fit:contain !important;
}

/* Inner hero buttons: one geometry, different emphasis */
.inner-hero-actions{
  align-items:stretch !important;
}
.inner-hero-actions .btn,
.inner-hero-actions .btn-hero-call{
  height:50px !important;
  min-height:50px !important;
  padding:0 18px !important;
  border-radius:6px !important;
  font-size:12px !important;
  font-weight:700 !important;
  line-height:1 !important;
  box-sizing:border-box !important;
}
.inner-hero-actions .btn-green,
.inner-hero-actions .btn-hero-call{
  min-width:188px !important;
}

/* Internal CTA backgrounds: relevant image fills the complete card */
.inner-cta-card{
  position:relative !important;
  overflow:hidden !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
}
.inner-cta-card.cta-concrete{
  background-image:linear-gradient(90deg,rgba(7,108,37,.92),rgba(10,91,38,.76)),url("assets/img/hero.webp") !important;
  background-position:center 58% !important;
}
.inner-cta-card.cta-zhbi{
  background-image:linear-gradient(90deg,rgba(7,108,37,.92),rgba(10,91,38,.76)),url("assets/img/hero-zhbi-v20.webp") !important;
  background-position:center center !important;
}
.inner-cta-card.cta-equipment{
  background-image:linear-gradient(90deg,rgba(7,108,37,.92),rgba(10,91,38,.76)),url("assets/img/hero-equipment-v20.webp") !important;
  background-position:center center !important;
}
.inner-cta-card.cta-materials{
  background-image:linear-gradient(90deg,rgba(7,108,37,.92),rgba(10,91,38,.76)),url("assets/img/hero-materials-v20.webp") !important;
  background-position:center center !important;
}

/* Contacts secondary action is route building, not duplicate map-open action */
.contact-btn-secondary{font-weight:600 !important;}

/* Mobile menu is a true overlay above page content */
@media(max-width:760px){
  body.menu-open{overflow:hidden !important;}

  .site-header{
    z-index:200 !important;
    overflow:visible !important;
  }
  .header-top{
    position:relative !important;
    z-index:202 !important;
    background:#fff !important;
  }
  .nav{
    display:none !important;
  }
  .nav.open{
    display:block !important;
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    top:64px !important;
    bottom:0 !important;
    width:100% !important;
    height:auto !important;
    max-width:none !important;
    z-index:201 !important;
    background:rgba(255,255,255,.99) !important;
    border-top:1px solid #e7eaea !important;
    overflow-y:auto !important;
    overscroll-behavior:contain !important;
    box-shadow:0 18px 30px rgba(20,30,24,.10) !important;
  }
  .nav.open .nav-row{
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    padding:12px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    background:#fff !important;
  }
  .nav.open a{
    min-height:48px !important;
    justify-content:flex-start !important;
    padding:0 14px !important;
    border-bottom:1px solid #eef0f0 !important;
    font-size:14px !important;
    color:#1d2326 !important;
    background:#fff !important;
  }
  .nav.open a.active{
    color:var(--green) !important;
    font-weight:800 !important;
  }
  .nav.open a::after{display:none !important;}

  /* Internal hero buttons equal width/height on mobile */
  .inner-hero-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    width:min(100%,320px) !important;
  }
  .inner-hero-actions .btn,
  .inner-hero-actions .btn-hero-call{
    width:100% !important;
    min-width:0 !important;
    height:50px !important;
    min-height:50px !important;
    font-size:13px !important;
  }

  /* Mobile CTA: image covers the whole height and is positioned per direction */
  .inner-cta{padding:22px 0 !important;}
  .inner-cta-card{
    min-height:260px !important;
    padding:28px 24px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-end !important;
    gap:22px !important;
    background-size:cover !important;
  }
  .inner-cta-card.cta-concrete{background-position:64% center !important;}
  .inner-cta-card.cta-zhbi{background-position:58% center !important;}
  .inner-cta-card.cta-equipment{background-position:58% center !important;}
  .inner-cta-card.cta-materials{background-position:50% center !important;}
  .inner-cta-card h2{font-size:26px !important;line-height:1.08 !important;}
  .inner-cta-card p{font-size:12px !important;line-height:1.45 !important;}
  .inner-cta-card .btn{
    width:100% !important;
    min-width:0 !important;
    height:52px !important;
    font-size:14px !important;
  }

  /* Footer logo remains exact color logo */
  .footer-logo{width:142px !important;}

  /* Main services remain fully tappable */
  .service-card-link{width:100% !important;}
  .service-card-link .service-more{font-size:12px !important;}
}


/* ============================================================
   v23 — mobile unification pass based on internal-page layout
   ============================================================ */

/* Optional archive title: no autogenerated labels means no reserved gap */
.archive-doc.doc span:empty{display:none !important;}

/* Mobile-only control hidden on desktop */
.reviews-more-mobile{display:none;}

@media(max-width:760px){
  /* ---------- Shared mobile page width ---------- */
  body{background:#fff !important;}
  .container{width:calc(100% - 28px) !important;max-width:none !important;margin-left:auto !important;margin-right:auto !important;}

  /* ---------- Internal-page hero: full-bleed image, padded text ---------- */
  .inner-hero-wrap{background:#fff !important;overflow:hidden !important;}
  .inner-hero-wrap>.container{width:100% !important;margin:0 !important;padding:0 !important;}
  .inner-hero{
    width:100% !important;
    max-width:100% !important;
    min-height:540px !important;
    border-radius:0 !important;
    background-size:cover !important;
    background-repeat:no-repeat !important;
  }
  .inner-hero::before{
    background:linear-gradient(180deg,
      rgba(255,255,255,.97) 0%,
      rgba(255,255,255,.94) 32%,
      rgba(255,255,255,.80) 54%,
      rgba(255,255,255,.22) 82%,
      rgba(255,255,255,0) 100%) !important;
  }
  .inner-hero::after{height:70px !important;background:linear-gradient(180deg,rgba(255,255,255,0),#fff 100%) !important;}
  .inner-hero-copy{
    width:100% !important;
    max-width:100% !important;
    padding:48px 22px 170px !important;
  }
  .inner-hero-kicker{font-size:12px !important;margin-bottom:12px !important;}
  .inner-hero h1{font-size:40px !important;line-height:1.02 !important;letter-spacing:-1.2px !important;margin-bottom:14px !important;}
  .inner-hero p{font-size:15px !important;line-height:1.5 !important;max-width:100% !important;margin-bottom:24px !important;}
  .inner-hero-actions{
    width:min(100%,360px) !important;
    margin:0 auto !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }
  .inner-hero-actions .btn,
  .inner-hero-actions .btn-hero-call{
    width:100% !important;
    height:54px !important;
    min-height:54px !important;
    justify-content:center !important;
    margin:0 auto !important;
    font-size:14px !important;
  }

  /* ---------- Main hero: use the good internal-page mobile pattern ---------- */
  .hero-wrap{background:#fff !important;overflow:hidden !important;}
  .hero-wrap>.container{width:100% !important;margin:0 !important;padding:0 !important;}
  .hero{
    width:100% !important;
    min-height:540px !important;
    background-size:cover !important;
    background-position:67% center !important;
  }
  .hero::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    background:linear-gradient(180deg,
      rgba(255,255,255,.98) 0%,
      rgba(255,255,255,.95) 30%,
      rgba(255,255,255,.82) 52%,
      rgba(255,255,255,.28) 80%,
      rgba(255,255,255,0) 100%);
    pointer-events:none;
  }
  .hero::after{z-index:1 !important;height:64px !important;}
  .hero-copy{
    position:relative !important;
    z-index:2 !important;
    top:auto !important;
    left:auto !important;
    transform:none !important;
    width:100% !important;
    max-width:100% !important;
    padding:42px 22px 165px !important;
  }
  .hero h1{font-size:40px !important;line-height:1.02 !important;letter-spacing:-1.35px !important;margin-bottom:14px !important;}
  .hero p{font-size:15px !important;line-height:1.45 !important;margin-bottom:24px !important;}
  .hero-buttons{
    width:min(100%,360px) !important;
    margin:0 auto !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }
  .hero-buttons .btn-green,
  .hero-buttons .btn-hero-call{
    width:100% !important;
    min-width:0 !important;
    height:54px !important;
    min-height:54px !important;
    justify-content:center !important;
    font-size:14px !important;
  }

  /* Quick advantages follow hero cleanly */
  .quick-wrap{margin-top:-22px !important;position:relative !important;z-index:5 !important;}
  .quick-row{grid-template-columns:1fr 1fr !important;gap:0 !important;height:auto !important;min-height:0 !important;box-shadow:0 8px 20px rgba(18,33,23,.06) !important;}
  .quick-item{min-height:74px !important;padding:12px 14px !important;gap:10px !important;}
  .quick-item img{height:30px !important;}
  .quick-item b{font-size:11.5px !important;line-height:1.18 !important;}
  .quick-item:last-child{grid-column:1/-1 !important;}

  /* ---------- Services ---------- */
  .services.section{padding-top:30px !important;padding-bottom:34px !important;}
  .cards{gap:14px !important;}
  .card>img,.service-card-link>img{height:210px !important;object-fit:cover !important;}
  .card-body{padding:17px 18px 16px !important;}
  .card h3.service-title{font-size:21px !important;line-height:1.16 !important;margin-bottom:8px !important;}
  .card p{font-size:12px !important;min-height:0 !important;margin-bottom:16px !important;}
  .service-card-link .service-more{font-size:12px !important;}

  /* ---------- Why choose us: same compact row language as internal pages ---------- */
  .why.section{padding-top:28px !important;padding-bottom:34px !important;}
  .why-layout{display:block !important;}
  .why-list{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-auto-rows:auto !important;
    gap:0 !important;
    min-height:0 !important;
  }
  .why-item{
    height:auto !important;
    min-height:0 !important;
    grid-template-columns:38px minmax(0,1fr) !important;
    gap:12px !important;
    padding:14px 0 !important;
    border-right:0 !important;
    border-top:1px solid #e6eae8 !important;
  }
  .why-item:first-child{border-top:0 !important;}
  .why-item img{height:34px !important;width:auto !important;}
  .why-item h4{font-size:13px !important;margin-bottom:4px !important;}
  .why-item p{font-size:11px !important;line-height:1.4 !important;}
  .why-card{
    margin-top:18px !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    height:auto !important;
    min-height:0 !important;
  }
  .why-card>img{height:220px !important;}
  .why-card-copy{padding:18px !important;}

  /* ---------- Documents: category -> its documents -> next category ---------- */
  .docs.section{padding-top:28px !important;padding-bottom:34px !important;}
  .docs-row-a4{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }
  .doc-count-a4{
    grid-column:1/-1 !important;
    height:auto !important;
    min-height:92px !important;
    padding:14px 16px !important;
    display:grid !important;
    grid-template-columns:1fr auto !important;
    grid-template-rows:auto auto !important;
    align-items:center !important;
  }
  .doc-count-a4 strong{font-size:13px !important;}
  .doc-count-a4 .doc-meta{grid-column:2 !important;grid-row:1 / span 2 !important;align-self:center !important;}
  .doc-count-a4 b{font-size:40px !important;margin:0 !important;}
  .doc-count-a4 small{font-size:9px !important;}
  .doc-category-link{font-size:10px !important;margin-top:4px !important;}
  .doc-a4{height:190px !important;min-height:190px !important;padding:3px !important;}
  .all-docs-a4{
    grid-column:1/-1 !important;
    height:72px !important;
    min-height:72px !important;
    align-self:stretch !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
  }

  /* ---------- Reviews: only first 3 initially ---------- */
  .reviews.section{padding-top:28px !important;padding-bottom:34px !important;}
  .reviews-grid{grid-template-columns:1fr !important;gap:12px !important;}
  .review-card{min-height:0 !important;padding:16px !important;}
  .review-card:nth-child(n+4){display:none !important;}
  .reviews.reviews-expanded .review-card:nth-child(n+4){display:flex !important;}
  .reviews-more-mobile{
    display:flex !important;
    width:100% !important;
    height:48px !important;
    margin-top:14px !important;
    border:1px solid #cfd5d2 !important;
    background:#fff !important;
    color:#2b3134 !important;
    font-size:13px !important;
    font-weight:600 !important;
  }
  .reviews.reviews-expanded .reviews-more-mobile{display:none !important;}
  .reviews-mobile-link{margin-top:10px !important;}

  /* ---------- Contacts ---------- */
  .contacts-layout{gap:14px !important;}
  .contacts-card{padding:20px 18px !important;}
  .contacts-actions{grid-template-columns:1fr !important;}
  .contact-btn{height:48px !important;font-size:12px !important;}

  /* ---------- Main CTA: same successful visual pattern as internal CTA ---------- */
  .main-mobile-cta{
    min-height:280px !important;
    padding:0 !important;
    background:
      linear-gradient(180deg,rgba(8,89,34,.66),rgba(7,70,29,.82)),
      url("assets/img/cta.webp") center/cover no-repeat !important;
  }
  .main-mobile-cta .cta-inner{
    min-height:280px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-end !important;
    gap:20px !important;
    padding-top:32px !important;
    padding-bottom:28px !important;
  }
  .main-mobile-cta h2{font-size:27px !important;line-height:1.06 !important;margin-bottom:8px !important;}
  .main-mobile-cta p{font-size:12px !important;line-height:1.45 !important;}
  .main-mobile-cta .cta-actions{
    width:100% !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }
  .main-mobile-cta .btn{
    width:100% !important;
    height:52px !important;
    font-size:13px !important;
  }
  .main-mobile-cta .cta-notes{display:none !important;}

  /* ---------- Footer ---------- */
  .footer-top{gap:18px !important;}
  .footer-logo{width:138px !important;}
}


/* ============================================================
   v24 — mobile consistency pass + latest approved refinements
   ============================================================ */

/* Global brand rule: КУБ-СК is never split between lines. */
.brand-nowrap{
  white-space:nowrap !important;
}

/* Mobile-only helper */
.mobile-delivery-radius{display:none;}

/* Main CTA desktop: no note row; buttons vertically centered. */
.main-mobile-cta .cta-actions{
  align-self:center;
  align-content:center;
}
.main-mobile-cta .cta-inner{
  align-items:center;
}
.main-mobile-cta .cta-actions{
  grid-template-columns:minmax(220px,1fr) minmax(165px,.82fr);
}
.main-mobile-cta .cta-actions .btn{
  align-self:center;
}

/* Archive cards have no forced caption gap when no custom title is supplied. */
.archive-doc{
  padding-bottom:12px !important;
}
.archive-doc > span{
  display:none;
}

/* Footer uses original full-colour header logo on every page. */
.footer-logo{
  filter:none !important;
  background:none !important;
}

/* ===== MOBILE ===== */
@media(max-width:760px){

  /* ---------- Hero / buttons: one site-wide mobile language ---------- */
  .hero-buttons,
  .inner-hero-actions{
    width:min(100%,380px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    justify-items:center !important;
  }
  .hero-buttons .btn,
  .hero-buttons .btn-hero-call,
  .inner-hero-actions .btn,
  .inner-hero-actions .btn-hero-call{
    width:100% !important;
    min-width:0 !important;
    height:54px !important;
    min-height:54px !important;
    padding-left:18px !important;
    padding-right:18px !important;
    justify-content:center !important;
    text-align:center !important;
    font-size:14px !important;
  }

  /* ---------- Main hero: same readable treatment as internal pages ---------- */
  .hero{
    background-size:cover !important;
    background-position:67% center !important;
  }
  .hero::before{
    background:linear-gradient(
      180deg,
      rgba(255,255,255,.99) 0%,
      rgba(255,255,255,.97) 30%,
      rgba(255,255,255,.86) 53%,
      rgba(255,255,255,.30) 79%,
      rgba(255,255,255,0) 100%
    ) !important;
  }

  /* ---------- Four key advantages only, 2×2 ---------- */
  .quick-row{
    grid-template-columns:1fr 1fr !important;
    height:auto !important;
    min-height:0 !important;
  }
  .quick-item{
    min-height:82px !important;
    grid-column:auto !important;
    padding:13px 12px !important;
  }
  .quick-item:nth-child(2){
    display:none !important; /* Beton M500 hidden on mobile */
  }
  .quick-item:nth-child(1){order:1;}
  .quick-item:nth-child(3){order:2;}
  .quick-item:nth-child(5){order:3;}
  .quick-item:nth-child(4){order:4;}
  .quick-item:last-child{grid-column:auto !important;}
  .mobile-delivery-radius{
    display:inline !important;
    font-size:10px !important;
    font-weight:500 !important;
    line-height:1.15 !important;
  }

  /* ---------- Why choose us: full text width, same as internal pages ---------- */
  .why-layout{
    display:block !important;
  }
  .why-list{
    display:block !important;
    width:100% !important;
  }
  .why-item{
    width:100% !important;
    display:grid !important;
    grid-template-columns:42px minmax(0,1fr) !important;
    gap:14px !important;
    padding:17px 0 !important;
    min-height:0 !important;
    height:auto !important;
    border-right:0 !important;
    border-top:1px solid #e3e8e5 !important;
  }
  .why-item:first-child{
    border-top:0 !important;
  }
  .why-item > div{
    width:100% !important;
    min-width:0 !important;
  }
  .why-item h4,
  .why-item p{
    width:100% !important;
    max-width:none !important;
  }
  .why-item h4{
    font-size:16px !important;
    line-height:1.16 !important;
    margin-bottom:6px !important;
  }
  .why-item p{
    font-size:13px !important;
    line-height:1.42 !important;
  }
  .why-item h4 br,
  .why-item p br{
    display:none !important;
  }

  /* Right-side corporate card becomes a compact full-width vertical card. */
  .why-card{
    width:100% !important;
    max-width:100% !important;
    margin-top:18px !important;
    grid-template-columns:1fr !important;
    height:auto !important;
    min-height:0 !important;
  }
  .why-card>img{
    width:100% !important;
    height:240px !important;
    object-fit:cover !important;
  }
  .why-card-copy{
    width:100% !important;
    padding:20px 20px 22px !important;
  }
  .why-card-copy h3{
    width:100% !important;
    max-width:none !important;
    font-size:22px !important;
    line-height:1.12 !important;
  }
  .why-card-copy h3 br{
    display:none !important;
  }
  .why-card-copy p{
    width:100% !important;
    max-width:none !important;
    font-size:12px !important;
    line-height:1.45 !important;
  }

  /* ---------- Documents: category → documents → category → documents ---------- */
  .docs-row-a4{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
  }
  .doc-count-a4{
    grid-column:1/-1 !important;
  }
  .doc-a4{
    width:100% !important;
    height:auto !important;
    aspect-ratio:210/297 !important;
    min-height:0 !important;
  }
  .doc-a4 img{
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
  }
  .all-docs-a4{
    grid-column:1/-1 !important;
  }

  /* ---------- Reviews: 3 initially, then Show more ---------- */
  .reviews-grid{
    grid-template-columns:1fr !important;
  }
  .review-card:nth-child(n+4){
    display:none !important;
  }
  .reviews.reviews-expanded .review-card:nth-child(n+4){
    display:flex !important;
  }
  .reviews-more-mobile{
    display:flex !important;
  }

  /* ---------- Main CTA: one full-height background, no extra icon row ---------- */
  .main-mobile-cta{
    min-height:310px !important;
    padding:0 !important;
    background:
      linear-gradient(180deg,rgba(6,83,31,.42),rgba(5,64,26,.78)),
      url("assets/img/cta.webp") center center/cover no-repeat !important;
  }
  .main-mobile-cta .cta-inner{
    min-height:310px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:stretch !important;
    gap:22px !important;
    padding-top:30px !important;
    padding-bottom:30px !important;
  }
  .main-mobile-cta .cta-actions{
    width:100% !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    align-content:center !important;
  }
  .main-mobile-cta .btn{
    width:100% !important;
    height:54px !important;
    justify-content:center !important;
  }
  .main-mobile-cta .cta-notes{
    display:none !important;
  }

  /* ---------- Internal page CTA backgrounds fill whole card ---------- */
  .inner-cta-card{
    min-height:270px !important;
    background-size:cover !important;
    background-repeat:no-repeat !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:stretch !important;
    padding:26px 22px !important;
  }
  .inner-cta-card .btn{
    width:min(100%,380px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    height:54px !important;
    justify-content:center !important;
  }

  /* ---------- Footer: strictly vertical on ALL pages ---------- */
  footer{
    width:100% !important;
    max-width:100% !important;
    overflow:hidden !important;
  }
  .footer-top{
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    width:calc(100% - 28px) !important;
    max-width:none !important;
    gap:18px !important;
  }
  .footer-logo{
    width:150px !important;
    max-width:100% !important;
    margin:0 !important;
  }
  .footer-links{
    width:100% !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:9px !important;
    font-size:11px !important;
  }
  .footer-links a{
    white-space:normal !important;
  }
  .footer-contact{
    width:100% !important;
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
  }
  .footer-address{
    width:100% !important;
    display:flex !important;
    grid-column:auto !important;
  }
  .footer-bottom{
    width:calc(100% - 28px) !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:12px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .footer-legal{
    width:100% !important;
    display:flex !important;
    flex-direction:column !important;
    gap:8px !important;
  }
}


@media(max-width:760px){
  body.menu-open{
    overflow:hidden !important;
  }
  .site-header{
    z-index:9999 !important;
  }
  .nav.open{
    position:fixed !important;
    top:64px !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    z-index:9998 !important;
    height:auto !important;
    overflow-y:auto !important;
    background:rgba(255,255,255,.99) !important;
    border-top:1px solid #e5e8e8 !important;
  }
  .site-header.is-compact .nav.open{
    top:54px !important;
  }
}


/* ============================================================
   v26 — final approval pass: mobile cleanup + media galleries
   ============================================================ */

/* Shared media galleries for service pages */
.service-photo-gallery{
  margin-top:26px;
}
.gallery-head{
  margin-bottom:14px;
}
.gallery-head h3{
  margin:0 0 6px;
  font-size:18px;
  line-height:1.18;
}
.gallery-head p{
  margin:0;
  color:#667073;
  font-size:12px;
  line-height:1.45;
}
.service-photo-grid{
  display:grid;
  gap:14px;
}
.service-photo-grid-4{grid-template-columns:repeat(4,minmax(0,1fr));}
.service-photo-grid-5{grid-template-columns:repeat(5,minmax(0,1fr));}
.service-photo-grid-6{grid-template-columns:repeat(3,minmax(0,1fr));}
.service-photo-card{
  margin:0;
  border-radius:6px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 0 0 1px #e4e8e6,0 8px 22px rgba(18,33,23,.04);
}
.service-photo-card img{
  width:100%;
  height:165px;
  object-fit:cover;
  display:block;
}
.equipment-photo-gallery .service-photo-card img{height:160px;}
.materials-photo-gallery .service-photo-card img{height:150px;}
.zhbi-photo-gallery .service-photo-card img{height:150px;}

/* Main 'why card' headline — allow natural wrapping without broken spacing */
.why-card-copy h3{
  word-spacing:normal !important;
}
.why-card-copy h3 .brand-nowrap{display:inline !important;}

/* CTA on main page: cleaner composition, no leftover note strip, perfectly covered background */
.main-mobile-cta{
  background:
    linear-gradient(180deg,rgba(7,92,34,.38),rgba(6,66,27,.76)),
    url("assets/img/cta.webp") center center/cover no-repeat !important;
}

@media(max-width:1020px){
  .service-photo-grid-4{grid-template-columns:repeat(3,minmax(0,1fr));}
  .service-photo-grid-5{grid-template-columns:repeat(3,minmax(0,1fr));}
}

@media(max-width:760px){
  /* Mobile header: phone number shown clearly between logo and burger */
  .header-top{
    grid-template-columns:minmax(124px,1fr) auto auto !important;
    gap:12px !important;
    height:74px !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }
  .brand img{width:138px !important;}
  .header-right{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-self:end !important;
    width:auto !important;
    gap:0 !important;
  }
  .header-phone{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:6px !important;
    min-width:0 !important;
  }
  .header-phone a{
    font-size:13px !important;
    letter-spacing:-.02em !important;
    white-space:nowrap !important;
  }
  .header-phone a:after{content:none !important;}
  .header-phone img{
    width:22px !important;
    height:22px !important;
    flex:0 0 22px !important;
  }
  .burger{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:36px !important;
    height:36px !important;
    padding:0 !important;
    font-size:30px !important;
    line-height:1 !important;
  }

  /* Main hero buttons centered like on internal pages */
  .hero-buttons{
    width:min(100%,380px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  /* Quick benefits 2x2 with full separators on both rows */
  .quick-row{
    grid-template-columns:1fr 1fr !important;
  }
  .quick-item{
    border-right:0 !important;
    border-bottom:1px solid #e6e8e8 !important;
    padding:14px 12px !important;
  }
  .quick-item:nth-child(1),
  .quick-item:nth-child(5){
    border-right:1px solid #e6e8e8 !important;
  }
  .quick-item:nth-child(4),
  .quick-item:nth-child(5){
    border-bottom:0 !important;
  }

  /* Why section card: full width text, no awkward line breaks/spaces */
  .why-card-copy h3{
    font-size:20px !important;
    line-height:1.14 !important;
  }

  /* Main CTA mobile background must fully cover the card height */
  .main-mobile-cta{
    min-height:312px !important;
    background:
      linear-gradient(180deg,rgba(7,92,34,.42),rgba(6,66,27,.78)),
      url("assets/img/cta.webp") center center/cover no-repeat !important;
    background-size:cover !important;
    background-position:center center !important;
  }
  .main-mobile-cta .cta-inner{
    min-height:312px !important;
    justify-content:center !important;
    align-items:stretch !important;
  }
  .main-mobile-cta .btn{
    justify-content:center !important;
    text-align:center !important;
  }

  /* Footer: prevent any horizontal overflow on all pages */
  footer,
  .footer-top,
  .footer-bottom,
  .footer-links,
  .footer-contact,
  .footer-address{
    min-width:0 !important;
  }
  .footer-top,
  .footer-bottom{
    width:calc(100% - 28px) !important;
    max-width:none !important;
  }
  .footer-links{
    grid-template-columns:1fr !important;
  }
  .footer-links a,
  .footer-contact a,
  .footer-address span,
  .footer-bottom span,
  .footer-legal a{
    word-break:break-word;
    overflow-wrap:anywhere;
  }

  /* Service page galleries on mobile */
  .service-photo-grid-4,
  .service-photo-grid-5,
  .service-photo-grid-6{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .service-photo-card img,
  .equipment-photo-gallery .service-photo-card img,
  .materials-photo-gallery .service-photo-card img,
  .zhbi-photo-gallery .service-photo-card img{
    height:140px !important;
  }
}

@media(max-width:430px){
  .header-phone a{font-size:12px !important;}
  .service-photo-grid-4,
  .service-photo-grid-5,
  .service-photo-grid-6{grid-template-columns:1fr 1fr !important;gap:10px !important;}
  .service-photo-card img{height:122px !important;}
}


/* ============================================================
   v26.1 mobile hotfix — phone visibility + CTA crop source
   ============================================================ */
@media(max-width:760px){
  /* Previous rule used display:none!important on the number.
     Explicitly override it here. */
  .header-phone a{
    display:inline-flex !important;
    align-items:center !important;
    font-size:13px !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }
  .site-header.is-compact .header-phone a{
    display:inline-flex !important;
    font-size:12px !important;
  }

  /* Keep: logo → phone → burger */
  .header-top{
    grid-template-columns:minmax(128px,1fr) auto auto !important;
    gap:10px !important;
  }
  .header-right{
    display:flex !important;
    align-items:center !important;
    justify-self:end !important;
    min-width:0 !important;
  }
  .header-phone{
    display:flex !important;
    align-items:center !important;
    gap:6px !important;
  }

  /* Use physically cropped image without white bands. */
  .main-mobile-cta{
    background:
      linear-gradient(180deg,rgba(7,92,34,.42),rgba(6,66,27,.78)),
      url("assets/img/cta-mobile.webp") center center/cover no-repeat !important;
    background-size:cover !important;
    background-position:center center !important;
  }
}


/* ============================================================
   v27 — five-point QA pass
   ============================================================ */

.service-photo-grid-materials{
  grid-template-columns:repeat(5,minmax(0,1fr));
}
.service-photo-grid-materials .service-photo-card img{
  height:160px;
  object-fit:cover;
}

/* All gallery photos use consistent framing. */
.equipment-photo-gallery .service-photo-card img,
.zhbi-photo-gallery .service-photo-card img,
.materials-photo-gallery .service-photo-card img{
  object-fit:cover !important;
  object-position:center !important;
}

@media(max-width:1020px){
  .service-photo-grid-materials{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media(max-width:760px){
  /* 1. Header: force actual phone text visible; logo -> phone -> menu */
  .header-top{
    grid-template-columns:minmax(120px,1fr) auto 38px !important;
    gap:8px !important;
    height:72px !important;
  }
  .brand{
    min-width:0 !important;
  }
  .brand img{
    width:132px !important;
    max-width:100% !important;
  }
  .header-right{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-end !important;
    justify-self:end !important;
    width:auto !important;
    min-width:0 !important;
    gap:0 !important;
  }
  .header-phone{
    display:flex !important;
    min-width:0 !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:5px !important;
  }
  .header-phone a{
    display:inline-block !important;
    visibility:visible !important;
    opacity:1 !important;
    width:auto !important;
    max-width:none !important;
    overflow:visible !important;
    font-size:12.5px !important;
    line-height:1 !important;
    letter-spacing:-.025em !important;
    white-space:nowrap !important;
  }
  .header-phone a::after{
    content:none !important;
    display:none !important;
  }
  .header-phone img{
    display:block !important;
    width:20px !important;
    height:20px !important;
    flex:0 0 20px !important;
  }
  .burger{
    width:38px !important;
    height:38px !important;
    min-width:38px !important;
    flex:0 0 38px !important;
  }

  /* 2. Main CTA: cropped source has no white bands; fill complete height */
  .main-mobile-cta{
    min-height:310px !important;
    background:
      linear-gradient(180deg,rgba(7,92,34,.36),rgba(5,61,25,.74)),
      url("assets/img/cta-mobile.webp") center center/cover no-repeat !important;
    background-size:cover !important;
    background-position:center center !important;
  }
  .main-mobile-cta .cta-inner{
    min-height:310px !important;
    padding-top:30px !important;
    padding-bottom:30px !important;
  }

  /* 5. HQ inert materials gallery */
  .service-photo-grid-materials{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }
  .service-photo-grid-materials .service-photo-card img{
    height:135px !important;
  }
}

@media(max-width:390px){
  .brand img{
    width:124px !important;
  }
  .header-phone a{
    font-size:11.5px !important;
  }
  .header-phone img{
    width:19px !important;
    height:19px !important;
    flex-basis:19px !important;
  }
}


/* ============================================================
   v28 — service page photo refresh + asset optimization
   ============================================================ */
.concrete-photo-gallery .service-photo-card img{
  height:150px;
  object-fit:cover !important;
  object-position:center !important;
}
.service-photo-grid-equipment-10{
  grid-template-columns:repeat(5,minmax(0,1fr));
}
@media(max-width:1020px){
  .service-photo-grid-equipment-10{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
@media(max-width:760px){
  .concrete-photo-gallery .service-photo-card img{
    height:140px !important;
  }
  .service-photo-grid-equipment-10{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }
}
@media(max-width:430px){
  .concrete-photo-gallery .service-photo-card img{
    height:122px !important;
  }
}