/* БАЗОВАЯ СБОРКА СТИЛЕЙ — полная верстка 1:1-стилизация по макету */
    :root{
      --blue:#00a7e0; /* яркий акцент */
      --dark:#24303a;
      --muted:#f3f6f8;
      --card:#ffffff;
      --accent:#01a0df;
      --radius:10px;
      --container:1200px;
      --text:#222;
       --primary-blue: #0686bf;
      --dark-blue: #0686bf;
      --light-blue: #e6f2ff;
      --gray-bg: #f5f7fa;
      --text-dark: #333;
      --text-light: #666;
      --border-color: #ddd;
    }
    *{box-sizing:border-box}
    body{font-family:Inter,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);margin:0;background:#fff}
    a{color:inherit;text-decoration:none}

    .container{max-width:var(--container);margin:0 auto;padding:0 20px}
  .table-wrapper {
      overflow-x: auto;
      margin: 1.5rem 0;
    }
    table {
      width: 100%;
      border-collapse: collapse;
      background: white;
      border-radius: 1rem;
      overflow: hidden;
      box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    }
    th {
      background-color: #eef3fc;
      padding: 12px 16px;
      text-align: left;
      font-weight: 600;
    }
    td {
      padding: 10px 16px;
      border-bottom: 1px solid #eef2f8;
    }
    /* HEADER */
    .topbar{background:var(--primary-blue);color:#fff;padding:18px 0}
    .header{display:flex;align-items:center;justify-content:space-between}
    .logo{display:flex;align-items:center;gap:12px;font-weight:700}
    .logo img{height:36px}
    .search{flex:1;max-width:520px;margin:0 30px}
    .search input{width:100%;padding:10px 14px;border-radius:20px;border:none}
    .lang{color:#fff}

    nav.mainnav{margin-top:6px;background:linear-gradient(180deg,#0da1dd,#0686bf);}
    .mainnav .container{display:flex;align-items:center;gap:26px;padding:10px 20px}
    .mainnav a{color:#fff;padding:8px 6px;display:inline-block}
.cooling-calc-button {
margin: 0 auto !important;
    display: block !important;
    max-width: 400px;
    text-align: center;
    padding: 20px !important;
    font-size: 23px !important;
    margin-top: 20px !important;}    /* HERO */
    .hero{    position: relative;
    background: url(/img/hero-bg.png) center / cover no-repeat;
    background-size: cover;
    min-height: 745px;
    display: flex;
    align-items: center;}
    .hero .hero-inner{padding:60px 20px;color:#fff}
    .hero h1{margin:0;font-size:40px}
    .hero p{margin-top:14px;opacity:0.95}

    /* Новости */
    .section{padding:60px 0}
    .section h2{text-align:center;margin:0 0 28px;font-size:26px}

    .news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
    .card{background:var(--card);border-radius:10px;padding:18px;box-shadow:0 6px 18px rgba(14,50,72,0.06)}
    .card img{width:100%;height:160px;object-fit:cover;border-radius:6px}
    .card .meta{font-size:13px;color:#4aa1c7;margin-top:12px}
    .card h3{margin:8px 0 10px;font-size:16px}
    .card p{font-size:14px;color:#606f78}
    .btn{display:inline-block;padding:8px 14px;border-radius:20px;background:var(--accent);color:#fff;margin-top:12px}

    /* Stats */
    .stats{display:flex;justify-content:space-around;gap:24px;padding:36px 0;background:#fbfeff}
    .stat{flex:1;text-align:center}
    .stat .num{font-size:34px;font-weight:700}
    .stat .label{color:#62757f;margin-top:6px}

    /* Каталог */
    .products{display:flex;flex-direction: row; justify-content: space-between; flex-wrap: wrap; padding:40px 0}
    .product{background:transparent;text-align:center}
    .product img{width:360px;height:360px;object-fit:contain;display:block;margin:0 auto}
    .product p{margin-top:12px;font-size:14px;color:#333}

    /* Применение */
    .applications{display:flex;gap:28px;align-items:center}
    .app-visual{flex:0 0 48%;min-height:220px;background:#e9f2f6;border-radius:10px;display:flex;align-items:center;justify-content:center}
    .app-desc{flex:1;background:#fff;padding:20px;border-radius:10px;box-shadow:0 6px 18px rgba(14,50,72,0.04)}
    .app-desc h4{margin:0 0 8px}
    .carousel-ind{opacity:0.6;margin-top:12px}

    .cookie-consent {
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
            background-color: #f1f1f1;
            padding: 15px 20px;
            box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
            display: none;
            z-index: 1000;
        }
        
        .cookie-consent.active {
            display: block;
        }
        
        .cookie-content {
            max-width: 1200px;
            margin: 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        
        .cookie-text {
            flex: 1;
            color: #333;
            font-size: 14px;
            line-height: 1.4;
        }
        
        .cookie-button {
            background-color:#0686bf; 
            color: white;
border: #1f509c solid 1px;
            padding: 8px 16px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 14px;
            margin-left: 20px;
            cursor: pointer;
            border-radius: 4px;
        }
        
        .cookie-button:hover {
            background-color: #fff;
            color: #1f509c;
        }

        .pull-left:hover, .pull-left:active, .pull-left:focus,.pull-right:hover, .pull-right:active,.pull-right:focus   {
            border: 1px solid #1f509c !important;
        }
.cookie-text a{text-decoration: underline;}
    /* Center download */
    .downloads{padding:26px 0}
    .download-row{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;border-radius:8px;background:#fff;box-shadow:0 6px 18px rgba(14,50,72,0.03);margin-bottom:12px}
    .download-row small{color:#6b7a82}
    .download-row a{color:var(--accent)}
.cooling-calc-button{
margin: 0 auto;    display: block;    max-width: 400px;    text-align: center;    padding: 30px;    font-size: 23px;    margin-top: 20px;}    /* Footer */
    footer{background:#23282b;color:#c9d1d6;padding:36px 0;margin-top:40px}
    .footer-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}
    footer a{color:#cfe9f6}
    .map-container {
            background: #ffffff;
            border-radius: 28px;
            box-shadow: 0 20px 35px -12px rgba(0, 0, 0, 0.2);
            padding: 16px 20px 20px 20px;
            transition: all 0.2s;
            max-width: 1200px;
            width: 100%;
            overflow-x: auto;
        }

        /* Декоративный заголовок */
        .map-header {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            margin-bottom: 16px;
            flex-wrap: wrap;
            gap: 12px;
        }
        .title-section h1 {
            font-size: 1.7rem;
            font-weight: 600;
            background: linear-gradient(135deg, #1e3c72, #2b4c8a);
            background-clip: text;
            -webkit-background-clip: text;
            color: transparent;
            letter-spacing: -0.3px;
        }
        .title-section p {
            color: #5a6874;
            font-size: 0.85rem;
            margin-top: 4px;
        }
        .legend {
            display: flex;
            gap: 24px;
            background: #f8fafc;
            padding: 8px 18px;
            border-radius: 60px;
            backdrop-filter: blur(2px);
        }
        .legend-item {
            display: flex;
            align-items: center;
            gap: 8px;
            font-size: 0.8rem;
            font-weight: 500;
            color: #1e2f3e;
        }
        .legend-color {
            width: 18px;
            height: 18px;
            border-radius: 20px;
            box-shadow: 0 1px 2px rgba(0,0,0,0.1);
        }
        .legend-color.office { background: #99d8c9; border: 1px solid #7bc0ae; }
        .legend-color.marker { background: #3b81bf; border: 1px solid white; box-shadow: 0 0 0 2px #3b81bf; border-radius: 50%; }

        /* SVG wrapper — адаптивная прокрутка */
        .svg-wrapper {
            display: flex;
            justify-content: center;
            border-radius: 20px;
            background: #ffffff;
            transition: all 0.2s;
        }
        svg {
            width: 100%;
            height: auto;
            display: block;
            cursor: pointer;
            border-radius: 16px;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
        }
.cooling-calc-button {
margin: 0 auto;    display: block;    max-width: 400px;    text-align: center;    padding: 30px;    font-size: 23px;    margin-top: 20px;}        /* Стили для кастомного тултипа */
        .custom-tooltip {
            position: fixed;
            background: rgba(10, 20, 30, 0.92);
            backdrop-filter: blur(8px);
            color: white;
            padding: 10px 18px;
            border-radius: 40px;
            font-size: 0.9rem;
            font-weight: 500;
            pointer-events: none;
            z-index: 1000;
            transition: opacity 0.2s ease, transform 0.1s;
            box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.3);
            border: 1px solid rgba(255,255,255,0.2);
            white-space: nowrap;
            font-family: 'Segoe UI', system-ui;
            letter-spacing: 0.2px;
        }
        .custom-tooltip strong {
            font-weight: 700;
            color: #ffd966;
        }
        /* Адаптив для мобильных — тултип переносится */
        @media (max-width: 640px) {
            .custom-tooltip { white-space: normal; max-width: 220px; text-align: center; border-radius: 20px; padding: 8px 14px; font-size: 0.8rem; }
            .legend { gap: 12px; padding: 5px 14px; }
        }
        /* легкий эффект при наведении на регионы (плавное изменение яркости) */
        .interactive-region {
            transition: filter 0.2s ease, opacity 0.2s;
            cursor: pointer;
        }
        .interactive-region:hover {
            filter: brightness(0.97) saturate(1.02);
        }
        /* маркерная точка */
        .interactive-marker {
            cursor: pointer;
            transition: transform 0.2s ease, r 0.2s;
            transform-origin: center;
        }
        .interactive-marker:hover {
            transform: scale(1.2);
        }
    /* Responsive */
    @media (max-width:1000px){
      .news-grid{grid-template-columns:repeat(2,1fr)}
      .products{grid-template-columns:repeat(2,1fr)}
      .mainnav .container{flex-wrap:wrap}
      .hero{min-height:300px}
    }
    @media (max-width:640px){
      .news-grid{grid-template-columns:1fr}
      .products{grid-template-columns:1fr}
      .apps{flex-direction:column}
      .stats{flex-direction:column}
      .mainnav .container{gap:8px}
    }


    lock {
      padding: 60px 0;
    }

    .font24 {
      font-size: 24px;
      margin-bottom: 30px;
    }
    .companyinfo-head {
        font-size: 26px;
        font-weight: bold;
    }
    
    .font20 {
          font-size: 20px;
      margin-bottom: 30px;
    }

    .text-icon-sm .text-icon-sm-icon img {
      width: 100%;
      height: auto;
      border-radius: 4px;
    }

    .certificate-slider img {
      display: block;
      margin: 0 auto 20px;
      max-width: 100%;
      height: auto;
    }
    .certificate-head {
        font-weight: bold;
    }
    .certificate-list {
        align-items: center;
        flex-direction: row;
        flex-wrap: wrap;
        margin-top: 20px;
    }

    .breadcrumb {
      background: none;
      padding: 15px 0;
      margin-bottom: 0;
    }

    .breadcrumb > li + li:before {
      content: "/\00a0";
      padding: 0 5px;
      color: #999;
    }

    .divider-sm {
      margin: 20px 0;
    }

    

    h5 {
      margin-top: 25px;
      margin-bottom: 15px;
    }

    /* Стили для Slick-стрелок (русский текст) */
    .slick-prev,
    .slick-next {
      z-index: 10;
      width: auto;
      height: auto;
      font-size: 14px;
      line-height: 1;
      background: rgba(0, 0, 0, 0.5);
      color: white !important;
      padding: 8px 12px;
      border-radius: 4px;
    }

    .slick-prev:hover,
    .slick-next:hover {
      background: rgba(0, 0, 0, 0.8);
    }

    @media (max-width: 767px) {
      .font24 {
        font-size: 18px;
      }
      .font20 {
        font-size: 16px
      }
      .companyinfo-head {font-size: 20px;}
    }


      /* Hero секция поддержки */
    .support-hero {
      background: linear-gradient(rgba(0, 102, 204, 0.9), rgba(0, 76, 153, 0.9)), url('https://images.unsplash.com/photo-1581091226825-a6a2a5aee158?ixlib=rb-4.0.3&auto=format&fit=crop&w=1200&q=80');
      background-size: cover;
      background-position: center;
      color: white;
      padding: 80px 0;
      text-align: center;
    }
    
    .support-hero h1 {
      font-size: 42px;
      margin-bottom: 20px;
      font-weight: 300;
    }
    
    .support-hero p {
      font-size: 20px;
      max-width: 700px;
      margin: 0 auto 30px;
    }
    
    .search-large {
      max-width: 600px;
      margin: 0 auto;
      position: relative;
    }
    
    .search-large input {
      width: 100%;
      padding: 18px 20px;
      border: none;
      border-radius: 4px;
      font-size: 16px;
      box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }
    
    .search-large button {
      position: absolute;
      right: 10px;
      top: 50%;
      transform: translateY(-50%);
      background: var(--primary-blue);
      color: white;
      border: none;
      padding: 10px 20px;
      border-radius: 4px;
      cursor: pointer;
    }
    
    /* Секции поддержки */
    .support-section {
      padding: 80px 0;
    }
    
    .section-title {
      text-align: center;
      margin-bottom: 50px;
    }
    
    .section-title h2 {
      font-size: 36px;
      color: var(--primary-blue);
      margin-bottom: 15px;
      font-weight: 300;
    }
    
    .section-title p {
      color: var(--text-light);
      max-width: 700px;
      margin: 0 auto;
    }
    
    /* Карточки поддержки */
    .support-cards {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
      gap: 30px;
      margin-top: 40px;
    }
    
    .support-card {
      background: white;
      border-radius: 8px;
      overflow: hidden;
      box-shadow: 0 5px 15px rgba(0,0,0,0.05);
      transition: transform 0.3s, box-shadow 0.3s;
      border: 1px solid var(--border-color);
    }
    
    .support-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 10px 25px rgba(0,0,0,0.1);
    }
    
    .card-icon {
      background-color: var(--light-blue);
      padding: 30px;
      text-align: center;
      color: var(--primary-blue);
      font-size: 48px;
    }
    
    .card-content {
      padding: 25px;
    }
    
    .card-content h3 {
      margin-bottom: 15px;
      color: var(--primary-blue);
      font-size: 22px;
    }
    
    .card-content p {
      color: var(--text-light);
      margin-bottom: 20px;
    }
    
    .card-link {
      color: var(--primary-blue);
      text-decoration: none;
      font-weight: 600;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      transition: gap 0.3s;
    }
    
    .card-link:hover {
      gap: 12px;
    }
    
    /* Документы и загрузки */
    .documents-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 25px;
    }
    
    .document-card {
      background: white;
      border: 1px solid var(--border-color);
      border-radius: 6px;
      padding: 25px;
      display: flex;
      align-items: flex-start;
      gap: 20px;
      transition: box-shadow 0.3s;
    }
    
    .document-card:hover {
      box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    }
    
    .doc-icon {
      color: var(--primary-blue);
      font-size: 32px;
      flex-shrink: 0;
    }
    
    .doc-info h4 {
      margin-bottom: 10px;
      color: var(--text-dark);
    }
    
    .doc-meta {
      color: var(--text-light);
      font-size: 14px;
      margin-bottom: 15px;
    }
    
    .download-btn {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: var(--primary-blue);
      color: white;
      padding: 8px 16px;
      border-radius: 4px;
      text-decoration: none;
      font-size: 14px;
      transition: background-color 0.3s;
    }
    
    .download-btn:hover {
      background-color: var(--dark-blue);
    }
    
    /* FAQ секция */
    .faq-container {
      max-width: 900px;
      margin: 0 auto;
    }
    
    .faq-item {
      border-bottom: 1px solid var(--border-color);
      padding: 20px 0;
    }
    
    .faq-question {
      display: flex; 
      align-items: center;
      cursor: pointer;
      font-size: 18px;
      font-weight: 500;
    }
    
    .faq-question i {
      transition: transform 0.3s;
    }
    
    .faq-item.active .faq-question i {
      transform: rotate(180deg);
    }
    
    .faq-answer { 
      overflow: hidden;
      transition: max-height 0.3s, padding 0.3s;
      color: var(--text-light);
    }
    
    .faq-item.active .faq-answer {
      max-height: 500px;
      padding-top: 15px;
    }
    
    /* Контактная форма */
    .contact-section {
      background-color: var(--gray-bg);
      padding: 80px 0;
    }
    
    .contact-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 40px;
    }
    
    .contact-info h3 {
      margin-bottom: 20px;
      color: var(--primary-blue);
    }
    
    .contact-item {
      display: flex;
      align-items: flex-start;
      gap: 15px;
      margin-bottom: 25px;
    }
    
    .contact-icon {
      background: var(--primary-blue);
      color: white;
      width: 40px;
      height: 40px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }
    
    .contact-form .form-group {
      margin-bottom: 20px;
    }
    
    .contact-form label {
      display: block;
      margin-bottom: 8px;
      font-weight: 500;
    }
    
    .contact-form input,
    .contact-form textarea,
    .contact-form select {
      width: 100%;
      padding: 12px 15px;
      border: 1px solid var(--border-color);
      border-radius: 4px;
      font-family: inherit;
      font-size: 16px;
    }
    
    .contact-form textarea {
      min-height: 150px;
      resize: vertical;
    }
    
    .contact-form input[type="file"] {
      padding: 8px 15px;
      background: white;
    }
    
    .submit-btn {
      background: var(--primary-blue);
      color: white;
      border: none;
      padding: 15px 30px;
      border-radius: 4px;
      font-size: 16px;
      cursor: pointer;
      transition: background-color 0.3s;
    }
    
    .submit-btn:hover {
      background-color: var(--dark-blue);
    }
    
    /* Стили для кнопок */
    .btn-primary {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      background: var(--primary-blue);
      color: white;
      padding: 12px 24px;
      border-radius: 4px;
      text-decoration: none;
      font-weight: 500;
      border: none;
      cursor: pointer;
      transition: background-color 0.3s;
    }
    
    .btn-primary:hover {
      background-color: var(--dark-blue);
    }
    
    /* Адаптивность */
    @media (max-width: 768px) {
      .support-hero h1 {
        font-size: 32px;
      }
      
      .support-hero p {
        font-size: 18px;
      }
      
      .section-title h2 {
        font-size: 28px;
      }
      
      .support-cards {
        grid-template-columns: 1fr;
      }
      
      .documents-grid {
        grid-template-columns: 1fr;
      }
      
      .contact-grid {
        grid-template-columns: 1fr;
      }
    }
    
    @media (max-width: 480px) {
      .support-hero {
        padding: 50px 0;
      }
      
      .support-section {
        padding: 50px 0;
      }
      
      .search-large input {
        padding: 14px 15px;
        font-size: 14px;
      }
      
      .search-large button {
        padding: 8px 15px;
        font-size: 14px;
      }
      
      .support-card {
        margin: 0 10px;
      }
      
      .document-card {
        flex-direction: column;
        text-align: center;
      }
      
      .contact-item {
        flex-direction: column;
        text-align: center;
        gap: 10px;
      }
    }
    
    /* Вспомогательные классы */
    .text-center {
      text-align: center;
    }
    
    .mt-40 {
      margin-top: 40px;
    }
    
    .mb-30 {
      margin-bottom: 30px;
    }
.contact-item h4 {
    margin-top: 0;
    margin-bottom: 0;
}

       /* HERO для страницы НИОКР */
        .rd-hero {
            position: relative;
            background: linear-gradient(rgba(6, 134, 191, 0.9), rgba(0, 102, 153, 0.9)), url('https://images.unsplash.com/photo-1518709268805-4e9042af2176?ixlib=rb-4.0.3&auto=format&fit=crop&w=1200&q=80');
            background-size: cover;
            background-position: center;
            color: white;
            padding: 100px 0;
            text-align: center;
        }
        
        .rd-hero h1 {
            font-size: 42px;
            margin-bottom: 20px;
            font-weight: 300;
        }
        
        .rd-hero p {
            font-size: 20px;
            max-width: 700px;
            margin: 0 auto 30px;
            opacity: 0.95;
        }
        
        /* Секции НИОКР */
        .rd-section {
            padding: 80px 0;
        }
        
        .rd-section.bg-light {
            background-color: var(--muted);
        }
        
        .rd-section.bg-gray {
            background-color: var(--gray-bg);
        }
        
        .section-header {
            text-align: center;
            margin-bottom: 50px;
        }
        
        .section-header h2 {
            font-size: 36px;
            color: var(--primary-blue);
            margin-bottom: 15px;
            font-weight: 300;
        }
        
        .section-header p {
            color: var(--text-light);
            max-width: 700px;
            margin: 0 auto;
        }
        
        /* Карточки направлений НИОКР */
        .focus-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
            gap: 30px;
            margin-top: 40px;
        }
        
        .focus-card {
            background: var(--card);
            border-radius: var(--radius);
            padding: 30px;
            box-shadow: 0 6px 18px rgba(14,50,72,0.06);
            border: 1px solid var(--border-color);
            transition: transform 0.3s, box-shadow 0.3s;
        }
        
        .focus-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 25px rgba(14,50,72,0.1);
        }
        
        .focus-icon {
            background-color: var(--light-blue);
            width: 60px;
            height: 60px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 20px;
            color: var(--primary-blue);
            font-size: 24px;
        }
        
        .focus-card h3 {
            margin-bottom: 15px;
            color: var(--primary-blue);
            font-size: 22px;
        }
        
        .focus-card ul {
            padding-left: 20px;
            margin: 15px 0;
        }
        
        .focus-card li {
            margin-bottom: 10px;
            padding-left: 5px;
            color: var(--text-light);
        }
        
        .focus-card strong {
            color: var(--text-dark);
        }
        
        /* Карточки возможностей и испытательных центров */
        .capabilities-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 30px;
            margin-top: 40px;
        }
        
        .capability-card {
            background: var(--card);
            border-radius: var(--radius);
            overflow: hidden;
            box-shadow: 0 6px 18px rgba(14,50,72,0.06);
            transition: transform 0.3s;
            border: 1px solid var(--border-color);
        }
        
        .capability-card:hover {
            transform: translateY(-8px);
            box-shadow: 0 10px 25px rgba(14,50,72,0.1);
        }
        
        .card-image {
            height: 180px;
            background-color: var(--light-blue);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 48px;
            color: var(--primary-blue);
        }
        
        .card-content {
            padding: 25px;
        }
        
        .card-content h3 {
            margin-bottom: 15px;
            color: var(--primary-blue);
            font-size: 20px;
        }
        
        .card-content ul {
            padding-left: 20px;
            margin: 15px 0;
        }
        
        .card-content li {
            margin-bottom: 8px;
            color: var(--text-light);
        }
        
        /* Контактная форма в стиле Leipole */
        .contact-form-wrapper {
            background: var(--card);
            border-radius: var(--radius);
            padding: 50px;
            box-shadow: 0 6px 18px rgba(14,50,72,0.06);
            max-width: 800px;
            margin: 0 auto;
            border: 1px solid var(--border-color);
        }
        
        .form-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 25px;
            margin-bottom: 25px;
        }
        
        .form-group {
            margin-bottom: 20px;
        }
        
        .form-group.full-width {
            grid-column: span 2;
        }
        
        label {
            display: block;
            margin-bottom: 8px;
            font-weight: 500;
            color: var(--text-dark);
        }
        
        input, select, textarea {
            width: 100%;
            padding: 14px;
            border: 1px solid var(--border-color);
            border-radius: 4px;
            font-size: 1rem;
            font-family: inherit;
            transition: border 0.3s ease;
        }
        
        input:focus, select:focus, textarea:focus {
            outline: none;
            border-color: var(--primary-blue);
            box-shadow: 0 0 0 3px rgba(6, 134, 191, 0.1);
        }
        
        .submit-btn {
            background: var(--primary-blue);
            color: white;
            border: none;
            padding: 15px 30px;
            border-radius: 4px;
            font-size: 16px;
            cursor: pointer;
            display: block;
            margin: 30px auto 0;
            transition: background-color 0.3s;
        }
        
        .submit-btn:hover {
            background-color: var(--dark-blue);
        }
        
        /* Stats в стиле Leipole */
        .rd-stats {
            display: flex;
            justify-content: space-around;
            gap: 24px;
            padding: 36px 0;
            background: #fbfeff;
        }
        
        .rd-stat {
            flex: 1;
            text-align: center;
        }
        
        .rd-stat .num {
            font-size: 34px;
            font-weight: 700;
            color: var(--primary-blue);
        }
        
        .rd-stat .label {
            color: var(--text-light);
            margin-top: 6px;
        }
        
        /* Footer (адаптируем под ваш стиль) */
        footer {
            background: #23282b;
            color: #c9d1d6;
            padding: 36px 0;
            margin-top: 40px;
        }
        
        .footer-grid {
            display: grid;
            grid-template-columns: 1fr 1fr 1fr;
            gap: 20px;
        }
        
        footer a {
            color: #cfe9f6;
        }
        
        /* Breadcrumbs */
        .breadcrumb {
            background: none;
            padding: 15px 0;
            margin-bottom: 0;
            list-style: none;
            display: flex;
        }
        
        .breadcrumb li {
            margin-right: 10px;
        }
        
        .breadcrumb > li + li:before {
            content: "/\00a0";
            padding: 0 5px;
            color: #999;
        }
        
        /* Кнопки в стиле Leipole */
        .btn {
            display: inline-block;
            padding: 8px 14px;
            border-radius: 20px;
            background: var(--accent);
            color: #fff;
            margin-top: 12px;
            font-size: 14px;
        }
        
        /* Адаптивность */
        @media (max-width: 1000px) {
            .focus-grid {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .capabilities-grid {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .mainnav .container {
                flex-wrap: wrap;
            }
        }

        @media screen and (min-width: 996px) {
            .rd-stats-list {
                display: flex;
                flex-direction: row;
                justify-content: space-between;
            }
            .automation-list {
              margin-top: 50px;
            }
        }
        
        @media (max-width: 768px) {
            .rd-hero h1 {
                font-size: 32px;
            }
            
            .rd-hero p {
                font-size: 18px;
            }
            
            .section-header h2 {
                font-size: 28px;
            }
            
            .focus-grid {
                grid-template-columns: 1fr;
            }
            
            .capabilities-grid {
                grid-template-columns: 1fr;
            }
            
            .form-grid {
                grid-template-columns: 1fr;
            }
            
            .form-group.full-width {
                grid-column: span 1;
            }
            
            .contact-form-wrapper {
                padding: 30px 20px;
            }
            
            .rd-stats {
                flex-direction: column;
            }
            
            .footer-grid {
                grid-template-columns: 1fr;
            }
        }
        
        @media (max-width: 480px) {
            .rd-hero {
                padding: 50px 0;
            }
            
            .rd-section {
                padding: 50px 0;
            }
        }


        /* ===== СТИЛИ ДЛЯ СТРАНИЦЫ "ГЛОБАЛЬНОЕ ПРИСУТСТВИЕ" ===== */

/* Герой-секция для страницы "Глобальное присутствие" */
.global-presence-hero {
    position: relative;
    background: linear-gradient(rgba(6, 134, 191, 0.9), rgba(0, 102, 153, 0.9)), 
                url('https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?ixlib=rb-4.0.3&auto=format&fit=crop&w=1200&q=80');
    background-size: cover;
    background-position: center;
    color: white;
    padding: 100px 0;
    text-align: center;
}

.global-presence-hero h1 {
    font-size: 42px;
    margin-bottom: 20px;
    font-weight: 300;
}

.global-presence-hero p {
    font-size: 20px;
    max-width: 700px;
    margin: 0 auto 30px;
    opacity: 0.95;
}

/* Основной контент страницы */
.page-global-presence .page-content {
    padding: 60px 0;
}

/* Стили для заголовков Elementor на этой странице */
.page-global-presence .elementor-heading-title {
    color: var(--primary-blue);
    margin-bottom: 20px;
}

.page-global-presence .elementor-widget-heading h2 {
    font-size: 36px;
    font-weight: 300;
}

.page-global-presence .elementor-widget-heading h3 {
    font-size: 28px;
    color: var(--text-dark);
    margin-bottom: 15px;
}

.page-global-presence .elementor-widget-heading h5 {
    font-size: 20px;
    color: var(--primary-blue);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 15px;
}

/* Стили для текстового контента */
.page-global-presence .elementor-widget-text-editor p {
    color: var(--text-light);
    line-height: 1.7;
    margin-bottom: 20px;
    font-size: 16px;
}

.page-global-presence .elementor-widget-text-editor a {
    color: var(--primary-blue);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.3s;
}

.page-global-presence .elementor-widget-text-editor a:hover {
    color: var(--dark-blue);
    text-decoration: underline;
}

/* Стили для иконок-боксов (ElementsKit) */
.page-global-presence .elementskit-infobox {
    background: var(--card);
    border-radius: var(--radius);
    padding: 30px;
    box-shadow: 0 6px 18px rgba(14, 50, 72, 0.06);
    border: 1px solid var(--border-color);
    height: 100%;
    transition: transform 0.3s, box-shadow 0.3s;
}

.page-global-presence .elementskit-infobox:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(14, 50, 72, 0.1);
}

.page-global-presence .elementskit-info-box-icon {
    background-color: var(--light-blue);
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    color: var(--primary-blue);
    font-size: 32px;
}

.page-global-presence .elementskit-info-box-icon svg,
.page-global-presence .elementskit-info-box-icon i {
    width: 32px;
    height: 32px;
}

.page-global-presence .elementskit-info-box-title {
    color: var(--primary-blue);
    font-size: 22px;
    margin-bottom: 15px;
    font-weight: 600;
}

/* Секция с картой/локациями */
.global-map-section {
    background-color: var(--muted);
    padding: 80px 0;
}

.map-container {
    position: relative; 
    margin: 0 auto;
    background: var(--card);
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.map-visual { 
    background: #e9f2f6;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Стили для списка локаций */
.locations-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
    margin-top: 50px;
}

.location-card {
    background: var(--card);
    border-radius: var(--radius);
    padding: 25px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    border: 1px solid var(--border-color);
    transition: transform 0.3s;
}

.location-card:hover {
    transform: translateY(-5px);
}

.location-flag {
    font-size: 32px;
    margin-bottom: 15px;
}

.location-card h4 {
    color: var(--primary-blue);
    margin-bottom: 10px;
    font-size: 18px;
}

.location-contacts {
    margin-top: 15px;
    font-size: 14px;
    color: var(--text-light);
}

.location-contacts p {
    margin: 5px 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Секция статистики для этой страницы */
.global-stats {
    display: flex;
    justify-content: space-around;
    gap: 30px;
    padding: 60px 0;
    background: linear-gradient(135deg, var(--light-blue), #ffffff);
}

.global-stat {
    text-align: center;
    flex: 1;
}

.global-stat .number {
    font-size: 48px;
    font-weight: 700;
    color: var(--primary-blue);
    display: block;
    line-height: 1;
    margin-bottom: 10px;
}

.global-stat .label {
    color: var(--text-light);
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Стили для секции "Как нас найти" */
.contact-regions {
    background: var(--card);
    border-radius: var(--radius);
    padding: 40px;
    margin-top: 40px;
    border-left: 4px solid var(--primary-blue);
}

.region-contacts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-top: 20px;
}

.region-contact {
    padding: 15px;
    background: var(--muted);
    border-radius: 6px;
    border-left: 3px solid var(--accent);
}

.region-contact strong {
    color: var(--primary-blue);
    display: block;
    margin-bottom: 5px;
}

/* Адаптивность для этой страницы */
@media (max-width: 768px) {
    .global-presence-hero h1 {
        font-size: 32px;
    }
    
    .global-presence-hero p {
        font-size: 18px;
    }
    
    .page-global-presence .elementor-widget-heading h2 {
        font-size: 28px;
    }
    
    .page-global-presence .elementor-widget-heading h3 {
        font-size: 24px;
    }
    
    .global-stats {
        flex-direction: column;
        gap: 40px;
    }
    
    .global-stat .number {
        font-size: 36px;
    }
    
    .locations-grid {
        grid-template-columns: 1fr;
    }
    
    .contact-regions {
        padding: 25px 20px;
    }
    
    .region-contacts {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .global-presence-hero {
        padding: 60px 0;
    }
    
    .page-global-presence .elementskit-infobox {
        padding: 20px;
    }
    
  
}


.global-map-section svg {
    height: 557px !important;
}


    .tabs {
      max-width: 1200px;
      margin: 0 auto;
    }
    .tab-list {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-bottom: 24px;
      border-bottom: 1px solid #ddd;
      padding-bottom: 12px;
    }
    .tab-button {
      background: #f0f0f0;
      border: none;
      padding: 10px 20px;
      cursor: pointer;
      font-weight: 600;
      border-radius: 4px 4px 0 0;
      transition: all 0.2s;
    }
    .tab-button.active {
      background: #0686bf;
      color: white;
    }
    .tab-content {
      display: none;
    }
    .tab-content.active {
      display: block;
    }
    .section-header {
      margin-bottom: 24px;
    }
    .section-title {
      font-size: 28px;
      margin-bottom: 12px;
      color: #0686bf;
    }
    .section-description {
      font-size: 16px;
      color: #555;
      margin-bottom: 16px;
      white-space: pre-wrap;
    }
    .contact-button {
      display: inline-block;
      background: #0686bf;
      color: white;
      padding: 8px 20px;
      text-decoration: none;
      border-radius: 4px;
      font-weight: 500;
    }
    .faq-item {
      border-bottom: 1px solid #eee;
      padding: 12px 0;
    }
    .faq-question {
      display: flex;
      align-items: center;
      cursor: pointer;
      font-weight: 600;
    }
    .faq-icon {
      margin-right: 10px;
      transition: transform 0.2s;
    }
    .faq-icon.open {
      transform: rotate(90deg);
    }
    .faq-answer {
      margin-top: 8px;
      padding-left: 24px;
      color: #555;
      display: none;
    }
    .faq-answer.show {
      display: block;
    }
    .products-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
      gap: 20px;
      margin-top: 24px;
    }
    .product-card {
      border: 1px solid #ddd;
      border-radius: 8px;
      overflow: hidden;
      background: #fafafa;
      transition: box-shadow 0.2s;
          display: flex;
    flex-direction: column;
    justify-content: space-between;
    }
    .product-card:hover {
      box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }
    .product-image {
      height: 140px;
      background-size: cover;
      background-position: center;
    }
    .product-content {
      padding: 16px;
    }
    .product-title {
      font-size: 18px;
      margin-bottom: 12px;
      color: #222;
    }
    .product-link {
      display: inline-block;
      background: #0686bf;
      color: white;
      text-decoration: none;
      padding: 6px 16px;
      border-radius: 4px;
      font-size: 14px;
    }
    .product-link:hover, .contact-button:hover {
      text-decoration: none;
      color: #fff;
    }
    .contact-button {
      margin-top: 50px;
    }
    
    @media (max-width: 768px) {
      .tab-list {
        flex-direction: column;
      }
      .tab-button {
        border-radius: 4px;
      }
      .products-grid {
        grid-template-columns: 1fr;
      }
    }
    
.products-list {
  margin-top: 30px;
}
.products-grid {
  margin-top: 30px;
}

        /* HERO */
        .hero{    
            position: relative;
            background: linear-gradient(rgba(6, 134, 191, 0.9), rgba(4, 106, 156, 0.9)), 
                        url('https://images.unsplash.com/photo-1504307651254-35680f356dfd?ixlib=rb-4.0.3&auto=format&fit=crop&w=1950&q=80') center/cover no-repeat;
            min-height: 600px;
            display: flex;
            align-items: center;
            color: white;
        }
        .hero-content{max-width:800px;padding:40px 0}
        .hero h1{font-size:42px;margin:0 0 20px;font-weight:300}
        .hero p{font-size:18px;margin-bottom:30px;opacity:0.95}
        
        .market-stats{display:flex;gap:40px;margin-top:50px;flex-wrap:wrap}
        .stat-item{background:rgba(255,255,255,0.15);padding:20px;border-radius:var(--radius);min-width:200px}
        .stat-value{font-size:2rem;font-weight:700;color:#ffd700}
        .stat-label{font-size:0.9rem;margin-top:5px}
        
        /* SECTIONS */
        .section{padding:80px 0}
        .section-title{text-align:center;margin-bottom:50px;color:var(--primary-blue)}
        .section-title h2{font-size:36px;margin:0 0 15px;font-weight:300}
        .section-subtitle{text-align:center;color:var(--text-light);max-width:800px;margin:0 auto 60px;font-size:18px}
        
        /* PROBLEM AREAS */
        .problem-areas{margin-bottom:60px}
        .area-title{display:flex;align-items:center;gap:15px;margin:40px 0 20px;color:var(--primary-blue)}
        .area-title i{font-size:1.5rem}
        .problems-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));gap:30px}
        
        .problem-card{
            background:var(--gray-bg);
            border-radius:var(--radius);
            padding:25px;
            border-left:4px solid var(--primary-blue);
            box-shadow:0 5px 15px rgba(0,0,0,0.05)
        }
        .problem-card h4{margin:0 0 15px;color:var(--dark-blue)}
        .solution-list{margin-top:20px;padding-top:20px;border-top:1px solid var(--border-color)}
        .solution-list h5{color:var(--primary-blue);margin-bottom:10px}
        .solution-list ul{padding-left:20px;margin:0}
        .solution-list li{margin-bottom:8px;color:var(--text-light)}
        
        /* LEIPOLE SOLUTIONS */
        .solutions-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(350px, 1fr));gap:30px}
        .solution-category{
            background:white;
            border-radius:var(--radius);
            padding:30px;
            box-shadow:0 10px 30px rgba(0,0,0,0.08);
            border:1px solid var(--border-color)
        }
        .solution-header{display:flex;align-items:center;gap:15px;margin-bottom:25px;padding-bottom:15px;border-bottom:2px solid var(--light-blue)}
        .solution-header i{color:var(--primary-blue);font-size:1.8rem}
        .solution-header h3{margin:0;color:var(--dark-blue)}
        
        .feature-item{margin-bottom:20px}
        .feature-title{display:flex;align-items:center;gap:10px;margin-bottom:8px}
        .feature-title i{color:var(--accent)}
        .feature-desc{color:var(--text-light);margin-left:26px}
        
        /* APPLICATIONS GRID */
        .applications-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));gap:25px;margin-top:40px}
        .app-card{
            background:white;
            border-radius:var(--radius);
            padding:25px;
            text-align:center;
            box-shadow:0 5px 15px rgba(0,0,0,0.05);
            transition:transform 0.3s
        }
        .app-card:hover{transform:translateY(-5px)}
        .app-icon{font-size:2.5rem;color:var(--primary-blue);margin-bottom:15px}
        .app-card h4{margin:0 0 10px;color:var(--dark-blue)}
        
        /* FOOTER */
        footer{background:#23282b;color:#c9d1d6;padding:36px 0;margin-top:40px}
        .footer-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));gap:30px}
        .footer-section h4{color:#fff;margin-bottom:20px}
        .footer-links{list-style:none;padding:0;margin:0}
        .footer-links li{margin-bottom:10px}
        .footer-links a{color:#cfe9f6;text-decoration:none}
        .footer-links a:hover{color:#fff}
        
        /* BUTTONS */
        .btn{
            display:inline-block;
            background:var(--primary-blue);
            color:white;
            padding:12px 24px;
            border-radius:4px;
            text-decoration:none;
            font-weight:500;
            border:none;
            cursor:pointer;
            transition:background-color 0.3s
        }
        .btn:hover{background-color:var(--dark-blue);color:#fff}
        
        /* RESPONSIVE */
        @media (max-width:992px){
            .hero h1{font-size:32px}
            .hero p{font-size:16px}
            .market-stats{gap:20px}
            .stat-item{min-width:180px}
            .solutions-grid{grid-template-columns:1fr}
            .mainnav .container{flex-wrap:wrap;gap:15px}
        }
        @media (max-width:768px){
            .header{flex-direction:column;gap:15px}
            .search{max-width:100%;margin:15px 0}
            .hero{min-height:500px}
            .section{padding:50px 0}
            .section-title h2{font-size:28px}
            .problems-grid{grid-template-columns:1fr}
            .applications-grid{grid-template-columns:repeat(2,1fr)}
        }
        @media (max-width:480px){
            .applications-grid{grid-template-columns:1fr}
            .market-stats{flex-direction:column}
            .stat-item{width:100%}
        }
        
        /* CONTENT BOXES */
        .content-box{background:var(--card);border-radius:var(--radius);padding:30px;box-shadow:0 6px 18px rgba(14,50,72,0.06);margin-bottom:30px}
        .content-box h3{color:var(--primary-blue);margin-top:0;font-size:24px;border-bottom:2px solid var(--light-blue);padding-bottom:10px}
        
        /* TABLES */
        .comparison-table{width:100%;border-collapse:collapse;margin:30px 0}
        .comparison-table th{background:var(--primary-blue);color:white;padding:15px;text-align:left;font-weight:600}
        .comparison-table td{padding:15px;border-bottom:1px solid var(--border-color)}
        .comparison-table tr:nth-child(even){background:var(--muted)}
        .comparison-table tr:hover{background:var(--light-blue)}
        
        /* HIGHLIGHT BOXES */
        .highlight-box{background:var(--light-blue);border-left:4px solid var(--primary-blue);padding:20px;margin:25px 0;border-radius:0 var(--radius) var(--radius) 0}
        .warning-box{background:#fff8e6;border-left:4px solid #ffc107;padding:20px;margin:25px 0;border-radius:0 var(--radius) var(--radius) 0}
        
        /* LISTS */
        .tech-list{padding-left:20px}
        .tech-list li{margin-bottom:15px;padding-left:10px;position:relative}
        .tech-list li:before{content:"•";color:var(--primary-blue);font-weight:bold;position:absolute;left:0}
        
        /* STEP-BY-STEP */
        .steps-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));gap:25px;margin:40px 0}
        .step-card{background:var(--card);border-radius:var(--radius);padding:25px;box-shadow:0 5px 15px rgba(0,0,0,0.05);border:1px solid var(--border-color)}
        .step-number{display:inline-block;background:var(--primary-blue);color:white;width:40px;height:40px;border-radius:50%;text-align:center;line-height:40px;font-weight:bold;margin-bottom:15px}
        .step-card h4{margin:10px 0;color:var(--dark-blue)}
        
        /* INDUSTRY GRID */
        .industry-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));gap:30px;margin:40px 0}
        .industry-card{background:var(--card);border-radius:var(--radius);padding:25px;box-shadow:0 6px 18px rgba(14,50,72,0.06);border-top:4px solid var(--primary-blue)}
        .industry-card h4{color:var(--primary-blue);margin-top:0;font-size:20px}
        
        /* FOOTER */
        footer{background:#23282b;color:#c9d1d6;padding:36px 0;margin-top:40px}
        .footer-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));gap:30px}
        .footer-section h4{color:#fff;margin-bottom:20px}
        .footer-links{list-style:none;padding:0;margin:0}
        .footer-links li{margin-bottom:10px}
        .footer-links a{color:#cfe9f6;text-decoration:none}
        .footer-links a:hover{color:#fff}
        
        /* BUTTONS */
        .btn{
            display:inline-block;
            background:var(--primary-blue);
            color:white;
            padding:12px 24px;
            border-radius:4px;
            text-decoration:none;
            font-weight:500;
            border:none;
            cursor:pointer;
            transition:background-color 0.3s
        }
        .btn:hover{background-color:var(--dark-blue);color:#fff}
        
        /* RESPONSIVE */
        @media (max-width:992px){
            .hero h1{font-size:32px}
            .hero p{font-size:16px}
            .mainnav .container{flex-wrap:wrap;gap:15px}
        }
        @media (max-width:768px){
            .header{flex-direction:column;gap:15px}
            .search{max-width:100%;margin:15px 0}
            .hero{min-height:500px}
            .section{padding:50px 0}
            .section-title h2{font-size:28px}
            .comparison-table{display:block;overflow-x:auto}
        }
        @media (max-width:480px){
            .steps-grid{grid-template-columns:1fr}
            .industry-grid{grid-template-columns:1fr}
        }

        /* ===================== */
/* УЛУЧШЕНИЯ ВИЗУАЛЬНОГО ВИДА */
/* ===================== */

/* 1. УЛУЧШЕННЫЕ СТИЛИ ДЛЯ ТАБЛИЦ */
.product-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin: 30px 0;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
    background: white;
}

.product-table th {
    background: linear-gradient(135deg, var(--primary-blue), #0a7cb5);
    color: white;
    padding: 18px 15px;
    text-align: left;
    font-weight: 600;
    font-size: 15px;
    border-bottom: 2px solid var(--dark-blue);
    position: relative;
}

.product-table th:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: rgba(255, 255, 255, 0.3);
}

.product-table td {
    padding: 16px 15px;
    border-bottom: 1px solid #f0f0f0;
    color: var(--text-dark);
    font-size: 14px;
    transition: all 0.2s ease;
}

.product-table tr:last-child td {
    border-bottom: none;
}

.product-table tr:nth-child(even) {
    background: rgba(230, 242, 255, 0.3);
}

.product-table tr:hover {
    background: rgba(6, 134, 191, 0.08);
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.05);
}

/* 2. УЛУЧШЕННЫЕ КАРТОЧКИ ПРЕИМУЩЕСТВ */
.advantage-card {
    background: linear-gradient(145deg, #ffffff, #f8fafc);
    border-radius: 12px;
    padding: 25px;
    border: 1px solid rgba(6, 134, 191, 0.1);
    box-shadow: 
        0 4px 6px rgba(6, 134, 191, 0.05),
        0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.advantage-card:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(to bottom, var(--primary-blue), var(--dark-blue));
}

.advantage-card:hover {
    transform: translateY(-5px);
    box-shadow: 
        0 10px 25px rgba(6, 134, 191, 0.1),
        0 5px 10px rgba(0, 0, 0, 0.05);
    border-color: rgba(6, 134, 191, 0.3);
}

.advantage-card i {
    color: var(--primary-blue);
    font-size: 28px;
    margin-bottom: 20px;
    background: linear-gradient(135deg, var(--light-blue), #ffffff);
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(6, 134, 191, 0.1);
}

.advantage-card h3 {
    color: var(--primary-blue);
    margin-bottom: 15px;
    font-size: 20px;
    font-weight: 600;
}

/* 3. УЛУЧШЕННЫЕ КАРТОЧКИ ПРИМЕНЕНИЯ */
.application-card {
    background: linear-gradient(145deg, #ffffff, #f8fafc);
    border-radius: 12px;
    padding: 30px 25px;
    text-align: center;
    border: 1px solid rgba(6, 134, 191, 0.1);
    box-shadow: 
        0 4px 6px rgba(6, 134, 191, 0.05),
        0 1px 3px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.application-card:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(to right, var(--primary-blue), var(--dark-blue));
}

.application-card:hover {
    transform: translateY(-8px);
    box-shadow: 
        0 15px 30px rgba(6, 134, 191, 0.15),
        0 8px 15px rgba(0, 0, 0, 0.07);
}

.application-card i {
    font-size: 3rem;
    color: var(--primary-blue);
    margin-bottom: 20px;
    background: linear-gradient(135deg, var(--light-blue), #ffffff);
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    margin: 0 auto 20px;
    box-shadow: 0 6px 12px rgba(6, 134, 191, 0.1);
}

.application-card h3 {
    color: var(--primary-blue);
    margin-bottom: 15px;
    font-size: 20px;
    font-weight: 600;
}

.application-card p {
    color: var(--text-light);
    line-height: 1.6;
}

/* 4. УЛУЧШЕННЫЙ CONTENT-BOX */
.content-box {
    background: linear-gradient(145deg, #ffffff, #f8fafc);
    border-radius: 12px;
    padding: 35px;
    border: 1px solid rgba(6, 134, 191, 0.1);
    box-shadow: 
        0 6px 12px rgba(6, 134, 191, 0.08),
        0 2px 4px rgba(0, 0, 0, 0.05);
    margin-bottom: 40px;
    position: relative;
    overflow: hidden;
}

.content-box:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(to right, var(--primary-blue), var(--dark-blue));
}

.content-box h3 {
    color: var(--primary-blue);
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 24px;
    font-weight: 600;
    padding-bottom: 15px;
    border-bottom: 2px solid var(--light-blue);
    position: relative;
}

.content-box h3:after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100px;
    height: 2px;
    background: linear-gradient(to right, var(--primary-blue), transparent);
}

/* 5. УЛУЧШЕННЫЕ СЕКЦИИ ПРОБЛЕМ/РЕШЕНИЙ */
.problems, .solutions {
    background: linear-gradient(145deg, #ffffff, #f8fafc);
    border-radius: 12px;
    padding: 35px;
    border: 1px solid rgba(6, 134, 191, 0.1);
    box-shadow: 
        0 6px 12px rgba(6, 134, 191, 0.08),
        0 2px 4px rgba(0, 0, 0, 0.05);
    position: relative;
    overflow: hidden;
}

.problems:before, .solutions:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
}

.problems:before {
    background: linear-gradient(to right, var(--danger), #ff6b6b);
}

.solutions:before {
    background: linear-gradient(to right, var(--success), #20c997);
}

.problems h3, .solutions h3 {
    margin-top: 0;
    margin-bottom: 25px;
    font-size: 22px;
    font-weight: 600;
    position: relative;
    padding-bottom: 10px;
}

.problems h3:after, .solutions h3:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 60px;
    height: 3px;
    border-radius: 2px;
}

.problems h3:after {
    background: var(--danger);
}

.solutions h3:after {
    background: var(--success);
}

.problem-item, .solution-item {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    display: flex;
    align-items: flex-start;
    gap: 15px;
    flex-direction: column;
}
.problem-item, .solution-item ul{ 
  padding-left: 0 !important;
}
.problem-item:last-child, .solution-item:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.problem-item i, .solution-item i {
    font-size: 20px;
    margin-top: 3px;
    flex-shrink: 0;
}

.problem-item strong, .solution-item strong {
    display: block;
    margin-bottom: 5px;
    font-size: 16px;
}

/* 6. УЛУЧШЕННЫЙ FAQ */
.faq-item {
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    padding: 25px 0;
    transition: all 0.3s ease;
}

.faq-item:hover {
    background: rgba(230, 242, 255, 0.2);
    padding-left: 15px;
    padding-right: 15px;
    margin-left: -15px;
    margin-right: -15px;
    border-radius: 8px;
}

.faq-question {
    font-weight: 600;
    font-size: 18px;
    margin-bottom: 10px;
    color: var(--primary-blue);
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}

.faq-question:before {
    content: 'Q:';
    color: var(--primary-blue);
    font-weight: 700;
    font-size: 16px;
    background: var(--light-blue);
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.faq-item p {
    color: var(--text-light);
    padding-left: 40px;
    position: relative;
}

.faq-item p:before {
    content: 'A:';
    position: absolute;
    left: 0;
    top: 0;
    color: var(--success);
    font-weight: 700;
    font-size: 16px;
    background: rgba(40, 167, 69, 0.1);
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

/* 7. АНИМАЦИИ И ЭФФЕКТЫ */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.advantages-grid > *, .applications-grid > *, .content-box {
    animation: fadeInUp 0.6s ease forwards;
    opacity: 0;
}

.advantages-grid > *:nth-child(1) { animation-delay: 0.1s; }
.advantages-grid > *:nth-child(2) { animation-delay: 0.2s; }
.advantages-grid > *:nth-child(3) { animation-delay: 0.3s; }
.advantages-grid > *:nth-child(4) { animation-delay: 0.4s; }
.advantages-grid > *:nth-child(5) { animation-delay: 0.5s; }

.applications-grid > *:nth-child(1) { animation-delay: 0.1s; }
.applications-grid > *:nth-child(2) { animation-delay: 0.2s; }
.applications-grid > *:nth-child(3) { animation-delay: 0.3s; }
.applications-grid > *:nth-child(4) { animation-delay: 0.4s; }

/* 8. УЛУЧШЕННЫЙ HERO */
.hero {
    position: relative;
    overflow: hidden;
}

.hero:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100px;
    background: linear-gradient(to bottom, transparent, #fff);
    z-index: 1;
}

.hero-content {
    position: relative;
    z-index: 2;
}

.hero h1 {
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

/* 9. УЛУЧШЕННЫЕ КНОПКИ */
.cta-button {
    background: linear-gradient(135deg, #ffffff, #f8f9fa);
    color: var(--primary-blue);
    padding: 16px 45px;
    border-radius: 30px;
    text-decoration: none;
    font-weight: 600;
    font-size: 18px;
    margin-top: 30px;
    transition: all 0.3s ease;
    border: 2px solid transparent;
    box-shadow: 
        0 8px 20px rgba(6, 134, 191, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    position: relative;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.cta-button:before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
    transition: left 0.7s ease;
}

.cta-button:hover {
    transform: translateY(-3px);
    box-shadow: 
        0 15px 30px rgba(6, 134, 191, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    border-color: var(--primary-blue);
}

.cta-button:hover:before {
    left: 100%;
}

/* 10. УЛУЧШЕННЫЙ ФУТЕР */
footer {
    background: linear-gradient(135deg, #1a1f23, #23282b);
    position: relative;
    overflow: hidden;
}

footer:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(to right, var(--primary-blue), var(--dark-blue));
}

.footer-section h4 {
    color: #fff;
    margin-bottom: 25px;
    font-size: 18px;
    font-weight: 600;
    position: relative;
    padding-bottom: 10px;
}

.footer-section h4:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 40px;
    height: 2px;
    background: var(--primary-blue);
}

.footer-links a {
    color: #cfe9f6;
    text-decoration: none;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 5px 0;
}

.footer-links a:hover {
    color: #fff;
    padding-left: 10px;
}

.footer-links i {
    width: 20px;
    text-align: center;
}

.footer-bottom {
    text-align: center;
    padding-top: 30px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 14px;
    color: rgba(255, 255, 255, 0.6);
}


/* ===================== */
/* СТРАНИЦА РЕШЕНИЙ ДЛЯ ДАТА-ЦЕНТРОВ */
/* ===================== */

/* HERO ДЛЯ СТРАНИЦЫ ДАТА-ЦЕНТРОВ */
.dc-hero {
    position: relative;
    background: linear-gradient(rgba(6, 134, 191, 0.9), rgba(0, 102, 153, 0.9)), 
                url('https://images.unsplash.com/photo-1558494949-ef010cbdcc31?ixlib=rb-4.0.3&auto=format&fit=crop&w=1950&q=80');
    background-size: cover;
    background-position: center;
    color: white;
    padding: 100px 0;
    min-height: 600px;
    display: flex;
    align-items: center;
}

.dc-hero h1 {
    font-size: 42px;
    margin-bottom: 20px;
    font-weight: 300;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

.dc-hero p {
    font-size: 20px;
    max-width: 800px;
    margin: 0 auto 30px;
    opacity: 0.95;
}

/* СТАТИСТИКА ЭКОНОМИИ */
.savings-highlight {
    background: linear-gradient(135deg, #28a745, #20c997);
    color: white;
    padding: 40px;
    border-radius: var(--radius);
    margin: 50px 0;
    text-align: center;
    box-shadow: 0 10px 30px rgba(40, 167, 69, 0.2);
    position: relative;
    overflow: hidden;
}

.savings-highlight:before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(255,255,255,0.1) 1px, transparent 1px);
    background-size: 20px 20px;
    animation: float 20s linear infinite;
}

@keyframes float {
    0% { transform: translate(0, 0) rotate(0deg); }
    100% { transform: translate(-20px, -20px) rotate(360deg); }
}

.savings-number {
    font-size: 4.5rem;
    font-weight: 700;
    color: #ffd700;
    display: block;
    line-height: 1;
    margin-bottom: 10px;
    text-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

.savings-label {
    font-size: 1.2rem;
    margin-bottom: 20px;
    opacity: 0.9;
}

.market-data {
      display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
}
.market-item .value {
  font-weight: bold;
  font-size: 30px;
}

.market-item .label {
  padding-top: 30px;
}
/* РЫНОЧНАЯ СТАТИСТИКА */
.market-data-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
    margin: 60px 0;
}

.market-data-card {
    background: white;
    border-radius: var(--radius);
    padding: 30px;
    text-align: center;
    box-shadow: 0 6px 18px rgba(14,50,72,0.06);
    border: 1px solid var(--border-color);
    transition: transform 0.3s, box-shadow 0.3s;
}

.market-data-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 25px rgba(14,50,72,0.1);
}

.market-data-value {
    font-size: 2.8rem;
    font-weight: 700;
    color: var(--primary-blue);
    display: block;
    line-height: 1;
    margin-bottom: 10px;
}

.market-data-label {
    color: var(--text-light);
    font-size: 1rem;
}

/* ТИПЫ ДАТА-ЦЕНТРОВ */
.dc-types-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 30px;
    margin: 50px 0;
}

.dc-type-card {
    background: white;
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: 0 8px 25px rgba(0,0,0,0.08);
    border: 1px solid var(--border-color);
    transition: all 0.3s ease;
}

.dc-type-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 35px rgba(0,0,0,0.12);
}

.dc-type-header {
    padding: 25px;
    color: white;
    display: flex;
    align-items: center;
    gap: 15px;
}

.dc-type-header.hyper-scale {
    background: linear-gradient(135deg, var(--primary-blue), var(--dark-blue));
}

.dc-type-header.edge {
    background: linear-gradient(135deg, #17a2b8, #138496);
}

.dc-type-header.enterprise {
    background: linear-gradient(135deg, #28a745, #20c997);
}

.dc-type-header i {
    font-size: 2rem;
}

.dc-type-body {
    padding: 25px;
}

.dc-type-body h4 {
    color: var(--primary-blue);
    margin-bottom: 15px;
    font-size: 18px;
}

.problems-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.problems-list li {
    padding: 8px 0;
    border-bottom: 1px solid rgba(0,0,0,0.05);
    color: var(--text-light);
    position: relative;
    padding-left: 25px;
}

.problems-list li:before {
    content: '⚡';
    position: absolute;
    left: 0;
    top: 8px;
    color: var(--primary-blue);
}

.development-challenges {
    margin-top: 20px;
    padding: 15px;
    background: var(--muted);
    border-radius: 6px;
    border-left: 3px solid var(--accent);
}

/* РЕШЕНИЯ ОХЛАЖДЕНИЯ */
.cooling-solutions {
    background: var(--gray-bg);
    padding: 80px 0;
}

.cooling-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 40px;
}

.cooling-solution {
    background: white;
    border-radius: var(--radius);
    padding: 35px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.08);
    border: 1px solid var(--border-color);
    position: relative;
    overflow: hidden;
}

.cooling-solution:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(to right, var(--primary-blue), var(--dark-blue));
}

.solution-icon-wrapper {
    width: 70px;
    height: 70px;
    background: linear-gradient(135deg, var(--light-blue), #ffffff);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 25px;
    color: var(--primary-blue);
    font-size: 28px;
    box-shadow: 0 6px 12px rgba(6, 134, 191, 0.15);
}

.cooling-solution h3 {
    color: var(--dark-blue);
    margin-bottom: 20px;
    font-size: 22px;
}

.solution-features {
    list-style: none;
    padding: 0;
    margin: 0;
}

.solution-features li {
    padding: 12px 0;
    border-bottom: 1px solid rgba(0,0,0,0.05);
    color: var(--text-light);
    position: relative;
    padding-left: 30px;
}

.solution-features li:before {
    content: '✓';
    position: absolute;
    left: 0;
    top: 12px;
    color: #28a745;
    font-weight: bold;
    background: rgba(40, 167, 69, 0.1);
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* СИСТЕМЫ РАСПРЕДЕЛЕНИЯ */
.power-distribution {
    padding: 80px 0;
}

.power-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

.power-solution {
    background: linear-gradient(145deg, #ffffff, #f8fafc);
    border-radius: var(--radius);
    padding: 30px;
    border: 1px solid rgba(6, 134, 191, 0.1);
    box-shadow: 0 6px 18px rgba(14,50,72,0.06);
    transition: all 0.3s ease;
}

.power-solution:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 25px rgba(14,50,72,0.1);
}

.power-solution i {
    color: var(--primary-blue);
    font-size: 2.5rem;
    margin-bottom: 20px;
    background: linear-gradient(135deg, var(--light-blue), #ffffff);
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
}

.power-solution h4 {
    color: var(--primary-blue);
    margin-bottom: 15px;
    font-size: 20px;
}

.power-features {
    list-style: none;
    padding: 0;
    margin: 15px 0 0 0;
}

.power-features li {
    padding: 8px 0;
    color: var(--text-light);
    border-bottom: 1px solid rgba(0,0,0,0.05);
}

.power-features li:last-child {
    border-bottom: none;
}

/* УПРАВЛЕНИЕ КАБЕЛЯМИ */
.cable-management {
    background: var(--muted);
    padding: 80px 0;
}

.cable-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 25px;
}

.cable-solution {
    background: white;
    border-radius: var(--radius);
    padding: 30px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    border: 1px solid var(--border-color);
    text-align: center;
    transition: transform 0.3s;
}

.cable-solution:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}

.cable-solution i {
    font-size: 2.5rem;
    color: var(--primary-blue);
    margin-bottom: 20px;
    display: inline-block;
}

.cable-solution h4 {
    color: var(--primary-blue);
    margin-bottom: 15px;
    font-size: 18px;
}

/* БУДУЩИЕ НАПРАВЛЕНИЯ */
.future-directions {
    padding: 80px 0;
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
}

.future-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 25px;
}

.future-card {
    background: white;
    border-radius: var(--radius);
    padding: 30px;
    text-align: center;
    box-shadow: 0 6px 18px rgba(14,50,72,0.06);
    border-top: 4px solid var(--accent-green);
    transition: all 0.3s ease;
}

.future-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 25px rgba(14,50,72,0.1);
}

.future-icon {
    font-size: 2.5rem;
    color: var(--accent-green);
    margin-bottom: 20px;
    display: inline-block;
}

.future-card h4 {
    color: var(--primary-blue);
    margin-bottom: 15px;
    font-size: 18px;
}

/* СТРОИТЕЛЬНЫЕ РЕШЕНИЯ */
.construction-solutions {
    padding: 80px 0;
}

.solution-tabs {
    margin: 50px 0;
}

.tab-content-container {
    background: white;
    border-radius: var(--radius);
    box-shadow: 0 6px 18px rgba(14,50,72,0.06);
    border: 1px solid var(--border-color);
    overflow: hidden;
}

.tab-content-section {
    padding: 40px;
}

.tab-content-section h3 {
    color: var(--primary-blue);
    margin-bottom: 25px;
    font-size: 24px;
    padding-bottom: 15px;
    border-bottom: 2px solid var(--light-blue);
}

.problem-solution-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    margin-top: 30px;
}

.problem-column, .solution-column {
    background: var(--gray-bg);
    border-radius: var(--radius);
    padding: 25px;
}

.problem-column {
    border-left: 4px solid #e74c3c;
}

.solution-column {
    border-left: 4px solid #28a745;
}

.problem-column h4, .solution-column h4 {
    margin-bottom: 20px;
    font-size: 18px;
}

.problem-column h4 {
    color: #e74c3c;
}

.solution-column h4 {
    color: #28a745;
}

.problem-column ul, .solution-column ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.problem-column li, .solution-column li {
    padding: 10px 0;
    border-bottom: 1px solid rgba(0,0,0,0.05);
    position: relative;
    padding-left: 25px;
}

.problem-column li:before {
    content: '⚠️';
    position: absolute;
    left: 0;
    top: 10px;
}

.solution-column li:before {
    content: '✅';
    position: absolute;
    left: 0;
    top: 10px;
}

/* ПРОДУКТЫ LEIPOLE */
.leipole-products {
    background: var(--muted);
    padding: 80px 0;
}

.products-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    margin-top: 50px;
}

.product-item {
    background: white;
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: 0 6px 18px rgba(14,50,72,0.06);
    border: 1px solid var(--border-color);
    transition: transform 0.3s, box-shadow 0.3s;
}

.product-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 25px rgba(14,50,72,0.1);
}

.product-image {
    height: 200px; 
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary-blue);
    font-size: 3rem;
        background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #fff;
}

.product-info {
    padding: 25px;
}

.product-info h4 {
    color: var(--primary-blue);
    margin-bottom: 15px;
    font-size: 20px;
}

.product-features {
    list-style: none;
    padding: 0;
    margin: 15px 0 0 0;
}

.product-features li {
    padding: 8px 0;
    color: var(--text-light);
    border-bottom: 1px solid rgba(0,0,0,0.05);
    position: relative;
    padding-left: 25px;
}

.product-features li:before {
    content: '•';
    position: absolute;
    left: 10px;
    top: 8px;
    color: var(--primary-blue);
    font-weight: bold;
}

.product-link {
    display: inline-block;
    margin-top: 20px;
    background: var(--primary-blue);
    color: white;
    padding: 10px 20px;
    border-radius: 4px;
    text-decoration: none;
    font-weight: 500;
    transition: background-color 0.3s;
}

.product-link:hover {
    background-color: var(--dark-blue);
    color: white;
}

/* АНИМАЦИИ */
@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

.pulse {
    animation: pulse 2s infinite;
}

@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateX(-30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.slide-in {
    animation: slideIn 0.6s ease forwards;
}

/* АДАПТИВНОСТЬ */
@media (max-width: 1200px) {
    .dc-hero h1 {
        font-size: 36px;
    }
    
    .cooling-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 992px) {
    .dc-hero {
        padding: 80px 0;
        min-height: 500px;
    }
    
    .dc-hero h1 {
        font-size: 32px;
    }
    
    .dc-hero p {
        font-size: 18px;
    }
    
    .savings-number {
        font-size: 3.5rem;
    }
    
    .market-data-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .dc-types-grid {
        grid-template-columns: 1fr;
    }
    
    .cooling-grid {
        grid-template-columns: 1fr;
    }
    
    .problem-solution-grid {
        grid-template-columns: 1fr;
    }
    .stats .container{flex-direction: column;}
}

@media (max-width: 768px) {
    .dc-hero {
        padding: 60px 0;
        min-height: 400px;
    }
    
    .dc-hero h1 {
        font-size: 28px;
    }
    
    .savings-highlight {
        padding: 30px 20px;
    }
    
    .savings-number {
        font-size: 3rem;
    }
    
    .market-data-grid {
        grid-template-columns: 1fr;
    }
    
    .power-grid {
        grid-template-columns: 1fr;
    }
    
    .cable-grid {
        grid-template-columns: 1fr;
    }
    
    .future-grid {
        grid-template-columns: 1fr;
    }
    
    .products-container {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .dc-hero h1 {
        font-size: 24px;
    }
    
    .dc-hero p {
        font-size: 16px;
    }
    
    .savings-number {
        font-size: 2.5rem;
    }
    
    .tab-content-section {
        padding: 20px;
    }
    
    .dc-type-card, .cooling-solution, .power-solution {
        padding: 20px;
    }
}

/* ДОПОЛНИТЕЛЬНЫЕ УТИЛИТЫ */
.mt-60 { margin-top: 60px; }
.mb-60 { margin-bottom: 60px; }
.pt-80 { padding-top: 80px; }
.pb-80 { padding-bottom: 80px; }

.text-accent { color: var(--accent); }
.bg-gradient-blue {
    background: linear-gradient(135deg, var(--primary-blue), var(--dark-blue));
    color: white;
}

.shadow-lg {
    box-shadow: 0 15px 35px rgba(0,0,0,0.1);
}

.rounded-xl {
    border-radius: 15px;
}

/* ИКОНКИ ДЛЯ РАЗНЫХ ТИПОВ */
.icon-server:before { content: "🖥️"; }
.icon-cloud:before { content: "☁️"; }
.icon-network:before { content: "🌐"; }
.icon-building:before { content: "🏢"; }
.icon-cooling:before { content: "❄️"; }
.icon-power:before { content: "⚡"; }
.icon-cable:before { content: "🔌"; }
.icon-ai:before { content: "🤖"; }
.icon-liquid:before { content: "💧"; }
.icon-modular:before { content: "🧩"; }
.icon-green:before { content: "🌱"; }
.icon-edge:before { content: "📡"; }

   
        .nav-link {
            position: relative;
            padding: 0.5rem 1rem;
            color: #374151;
            font-weight: 500;
            transition: color 0.3s ease;
        }
        
        .nav-link:hover,
        .nav-link.active {
            color: var(--primary-blue);
        }
        
        .nav-link::after {
            content: '';
            position: absolute;
            bottom: -2px;
            left: 0;
            width: 0;
            height: 2px;
            background: var(--primary-blue);
            transition: width 0.3s ease;
        }
        
        .nav-link:hover::after,
        .nav-link.active::after {
            width: 100%;
        }
        
        .page-section {
            display: none;
            opacity: 0;
            transform: translateY(20px);
            transition: opacity 0.5s ease, transform 0.5s ease;
        }
        
        .page-section.active {
            display: block;
            opacity: 1;
            transform: translateY(0);
        }
        
        .hero-gradient {
            background: linear-gradient(135deg, var(--primary-blue) 0%, #3b82f6 100%);
        }
        
        .card {
            background: white;
            border-radius: 12px;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        
        .card:hover {
            transform: translateY(-5px);
            box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
        }
        
        .stat-card {
            background: linear-gradient(135deg, var(--primary-blue) 0%, #3b82f6 100%);
            color: white;
            border-radius: 16px;
            padding: 2rem;
        }
        
        .btn-primary {
            background: linear-gradient(135deg, var(--primary-blue) 0%, #3b82f6 100%);
            color: white;
            padding: 0.75rem 2rem;
            border-radius: 8px;
            font-weight: 600;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        
        .btn-primary:hover {
            transform: translateY(-2px);
            box-shadow: 0 10px 15px -3px rgba(30, 64, 175, 0.3);
        }
        
        .feature-icon {
            width: 64px;
            height: 64px;
            background: linear-gradient(135deg, var(--primary-blue) 0%, #3b82f6 100%);
            border-radius: 12px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-size: 1.5rem;
        }
        
        .table-custom {
            width: 100%;
            border-collapse: collapse;
            background: white;
            border-radius: 8px;
            overflow: hidden;
        }
        
        .table-custom th {
            background: var(--primary-blue);
            color: white;
            padding: 1rem;
            text-align: left;
        }
        
        .table-custom td {
            padding: 1rem;
            border-bottom: 1px solid #e5e7eb;
        }
        
        .table-custom tr:hover {
            background: #f3f4f6;
        }
        
        .mobile-menu {
            display: none;
        }
        
        @media (max-width: 768px) {
            .mobile-menu {
                display: block;
            }
            .desktop-menu {
                display: none;
            }
        }
        
        .accordion-item {
            border: 1px solid #e5e7eb;
            border-radius: 8px;
            margin-bottom: 1rem;
            overflow: hidden;
        }
        
        .accordion-header {
            background: #f9fafb;
            padding: 1rem 1.5rem;
            cursor: pointer;
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-weight: 600;
        }
        
        .accordion-content {
            padding: 1.5rem;
            display: none;
        }
        
        .accordion-item.active .accordion-content {
            display: block;
        }
        
        .fade-in {
            animation: fadeIn 0.5s ease forwards;
        }
        
        @keyframes fadeIn {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }


.lightboxOverlay {
    top: 0;
    left: 0;
    z-index: 9999;
    background-color: #000;
    opacity: .8;
    display: none
}

.lightbox {
    left: 0;
    z-index: 10000;
    font-weight: 400
}

.lightbox .lb-image {
    display: block;
    height: auto;
    max-width: inherit;
    max-height: none;
    border-radius: 3px;
    border: 4px solid #fff
}

.lightbox a img {
    border: none
}

.lb-outerContainer {
    position: relative;
    width: 250px;
    height: 250px;
    margin: 0 auto;
    border-radius: 4px;
    background-color: #fff
}

.lb-loader,.lb-nav {
    position: absolute;
    left: 0
}

.lb-dataContainer:after,.lb-outerContainer:after {
    content: "";
    display: table;
    clear: both
}

.lb-loader {
    top: 43%;
    height: 25%;
    width: 100%
}

.lb-cancel {
    display: block;
    width: 32px;
    height: 32px;
    margin: 0 auto;
    background: url(../images/loading.gif) no-repeat
}

.lb-nav {
    top: 0;
    height: 100%;
    width: 100%;
    z-index: 10
}

.lb-container>.nav {
    left: 0
}

.lb-next,.lb-prev {
    height: 100%;
    cursor: pointer;
    display: block
}

.lb-nav a.lb-prev {
    width: 34%;
    left: 0;
    float: left;
    background: url(../images/prev.png) left 48% no-repeat;
    opacity: 0;
    -webkit-transition: opacity .6s;
    -moz-transition: opacity .6s;
    -o-transition: opacity .6s;
    transition: opacity .6s
}

.lb-nav a.lb-next:hover,.lb-nav a.lb-prev:hover {
    opacity: 1
}

.lb-nav a.lb-next {
    width: 64%;
    right: 0;
    float: right;
    background: url(../images/next.png) right 48% no-repeat;
    opacity: 0;
    -webkit-transition: opacity .6s;
    -moz-transition: opacity .6s;
    -o-transition: opacity .6s;
    transition: opacity .6s
}

.lb-dataContainer {
    margin: 0 auto;
    padding-top: 5px;
    width: 100%;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px
}

.lb-data {
    padding: 0 4px;
    color: #ccc
}

.lb-data .lb-details {
    width: 85%;
    float: left;
    text-align: left;
    line-height: 1.1em
}

.lb-data .lb-caption {
    font-size: 13px;
    font-weight: 700;
    line-height: 1em
}

.lb-data .lb-caption a {
    color: #4ae
}

.lb-data .lb-number {
    display: block;
    clear: left;
    padding-bottom: 1em;
    font-size: 12px;
    color: #999
}

.lb-data .lb-close {
    display: block;
    float: right;
    width: 30px;
    height: 30px;
    background: url(/images/close.png) top right/contain no-repeat;
    text-align: right;
    outline: 0;
    opacity: .7;
    -webkit-transition: opacity .2s;
    -moz-transition: opacity .2s;
    -o-transition: opacity .2s;
    transition: opacity .2s
}

.lb-data .lb-close:hover {
    cursor: pointer;
    opacity: 1
}

div.bx-top-panel table.bx-pnbutton div.icon-wizard,td.popupmenu div.popupitem .wizard {
    background-image: url(wizard.gif)
}

td.popupmenu div.popupitem .wizard-clear {
    background-image: url(wizard_clear.gif)
}


h1 {
    font-size: 30px;
}
.faq-item.active .faq-answer {
display: block !important; }
      /* Карточки офисов */
    .office-card {
      background: #ffffff;
      border-radius: 1.5rem;
      padding: 1.75rem;
      transition: all 0.25s ease;
      border: 1px solid #eef2f8;
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.02);
      height: 100%;
      display: flex;
      flex-direction: column;
      position: relative;
      overflow: hidden;
    }
    .office-card::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 4px;
      background: linear-gradient(90deg, #0686bf, #0da1dd);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.3s ease;
    }
    .office-card:hover::before {
      transform: scaleX(1);
    }
    .office-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 24px 36px -12px rgba(6, 134, 191, 0.15);
      border-color: #cbd5e1;
    }
    .flag-icon {
      font-size: 2rem;
      margin-bottom: 1rem;
      display: inline-block;
    }
    .office-name {
      font-size: 1.35rem;
      font-weight: 700;
      color: #0f172a;
      line-height: 1.3;
      margin-bottom: 0.25rem;
    }
    .office-sub {
      font-size: 0.75rem;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      color: #0686bf;
      background: #eef3fc;
      display: inline-block;
      padding: 0.2rem 0.8rem;
      border-radius: 2rem;
      margin: 0.5rem 0 1rem 0;
    }
    .contact-item {
      display: flex;
      align-items: flex-start;
      gap: 0.75rem;
      margin-top: 1rem;
      font-size: 0.9rem;
      color: #334155;
      line-height: 1.4;
    }
    .contact-icon {
      min-width: 1.75rem;
      height: 1.75rem;
      background: #eef3fc;
      border-radius: 50%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 0.9rem;
      color: #0686bf;
    }
    .contact-text {
      word-break: break-word;
      flex: 1;
    }
    .support-badge {
      margin-top: 1rem;
      background: #f1f5f9;
      border-radius: 1rem;
      padding: 0.6rem 1rem;
      font-size: 0.8rem;
      font-weight: 500;
      color: #1e293b;
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      width: fit-content;
    }
    .global-note {
      background: white;
      border-radius: 1.5rem;
      padding: 1.5rem;
      margin-top: 3rem;
      text-align: center;
      border: 1px solid #eef2f8;
      font-size: 0.9rem;
      color: #475569;
    }
    @media (max-width: 768px) {
      .section { padding: 2.5rem 0; }
      .section-title { font-size: 1.75rem; margin-bottom: 2rem; }
    }
.enclosu-hero::after {background:none;
 }