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

    :root {
      --blue-accent: #2563eb;
      --blue-light:  #3b82f6;
      --gold:        #f59e0b;
      --text:        #e2e8f0;
      --text-muted:  #e8e8e8;
      --radius:      10px;
    }

    html { scroll-behavior: smooth; }

    /* ─── ОБЩИЙ ФОН СТРАНИЦЫ — один градиент на всё ─── */
    body {
      font-family: 'Open Sans', sans-serif;
      color: var(--text);
      overflow-x: hidden;
      background: #070707;
      min-height: 100vh;
    }

    /* ════════════════════════════════════════
       СЕКЦИЯ ВИДЕО — на общем фоне, картинка
       с логотипами только за лого+видео
    ════════════════════════════════════════ */
    .video-section {
      position: relative;
      width: 100%;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 28px 20px 36px;
    }

    /* Картинка с логотипами — абсолютно, обрезана по блоку */
    .video-section-bg {
      position: absolute;
      inset: 0;
      background: url('../img/desk_bg.png') center center / cover no-repeat; 
      z-index: 0;
    }
    .video-section-bg::after {
      content: '';
      position: absolute;
      inset: 0;
    }

    .logo-wrap {
      position: relative;
      z-index: 1;
      margin-bottom: 20px;
    }
    .logo-wrap img { height: 120px; display: block; }

    .video-section-content {
  position: relative;
  z-index: 1;
  width: 100%;
    padding: 20px;
  border: 1px solid rgba(255, 255, 255, 0.15); /* Та самая рамка */
  border-radius: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  background: radial-gradient(circle, rgba(255,255,255,0.05) 0%, rgba(0,0,0,0) 70%);
}

.video-wrap {
  position: relative;
  width: 100%;
  max-width: 650px;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 20px 50px rgba(0,0,0,0.8);
  margin-bottom: 20px;
}

.video-wrap video {
  width: 100%;
  display: block;
  background: #000;
}

.video-viewers {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #ffce48; 
  background: transparent;  
  padding: 10px;
}

.video-viewers svg {
  fill: #ffce48;
  width: 20px;
  height: 20px;
}

