/* ================================================================
   Mentors (archive-mentor) styles
   ================================================================ */

/* ---------- HERO ------------------------------------------------ */
.mentors-hero{
  position:relative;
  overflow:hidden;
  background:#020202;
  isolation:isolate;
}

/* Сцена фиксированных пропорций 1440×800 по центру */
.mentors-hero__stage{
  position:relative;
  width:min(1440px,100%);
  margin:0 auto;
  aspect-ratio:1440/800;
  z-index:0;
  pointer-events:none;
}

/* Два фоновых слоя из CSS-переменных:
   style="--rect1:url(...); --rect2:url(...)" */
.mh-img{
  position:absolute; inset:0;
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
  z-index:0;
}
.mh-img--1{ background-image:var(--rect1); opacity:.25; }
.mh-img--2{
  background-image:var(--rect2);
  filter:blur(50px);
  transform:scale(1.06);       /* чтобы не было видимых краёв блюра */
  opacity:.9;
}

/* Декоративные свечения */
.mh-glow{
  position:absolute;
  border-radius:9999px;
  filter:blur(125px);
  mix-blend-mode:screen;
  pointer-events:none;
  z-index:1;
}
.mh-glow--violet{
  width:774px; height:817px;
  left:56%; top:34%;
  translate:-50% -50%;
  opacity:.47;
  background:radial-gradient(ellipse at center, rgba(186,41,255,.7) 0%, rgba(186,41,255,0) 99%);
}
.mh-glow--cyan{
  width:1042px; height:919px;
  left:110%; top:-120px;
  rotate:153deg;
  opacity:.5;
  background:linear-gradient(70deg, rgba(0,219,222,.3) 0%, rgba(252,0,255,.3) 100%);
  filter:blur(218px);
}

