/* ==== Extracted from inline <style> blocks of index.php ==== */




      * {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
      }

      .main-content-container1 {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        width: 100%;
      }
      .main-content-container {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        max-width: 1250px;
        width: 100%;
        margin: 0 auto;
        padding-bottom: 90px;
      }
      .header-section {
        display: flex;
        flex-direction: row;
        gap: 62px;
        align-items: center;
        justify-content: space-between;
        height: 113px;
        padding: 0 25px;
        background: white;
        border-radius: 0px 0px 50px 50px;
      }

      /* Стили для кнопки */
.personal-cabinet-btn {
  display: inline-block;
  padding: 10px 20px;
  background-color: #ff9c2f; /* Синий цвет как в вашем дизайне */
  color: white;
  text-decoration: none;
  border-radius: 30px; /* Закругленные углы */
  font-weight: bold;
  margin-left: 20px; /* Отступ от навигации */
  transition: background-color 0.3s;
  white-space: nowrap; /* Чтобы текст не переносился */
}

.personal-cabinet-btn:hover {
  background-color: #ff7a00; /* Темнее при наведении */
}


      .header-logo {
        width: 183px;
        height: 43px;
      }
      .navigation-links-container {
        display: flex;
        flex-direction: row;
        gap: 28px;
        align-items: center;
      }
      .primary-nav-item {
        font: 400 16px Inter, sans-serif;
        color: #00192c;
      }
      .primary-button {
        display: block;
        width: 150px;
        height: 25px;
        font: 400 16px Inter, sans-serif;
        color: white;
        cursor: pointer;
        background: #ff9c2f;
        border: none;
        border-radius: 20px;
      }



     .featured-content-container1 {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 40px auto 0;
  padding-top: 20px;
}

.featured-content-container {
  display: flex;
  flex-direction: row;
  align-items: stretch; /* Растягиваем дочерние элементы по высоте */
  margin: 0 35px;
  gap: 20px; /* Добавляем отступ между блоками */
}

.immersive-image-container {
  flex: 1;
  height: auto;
  object-fit: cover; /* Чтобы изображение заполняло контейнер */
  border-radius: 50px; /* Для единообразия */
}

.blue-box-with-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 40px 60px; /* Уменьшил отступы */
  background: #ff9c2f;
  border-radius: 50px;
  flex: 1; /* Занимает равное пространство с изображением */
}

/* Опционально: стили для текста */
.wifi-router-title-text-style {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 10px;
}

.wifi-router-price-text-style {
  font-size: 20px;
  margin-bottom: 30px;
}

.immersive-heading {
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 10px;
}

.entertainment-banner-text-style {
  font-size: 18px;
}
      .product-card {
        margin-bottom: 30px;
         flex-grow: 1; /* Позволяет карточкам занимать равную высоту */
      }
      .wifi-router-title-text-style {
        font: 800 40px Inter, sans-serif;
        color: white;
      }
      .wifi-router-price-text-style {
        margin-top: 8px;
        font: 500 25px Inter, sans-serif;
        color: white;
      }
      .entertainment-section {
        margin-top: 77px;
      }
      .immersive-heading {
        font: 800 40px Inter, sans-serif;
        color: white;
      }
      .entertainment-banner-text-style {
        font: 500 25px Inter, sans-serif;
        color: white;
      }
      .immersive-image-container {
        width: 590px;
        height: 496px;
        margin-left: 20px;
        clip-path: path("M0,50c0,-27.6142 22.3858,-50 50,-50h490c27.614,0 50,22.3858 50,50v396c0,27.614 -22.386,50 -50,50h-490c-27.6142,0 -50,-22.386 -50,-50z");
        object-fit: cover;
      }

      .equipment-title-link {
  color: inherit;            /* наследует цвет заголовка */
  text-decoration: none;     /* без подчёркивания по умолчанию */
  display: inline-block;     /* увеличивает кликабельную область */
}
.equipment-title-link:hover {
  text-decoration: underline; /* подчёркивание при наведении (по желанию) */
}
/* Адаптивные стили для блока с роутерами */
@media (max-width: 1200px) {
  .featured-content-container {
    margin: 0 25px;
    gap: 15px;
  }
  
  .immersive-image-container {
    width: 500px;
    height: 420px;
  }
  
  .blue-box-with-content {
    padding: 30px 40px;
  }
}

@media (max-width: 1024px) {
  .featured-content-container {
    flex-direction: column;
    margin: 0 20px;
  }
  
  .immersive-image-container {
    width: 100%;
    height: 400px;
    margin-left: 0;
    margin-top: 20px;
    clip-path: none;
    border-radius: 30px;
  }
  
  .entertainment-section {
    margin-top: 50px;
  }
}

@media (max-width: 768px) {
  .wifi-router-title-text-style,
  .immersive-heading {
    font-size: 32px !important;
  }
  
  .wifi-router-price-text-style,
  .entertainment-banner-text-style {
    font-size: 20px !important;
  }
  
  .blue-box-with-content {
    padding: 25px 30px;
    border-radius: 30px;
  }
  
  .immersive-image-container {
    height: 350px;
  }
}

