@media (max-width: 767px) {
  .header-left {
    display: grid !important;
    grid-template-columns: auto 1fr auto;
    align-items: center;
  }

  .logo-link {
    grid-column: 1;
    justify-self: start;
  }

  .mobile-main-menu-toggle {
    grid-column: 3;
    justify-self: end;
    float: none !important; /* важно: убираем float из темы */
  }
}

/* Hide WALET logo on tablet */
@media (min-width: 768px) and (max-width: 1024px) {
  header .logo-link.logo-text {
    display: none !important;
  }
}

/* 1) фон на видимом слое */
.st-pusher,
.st-content,
.st-content-inner,
.st-sidebar-pusher,
.st-sidebar-content,
.st-sidebar-content-inner {
  background-color: #fbfbfb !important; /* подстраховка */
  background-image: linear-gradient(
    135deg,
    #0f0f10f1 0%,
    #141416 45%,
    #1a1a1deb 70%,
    #202024d7 100%
  ) !important;
}

/* Mobile menu: remove white background blocks */
@media (max-width: 767px) {

  /* сам navbar */
  header.main-header #navbar.navbar,
  header.main-header #navbar.navbar-default {
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  /* раскрытая область меню */
  header.main-header #navbar .navbar-collapse,
  header.main-header #navbar .navbar-collapse.collapse.in,
  header.main-header #navbar .navbar-inner,
  header.main-header #navbar .nav {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
  }

  /* если фон рисуется псевдо-элементами */
  header.main-header #navbar::before,
  header.main-header #navbar::after,
  header.main-header #navbar .navbar-collapse::before,
  header.main-header #navbar .navbar-collapse::after,
  header.main-header #navbar .navbar-inner::before,
  header.main-header #navbar .navbar-inner::after {
    background: transparent !important;
  }
}

/* ===== CTA button glossy + glow hover ===== */

.mgt-button,
.mgt-button.mgt-style-solid,
.mgt-button.mgt-button-style-5 {
  background-color: #F97316 !important;
  background-image:
    linear-gradient(
      188deg,
      rgba(255,255,255,0.55) 0%,
      rgba(255,255,255,0.22) 18%,
      rgba(255,255,255,0.00) 45%
    ),
    linear-gradient(
      220deg,
      #FFB15E 0%,
      #FF9F3F 30%,
      #F97316 65%,
      #E8590C 100%
    ) !important;

  border-color: #E8590C !important;
  color: #FFFFFF !important;

  /* 👇 важное */
  border-radius: 35px !important;      /* скругление */
  transition:
    transform 0.22s ease,
    box-shadow 0.22s ease,
    filter 0.22s ease;
}

/* Hover — glow + scale */
.mgt-button:hover,
.mgt-button.mgt-style-solid:hover,
.mgt-button.mgt-button-style-5:hover {
  transform: scale(1.05);
  filter: brightness(1.05);

  box-shadow:
    0 12px 28px rgba(0,0,0,0.28),
    0 0 0 1px rgba(255,159,63,0.35),
    0 0 22px rgba(255,159,63,0.55);
}

.vc_custom_1495195651350 {
  background:#1d1d20c3 100%
 !important;
}

/* ===== ORANGE HOVER OVERRIDES ===== */

/* Main menu hover */
header.main-header .navbar .nav > li > a:hover,
header.main-header .navbar .nav > li.current-menu-item > a,
header.main-header .navbar .nav > li.current-menu-parent > a {
  color: #3b3631 !important;
}

/* All links hover */
a:hover,
a:focus {
  color: #3b3631 !important;
}
header.main-header .fa-bars:hover {
  color: #3b3631 !important;
}

/* Email link (_cf_email_) — always orange */
a._cf_email_ {
  color: #FF9F3F !important;
  transition: color 0.2s ease;
}

/* Hover / focus — stays orange */
a._cf_email_:hover,
a._cf_email_:focus {
  color: #FF9F3F !important;
}

.mgt-header-block .mgt-header-block-subtitle {
  color: #FFF7EE !important;
}

h2,
.mgt-header-block-title,
.mgt-header-block-title h2 {
  color: #FFF7EE !important;
}

/* Header decorative line — solid orange */
.mgt-header-line {
  background-color: #E8590C !important;
}

.icon-only {
  height: 70px;                 /* держит сетку */
  display: flex;
  align-items: center;          /* вертикальное выравнивание */
  justify-content: center;      /* горизонтальное */
  margin-bottom: 12px;          /* расстояние до текста */
}

