/* wave1 partial: gw1-tail */

/* ============================================================
   Гайд-баннер «Гайд по SarafanPRO» — Figma 729:30141 Video
   1180×600, r=6
   Layer1: linear-gradient #000f37 → #0066b2
   Layer2: image FILL @ opacity 0.4
   Title 38 white · subtitle 25 white · play 90×90 solid white
   (раньше: 300h / r22 / light overlay → «маленький и бледный»)
   ============================================================ */
body .fg .guide {
	padding: 0 0 60px;
}
body .fg .guide__box {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100%;
	max-width: 1180px;
	height: 600px !important;
	min-height: 600px !important;
	box-sizing: border-box;
	/* kill inline bg from home.tpl — base is Figma vertical gradient */
	background-image: none !important;
	background: linear-gradient(180deg, #000f37 0%, #0066b2 100%) !important;
	border-radius: 6px !important;
	text-align: center;
	padding: 40px 24px !important;
	position: relative;
	overflow: hidden;
}
/* image layer @ 40% (Figma IMAGE fill op=0.4) — no CSS filters */
body .fg .guide__box::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background: url("/_html/images/figma2/guide.jpg") center / cover no-repeat;
	opacity: 0.4;
	filter: none;
	pointer-events: none;
}
/* kill figma-home light rgba overlay — gradient+image is the design */
body .fg .guide__box::before {
	content: none !important;
	display: none !important;
	background: none !important;
}
body .fg .guide__t,
body .fg .guide__s,
body .fg .guide__play {
	position: relative;
	z-index: 2;
}
body .fg .guide__t {
	color: #fff !important;
	font-size: 38px !important;
	line-height: 45px !important;
	font-weight: 400 !important;
	margin: 0 0 8px !important;
}
body .fg .guide__s {
	color: #fff !important;
	font-size: 25px !important;
	line-height: 30px !important;
	font-weight: 400 !important;
	margin: 0 !important;
	opacity: 1;
}
body .fg .guide__play {
	margin-top: 28px !important;
	width: 90px !important;
	height: 90px !important;
	min-width: 90px;
	min-height: 90px;
	border-radius: 50% !important;
	background: #fff !important;
	color: #000f37 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	box-shadow: none !important;
}
body .fg .guide__play svg {
	width: 36px !important;
	height: 36px !important;
	margin-left: 4px; /* optical center of triangle */
}
body .fg .guide__box:hover .guide__play {
	background: #fff !important;
}

/* mobile / tablet: keep aspect, shrink type & play */
@media (max-width: 900px) {
	body .fg .guide__box {
		height: auto !important;
		min-height: 0 !important;
		aspect-ratio: 1180 / 600;
		padding: 28px 16px !important;
	}
	body .fg .guide__t {
		font-size: 28px !important;
		line-height: 34px !important;
	}
	body .fg .guide__s {
		font-size: 18px !important;
		line-height: 24px !important;
	}
	body .fg .guide__play {
		width: 72px !important;
		height: 72px !important;
		min-width: 72px;
		min-height: 72px;
		margin-top: 20px !important;
	}
	body .fg .guide__play svg {
		width: 28px !important;
		height: 28px !important;
	}
}
@media (max-width: 600px) {
	body .fg .guide__t {
		font-size: 24px !important;
		line-height: 30px !important;
	}
	body .fg .guide__s {
		font-size: 16px !important;
		line-height: 22px !important;
	}
	body .fg .guide__play {
		width: 64px !important;
		height: 64px !important;
		min-width: 64px;
		min-height: 64px;
	}
}

/* ============================================================
   Футер «Специалисты» — Figma 729:29206 Spec
   Group1/2 itemSpacing=8; button body pad top/bottom=6, fs=16 lh=21.6
   → каждый пункт ≈34px + gap 8 (раньше mb=10 + lh 1.3 ≈ слишком плотно).
   ============================================================ */
/* Spec Group1/2: itemSpacing=8; each Button body pad 6/6 → visual pitch ~34+8.
   Also kill any theme li {margin:0} / a {line-height:1.2} that made items «слиться». */
