/* Двойной CTA: по центру, на всю ширину контейнера */


.dual-cta{
  display:flex; justify-content:center; align-items:stretch; gap:2%;
  max-width:1200px; margin:20px auto; padding:0 10px;
}
.cta-card{
  position:relative; flex:1; min-width:300px; border-radius:12px; overflow:hidden; box-shadow:var(--shadow);
}
.cta-card .cover{width:100%; height:300px; object-fit:fill; display:block}
.cta-overlay{position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.6}
.bluegreen .cta-overlay{background:linear-gradient(180deg,#0d47a1,rgba(13,71,161,0) 40%,#00c853)}
.redorange .cta-overlay{background:linear-gradient(180deg,#c62828,rgba(198,40,40,0) 40%,#ff8f00)}

.cta-top{
  position:absolute; z-index:2; top:10px; left:10px; right:10px;
  padding:8px 12px; border-radius:8px; font-weight:700; font-size:16px; line-height:20px;
  text-align:center; background:rgba(0,0,0,.35)
}
.cta-bottom{
  position:absolute; z-index:2; left:0; right:0; bottom:10px;
  display:flex; justify-content:center; gap:12px
}



@media(max-width:700px){
  .dual-cta{flex-direction:column; gap:16px}
  .cta-card .cover{height:260px}
}

.m_but{
  display:inline-block; min-width:140px; padding:8px 14px; margin:5px;
  border-radius:8px; font-size:14px; text-transform:uppercase; font-weight:700; color:#fff;
  background:var(--accent); box-shadow:0 10px 20px rgba(0,0,0,.3); text-align:center;
}

.m_but--blue{background:#1976d2}
.m_but--green{background:#1ab354}
.m_but--red{background:#e53935}
.m_but--orange{background:#fb8c00}




/* КНОПКИ: анимации */
.m_but{
  position:relative;           /* для псевдоэлемента блика */
  overflow:hidden;             /* обрезаем блик */
  transition:
    transform .15s ease,
    box-shadow .2s ease,
    filter .2s ease;
}

/* блик, проходящий по кнопке при :hover */
.m_but::before{
  content:"";
  position:absolute;
  top:-150%;
  left:-50%;
  width:50%;
  height:400%;
  background:linear-gradient(120deg, rgba(255,255,255,0), rgba(255,255,255,.35), rgba(255,255,255,0));
  transform:rotate(20deg) translateX(-220%);
  transition:transform .6s ease;
  pointer-events:none;
}

/* hover: лёгкий подъём, усиление тени и проход блика */
.m_but:hover{
  transform:translateY(-2px) scale(1.02);
  filter:brightness(1.05);
  box-shadow:0 14px 28px rgba(0,0,0,.35);
}
.m_but:hover::before{
  transform:rotate(20deg) translateX(420%);
}

/* active: имитация нажатия */
.m_but:active{
  transform:translateY(0) scale(.98);
  box-shadow:0 8px 16px rgba(0,0,0,.3);
}

/* доступность: видимое фокусное кольцо */
.m_but:focus-visible{
  outline:0;
  box-shadow:0 0 0 3px rgba(255,255,255,.35), 0 12px 24px rgba(0,0,0,.35);
}

/* уважение настроек пользователя */
@media (prefers-reduced-motion: reduce){
  .m_but,
  .m_but::before{
    transition:none !important;
  }
}


/* Описания под карточками */
.dual-desc{
  display:flex; gap:2%;
  max-width:1200px; margin:20px auto 30px; padding:0 10px;
}
.desc-card{
  flex:1; min-width:300px;
  border-radius:10px; box-shadow:var(--shadow);
  background-image:linear-gradient(92deg,var(--card),var(--card2));
  background-color:var(--bg);
  padding:20px;
}
.desc-card h3{margin:0 0 12px; font-size:20px; line-height:24px}
.desc-card p{margin:0 0 12px}

@media(max-width:700px){
  .dual-desc{flex-direction:column; gap:16px}
}

/* Инфо-блоки под описаниями */
.info-block{
  display:flex; flex-direction:column; gap:16px;
  max-width:1200px; margin:20px auto 40px; padding:0 10px;
}
.info-card{
  border-radius:10px; box-shadow:var(--shadow);
  background-image:linear-gradient(92deg,var(--card),var(--card2));
  background-color:var(--bg);
  padding:20px;
}
.info-card h3{margin:0 0 12px; font-size:20px; line-height:24px}
.info-card p{margin:0}
.info-card ul{margin:0; padding-left:18px}
.info-card li{margin:0 0 10px; line-height:1.4}



/* Полная ширина страницы для баннеров */
.dual-banners{
  display:flex; justify-content:center; align-items:stretch; gap:2%;
  width:100%; max-width:none; margin:20px 0; padding:0;
}

/* Фиксированная высота ряда баннеров */
.banner-card{
  position:relative; flex:1; min-width:0;
  height:360px;                      /* нужную высоту можно менять */
  border-radius:12px; overflow:hidden; box-shadow:var(--shadow);
}

/* Растянуть картинку по ширине и высоте (допустима деформация) */
.banner-cover{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:fill;                   /* ключ: растягивает по обеим осям */
  display:block;
}

/* Мобильная высота */
@media (max-width:700px){
  .dual-banners{flex-direction:column; gap:16px}
  .banner-card{height:240px}
}