/* Виньетки сверху/снизу */
.mh-fade{
  position:absolute; left:0; right:0; height:280px;
  background:linear-gradient(180deg, rgba(2,2,2,0) 0%, #020202 100%);
  z-index:2;
}
.mh-fade--top{ top:0; transform:scaleY(-1); }
.mh-fade--bottom{ bottom:0; }

/* Контент поверх фона — строго по центру */
.mentors-hero__inner{
  position:absolute; inset:0;
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  gap:24px; text-align:center;
  padding:0 24px;
  z-index:3;
}
.mentors-hero__title{
  margin:0;
  color:#fff;
  font:600 clamp(32px,5vw,64px)/1.3 "Montserrat", system-ui;
}
.mentors-chips{ margin-top:24px; }

/* ---------- FILTER CHIPS --------------------------------------- */
.mentors-filters{ padding:40px 0 10px; }
.chips{ display:flex; flex-wrap:wrap; gap:16px; justify-content:center; }

.chip{
  display:inline-flex; align-items:center; justify-content:center;
  height:42px; padding:9px 26px; border-radius:24px;
  color:#fff; text-decoration:none;
  font:500 16px/1.4 "Montserrat", system-ui;
  outline:1px #8400FF solid; outline-offset:-1px;
  background:rgba(132,0,255,.25);
  transition:filter .15s ease, transform .1s ease, background .15s ease, box-shadow .15s ease;
}
.chip--solid{
  background:radial-gradient(97.54% 50.91% at 50% 2.46%, #A052FF 0%, #7300FF 100%);
  box-shadow:0 4px 10px rgba(114,0,255,.2);
}
.chip--active{ box-shadow:0 0 0 2px rgba(255,255,255,.15) inset; }
.chip:hover{ filter:brightness(1.05); }
.chip:active{ transform:translateY(1px); }

/* ---------- GRID ------------------------------------------------ */
.mentors-grid-wrap{ padding:40px 0 80px; }
.mentors-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
	        margin-bottom: 80px;
}

/* ---------- CARD ------------------------------------------------ */
.mentor{
  position:relative;
  padding:24px;
  border-radius:30px;
  overflow:hidden;
  background:linear-gradient(314deg, #2C077B 0%, #C2750A 100%);
  -webkit-backdrop-filter:blur(50px);
  backdrop-filter:blur(50px);
}
.mentor:nth-child(6n+2),
.mentor:nth-child(6n+5){
  background:linear-gradient(138deg, #2C077B 0%, #C2750A 100%);
}

.mentor__photo img{
  width:100%; height:294px; object-fit:cover;
  border-radius:24px; display:block;
}

.mentor__meta{ margin-top:16px; display:flex; flex-direction:column; gap:8px; }
.mentor__role{ color:#fff; opacity:.9; font:400 14px/1.4 "Montserrat", system-ui; }

.mentor__name{
  color:#fff; font:500 24px/1.2 "Montserrat", system-ui;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.mentor__name::after{
  content:""; flex:0 0 37px; height:37px;
  border-radius:28px; outline:1px solid #fff; outline-offset:-1px;
}

.mentor__meta::before{
  content:""; display:block; width:100%; height:1px; margin:12px 0 0;
  background:rgba(255,255,255,.4);
  border-radius:1px;
}

.mentor__excerpt{ color:#E8E8E8; font:500 16px/1.4 "Montserrat", system-ui; opacity:.8; }
.mentor__excerpt p{ margin:0; }

/* Ссылка-оверлей (есть в разметке) */
.mentor .mentor__link{ position:absolute; inset:0; z-index:5; }

/* ---------- RESPONSIVE (archive) -------------------------------- */
@media (max-width:1200px){
  .mentors-grid{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:900px){
  .mh-img--2{ filter:blur(30px); }
  .mh-glow--violet{ width:520px; height:560px; }
}
@media (max-width:760px){
  .mentors-grid{ grid-template-columns:1fr; }
  .chips{ gap:12px; }
  .chip{ height:40px; padding:8px 20px; }
}

/* ---------- SINGLE MENTOR -------------------------------------- */
.mentor-hero{position:relative;padding:80px 0}
.mentor-hero__bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(.85)}
.mentor-hero__inner{position:relative;display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center}
.mentor-about__grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:40px;align-items:start}
.mentor-about__card{background:rgba(18,19,20,.4);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:16px}
.approach__grid,.rec__grid,.formats__grid,.mt-grid{display:grid;gap:24px}
.approach__grid{grid-template-columns:repeat(4,1fr)}
.rec__grid{grid-template-columns:repeat(3,1fr)}
.formats__grid{grid-template-columns:repeat(2,1fr)}
.mt-grid{grid-template-columns:1fr}
.faq details{border:1px solid rgba(255,255,255,.2);border-radius:16px;padding:16px}

@media (max-width:992px){
  .mentor-hero__inner,.mentor-about__grid{grid-template-columns:1fr}
  .approach__grid{grid-template-columns:1fr 1fr}
  .rec__grid{grid-template-columns:1fr}
  .formats__grid{grid-template-columns:1fr}
}

/* ====== «Мій досвід і визнання» — КАРУСЕЛЬ з фільтрами ====== */
.ms-rec{
  width:1200px;
  margin:70px auto 0;
  display:flex; flex-direction:column; gap:40px; align-items:center
}
.ms-rec__title{
  margin:0; text-align:center; color:#fff;
  font:600 48px/62.4px Montserrat
}

/* Чипсы-фильтры */
.ms-rec__chips{
  display:flex; gap:16px; align-items:center; flex-wrap:wrap
}
.ms-rec__chips button{cursor:pointer}
.ms-rec__chips .chip-violet,
.ms-rec__chips .chip-violet-weak{
  padding:9px 26px; border-radius:24px;
  outline:1px #8400FF solid; outline-offset:-1px;
  font:500 16px/1.4 Montserrat; color:#fff
}
.ms-rec__chips .chip-violet[aria-selected="true"]{
  background:#6900C9; box-shadow:0 4px 10px rgba(114,0,255,.20)
}
.ms-rec__chips .chip-violet-weak{background:rgba(132,0,255,.25)}
.ms-rec__chips .chip-violet-weak[aria-selected="true"]{background:#6900C9}
.ms-rec__chips .chip-disabled{opacity:.45; pointer-events:none}

/* Обёртка + кнопки */
.ms-rec__wrap{display:flex; gap:20px; align-items:center; width:100%}


.ms-rec__btn[disabled]{opacity:.4; pointer-events:none}

.ms-rec__viewport{
  flex:1 1 auto; overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  width:100%;
}
.ms-rec__viewport::-webkit-scrollbar{display:none}

.ms-rec__track{
  display:flex;            /* ← добавить */
  gap:24px;
  align-items:stretch;
  box-sizing:content-box;
}

.ms-rec-card[hidden]{display:none !important}

/* Картинка снизу */
.ms-rec-card__img{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover;
  border-radius:35px; z-index:0
}

/* Прозрачный оверлей поверх (текст читаем, картинка видна) */
.ms-rec-card__overlay{
  position:absolute; inset:0;
  padding:150px 24px 43px;
  border-radius:30px;
  outline:1px solid rgba(194,126,33,0.10); outline-offset:-1px;
  display:flex; flex-direction:column; justify-content:flex-end; gap:72px;
  z-index:1;
  background:
    linear-gradient(0deg, rgba(251,217,105,0.02) 0%, rgba(251,217,105,0.02) 100%),
    linear-gradient(135deg, rgba(41,41,41,.55) 0%, rgba(20,20,20,.55) 100%);
  -webkit-backdrop-filter: blur(2.5px);
  backdrop-filter: blur(2.5px);
}

.ms-rec-card__row{display:flex; justify-content:space-between; align-items:center}
.ms-rec-card__title{margin:0; color:#ECE8E1; font:600 18px/1 Montserrat}
.ms-rec-card__icon{
  width:32px; height:32px; border-radius:28px;
  outline:1px #848484 solid; outline-offset:-1px;
  display:flex; align-items:center; justify-content:center
}
.ms-rec-card__icon::after{
  content:""; width:10px; height:10px;
  border:1.5px solid #fff; transform:rotate(45deg); display:block
}

/* Респонсив (карусель) */
@media (max-width:1260px){
  .ms-rec{width:100%; max-width:1200px; padding-left:20px; padding-right:20px}
}
