* { box-sizing: border-box; margin: 0; padding: 0; }
        body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; color: #333; background: #EFEFEF; }
header {
    background-color: rgba(0, 0, 0, 0.8); /* прозрачность 0.5 */
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 1000;
}
        .fill-dark-light { fill: #fff; }
        .header-container {
            display: flex;
            align-items: center;
            justify-content: space-between;
            max-width: 1600px;
            margin: 0 auto;
            height: 64px;
            padding: 0 24px;
            gap: 40px;
        }
     .logo {
    height: 50px;         /* по высоте SVG и шапки */
    display: flex;
    align-items: center;
}
.logo svg {
    height: 100%;
    width: auto;
    max-width: 170px;
    display: block;
}
        /* Меню */
        nav {
            display: flex;
            align-items: center;
            flex: 1;
            justify-content: center;
            height: 64px;
        }
        .nav-list {
            display: flex;
            align-items: center;
            gap: 48px;
            list-style: none;
        }
        .nav-list li {
            font-size: 15px;
            font-weight: 500;
            letter-spacing: 0.04em;
            text-transform: none;
        }
        .nav-list a {
            text-decoration: none;
            color: #fff;
            padding: 3px 8px;
            transition: color .20s;
        }
        .nav-list a:hover { color: #0090df; }
        /* Right icons/contacts */
        .nav-icons {
            display: flex;
            align-items: center;
            gap: 20px;
            min-width: 190px;
        }
        .contacts-block {
            color: #fff;
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            font-size: 14px;
        }
        .contacts-block b { font-size: 15px; }
        .contacts-block span { font-size: 14px; }
        .icons {
            display: flex;
            align-items: center;
            gap: 10px;
            margin-left: 8px;
        }
        .icons svg {
            width: auto; height: 35px; fill: none;
           
        }

        /* Бургер */
        .mobile-menu-toggle {
            display: none;
            flex-direction: column;
            cursor: pointer;
            gap: 5px;
            margin-left: 12px;
        }
        .mobile-menu-toggle span {
            width: 28px;
            height: 3px;
            background-color: #fff;
            border-radius: 2px;
            transition: 0.3s;
        }

        @media (max-width: 900px) {
            .header-container { padding: 0 8px;}
            nav {
             height: 250%;
                position: absolute;
                top: 64px; left:0;
                width: 100%;
                background: #000;
                box-shadow: 0 4px 14px rgba(0,0,0,0.09);
                flex-direction: column;
                align-items: flex-start;
                justify-content: flex-start;
                padding: 0;
                z-index: 999;
                display: none;
                opacity: 1;
            }
            nav.active { display: flex; }
            .nav-list {
                flex-direction: column;
                width: 100%;
                gap: 0;
            }
            .nav-list li {
                width: 100%;
                border-bottom: 1px solid #ececec;
                text-align: left;
                padding: 16px 32px 16px 22px;
            }
            .nav-list li:last-child { border-bottom: none;}
            .mobile-menu-toggle { display: flex; }
            .nav-icons { display: none;}
        }
        @media (max-width: 500px) {
            .logo {
    height: 100%;         /* по высоте SVG и шапки */
    display: flex;
    align-items: center;
}
.logo svg {
    height: 100%;
    width: auto;
    max-width: 170px;
    display: block;
}
            .nav-list li { padding: 11px 8px; font-size: 14px;}
        }

        /* Banner стили */
        .hero-section {
            position: relative;
            height: 88vh;
            min-height: 600px;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
      padding: 40px 0 40px 0; 
    margin-bottom: 40px;      
        }
        .video-background {
            position: absolute;
            top: 0; left: 0; width: 100%; height: 100%;
            object-fit: cover;
            z-index: -1;
        }
        .video-overlay {
            position: absolute;
            top: 0; left: 0; width: 100%; height: 100%;
            background: rgba(0,0,0,0.3); z-index:0;
        }
        .hero-content {
            position: relative;
            z-index: 1;
            text-align: center;
            color: #fff;
        }
        .phone-numbers {
            display: flex;
            gap: 20px;
            justify-content: center;
            margin-top: 30px;
            flex-wrap: wrap;
        }
        .phone-btn {
            background-color: rgba(255,255,255,0.2);
            border: 2px solid #fff;
            color: #fff;
            padding: 12px 30px;
            border-radius: 5px;
            font-size: 16px;
            text-decoration: none;
            transition: all 0.3s;
            backdrop-filter: blur(5px);
            
        }
        .phone-btn:hover { background-color: rgba(255,255,255,0.4);}
        .hero-title {
            font-size: 18px;
            font-weight: 300;
            margin-bottom: 15px;
            line-height: 1.6;

        }
        .hero-logo {
            font-size: 100px;
            font-weight: bold;
          margin-top: 200px;
            letter-spacing: 2px;
            padding-bottom: 0px;
        }
        .cta-buttons {
            margin-top: 120px;
            display: flex;
            flex-direction: column;
            gap: 25px;
            align-items: center;
            max-width: 300px;
            margin: 0 auto;
            cursor: pointer;
        }
        .cta-btn {
            background-color: rgba(255,255,255,0.2);
            border: 2px solid #fff;
            color: #fff;
            padding: 7px 15px;
            border-radius: 5px;
            font-size: 16px;
            text-decoration: none;
            transition: all 0.3s;
            backdrop-filter: blur(5px);
            width: 100%;
            text-align: center;
            cursor: pointer;
           
        }
          .ctabutton {
            background-color: rgba(255,255,255,0.2);
            border: 2px solid #fff;
            color: #fff;
            padding: 15px 40px;
            border-radius: 5px;
            font-size: 16px;
            text-decoration: none;
            transition: all 0.3s;
            backdrop-filter: blur(5px);
            width: 100%;
         
            text-align: center;
            cursor: pointer;
           
        }
        .cta-btnn {
            background-color: rgba(255,255,255,0.2);
            border: 2px solid #fff;
            color: #fff;
            padding: 15px 40px;
            border-radius: 5px;
            font-size: 16px;
            text-decoration: none;
            transition: all 0.3s;
            backdrop-filter: blur(5px);
            width: 100%;
        
            text-align: center;
            cursor: pointer;
           
        }
        .cta-btn:hover {
            background-color: #fff;
            color: #333;
        }
        .cta-btnn:hover {
            background-color: #fff;
            color: #333;
        }
        .cta-btnnn:hover {
            background-color: #fff;
            color: #333;
        }
        @media (max-width: 1024px) {.hero-logo { font-size: 42px;} }
        @media (max-width: 560px) {
	.cta-btn {font-size: 12px;}
            .logo svg { height: 18px;}
            .hero-section { min-height: 380px; padding: 15px; height: 90vh; padding-bottom: 0;}
            .hero-logo { font-size: 26px; margin-top: 200px;}
            .hero-title {padding-bottom: 10px; }
        }
/* Products Section */
.products-section {
    background: #EFEFEF;
    width: 100%;
    padding: 40px 20px;
    margin-bottom: 40px;
}

.products-container {
    max-width: 1600px;
    margin: 0 auto;
}

.products-title {
    text-align: center;
    font-size: 36px;
    font-weight: 400;
    color: #222;
    margin-bottom: 40px;
    letter-spacing: 0.02em;
}

.title-highlight {
    color: #0066ff;
    font-weight: 600;
}

.products-grid {
    margin-top: 40px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.product-card {
    background: #fff;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    transition: transform 0.3s, box-shadow 0.3s;
}

.product-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}

.product-image {
    width: 100%;
    height: 280px;
    overflow: hidden;
    background: #fafafa;
}

.product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-info {
    padding: 10px;
    
}

.product-name {
    font-size: 20px;
    font-weight: 500;
    color: #222;
    margin-bottom: 10px;
    margin-left: 20px;
    line-height: 1.4;
}

.product-specs {
    list-style: none;
    padding: 0;
    margin-left: 40px;
}

.product-specs li {
    font-size: 15px;
    color: #555;
    padding: 2px 0;
    border-bottom: 1px solid #eee;
}

.product-specs li:last-child {
    border-bottom: none;
}

.product-buttons {
    margin-left: 20px;
   width: 70%;
    display: flex;
    gap: 20px;
    margin-top: 20px;
}

.btn-primary {
    flex: 1;
   background: transparent;
    color: #0066ff;
    border: 2px solid #0066ff;
    padding: 5px 7px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.3s;
}

.btn-primary:hover {
    background: #0066ff;
    color: #fff;
}

.btn-secondary {
    flex: 1;
    background: transparent;
    color: #0066ff;
    border: 2px solid #0066ff;
    padding: 5px 7px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s;
}

.btn-secondary:hover {
    background: #0066ff;
    color: #fff;
}

/* Адаптация */
@media (max-width: 1200px) {
    .products-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }
}

@media (max-width: 768px) {
    .products-section {
        padding: 40px 15px;
    }
    
    .products-title {
        font-size: 28px;
        margin-bottom: 0px;
    }
    
    .products-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        padding-left: 5px;
        padding-right: 5px;
    }
    
    .product-image {
        height: 220px;
    }
    
    .product-name {
        font-size: 18px;
        min-height: auto;
    }
}