.icon-only .custom-icon {
  width: 56px;                  /* идеальный размер */
   transform: scale(5.4); 
  height: auto;
  display: block;
}

@media (max-width: 768px) {
  .vc_row {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .vc_column_container,
  .vc_column-inner {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

h5 {
  color: #ffffff !important;
}
.mgt-icon-box-content {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
}

/* Белый текст меню на телефоне + планшете */
@media (max-width: 1024px) {

  header.main-header #navbar .nav > li > a,
  header.main-header #navbar .nav > li > a.onepage-link,
  header.main-header #navbar .nav > li > a:visited {
    color: #ffffff !important;
    opacity: 1 !important;
  }

  /* бургер/иконка */
  header.main-header .mobile-main-menu-toggle i,
  header.main-header .fa-bars {
    color: #ffffff !important;
  }
}

@media (max-width: 1024px) {

  /* WALET text logo */
  header.main-header a.logo-link.logo-text {
    color: #ffffff !important;
  }

  /* Burger icon (FontAwesome) */
  header.main-header .mobile-main-menu-toggle i.fa-bars,
  header.main-header .mobile-main-menu-toggle i,
  header.main-header i.fa-bars {
    color: #ffffff !important;
  }

}

.mgt-button,
.mgt-button *,
.mgt-button span {
  font-family: 'Inter', sans-serif !important;
}

/* ===== Header menu font fix (Inter) ===== */
header.main-header,
header.main-header .navbar,
header.main-header .navbar .nav > li > a {
  font-family: 'Inter', sans-serif !important;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.wpb_text_column,
.wpb_text_column p,
.wpb_text_column span {
  font-family: 'Inter', sans-serif !important;
}

.wpb_text_column p {
  color: #bfbfbf; /* светло-серый */
}

/* обычное состояние */
.portfolio-info-below a .title,
.portfolio-info-below h4.title {
  color: #FFF7EE !important;
  transition: color 0.25s ease;
}

/* hover */
.portfolio-info-below a:hover .title,
.portfolio-info-below a:focus .title {
  color: #E8590C !important; /* оранжевый */
}

/* Подзаголовок — всегда мягко-белый */
.portfolio-info-below .sub-title {
  color: #bfbfbf !important;
  opacity: 0.75;          /* если нужно чуть тише */
    font-family: 'Inter', sans-serif !important;
  font-weight: 300;              /* тонкий */
}

.project-description {
  color: #bfbfbf45 !important;
  opacity: 0.45;          /* если нужно чуть тише */
    font-family: 'roboto', sans-serif !important;
}

/* Inter для карточек формата обучения */
#services .mgt-promo-block-content,
#services .mgt-promo-block-content h2,
#services .mgt-promo-block-content p,
#services .mgt-promo-block-content span {
    font-family: 'Inter', sans-serif !important;
}

.mgt-header-block-subtitle {
    margin-top: 10px;
}

.price-highlight {
    color: #F97316;
    font-weight: 600;
}

.vc_custom_1495195705909 {
    background-color: #141416 !important;
}

.mgt-flipbox-description {
  font-family: 'Inter', sans-serif !important;
}

.mgt-icon-box {
  margin-bottom: 12px !important;
}

.play.icon img,
.play.icon .icon-img {
  width: 80px;   /* подгони под остальные иконки */
  height: auto;
  margin-bottom: 16px;
}

.vc_separator .vc_sep_line {
  border-color: #E8590C !important;
}

.rev-btn {
  background-color: #000000 !important;
  color: #ffffff !important;
  border-color: #000000 !important;

  transition:
    background-color 0.45s cubic-bezier(0.25, 0.1, 0.25, 1),
    transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1) !important;
}


.rev-btn:hover {
  background-color: #e8590cda !important;
  color: #ffffff !important;
  border-color: #E8590C !important;
}

.walet-title-shadow {
  text-shadow:
    /* чёткий контур */
    0 0 6px rgba(0, 0, 0, 1),
    0 0 4px rgba(0, 0, 0, 1),

    /* основная мягкая тень */
    0 6px 14px rgba(0, 0, 0, 1),
    0 14px 32px rgba(0, 0, 0, 0.9),

    /* очень лёгкое свечение (почти незаметно) */
    0 0 2px rgba(255, 255, 255, 0.08),

    /* лёгкий объём */
    1px 6px 14px rgba(0, 0, 0, 0.6);
}

.tp-mask-wrap {
  overflow: visible !important;
  backface-visibility: visible !important;
  transform: none !important;
}

@media (max-width: 1024px) and (min-width: 768px) {
  .vc_custom_1501270390411 {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}

@media (max-width: 1024px) and (min-width: 768px) {
  .mgt-header-block-subtitle {
    margin-top: 5px !important;
  }
}

/* ===== PORTFOLIO: шире на планшетах (2 колонки) ===== */
@media (max-width: 1024px) and (min-width: 768px) {

  /* контейнер со всеми карточками */
  #portfolio-list-89684162 {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;

    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;

    height: auto !important; /* важно: mixitup иногда фиксит высоту */
  }

  /* каждая карточка */
  #portfolio-list-89684162 .portfolio-item-block {
    width: calc(50% - 24px) !important;
    max-width: calc(50% - 24px) !important;

    margin: 12px !important;
    float: none !important;

    /* главное — прибить то, что ставит JS */
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
  }

  /* если внутри есть .mix — тоже прибиваем */
  #portfolio-list-89684162 .mix {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
  }
}