@media (max-width: 576px) {
  .featured-content-container {
    margin: 0 15px;
    gap: 10px;
  }
  
  .wifi-router-title-text-style,
  .immersive-heading {
    font-size: 26px !important;
  }
  
  .wifi-router-price-text-style,
  .entertainment-banner-text-style {
    font-size: 18px !important;
  }
  
  .entertainment-section {
    margin-top: 30px;
  }
  
  .immersive-image-container {
    height: 250px;
    border-radius: 20px;
  }
  
  .blue-box-with-content {
    padding: 20px;
    border-radius: 20px;
  }
}

@media (max-width: 400px) {
  .wifi-router-title-text-style,
  .immersive-heading {
    font-size: 22px !important;
  }
  
  .immersive-image-container {
    height: 200px;
  }
}








      
     /* Базовые стили для блока новостей */
.news-section-container {
  margin-top: 90px;
  width: 100%;
  padding: 0 15px;
  box-sizing: border-box;
}

.headline-text {
  padding: 0 34px;
  font: 800 40px Inter, sans-serif;;
  color: #00192c;
  text-align: center;
  margin: 0 auto 30px;
}

.news-card-container {
  display: flex;
  flex-direction: row;
  gap: 26px;
  align-items: center;
  width: 100%;
  margin-top: 30px;
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: #ff9c2f #f0f0f0;
  padding-bottom: 20px;
}
.headline-text {
  color: inherit;
  text-decoration: none;
  display: block;      /* кликается вся строка */
}
.headline-text:hover { text-decoration: underline; }
.promo-card-container1 {
  width: 9px;
  height: 7.75px;
  flex-shrink: 0;
}

.promo-card-container {
  display: flex;
  flex-direction: row;
  gap: 20px;
  padding: 0 10px;
}

.news-card1 {
  display: flex;
  flex-direction: column;
  width: 285px;
  min-width: 285px;
  background: white;
  border-radius: 30px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.news-card1:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
}

.news-card {
  height: 228px;
  width: 100%;
  object-fit: cover;
  border-radius: 30px 30px 0 0;
}

.internet-info-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px;
}

.internet-heading {
  font: 500 20px Inter, sans-serif;
  color: #00192c;
  text-align: center;
  margin-bottom: 5px;
}

.internet-details-text-style {
  font: 400 15px Inter, sans-serif;
  color: #00192c;
  text-align: center;
}

.internet-details-button {
  width: 150px;
  height: 35px;
  margin-top: 15px;
  font: 400 16px Inter, sans-serif;
  color: #00192c;
  cursor: pointer;
  background: transparent;
  border: 1px solid #ff9c2f;
  border-radius: 20px;
  transition: all 0.3s ease;
}

.internet-details-button:hover {
  background: #ff9c2f;
  color: white;
}

/* Стили для скроллбара */
.news-card-container::-webkit-scrollbar {
  height: 6px;
}

.news-card-container::-webkit-scrollbar-track {
  background: #f0f0f0;
  border-radius: 3px;
}

.news-card-container::-webkit-scrollbar-thumb {
  background: #ff9c2f;
  border-radius: 3px;
}

