h1, h2, h3, h4{
    color: #4e529a;
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

h1, h2, h3, h4 {
  opacity: 0;
  animation: fadeInUp 0.8s ease-out forwards;
}

/* Добавим небольшую задержку для красивого каскада */
h2 {
  animation-delay: 0.2s;
}

h3 {
  animation-delay: 0.4s;
}

h4 {
  animation-delay: 0.6s;
}

@media(max-width:680px){
  .h5{
    font-size:18px;
  }
  h2{
    font-size: 22px;
  } 
  
}

 :root{
      --bn-primary: #4e529a;
      --bn-dark: #26263d;
      --bn-white: #ffffff;
    }

    /* HERO */
    .bn-hero{
      position: relative;
      color: var(--bn-white);
      background:
        radial-gradient(1200px 600px at 85% -5%, rgba(255,255,255,.08), transparent 60%),
        radial-gradient(900px 450px at 10% 110%, rgba(255,255,255,.06), transparent 60%),
        linear-gradient(135deg, var(--bn-dark) 0%, #333357 45%, var(--bn-primary) 100%);
      overflow: clip;
    }
    .bn-hero::after{ /* мягкая сетка/шум */
      content:"";
      position: absolute;
      inset: 0;
      background-image:
        radial-gradient(1px 1px at 20% 30%, rgba(255,255,255,.12) 0, transparent 2px),
        radial-gradient(1px 1px at 70% 60%, rgba(255,255,255,.10) 0, transparent 2px);
      background-size: 120px 120px, 180px 180px;
      pointer-events: none;
      opacity: .5;
    }
    .bn-hero .container{
      position: relative;
      z-index: 1;
      padding-top: clamp(72px, 10vh, 120px);
      padding-bottom: clamp(56px, 10vh, 120px);
    }

    .bn-eyebrow{
      display:inline-flex;
      align-items:center;
      gap:.5rem;
      font-weight:600;
      letter-spacing:.04em;
      text-transform:uppercase;
      font-size:.85rem;
      color:#e9e9ff;
      background: rgba(255,255,255,.08);
      border: 1px solid rgba(255,255,255,.12);
      padding:.4rem .7rem;
      border-radius: 999px;
      backdrop-filter: blur(4px);
    }

    .bn-title{
      font-weight: 800;
      line-height: 1.1;
      letter-spacing: -.02em;
      margin-top: .9rem;
      margin-bottom: .75rem;
      text-wrap: balance;
    }
    .bn-subtitle{
      color: #e5e6ff;
      max-width: 56ch;
    }

    /* CTA buttons */
    .btn-bn-primary{
      --bs-btn-color: var(--bn-white);
      --bs-btn-bg: var(--bn-primary);
      --bs-btn-border-color: var(--bn-primary);
      --bs-btn-hover-color: var(--bn-white);
      --bs-btn-hover-bg: #43478a;
      --bs-btn-hover-border-color: #43478a;
      --bs-btn-focus-shadow-rgb: 78,82,154;
      --bs-btn-active-bg: #3a3e7a;
      --bs-btn-active-border-color: #3a3e7a;
      border-radius: .9rem;
      padding:.8rem 1.2rem;
      font-weight:600;
    }
    .btn-bn-outline{
      --bs-btn-color: var(--bn-white);
      --bs-btn-border-color: rgba(255,255,255,.35);
      --bs-btn-hover-color: var(--bn-dark);
      --bs-btn-hover-bg: var(--bn-white);
      --bs-btn-hover-border-color: var(--bn-white);
      border-radius: .9rem;
      padding:.8rem 1.2rem;
      font-weight:600;
      background: transparent;
      border-width: 1.5px;
    }

    /* Feature chips */
    .bn-chip{
      display:inline-flex;
      align-items:center;
      gap:.5rem;
      padding:.5rem .75rem;
      border-radius: .75rem;
      border:1px solid rgba(255,255,255,.16);
      background: rgba(255,255,255,.06);
      color:#f3f3ff;
      white-space: nowrap;
    }
    .bn-chip .bi{
      font-size: 1rem;
      opacity:.9;
    }
    .bn-chips{
      display:flex;
      flex-wrap: wrap;
      gap:.6rem;
      margin-top: 1rem;
    }

    /* Visual block for illustration */
    .bn-visual{
      background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.06));
      border:1px solid rgba(255,255,255,.18);
      border-radius: 1.25rem;
      min-height: 280px;
      box-shadow: 0 10px 30px rgba(0,0,0,.25);
      position:relative;
      overflow:hidden;
    }
    .bn-visual .glow{
      position:absolute; inset: -20% -10% auto auto;
      width: 340px; height: 340px; border-radius:50%;
      background: radial-gradient(circle, rgba(255,255,255,.35), rgba(255,255,255,0) 60%);
      filter: blur(30px); opacity:.4; pointer-events:none;
    }

    /* Footer wave */
    .bn-wave{
      display:block;
      width:100%;
      height:auto;
      margin-top: -12px;
    }

    /* Small tweaks */
    @media (min-width: 992px){
      .bn-title{ font-size: clamp(2.4rem, 3.8vw, 3.75rem); }
      .bn-subtitle{ font-size: 1.15rem; }
    }
    @media (max-width: 991.98px){
      .bn-title{ font-size: clamp(2rem, 6vw, 2.6rem); }
    }



