/* ═══════════ Страница курсов ═══════════ */

/* Активный пункт меню */
.nav a.active{color:var(--pink-dark)}
.nav a.active::after{width:100%}

/* ── Сетка курсов: 3 в ряд на десктопе ── */
.courses{padding:80px 0 60px;background:var(--bg)}
.courses__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:34px}

/* Карточка: фото сверху, контент снизу */
.course-card{
  background:#fbf8f3;border:1px solid #eee4da;border-radius:12px;padding:22px;
  display:flex;flex-direction:column;gap:16px;transition:.35s;
}
.course-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#e9d2ca}

.course-photo{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:4/3}
.course-photo img{transition:.5s}
.course-card:hover .course-photo img{transform:scale(1.05)}
.course__brush{position:absolute;left:-10px;right:-10px;bottom:-10px;transform:rotate(-3deg);padding:18px 24px}
.course__brush .brush__text{font-size:18px}

.course-body{display:flex;flex-direction:column;flex:1}

.course-badge{
  display:inline-block;align-self:flex-start;
  font-size:10.5px;font-weight:500;letter-spacing:.06em;
  color:var(--pink-dark);border:1px solid #e8b6ba;border-radius:999px;
  padding:5px 14px;background:#fdf6f5;margin-bottom:10px;
}
.course-body h3{font-size:19px;line-height:1.35;margin-bottom:8px}
.course-desc{font-size:12.5px;color:#57504a;margin-bottom:12px}
.course-feats{margin-bottom:4px}
.course-feats li{display:flex;align-items:center;gap:10px;font-size:12.5px;color:#4c463f;margin-bottom:8px}
.icon--pink{color:var(--rose);width:16px;height:16px;flex:none}

/* ── Цена курса ── */
.course-price{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:12px 16px;margin:12px 0 16px;
  background:linear-gradient(135deg,#fdf6f5 0%,#f9e6e3 100%);
  border:1px solid #f0d0cc;border-radius:10px;
}
.course-price__label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:500}
.course-price__value{font-family:var(--serif);font-size:21px;font-weight:600;color:var(--pink-dark);line-height:1}

/* ── Кнопки карточки (прижаты к низу, во всю ширину) ── */
.course-actions{display:flex;flex-direction:column;gap:10px;margin-top:auto}
.course-actions .btn{width:100%}
.course-toggle{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;
  padding:11px 18px;border-radius:999px;
  border:1px solid var(--pink);background:transparent;
  color:var(--pink-dark);font-family:var(--sans);font-size:12px;font-weight:500;
  cursor:pointer;transition:.3s;
}
.course-toggle:hover{background:var(--pink-light)}
.course-toggle__icon{width:14px;height:14px;transition:transform .3s}
.course-toggle.open .course-toggle__icon{transform:rotate(90deg)}

/* ── Сворачивание описания ── */
.course-more{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s ease}
.course-more__inner{overflow:hidden}
.course-card.open .course-more{grid-template-rows:1fr}
.course-card.open .course-more__inner{padding-top:2px;margin-bottom:6px}

/* ── Почему выбирают нас ── */
.why{position:relative;padding:60px 0 90px;background:var(--bg);overflow:hidden}
.why__heart{position:absolute;top:40px;right:6%;width:56px;height:52px;opacity:.6;transform:rotate(12deg)}
.why__grid{display:grid;grid-template-columns:320px 1fr;gap:50px;align-items:center}
.why__brush .brush{transform:rotate(-5deg);padding:42px 52px}
.why__brush .brush__text{font-size:30px}
.why__main h3{text-align:center;font-size:26px;margin-bottom:38px}
.why__items{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;max-width:780px;margin:0 auto}
.why__items li{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;font-size:12.5px;line-height:1.5;color:#4c463f}
.why__items .icon{width:34px;height:34px;color:#3b3630}

/* ── Адаптив ── */
@media (max-width:1100px){
  .courses__grid{grid-template-columns:repeat(2,1fr)}   /* планшет: 2 в ряд */
  .why__grid{grid-template-columns:1fr;gap:30px}
  .why__brush{display:flex;justify-content:center}
}
@media (max-width:640px){
  .courses__grid{grid-template-columns:1fr}             /* телефон: 1 в ряд */
  .why__items{grid-template-columns:repeat(2,1fr)}
}