@media (max-width: 480px) {
    .products-title {
        font-size: 32px;
        padding-bottom: 0px;
        font-weight: 500;
    }
    
    .product-buttons {
margin-left: 15%;
        flex-direction: column;

gap: 10px;
    }
	.btn-primary{font-size:12px; background: transparent;
    color: #0066ff;
    border: 2px solid #0066ff;}
	.btn-secondary{font-size:12px;}
}
.why{width: 100%;background: #EFEFEF;  padding: 40px 0;
    margin-bottom: 40px;}
/* Основной контейнер секции */
.benefits-table { display: block; }
.benefits-mobile { display: none; }

/* Десктопные стили */
.benefits-table {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    color: #000;
    background: #EFEFEF;
    
}
.benefit-row {
    margin-left: 12%;
    display: flex;
    align-items: stretch;
    margin-bottom: 25px;
    
}
.benefit-title {
    flex: 0 0 370px;
    max-width: 370px;
    text-align: right;
    font-size: 22px;
    font-weight: 500;
    padding-right: 25px;
    line-height: 1.3;
    align-self: center;
}
.benefit-icon-col {
    flex: 0 0 55px;
    max-width: 55px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: stretch;
    position: relative;
}
.benefit-icon {
    z-index: 2;
    background: #EFEFEF;
    display: flex;
    align-items: center;
    justify-content: center;
}
.svg-check {
    width: 28px;
    height: 28px;
    display: block;
}
.benefit-line {
    
    flex: 1 1 0;
    border-left: 2px dotted #EFEFEF;
    width: 0;
    min-height: 15px;
    opacity: 0.6;
}
.benefit-desc {
    flex: 1 1 auto;
    font-size: 18px;
    font-weight: 400;
    padding-left: 35px;
    align-self: center;
    margin-top: 0;
}
.benefit-row:first-child .benefit-line:first-child,
.benefit-row:last-child .benefit-line:last-child {
    opacity: 0;
    height: 0;
    border: none;
}

/* MOBILE Стили */
.benefits-mobile {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    background: #EFEFEF;
    color: #000;
    padding: 20px 10px 0 10px;
}
.benefit-mob-row {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    margin-bottom: 25px;
    min-height: 60px;
}
.benefit-mob-icon-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 30px;
    position: relative;
}
.benefit-mob-icon {
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 3px;
    margin-bottom: 0;
}
.svg-check {
    width: 24px;
    height: 24px;
    display: block;
}
.benefit-mob-line {
    width: 2px;
    height: 45px;
    border-left: 2px dotted #EFEFEF;
    margin-top: 3px;
    opacity: 0.5;
}
.benefit-mob-row:last-child .benefit-mob-line {
    display: none;
}
.benefit-mob-texts {
    margin-left: 16px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}