.video-viewers span {
  color: #ffce48; /* Красный для цифр */
  font-weight: bold;
}
 
    /* ════════════════════════════════════════
       ЗАГОЛОВОК — просто на общем фоне
    ════════════════════════════════════════ */
    .headline-section {
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 44px 20px 52px;
    }

    .hero-title {
      font-family: 'Montserrat', sans-serif;
      font-weight: 800;
      font-style: italic;
      font-size: clamp(24px, 4.5vw, 42px);
      text-align: center;
      line-height: 1.22;
      text-transform: uppercase;
      letter-spacing: 0.02em;
      color: #fff;
    }
    .hero-sub {
          font-size: 18px;
      color: #ffce48;
      text-align: center;
      margin-top: 12px;
          font-weight: bold;
    }
    .hero-sub span { color: #ffce48; }

    /* ════════════════════════════════════════
       СЕКЦИЯ ФОРМЫ — padding + карточка
    ════════════════════════════════════════ */
    .form-section {
      padding: 0 20px 56px;
      display: flex;
      justify-content: center;
    }

    /* Внешняя карточка с border и своим фоном */
    .form-outer-card {
      position: relative;
      width: 100%;
      max-width: 1200px;
      background: #0c1a30;
      border: 1px solid rgba(255,255,255,0.12);
      box-shadow: 0 -80px 200px -20px rgb(37 99 235 / 71%);
      border-radius: 18px;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 40px 20px;
    }

    .form-header-outside {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 500px; 
}
 
    .form-bg-left,
    .form-bg-right {
      position: absolute;
      top: 0; bottom: 0;
      width: 220px;
      background-size: cover;
      background-position: center;
      pointer-events: none;
      z-index: 0;
    }
    .form-bg-left  { left: 0;  background-image: url('../img/form_bg_left.png'); }
    .form-bg-right { right: 0; background-image: url('../img/form_bg_right.png'); }

    /* Внутренняя карточка формы */
    .form-inner {
      position: relative;
      z-index: 2;
      width: 100%;
      max-width: 520px;
      background: #26324a;
      border: 1px solid rgba(255,255,255,0.10);
      border-radius: 14px;
      padding: 40px 44px 36px;
      box-shadow: 0 8px 48px rgba(0,0,0,0.5);
    }

    .form-inner h2 {
      font-family: 'Montserrat', sans-serif;
      font-weight: 700;
      font-size: clamp(18px, 3vw, 22px);
      text-align: center;
      margin-bottom: 10px;
      color: #fff;
      line-height: 1.2;
    }
    .form-desc {
      text-align: center;
      font-size: 15px;
      color: #e8e8e8;
      margin-bottom: 28px;
      line-height: 1.6;
    }
    .form-desc strong { color: #ffce48; font-weight: 600; }
    .form-desc a { color:#ffce48; text-decoration: none; }

    .form-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 14px;
      margin-bottom: 14px;
    }
    .form-group { display: flex; flex-direction: column; gap: 6px; }
    .form-group label { font-size: 12.5px; color: #e8e8e8; font-weight: 600; }
     .form-group input {
    background: rgb(0 0 0 / 36%);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 25px;
    color: var(--text);
    padding: 11px 14px;
    font-size: 13px;
    font-family: inherit;
    outline: none;
    transition: border-color 0.2s;
}

    .form-group input::placeholder { color: rgba(255,255,255,0.25); }
    .form-group input:focus { border-color: var(--blue-light); }
    .form-full { grid-column: 1 / -1; }

    .checkbox-group {
      display: flex;
      flex-direction: column;
      gap: 10px;
      margin: 16px 0 22px;
    }
    .checkbox-item {
      display: flex;
      align-items: center;
      gap: 10px;
      cursor: pointer;
      font-size: 13px;
      color: var(--text-muted);
      user-select: none;
    }
    .checkbox-item input[type="checkbox"] {
      width: 16px; height: 16px;
      accent-color: var(--blue-accent);
      cursor: pointer; flex-shrink: 0;
    }

    .btn-cta {
      width: 100%;
      padding: 10px 24px; 
       background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%);
      color: #fff;
      font-family: 'Montserrat', sans-serif;
      font-weight: 600;
      font-size: 13px;
      border: none;
      border-radius: 50px;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 5px;
      letter-spacing: 0.01em;
      text-transform: uppercase;
      box-shadow: 0 4px 15px rgba(37, 99, 235, 0.35);
    }

    .btn-cta:hover:not(:disabled) { 
      filter: brightness(1.1); 
      transform: translateY(-2px);
      box-shadow: 0 6px 20px rgba(37, 99, 235, 0.5);
    }
    .btn-cta:disabled {
      background: #050505;
    color: #475569;
    cursor: not-allowed;
    box-shadow: none;
    border: 2px solid #3252cc;
    }

    .timer-text {
      text-align: center;
      margin-top: 14px;
      font-size: 18px;
      color: var(--text-muted);
    }
    .timer-val {
      color: #60a5fa;
      font-weight: 700;
      font-variant-numeric: tabular-nums;
    }

    /* ════════════════════════════════════════
       ОТЗЫВЫ — тоже карточка с border
    ════════════════════════════════════════ */
    .reviews-section {
      padding: 0 20px 56px;
      display: flex;
      justify-content: center;
    }

    .reviews-card {
      width: 100%;
      max-width: 1200px;
      background: #0c0c0c;
      border: 1px solid rgba(255,255,255,0.12);
      border-radius: 18px;
      padding: 48px 32px 40px;
    }

    .reviews-title {
      font-family: 'Montserrat', sans-serif;
      font-weight: 600;
      font-size: clamp(19px, 3.5vw, 24px);
      text-align: center;
      line-height: 1.4;
      margin-bottom: 36px;
      color: #fff;
    }

    .slider-container { position: relative; }
    .slider-track-wrap { overflow: hidden; border-radius: var(--radius); }
    .slider-track {
      display: flex;
      transition: transform 0.45s cubic-bezier(0.25,0.8,0.25,1);
    }
    .slide {
      flex: 0 0 calc(33.333% - 12px);
      margin-right: 18px;
      border-radius: 16px;
      overflow: hidden;
    }
    .slide img { width: 100%; display: block; border-radius: 16px; }
    .slide-placeholder {
      width: 100%;
      aspect-ratio: 9/16;
      background: linear-gradient(160deg, #1a2540 0%, #0f1827 100%);
      border-radius: 16px;
      border: 1px dashed rgba(255,255,255,0.1);
      display: flex;
      align-items: center;
      justify-content: center;
      color: rgba(255,255,255,0.2);
      font-size: 12px;
      text-align: center;
      padding: 20px;
    }
    .slider-nav {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 16px;
      margin-top: 28px;
    }
    .slider-btn {
      width: 40px; height: 40px;
      border-radius: 50%;
      background: rgba(255,255,255,0.07);
      border: 1px solid #fff;
      color: #fff;
      font-size: 18px;
      cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      transition: background 0.2s;
      user-select: none;
    }
    .slider-btn:hover { background: rgba(255,255,255,0.14); }

    /* ════════════════════════════════════════
       FOOTER — просто на общем фоне
    ════════════════════════════════════════ */
    .footer {
      padding: 24px 20px 32px;
      text-align: center;
    }
    .footer-links {
      display: flex;
      justify-content: center;
      gap: 24px;
      margin-bottom: 10px;
    }
    .footer-links a {
      font-size: 11px;
      color: #888; 
      text-decoration: none;
      text-transform: uppercase;
      letter-spacing: 0.08em;
    }
    .footer-links a:hover { color: var(--text); }
    .footer-copy { font-size: 11px; color: rgba(255,255,255,0.18); }

      .iti {
    position: relative;
    display: inline-block;
    width: 100%;
}
    .iti__flag-box, .iti__country-name {
   color:#000;
 }


    /* ════════════════════════════════════════
       МОБАЙЛ
    ════════════════════════════════════════ */
    @media (max-width: 768px) {
      .video-section-bg {
        background-image: url('../img/mobile_bg.png');
        background-position: bottom;
      }
      .form-outer-card { padding: 24px 12px;  box-shadow: 0 -80px 200px -20px rgb(37 99 235 / 54%); background: #21293a;}
      .form-bg-left, .form-bg-right { display: none; }
      .form-bg-mob {
        position: absolute;
        inset: 0;
        background: url('../img/form_bg_mob.png') center / cover no-repeat;
        opacity: 0.15;
        z-index: 0;
        pointer-events: none;
      }
      .form-inner { padding: 28px 20px 24px;  background: url('../img/form_bg_mob.png') center / 90% auto no-repeat; background-color: #292f3c; }
      .form-row { grid-template-columns: 1fr; }
      .reviews-card { padding: 32px 16px 28px; }
      .slide { flex: 0 0 80%; margin-right: 14px; }
        .logo-wrap {
    margin-left: 0; 
    align-self: flex-start;  
  }

   .logo-wrap img { height: 80px; display: block; }

    .headline-section { 
      padding: 44px 20px 15px;
    }
.btn-cta:disabled {
  line-height: 1.8;
    }

    .btn-cta {
      line-height: 1.8;
    }
      .footer-links {
      flex-direction: column;
    }
    .footer-links { 
    gap: 5px; 
}
.footer-links a { 
      color: #888;  
    }
    }

    @media (max-width: 480px) {
      .hero-title { font-size: 20px; }
    
    }