

/* Start:/local/templates/vine/template_styles.css?17823245356504*/
/* Vine prototype — собрано из вёрстки "html прототип" (header/footer/banner/catalog) */
:root{
	--color-text:#000;--color-link:#0077FF;--color-badge:#FFFF00;
	--color-placeholder:#C4C4C4;--color-grey:#777;--color-silver:#C4C4C4;
	--color-btn:#151515;--color-bg:#FFF;
}
*{box-sizing:border-box}
body{font-family:"Roboto",system-ui,sans-serif;color:var(--color-text);background:#f0f0f0;margin:0}

/* ШАПКА */
.header{max-width:1280px;margin:24px auto 0;padding:18px 16px;background:#fff}
.header__row{display:flex;align-items:center;gap:32px}
.burger{display:flex;padding:8px 5px 6px;background:none;border:none;cursor:pointer;flex-shrink:0}
.burger img{width:24px;height:24px}
.header__logo{font-size:18px;font-weight:700;color:var(--color-text);text-decoration:none;white-space:nowrap}
.header__link{font-size:14px;font-weight:400;color:var(--color-link);text-decoration:underline;white-space:nowrap}
.header__nav{display:flex;align-items:center;gap:32px}
.search{flex:1;display:flex;align-items:center;gap:8px;height:32px;padding:0 4px 0 8px;border:1px solid var(--color-text);background:#fff}
.search__input{flex:1;border:none;outline:none;background:none;font-family:inherit;font-size:16px;color:var(--color-text)}
.search__input::placeholder{color:var(--color-placeholder)}
.search__btn{border:none;background:none;padding:0;cursor:pointer;display:flex}
.search__icon{width:24px;height:24px;flex-shrink:0}
.header__cart{display:flex;flex-shrink:0}
.header__cart img{width:24px;height:24px}
.header__auth{display:flex;align-items:center;gap:8px}

/* КОНТЕНТ */
.page-content{max-width:1248px;margin:24px auto;padding:16px;background:#fff;min-height:200px}
.page-content h1,.page-content h2{margin:0 0 16px}
.page-content p{margin:0 0 12px}

/* БАННЕР (главная) */
.banner{position:relative;width:100%;max-width:1248px;margin:0 auto 24px}
.banner__bg{display:block;width:100%;height:523.85px;object-fit:cover}
.banner__panel{position:absolute;left:0;bottom:0;width:100%;display:flex;flex-direction:column;gap:8px;padding:8px 16px 16px;background:rgba(255,255,255,.8)}
.banner__title{font-size:24px;font-weight:400;margin:0}
.banner__tags{display:flex;align-items:center;gap:8px}
.banner__desc{font-size:18px;font-weight:400;margin:0}
.banner__link{font-size:18px;color:var(--color-link);text-decoration:underline}
.tag{font-size:14px;font-style:italic;font-weight:400}
.tag--badge{padding:4px;background:var(--color-badge);border:1px solid var(--color-text);border-radius:4px;font-style:normal}
.banner__bg-link{display:block}
.banner__title-link,.card__title-link{color:inherit;text-decoration:none}
.banner__title-link:hover,.card__title-link:hover{text-decoration:underline}

/* КАРТОЧКИ КАТАЛОГА (вёрстка) */
.cards{display:flex;flex-direction:column;gap:16px}
.card{display:flex;gap:16px}
.card__img{width:152px;height:152px;flex-shrink:0;object-fit:cover}
.card__body{display:flex;flex-direction:column;gap:8px}
.card__title{font-size:24px;font-weight:400;margin:0}
.card__text{font-size:18px;margin:0}
.card__link{font-size:18px;color:var(--color-link);text-decoration:underline}
.card__actions{display:flex;align-items:center;gap:16px;margin-top:4px;flex-wrap:wrap}
.divider{border:none;border-top:1px solid var(--color-silver);margin:8px 0}

/* ПОДВАЛ */
.footer{max-width:1280px;margin:24px auto;display:flex;flex-direction:column;gap:16px;padding:40px 16px 13px;background:#fff}
.footer__divider{border:none;border-top:1px solid var(--color-silver);margin:8px 0}
.footer__cols{display:flex;gap:8px}
.footer__col{flex:1;display:flex;flex-direction:column;gap:8px}
.footer__head{font-size:10px;font-weight:700;color:#000;margin:0}
.footer__link{font-size:10px;font-weight:400;color:var(--color-link);text-decoration:underline}
.footer__text{font-size:10px;color:#000}
.footer__hotline{display:flex;gap:2px}
.footer__social{display:flex;gap:8px}
.footer__social img{width:24px;height:24px}
.footer__field{display:flex;align-items:center;height:32px;padding:0 8px;border:1px solid #000}
.footer__field input{width:100%;border:none;outline:none;background:none;font-family:inherit;font-size:14px}
.footer__field input::placeholder{color:var(--color-silver)}
.footer__note{font-size:10px;font-style:italic;color:var(--color-grey);margin:0}
.footer__submit{align-self:flex-start;padding:4px 8px;border:1px solid #000;border-radius:5px;background:var(--color-btn);font-family:inherit;font-size:14px;color:#fff;cursor:pointer}
.footer__legal{display:flex;gap:32px;font-size:10px;font-weight:700;color:var(--color-grey);flex-wrap:wrap}

/* ДЕТАЛЬНАЯ КУРСА */
.course-hero{position:relative;max-width:1248px;margin:0 auto 24px}
.course-hero__img{display:block;width:100%;height:420px;object-fit:cover}
.course-hero__panel{position:absolute;left:0;bottom:0;width:100%;display:flex;flex-direction:column;gap:8px;padding:12px 16px 16px;background:rgba(255,255,255,.85)}
.course-hero__title{font-size:24px;font-weight:400;margin:0}
.course-hero__price{font-size:24px;font-weight:700;margin:0}
.btn{display:inline-flex;justify-content:center;align-items:center;gap:10px;padding:9px 14px 10px;border:1px solid #000;border-radius:5px;font-family:inherit;font-size:18px;cursor:pointer;text-decoration:none}
.btn--primary{align-self:flex-start;background:var(--color-btn);color:#fff}
.course-desc{max-width:1248px;margin:0 auto;font-size:18px;line-height:1.5}
.course-desc p{margin:0 0 12px}

@media(max-width:768px){
	.banner__bg{height:auto}
	.banner__panel{position:static;width:100%}
	.header__row{flex-wrap:wrap;gap:16px}
	.footer__cols{flex-wrap:wrap}
	.footer__col{flex:1 1 45%}
	.course-hero__img{height:auto}
	.course-hero__panel{position:static;width:100%}
}

/* Кнопки sale-компонентов (корзина/оформление) — тёмные вместо ярко-синих */
.btn-primary,
.basket-btn-checkout,
.basket-coupon-block-coupon-btn,
.basket-item-amount-btn-plus,
.basket-item-amount-btn-minus{
	background-color:#151515 !important;
	border-color:#151515 !important;
	color:#fff !important;
}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active,
.basket-btn-checkout:hover,.basket-btn-checkout:focus{
	background-color:#000 !important;
	border-color:#000 !important;
	color:#fff !important;
}
/* синие текстовые ссылки-кнопки в оформлении (изменить и т.п.) — приглушить */
.btn-link{color:#151515 !important;}

/* End */
/* /local/templates/vine/template_styles.css?17823245356504 */