.benefit-mob-title {
    font-size: 17px;
    font-weight: 700;
    margin-bottom: 8px;
    line-height: 1.35;
}
.benefit-mob-desc {
    font-size: 15px;
    font-weight: 400;
    line-height: 1.4;
    word-break: break-word;
}

@media (max-width: 700px) {
    .benefits-table { display: none; }
    .benefits-mobile { display: block; }
}
.section-title {
    font-size: 36px;
    font-weight: 700;
    color: #000;
    margin-bottom: 40px;
    margin-top: 0;
    text-align: center;
    letter-spacing: 0.01em;
}

@media (max-width: 700px) {
    .section-title {
        font-size: 25px;
        margin-bottom: 24px;
    }
}
.nabat-section {
  width: 100%;
  background: #EFEFEF;
  color: #000;
  font-family: 'Arial', sans-serif;
  padding: 35px 0 35px 0;
  margin-bottom: 40px; 
}
.nabat-container {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  max-width: 1600px;
  margin: 0 auto;
}
.nabat-image {
    height: 100%;
 
  min-width: 300px;
  
  margin-right: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.nabat-image img {
  max-width: 100%;
  width: auto;
  height: 750px;

}
.nabat-content {
    padding: 5px;
  flex: 1;
  min-width: 340px;
}
.nabat-content h2 {
  font-size: 2.1em;
  font-weight: bold;
  margin-bottom: 22px;
}
.nabat-desc p {
  font-size: 1em;
  line-height: 1.6;
  margin: 0 0 10px 0;
}
.nabat-table {
  width: 100%;
  margin: 20px 0 22px 0;
  border-collapse: collapse;
  font-size: 1em;
}
.nabat-table td {
  padding: 7px 12px;
  border-bottom: 1px solid #0066ff;
  color: #EFEFEF;
}
.nabat-table td:first-child {
  color: #000;
  width: 340px;
}
.nabat-table td:last-child {
  font-weight: bold;
  color: #000;
  text-align: left;
}
.nabat-table tr:last-child td {
  border-bottom: none;
}
.nabat-pdf {
  display: inline-block;
  color: #0066ff;
  font-weight: bold;
  text-decoration: none;
  font-size: 1em;
  letter-spacing: 0.5px;
  margin-top: 14px;
  transition: color 0.2s;
}
.nabat-pdf:hover {
  color: #fff;
  background:#cf302b;
  padding: 4px 14px;
  border-radius: 3px;
}
.nabat-pdf-icon {
  background: #cf302b;
  color: #fff;
  font-size: 0.92em;
  margin-left: 7px;
  padding: 2px 8px;
  border-radius: 6px;
  letter-spacing: 2px;
}
@media (max-width: 900px) {
  .nabat-container {
    flex-direction: column;
    align-items: center;
    margin-top: 5px;
  }
  .nabat-image {
    margin-right: 0;
    margin-top: 5px;
   
  }
  .nabat-image img {
  max-width: 100%;
  width: 100%;
  height: auto;

}
}

.popup-overlay {
  display: none;
  position: fixed; z-index: 9999;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(34,36,38,0.46);
  justify-content: center;
  align-items: center;
  transition: background 0.3s;
}
.popup-overlay.active { display: flex; }
.popup-form {
  background: #fff;
  padding: 40px 34px 30px 34px;
  border-radius: 18px;
  box-shadow: 0 8px 48px rgba(50,80,130,0.10);
  max-width: 380px;
  min-width: 270px;
  width: 100%;
  position: relative;
  animation: popupAppear 0.34s cubic-bezier(.7,-0.14,.33,.97);
}
@keyframes popupAppear { from{transform: translateY(30px) scale(.95); opacity: 0;} to{transform:none; opacity:1;} }
.popup-title {text-align:center; font-size: 24px; font-weight: 600; color: #111; margin-bottom: 24px; }
.popup-close {
  position: absolute; top: 14px; right: 14px; border: none;
  background: none;
  font-size: 26px;
  color: #888; cursor: pointer;
  transition: color .2s;
  z-index: 5;
}
.popup-close:hover { color: #1976d2; }
.form-group { display: flex; flex-direction: column; margin-bottom: 18px;}
.form-group label { font-weight: 500; color:#333; margin-bottom: 6px; font-size: 15px;}
.form-group label span { color: #1976d2; font-size: 17px; margin-left: 1px;}
.form-group input,
.form-group textarea {
  background: #f4f8fd; color: #222;
  border: 1.5px solid #dbeafd; border-radius: 8px;
  padding: 12px 13px; font-size: 16px;
  transition: border .2s;
  outline: none; font-family: inherit; resize: none;
}
.form-group input:focus,
.form-group textarea:focus {
  border: 1.5px solid #1976d2;
  background: #f4faff;
}
.popup-send {
  width: 100%; margin-top: 6px;
  background: #1976d2;
  color: #fff; font-weight: 500;
  font-size: 17px; border: none;
  border-radius: 8px; padding: 13px 0;
  transition: background .18s; cursor: pointer; letter-spacing: 0.05em;
}
.popup-send:hover { background: #0d51a3; }
.form-note { text-align:center; color:#888; font-size: 12px; margin-top: 11px;}
.form-note span { color: #1976d2; font-weight: 700;}
@media (max-width: 500px) {
  .popup-form { max-width: 98vw; padding: 24px 8px 20px 8px; }
  .popup-title { font-size: 19px;}
}
.contacts-map-section {
  width: 100%;
  color: #fff;
  background: #000;
  padding: 0 0 0 0;
}
.contacts-content {
  text-align: center;
  max-width: 1600px;
  margin: 0 auto 10px;
  position: relative;
  z-index: 1;
}
.contacts-flex-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 34px;
  margin-top: 18px;
}
.contacts-title {
  font-size: 2.7rem;
  font-weight: 500;
  margin: 0 0 10px 0;
  letter-spacing: .04em;
}
.contacts-left-txt, .contacts-right-txt {
  flex: 1 1 30%;
  min-width: 250px;
  font-size: 1.22rem;
  text-align: left;
  position: relative;
  z-index: 2;
  padding: 0 0 0 0;
}
.contacts-right-txt { text-align: right; padding:0;}
.contacts-subtitle {
  font-size: 1.29rem;
  font-weight: 500;
  margin-bottom: 11px;
  margin-top: 13px;
  color: #fff;
}
.contacts-margin-top { margin-top: 25px;}
.contacts-text {
  font-size: 1.12rem;
  line-height: 1.7;
  color: #fff;
}
.contacts-link { color: #fff; text-decoration:underline; font-weight: 400;}
.contacts-link:hover { color:#fff;}
.contacts-icons { margin-top:26px; }
.contacts-icon {
  display: inline-block;
  width: 48px; height: 48px;
  background-color: #191e34;
  border-radius: 50%;
  margin-right: 18px;
  vertical-align: middle;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 60% 60%;
  transition: background 0.20s;
}
.contacts-icon.whatsapp {
  background-image: url('data:image/svg+xml;utf8,<!-- icon666.com - MILLIONS OF FREE VECTOR ICONS --><svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve"><circle style="fill:#41B4E6;" cx="255.997" cy="256" r="255.997"/><path style="fill:#0091C8;" d="M512,256.003c0-6.238-0.235-12.419-0.673-18.546L405.228,131.36L106.772,248.759l114.191,114.192 l1.498,5.392l1.939-1.955l0.008,0.008l-1.947,1.947L348.778,494.66C444.298,457.5,512,364.663,512,256.003z"/><polygon style="fill:#FFFFFF;" points="231.138,293.3 346.829,380.647 405.228,131.36 106.771,248.759 197.588,278.84 363.331,167.664 "/><polygon style="fill:#D2D2D7;" points="197.588,278.84 222.461,368.344 231.138,293.3 363.331,167.664 "/><polygon style="fill:#B9B9BE;" points="268.738,321.688 222.461,368.344 231.138,293.3 "/></svg>');
}
.contacts-icon.telegram {
  background-image: url('data:image/svg+xml;utf8,<svg width="42" height="42" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">ircle cx="24" cy="24" r="24" fill="%"%2325a4e7"/><path d="M33.75 15.1c-.23-.19-.55-.22-.8-.1L15.15 23.17c-.26.13-.44.4-.44.69.01.29.2.54.46.65l4.9 1.91 2.1 4.08c.11.22.35.36.6.36.02 0 .04 0 .06-.01.26-.03.47-.23.51-.5l1.03-6.63 7.71-6.92c.23-.2.26-.54.07-.77z" fill="white"/></svg>');
  margin-right: 0;
}
.contacts-callback-btn {
  display: inline-block;
  margin-top: 28px;
  padding: 12px 34px;
  border: 2px solid #EFEFEF;
  border-radius: 6px;
  background: #000;
  color: #EFEFEF;
  font-size: 1.09rem;
  font-weight: 500;
  text-decoration: none;
  transition: background .18s, color .18s;
  cursor: pointer;
}
.contacts-callback-btn:hover {
  background: #000;
  color: #fff;
  border: 2px solid #fff;
}
.contacts-map-center {
  flex: 1 1 80%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.controller-map-wrapper {
  width: 100%;
  max-width: 900px;
  position: relative;
  z-index: 2;
  padding-bottom: 24px;
}
.controller-img {
  width: 100%;
  max-width: 900px;
  display: block;
}
.map-on-controller {
  position: absolute;
  top: 10%;
  left: 17.5%;
  width: 65%;
  height: 64.4%;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 8px 36px rgba(40,40,80,.25);
  background: #222;
}
.map-on-controller iframe {
  width: 100%; height: 100%; border:0; border-radius:6px;
  display: block;
}
.contacts-bottom-info {
  margin: 2px auto 0;
  text-align: center;
  color: #fff;
  font-size: 12px;
  max-width: 950px;
}
@media (max-width:1200px) {
  .contacts-flex-row {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap:20px;
  }
  .contacts-left-txt, .contacts-right-txt {
    text-align: center;
    padding:0 0 0 0;
    margin-bottom: 22px;
  }
  .contacts-map-center {
    justify-content: center;
  }
}
@media (max-width:700px) {
  .controller-map-wrapper, .controller-img { max-width: 96vw; }
  .contacts-title {font-size:1.7rem;}
  .contacts-content {font-size:16px;}
  .contacts-flex-row { gap:14px; }
  .contacts-left-txt, .contacts-right-txt, .contacts-map-center {font-size:15px;}
  .controller-map-wrapper { padding-bottom: 7px;}
  .map-on-controller { border-radius:4px; height: 66%;}
}
@media (max-width:520px) {
  .contacts-title { font-size: 1.11rem;}
  .contacts-bottom-info { font-size:9.9px; }
  .contacts-icons { margin-top:18px;}
  .contacts-callback-btn {padding:8px 12px;font-size:0.93rem;}
}
.pay-format-section {background:#EFEFEF;padding: 40px 0 80px 0; margin-bottom: 40px; }
.pay-format-container {
  max-width: 1200px; margin:0 auto;padding:0 24px; background:#EFEFEF;
}
.pay-format-top {
  display: flex; justify-content: space-between; align-items:stretch; gap:34px; margin-bottom:32px;
}
.pay-format-text {
  flex: 1 1 44%;
  font-size: 2.34rem;
  color: #222;
  font-weight: 700;
  display: flex;

  background:none;
  padding-top: 0;
}
.pay-format-accent {
    padding-top: 0;
  color: #147AFF;
  font-weight: 700;
 
}
.pay-format-card-horizontal {
  flex: 1 1 44%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #212848;
  border-radius: 24px;
  padding: 0px 50px 0px 33px;
  min-height: 100px;
  box-shadow: 0 10px 28px rgba(25,35,80,0.10);
  color: #fff; font-size:1.13rem;
  gap: 20px;
}
.pay-format-bottom {
  display: flex;
  gap: 34px;
}
.pay-format-card-vertical {
  flex:1 1 50%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #212848;
  border-radius: 24px;
  padding: 0px 0px 0px 33px;
  box-shadow: 0 10px 28px rgba(25,35,80,0.10);
  color: #fff; font-size:1.13rem;
  min-height: 100px; 
  gap: 20px;
}
.img-shadow-overlay-wrap {
  position: relative;
  display: inline-block;
  border-radius: 20px;
  overflow: hidden;
}
.pay-format-img {
  display: block;
  width: 250px;
  max-width: 100%;
  border-radius: 20px;
}
.img-shadow-overlay-wrap::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: 20px;
  /* Сильная темная тень только поверх */
-webkit-box-shadow: -43px -57px 55px -6px rgba(33, 40, 72, 1) inset;
-moz-box-shadow: -43px -57px 55px -6px rgba(33, 40, 72, 1) inset;
box-shadow: -43px -57px 55px -6px rgba(33, 40, 72, 1) inset;
  z-index: 2;
  /* Если нужно сделать тень чуть светлее — уменьшите альфа-канал */
}


.white-list-wrap {
  background: #1E2131;
  border-radius: 18px;
  padding: 10px 19px;
  margin-top: 10px;
  margin-bottom: 0;
}
.card-title {font-size:1.3rem;font-weight:700; margin-bottom:5px;color:#fff;}
.card-list {margin:0;padding-left:20px;font-size:1.05rem;color:#fff;}
.white-list-wrap .card-list li { color:#fff; }
@media (max-width:1200px) {
  .pay-format-top, .pay-format-bottom {flex-direction:column;gap:18px;}
  .pay-format-card-horizontal, .pay-format-card-vertical {
    min-height:unset;
    padding:24px 17px 22px 18px;
  }
  .pay-format-text {font-size:1.32rem;}
}
@media (max-width:700px) {
  .pay-format-container{padding:0 2vw;}
  .pay-format-text {font-size:1.2rem; margin-left: 15px;}
  .card-title {font-size:1.0rem; margin-bottom:10px;}
  .card-list {font-size:1rem;}
}
.about-section {background:#EFEFEF;padding:60px 20px;color:#000; margin-bottom: 40px;}
.about-container {
  max-width:1400px;margin:0 auto;display:flex;gap:50px;align-items:flex-start;
}
.about-left {flex:1 1 40%;max-width:520px;}
.about-title {font-size:2.8rem;font-weight:700;margin-top:0px;}
.about-catalog {display:flex;align-items:center;gap:14px;margin-bottom:32px;}
.catalog-link {color:#0066ff;text-decoration:none;font-size:1.1rem;font-weight:500;}
.catalog-link:hover {text-decoration:underline;}
.about-text {font-size:1.05rem;line-height:1.7;color:#000; margin-top: 20px;}
.about-text p {margin-bottom:10px;}
.about-right {flex:1 1 60%;position:relative;}

/* Стрелки над слайдером */
.slider-arrows-top {
  display:flex;gap:14px;justify-content:flex-end;margin-bottom:16px;
}
.slider-arrow {
  background:#0066ff;border:2px solid rgba(255,255,255,0.2);
  border-radius:50%;width:48px;height:48px;cursor:pointer;display:flex;
  align-items:center;justify-content:center;transition:background 0.2s;
}
.slider-arrow:hover {background:#0066ff; opacity: 0.9;}

.slider-container {
  overflow:hidden;border-radius:12px;width:100%;position:relative;
  
}
.slider-track {display:flex;transition:transform 0.5s ease-in-out;}
.slide {min-width:100%;display:flex;justify-content:center;align-items:center;}
.slide img {width:100%;height:auto;display:block;border-radius:12px;}

.slider-dots {
  display:flex;gap:10px;justify-content:center;margin-top:20px;
}
.slider-dot {
  width:10px;height:10px;border-radius:50%;background:#555;cursor:pointer;
  transition:background 0.3s;
}
.slider-dot.active {background:#0066ff;}

@media (max-width:1000px){
  .about-container{flex-direction:column;gap:32px;}
  .about-left,.about-right{max-width:100%;}
}
@media (max-width:700px){
  .about-title{font-size:1.8rem;}
  .about-text{font-size:0.97rem;}
  .slider-arrow{width:40px;height:40px;}
}
.supply-block {
  background: #EFEFEF;
  padding: 0px 0 60px 0;
  color: #000;
  margin-bottom: 40px;
}
.supply-container {
  max-width: 1600px;
  margin: 0 auto;
  display: flex;
  gap: 56px;
  align-items: flex-start;
  padding: 0 32px;
  box-sizing: border-box;
}
.supply-left {
  flex: 1 1 38%;
  max-width: 820px;
}
.supply-title {
  font-size: 2.25rem;
  font-weight: 600;
  margin-bottom: 28px;
  color: #000;
}
.supply-text {
  font-size: 1.17rem;
  line-height: 1.7;
  color: #222;
}
.supply-right {
  flex: 1 1 62%;
  min-width: 320px;
 
  position: relative;
  display: flex;
  justify-content: flex-end;
}
.supply-video-ratio {
  position: relative;
  width: 100%;
 
  margin-left: auto;
  margin-right: auto;
  padding-top: 56.25%; /* 16:9 ratio fallback */
  background: #ddd;
  border-radius: 18px;
  box-shadow: 0 10px 26px rgba(0,102,255,0.11);
  overflow: hidden;
}
.supply-video-ratio iframe, .supply-video-ratio video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  background: #000;
  min-height: 140px;
}

@media (max-width: 1550px) {
  .supply-container { max-width: 99vw; }
  .supply-right { max-width: ; }
  .supply-left { max-width: 700px; }
}
@media (max-width: 1200px) {
  .supply-container {flex-direction: column; gap: 32px; }
  .supply-left, .supply-right {max-width: 100%; flex: unset;}
  .supply-video-ratio {max-width: 100%; min-width: unset;}
}
@media (max-width: 700px) {
    .supply-video-ratio{margin-top: 5px;}
  .supply-block {padding: 0px 0 0px 0;}
  .supply-right{margin-top: 5px; width:100%;}
  .supply-container {padding: 0 6px; margin-top: 0px;}
  .supply-title {font-size: 1.35rem; margin-top: 0px; margin-bottom: 0px; font-weight: 600;}
  .supply-text {font-size: 0.97rem; margin-top: 5px; padding-bottom: 0px;}
  .supply-video-ratio {border-radius: 10px; margin-top: 0px; width:100%; }
}

.calculate-section {
    border-radius: 30px;
    align-items: center;
    width:1600px;
  background: #fff;
  padding: 40px 0;
  color: #000;
  overflow: visible; 
  margin: 0 auto 40px auto; 
}
.calculate-container {
  max-width: 1600px;
  margin: 0 auto;
  display: flex;
  gap: 30px;
  align-items: flex-start;
  padding: 0 32px;
  box-sizing: border-box;
  position: relative;
}
.calculate-left {
  flex: 0 0 50%;
  max-width: 480px;
  position: relative;
}
.calc-text-drone {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 24px;
  position: relative;
  gap: 30px;
}
.calculate-title {
  font-size: 2.0rem;
  font-weight: 500;
  color: #111;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin: 0;
  flex: 0 0 auto;
}
.drone-hero {
  width: 380px;
  height: auto;
  position: absolute;
  right: -150px;
  top: -150px;
  z-index: 10;
  filter: drop-shadow(0 12px 32px rgba(0,0,0,0.15));
}
.calculate-images {
  display: flex;
  gap: 12px;
  justify-content: flex-start;
  margin-top: 16px;
}
.calc-img {
  width: 35%;
  aspect-ratio: 1/1;
  border-radius: 14px;
  object-fit: cover;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  transition: transform 0.3s, box-shadow 0.3s;
}
.calc-img:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
}
.calculate-right {
  flex: 1 1 58%;
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.calculate-form-wrapper {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  width: 100%;
}
.calculate-content {
    margin-left: 100px;
  background: #fff;
  padding: 10px 28px;
  
  flex: 0 0 40%;
}
.calculate-subtitle {
  font-size: 1.02rem;
  line-height: 1.7;
  color: #333;
  margin-bottom: 20px;
  font-weight: 500;
}
.calculate-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.calc-form-group {
  display: flex;
  flex-direction: column;
}
.calc-form-group input[type="text"], 
.calc-form-group input[type="tel"] {
   padding: 12px 0;
  border: none;
  border-bottom: 1.5px solid #e0e0e0;
  border-radius: 0;
  font-size: 0.96rem;
  color: #333;
  outline: none;
  transition: border-color 0.2s;
  background: transparent;
  font-family: inherit;
}
.calc-form-group input[type="text"]:hover, 
.calc-form-group input[type="tel"]:hover {
   border-bottom-color: #bbb;
}
.calc-form-group input[type="text"]:focus, 
.calc-form-group input[type="tel"]:focus {
  border-bottom-color: #0066ff;
  border-bottom-width: 2px;
  padding-bottom: 11px;
}
.calc-form-group input::placeholder {
 color: #ccc;
  font-size: 0.96rem;
}
.calc-form-group.checkbox {
  flex-direction: row;
  align-items: flex-start;
  gap: 8px;
  margin: 0;
}
.calc-form-group.checkbox input[type="checkbox"] {
  width: 16px;
  height: 16px;
  cursor: pointer;
  margin-top: 2px;
  accent-color: #0066ff;
  flex-shrink: 0;
}
.calc-form-group.checkbox label {
  font-size: 0.87rem;
  color: #666;
  cursor: pointer;
  line-height: 1.4;
}
.calculate-btn {
  padding: 13px 22px;
  background: #0066ff;
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 0.98rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.25s, transform 0.1s, box-shadow 0.25s;
  margin-top: 2px;
  font-family: inherit;
  letter-spacing: 0.01em;
}
.calculate-btn:hover {
  background: #0052cc;
  box-shadow: 0 6px 20px rgba(0, 102, 255, 0.25);
  transform: translateY(-2px);
}
.calculate-btn:active {
  transform: translateY(0);
}
.calculate-btn:disabled {
  background: #999;
  cursor: not-allowed;
  opacity: 0.8;
  transform: none;
}

/* ТЕГИ-КНОПКИ */
.calculate-tags {
    max-width: 300px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 0 0 auto;
  padding: 0;
}
.calc-tag {
  display: inline-block;
  padding: 10px 18px;
  background: #fff;
  border: 1.5px solid #ddd;
  border-radius: 50px;
  font-size: 1.2rem;
  color: #333;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
  text-align: center;
  min-width: 180px;
}
.calc-tag:hover {
  border-color: #0066ff;
  color: #0066ff;
  background: #f0f7ff;
}

/* АДАПТИВНЫЕ СТИЛИ */
@media (max-width: 1600px) {
  .calculate-container {
    padding: 0 24px;
  }
  .drone-hero {
    width: 340px;
    right: -120px;
    top: -50px;
  }
}

@media (max-width: 1400px) {
  .calculate-section {
    padding: 30px 0;
  }
  .drone-hero {
    width: 300px;
    right: -100px;
    top: -40px;
  }
}

@media (max-width: 1200px) {
  .calculate-container {
    flex-direction: column;
    gap: 30px;
    padding: 0 5vw;
  }
  .calculate-left, .calculate-right {
    width: 100%;
  }
  .calculate-form-wrapper {
    flex-direction: column;
  }
  .calculate-tags {
    flex-direction: row;
    flex-wrap: wrap;
  }
  .calc-tag {
    min-width: auto;
  }
  .calculate-title {
    font-size: 2.2rem;
  }
  .drone-hero {
    width: 280px;
    right: -60px;
    top: -30px;
  }
}

@media (max-width: 900px) {
  .calculate-section {
    padding: 30px 0;
    overflow: hidden;
  }
  .calculate-title {
    font-size: 1.9rem;
  }
  .drone-hero {
    width: 220px;
    right: -40px;
    top: -20px;
  }
  .calculate-images {
    gap: 10px;
  }
  .calc-img {
    border-radius: 12px;
  }
  .calculate-content {
    padding: 26px 22px;
    border-radius: 14px;
  }
  .calculate-subtitle {
    font-size: 0.98rem;
    margin-bottom: 18px;
  }
  .calc-tag {
    padding: 9px 16px;
    font-size: 0.88rem;
  }
}

@media (max-width: 700px) {
  .calculate-section {
    padding: 20px 0;
    overflow: hidden;
  }
  .calculate-container {
    gap: 20px;
    padding: 0 6px;
  }
  .calculate-title {
    font-size: 1.45rem;
  }
  .drone-hero {
    display: none;
  }
  .calculate-images {
    gap: 8px;
  }
  .calc-img {
    width: 30%;
    border-radius: 10px;
  }
  .calculate-content {
    
    margin-left: 0px;
    padding: 20px 16px;
    border-radius: 12px;
  }
  .calculate-subtitle {
    font-size: 0.92rem;
    line-height: 1.6;
    margin-bottom: 14px;
  }
  .calc-form-group input[type="text"],
  .calc-form-group input[type="tel"] {
    padding: 11px 12px;
    font-size: 16px;
  }
  .calculate-btn {
    padding: 11px 18px;
    font-size: 0.94rem;
  }
  .calculate-form {
    gap: 10px;
  }
  .calculate-tags {
    gap: 8px;
  }
  .calc-tag {
    padding: 8px 14px;
    font-size: 0.82rem;
  }
}

@media (max-width: 480px) {
  .calculate-section {
    width:100%;
    padding: 14px 0;
  }
  .calculate-container {
    padding: 0 4px;
    
    gap: 16px;
  }
  .calculate-title {
    font-size: 1.25rem;
    padding-left: 12px;
  }
  .calculate-images {
    display: none;
  }
  .calculate-content {
    margin-left: 0px;
    padding: 0px 12px;
  }
  .calculate-subtitle {
    font-size: 0.88rem;
    margin-bottom: 12px;
  }
  .calc-form-group input[type="text"],
  .calc-form-group input[type="tel"] {
    padding: 10px 10px;
    font-size: 16px;
  }
  .calculate-btn {
    padding: 10px 14px;
    font-size: 0.9rem;
  }
  .calculate-tags {
    padding: 7px 12px;
    font-size: 0.78rem;
   
  }
  .drone-hero {
    display: block;
  width: 250px;
  height: auto;
  position: absolute;
  right: -10px;
  top: -10px;
  z-index: 1000;
  filter: drop-shadow(0 12px 32px rgba(0,0,0,0.15));
}
}
@media (max-width: 700px) {
    .hero-section {
        margin-bottom: 20px;  /* ← ИЗМЕНИТЬ с текущего на 20px */
    }
    .products-section {
        padding: 0;
        margin-bottom: 0px;  /* ← ИЗМЕНИТЬ на 20px */
    }
    .why {
        padding: 0;
        margin-bottom: 0px;  /* ← ИЗМЕНИТЬ на 20px */
    }
    .nabat-section {
        padding: 0 0;
        margin-top: 5px;
        margin-bottom: 20px;  /* ← ИЗМЕНИТЬ на 20px */
    }
    .pay-format-section {
        padding: 0;
        margin-bottom: 20px;  /* ← ИЗМЕНИТЬ на 20px */
    }
    .about-section {
        padding: 10px;
        margin-bottom: 0px;  /* ← ИЗМЕНИТЬ на 20px */
    }
    .supply-block {
        padding: 20px 0;
        margin-bottom: 20px;  /* ← ИЗМЕНИТЬ на 20px */
    }
    .contacts-map-section {
        padding: 20px 0;
        margin-bottom: 0;
    }
    .calculate-section {
        padding: 20px 0;
        margin-bottom: 20px;  /* ← ДОБАВИТЬ эту строку для мобильных */
    }
}
/* КНОПКА ВВЕРХ */
/* КНОПКА ВВЕРХ (как на скриншоте) */
/* КНОПКА ВВЕРХ (исправленный вариант) */
.scroll-to-top {
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 60px;
  height: 60px;
  background: #0066ff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-decoration: none;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s, transform 0.2s, box-shadow 0.2s;
  z-index: 999;
  border: none;
  box-shadow: 
    0 0 0 15px rgba(0, 102, 255, 0.12),
    0 8px 24px rgba(0, 102, 255, 0.2);
}

.scroll-to-top:hover {
  background: #0052cc;
  transform: translateY(-3px);
  box-shadow: 
    0 0 0 15px rgba(0, 102, 255, 0.18),
    0 12px 32px rgba(0, 102, 255, 0.3);
}

.scroll-to-top:active {
  transform: translateY(-1px);
}

.scroll-to-top.active {
  opacity: 1;
  visibility: visible;
}

.scroll-to-top svg {
  width: 24px;
  height: 24px;
  stroke: #fff;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* МОБИЛЬНАЯ ВЕРСИЯ */
@media (max-width: 700px) {
  .scroll-to-top {
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    box-shadow: 
      0 0 0 12px rgba(0, 102, 255, 0.12),
      0 6px 16px rgba(0, 102, 255, 0.2);
  }
  .scroll-to-top svg {
    width: 20px;
    height: 20px;
  }
}