/* ===== Portfolio images: НЕ резать текст на планшетах и мобиле ===== */
@media (max-width: 1024px) {

  #portfolio-list-89684162 .portfolio-item-image {
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;

    /* ВАЖНО: убираем белые/серые полосы */
    background-color: transparent !important;
  }

  /* если есть затемняющий overlay */
  #portfolio-list-89684162 .portfolio-item-bg {
    background: transparent !important;
  }

}

/* ===== Только секция с hero-media: на планшетах в столбик ===== */
@media (max-width: 1024px) {

  /* меняем направление flex ТОЛЬКО у строки, где есть hero-media */
  .vc_row.vc_row-o-equal-height.vc_row-flex:has(.hero-media) {
    flex-direction: column !important;
  }

  /* и расширяем колонки ТОЛЬКО в этой строке */
  .vc_row.vc_row-o-equal-height.vc_row-flex:has(.hero-media) > .vc_column_container {
    width: 100% !important;
    max-width: 100% !important;
  }

}

/* ===== Мобила: центрируем ТЕКСТ внутри блока "Основа обучения" ===== */
@media (max-width: 767px) {
  .walet-center-mobile,
  .walet-center-mobile * {
    text-align: center !important;
  }
}

@media (max-width: 767px) {
 .text-last{
  padding-left: 10px;
  padding-right: 10px !important;
 }
}

.walet-float-tg{
  opacity: 0.80;
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 99999;

  width: 56px;
  height: 56px;
  border-radius: 50%;

  display: flex;
  align-items: center;
  justify-content: center;

  /* WaLet color */
  background: #E8590C !important;
  border: 1px solid rgba(255,255,255,0.25);


  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);

  transition:
    transform .25s ease,
    box-shadow .25s ease,
    opacity .25s ease;
}

.walet-float-tg:hover{
  transform: translateY(-2px) scale(1.05);
}

.walet-float-tg img{
  width: 26px;
  height: 26px;
  display: block;
  filter: brightness(0) invert(1); /* иконка всегда белая */
}

/* мобильная адаптация */
@media (max-width: 420px){
  .walet-float-tg{
    right: 14px;
    bottom: 14px;
    width: 52px;
    height: 52px;
  }
}

html, body {
  background: #1a1a1d !important;
}

/* =========================
   MOBILE: BIGGER REV BUTTON
   ========================= */
@media (max-width: 768px){

  .rev-btn,
  .tp-caption.rev-btn,
  .tp-caption a{
    
    font-size: 12px !important;
    padding: 12px 40px !important;
    min-height: auto !important;
    
  }

}

/* ======================================
   CENTER PORTFOLIO GRID — TABLET ONLY
   ====================================== */
@media (min-width: 768px) and (max-width: 1024px){

  /* центрируем сам контейнер */
  #portfolio-list-89684162{
    margin-left: auto !important;
    margin-right: auto !important;

    left: auto !important;
    right: auto !important;

    max-width: 900px !important; /* можно 800–1000 если нужно шире */
  }

  /* если родитель его тянет влево */
  #portfolio .vc_column_container{
    display: flex !important;
    justify-content: center !important;
  }

}

/* ======================================
   FIX 400–767px MOBILE CENTERING ISSUE
   ====================================== */
@media (min-width: 401px) and (max-width: 767px){

  #portfolio-list-89684162{
    margin-left: auto !important;
    margin-right: auto !important;
    left: auto !important;
    right: auto !important;

    width: 100% !important;
    max-width: 92% !important; /* вместо фиксированных 520px */
  }

  #portfolio-list-89684162 .portfolio-item-block{
    width: 100% !important;
    max-width: 100% !important;
  }

}