body .fg .ftr__col--spec .ftr__two,
body .fg .ftr__col--spec .ftr__list {
	row-gap: 0 !important;
}
body .fg .ftr__col--spec .ftr__two li,
body .fg .ftr__col--spec .ftr__list li {
	margin: 0 0 8px !important;
	padding: 0 !important;
	line-height: 0 !important; /* gap only from <a> pad + mb */
}
body .fg .ftr__col--spec .ftr__two li:last-child,
body .fg .ftr__col--spec .ftr__list li:last-child {
	margin-bottom: 0 !important;
}
body .fg .ftr__col--spec .ftr__two a,
body .fg .ftr__col--spec .ftr__list a {
	display: inline-block !important;
	font-size: 16px !important;
	line-height: 22px !important;
	font-weight: 400 !important;
	padding: 6px 0 !important;
	color: #fff !important;
	text-decoration: none !important;
	opacity: 1 !important;
}
body .fg .ftr__col--spec .ftr__two a:hover,
body .fg .ftr__col--spec .ftr__list a:hover {
	color: #fff !important;
	opacity: 0.9;
}
/* Platform list: Figma Platforn gap=24 between groups; list items same pad */
body .fg .ftr__col:not(.ftr__col--spec) .ftr__list li {
	margin-bottom: 8px !important;
}
body .fg .ftr__col:not(.ftr__col--spec) .ftr__list a {
	display: inline-block !important;
	font-size: 16px !important;
	line-height: 22px !important;
	padding: 6px 0 !important;
}
body .fg .ftr__big li {
	margin-bottom: 16px !important;
}
body .fg .ftr__big a {
	display: inline-block !important;
	font-size: 24px !important;
	line-height: 1.25 !important;
	padding: 4px 0 !important;
}

/* ============================================================
   Футер (common/footer.tpl)
   «Тарифы» есть на сайте, но нет в макете — ссылка рабочая, только
   визуально скрываем (пункт помечен классом в footer.tpl).
   См. GAPS.md: «Проверка в выдаче Google» (нет страницы) и 3-я
   соцсеть (в макете YouTube, на сайте активный WhatsApp) — оставлены
   как есть до подтверждения заказчиком, ссылку-пустышку не добавляем.
   ============================================================ */
body .fg .ftr__extra-hide {
	display: none;
}

/* Подпись «соединяя людей, мы улучшим нашу жизнь» отрисована прямо
   внутри /_html/images/figma2/logo-white.svg (группа y≈178-194 из
   212 по viewBox) — в макете подписи под логотипом нет. Файл общий
   ресурс (используется в других местах), поэтому оригинал не трогаем.
   В футере подключён отдельный чистый файл logo-white-nosub.svg без
   этой группы (см. footer.tpl) — clip-path-костыль с "хвостом" от
   второго слоя больше не нужен. */
body .fg .ftr__logo {
	margin-bottom: 14px;
}

/* «Специалисты» в футере стал ссылкой на /specialists/ (нужно было для мобильной,
   где по макету футер плоский и категории скрыты). На десктопе и планшете вид
   не должен измениться: тема красит ссылки футера иначе, чем заголовки колонок. */