/* Адаптивность для больших мониторов (1920px и выше) */
@media (min-width: 1920px) {
  .news-section-container {
    max-width: 1800px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Адаптивность для ноутбуков (1024px - 1440px) */
@media (max-width: 1440px) {
  .news-card1 {
    width: 260px;
    min-width: 260px;
  }
  
  .news-card {
    height: 200px;
  }
}

/* Адаптивность для планшетов (768px - 1023px) */
@media (max-width: 1023px) {
  .news-section-container {
    margin-top: 70px;
    padding: 0 20px;
  }
  
  .headline-text {
    font-size: 36px;
    padding: 0 20px;
  }
  
  .news-card-container {
    gap: 15px;
  }
  
  .promo-card-container {
    gap: 15px;
  }
  
  .news-card1 {
    width: 240px;
    min-width: 240px;
  }
  
  .news-card {
    height: 180px;
  }
  
  .internet-heading {
    font-size: 18px;
  }
}

/* Адаптивность для мобильных (480px - 767px) */
@media (max-width: 767px) {
  .news-section-container {
    margin-top: 50px;
    padding: 0 15px;
  }
  
  .headline-text {
    font-size: 32px;
    padding: 0 15px;
    margin-bottom: 20px;
  }
  
  .promo-card-container1 {
    display: none;
  }
  
  .news-card-container {
    margin-top: 20px;
  }
  
  .news-card1 {
    width: 220px;
    min-width: 220px;
  }
  
  .news-card {
    height: 160px;
    clip-path: none;
  }
  
  .internet-info-card {
    padding: 15px;
  }
  
  .internet-details-button {
    width: 130px;
    height: 30px;
    font-size: 14px;
  }
}

/* Адаптивность для маленьких мобильных (до 480px) */
@media (max-width: 480px) {
  .headline-text {
    font-size: 28px;
    padding: 0 10px;
  }
  
  .news-card1 {
    width: 200px;
    min-width: 200px;
  }
  
  .news-card {
    height: 140px;
  }
  
  .internet-heading {
    font-size: 16px;
  }
  
  .internet-details-text-style {
    font-size: 13px;
  }
}

/* Адаптивность для очень маленьких экранов (до 360px) */
@media (max-width: 360px) {
  .news-card1 {
    width: 180px;
    min-width: 180px;
  }
  
  .news-card {
    height: 120px;
  }
}





      .service-section-container {
    box-sizing: border-box;
    width: 100%;
    max-width: 1272px;
    margin: 0 auto;
    padding: 60px 20px;
  }

  .service-section1 {
    width: 100%;
  }

  .service-title-style {
    font: 800 40px Inter, sans-serif;
    color: #00192c;
    text-align: center;
    margin-bottom: 40px;
  }

  .service-section {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
  }

  .feature-card,
  .corporate-connection-card,
  .iptv-channel-container {
    flex: 1;
    min-width: 300px;
    max-width: 387px;
    background: white;
    border-radius: 40px;
    padding: 30px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  }

  .flex-container-with-image {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px;
  }

  .personal-connection-image,
  .company-logo-container {
    width: 60px;
    height: 60px;
    object-fit: contain;
  }

  .customer-onboarding-text-style,
  .business-connect-title,
  .tv-title-text-style {
    font: 500 25px Inter, sans-serif;
    color: #00192c;
    margin: 0;
  }

  .blue-heading-text-style,
  .business-connection-text,
  .iptv-channel-description-text-style {
    font: 400 16px Inter, sans-serif;
    color: #00192c;
    line-height: 1.5;
    margin: 0;
  }

  .company-info-container,
  .media-content-wrapper {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px;
  }





.internet-support-section {
        box-sizing: border-box;
        min-width: 1440px;
        padding-right: 48px;
        padding-left: 119px;
        background: url("assets/image_de1a9f0a.png") 50% / cover no-repeat;
        border: none;
      }
         .call-center-section {
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        justify-content: center;
        max-width: 821px;
        padding-top: 74px;
        padding-bottom: 75px;
      }
      .internet-issue-message {
        flex: 0 0 auto;
        padding: 0;
        margin: 0;
        font: 700 40px Inter, sans-serif;
        color: white;
        text-align: left;
      }
      .call-button {
        box-sizing: border-box;
        display: block;
        flex: 0 0 auto;
        width: 150px;
        min-width: 150px;
        height: 25px;
        margin-top: 30px;
        font: 400 16px Inter, sans-serif;
        color: #00192c;
        cursor: pointer;
        background: white;
        border: none;
        border-radius: 20px;
      }


  .entertainment-block {
      position: relative;
      z-index: 1;
      margin-bottom: 20px;
    }





.equipment-card-container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 90px 20px;
  box-sizing: border-box;
}

.equipment-title-style {
  font: 700 40px Inter, sans-serif;
  color: #00192c;
  text-align: center;
  margin-bottom: 30px;
}

/* Адаптивные стили для блока поддержки */
@media (max-width: 1439px) {
  .internet-support-section {
    min-width: 100%;
    padding-left: 80px;
    padding-right: 40px;
    background-position: 60% center;
  }
}

@media (max-width: 1200px) {
  .internet-support-section {
    padding-left: 60px;
    padding-right: 30px;
  }
  
  .call-center-section {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  
  .internet-issue-message {
    font-size: 36px;
  }
  
  .call-button {
    width: 140px;
    height: 30px;
    font-size: 15px;
  }
}

@media (max-width: 992px) {
  .internet-support-section {
    padding-left: 40px;
    padding-right: 20px;
  }
  
  .internet-issue-message {
    font-size: 32px;
  }
  
  .call-center-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}

@media (max-width: 768px) {
  .internet-support-section {
    padding-left: 30px;
    padding-right: 30px;
    background-position: 65% center;
  }
  
  .call-center-section {
    padding-top: 40px;
    padding-bottom: 40px;
    align-items: center;
  }
  
  .internet-issue-message {
    font-size: 28px;
    text-align: center;
  }
  
  .call-button {
    width: 160px;
    height: 35px;
    margin-top: 25px;
  }
}

@media (max-width: 576px) {
  .internet-support-section {
    padding-left: 20px;
    padding-right: 20px;
  }
  
  .internet-issue-message {
    font-size: 24px;
  }
  
  .call-center-section {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  
  .call-button {
    width: 150px;
    height: 40px;
    font-size: 16px;
  }
}

/* Для Retina-дисплеев */
@media (-webkit-min-device-pixel-ratio: 2), 
       (min-resolution: 192dpi) {
  .internet-support-section {
    background-image: url("assets/image_de1a9f0a.png");
  }
}



.carousel-wrapper {
  position: relative;
  max-width: 1272px;
  margin: 0 auto;
  overflow: hidden;
}

.carousel {
  display: flex;
  transition: transform 0.5s ease;
  will-change: transform;
  width: 100%;
}

.product-card {
  flex: 0 0 100%;
  min-width: 100%;
  display: flex;
  box-sizing: border-box;
  padding: 0 10px;
  height: 379px;
  align-items: flex-start;
}

.product-image-container {
  width: 387px;
  height: 379px;
  flex-shrink: 0;
  clip-path: path("M0,40c0,-22.0914 17.9086,-40 40,-40h307c22.091,0 40,17.9086 40,40v299c0,22.091 -17.909,40 -40,40h-307c-22.0914,0 -40,-17.909 -40,-40z");
  background: #eee;
}

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

.blue-bubble-container {
  display: flex;
  flex-direction: column;
  padding: 40px 33px;
  margin-left: 20px;
  background: #ff9c2f;
  border-radius: 40px;
  flex-grow: 1;
  justify-content: space-between;
  height: 100%;
  overflow: hidden;
}

.device-info-container {
  flex: 1;
  overflow-y: auto;
  margin-bottom: 20px;
}

.main-title-style {
  margin: 0;
  font: 700 40px Inter, sans-serif;
  color: white;
}

.product-description-text-style {
  margin: 15px 0 0;
  font: 400 15px Inter, sans-serif;
  color: white;
  line-height: 1.5;
}

.price-button-style {
  width: 186px;
  height: 55px;
  font: 700 18px Inter, sans-serif;
  color: #ff9c2f;
  cursor: pointer;
  background: white;
  border: none;
  border-radius: 20px;
  transition: background 0.3s ease;
  align-self: flex-start;
}

.price-button-style:hover {
  background: #f0f0f0;
}

.carousel-nav {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  display: flex;
  justify-content: space-between;
  pointer-events: none;
  padding: 0 20px;
}

.carousel-btn {
  background: rgba(255,255,255,0.5);
  border: none;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  pointer-events: all;
  transition: background 0.3s ease;
}

.carousel-btn:hover {
  background: rgba(255,255,255,0.8);
}

.carousel-btn img {
  width: 20px;
  height: 20px;
}

.dots-container {
  display: flex;
  justify-content: center;
  margin-top: 30px;
  gap: 10px;
}

.dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #ccc;
  cursor: pointer;
  transition: background 0.3s ease;
}

.dot.active {
  background: #ff9c2f;
}














.payment-options-container {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  background: white;
  padding: 20px 0;
}

.payment-methods-container {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 1200px;
  width: 100%;
  padding: 20px;
}

.payment-title {
  margin: 0 0 30px 0;
  font: 800 40px Inter, sans-serif;;
  color: #00192c;
  text-align: center;
}

.payment-options-container1 {
  display: flex;
  gap: 20px;
  width: 100%;
  justify-content: center;
}

.payment-method {
  flex: 1;
  max-width: 390px;
  background: #ff9c2f;
  border-radius: 40px;
  padding: 40px 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.method-title {
  margin: 0;
  font: 800 40px Inter, sans-serif;;
  color: white;
}

.method-description {
  margin: 15px 0 0 0;
  font: 400 20px Inter, sans-serif;
  color: white;
}

/* Стили только для блока с кнопкой */
.payment-method.with-button {
  padding-bottom: 30px; /* Уменьшаем отступ снизу для кнопки */
}

.details-button {
  margin-top: 20px;
  padding: 10px 20px;
  background: white;
  color: #ff9c2f;
  border: none;
  border-radius: 20px;
  font: 400 16px Inter, sans-serif;
  cursor: pointer;
  transition: all 0.3s ease;
}

.details-button:hover {
  background: #f0f0f0;
}













  .contact-info-container1 {
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        min-width: 1440px;
      }
      .contact-section {
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        gap: 8px;
        align-items: center;
        justify-content: space-between;
        min-width: 1201px;
        padding-top: 90px;
        padding-bottom: 129px;
      }
      .contact-info-container {
        flex: 0 0 auto;
      }
      .contact-title-style {
        padding: 0;
        margin: 0;
        font: 700 40px Inter, sans-serif;
        color: #00192c;
      }
      .contact-info-container2 {
        display: flex;
        flex-direction: column;
        gap: 18px;
        align-items: stretch;
        justify-content: center;
        margin-top: 29px;
      }
      .address-snippet-container {
        display: flex;
        flex: 0 0 auto;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
      }
      .svg-container {
        display: flex;
        flex: 0 0 auto;
        width: 32px;
        height: 32px;
        color: #ff9c2f;
      }
      .contact-address-snippet-style {
        flex: 0 0 auto;
        padding: 0;
        margin: 0;
        margin-left: 13px;
        font: 500 25px Inter, sans-serif;
        color: #00192c;
        white-space: pre-wrap;
      }
      .contact-card-image {
        box-sizing: border-box;
        display: block;
        width: 689px;
        max-width: initial;
        height: 208px;
        clip-path: path("M0,30c0,-16.5685 13.4315,-30 30,-30h629c16.569,0 30,13.4315 30,30v148c0,16.569 -13.431,30 -30,30h-629c-16.5685,0 -30,-13.431 -30,-30z");
        object-fit: cover;
      }
/* Адаптивность для контактов */
@media (max-width: 1439px) {
  .contact-info-container1 {
    min-width: 100%;
    padding: 0 20px;
  }
  .contact-section {
    min-width: 100%;
    padding: 60px 20px;
  }
}

@media (max-width: 1200px) {
  .contact-section {
    flex-direction: column;
    gap: 40px;
    padding-top: 60px;
    padding-bottom: 60px;
  }
  
  .contact-card-image {
    width: 100%;
    clip-path: none;
    border-radius: 20px;
    height: auto;
    max-height: 300px;
  }
}

@media (max-width: 1024px) {
  .contact-title-style {
    font-size: 36px;
    text-align: center;
  }
  
  .contact-info-container2 {
    align-items: center;
    gap: 15px;
  }
  
  .address-snippet-container {
    justify-content: center;
  }
}

@media (max-width: 768px) {
  .contact-section {
    padding: 40px 15px;
  }
  
  .contact-title-style {
    font-size: 32px;
  }
  
  .contact-address-snippet-style {
    font-size: 20px;
  }
  
  .svg-container {
    width: 28px;
    height: 28px;
  }
}

@media (max-width: 480px) {
  .contact-section {
    padding: 30px 10px;
  }
  
  .contact-title-style {
    font-size: 28px;
  }
  
  .contact-address-snippet-style {
    font-size: 18px;
    margin-left: 10px;
  }
  
  .contact-info-container2 {
    gap: 12px;
  }
  
  .contact-card-image {
    height: 180px;
  }
}

/* Для очень маленьких экранов */
@media (max-width: 360px) {
  .contact-address-snippet-style {
    font-size: 16px;
  }
  
  .svg-container {
    width: 24px;
    height: 24px;
  }
}















.main-navigation-container {
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        min-width: 1440px;
        padding-right: 8px;
        background: #00192c;
      }
      .header-navigation-bar {
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
        gap: 87px;
        align-items: center;
        justify-content: space-between;
        min-width: 1200px;
        padding-top: 92px;
        padding-bottom: 92px;
      }
      .navbar-logo {
        box-sizing: border-box;
        display: block;
        width: 183px;
        max-width: initial;
        height: 43px;
      }
      .navigation-menu-container {
        display: flex;
        flex: 0 0 auto;
        flex-direction: row;
        gap: 28px;
        align-items: center;
        justify-content: flex-start;
      }
      .primary-navigation-link {
        flex: 0 0 auto;
        padding: 0;
        margin: 0;
        font: 400 16px Inter, sans-serif;
        color: white;
      }
      .personal-account-button {
        box-sizing: border-box;
        display: block;
        flex: 0 0 auto;
        width: 150px;
        min-width: 150px;
        height: 25px;
        font: 400 16px Inter, sans-serif;
        color: #00192c;
        cursor: pointer;
        background: white;
        border: none;
        border-radius: 20px;
      }



    /* Плавная прокрутка */
    html {
      scroll-behavior: smooth;
      scroll-padding-top: 80px; /* Отступ при скролле к якорю */
    }

       /* Добавляем голубой фон только для секции оборудования */
  #equipment.page-section {
    background: var(--page-surface-soft, #e6f4ff);
    width: 100vw; /* На всю ширину viewport */
    
  }





  .product-description-text-style {
  margin: 15px 0 0;
  font: 400 15px Inter, sans-serif;
  color: white;
  line-height: 1.6;
  padding-right: 10px; /* Для отступа от скроллбара */
}

.product-description-text-style strong {
  font-weight: 700;
  display: block;
  margin: 15px 0 10px;
  color: #fff;
}

.feature-block {
  margin: 12px 0;
  padding-left: 15px;
}

.feature-block ul {
  margin: 8px 0;
  padding-left: 20px;
}

.feature-block li {
  margin-bottom: 5px;
}

.tech-section {
  margin: 18px 0;
}

.tech-item {
  margin: 10px 0;
  padding-left: 15px;
  position: relative;
}

.tech-item:before {
  content: "•";
  position: absolute;
  left: 0;
  color: #fff;
}

.tech-name {
  font-weight: 600;
  color: #ffe7c2;
}

.specs-section {
  margin: 20px 0 10px;
}

.specs-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin-top: 10px;
}

.spec-row {
  display: flex;
}

.spec-name {
  font-weight: 600;
  min-width: 120px;
  color: #ffe7c2;
}

.spec-value {
  flex: 1;
}
 





@media (max-width: 600px) {
  .footer-container { /* нужно добавить класс */
    flex-direction: column;
    text-align: center;
  }
  .footer-logo, .footer-info {
    flex: none;
    width: 100%;
    text-align: center;
    margin: 10px 0;
  }
}















/* ===== Tariffs & Payment — responsive ===== */
.section-wrap {
  width: 100%;
  background: #fff;
}
.section-inner {
  max-width: 1270px;
  margin: 0 auto;
  padding: 60px 20px;
}
.section-title {
  font: 800 40px Inter, sans-serif;
  color: #00192c;
  text-align: center;
  margin: 0 0 32px;
}

.tariffs-grid,
.payment-grid {
  display: grid;
  gap: 24px;
}

/* 2 колонки на десктопе, 1 на планшете/мобилке */
.tariffs-grid {
  grid-template-columns: repeat(2, minmax(260px, 1fr));
}
.payment-grid {
  grid-template-columns: repeat(3, minmax(220px, 1fr));
}

/* карточки */
.tariff-card,
.payment-card {
  background: #ff9c2f;
  border-radius: 30px;
  color: #fff;
  text-align: center;
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 220px;
  box-shadow: 0 4px 12px rgba(0,0,0,.06);
}
.tariff-card h3,
.payment-card h3 {
  font: 700 28px Inter, sans-serif;
  margin-bottom: 12px;
  color: #fff;
}
.tariff-card p,
.payment-card p {
  font: 500 20px Inter, sans-serif;
  line-height: 1.5;
  color: #fff;
}

/* кнопка в оплате */
.payment-card .btn {
  display: inline-block;
  margin-top: 16px;
  padding: 10px 18px;
  border-radius: 20px;
  font: 600 16px Inter, sans-serif;
  background: #fff;
  color: #ff9c2f;
  text-decoration: none;
  border: 0;
  cursor: pointer;
  transition: background .2s ease;
}
.payment-card .btn:hover { background: #fff4de; }

.payment-card-link {
  text-decoration: none;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.payment-card-link,
.payment-card-link:hover,
.payment-card-link:visited,
.payment-card-link:focus {
  text-decoration: none;
  color: #fff;
}

html[data-theme="dark"] .payment-card-link .btn {
  background: #ffffff;
  color: #ff9c2f;
}

/* адаптация */
@media (max-width: 1024px) {
  .section-inner { padding: 48px 16px; }
  .section-title { font-size: 34px; margin-bottom: 26px; }
  .tariffs-grid { grid-template-columns: 1fr; }
  .payment-grid { grid-template-columns: repeat(2, 1fr); }
  .tariff-card, .payment-card { min-height: 200px; padding: 28px 22px; }
}
@media (max-width: 640px) {
  .section-inner { padding: 40px 14px; }
  .section-title { font-size: 28px; }
  .payment-grid { grid-template-columns: 1fr; }
  .tariff-card h3, .payment-card h3 { font-size: 22px; }
  .tariff-card p, .payment-card p { font-size: 18px; }
}

/* мелкие улучшения для вашей сетки */
.main-content-container { padding-bottom: 60px; }




/* ===== Split ===== */


/* Каркас */
.tri-wrap{
  max-width:980px;margin:24px auto;padding:18px;background:#fff;border-radius:16px;
  box-shadow:0 10px 26px rgba(0,0,0,.08);
  font-family:-apple-system,BlinkMacSystemFont,Inter,Segoe UI,Roboto,Arial
}
.tri-title{margin:0 0 6px;text-align:center;font:800 22px/1.2 inherit;color:#0b1b2b}
.tri-status{min-height:16px;text-align:center;color:#5e6f82;font-size:12px;margin-bottom:12px}

/* 3 карточки в один ряд всегда */
.tri-gauges{
  display:flex; gap:6px; justify-content:space-between; align-items:stretch;
}

/* Квадраты: современным — aspect-ratio; старым iPhone — padding-top:100% + absolute */
.gauge{
  position:relative; flex:0 0 calc((100% - 12px)/3); max-width:calc((100% - 12px)/3);
  background:radial-gradient(120% 140% at 10% 0%,#e6f4ff 0%,#cfeaff 55%,#b7dcff 100%);
  border:1px solid #b7dcff; border-radius:14px; overflow:hidden;
}
@supports (aspect-ratio: 1 / 1) {
  .gauge{ aspect-ratio:1 / 1; }
  .gauge-inner{ position:absolute; inset:10px; }
}
@supports not (aspect-ratio: 1 / 1) {
  .gauge::before{ content:""; display:block; padding-top:100%; }
  .gauge-inner{ position:absolute; top:10px; right:10px; bottom:10px; left:10px; }
}
.gauge-inner{ display:flex; align-items:center; justify-content:center; }
.gauge-inner svg{ width:100%; height:100%; display:block }

/* Кнопки */
.tri-controls{display:flex;gap:10px;justify-content:center;margin-top:12px;flex-wrap:wrap}
.btn{appearance:none;border:0;border-radius:12px;padding:10px 14px;font-weight:700;cursor:pointer;background:#fff7ed;color:#0b1b2b}
.btn-primary{background:#ff9c2f;color:#fff}
.btn:active{transform:translateY(1px)}

/* Тексты внутри приборов */
.g-label{font-size:11px;fill:#5c6b7d}
.g-value{font-size:26px;font-weight:900;fill:#0b1b2b}
.g-unit {font-size:11px;fill:#5c6b7d}
.g-sub  {font-size:11px;fill:#7a8a9b}   /* «X.X МБ» */

/* Узкие телефоны — компактнее */
@media (max-width:420px){
  .tri-wrap{padding:12px}
  .g-value{font-size:22px}
  .g-label,.g-unit,.g-sub{font-size:10px}
  .tri-gauges{gap:5px}
}
@media (max-width:360px){
  .g-value{font-size:20px}
  .g-label,.g-unit,.g-sub{font-size:9px}
  .tri-gauges{gap:4px}
}
















/* ==== Правки размера блока спид-теста и спидометров ==== */

/* сам блок – шире и чуть больше внутренних отступов */
.tri-wrap {
  max-width: 1200px;       /* было 980px */
  padding: 18px 18px;      /* было 18px – можно подправить по вкусу */
}

/* делаем саму «карточку» спидометра более широкой (прямоугольной) */
@supports (aspect-ratio: 1 / 1) {
  .gauge {
    aspect-ratio: 4 / 3;   /* вместо 1 / 1, прибор стал шире */
  }
}

@supports not (aspect-ratio: 1 / 1) {
  .gauge::before {
    padding-top: 75%;      /* вместо 100%, для старых браузеров */
  }
}

/* увеличиваем цифры и подписи внутри спидометра */
.g-value {
  font-size: 32px;         /* было 26px */
}

.g-label,
.g-unit,
.g-sub {
  font-size: 12px;         /* было 11px – можно сделать 13px, если нужно ещё крупнее */
}


/* === Global warm accent overrides === */

/* Тёплый фон для всей страницы вместо голубого body background из index.php */
body {
  background-color: var(--page-bg, #eaf6ff) !important;
  color: var(--text-main, #00192c);
  transition: background-color 0.25s ease, color 0.25s ease;
}

/* Любые ссылочные кнопки с 'button' в class — делаем оранжевыми */
a[class*="button"],
a[class*="btn"] {
  background-color: #ff9c2f !important;
  color: #ffffff !important;
  border-radius: 20px;
}

/* Ховер для ссылочных кнопок */
a[class*="button"]:hover,
a[class*="btn"]:hover {
  background-color: #ff7a00 !important;
  color: #ffffff !important;
}

/* Основная CTA-кнопка (на всякий случай ещё раз усиливаем) */
.primary-button {
  background: #ff9c2f !important;
  color: #ffffff !important;
}

/* =============================
   Тёмная тема — переопределения
   ============================= */

/* Основной фон и текст */
html[data-theme="dark"] body {
  background-color: var(--page-bg, #020617) !important;
  color: var(--text-main, #e5e7eb);
}

/* Карточки и основные блочные элементы */
html[data-theme="dark"] .news-card1,
html[data-theme="dark"] .feature-card,
html[data-theme="dark"] .corporate-connection-card,
html[data-theme="dark"] .iptv-channel-container,
html[data-theme="dark"] .payment-method,
html[data-theme="dark"] .contact-info-card {
  background-color: #0b1120;
  border: 1px solid rgba(148, 163, 184, 0.32);
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.9);
  color: #e5e7eb;
}

/* Заголовки */
html[data-theme="dark"] .section-title,
html[data-theme="dark"] .headline-text,
html[data-theme="dark"] .service-title-style,
html[data-theme="dark"] .internet-heading,
html[data-theme="dark"] .equipment-title-style,
html[data-theme="dark"] .contact-title-style,
html[data-theme="dark"] .payment-title,
html[data-theme="dark"] .customer-onboarding-text-style,
html[data-theme="dark"] .business-connect-title,
html[data-theme="dark"] .tv-title-text-style {
  color: #e5e7eb;
}

/* Вторичный текст */
html[data-theme="dark"] .internet-details-text-style,
html[data-theme="dark"] .blue-heading-text-style,
html[data-theme="dark"] .business-connection-text,
html[data-theme="dark"] .iptv-channel-description-text-style,
html[data-theme="dark"] .contact-address-snippet-style,
html[data-theme="dark"] .method-description {
  color: #9ca3af;
}

/* Оранжевые CTA на тёмном фоне */
html[data-theme="dark"] .internet-details-button,
html[data-theme="dark"] .details-button,
html[data-theme="dark"] .payment-card .btn {
  border-color: var(--accent-main, #ff9c2f);
  color: var(--accent-main, #ff9c2f);
  background: transparent;
}

html[data-theme="dark"] .price-button-style {
  border: 2px solid #ffffff !important;
  background: #ffffff !important;
  color: var(--accent-main, #ff9c2f) !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.35);
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  opacity: 1 !important;
  visibility: visible !important;
  position: relative;
  z-index: 1;
}

html[data-theme="dark"] .internet-details-button:hover,
html[data-theme="dark"] .details-button:hover,
html[data-theme="dark"] .payment-card .btn:hover {
  background-color: var(--accent-main, #ff9c2f);
  color: #ffffff;
}

html[data-theme="dark"] .price-button-style:hover {
  background: #f5f5f5 !important;
  color: var(--accent-main, #ff9c2f) !important;
}

/* Блок поддержки — затемняем фон, но не ломаем иллюстрацию */
html[data-theme="dark"] .internet-support-section {
  background-color: rgba(15, 23, 42, 0.95);
}

/* Картинки в карточках — чуть приглушаем */
html[data-theme="dark"] .equipment-image,
html[data-theme="dark"] .contact-card-image {
  filter: brightness(0.92) contrast(1.05);
}


/* Дополнительные правки для тёмной темы:
   — верхний фон с inline background:#fff4de
   — блок доверия/цифр
   — общий фон блока контактов
*/
html[data-theme="dark"] [style*="#fff4de"] {
  background-color: #020617 !important;
  background: #020617 !important;
}

html[data-theme="dark"] .contact-fullwrap {
  background-color: #020617 !important;
}

html[data-theme="dark"] .trust-inner {
  background:
    radial-gradient(circle at 0% 0%, rgba(15,23,42,0.9) 0, rgba(15,23,42,0.98) 40%, #020617 100%);
  border-color: rgba(148,163,184,0.45);
  box-shadow: 0 26px 60px rgba(15, 23, 42, 0.95);
}

html[data-theme="dark"] .trust-card {
  background-color: #0b1120;
  border-color: rgba(148,163,184,0.45);
}

html[data-theme="dark"] .trust-num {
  color: #e5e7eb;
}

html[data-theme="dark"] .trust-label {
  color: #9ca3af;
}

/* =============================
   Dark theme: sections & texts
   ============================= */

/* Общий фон секций (тарифы, оборудование, сервисы, оплата и т.п.) */
html[data-theme="dark"] .page-section {
  background-color: #020617 !important;
}

/* Обёртка тарифов/оплаты */
html[data-theme="dark"] .section-wrap {
  background-color: #020617 !important;
}

/* Инлайновые контейнеры со светлым бежевым фоном (#fff4de) */
html[data-theme="dark"] [style*="#fff4de"] {
  background-color: #020617 !important;
  background: #020617 !important;
}

/* Заголовки секций и ключевые заголовки */
html[data-theme="dark"] .section-title,
html[data-theme="dark"] .headline-text,
html[data-theme="dark"] .service-title-style,
html[data-theme="dark"] .internet-heading,
html[data-theme="dark"] .equipment-title-style,
html[data-theme="dark"] .contact-title-style,
html[data-theme="dark"] .payment-title,
html[data-theme="dark"] .customer-onboarding-text-style,
html[data-theme="dark"] .business-connect-title,
html[data-theme="dark"] .tv-title-text-style {
  color: #e5e7eb;
}

/* Вторичный текст в описаниях */
html[data-theme="dark"] .internet-details-text-style,
html[data-theme="dark"] .blue-heading-text-style,
html[data-theme="dark"] .business-connection-text,
html[data-theme="dark"] .iptv-channel-description-text-style,
html[data-theme="dark"] .contact-address-snippet-style,
html[data-theme="dark"] .method-description {
  color: #9ca3af;
}



/* ==== Dark theme overrides for Speed Test block ==== */
html[data-theme="dark"] .tri-wrap {
  background: #020617;
  box-shadow: 0 26px 60px rgba(15, 23, 42, 0.9);
  border-radius: 16px;
  border: 1px solid rgba(148, 163, 184, 0.45);
}

html[data-theme="dark"] .tri-title {
  color: #e5e7eb;
}

html[data-theme="dark"] .tri-status {
  color: #9ca3af;
}

html[data-theme="dark"] .gauge {
  background: radial-gradient(140% 180% at 10% 0%, #1f2937 0%, #111827 60%, #020617 100%);
  border-color: rgba(148, 163, 184, 0.45);
}

html[data-theme="dark"] .g-label,
html[data-theme="dark"] .g-unit,
html[data-theme="dark"] .g-sub {
  fill: #9ca3af;
}

html[data-theme="dark"] .g-value {
  fill: #e5e7eb;
}

html[data-theme="dark"] .tri-controls .btn {
  background: #020617;
  color: #e5e7eb;
  border: 1px solid rgba(148, 163, 184, 0.5);
}

html[data-theme="dark"] .tri-controls .btn-primary {
  background: var(--accent-main, #ff9c2f);
  color: #ffffff;
  border-color: transparent;
}
