:root {
    --bs-primary: #0540F2;
    --bs-primary-rgb: 5, 64, 242;
    --bs-text-primary: #383838;
    --primary-gradient: linear-gradient(90deg, #0540F2 0%, #056CF2 100%);
}

.btn-primary {
    background: var(--primary-gradient);
    border: none;
}

.btn-primary:hover,
.btn-primary:focus {
    background: linear-gradient(90deg, #0540F2 0%, #056CF2 100%);
}

.onest-<uniquifier> {
  font-family: "Onest", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

/* === Базовый шрифт для всего документа === */
body {
    font-family: 'Onest', sans-serif;
    font-weight: 300;   /* Light */
    margin: 0;
    color: var(--bs-text-primary);
    background: url("../images/bg-pattern.svg") fixed repeat-y center center;
    background-size: auto 100%;
    will-change: background-position; /* для плавной анимации */
}

/* === Жирный текст === */
b, strong {
    font-weight: 700;   /* Bold */
}

/*p a, h1 a, h2 a , h3 a , h4 a , h5 a , h6 a  {
    background: var(--primary-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}*/

/*a.sp-scroll-up {
    background: #00000077;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
a.sp-scroll-up:hover {
    background: #000000c0;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}*/

/*#main_header_block::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 300px;
  z-index: 5;
  pointer-events: none;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.7) 0,
    rgba(255, 255, 255, 0) 300px
  );
}*/

#main_header_block .sppb-addon-video-local-source {
    border-radius: 30px;
}

a:hover {
    opacity: 0.85;
}

/* === Заголовки === */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-weight: 900;   /* Black */
    margin: 0 0 1rem 0;
}

#sp-main-body {
    padding: 0px
}
.article-details .article-can-edit {
    margin-bottom: 0px
}
/*body.main-page */

#sp-header {
    box-shadow: none;
}

#sp-header {
    background: #ffffffec;
}

#header_block {
  background: url("../images/bg-pattern-light.svg") no-repeat center center, linear-gradient(90deg, #056CF2 0%, #0540F2 100%);
    background-size: 100% auto;
    color: #fff;
}

body.blog #sp-main #sp-main-body {
  max-width: 1850px;
  margin: 0 auto;
  padding-left: 40px;
  padding-right: 40px;
}

.sppb-section {
  border-radius: 30px;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {text-transform: uppercase; font-weight: 900;}

.sppb-addon-title-icon {
    display: block;
    margin-bottom: 0.5em;
}

.clearfix:before, .clearfix:after {display: none;}

.offcanvas-overlay {
    background: rgba(5, 108, 242, .7);
}

/* === Контейнер галереи === */
.main_cases .sppb-gallery {
    display: grid;
    grid-template-columns: 1fr 1fr; /* две колонки равной ширины */
    grid-auto-rows: 36vh;          /* высота маленького блока */
    gap: 20px;

    list-style: none;
    padding: 0;
    margin: 0;
}

#sp-menu ul li.sp-menu-item a, .sp-megamenu-parent>li.sp-menu-item.active>a, .burger-icon {
  text-transform: uppercase;
  color: #383838;
  font-size: large;
  font-weight: 400;
}

.sp-megamenu-parent .sp-has-child:hover>.sp-dropdown {
    margin-top: -80px;
}

#sp-menu .sp-has-child>.sp-dropdown ul li.sp-menu-item a {
  color: color: var(--bs-text-primary);
}

.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner {border-radius: 10px;}

#sp-bottom {
    font-size: 1rem;
    line-height: 1;
    /*color: #fff;*/
}

.mod-menu {text-transform: uppercase;}

