/* ============================================================
   procourse3_extract.css
   Стили страницы «Профессиональное обучение / Курс Divemaster»
   (resource id=2892, alias=professionalnoe-obuchenie под /training/)
   Грузится по условию в head_home.tpl ВМЕСТЕ с procourse_extract.css
   (последний даёт утилиты pb-X mb-X и .card-blue / .bg-blue-block)
   ============================================================ */

/* ===== Общие колонки / изображение / утилиты ===== */
.col-50{width:calc(50% - 10px)}
.col-100{width:100%}

.bold{font-weight:600}
.max-590{max-width:590px}

.bordered-img{
  border-radius:10px;
  overflow:hidden;
  height:100%;
}
.bordered-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.bg-white-block{
  background:#fff;
  padding:20px;
  border-radius:10px;
}

/* hide-* утилиты (десктоп — показывает только desktop-блоки) */
.hide-desktop{display:none !important}

/* ===== Хиро ===== */
.procourse-3-banner{
  background-image:url(../img/procourse3/1.webp);
  background-position:center 40%;
  background-size:cover;
  background-repeat:no-repeat;
  height:650px;
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
}
.procourse-3-banner .main-banner__header{max-width:590px}
.procourse-3-banner .container{width:100%}
.procourse-3-banner h2{margin-bottom:10px}
.procourse-3-banner h3{margin-bottom:10px}

/* ===== B1 ===== */
.procourse-3-b1{
  margin-top:60px;
  margin-bottom:100px;
}

/* ===== B2 ===== */
.procourse-3-b2{margin-bottom:100px}
.procourse-3-b2__block{
  background:var(--color-light-blue);
  padding:20px;
  border-radius:10px;
  height:100%;
}

/* ===== B3 ===== */
.procourse-3-b3{margin-bottom:100px}
.procourse-3-b3__inner{
  display:flex;
  flex-wrap:wrap;
  gap:20px;
}
.procourse-3-b3__left{width:calc(32.75% - 10px)}
.procourse-3-b3__right{width:calc(67.25% - 10px)}

/* ===== B4 ===== */
.procourse-3-b4{
  background:var(--color-light-blue);
  padding:100px 0;
}
.procourse-3-b4__header{
  display:flex;
  gap:20px;
}
.procourse-3-b4__header-left{max-width:900px}

.procourse-3-b4__block-1{
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  margin-bottom:60px;
}
.procourse-3-b4__block-1-left{width:calc(67.83% - 10px)}
.procourse-3-b4__block-1-right{width:calc(32.17% - 10px)}

.procourse-3-b4__block-2{
  display:flex;
  flex-wrap:wrap;
  gap:20px;
}
.procourse-3-b4__block-2-left{width:calc(32.17% - 10px)}
.procourse-3-b4__block-2-right{width:calc(67.83% - 10px)}
.procourse-3-b4__block-2 > .row{width:100%}
.procourse-3-b4__block-2 > .row .bg-white-block{height:100%}

.procourse-3-b4__block-2-bottom-col{
  display:flex;
  gap:20px;
  flex-wrap:wrap;
  width:100%;
}

/* ===== Адаптив: планшет (≤1279px) ===== */
@media (max-width:1279px){
  .hide-desktop{display:block !important}
  .hide-tablet{display:none !important}

  .procourse-3-b3__left{
    width:calc(50% - 10px);
  }
  .procourse-3-b3__left img{object-position:center 30%}

  .procourse-3-b3__right{
    width:calc(50% - 10px);
  }
  .procourse-3-b3__right .col-50{width:100%}
  .procourse-3-b3__right h2{font-size:32px}

  .procourse-3-b4__header{
    margin-bottom:40px;
    min-height:380px;
  }
  .procourse-3-b4__header-left{
    width:calc(50% - 10px);
    max-width:none;
  }
  .procourse-3-b4__header-left h2{font-size:32px}
  .procourse-3-b4__header-left .mb-50{margin-bottom:0}
  .procourse-3-b4__header-right{width:calc(50% - 10px)}
  .procourse-3-b4__header-right img{object-position:center 40%}

  .procourse-3-b4__block-1-left{width:100%}
  .procourse-3-b4__block-2-right{width:100%}

  .procourse-3-b4__block-2-bottom-col{
    width:calc(50% - 10px);
  }
  .procourse-3-b4__block-2-bottom-col .col-50{width:100%}
  .procourse-3-b4__block-2-bottom-col img{object-position:center 20%}
}

/* ===== Адаптив: мобилка (≤799px) ===== */
@media (max-width:799px){
  .hide-mobile{display:none !important}

  /* Хиро: опускаем текст в нижнюю половину (как в prokurs2) */
  .procourse-3-banner{
    height:600px;
    align-items:flex-end;
    padding-bottom:40px;
  }

  .procourse-3-b1__inner .col-50{width:100%}
  .procourse-3-b1__inner .bordered-img{height:300px}

  .procourse-3-b2__inner .col-50{width:100%}

  .procourse-3-b3__left{
    width:100%;
    height:380px;
  }
  .procourse-3-b3__left img{object-position:center 20%}
  .procourse-3-b3__right{width:100%}
  .procourse-3-b3-mob .col-50{width:100%}

  .procourse-3-b4__header{flex-wrap:wrap}
  .procourse-3-b4__header-left{width:100%}
  .procourse-3-b4__header-right{
    width:100%;
    height:300px;
  }
  .procourse-3-b4__header-right img{object-position:center 30%}

  .procourse-3-b4__block-1-left .col-50{width:100%}
  .procourse-3-b4__block-1-left .row{gap:0}

  .procourse-3-b4__block-2 .procourse-3-b4__block-2-bottom-col{
    width:100%;
  }
  .procourse-3-b4__block-2 .procourse-3-b4__block-2-bottom-col .bordered-img{height:300px}
  .procourse-3-b4__block-2-right .col-50{width:100%}
}