:root {
  --ds-inner-gap-large: 36px;
  --ds-between-gap: 15px; /* между иконкой и body */
  --ib-title-margin : 0.5rem; /* между заголовком и текстом */
  --ds-gradient-1: linear-gradient(95deg, rgba(63, 94, 251, 1) 0%, rgba(252, 70, 107, 1) 85%);
  --border-radius: 16px; /* deprecated */
  --radius : 16px;
  --shadow : 0 0 16px 0px #f3f3f3;
  /* тест lg первичнее lg */
  --ds-slides-lg : 3.5;
  --ds-slides-md : 2.25;
  --ds-slides-sm : 1.25;
  --ds-ratio-size : 75px; /* параметр по умолчанию для высоты/ширины компонента */
  --ds-fs-xs : 13px;
  --ds-fs-sm : 15px;
  --ds-fs-md : 16px;
  --ds-fs-default : var(--wd-text-font-size, 19px);
  --ds-fs-lg : 22px;
  --ibs-scroll-width: 80%;  
  --free-icon-bottom-height: 200px;
}


/* наверное важно, эта штука ведет себя везде по-разному, но тут - обязательно, так
как неизвестна высота изначально слайда */
.ds-slider .wd-carousel-item { 
  height:auto;
}
@media (max-width:575.5px) {
  .ds-hide-navs-xs .wd-btn-arrow {
      display: none;
  }
}

/************************ GRID ENGINE ***********/

.ds-grid {
  display: grid;  
  grid-auto-flow: dense;

  --ds-grid-gap-lg: 24px;
  --ds-grid-gap-md: 16px;
  --ds-grid-gap-sm: 12px;
  --ds-grid-gap-xs: 8px; 
  --ds-grid-gap : var(--ds-grid-gap-sm); /* xs- для ультратонких gaps, например если два в ряду!*/

  gap: var(--ds-grid-gap); 
}
.ibs {
   --ds-inner-gap-xs: 16px;
  --ds-inner-gap-sm: 12px;
  --ds-inner-gap-md: 16px;
  --ds-inner-gap-lg: 24px;
  --ds-inner-gap: var( --ds-inner-gap-xs);
}
/* ===== base (<576px) ===== */
.ds-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.ds-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.ds-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.ds-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.ds-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.ds-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.ds-cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}.ds-cols-8{grid-template-columns:repeat(8,minmax(0,1fr))}.ds-cols-9{grid-template-columns:repeat(9,minmax(0,1fr))}.ds-cols-10{grid-template-columns:repeat(10,minmax(0,1fr))}.ds-cols-11{grid-template-columns:repeat(11,minmax(0,1fr))}.ds-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}

/* ===== sm (≥576) ===== */
@media (min-width:576px){
.ds-grid {--ds-inner-gap: var(--ds-inner-gap-sm);}
.ds-grid {--ds-grid-gap: var(--ds-grid-gap-md)}
.ds-cols-sm-1{grid-template-columns:repeat(1,minmax(0,1fr))}.ds-cols-sm-2{grid-template-columns:repeat(2,minmax(0,1fr))}.ds-cols-sm-3{grid-template-columns:repeat(3,minmax(0,1fr))}.ds-cols-sm-4{grid-template-columns:repeat(4,minmax(0,1fr))}.ds-cols-sm-5{grid-template-columns:repeat(5,minmax(0,1fr))}.ds-cols-sm-6{grid-template-columns:repeat(6,minmax(0,1fr))}.ds-cols-sm-7{grid-template-columns:repeat(7,minmax(0,1fr))}.ds-cols-sm-8{grid-template-columns:repeat(8,minmax(0,1fr))}.ds-cols-sm-9{grid-template-columns:repeat(9,minmax(0,1fr))}.ds-cols-sm-10{grid-template-columns:repeat(10,minmax(0,1fr))}.ds-cols-sm-11{grid-template-columns:repeat(11,minmax(0,1fr))}.ds-cols-sm-12{grid-template-columns:repeat(12,minmax(0,1fr))}}

/* ===== md (≥768) ===== */
@media (min-width:768px){  
.ds-grid {--ds-inner-gap: var(--ds-inner-gap-md);}
.ds-cols-md-1{grid-template-columns:repeat(1,minmax(0,1fr))}.ds-cols-md-2{grid-template-columns:repeat(2,minmax(0,1fr))}.ds-cols-md-3{grid-template-columns:repeat(3,minmax(0,1fr))}.ds-cols-md-4{grid-template-columns:repeat(4,minmax(0,1fr))}.ds-cols-md-5{grid-template-columns:repeat(5,minmax(0,1fr))}.ds-cols-md-6{grid-template-columns:repeat(6,minmax(0,1fr))}.ds-cols-md-7{grid-template-columns:repeat(7,minmax(0,1fr))}.ds-cols-md-8{grid-template-columns:repeat(8,minmax(0,1fr))}.ds-cols-md-9{grid-template-columns:repeat(9,minmax(0,1fr))}.ds-cols-md-10{grid-template-columns:repeat(10,minmax(0,1fr))}.ds-cols-md-11{grid-template-columns:repeat(11,minmax(0,1fr))}.ds-cols-md-12{grid-template-columns:repeat(12,minmax(0,1fr))}}