.sp-scroll-up {
  left: 10px;
  right: auto;
}
.sppb-panel-faq .sppb-panel-heading i {color: #056CF2;}
.sppb-panel-faq .sppb-panel-heading.active i {color: #ccc;}

/* === Элементы галереи === */
.main_cases .sppb-gallery li {
    float: none;
    padding: 0;
    display: flex; /* для justify-content (центровка) */
}

.main_cases::before, .main_cases::after {display: none;}

/* === Большие блоки === */
.main_cases .sppb-gallery li.is-big {
    grid-row: span 2; /* 2 высоты маленького блока = 480px с gap */
}

/* === Выравнивание по колонкам === */
.main_cases .sppb-gallery li[data-col="1"] {
    justify-content: flex-end; /* левая колонка прижата к правому краю */
}

.main_cases .sppb-gallery li[data-col="2"] {
    justify-content: flex-start; /* правая колонка прижата к левому краю */
}

/* === Ссылка и блок внутри li === */
.main_cases .sppb-gallery li a,
.main_cases .sppb-gallery li {
    height: 100%;
}

/* === Изображения внутри блока === */
.main_cases .sppb-gallery img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* === Ссылка внутри блока для эффекта cover === */
.main_cases .sppb-gallery li a {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;   /* обрезаем лишнее */
    position: relative;
    border-radius: 30px;
}

/* === Центрируем изображение с object-fit: cover === */
.main_cases .sppb-gallery img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100% !important;
    height: 100%;
    object-fit: cover;          /* изображение полностью заполняет блок */
    transform: translate(-50%, -50%); /* центрируем изображение */
}

.sppb-panel-faq>.sppb-panel-heading {border: none;}
.sppb-nested-row .sppb-section {
    height: 100%;
}
.sppb-panel-title {padding-right: 60px;}

.sppb-person-image {
    margin: 0 auto;
    width: 150px;
    top: -30px;
}

.sppb-person-image img.sppb-img-responsive {
    border: 3px #fff solid;
}

span.sppb-person-name {
    font-size: 2rem !important;
}

span.sppb-person-designation {
    font-weight: 200 !important;
    font-size: 1rem !important;
}

img.mfp-img {
    padding: 40px;
    background: #fff;
    border-radius: 30px;
}
.mfp-close-btn-in .mfp-content .mfp-close {
    color: #383838;
    margin-right: 20px;
}
.mfp-counter {right: 40px;}
.mfp-title {left: 40px;}

.blurred {
  position: relative;
  background: rgba(134, 134, 134, 0.15);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #fff;
  z-index: 1;
}


.blurred::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('../images/noise.png');
  background-repeat: repeat;
  mix-blend-mode: soft-light;
  opacity: 0.4;
  pointer-events: none;
  z-index: 2;
  border-radius: 15px;
}

.offcanvas-inner .sp-contact-mobile {
  font-weight: 800;
  font-size: medium;
}

.img-services {
  height: 320px;
  width: 100%;
  overflow: hidden;
  border-radius: 30px;
}

/*body.blog {
  #sp-main-body {padding: 200px 100px 100px 100px;}
}*/

/*body.blog #sp-menu ul li.sp-menu-item a, body.blog .sp-megamenu-parent>li.sp-menu-item.active>a {color: #383838;}
body.blog .burger-icon > span {background-color: #383838;}*/

body.blog #sp-component .article-details {
  max-width: 1180px; 
  margin: 0 auto;
  /*padding: 40px;*/
}

/*body.blog.cases #sp-main-body {
        padding: 200px 100px 100px 100px;
    }*/

body.blog.cases #sp-component .article-details {
  max-width: 100%; 
}

body.blog.cases figcaption.caption.text-dark {
    position: absolute;
    top: 30px;
    padding: 10px 20px;
    background: #fff;
    font-size: 1.5rem !important;
    font-weight: 900;
    border-bottom-right-radius: 15px;
    border-top-right-radius: 15px;
}

.blog-item .article-intro-image.float-left {
    width: 50%;
    float: left;
}

.article-intro-image {
    border-radius: 30px !important;
}

.com-content-category-blog__items.blog-items.items-leading.article-list.articles-leading {
    clear: both;
    display: block;
    float: left;
    padding-bottom: 40px;
}

.blog-item .article-body {
    width: 50%;
    float: right;
}

.blog-item .article-header h2 {font-size: 2rem !important;}

.article-list .article .readmore {
    font-size: 1.2rem;
    font-weight: 600;
}

.article-list .article {
  border: none;
}

body.cases .article-list .article, body.cases .article-intro-image, body.cases .article-intro-image a {
  height: 100%;
}

body.cases .article-intro-image a img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.com-content-category-blog__pagination {
    float: none;
    display: inline-block;
}

.com-content-category-blog__navigation.w-100 {
    text-align: center;
}
.com-content-category-blog__counter {float: none !important;}

.page-item:first-child .page-link {
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px
}

.page-item:last-child .page-link {
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px
}
figure.article-full-image.item-image.float-left {
    overflow: hidden;
    border-radius: 30px;
    float: left;
    margin-right: 40px;
}

figure.article-full-image.item-image {
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
}

figure.article-full-image.item-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/*nav.mod-breadcrumbs__wrapper {
    margin: 0 auto;
    position: absolute;
    top: 160px;
    padding: 0 100px;
    z-index: 100;
}*/

.breadcrumb {
    background: none;
    font-size: 0.85rem;
    margin-top: 20px;
    max-width: 1850px;
    margin: 0 auto;
    justify-content: center;
}