/* Spacing helper (совместимо с предыдущим блоком) */
@media (min-width: 992px){
  .py-lg-6{ padding-top: 5rem !important; padding-bottom: 5rem !important; }
}



  /* 1) Глобально отключаем горизонтальный скролл */
html { overflow-x: clip; }               /* современные браузеры */
body { overflow-x: hidden; width: 100%; } /* фолбэк */



/* Section wrapper */
  .bn-services{
    position:relative;
    background: #f8f9fb;
    padding-top: clamp(48px, 8vh, 96px);
    padding-bottom: clamp(48px, 8vh, 96px);
  }
  .bn-services .bn-kicker{
    display:inline-flex; gap:.5rem; align-items:center;
    padding:.35rem .7rem; border-radius:999px;
    background: rgba(78,82,154,.08);
    color: var(--bn-primary);
    font-weight:600; font-size:.85rem; letter-spacing:.04em; text-transform:uppercase;
    border:1px solid rgba(78,82,154,.2);
  }
  .bn-services .bn-title{
    font-weight:800; letter-spacing:-.02em; line-height:1.1;
    margin: .75rem 0 1rem;
    color: var(--bn-dark);
    text-wrap: balance;
  }
  .bn-services .bn-sub{
    color:#55586e; max-width: 70ch;
  }

  /* Service card */
  .bn-svc-card{
    height:100%;
    background: linear-gradient(180deg, #ffffff, #fbfbff);
    border:1px solid rgba(78,82,154,.14);
    border-radius: 1rem;
    box-shadow: 0 6px 18px rgba(38,38,61,.06);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  }
  .bn-svc-card:hover{
    transform: translateY(-4px);
    box-shadow: 0 14px 28px rgba(38,38,61,.12);
    border-color: rgba(78,82,154,.32);
  }

  .bn-icon{
    width:56px; height:56px; border-radius: .9rem;
    display:inline-flex; align-items:center; justify-content:center;
    background: radial-gradient(80% 80% at 30% 20%, rgba(78,82,154,.18), rgba(78,82,154,.04));
    color: var(--bn-primary);
    border:1px solid rgba(78,82,154,.22);
  }
  .bn-svc-title{
    color: var(--bn-dark);
    font-weight: 700;
    margin-bottom:.35rem;
  }
  .bn-svc-text{
    color:#4a4d66;
  }

  /* Accent bullet list */
  .bn-list{
    padding-left:0; margin-bottom:0; list-style:none;
  }
  .bn-list li{
    position:relative; padding-left:1.6rem; margin-bottom:.4rem;
  }
  .bn-list li::before{
    content:""; position:absolute; left:0; top:.45rem;
    width:.65rem; height:.65rem; border-radius:50%;
    background: var(--bn-primary);
    box-shadow: 0 0 0 4px rgba(78,82,154,.12);
  }

  /* Optional dark variant */
  .bn-services.is-dark{
    background: linear-gradient(135deg, var(--bn-dark) 0%, #333357 55%, var(--bn-primary) 100%);
  }
  .bn-services.is-dark .bn-title, 
  .bn-services.is-dark .bn-sub{ color:#eef0ff; }
  .bn-services.is-dark .bn-kicker{
    background: rgba(255,255,255,.08);
    border-color: rgba(255,255,255,.18);
    color: #ffffff;
  }
  .bn-services.is-dark .bn-svc-card{
    background: rgba(255,255,255,.06);
    border-color: rgba(255,255,255,.18);
    box-shadow: 0 6px 18px rgba(0,0,0,.25);
  }
  .bn-services.is-dark .bn-svc-card:hover{
    border-color: rgba(255,255,255,.35);
    box-shadow: 0 14px 28px rgba(0,0,0,.35);
  }
  .bn-services.is-dark .bn-svc-title{ color:#ffffff; }
  .bn-services.is-dark .bn-svc-text{ color:#e2e4ff; }
  .bn-services.is-dark .bn-list li::before{
    background:#ffffff; box-shadow: 0 0 0 4px rgba(255,255,255,.14);
  }

.bn-stats{
    position:relative;
    background:linear-gradient(135deg,var(--bn-primary) 0%, var(--bn-dark) 100%);
    color:var(--bn-white);
    padding-top: clamp(48px, 8vh, 96px);
    padding-bottom: clamp(48px, 8vh, 96px);
  }
  .bn-stats .bn-title{
    font-weight:800;
    letter-spacing:-.02em;
    line-height:1.1;
    margin-bottom:1rem;
    text-wrap: balance;
  }
  .bn-stats .bn-sub{
    color:#e0e1f9;
    max-width:65ch;
    margin-left:auto;
    margin-right:auto;
  }

  .bn-stat-card{
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.18);
    border-radius:1rem;
    padding:2rem 1.5rem;
    text-align:center;
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .bn-stat-card:hover{
    transform: translateY(-4px);
    box-shadow: 0 10px 22px rgba(0,0,0,.25);
  }
  .bn-stat-number{
    font-size:2.5rem;
    font-weight:800;
    color:#ffffff;
    margin-bottom:.4rem;
  }
  .bn-stat-label{
    color:#d0d1f0;
    font-size:1.05rem;
    font-weight:500;
  }
.bn-about{
    padding-top: clamp(48px, 8vh, 96px);
    padding-bottom: clamp(48px, 8vh, 96px);
    background:#f9f9fb;
  }
  .bn-about .bn-title{
    font-weight:800;
    color:var(--bn-dark);
    margin-bottom:1rem;
    line-height:1.2;
  }
  .bn-about .bn-sub{
    color:#4a4d66;
    max-width:65ch;
  }
  .bn-about-img{
    border-radius:1rem;
    box-shadow:0 6px 18px rgba(0,0,0,.1);
    object-fit:cover;
    width:100%;
    height:auto;
  }
  .btn-bn-primary{
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--bn-primary);
    --bs-btn-border-color: var(--bn-primary);
    --bs-btn-hover-bg: #43478a;
    --bs-btn-hover-border-color: #43478a;
    border-radius:.75rem;
    padding:.7rem 1.2rem;
    font-weight:600;
  }
.bn-values{
    padding-top: clamp(48px, 8vh, 96px);
    padding-bottom: clamp(48px, 8vh, 96px);
    background: #ffffff;
  }
  .bn-values .bn-title{
    font-weight:800;
    color:var(--bn-dark);
    margin-bottom:1rem;
  }
  .bn-value-card{
    background:#f9f9fb;
    border:1px solid rgba(78,82,154,.14);
    border-radius:1rem;
    padding:2rem 1.5rem;
    height:100%;
    text-align:center;
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .bn-value-card:hover{
    transform:translateY(-4px);
    box-shadow:0 8px 20px rgba(0,0,0,.08);
  }
  .bn-value-icon{
    width:56px; height:56px;
    display:flex; align-items:center; justify-content:center;
    margin:0 auto 1rem;
    background: rgba(78,82,154,.1);
    border-radius:.75rem;
    color:var(--bn-primary);
    font-size:1.5rem;
  }
  .bn-value-title{
    font-weight:600;
    margin-bottom:.5rem;
    color:var(--bn-dark);
  }
  .bn-value-text{
    color:#4a4d66;
  }
.bn-team{
    background: linear-gradient(135deg, var(--bn-dark), var(--bn-primary));
    color:#fff;
    padding-top: clamp(48px, 8vh, 96px);
    padding-bottom: clamp(48px, 8vh, 96px);
  }
  .bn-team .bn-title{
    font-weight:800;
    margin-bottom:1rem;
  }
  .bn-team-card{
    background: rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.15);
    border-radius:1rem;
    text-align:center;
    padding:1.5rem 1rem;
    transition: transform .25s ease, box-shadow .25s ease;
  }
  .bn-team-card:hover{
    transform:translateY(-4px);
    box-shadow:0 10px 20px rgba(0,0,0,.25);
  }
  .bn-team-img{
    width:100px; height:100px; object-fit:cover;
    border-radius:50%;
    margin-bottom:1rem;
    border:3px solid rgba(255,255,255,.5);
  }
  .bn-team-name{
    font-weight:600;
    margin-bottom:.25rem;
  }
  .bn-team-role{
    font-size:.95rem;
    color:#d0d1ff;
  }
.bn-pricing{
    position:relative;
    background:#f8f9fb;
    padding-top: clamp(48px, 8vh, 96px);
    padding-bottom: clamp(48px, 8vh, 96px);
  }
  .bn-pricing .bn-title{
    font-weight:800;
    color:var(--bn-dark);
    margin-bottom:.75rem;
    line-height:1.15;
  }
  .bn-pricing .bn-sub{
    color:#4a4d66;
    max-width:70ch;
  }

  /* Toggle */
  .bn-billing-toggle{
    display:inline-flex; align-items:center; gap:.75rem;
    padding:.4rem; border-radius:999px;
    border:1px solid rgba(78,82,154,.25);
    background:#fff;
  }
  .bn-billing-toggle .form-check-input{
    width: 3rem; height: 1.5rem; cursor:pointer;
    background-color:#e9ebff;
    border-color: rgba(78,82,154,.45);
  }
  .bn-billing-toggle .form-check-input:checked{
    background-color: var(--bn-primary);
    border-color: var(--bn-primary);
  }
  .bn-badge-save{
    display:inline-block;
    background: rgba(78,82,154,.1);
    color: var(--bn-primary);
    border:1px solid rgba(78,82,154,.25);
    border-radius:.6rem;
    font-size:.8rem;
    padding:.15rem .5rem;
    margin-left:.25rem;
  }

  /* Cards */
  .bn-price-card{
    height:100%;
    background:#fff;
    border:1px solid rgba(78,82,154,.18);
    border-radius:1rem;
    box-shadow:0 8px 20px rgba(38,38,61,.06);
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  }
  .bn-price-card:hover{
    transform: translateY(-4px);
    box-shadow:0 16px 30px rgba(38,38,61,.12);
    border-color: rgba(78,82,154,.35);
  }
  .bn-price-card.recommended{
    border-width:2px;
    border-color: var(--bn-primary);
    box-shadow: 0 18px 40px rgba(78,82,154,.25);
  }
  .bn-pill{
    display:inline-block;
    padding:.35rem .6rem;
    border-radius:999px;
    font-size:.8rem; font-weight:600;
    border:1px solid rgba(78,82,154,.25);
    color: var(--bn-primary);
    background: rgba(78,82,154,.08);
  }

  .bn-price{
    font-weight:800;
    font-size:2.4rem;
    color:var(--bn-dark);
    line-height:1;
  }
  .bn-price .bn-currency{
    font-size:1.1rem; vertical-align: .4rem; margin-right:.15rem; color:#6b6e88;
  }
  .bn-price .bn-period{
    font-size:.95rem; color:#6b6e88; font-weight:600;
  }

  .bn-features{
    list-style:none; padding-left:0; margin-bottom:0;
  }
  .bn-features li{
    display:flex; gap:.6rem; align-items:flex-start;
    margin-bottom:.5rem; color:#4a4d66;
  }
  .bn-features .bi{
    color: var(--bn-primary);
    margin-top:.2rem;
  }

  .btn-bn{
    --bs-btn-color:#fff;
    --bs-btn-bg: var(--bn-primary);
    --bs-btn-border-color: var(--bn-primary);
    --bs-btn-hover-bg:#43478a;
    --bs-btn-hover-border-color:#43478a;
    border-radius:.8rem;
    padding:.7rem 1rem;
    font-weight:600;
  }

  .bn-note{
    color:#6b6e88; font-size:.9rem;
  }

  /* Dark variant (по желанию) */
  .bn-pricing.is-dark{
    background: linear-gradient(135deg, var(--bn-dark) 0%, #333357 55%, var(--bn-primary) 100%);
  }
  .bn-pricing.is-dark .bn-title, .bn-pricing.is-dark .bn-sub{ color:#eef0ff; }
  .bn-pricing.is-dark .bn-price-card{ background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.18); }
  .bn-pricing.is-dark .bn-price{ color:#fff; }
  .bn-pricing.is-dark .bn-features li{ color:#e2e4ff; }
  .bn-pricing.is-dark .bn-note{ color:#cfd1ff; }
  .bn-pricing.is-dark .bn-billing-toggle{ background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.35); color:#fff; }

.bn-faq{
    background:#f8f9fb;
    padding-top: clamp(48px, 8vh, 96px);
    padding-bottom: clamp(48px, 8vh, 96px);
  }
  .bn-faq .bn-title{
    color: var(--bn-dark);
    font-weight:800;
    letter-spacing:-.01em;
    line-height:1.2;
    margin: .25rem 0 1rem;
  }
  .bn-faq .bn-sub{
    color:#4a4d66; max-width:70ch;
  }

  /* Карточки вопросов (на базе details/summary) */
  .bn-faq-item{
    background:#fff;
    border:1px solid rgba(78,82,154,.18);
    border-radius:.9rem;
    box-shadow:0 6px 16px rgba(38,38,61,.06);
    overflow:hidden;
  }
  .bn-faq-item + .bn-faq-item{ margin-top:1rem; }

  .bn-faq-item summary{
    cursor:pointer;
    list-style:none;
    padding:1rem 1.25rem;
    font-weight:600;
    color:var(--bn-dark);
    background: linear-gradient(180deg,#ffffff, #fbfbff);
    display:flex;
    align-items: center;
    justify-content: space-between;
    gap:.75rem;
  }
  /* Убираем маркеры браузера */
  .bn-faq-item summary::-webkit-details-marker{ display:none; }
  .bn-faq-item summary::marker{ content:""; }

  /* Иконка-стрелка */
  .bn-faq-item summary .bn-caret{
    flex:0 0 auto;
    width:1.15rem; height:1.15rem;
    border:2px solid currentColor;
    border-left:0; border-top:0;
    transform: rotate(45deg);
    opacity:.6;
    transition: transform .2s ease, opacity .2s ease;
  }
  .bn-faq-item[open] summary .bn-caret{
    transform: rotate(-135deg);
    opacity:1;
  }

  .bn-faq-item .bn-body{
    padding:1rem 1.25rem 1.25rem;
    color:#4a4d66;
    border-top:1px solid rgba(78,82,154,.15);
    background:#fff;
  }

  /* Состояние focus/hover */
  .bn-faq-item summary:focus-visible{
    outline:none;
    box-shadow: 0 0 0 .25rem rgba(78,82,154,.25);
  }
  .bn-faq-item summary:hover{
    background: linear-gradient(180deg,#ffffff, #f4f5ff);
  }

  /* Акцент для открытого вопроса */
  .bn-faq-item[open]{
    border-color: var(--bn-primary);
    box-shadow: 0 10px 24px rgba(78,82,154,.18);
  }
  .bn-faq-item[open] summary{
    color:#fff;
    background: linear-gradient(135deg, var(--bn-primary), #3f437f);
  }
  .bn-faq-item[open] .bn-body{
    background:#fff;
  }

  /* Тёмный вариант (по желанию) */
  .bn-faq.is-dark{
    background: linear-gradient(135deg, var(--bn-dark) 0%, #333357 55%, var(--bn-primary) 100%);
  }
  .bn-faq.is-dark .bn-title, .bn-faq.is-dark .bn-sub{ color:#eef0ff; }
  .bn-faq.is-dark .bn-faq-item{
    background: rgba(255,255,255,.06);
    border-color: rgba(255,255,255,.18);
    box-shadow: 0 6px 18px rgba(0,0,0,.25);
  }
  .bn-faq.is-dark .bn-faq-item summary{
    background: rgba(255,255,255,.06);
    color:#fff;
  }
  .bn-faq.is-dark .bn-faq-item[open] summary{
    background: linear-gradient(135deg, var(--bn-primary), #3f437f);
  }
  .bn-faq.is-dark .bn-faq-item .bn-body{
    background: transparent; color:#e2e4ff; border-top-color: rgba(255,255,255,.2);
  }