/* ===== lg (≥1024) ===== */
@media (min-width:1024px){  
.ds-grid {--ds-inner-gap: var(--ds-inner-gap-lg);}
.ds-grid {--ds-grid-gap: var(--ds-grid-gap-lg)}
.ds-cols-lg-1{grid-template-columns:repeat(1,minmax(0,1fr))}.ds-cols-lg-2{grid-template-columns:repeat(2,minmax(0,1fr))}.ds-cols-lg-3{grid-template-columns:repeat(3,minmax(0,1fr))}.ds-cols-lg-4{grid-template-columns:repeat(4,minmax(0,1fr))}.ds-cols-lg-5{grid-template-columns:repeat(5,minmax(0,1fr))}.ds-cols-lg-6{grid-template-columns:repeat(6,minmax(0,1fr))}.ds-cols-lg-7{grid-template-columns:repeat(7,minmax(0,1fr))}.ds-cols-lg-8{grid-template-columns:repeat(8,minmax(0,1fr))}.ds-cols-lg-9{grid-template-columns:repeat(9,minmax(0,1fr))}.ds-cols-lg-10{grid-template-columns:repeat(10,minmax(0,1fr))}.ds-cols-lg-11{grid-template-columns:repeat(11,minmax(0,1fr))}.ds-cols-lg-12{grid-template-columns:repeat(12,minmax(0,1fr))}}

/* ===== xl (≥1200) ===== */
@media (min-width:1200px){
.ds-cols-xl-1{grid-template-columns:repeat(1,minmax(0,1fr))}.ds-cols-xl-2{grid-template-columns:repeat(2,minmax(0,1fr))}.ds-cols-xl-3{grid-template-columns:repeat(3,minmax(0,1fr))}.ds-cols-xl-4{grid-template-columns:repeat(4,minmax(0,1fr))}.ds-cols-xl-5{grid-template-columns:repeat(5,minmax(0,1fr))}.ds-cols-xl-6{grid-template-columns:repeat(6,minmax(0,1fr))}.ds-cols-xl-7{grid-template-columns:repeat(7,minmax(0,1fr))}.ds-cols-xl-8{grid-template-columns:repeat(8,minmax(0,1fr))}.ds-cols-xl-9{grid-template-columns:repeat(9,minmax(0,1fr))}.ds-cols-xl-10{grid-template-columns:repeat(10,minmax(0,1fr))}.ds-cols-xl-11{grid-template-columns:repeat(11,minmax(0,1fr))}.ds-cols-xl-12{grid-template-columns:repeat(12,minmax(0,1fr))}}

/* --- Контейнер CSS‑Grid для колонок--- */
.ds-grid-12 {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  --ds-grid-gap: 1rem;
  gap: var(--ds-grid-gap); 
}
.ds-grid-12 *{min-width:0} /* страховка */
/* ===== Ширина колонок (XS: база) ===== */
.ds-col-1{grid-column:span 1}
.ds-col-2{grid-column:span 2}
.ds-col-3{grid-column:span 3}
.ds-col-4{grid-column:span 4}
.ds-col-5{grid-column:span 5}
.ds-col-6{grid-column:span 6}
.ds-col-7{grid-column:span 7}
.ds-col-8{grid-column:span 8}
.ds-col-9{grid-column:span 9}
.ds-col-10{grid-column:span 10}
.ds-col-11{grid-column:span 11}
.ds-col-12{grid-column:span 12}

/* ===== SM (≥576) ===== */
@media (min-width:576px){
  .ds-col-sm-1{grid-column:span 1}
  .ds-col-sm-2{grid-column:span 2}
  .ds-col-sm-3{grid-column:span 3}
  .ds-col-sm-4{grid-column:span 4}
  .ds-col-sm-5{grid-column:span 5}
  .ds-col-sm-6{grid-column:span 6}
  .ds-col-sm-7{grid-column:span 7}
  .ds-col-sm-8{grid-column:span 8}
  .ds-col-sm-9{grid-column:span 9}
  .ds-col-sm-10{grid-column:span 10}
  .ds-col-sm-11{grid-column:span 11}
  .ds-col-sm-12{grid-column:span 12}
}

