/* course-hosts.css — блок «Семинар ведут» на странице семинара (catalog.element/brand, шаблон main).
   Редизайн 2026-07-16 по макету «Семинар ведут - офлайн»; цвета/шрифты — токены САЙТА
   (Arial; #d86d2c оранж, #292929 текст, #7d7472 muted, #fcfcfc карточка, radius 30 — styles.css).
   Скоуп .course-hosts__* — старые .course-teacher* в styles.css не трогаем.
   Подключается Asset-ом из template.php компонента. История — course-hosts.css.md. */

.course-hosts-sect{ margin-bottom:56px; }

.course-hosts{
	background:#fcfcfc;
	border-radius:30px;
	padding:48px 48px 40px;
	box-shadow:0 24px 60px -30px rgba(41,41,41,.18);
}

/* бейдж-пилюля с датой */
.course-hosts__date{
	display:inline-flex; align-items:center; gap:10px;
	background:#d86d2c; color:#fcfcfc;
	padding:10px 20px 10px 16px; border-radius:100px;
	font-size:16px; font-weight:600; letter-spacing:.01em;
}
.course-hosts__date svg{ display:block; }

/* заголовок + счётчик */
.course-hosts__head{
	display:flex; align-items:baseline; flex-wrap:wrap; gap:8px 20px;
	margin:22px 0 0;
}
.course-hosts__head .h2{ margin:0; }
.course-hosts__count{ font-size:17px; font-weight:600; color:#7d7472; }
.course-hosts__rule{
	width:56px; height:4px; background:#d86d2c; border-radius:4px; margin-top:18px;
}

/* список спикеров */
.course-hosts__list{ margin-top:36px; display:flex; flex-direction:column; }
.course-hosts__item{
	display:flex; gap:36px; align-items:flex-start;
	padding:34px 0; border-top:1px solid #ece7e1;
}
.course-hosts__media{
	flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:14px;
}
.course-hosts__photo{
	position:relative; width:168px; height:200px; border-radius:20px;
	overflow:hidden; background:#efebe6;
}
.course-hosts__photo img{
	width:100%; height:100%; object-fit:cover; display:block;
}
.course-hosts__num{
	font-size:13px; font-weight:700; color:#c9bfb4; letter-spacing:.14em;
}
.course-hosts__body{ flex:1 1 auto; min-width:0; padding-top:4px; }
.course-hosts__name{
	margin:0 0 8px; font-size:28px; line-height:1.1; font-weight:700; color:#292929;
}
.course-hosts__role{
	margin:0 0 16px; font-size:14px; font-weight:700; color:#d86d2c;
	text-transform:uppercase; letter-spacing:.06em;
}
.course-hosts__bio{
	margin:0 0 18px; font-size:16px; line-height:1.55; color:#292929; max-width:640px;
}
.course-hosts__bio p{ margin:0 0 12px; }
.course-hosts__bio p:last-child{ margin-bottom:0; }
.course-hosts__more{
	display:inline-flex; align-items:center; gap:9px;
	font-size:16px; font-weight:600; color:#d86d2c; text-decoration:none;
}
.course-hosts__more:hover{ color:#b7530c; }
.course-hosts__more-ic{
	display:inline-flex; width:26px; height:26px; align-items:center; justify-content:center;
	border-radius:50%; background:#f8e9dd; flex:0 0 auto;
}

/* единый CTA внизу */
.course-hosts__cta{
	margin-top:36px; padding-top:32px; border-top:1px solid #ece7e1;
	display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px;
}
.course-hosts__start{ font-size:16px; color:#7d7472; }
.course-hosts__start span{ color:#292929; font-weight:600; }
.course-hosts__enroll{
	display:inline-flex; align-items:center; gap:14px;
	background:#d86d2c; color:#fcfcfc; border:1px solid #d86d2c; cursor:pointer;
	font-family:Arial, sans-serif; font-size:18px; font-weight:700;
	padding:16px 28px; border-radius:100px;
	box-shadow:0 14px 30px -12px rgba(216,109,44,.6);
	transition:all .3s ease-in-out; text-decoration:none;
}
.course-hosts__enroll:hover{
	background:#c95c0e; border-color:#c95c0e;
	transform:translateY(-2px); box-shadow:0 18px 36px -12px rgba(216,109,44,.65);
}
.course-hosts__enroll-ic{
	display:inline-flex; width:32px; height:32px; align-items:center; justify-content:center;
	border-radius:50%; background:rgba(252,252,252,.22); flex:0 0 auto;
}

/* адаптив */
@media (max-width:991px){
	.course-hosts{ padding:32px 24px 28px; }
	.course-hosts__name{ font-size:24px; }
}
@media (max-width:767px){
	.course-hosts{ padding:24px 16px; border-radius:24px; }
	.course-hosts__item{ flex-direction:column; gap:18px; padding:26px 0; }
	.course-hosts__media{ flex-direction:row; align-items:flex-end; gap:12px; }
	.course-hosts__photo{ width:140px; height:166px; }
	.course-hosts__cta{ flex-direction:column; align-items:stretch; text-align:center; }
	.course-hosts__enroll{ justify-content:center; }
}