.sticky-block {
  will-change: transform;
  transition: 
    padding-top 0.5s ease, 
    width 0.5s ease, 
    transform 0.5s ease;
}

.sticky-block.is-fixed {
  position: fixed;
  top: 200px;
  z-index: 10;
}

#redim-cookiehint-bottom .cookiebuttons{
	text-align: right;
	float: right;
}

.sppb-addon.sppb-addon-video {
    border-radius: 30px;
    overflow: hidden;
    background: var(--primary-gradient);
}


/*================ПОРТФОЛИО================*/
.sp-simpleportfolio-overlay-wrapper {border-radius: 30px;}
.sp-simpleportfolio-info {
  left: 15px !important;
  right: 15px !important;
  bottom: 15px !important;
  width: calc(100% - 30px) !important;
}

.sp-simpleportfolio-info {
    background: #38383883 !important;
    color: #fff !important;
    bottom: 0;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
}

.sp-simpleportfolio-info a {color: #fff !important;}

.sp-simpleportfolio-item:hover .sp-simpleportfolio-info {background: #383838 !important;}

    .featherlight .featherlight-content {
        padding: 40px 40px 0;
        border-bottom: 40px solid transparent;
    }
        .featherlight .featherlight-close-icon {
        top: 10px;
        right: 10px;
    }

.sp-simpleportfolio-item {
  position: relative;
}

.sp-simpleportfolio-overlay-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}

.sp-simpleportfolio-img {
  display: block;
  width: 100%;
  height: auto;
}

.sp-simpleportfolio-overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 4;
}

.sp-simpleportfolio-info {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 6;
  background: rgba(0, 0, 0, 0.55);
  padding: 12px 16px;
  box-sizing: border-box;
}

.sp-simpleportfolio-title a,
.sp-simpleportfolio-tags {
  color: #fff;
}

.sp-simpleportfolio-img {border-radius: 30px !important;}

.sp-simpleportfolio-filter ul li:first-child a {
  border-top-left-radius: 30px !important;
  border-bottom-left-radius: 30px !important;
}

.sp-simpleportfolio-filter ul li:last-child a {
  border-top-right-radius: 30px !important;
  border-bottom-right-radius: 30px !important;
}

/*-----------КАРУСЕЛЬ---------*/

.sppb-carousel-extended-item img {
    object-fit: cover;
    border-radius: 30px;
}


/*=======================АДАПТИВЫ============================*/

@media (min-width: 1850px) {
  body {
      font-size: 1.5rem;  /* базовый размер */
      line-height: 1.5;
  }

  .featherlight-content {
    border-radius: 30px;
}

.sp-simpleportfolio-item.shuffle-item.filtered {
    border-radius: 30px !important;
}

.sp-simpleportfolio-overlay-wrapper.clearfix {
    border-radius: 30px;
}

  /* Пропорциональные размеры заголовков */
  h1, .h1 { font-size: 3.75rem; line-height: 1; }
  h2, .h2 { font-size: 3rem;    line-height: 1; }
  h3, .h3 { font-size: 2.625rem; line-height: 1; }
  h4, .h4 { font-size: 2.25rem; line-height: 1; }
  h5, .h5 { font-size: 1.875rem; line-height: 1; }
  h6, .h6 { font-size: 1.5rem;  line-height: 1; }

  .display-1 * {font-size: 5rem;}
  .display-2 * {font-size: 4.5rem;}
  .display-3 * {font-size: 4rem;}
  .display-4 * {font-size: 3.5rem;}
  .display-5 * {font-size: 3rem;}
  .display-6 * {font-size: 2.5rem;}

  /* Параграфы */
  p {
      font-size: 1.5rem;
      line-height: 1.5;
      margin-bottom: 1rem;
  }

    /*body.main-page */
  #sp-header.full-header {
    padding-left: 100px;
    padding-right: 100px
  }

    /*==АККОРДИОН==*/

  .sppb-panel-title {
    font-size: xx-large;
  }
}

@media (min-width: 992px) { 
  /*#main_header_block {height: 98vh;}*/
  /*.burger-icon > span {
    background-color: #fff;
  }*/

  /*body.main-page */
  #sp-header.full-header {
    padding-left: 50px;
    padding-right: 50px
  }
}
 
@media (min-width: 1851px) and (max-width: 2030px){
    /*body.main-page */
  #sp-header.full-header {
    padding-left: 100px;
    padding-right: 100px;
  }
}