/* ===== MD (≥768) ===== */
@media (min-width:768px){
  .ds-col-md-1{grid-column:span 1}
  .ds-col-md-2{grid-column:span 2}
  .ds-col-md-3{grid-column:span 3}
  .ds-col-md-4{grid-column:span 4}
  .ds-col-md-5{grid-column:span 5}
  .ds-col-md-6{grid-column:span 6}
  .ds-col-md-7{grid-column:span 7}
  .ds-col-md-8{grid-column:span 8}
  .ds-col-md-9{grid-column:span 9}
  .ds-col-md-10{grid-column:span 10}
  .ds-col-md-11{grid-column:span 11}
  .ds-col-md-12{grid-column:span 12}
}

/* ===== LG (≥1024) ===== */
@media (min-width:1024px){
  .ds-col-lg-1{grid-column:span 1}
  .ds-col-lg-2{grid-column:span 2}
  .ds-col-lg-3{grid-column:span 3}
  .ds-col-lg-4{grid-column:span 4}
  .ds-col-lg-5{grid-column:span 5}
  .ds-col-lg-6{grid-column:span 6}
  .ds-col-lg-7{grid-column:span 7}
  .ds-col-lg-8{grid-column:span 8}
  .ds-col-lg-9{grid-column:span 9}
  .ds-col-lg-10{grid-column:span 10}
  .ds-col-lg-11{grid-column:span 11}
  .ds-col-lg-12{grid-column:span 12}
}

/* ===== XL (≥1200) ===== */
@media (min-width:1200px){
  .ds-col-xl-1{grid-column:span 1}
  .ds-col-xl-2{grid-column:span 2}
  .ds-col-xl-3{grid-column:span 3}
  .ds-col-xl-4{grid-column:span 4}
  .ds-col-xl-5{grid-column:span 5}
  .ds-col-xl-6{grid-column:span 6}
  .ds-col-xl-7{grid-column:span 7}
  .ds-col-xl-8{grid-column:span 8}
  .ds-col-xl-9{grid-column:span 9}
  .ds-col-xl-10{grid-column:span 10}
  .ds-col-xl-11{grid-column:span 11}
  .ds-col-xl-12{grid-column:span 12}
}


@media (min-width:992px) {
.ds-chess-1-2 {  grid-template-columns: 1fr 1fr 1fr;}
.ds-chess-1-2>*{ grid-column:span 1; height:260px;}
.ds-chess-1-2>*:nth-child(4n+2){ grid-column:2 / span 2; }
.ds-chess-1-2>*:nth-child(4n+3){ grid-column:1 / span 2; }
.ds-chess-1-2>*:nth-child(4n+4){ grid-column:3; }
}



/******************************************************/
/************ MODAL **************/
.modal-content {
  margin-bottom: 0; /*reboot */
}

.modal-content {
	font-size: larger;
	text-align: center;
	font-weight:bolder;
}
.modal-title {
	color: var(--wd-primary-color);
	font-weight:bolder;
}
.attached-content, .btn-title, .modal-only, 
.ibs-modal-hide-default .modal-content-default,
.ibs-modal-hide-title .modal-title {
  display: none!important;
}
.wd-popup .attached-content, .wd-popup .modal-only {
  display: block!important;
}
.wd-popup .no-modal {
  display: none!important;
}
.wd-popup {
  padding: clamp(20px, 2.5vw, 32px)!important;
}

/****   END MODAL *************************/

/******************************************************/
.badges {
  position: absolute;
  top:15px;
  left:0; 
  z-index:11;
}
.badges .badge {
  display: flex;
  padding: 3px 6px;
  justify-content: start;
  align-items: center;;
  font-size:12px;
  color:white;
  background-color: grey;
  margin-bottom: 6px;
}

.ib {
  position: relative;
  transition: all 300ms;;
}

@media (max-width:767.5px) {
  .ibs-scroll-768 .ibs, .ibs-scroll-768.ibs {
    display:flex!important;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 0.5rem;
    margin-bottom:15px;
    -webkit-overflow-scrolling: touch; 
  }
  .ibs-scroll-768:not(.ibs-scroll-keep-grid) .ib {
    flex: 0 0 auto;
    max-width:var(--ibs-scroll-width);
    width:var(--ibs-scroll-width);    
  }
  .ibs-scroll-keep-grid .ib {
    width:auto;
    max-width:none;
    min-width:0;
    flex: 0 0 calc(100% / var(--ibs-scroll-sm-cols));
  }
}
@media (max-width:575.5px) {
  .ibs-scroll .ibs, .ibs-scroll.ibs {
    display:flex!important;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 0.5rem;
    margin-bottom:15px;
    -webkit-overflow-scrolling: touch; 
  }
  .ibs-scroll:not(.ibs-scroll-keep-grid) .ib {
    flex: 0 0 auto;
    max-width:var(--ibs-scroll-width);
    width:var(--ibs-scroll-width);
  }
  .ibs-scroll-keep-grid .ib{
    width:auto;
    max-width:none;
    min-width:0;
    flex: 0 0 calc(100% / var(--ibs-scroll-xs-cols));
  }
}