body .fg .ftr__col a.ftr__title{
	display:block;
	color:#fff;
	text-decoration:none;
}
body .fg .ftr__col a.ftr__title:hover{color:#fff;text-decoration:none}

/* ============================================================
   Колонка «Платформа»: в макете нет пунктов «Контакты»,
   «Зарегистрироваться», «Весь каталог», «Специалисты на карте».
   Правило владельца продукта: чего нет в макете — скрываем через
   display:none, ссылки остаются в разметке (SEO/краулеры не страдают).
   Селекторы — по href, т.к. отдельных классов на этих <li> нет
   (кроме уже задействованного .ftr__extra-hide у «Тарифы»).
   ============================================================ */
body .fg .ftr__col .ftr__list li a[href="/contacts/"],
body .fg .ftr__col .ftr__list li a[href="/add/"]{
	display:none;
}
body .fg .ftr__col--spec .ftr__two li a[href="/specialists/"],
body .fg .ftr__col--spec .ftr__two li a[href="/map/"]{
	display:none;
}

/* ============================================================
   Хвост копирайта «Osek Patur Olga Granovskaya»: в макете строка
   короткая — «© 2026, SarafanPRO. Все права защищены.» без хвоста.
   ГЭП: текст «Osek Patur Olga Granovskaya» — это не отдельный тег,
   а часть того же текстового узла внутри <span> вместе с основной
   строкой копирайта (footer.tpl: "<span>&copy; 2026, ... Osek Patur
   Olga Granovskaya</span>"). CSS не может скрыть часть текстового
   узла — display:none на этом <span> убрал бы и разрешённую часть
   копирайта. Требуется обернуть хвост в отдельный <span> в шаблоне
   (правка footer.tpl, вне разрешённых для этой волны CSS-партиалов).
   Не трогаю, фиксирую как gap в GAPS.md — нужно решение заказчика
   (юридическое раскрытие "osek patur" может быть обязательным).
   ============================================================ */
/* Хвост копирайта с реквизитами ИП: в макете строка короткая, только
   «© 2026, SarafanPRO. Все права защищены.» Обёрнут в span в footer.tpl,
   чтобы можно было скрыть только его, не тронув остальную строку.
   Возврат — снять это правило. Может быть юридическим требованием. */
body .fg .ftr__legal{display:none}

/* ============================================================
   Sale bar 25% — Figma 1071:114408 (Sale Web 1180x84)
   gradient #0066B2→#000F37, red icon block right, link /specials/
   ============================================================ */
/* Sale Web — flex end-cap (not absolute), so the red square cannot hang out */
body .fg .sale-bar,
body.product-category-all .sale-bar,
.page_category .sale-bar,
a.sale-bar{
  display:flex !important;
  align-items:center !important;
  gap:20px;
  width:100%;
  max-width:none;
  height:84px !important;
  min-height:84px !important;
  max-height:84px !important;
  margin:0 0 28px;
  padding:0 0 0 24px !important;
  box-sizing:border-box;
  border-radius:2px;
  text-decoration:none !important;
  color:#fff !important;
  background:linear-gradient(90deg,#0066B2 0%,#000F37 100%);
  overflow:hidden !important;
  position:relative !important;
}
body .fg .sale-bar__logo,
body.product-category-all .sale-bar__logo,
.page_category .sale-bar__logo,
a.sale-bar .sale-bar__logo{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  width:160px;
  height:38px;
  font-size:0;
  line-height:0;
  color:#fff;
}
body .fg .sale-bar__logo img,
body .fg .sale-bar__logo svg,
body.product-category-all .sale-bar__logo img,
body.product-category-all .sale-bar__logo svg,
.page_category .sale-bar__logo img,
.page_category .sale-bar__logo svg,
a.sale-bar .sale-bar__logo img,
a.sale-bar .sale-bar__logo svg{
  width:160px !important;
  height:38px !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:contain;
  display:block;
}
body .fg .sale-bar__text,
body.product-category-all .sale-bar__text,
.page_category .sale-bar__text,
a.sale-bar .sale-bar__text{
  flex:1 1 auto;
  min-width:0;
  display:flex !important;
  align-items:center !important;
  font-family:Rubik,system-ui,sans-serif;
  font-size:clamp(20px, 2.4vw, 36px) !important;
  line-height:1.15 !important;
  font-weight:700 !important;
  color:#fff !important;
  letter-spacing:0;
  white-space:nowrap !important;
  overflow:hidden;
  text-overflow:ellipsis;
}
body .fg .sale-bar__icon,
body.product-category-all .sale-bar__icon,
.page_category .sale-bar__icon,
a.sale-bar .sale-bar__icon{
  position:static !important;
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  left:auto !important;
  transform:none !important;
  flex:0 0 84px !important;
  width:84px !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  margin:0 0 0 auto !important;
  align-self:stretch !important;
  display:flex !important;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg,#EB0C0C 0%,#850707 100%);
  border-radius:0;
}
body .fg .sale-bar__icon svg,
body.product-category-all .sale-bar__icon svg,
.page_category .sale-bar__icon svg,
a.sale-bar .sale-bar__icon svg{
  width:20px !important;
  height:20px !important;
  display:block !important;
  stroke:#fff !important;
  fill:none !important;
  flex:0 0 20px;
}
body .fg .sale-bar:hover,
body.product-category-all .sale-bar:hover,
.page_category .sale-bar:hover{filter:brightness(1.05)}
@media (max-width:900px){
  body .fg .sale-bar,
  body.product-category-all .sale-bar,
  .page_category .sale-bar,
  a.sale-bar{height:72px !important;min-height:72px !important;max-height:72px !important;gap:12px;padding:0 0 0 16px !important}
  body .fg .sale-bar__text,
  body.product-category-all .sale-bar__text,
  .page_category .sale-bar__text{font-size:20px;line-height:1.2;white-space:normal}
  body .fg .sale-bar__icon,
  body.product-category-all .sale-bar__icon,
  .page_category .sale-bar__icon,
  a.sale-bar .sale-bar__icon{width:72px !important;flex-basis:72px !important}
  body .fg .sale-bar__logo,
  body.product-category-all .sale-bar__logo,
  .page_category .sale-bar__logo{display:none}
}
@media (max-width:600px){
  body .fg .sale-bar,
  body.product-category-all .sale-bar,
  .page_category .sale-bar,
  a.sale-bar{height:64px !important;min-height:64px !important;max-height:64px !important;padding:0 0 0 16px !important}
  body .fg .sale-bar__text,
  body.product-category-all .sale-bar__text,
  .page_category .sale-bar__text{font-size:16px;line-height:1.25}
  body .fg .sale-bar__icon,
  body.product-category-all .sale-bar__icon,
  .page_category .sale-bar__icon,
  a.sale-bar .sale-bar__icon{width:64px !important;flex-basis:64px !important}
}
/* Figma Sale Web text 36/700 on desktop catalog */
@media (min-width:1025px){
  body.product-category-all .sale-bar__text,
  .page_category .sale-bar__text{font-size:36px;line-height:42.66px}
}