@media (min-width: 992px) and (max-width: 1849px) {
  body {
      font-size: 1.2rem;  /* базовый размер */
      line-height: 1.2;
  }

  /* Пропорциональные размеры заголовков */
  h1, .h1 { font-size: 2.5rem; line-height: 1; }
  h2, .h2 { font-size: 2rem;    line-height: 1; }
  h3, .h3 { font-size: 1.75rem; line-height: 1; }
  h4, .h4 { font-size: 1.5rem; line-height: 1; }
  h5, .h5 { font-size: 1.25rem; line-height: 1; }
  h6, .h6 { font-size: 1.2rem;  line-height: 1; }

  .display-1 * {font-size: 4.5rem;}
  .display-2 * {font-size: 4rem;}
  .display-3 * {font-size: 3.5rem;}
  .display-4 * {font-size: 3rem;}
  .display-5 * {font-size: 2.5rem;}
  .display-6 * {font-size: 2rem;}

  /* Параграфы */
  p {
      font-size: 1.2rem;
      line-height: 1.2;
      margin-bottom: 1rem;
  }

  /*#main_header_block {height: 98vh;}*/

  /*body.main-page */
  #sp-header.full-header {
    padding-left: 140px;
    padding-right: 140px
  }

  /*==АККОРДИОН==*/

  .sppb-panel-title {
    font-size: xx-large;
  }
}

@media (min-width: 992px) and (max-width: 1080px) {
  #sp-menu ul li.sp-menu-item a, .sp-megamenu-parent>li.sp-menu-item.active>a {font-size: small;}
}

@media (width: 1366px) {
    #sp-header.full-header {
        padding-left: 140px;
        padding-right: 140px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    body {
      font-size: 1.2rem;  /* базовый размер */
      line-height: 1.2;
    }

    /* Пропорциональные размеры заголовков */
    h1, .h1 { font-size: 2.75rem; line-height: 1; }
    h2, .h2 { font-size: 2.25rem;    line-height: 1; }
    h3, .h3 { font-size: 2rem; line-height: 1; }
    h4, .h4 { font-size: 1.75rem; line-height: 1; }
    h5, .h5 { font-size: 1.5rem; line-height: 1; }
    h6, .h6 { font-size: 1.25rem;  line-height: 1; }

    .display-1 * {font-size: 4.5rem;}
    .display-2 * {font-size: 4rem;}
    .display-3 * {font-size: 3.5rem;}
    .display-4 * {font-size: 3rem;}
    .display-5 * {font-size: 2.5rem;}
    .display-6 * {font-size: 2rem;}

    /* Параграфы */
    p {
        font-size: 1.2rem;
        line-height: 1.2;
        margin-bottom: 1rem;
    }
}

/*=Для планшетов и меньше=*/
@media (max-width: 991px) {

  main#sp-main {
    margin-top: 40px;
  }

  #sp-header {
    position: fixed;
    top: 0;
    z-index: 1000;
    left: 0 !important;
    transform: none !important;
    background: #fff;
  }

  .sp-page-builder .page-content #header_block {
    padding-top: 100px;
  }

  #main_header_block {
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden; /* чтобы контент не вылезал */
  }

    /*==АККОРДИОН==*/

  .sppb-panel-title {
    font-size: large;
  }

  .popup-contacts-wrapper {
    position: fixed;
    right: 35px;
    bottom: 35px;
    width: 80px;
    height: 80px;
    transform: scale(0.75);
  }

    /*nav.mod-breadcrumbs__wrapper {
    margin: 0 auto;
    position: absolute;
    top: 100px;
    padding: 0 40px;
    z-index: 100;
}*/
/*
  body.blog.cases #sp-main-body {
        padding: 100px 40px 40px 40px;
    }*/
}

@media (max-width: 430px){

  body.main-page #sp-header {
    max-width: 100%;
    left: auto;
    transform: none;
    padding-left: 10px;
    padding-right: 10px;
}
 .sp-page-builder .page-content #header_block {
    padding-top: 40px;
  }

  /*nav.mod-breadcrumbs__wrapper {
    margin: 0 auto;
    position: absolute;
    top: 100px;
    padding: 0 10px;
    z-index: 100;
}*/
/*
  body.blog.cases #sp-main-body {
        padding: 100px 10px 10px 10px;
    }*/

   body.blog.cases .article-list .article {
    margin-bottom: 0;
   }

  #sppb-addon-c6cf2ad5-e54d-46bb-bde5-6f1ea632831e .sppb-gallery img {
        width: 160px;
        height: 140px;
    }

  body.blog #sp-main-body {padding: 10px 10px 10px 10px;}

  body.blog .blog-item .article-intro-image.float-left, .blog-item .article-body {width: 100%;}

}