.ds-fill, .ibs-fill {
  position: absolute;
  display: block;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
}

.ibs-border .ib, .ib-border {
  border: 1px solid #f0f0f0;
}
.ibs-border.ibs-text-light .ib {
  border: 1px solid #3a3a3a;
}

.ibs-radius .ib, .ib-radius {
  border-radius: var(--border-radius, 0.5rem);
  overflow: hidden;
}

.ibs-no-radius .ib, .ib-no-radius {
  border-radius: 0 !important;
}

.text-muted {
  opacity:0.85;
}

.ibs-bg-dark .ib {
  background-color: var(--bg-dark, rgba(0, 0, 0, 0.7));
}

.ibs-bg-dark .ib-title,
.ibs-bg-dark .ib-text,
.ibs-bg-gr .ib-title,
.ibs-bg-gr .ib-text,
.ibs-text-light *,
.text-light *, .text-light {
  color: white!important;
}

.ibs-bg-light .ib {
  background-color: white;
}

.ibs-bg-light .ib-title,
.ibs-bg-light .ib-text,
.ibs-text-dark *, .text-dark *, .text-dark {
  color:var(--wd-form-color,  #555)!important; /* берем из вудмарта */
}

.ibs-text-default * {
  color: var(--wd-form-color)!important; /* это цвет при инициализации */
}
/* но не кнопка! */
.ibs-text-dark a.btn, .ibs-text-default a.btn, .text-dark a.btn, .text-default a.btn {
  color: white!important;
}
.ibs-bg-gr .ib {
  background: var(--ds-gradient-1, #222);
}
.ibs-bg-grey .ib {
  background-color: var(--grey, #f9f9f9);
}

.ibs-light .ib-title,
.ibs-light .ib-text {
  color: #555;
}
.ibs-shadow .ib {
  box-shadow: var(--shadow);
}
.ibs-shadow .wd-carousel {
  padding-top:1rem;
}

.ibs-mask .ib:before {
  position: absolute;
  z-index: 2;
  content:'';
  display: block;
  width:100%;
  height:100%;
  background: rgba(0,0,0,0.65);
  transition: background 300ms;
}
.ibs-mask .ib:hover:before {
  background: rgba(0,0,0,0.75);
}



.ibs-red .ib { background-color: #EF4444; }
.ibs-rose .ib { background-color: #F43F5E; }
.ibs-pink .ib { background-color: #EC4899; }
.ibs-fuchsia .ib { background-color: #D946EF; }
.ibs-purple .ib { background-color: #8B5CF6; }
.ibs-indigo .ib { background-color: #6366F1; }
.ibs-blue .ib { background-color: #3B82F6; }
.ibs-cyan .ib { background-color: #06B6D4; }
.ibs-teal .ib { background-color: #14B8A6; }
.ibs-green .ib { background-color: #10B981; }
.ibs-lime .ib { background-color: #84CC16; }
.ibs-yellow .ib { background-color: #EAB308; }
.ibs-amber .ib { background-color: #F59E0B; }
.ibs-orange .ib { background-color: #F97316; }
.ibs-brown .ib { background-color: #8B4513; }
.ibs-gray .ib { background-color: #6B7280; }
.ibs-slate .ib { background-color: #64748B; }
.ibs-navy .ib { background-color: #001F3F; }
.ibs-black .ib { background-color: #000000; }
.ibs-white .ib { background-color: #FFFFFF; }
.ibs-transparent .ib { background-color: transparent; overflow: visible; border-radius: 0;}

.bg-red { background-color: #EF4444 !important; }
.bg-rose { background-color: #F43F5E !important; }
.bg-pink { background-color: #EC4899 !important; }
.bg-fuchsia { background-color: #D946EF !important; }
.bg-purple { background-color: #8B5CF6 !important; }
.bg-indigo { background-color: #6366F1 !important; }
.bg-blue { background-color: #3B82F6 !important; }
.bg-cyan { background-color: #06B6D4 !important; }
.bg-teal { background-color: #14B8A6 !important; }
.bg-green { background-color: #10B981 !important; }
.bg-lime { background-color: #84CC16 !important; }
.bg-yellow { background-color: #EAB308 !important; }
.bg-amber { background-color: #F59E0B !important; }
.bg-orange { background-color: #F97316 !important; }
.bg-brown { background-color: #8B4513 !important; }
.bg-gray { background-color: #6B7280 !important; }
.bg-slate { background-color: #64748B !important; }
.bg-navy { background-color: #001F3F !important; }
.bg-black { background-color: #000000 !important; }
.bg-white { background-color: #FFFFFF !important; }
.bg-transparent { background-color: transparent !important; }


.radius {  
  border-radius: var(--border-radius);
  overflow: hidden;
}
.overflow-hidden, .ibs-overflow-hidden .ib {
  overflow: hidden;
}
.overflow-visible, .ibs-overflow-visible .ib {
  overflow:visible!important;
}
.ibs-text-ellipsis .ib-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ibs-btn-100 .btn {
  width:100%;
}

/*********************************************************************************/
/***********************                 ICON BOXES   ****************************/
/*********************************************************************************/
/*                     */
/*   ib-ds-text-light - появляется как доп. элемент в случае установки ibs-both-icontypes */
.ibs i.bi {
  display: block;
  line-height: 100%;
}
.ib [class*="fa"] {
  color: var(--wd-primary-color);
}
.ib {
  display: flex;
  flex-direction: column;
  background-repeat: no-repeat;
  background-size: cover;
  overflow: hidden; /* default */
  
}
.wd-carousel-item .ib {
  height: 100%;
}
.ib-inner {
  display: flex;
  flex-direction: column;
  background-repeat: no-repeat;
  background-size: cover;
  padding: var(--ds-inner-gap);
  gap: var(--ds-between-gap);
  height:100%;
}

.ib-body {
  display: flex;
  flex-direction: column;  
  width: 100%;
  height:auto;
  flex:1 1 auto;
  min-width:0;
  position: relative;
  z-index:2;
}
.ib-title {
  margin-top: 0;
  display: flex;
  line-height:1.15;
  margin-bottom: var(--ib-title-margin);
}
.ib-title * {
  margin-bottom: 0;
}
.ib-title {
  font-weight: bolder;
}
.ib-text p {
  text-align: unset;
}

.ibs-text-left .ib-text {
  justify-content: start!important;
  text-align: left!important;
}

.ib-icon {
  position: relative;
  display: flex; 
  height: var(--ds-ratio-size);
  font-size: var(--ds-ratio-size);
  line-height: var(--ds-ratio-size);;
}
.ib-texticon {
  display: flex;
  width:auto;
  height:var(--ds-ratio-size);  
  transition: transform 0.3s cubic-bezier(.215, .61, .355, 1);
}
.ib-texticon i {
  font-size: var(--ds-ratio-size);
}
 .ibs-no-icons .ib-icon {
  display: none;
 }


.img-wrap {  /* reserved */
  width:auto;
  height:inherit;
}

.ib-img {
  display: block;
  width: auto;
  height:100%;
  object-fit: contain;
  z-index: 2;  
  transition: transform 0.3s cubic-bezier(.215, .61, .355, 1);  
}

.ib-btn-container {
  display: flex;
  margin-top: auto;
  padding-top: var(--ds-between-gap);
}
.ibs-feature-inside .ib-btn-container {
  /* текст перед кнопкой*/
  flex-direction: column;
  align-items: flex-start;
}
.ibs-feature-inside .ib-feature-text {
  margin-bottom: 0.5rem;
}
/* есил кнопка одна, удаляем маргин*/
.ib-body .ib-btn-container:first-child {
  margin-top:0;
  padding-top:0;
}

.ib-btns-container {
  display: flex; 
  justify-content: space-between;
}
.ibs-btn-center .ib-btn-container {
 justify-content: center!important;
}
.ibs-btn-left .ib-btn-container {
  justify-content: start!important;
}

.ibs-iconsize-small  {
  --ds-ratio-size : 40px;
}

.ibs-iconsize-standart {
  --ds-ratio-size : 75px;
}

.ibs-iconsize-big {
  --ds-ratio-size:120px;
}


.ibs-iconsize-stretch .ib-inner {
  padding: 0;
  height: auto;
  gap: 0; /* отключаем слишком большое расстояние между фото и контентом */
  height:100%; /* для кнопки! */
}
.ibs-iconsize-stretch .ib-body {
  padding: var(--ds-inner-gap);
}
.ibs-iconsize-stretch .ib-icon {
  display: block;
  padding: 0 !important;
  margin: 0;
  overflow: hidden;
  height:auto;  
  flex: 0 0 auto; /* важно, изменил с 1 0 на 0 0 */ 
  aspect-ratio: 5 / 3;
}
.ibs-iconsize-stretch .ib-icon .ib-img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: center;
}

.ibs-iconsize-reset .ib-icon {
  height: auto;
  width: auto;
}

.ibs-iconsize-reset .ib-texticon>* {
  font-size: unset;
  line-height: unset;
}

/* .ibs-hover должен обязательно идти с "ручными" классами так как он управляет появлением нового блока с bg img*/

.ibs-hover .ib {
  cursor:pointer;
}
.ib-bg-image {
  position: absolute;
  top:0; width:100%;
  left:0; height:100%;
  overflow: hidden;
}
.ib-bg-image img {
  object-fit: cover;
  width:100%;
  height: 100%;
  object-position: 50%;
  transition: transform .6s cubic-bezier(.2,.6,.2,1);
}
.ibs-hover-bg-zoom-in .ib:hover .ib-bg-image img{
  transform: scale(1.08);
}

.ibs-hover-img-zoom .ib:hover .ib-img, .ibs-hover-img-zoom .ib:hover .ib-texticon  {
  transform: scale(1.08); 
}

.ibs-img-radius .ib-icon img {
  border-radius: var(--radius);
}
.ibs-hover-box-shadow .ib:hover {
  box-shadow: var(--shadow, 0 0 10px 0px #d0d0d0);
}


/**********************************************/

/*___________ infoboxes directions _____________*/
.ibs-center :is(.ib-title, .ib-text, .ib-icon, .ib-btn-container),
 .ib-center :is(.ib-title, .ib-text, .ib-icon){
  justify-content: center;
  text-align: center;
}
.ibs-left :is(.ib-title, .ib-text, .ib-icon),  
.ib-left :is(.ib-title, .ib-text, .ib-icon){
  justify-content: start;
  text-align: left;
}
.ibs-right :is(.ib-title, .ib-text, .ib-icon, .ib-btn-container), 
.ib-right :is(.ib-title, .ib-text, .ib-icon){
  justify-content: end;
  text-align: right;
}


.ibs-v-center .ib-inner {
  align-items: center;
}

.ibs-v-start .ib-inner {
  align-items: start;
}

.ibs-v-end .ib-inner {
  align-items: end;
}
.ibs-v-between .ib-text {
  margin-top: auto;
}
.ibs-v-top .ib-btn-container,
.ibs-v-start .ib-btn-container,
.ibs-v-end .ib-btn-container,
.ibs-v-center .ib-btn-container,
.ibs-v-between  .ib-btn-container {
  margin-top: unset;
}

@media (max-width: 575.5px) {
  .ibs-sm-left :is(.ib-title, .ib-text, .ib-icon, .ib-btn-container) {
    justify-content: start;
    text-align: left;
  }

  .ibs-sm-right :is(.ib-title, .ib-text, .ib-icon, .ib-btn-container) {
    justify-content: end;
    text-align: right;
  }

  .ibs-sm-center :is(.ib-title, .ib-text,.ib-btn-container) {
    justify-content: center;
    text-align: center;
  }

    
  .ds-cols-2 .ib-btn-container, .ds-cols-3 .ib-btn-container  {
    justify-content: center;
  }  
  
}

.ibs-blur .ib-bg-image:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}
.ibs-blur.blur-10 .ib-bg-image::after{
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}


/****************************************/

/*_________________ infoboxES INLINE______________*/
.ibs-icon-top .ib-inner {
  flex-direction: column;
}
.ibs-icon-bottom .ib-inner {
  flex-direction: column;
}
.ibs-icon-bottom .ib-icon {
  order: 2;
}
.ibs-icon-left .ib-img,.ibs-icon-right .ib-img {
  width:100%;
  height:auto;
}
.ibs-icon-left .ib-inner {
  flex-direction: row;
}
.ibs-icon-right .ib-inner {
  flex-direction: row;
}
.ibs-icon-right .ib-icon {
  order: 2;
}
.ibs-icon-left .ib-icon, .ibs-icon-right .ib-icon {
  width:var(--ds-ratio-size);  
  height:auto;
  flex: 1 0 auto;
}


@media (max-width:575.5px) {
  /* поднимаем иконку при малых экранах там где три и более в ряд */
  .ds-cols-3 .ib-inner, .ds-cols-4 .ib-inner {
    flex-direction: column;
  }
}

/* infobox UTILITES */
.ibs-content-75 .ib-title, .ibs-content-75 .ib-text {
  /* not btns! */
  width:75%;
}

.ibs-content-80 .ib-title, .ibs-content-80 .ib-text {
  /* not btns! */
  width:80%;
}
.ibs-content-85 .ib-title, .ibs-content-85 .ib-text {
  /* not btns! */
  width:85%;
}
.ibs-content-90 .ib-title, .ibs-content-90 .ib-text {
  /* not btns! */
  width:90%;
}


.ib-title-apart {  
  padding: var(--ds-inner-gap) var(--ds-inner-gap) 0;
}
.ib-title-apart  + div {
  padding-top:0;
}
.ib-title-apart .ib-img {
  height: var(--ds-ratio-size);
  flex: 0 0 auto;
}


.ibs-text-center .ib-text *,
.ibs-text-center .ib-text {
  text-align: center !important;
}

/*_____________ УПРАВЛЯЮЩИЕ КЛАССЫ infobox ____________*/


.ibs-icon-p-0 .ib-icon {
  padding: 0;
  margin:0;
}
.ibs-icon-start  .ib-icon {
  align-items: start;
  justify-content: start;
}
.ibs-icon-center  .ib-icon {
  align-items: center;
  justify-content: center;
}
.ibs-icon-end  .ib-icon {
  align-items: end;
  justify-content: end;
}

/*  прибить иконку в угол */

.ibs-icon-free .ib-icon {
  position: initial;
}
.ibs-icon-free .ib-inner {
  gap:0;
}

.ibs-icon-free .ib-img {
  position: absolute;
  width:auto;
  height:auto; /* перебиваем предыдущие стили */
  max-width: none;
  left:auto;
  bottom:0;
  right:0;
  top:auto;
  --ds-free-offset: 0rem;
  --ds-free-size: calc(var(--ds-ratio-size) + var(--ds-free-offset));
}
.ibs-icon-free.ibs-free-larger .ib-img {
--ds-free-offset: 2rem;
}
.ibs-icon-free.ibs-free-top-left .ib-img{top:0;left:0;right:auto;bottom:auto;transform:none;}
.ibs-icon-free.ibs-free-top-center .ib-img{top:0;left:50%;right:auto;bottom:auto;transform:translate(-50%,0);}
.ibs-icon-free.ibs-free-top-right .ib-img{top:0;right:0;left:auto;bottom:auto;transform:none;}
.ibs-icon-free.ibs-free-center-left .ib-img{top:50%;left:0;right:auto;bottom:auto;transform:translate(0,-50%);}
.ibs-icon-free.ibs-free-center-center .ib-img{top:50%;left:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);}
.ibs-icon-free.ibs-free-center-right .ib-img{top:50%;right:0;left:auto;bottom:auto;transform:translate(0,-50%);}
.ibs-icon-free.ibs-free-bottom-left .ib-img{bottom:0;left:0;right:auto;top:auto;transform:none;
  }
.ibs-icon-free.ibs-free-bottom-center .ib-img{bottom:0;left:50%;right:auto;top:auto;transform:translate(-50%,0);}
.ibs-icon-free.ibs-free-bottom-right .ib-img{bottom:0;right:0;left:auto;top:auto;transform:none;}

.ibs-icon-free.ibs-icon-left .ib-img, .ibs-icon-free.ibs-icon-right .ib-img {
  width:var(--ds-free-size);
}
.ibs-icon-free.ibs-icon-top .ib-img, .ibs-icon-free.ibs-icon-bottom .ib-img {
  height:var(--ds-free-size);
}
/***************  ИКОНКИ ВНИЗ НА МОБИЛЬНОМ ********/

@media (max-width:575.5px) {
  .ibs-sm-icon-down .ib-body {
    height:auto;
  }
  .ibs-sm-icon-down .ib-inner {
    flex-direction: column;
  }
  .ibs-sm-icon-down .ib-icon {
    justify-content: center;
    height:var(--free-icon-bottom-height);
    width:100%;
    order:3;
  }
  .ibs-sm-icon-down .ib-img {
    height:calc(var(--free-icon-bottom-height) + 5px);
    width: auto!important;
    top:auto;
    right:auto;
    left: 50%;
    bottom:0;
    transform: translate(-50%, 0);
  }  
  /* просто все иконки вниз при мобильном */
  .ibs-reset-icon-xs .ib-inner {
    flex-direction: column!important;
  }
}


/*__________ HOVER infoboxES_________________*/
.ibs-hover-box-shadow .ib:hover {
 box-shadow: 0 0 16px 0px #c7c7c7;
}
.ibs-title-uppercase .ib-title {
  text-transform: uppercase;
}
/*___________________ STYLES ______________*/

/*------------ ПУНКТ СВЕРХУ STYLE 2 ------------------ */
.ibs-style-2 .ib {
  overflow: visible;
}
.ibs-style-2  .ib-icon {
    position: absolute;
    background: #f9f9f9;
    top: 0; 
    left: 50%;
    transform: translate(-50%, -50%);
    aspect-ratio: 1!important;
    overflow: hidden;
    border-radius: 50%;
}
.ibs-style-2 .ib {
  padding-top: calc(var(--ds-ratio-size) * 0.55 - var(--ds-inner-gap) + 6px);
}
.ibs-style-2 .ib {
  margin-top: calc(var(--ds-ratio-size) * 0.5);
}
.ibs-style-2 .ib-img {
  width:80%;
  margin: 0 auto;
}
.ibs-style-2 .ib-texticon {
  font-size: 0.75em; /* обманка, уменьшение шрифта в контейнере, только для обернутых/декоративных */
}

@media (max-width:767.5px) {
  /* скролл не должен обрезать верх icon*/
  .ibs-scroll.ibs-style-2 {
    padding-top:2rem;
  }
}


/*______________________ ШРИФТЫ __________________________*/

.ibs-title-gap-0 {
  /* перенесли сюда */
  --ds-between-gap: 3px;
}

.ib-text {
  font-size:  var(--ds-fs-default);
}

.ib-title p {  
  font-size: calc( var(--ds-fs-default) * 1.15);
}
.ibs-text-small, .text-small {
  --ds-fs-default : var(--ds-fs-sm);
}
@media (max-width:575.5px) {
  .ds-cols-2:not(.ibs-scroll), .ds-cols-3:not(.ibs-scroll) {
    --ds-fs-default : var(--ds-fs-xs);
    --ds-ratio-size: 28px;    
    --ds-inner-gap: var(--ds-inner-gap-xs);
    --ds-grid-gap: var(--ds-grid-gap-xs);
  }

   .ds-cols-2:not(.ibs-scroll) .ib-title h4, .ds-cols-3:not(.ibs-scroll) .ib-title h4 {
    font-size: var(--ds-fs-md);
  }
  .ds-cols-2:not(.ibs-scroll) .btn, [type="submit"], .ds-cols-3:not(.ibs-scroll) .btn, [type="submit"] {
    min-width:auto;
    height: auto;
    min-height: auto;
  }

  .ibs-text-mobile-small, .text-mobile-small {
    --ds-fs-default : var(--ds-fs-sm);
    font-size: var(--ds-fs-sm);
  } 

   .ds-cols-3.ibs-inline .ib-icon {
    --ds-ratio-size:25px;
  }
}


/* PRESETS */
.ibs-preset-services .ib {
  min-height: 240px;
} 
.ibs-preset-discount .ib {
  min-height:260px;
}

.ibs-preset-steps .ib-ds-text-light, .ds-steps .ib-addtext {
      align-self: flex-start;
    margin-top: 1rem;
    margin-left: var(--ds-inner-gap);
    width: auto;
    font-size: larger;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background: white;
    border-radius: var(--btn-radius);
    padding: 0.25em 0.5em;
    color: var(--wd-primary-color);
    font-weight: bolder;
    margin-bottom: 0.4rem;
}
.ibs-preset-steps .ib-title, .ds-steps .ib-title {
  margin-bottom:1rem;
}

.ibs-preset-price .ib-title {
  margin-bottom: 1rem;
}
.ibs-preset-price .ib-feature-text {
  font-size: larger;
  font-weight: bolder;
}

.ibs-preset-price .ib-text {
  line-height:1.5;
}

/************************* team ****************/
.ibs-preset-team .ib-body {
    position: absolute;
    bottom: 0;    
    top: auto;
    left:0;
    height: auto;
    padding: var(--ds-inner-gap);
    background: linear-gradient(0deg, #000000b0 35%, transparent);
}


/* классы-дополения для перезаписи предшествующих*/

.ibs-custom-title-decor .ib-title {
	align-items:center;
	gap:0.5rem;
}
.ibs-custom-title-decor .ib-title:before {
	content: '';
	width:0.5rem;
	height:0.5rem;
	background:var(--wd-primary-color);
	border-radius:50%;
}



.ibs-text-large .ib-text {
  font-size: calc(var(--ds-fs-default) * 1.25);;
}

.lh-large * {
  line-height:1.4;
}
.lh-small * {
  line-height: 1.15;
}
.ibs-medium .ib {
  height:auto;
  width:auto;
  min-height:300px;
}
.ibs-high .ib {
  aspect-ratio: 3/4;
}
.ibs-highest .ib {
  aspect-ratio: 2/3;
}

.ibs-transparent .ib-inner {padding: 0;}

.ibs-h-square .ib {  
  aspect-ratio: 1/1;
}
.ibs-h-auto-square .ib {
  height: auto;
}
.ibs-h-height .ib {
  min-height:380px;
}

@media (min-width:576px) {
  .ibs-h-auto-square .ib {    
    aspect-ratio: 1/1;
  }
  
  .ibs-medium .ib {  
    min-height:360px;
  }
}


/* компоненты рядом с sticky колонкой */
.ibs-preset-vertical-features .ib {
  overflow: visible;
  height:300px;
  margin-left:40px;
  margin-bottom: 3rem;
}
.ibs-preset-vertical-features .ib-inner {
  position: absolute;
  top: 40%;
  left: -35px;
  background-color: white;
  width:80%;
  height: auto;
  z-index:4;
}
@media (min-width:575.5px) {
  .ibs-preset-vertical-features .ib {
    margin-bottom: 1rem;
  }
  .ibs-preset-vertical-features .ib-inner {
    width:65%;
  }
}

.ibs-p-0 .ib-inner {
  padding: 0!important
}
.ibs-g-0 {
  gap: 0;
}