﻿/*==============================================================================
  STICKER STUDIO — стили дочерней темы
  v3.0.0 — реорганизация: оглавление, перенос CSS из HTML-виджетов Elementor,
  удаление дублей (advantage-grid x9, label-grid, .second-btn x3, ss-biz-hero x2)

  ОГЛАВЛЕНИЕ
  ----------------------------------------------------------------------------
  1.  БАЗА
      1.1  SVG-спрайт соцсетей
      1.2  Прилипающая шапка (hide-on-scroll)
      1.3  Шрифты и глобальные стили
  2.  КАРКАС САЙТА
      2.1  Кнопки шапки, вход/регистрация
      2.2  Шапка
      2.3  Мобильное меню
      2.4  Дополнительное меню справа
      2.5  Адаптация меню
      2.6  Подвал
  3.  ОБЩИЕ КОМПОНЕНТЫ (используются на многих страницах)
      3.1  Кнопка .second-btn
      3.2  Блок «Хотите ещё / Смотреть больше» (.more-wrapper, .more-btn)
      3.3  Карточка «Закажите образцы» (.sample-card)
      3.4  Анимированный градиент текста
  4.  ГЛАВНАЯ
      4.1  Блок «Печать наклеек» (.main-sticker-card)
      4.2  Сетка с видами наклеек (.types-grid)
      4.3  Секция «Материалы и образцы» (.mat3-*)
      4.4  Блок «Подарочная карта» (.adv-card)
      4.5  Блок «Бонусы» (.ss-biz-account)
      4.6  Промо-карточки «Повтор заказа / Бонусы» (.ss-main-promo)
  5.  СТРАНИЦЫ
      5.1  /stickers/ — карточка «Заказать» + 6 типов наклеек (.wide-grid)
      5.2  /labels/ — карточка «Заказать» + сетка этикеток (.label-grid)
      5.3  /samples/ — образцы (.samples-block, .main-samples)
      5.4  /materials/ — материалы и ламинация (.ss-materials-*)
      5.5  /faq/templates/ — «Макеты» (.ss-tpl-*)
      5.6  /business/ и /all-reviews/ — герой и блоки B2B (.ss-biz-*)
      5.7  Новая «О нас» (.ss-about-*)
      5.8  /pickup/ — самовывоз: карта и телефон
      5.9  /dostavka-oplata/ (.ss-od)
      5.10 /quick-order/ (.quick-order-card)
  6.  ТОВАРЫ (страницы товаров WooCommerce)
      6.1  Блок «Заказать» (.product-label-card) и заголовок калькулятора
      6.2  Сетка «Другие типы» (.advantage-grid)
  7.  МАГАЗИН WOOCOMMERCE
      7.1  Уведомления, баллы, кнопки, пароль
      7.2  Список товаров
      7.3  Корзина
      7.4  Оформление заказа и доставка
      7.5  Ошибки полей на чекауте
      7.6  Аккаунт
      7.7  Подарочная карта
      7.8  Слайдер (swiper)
      7.9  Мой аккаунт: заказы и трекинг
  8.  БЛОГ
  ----------------------------------------------------------------------------
  CSS галереи «Наши работы» (/gallery/) живёт в плагине ss-works-gallery.
  CSS калькулятора — в sticker-inc/mis_sticker_calc.
==============================================================================*/


/* ==============================================================================
   1. БАЗА
   ============================================================================== */


/* ------------------------------------------------------------------
   1.1  SVG-спрайт соцсетей
   ------------------------------------------------------------------ */

/* ---------- Desktop / Tablet ---------- */
.photo-grid > .elementor-widget-wrap{
  display:grid !important;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
}

/* ---------- Mobile ≤ 767 px ---------- */
@media (max-width:780px){
  .photo-grid > .elementor-widget-wrap{
	/* 3 колонки, 5 строк */
	grid-template-columns:repeat(3,minmax(0,1fr));
	grid-template-rows:repeat(5,auto);   /* ← добавили 5 строк */
	grid-auto-flow:column;               /* кладём СНАЧАЛА по колонкам */
	row-gap:12px;                        /* вертикальный отступ */
  }
.site-content {
    margin: 0 20px;
  }
}

/* чтобы SVG занимали всю ячейку */
.photo-grid img{
  width:100%;
  height:auto;
  display:block;
}


/* ------------------------------------------------------------------
   1.2  Прилипающая шапка (hide-on-scroll)
   ------------------------------------------------------------------ */

/*==============================================================
  Hide-on-Scroll Header | © 2025
  =============================================================*/

/* Будет переопределено в JS, если admin-bar виден */
:root {
  --wp-admin-bar-height: 0px;
}

/* Ваша шапка */
.site-header {
  /* превращаем в "липкую" */
  position: sticky;
  /* учитываем админ-бар (если он есть) */
  top: calc(var(--wp-admin-bar-height));
  left: 0;
  z-index: 500;
  background: #fff;
  width: 100%;
  padding: 0;

  /* сама магия сдвига */
  transform: translateY(var(--header-offset, 0px));
  will-change: transform;
}

.menu {
    text-align: center;
}

/* (опционально) плавный скролл якорей, если нужен */
@supports (scroll-behavior: smooth) {
  html { scroll-behavior: smooth; }
}


/* ------------------------------------------------------------------
   1.3  Шрифты и глобальные стили
   ------------------------------------------------------------------ */

/* -------------------------------------------------------------------------- */

/*	0. 	Глобальные стили
/* -------------------------------------------------------------------------- */

/* Подключение шрифта Bounded Variable */
@font-face {
  font-family: 'Bounded Variable';
  src: url('../../fonts/Bounded-Variable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

script {
	display: none !important;
}

input[type='text'],
input[type='email'],
input[type='url'],
input[type='password'],
input[type='search'],
input[type='number'],
input[type='tel'],
input[type='range'],
input[type='date'],
input[type='month'],
input[type='week'],
input[type='time'],
input[type='datetime'],
input[type='datetime-local'],
select,
textarea {
	padding: 10px 16px;
	width: 100%;	
	border: none;
}


/* Универсальный селектор для всех полей с автозаполнением */
*:-webkit-autofill,
*:-webkit-autofill:hover,
*:-webkit-autofill:focus,
*:-webkit-autofill:active {
	-webkit-box-shadow: 0 0 0 1000px white inset !important;
	-webkit-text-fill-color: #262626 !important;
	background-color: white !important;
	background-image: none !important;
	transition: background-color 5000s ease-in-out 0s !important;
}

.edit-link {
	display:none;
}

#page .select2-selection,
.select2-container--default .select2-selection--single,
.select2-dropdown {
	border-color: #dadada !important;
}

.select2-container--default .select2-selection--single
.select2-selection__rendered {
	color: #000;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 30px;
}

.button {
	text-transform: none;
	letter-spacing: initial;
	color:#fff;
	font-size:10pt;
	border-radius:0;
	background: #262626;
    border-radius: 16px;
}

.button:hover {
    background: #FF3600;
	color: #fff;
}


button.sam-btn.sam-btn--hamburger.mobile-menu-toggle.js-mobile-menu-toggle.opened {
	background: #fff;
	z-index: 100;
}

ul.sub-menu {
	font-family: 'Golos Text';
	text-align: left;
}

@media (min-width: 1400px) {
	.container,
	.elementor-section.elementor-section-boxed > .elementor-container {
	    max-width: 1280px;
	}
}


/* ==============================================================================
   2. КАРКАС САЙТА
   ============================================================================== */


/* ------------------------------------------------------------------
   2.1  Кнопки шапки, вход/регистрация
   ------------------------------------------------------------------ */

/* -------------------------------------------------------------------------- */
/*  Font Awesome buttons / badge                                               */
/* -------------------------------------------------------------------------- */

svg:not(:root) {
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
}
.main-svg-sprite {
  display: none;
}

.close-message {
			cursor: pointer;
			height: 21px;
}

/* 1. Generic button wrapper */
.sam-btn {
	display: inline-block;
	position: relative;       /* makes badge positioning easier */
	user-select: none;
	font-size: 0;             /* we size icons individually */
	background: transparent;
	color: #000;
	text-decoration: none;
	transition: color .3s ease;
}
.sam-btn:hover,
.sam-btn:focus {
	color: #FF3600;           /* accent on hover */
}

.sam-btn__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 22px;       /* icon size */
	line-height: 1;
}

.sam-btn--cart .fa-cart-shopping,
.sam-btn--user .fa-user {
	font-size: inherit;
}

.sam-btn__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.25em;
	padding: 3px 5px;         /* as requested */
	border: 2px solid #fff;   /* white border */
	border-radius: 9999px;
	background: var(--sam-accent, #FF3600);
	color: #fff;
	font-size: 10px;
	line-height: 1;
}

.sam-btn--cart .sam-btn__badge {
	position: absolute;
	top: 0;
	right: 0;
	transform: translate(60%, -50%); /* tweak as needed */
	pointer-events: none;            /* badge shouldn't intercept clicks */
}

div#stickerstudio-mini-cart {
	padding-right: 24px;
	display:flex;          /* <div> превращаем в flex-контейнер */
	align-items:center;
}

#stickerstudio-mini-cart,
.user-action--mini-cart {
	display: none !important;
}

/* 6. Optional: style login link similar to buttons */
.user-action.login {
	display: inline-flex;
	align-items: center;
	font-weight: 600;
}

th {
    text-align: left;
}

@media (min-width: 1200px) {
	h1, .h1-style {
    	font-size: 46px;
    	line-height: 46px;
	}
	h2, .h2-style {
    	font-size: 40px;
    	line-height: 40px;
	}
}

.user-action.login {
    padding: 5px 8px 3px;
	background: #ff3600;
	color: #fff;
	border-radius: 8px;
	cursor: pointer;
	font-family: 'Bounded Variable';
	font-weight: 400;
}

.user-action.login:hover {
	opacity: 0.9;
}

.quick-order-menu a {
    background: #f5f5f5;
    padding: 5px 8px 4px;
    border-radius: 12px;
}

button.sam-btn.sam-btn--hamburger.mobile-menu-toggle.js-mobile-menu-toggle {
    background: none;
	padding: 0;
}

@media (max-width: 940px) {
	.user-action.login {
		display:none;

	}
	a.sam-btn.sam-btn--user {
    display: none;
	}
	.main-navigation-inner {
		padding: 75px 40px 0;
		background-color: #fff;
	}
	ul#main-menu {
		text-align: left;
		flex-direction: column;
        gap: 30px;
	}

	.quick-order-menu a {
		background: transparent;
		padding: 0;
		margin-top: 0;
	}
}
/* Меню входа для мобильных и планшетов */

@media (min-width: 940px) {
    .login-menu {
	display:none;
    }
}

.login-menu {
    margin-top:60px;
	font-family: Golos Text;
}

span.menu-register {
    color: #1d91fe;
}


/* ------------------------------------------------------------------
   2.2  Шапка
   ------------------------------------------------------------------ */

/* -------------------------------------------------------------------------- */

/*	1. Шапка сайта
/* -------------------------------------------------------------------------- */

.site-header:before {
	content: none;
}

.site-header__wrap {
	background-color: transparent;
	padding: 0;
}

.site-header__content {
	position: relative;
	padding: 7px 0 5px;
	margin: 0;
}

.site-header__content > * {
	position: relative;
}
.stickerstudio-branding {
	margin-left: 0;
	margin-right: 0;
}
.stickerstudio-branding .custom-logo-link {
	width: 116px;
	display: block;
}

.page-header {
	display:none;
}


/* ------------------------------------------------------------------
   2.3  Мобильное меню
   ------------------------------------------------------------------ */

/* -------------------------------------------------------------------------- */
/*	1a. Мобильное меню
/* -------------------------------------------------------------------------- */
.mobile-menu-toggle.is-waiting {
	pointer-events: none;
}

.mobile-menu-toggle-button {
	display: none !important;
}
.mobile-menu-toggle .menu-toggle-inner {transition-duration:.1s;transition-timing-function:cubic-bezier(.55,.055,.675,.19)}
.mobile-menu-toggle .menu-toggle-inner::before{transition:top .1s .14s ease,opacity .1s ease}
.mobile-menu-toggle .menu-toggle-inner::after{transition:bottom .1s .14s ease,transform .1s cubic-bezier(.55,.055,.675,.19)}
.mobile-menu-toggle.opened .menu-toggle-inner{transform:rotate(45deg);transition-delay:.14s;transition-timing-function:cubic-bezier(.215,.61,.355,1)}
.mobile-menu-toggle.opened .menu-toggle-inner::before{top:0;opacity:0;transition:top .1s ease,opacity .1s .14s ease}
.mobile-menu-toggle.opened .menu-toggle-inner::after{bottom:0;transform:rotate(-90deg);transition:bottom .1s ease,transform .1s .14s cubic-bezier(.215,.61,.355,1)}
.menu-toggle-box{width:22px;height:16px;display:block;position:relative}
.menu-toggle-inner{display:block;top:50%;margin-top:-1px}
.menu-toggle-inner,
.menu-toggle-inner::after,
.menu-toggle-inner::before{width:22px;height:2px;background-color:#000;border-radius:0;position:absolute;transition-property:transform;transition-duration:.15s;transition-timing-function:ease}
.menu-toggle-inner::after,
.menu-toggle-inner::before{content:"";display:block}
.menu-toggle-inner::before{top:-7px}
.menu-toggle-inner::after{bottom:-7px}

.main-navigation.mobile-menu {
	display: block;

	z-index: 80;
	right: auto;
	left: -100%;
	width: 100%;

	background-color: transparent;

	transition: none;
}
.main-navigation.mobile-menu:before {
	content: '';
	position: absolute;
	z-index: 5;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgb(0 0 0 / 30%);
	opacity: 0;
	transition: opacity 500ms cubic-bezier(0.64, 0.26, 0.45, 0.93);
}
.main-navigation.mobile-menu .main-navigation-inner {
	position: relative;
	z-index: 10;
	overflow-y: auto; /* панель меню скроллится */
	transform: translateX(-100%);
	transition: transform 500ms cubic-bezier(0.64, 0.26, 0.45, 0.93);
}
.main-navigation.mobile-menu._opening,
.main-navigation.mobile-menu._opened,
.main-navigation.mobile-menu._closing {
	transform: translateX(100%);
}
.main-navigation.mobile-menu._closed {
	transform: translateX(0);
}
.main-navigation.mobile-menu._opening:before,
.main-navigation.mobile-menu._opened:before {
	opacity: 1;
}
.main-navigation.mobile-menu._closing:before,
.main-navigation.mobile-menu._closed:before {
	opacity: 0;
}
.main-navigation.mobile-menu._opening .main-navigation-inner,
.main-navigation.mobile-menu._opened .main-navigation-inner {
	transform: translateX(0);
}
.main-navigation.mobile-menu._closing .main-navigation-inner,
.main-navigation.mobile-menu._closed .main-navigation-inner {
	transform: translateX(-100%);
}
.main-navigation.mobile-menu .menu {
	margin: 0;
    display: flex;
    gap: 40px;
    justify-content: center;
	align-items: center;
}

.main-navigation.mobile-menu .menu li {
	position: relative;
}
.main-navigation a {
	width: 100%;
}
.main-navigation .sub-menu-toggle {
	display: none;
}

.main-navigation .current-menu-parent > a,
.main-navigation .current-menu-item > a,
.main-navigation .sub-menu li.current-menu-item a,
.main-navigation.mobile-menu .sub-menu li.current-menu-item a,
.main-navigation a:hover,
.main-navigation a:focus,
.main-navigation li:hover {
	color: #FF3600;
}
.menu-item-has-children > .sub-menu-toggle {
	position: absolute;
	display: block;
	top: 0;
	right: 0;

	font-size: 0;

	padding: 18px 20px;

	background: #fff;
}
.menu-item-has-children > .sub-menu-toggle .svg-icon {
	vertical-align: top;
	width: 18px;
	height: 18px;
	transition: transform 300ms ease;
}
.menu-item-has-children > .sub-menu-toggle.is-opened .svg-icon {
	transform: rotate(180deg);
}
.main-navigation.mobile-menu .sub-menu {
	display: flex;
	padding: 30px 0 20px;
    flex-direction: column;
    gap: 30px;
}

.main-navigation .sub-menu li,
.main-navigation.mobile-menu .sub-menu li {
	padding-top: 0;
	padding-bottom: 0;
}
.main-navigation.mobile-menu .sub-menu li a:hover,
.main-navigation.mobile-menu .sub-menu li a:focus {
	color: #FF3600;
}


/* ------------------------------------------------------------------
   2.4  Дополнительное меню справа
   ------------------------------------------------------------------ */

/* -------------------------------------------------------------------------- */
/*	1b. Дополнительное меню справа
/* -------------------------------------------------------------------------- */
nav.user-menu {
    width: 250px;
}

.user-menu__list span.fa {
    margin-right: 10px;
    width:10px;
}

.user-action {
	display: flex;
	align-items: center;
	position: relative;
}
.user-action__dropdown {
	position: absolute;
	z-index: 999;
	right: -20px;
	top: calc(100% + 20px);
	opacity: 0;
	visibility: hidden;
	padding: 25px 20px 20px;
	border-radius: 16px;
	background-color: #fff;
	box-shadow: 0px 4px 40px 0px #0000001A;
	transform: translateY(8px);
	transition-duration: .2s;
	transition-timing-function: linear;
	transition-property: transform,opacity,visibility;
	/* задерживаем только visibility при скрытии, чтобы не мигало */
	transition-delay: 0s, 0s, .12s;
	pointer-events: none;
}

/* Ховер-мостик: перекрывает зазор в 20px между иконкой и меню */
.user-action__dropdown::before {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: -20px;
	height: 20px;
	/* прозрачная зона, нужна только для захвата hover */
}

/* Невидимая «стенка» справа в 20px для удобного наведения */
.user-action__dropdown::after {
	content: '';
	position: absolute;
	top: 0;
	right: -20px;
	bottom: 0;
	width: 20px;
}

.user-action:hover .user-action__dropdown,
.user-action:focus-within .user-action__dropdown {
	pointer-events: auto;
	transform: translateY(0);
	visibility: visible;
	opacity: 1;
	/* при показе — без задержки */
	transition-delay: 0s, 0s, 0s;
}

/* Мобильная правка: полностью убираем из потока через display, чтобы не было горизонтального скролла */
@media (max-width: 940px) {
	.main-navigation.mobile-menu .menu li {
		margin: 0;
		font-size: 30px;
		line-height: 1;
		font-weight: 500;
		padding: 0;
		width: 100%;
	}

	.main-navigation.mobile-menu .menu .sub-menu li {
		font-size: 22px;
	}

	.main-navigation-inner .menu-item-has-children a {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.mobile-submenu-toggle, .mobile-submenu-toggle:hover {
		background: none;
		color: #262626;
		padding: 0;
		font-size: 22px;
	}
	.main-navigation a:hover {
		color: #262626;
	}

	.main-navigation.mobile-menu .menu {
		align-items: flex-start;
	}

	.user-action__dropdown {
		display: none;
		right: 0;
		left: auto;
		top: calc(100% + 12px);
		opacity: 1;
		visibility: visible;
		transform: none;
		transition: none;
		pointer-events: auto;
	}

	.user-action__dropdown::before,
	.user-action__dropdown::after {
		content: none;
	}

	.user-action:focus-within .user-action__dropdown,
	.user-action:hover .user-action__dropdown {
		display: block;
	}
}

.user-menu__list {
    padding: 0;
    margin: 0;
	line-height: 1;
    list-style-type: none;
    color: #000;
    gap: 20px;
    display: flex;
    flex-direction: column;
}
.user-menu__list a {
    color: #000;
    font-weight: 500;
}

.menu-email {
    display: block;
    color: #a3a3a3;
	font-weight: 500;
	margin-top: 10px;
	font-size: 14px;
}
.menu-name {
	color: #ff3600;
    font-family: 'Bounded Variable';
    font-size: 20px;
    line-height: 20px;
}

.sticker-additional-menu {
	display: flex;
}


/* ------------------------------------------------------------------
   2.5  Адаптация меню
   ------------------------------------------------------------------ */

/* -------------------------------------------------------------------------- */
/*	1. Адаптация
/* -------------------------------------------------------------------------- */
@media (min-width: 375px) {
	.site-header__content {
		padding: 20px;
        display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.theme-stickerstudio .mobile-menu-toggle {
		left: 0;
	}
	.sticker-additional-menu {
		right: 0;
		margin: 0;
	}

}

@media (min-width: 640px) {
	.site-header__wrap {
		max-width: 100%;
	}
}


@media (min-width: 992px) {

	.site-header__content {
		position: static;
	}

	.site-header__content:before {
		box-shadow: none;
	}

	.mobile-menu-toggle {
		display: none;
	}

	.site-header__wrap .space-between-content {
		justify-content: initial;
		padding: 30px 0;
	}

	.main-navigation.mobile-menu:before {
		display: none;
	}
	.main-navigation.mobile-menu {
		position: relative;
		z-index: 90;
		left: auto;
		height: auto;
		transition: none;
	}
	.main-navigation .menu li,
	.main-navigation.mobile-menu .menu li {
		display: inline-block;
		vertical-align: top;
		padding-top: 0;
		padding-bottom: 0;
		margin-left: 0;
	}
	.main-navigation .menu > li.menu-item-has-children {
		padding-right: 0;
	}

	.main-navigation .sub-menu,
	.main-navigation.mobile-menu .sub-menu {
		display: flex;
		flex-direction: column;
		gap: 20px;
		position: absolute;
		z-index: 999;
		opacity: 0;
		visibility: hidden;
		padding: 20px;
		margin: 0;
		background-color: #fff;
		border-radius: 16px;
		box-shadow: 0px 4px 40px 0px #0000001A;
		pointer-events: none;
		top: calc(100% + 20px);
		left: -20px;
		right: auto;
		transform: translateY(8px);
		transition-duration: .2s;
		transition-timing-function: linear;
		transition-property: transform, opacity, visibility;
		transition-delay: 0s, 0s, .12s;
	}

	/* Контейнер меню как опорный для абсолютного позиционирования сабменю */
	.main-navigation .menu > li {
		position: relative;
	}

	/* Мостик над сабменю, чтобы не терять hover при движении вниз */
	.main-navigation .sub-menu::before {
		content: '';
		position: absolute;
		left: 0;
		right: 0;
		top: -20px;
		height: 20px;
	}

	/* Невидимая стенка справа на 20px для удобного наведения */
	.main-navigation .sub-menu::after {
		content: '';
		position: absolute;
		top: 0;
		right: -20px;
		bottom: 0;
		width: 20px;
	}
	.main-navigation .menu-item-has-children:hover .sub-menu,
	.main-navigation .menu-item-has-children:focus-within .sub-menu,
	.main-navigation.mobile-menu .menu-item-has-children:hover .sub-menu,
	.main-navigation.mobile-menu .menu-item-has-children:focus-within .sub-menu {
		pointer-events: auto;
		transform: translateY(0);
		visibility: visible;
		opacity: 1;
		transition-delay: 0s, 0s, 0s;
	}

/* На мобильных скрываем сабменю через display, чтобы не ломать раскладку */
@media (max-width: 940px) {
	.main-navigation .sub-menu,
	.main-navigation.mobile-menu .sub-menu {
		display: none;
		position: static;
		padding: 30px 0; /* отступы сверху/снизу */
		border-radius: 0;
		box-shadow: none;
		opacity: 1;
		visibility: visible;
		transform: none;
		transition: none;
		pointer-events: auto;
		flex-direction: column;
		gap: 30px; /* расстояние между пунктами */
	}

	/* Расстояние между пунктами подменю, работаeт при любом display */
	.main-navigation.mobile-menu .sub-menu.is-mobile-submenu > li + li {
		margin-top: 30px;
	}

	.main-navigation .menu-item-has-children:hover .sub-menu,
	.main-navigation .menu-item-has-children:focus-within .sub-menu,
	.main-navigation.mobile-menu .menu-item-has-children:hover .sub-menu,
	.main-navigation.mobile-menu .menu-item-has-children:focus-within .sub-menu {
		display: block;
	}

	/* убираем мостики у сабменю на мобиле */
	.main-navigation .sub-menu::before,
	.main-navigation .sub-menu::after {
		content: none;
	}

	/* Кнопка-стрелка для мобильных подменю внутри ссылки */
	.main-navigation.mobile-menu .menu > li.menu-item-has-children > a {
		position: relative;
		padding-right: 36px; /* место под стрелку справа */
	}

	.main-navigation.mobile-menu .mobile-submenu-toggle {
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
		margin: 0;
		padding: 0;
		background: transparent;
		border: 0;
		line-height: 1;
		cursor: pointer;
	}

	.main-navigation.mobile-menu .mobile-submenu-toggle i {
		font-size: 22px; /* размер стрелки */
		color: #000; /* чёрная стрелка */
	}

	/* Подменю: размер и начертание пунктов */
	.main-navigation.mobile-menu .sub-menu li a {
		font-size: 22px;
		font-weight: 500;
		width: auto; /* не ограничиваем ширину на мобилке */
	}
}

@media (min-width: 940px) {
	/* На десктопе не показываем мобильные стрелки */
	.mobile-submenu-toggle { display: none !important; }
}
	.main-navigation .main-navigation-inner,
	.main-navigation.mobile-menu .main-navigation-inner {
		width: 100%;
		padding-top: 0;
		max-width: none;

		overflow: initial;

		transition: none;
		transform: none !important;
		border: none;
		background: none;
	}

	.menu-item-has-children > .sub-menu-toggle {
		pointer-events: none;
		background-color: transparent;
		padding: 18px 2px;
	}
	.menu-item-has-children > .sub-menu-toggle .svg-icon {
		width: 10px;
		height: 10px;
	}
	.main-navigation li.menu-item-has-children:before {
		content: none;
	}


	.main-navigation .menu li,
	.main-navigation.mobile-menu .menu li {
		padding-left: 0;
		padding-right: 0;
		margin: 0;
		line-height: 1;
	}
	.main-navigation .sub-menu li a,
	.main-navigation.mobile-menu .sub-menu li a {
		width: 250px;
		font-weight: 500;
	}

	.sticker-additional-menu {
		position: static;
		white-space: nowrap;
		transform: none;
		margin: 0;
		margin-left: auto;
		display: flex;
		align-items: center;
	}
	.user-menu__list a:hover {
		color: #ff3600;
	}
}

@media (min-width: 1280px) {
	.site-header__wrap {
		max-width: 1280px;
		padding: 0 30px;
	}
	.site-footer__wrap {
		max-width: 1280px;
		padding: 0 30px;
	}
}
@media (max-width: 940px) {

	.menu-name {
		font-size: 30px;
		line-height: 30px;
	}
	
	.user-menu__list a {
		font-size: 22px;
	}

	.user-menu-login a {
		font-family: 'Bounded Variable';
		font-size: 30px;
        font-weight: 500;
		color: #ff3600;
	}


body:has(._opened) {
  overflow: hidden;
  overscroll-behavior: none;
}

}
@media (max-width: 780px) {
	.main-navigation {
		display: none;
	}
}


/* ------------------------------------------------------------------
   2.6  Подвал
   ------------------------------------------------------------------ */

/* -------------------------------------------------------------------------- */

/*	2. Подвал сайта
/* -------------------------------------------------------------------------- */
.site-footer {
    background-color: #fff;
	padding: 100px 0 20px 0;
    font-family: inherit;
  }

  .footer-top {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 30px;
    align-items: flex-start;
  }

  .footer-column h4 {
    line-height: 1;
    margin: 0 0 16px 0;
    text-align: left;
    font-size: 18px;
  }

  .footer-column--worktime h4 {
    line-height: 1;
    text-align: left;
    font-size: 18px;
    margin: 0px 0px 10px;
  }

  .footer-column ul {
	list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
  }

  .footer-column li {
	line-height: 1;
  }

  .footer-column li a {
    color: #000;
    text-decoration: none;
    transition: color 0.2s ease;
  }

  .footer-column li a:hover {
    color: red;
  }

  .footer-bottom {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #dadada;
    padding-top: 20px;
    margin-top: 40px;
  }

  .footer-payment-methods__image {
    max-height: 40px;
  }

  @media (max-width: 780px) {
	.site-footer {
		padding: 40px 20px;
	}

    .footer-top {
      flex-direction: column;
      gap: 8px;
      padding: 0;
    }

    .footer-column {
		width: 100%;
        background: #f5f5f5;
        border-radius: 12px;
        padding: 12px 16px;
    }

    .footer-column h4 {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0;
      margin: 0;
      cursor: pointer;
      text-align: left;
      position: relative;
    }

	.footer-column--worktime h4 {
		font-size: 16px;
		margin: 30px 0px 10px;
	}

    .footer-column h4::after {
      content: '+';
      font-size: 1.2rem;
      transition: transform 0.3s ease;
    }

    .footer-column.active h4::after {
      content: '−';
    }

    .footer-column ul {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.3s ease-out;
    }

    .footer-column.active ul {
      max-height: 500px;
	  margin-top: 20px;
	  font-weight: 500;
    }

    .footer-column ul li {
      text-align: left;
      padding: 5px 0;
    }

    .footer-bottom {
      flex-direction: column;
      text-align: center;
	  margin-top: 20px;
      padding-top: 20px;
    }
  }

  @media (min-width: 800px) {
	.footer-column--worktime {
		margin-left: 120px;
	}
  }


/* ==============================================================================
   3. ОБЩИЕ КОМПОНЕНТЫ
   ============================================================================== */


/* ------------------------------------------------------------------
   3.1  Кнопка .second-btn (белая, Bounded) — была определена трижды, объединено
   ------------------------------------------------------------------ */

.second-btn {
    display: block;
    padding: 12px 32px 10px;
    border-radius: 16px;
    text-align: center;
    text-decoration: none;
    transition: opacity .2s;
    font: 400 22px / 1 'Bounded Variable', display;
    max-width: 300px;
    background: #fff;
    color: #262626;
}

.second-btn:hover {
    opacity: 0.9;
    color: #262626;
}

@media (max-width: 780px) {
    .second-btn {
        padding: 10px 16px 8px;
        max-width: 100%;
    }
}


/* ------------------------------------------------------------------
   3.2  Блок «Хотите ещё / Смотреть больше»
   ------------------------------------------------------------------ */

/* ==========================================
   Блок «Хотите ещё / Смотреть больше»
   ========================================== */

/* Контейнер */
.more-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 32px;
	padding-top: 40px;
	margin: 0 auto;
	width: 100%;
	max-width: 1000px;
}

/* Заголовок */
.more-heading {
	font-size: 22px;
	font-weight: 500;
	margin: 0;
	white-space: nowrap;
}

/* Кнопка */
.more-btn {
	display: inline-block;
	padding: 12px 20px 10px;
	font-size: 20px;
	font-family: 'Bounded Variable', display;
	font-weight: 400;
	background: #1c1c1c;
	color: #fff;
	border-radius: 16px;
	text-decoration: none;
	line-height: 1;
	transition: background .25s ease, opacity .25s ease;
}

.more-btn:hover {
	background: #FF3600;
	color: #fff;
}

/* Мобильная версия */
@media (max-width: 767.98px) {
	.more-heading {
		display: none;
	}
	
	.more-btn {
		display: block;
		width: 100%;
		text-align: center;
		padding: 10px 16px 8px;
		font-size: 20px;
	}
}


/* ------------------------------------------------------------------
   3.3  Карточка «Закажите образцы»
   ------------------------------------------------------------------ */

/* ==========================================
   Карточка «Закажите образцы»
   ========================================== */

/* --- Карточка --- */
.sample-card{
  position:relative;
  display:flex;
  flex-direction:column;
  padding:30px;
  border-radius:24px;
  overflow:hidden;
  color:#fff;
  background:#095EF7;                  /* синий фон */
}

/* фоновое изображение (топ-право) через псевдо-элемент */
.sample-card::after{
  content:'';
  position:absolute;
  top:0;
  right:0;
  width:120%;
  height:320px;                        /* высота «шапки» с картинкой */
  background:url('../../../../../img/samples-wide-clean.webp') no-repeat right top / contain;
  pointer-events:none;
  transition:transform .35s ease;
  z-index:1;
}

/* плавный zoom/tilt при наведении */
.sample-card:hover::after{
  transform:scale(1.03) rotate(-2deg);
}

/* --- Текстовый блок --- */
.sample-info{margin-top:auto; z-index:2;}   /* прижимаем к низу, поверх bg */
.sample-text-group{display:flex;flex-direction:column;}

.sample-heading{
  margin:0 0 8px;
  font:500 20px/24px 'Bounded Variable',display;
  color:#fff;
}
.sample-desc{
  margin:0 0 16px;
  font-size:16px;
  line-height:20px;
}
.sample-accent{color:#c6ff00;}

/* --- Кнопка --- */
.sample-btn{
  display:inline-block;
  align-self:flex-start;
  padding:10px 16px 8px;
  border-radius:14px;
  font:400 22px/1 'Bounded Variable',display;
  text-decoration:none;
  box-sizing:border-box;
  transition:opacity .25s;
  color:#fff;
}
.sample-btn:hover{color:#fff;opacity:.8}

.sample-btn--outline{
  background:transparent;
  border:2px solid #fff;
}

/* ---------- Адаптивность ---------- */
@media(max-width:780px){
  .sample-card{padding:16px;min-height:320px;}
  .sample-desc{margin:0 0 24px;font-size:14px;line-height:18px;}
  .sample-card::after{left:0;width:150%;}
  .sample-btn{width:100%;text-align:center;}
}
@media(min-width:768px){
  .sample-heading{font-size:32px;line-height:38px;}
}


/* ------------------------------------------------------------------
   3.4  Анимированный градиент текста
   ------------------------------------------------------------------ */

/* Определяем анимацию для движения градиента */
@keyframes gradientAnimation {
  0% {
	background-position: 0% 50%;
  }
  50% {
	background-position: 100% 50%;
  }
  100% {
	background-position: 0% 50%;
  }
}

.wc-order-actions-dropdown.active i.fa-ellipsis {
	transform: rotate(180deg);
}

/* Стили для текста с анимированным градиентом */
.animated-gradient-text {
  background-image: linear-gradient(45deg, #e60020, #e60020, #008aff, #e60020, #e60020); /* Градиент */
	background-size: 200% 200%; /* Увеличиваем размер фона для анимации */
  background-clip: text; /* Обрезаем фон до текста */
  -webkit-background-clip: text; /* Для совместимости */
  color: transparent; /* Делаем текст прозрачным */
  animation: gradientAnimation 10s ease infinite; /* Применяем анимацию */
}


/* ==============================================================================
   4. ГЛАВНАЯ
   ============================================================================== */


/* ------------------------------------------------------------------
   4.1  Блок «Печать наклеек»
   ------------------------------------------------------------------ */

/* ==========================================
   Блок «Печать наклеек» (главная страница)
   ========================================== */

/* Карточка */
.main-sticker-card {
	max-width: 500px;
	padding: 30px;
	border-radius: 28px;
	color: #fff;
}

/* Бейджи */
.main-badges {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 28px;
	font-family: 'Bounded Variable', display;
}

.main-badge {
	padding: 6px 18px 3px;
	border-radius: 9999px;
	font: 400 14px/1 'Bounded Variable', display;
	white-space: nowrap;
}

.main-badge--blue {
	border: 2px solid #fff;
}

.main-badge--lime {
	background: #ADEB00;
	color: #262626;
	border: 2px solid #ADEB00;
}

/* Текст */
.main-title {
	margin: 0;
	font: 500 40px/1.05 'Bounded Variable', display;
	color: #fff;
}

.main-subtitle {
	margin: 0;
	font-size: 16px;
	line-height: 1.35;
}

/* Кнопки */
.main-actions {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: 50px;
}

.main-btn {
	display: block;
	padding: 12px 32px 10px;
	border-radius: 16px;
	text-align: center;
	text-decoration: none;
	transition: opacity .2s;
	font: 400 20px/1 'Bounded Variable', display;
}

.main-btn:hover {
	opacity: .8;
}

.main-btn--order {
	background: #FF3600;
	color: #fff;
}

.main-btn--order:hover {
	color: #fff;
}

.main-btn--samples {
	background: #fff;
	color: #222;
}

/* Адаптивность */
@media (max-width: 780px) {
	.main-sticker-card {
		padding: 16px 20px;
	}
	
	.main-title {
		font-size: 55px;
		line-height: 50px;
		margin-bottom: 10px;
	}
	
	.main-subtitle {
		padding-bottom: 164px;
	}
	
	.main-badge {
		padding: 6px 10px 3px;
	}
	
	.main-btn {
		padding: 10px 16px 8px;
	}
}

@media (min-width: 480px) {
	.main-title {
		font-size: 70px;
		line-height: 70px;
	}
	
	.main-subtitle {
		font-size: 18px;
	}
	
	.main-badge {
		font-size: 16px;
	}
	
	.main-btn {
		font-size: 22px;
		flex: 1;
	}
	
	.main-actions {
		flex-direction: row;
	}
}


/* ------------------------------------------------------------------
   4.2  Сетка с видами наклеек
   ------------------------------------------------------------------ */

/* ==========================================
   Сетка с видами наклеек
   ========================================== */

/* Сетка: 2 ряда по 3 карточки */
.types-grid{display:grid;gap:20px;grid-template-columns:1fr}
@media (min-width:768px){
	.types-grid--top{grid-template-columns:1fr 1fr 380px;}
	.types-grid--bottom{grid-template-columns:380px 1fr 1fr;margin-top:20px}
}

/* Карточка */
.types-card{
	position:relative;
	height:200px;
	padding: 30px;
	background:#f2f2f2;
	border-radius:20px;
	overflow:hidden;
	text-decoration:none;
	color:#222;
	display:flex;
	flex-direction:column;
}
@media (max-width:768px){
	.types-grid{grid-template-columns:1fr;gap:12px}
	.types-card{height:120px;padding:20px 16px;}
}

/* Заголовок + «Выбрать» */
.types-title{
	font-family:Bounded Variable;
	font-size:20px;
	font-weight:400;
	line-height:1;
	position:relative;
	z-index:2;
}
.types-choose{
	display:block;
	margin:12px 0 0;
	font-size:16px;
	line-height:1;
	color:#A3A3A3;
	position:relative;
	z-index:2;
}
.types-card:hover .types-choose{color:#ff3600}

/* Фоновой силуэт (на всю высоту, низ-право) + блик */
.types-shape{
	position:absolute;inset:0;z-index:1;
	background-repeat:no-repeat;background-position:right bottom;background-size:auto 100%;
	transition:transform .35s ease;
	/* если используете монохромные силуэты и хотите «вырезать» фон — оставьте маски */
	mask-repeat:no-repeat;mask-position:right bottom;mask-size:auto 100%;
	-webkit-mask-repeat:no-repeat;-webkit-mask-position:right bottom;-webkit-mask-size:auto 100%;
}
.types-shape::before{
	content:'';position:absolute;top:-20%;left:-150%;
	width:200%;height:140%;
	background:linear-gradient(128deg,transparent 20%,transparent 40%,rgba(255,255,255,.8) 50%,transparent 60%,transparent 80%);
	z-index:3;
}
.types-card:hover .types-shape{transform:scale(1.03)}
.types-card:hover .types-shape::before{left:150%;transition:left 2s ease}

/* Маппинг картинок (верхний ряд) */
.types-grid--top .types-card:nth-child(1) .types-shape{
	background-image:url('../../../../../img/figurn.webp');mask-image:url('../../../../../img/figurn.webp');-webkit-mask-image:url('../../../../../img/figurn.webp');
}
.types-grid--top .types-card:nth-child(2) .types-shape{
	background-image:url('../../../../../img/stickerpack-clean.webp');mask-image:url('../../../../../img/stickerpack-clean.webp');-webkit-mask-image:url('../../../../../img/stickerpack-clean.webp');
}
.types-grid--top .types-card:nth-child(3) .types-shape{
	background-image:url('../../../../../img/kisscut.webp');mask-image:url('../../../../../img/kisscut.webp');-webkit-mask-image:url('../../../../../img/kisscut.webp');
}

/* Маппинг картинок (нижний ряд) */
.types-grid--bottom .types-card:nth-child(1) .types-shape{
	background-image:url('../../../../../img/pryam-clean.webp');mask-image:url('../../../../../img/pryam-clean.webp');-webkit-mask-image:url('../../../../../img/pryam-clean.webp');
}
.types-grid--bottom .types-card:nth-child(2) .types-shape{
	background-image:url('../../../../../img/krug.webp');mask-image:url('../../../../../img/krug.webp');-webkit-mask-image:url('../../../../../img/krug.webp');
}
.types-grid--bottom .types-card:nth-child(3) .types-shape{
	background-image:url('../../../../../img/labels.webp');mask-image:url('../../../../../img/labels.webp');-webkit-mask-image:url('../../../../../img/labels.webp');
}

@media (max-width:768px){
	.types-title{font-size:18px;line-height:22px;}
	/* Disable hover effects on mobile */
	.types-card,
	.types-choose,
	.types-shape{transition:none !important}
	.types-card:hover .types-choose{color:#A3A3A3 !important}
	.types-card:hover .types-shape{transform:none !important}
	.types-card:hover .types-shape::before{left:-150% !important;transition:none !important}
}


/* ------------------------------------------------------------------
   4.3  Секция «Материалы и образцы»
   ------------------------------------------------------------------ */

/* ==========================================
   Секция «Материалы и образцы»
   ========================================== */

/* Сетка / Layout */
.mat3-wrapper {
	display: grid;
	gap: 20px;
	grid-template-columns: 1fr;
}

/* Card */
.mat3-card {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 30px;
	border-radius: 24px;
	overflow: hidden;
	color: #fff;
}

.mat3-card--blue {
	background: #095EF7;
}

/* Text */
.mat3-heading {
	margin: 0 0 8px 0;
	font: 500 20px/24px 'Bounded Variable', display;
	color: #fff;
}

.mat3-desc {
	margin: 0 0 16px;
	font-size: 16px;
	line-height: 20px;
}

.mat3-accent {
	color: #c6ff00;
}

.mat3-text {
	position: relative;
	z-index: 2;
}

.mat3-info,
.mat3-text-group {
	display: flex;
	flex-direction: column;
}

.mat3-info {
	margin-top: auto;
}

/* Buttons */
.mat3-btn {
	display: inline-block;
	padding: 12px 16px 10px;
	border-radius: 14px;
	font: 400 22px/1 'Bounded Variable', display;
	text-decoration: none;
	box-sizing: border-box;
	transition: opacity .25s;
	align-self: flex-start;
    text-align: center;
}

.mat3-btn:hover {
	opacity: .9;
	color: #fff;
}

.mat3-btn--fill {
	background: #fff;
	color: #262626;
	width: 320px;
}

.mat3-btn--fill:hover {
	background: #ff3600;
	color: #fff;
}

.mat3-btn--outline {
	background: transparent;
	color: #fff;
	border: 2px solid #fff;
	width: 100%;
}

/* фон у самой карточки */
.mat3-card--dark {
	background: #262626;
	background-image: url("../../../../../img/materials.webp");
	background-repeat: no-repeat;
	background-size: contain;      /* картинка полностью влезает без обрезки */
	background-position: right center;
	position: relative;            /* для абсолютного слоя с тегами */
	overflow: hidden;              /* скругления работают */
  }
  
  /* слой для тегов на всю карточку */
  .mat3-visual-1 {
	position: absolute;
	inset: 0;
	z-index: 2;                    /* поверх фона и под текстом/кнопкой при желании */
	pointer-events: none;          /* чтобы фон/слой не съедал клики */
  }
  
  /* текст и кнопка остаются поверх */
  .mat3-text { z-index: 3; position: relative; }
  .mat3-card--dark > .mat3-btn { z-index: 3; position: relative; }
  
  /* теги кликабельные */
  .mat3-tag {
	position: absolute;
	left: var(--x);
	top:  var(--y);
	transform: translate(-50%, -50%) rotate(var(--rot, 0deg));
	padding: 2px 10px 3px;
	border-radius: 9999px;
	background: #fff;
	color: #000;
	font-size: 16px;
	line-height: 1;
	white-space: nowrap;
	transition: transform .4s ease;
	pointer-events: auto;
  }

.mat3-visual-2 {
	position: absolute;
	top: 50%;
	right: 0;
	width: 77%;
	transform: translateY(-50%);
	pointer-events: none;
}

.mat3-visual-2 img {
	width: 100%;
	height: auto;
	display: block;
}

.mat3-visual-2--top {
	width: 100%;
	margin: -18px -18px;
}

.mat3-visual-2--top img {
	border-radius: 0;
	transition: transform .35s ease;
}

/* Hovers */
.mat3-card--dark:hover .mat3-tag {
	transform: translate(-50%, -50%) rotate(calc(var(--rot) + 3deg)) scale(1.1);
}

.mat3-card--blue:hover .mat3-visual-2--top img {
	transform: scale(1.03) rotate(-2deg);
}

/* Адаптивность */
@media (max-width: 780px) {
	.mat3-card {
		padding: 16px;
	}
	
	.mat3-desc {
		margin: 0 0 24px;
		font-size: 14px;
		line-height: 18px;
	}

	.mat3-card--dark .mat3-desc {
        margin: 0 0 250px;
	}
	  /* подменяем фон на мобильную картинку */
	  .mat3-card--dark {
		background-image: url("../../../../../img/materials-mobile.webp");
		background-size: cover;          /* на всю карточку */
		background-position: center bottom; /* «прикреплена снизу» */
	  }
	
	  /* если заданы мобильные координаты — применяем их */
	  .mat3-tag {
		left: var(--x-mb, var(--x));
		top:  var(--y-mb, var(--y));
	  }
	
	  /* кнопка чуть ниже контента */
	  .mat3-card--dark > .mat3-btn {
		margin-top: 14px;
	  }
	
	.mat3-visual-2 {
		position: static;
		width: 100%;
		transform: none;
		margin: 20px 0;
	}
	
	.mat3-visual-2--top {
		margin: -38px 38px -150px;
	}
	
	.mat3-btn {
		width: 100%;
		text-align: center;
	}
}

@media (min-width: 768px) {
	.mat3-wrapper {
		grid-template-columns: 2fr 0.8fr;
	}
	
	.mat3-heading {
		font-size: 32px;
		line-height: 38px;
	}
	
	.mat3-card--dark > .mat3-btn {
		margin-top: 90px;
	}
}


/* ------------------------------------------------------------------
   4.4  Блок «Подарочная карта»
   ------------------------------------------------------------------ */

/* ==========================================
   Блок "Подарочная карта"
   ========================================== */

/* Карточка */
.adv-card {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	padding: 30px;
	background: #262626;
	background-image: url("../../../../../img/envelope.webp");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	border-radius: 16px;
}

/* Текст */
.adv-title,
.adv-sub {
	color: #fff;
}

.adv-title {
	font-size: 32px;
	line-height: 1;
	margin: 0 0 12px 0;
}

.adv-sub {
	margin: 0;
	font-size: 16px;
}

/* Адаптивность */
@media (max-width: 780px) {
	
	.adv-card {
		padding: 16px 20px;
		flex-direction: column;
		align-items: flex-start;
		background-image: url("../../../../../img/envelope-mobile.webp");
	}
	
	.adv-title {
		font-size: 20px;
		margin: 0 0 6px;
	}

	.adv-text {
		font-size: 14px;
		margin-bottom: 130px;
	}

	.adv-card .second-btn {
		width: 100%;
		max-width: 100%;
	}
}


/* ------------------------------------------------------------------
   4.5  Блок «Бонусы»
   ------------------------------------------------------------------ */

/* ==========================================
   Блок "Бонусы"
   ========================================== */
   .ss-biz-account{background:#262626;color:#fff;border-radius:16px}
   .ss-biz-account__inner{display:flex;gap:20px;align-items:flex-end}
   @media (max-width:780px){.ss-biz-account__inner{flex-direction:column;align-items:stretch; gap:0}}
   
   .ss-biz-account__left{flex:1;padding:30px}
   @media (max-width:1200px){.ss-biz-account__left{padding:20px 16px}}
   .ss-biz-account__title{margin:0 0 16px 0;font-size:32px;line-height:38px;font-weight:500; color:#fff;}
   .ss-biz-account__text{margin:0 0 24px 0;font-size:16px;line-height:1.4}
   .ss-biz-account__btn{display:inline-block; width:400px;text-align:center;}
   
   .ss-biz-account__right{flex:1;display:flex;align-items:center;justify-content:center;}
   @media (max-width:780px){
	   .ss-biz-account__title{margin:0 0 12px 0;font-size:20px;line-height:22px}
	   .ss-biz-account__text{margin:0 0 30px 0;font-size:14px;line-height:18px}
	   .ss-biz-account__btn{width:100%;}
   }
   .ss-biz-account__image{max-width:560px;width:100%;height:auto;display:block;border-radius:16px !important}
   


/* ------------------------------------------------------------------
   4.6  Промо-карточки «Повтор заказа / Бонусы» (из HTML-виджета главной)
   ------------------------------------------------------------------ */

.ss-main-promo{margin-top: 20px;}
.ss-main-promo__row{display:flex;gap:20px;align-items:stretch}
@media (max-width:780px){.ss-main-promo__row{flex-direction:column}}

.ss-main-promo__card{
	background:#262626;color:#fff;border-radius:16px;position:relative;overflow:hidden;
	display:flex;flex-direction:column;justify-content:flex-start;gap:10px;
	padding:30px;min-height:300px
}
@media (max-width:940px){.ss-main-promo__card{padding:20px 16px}}

/* Левый блок */
.ss-main-promo__card--left{
	flex:0 0 380px;max-width:380px;
	background-image:url('../../../../../img/main-repeat.webp');
	background-repeat:no-repeat;background-position:left bottom;background-size:contain;
}

/* Правый блок */
.ss-main-promo__card--right{
	flex:1 1 0;
	background-image:url('../../../../../img/main-bonus.webp');
	background-repeat:no-repeat;background-position:right center;
	background-size:auto 100%; /* во всю высоту */
}

/* Типографика */
.ss-main-promo__title{margin:0 0 4px;font-size:32px;line-height:38px;font-weight:500;color:#fff; max-width: 400px;}
.ss-main-promo__text{margin:0;font-size:16px;line-height:20px;color:#fff;max-width:300px;}

/* Мобилки */
@media (max-width:780px){
    .ss-main-promo__card--left{
	flex:auto;max-width:100%;
	min-height: 240px;
    }
	.ss-main-promo__card--right{
		background-image:url('../../../../../img/main-bonus-mobile.webp');
		background-position:center bottom;
		background-size:100% auto;   
		min-height: 400px;
	}
	
	.ss-main-promo__title{margin:0;font-size:20px;line-height:24px;}
}


/* ==============================================================================
   5. СТРАНИЦЫ
   ============================================================================== */


/* ------------------------------------------------------------------
   5.1  /stickers/ — «Заказать печать стикеров»
   ------------------------------------------------------------------ */

.sticker-sticker-card {
	background-color: #095EF7;
	background-image: url(../../../../../img/second-stickers.webp);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: 100% auto;
	padding: 40px 30px;
	border-radius: 16px;
	color: #fff;
}

/* Заголовок и подзаголовок внутри блока */
.sticker-sticker-card .second-title {
	color: inherit;
	max-width: 530px;
	font-size: 50px;
	font-weight: 500;
	margin: 0 0 16px 0;
}

.sticker-sticker-card .second-subtitle {
	color: inherit;
	font-size: 20px;
	line-height: 24px;
	margin-bottom: 40px;
	max-width: 450px;
}


@media (max-width: 780px) {
	.sticker-sticker-card {
		background-position: center 70%;
		background-size: 100%;
		padding: 20px 16px;
		background-image: url(../../../../../img/second-stickers-mobile.webp);
	}
	
	.sticker-sticker-card .second-title {
		font-size: 26px;
		line-height: 28px;
	}
	
	.sticker-sticker-card .second-subtitle {
		font-size: 16px;
		line-height: 20px;
		margin-bottom: 200px;
	}
	
}
/* ==========================================
   Блок с 6 типами наклеек + информационной карточкой
   ========================================== */

/* Сетка */
.wide-grid {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(2, 1fr);
}

@media (min-width: 768px) {
	.wide-grid {
		grid-template-columns: repeat(3, 1fr) 380px;
	}
}

/* Карточка */
.wide-card {
	position: relative;
	height: 190px;
	background: #f2f2f2;
	border-radius: 20px;
	overflow: hidden;
	text-decoration: none;
	color: #222;
	display: flex;
	flex-direction: column;
}

.wide-title {
	font-family: Bounded Variable;
	font-size: 20px;
	font-weight: 400;
	line-height: 24px;
	padding: 20px 16px 0;
	position: relative;
	z-index: 2;
}

.wide-choose {
	display: block;
	margin: 16px 16px 0;
	font-size: 16px;
	line-height: 1;
	color: #A3A3A3;
	position: relative;
	z-index: 2;
}

.wide-card:hover .wide-choose {
	color: #ff3600;
}

/* Контейнер с фоновым силуэтом + блик */
.wide-shape {
	position: absolute;
	inset: 0;
	background-repeat: no-repeat;
	background-position: right bottom;
	background-size: 100% auto;
	transition: transform .35s ease;
	z-index: 1;
	mask-repeat: no-repeat;
	mask-position: right bottom;
	mask-size: 100% auto;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: right bottom;
	-webkit-mask-size: 100% auto;
}

/* Блик */
.wide-shape::before {
	content: '';
	position: absolute;
	top: -20%;
	left: -150%;
	width: 200%;
	height: 140%;
	background: linear-gradient(128deg,
		transparent 20%, transparent 40%,
		rgba(255, 255, 255, .8) 50%,
		transparent 60%, transparent 80%);
	z-index: 3;
}

/* Ховер-эффекты */
.wide-card:hover .wide-shape {
	transform: scale(1.05);
}

.wide-card:hover .wide-shape::before {
	left: 150%;
	transition: left 2s ease;
}

/* Шесть силуэтов + маск */
.wide-card:nth-child(1) .wide-shape {
	background-image: url('../../../../../img/wide-figurn.webp');
	mask-image: url('../../../../../img/wide-figurn.webp');
	-webkit-mask-image: url('../../../../../img/wide-figurn.webp');
}

.wide-card:nth-child(2) .wide-shape {
	background-image: url('../../../../../img/wide-round.webp');
	mask-image: url('../../../../../img/wide-round.webp');
	-webkit-mask-image: url('../../../../../img/wide-round.webp');
}

.wide-card:nth-child(3) .wide-shape {
	background-image: url('');
	mask-image: url('');
	-webkit-mask-image: url('');
}

.wide-card:nth-child(4) .wide-shape {
	background-image: url('../../../../../img/wide-stickerpack-clean.webp');
	mask-image: url('../../../../../img/wide-stickerpack-clean.webp');
	-webkit-mask-image: url('../../../../../img/wide-stickerpack-clean.webp');
}

.wide-card:nth-child(5) .wide-shape {
	background-image: url('../../../../../img/wide-kisscut.webp');
	mask-image: url('../../../../../img/wide-kisscut.webp');
	-webkit-mask-image: url('../../../../../img/wide-kisscut.webp');
}

.wide-card:nth-child(6) .wide-shape {
	background-image: url('../../../../../img/wide-wild-clean.webp');
	mask-image: url('../../../../../img/wide-wild-clean.webp');
	-webkit-mask-image: url('../../../../../img/wide-wild-clean.webp');
}

/* Информационный блок */
.waterproof-info {
	grid-column: 1/-1;
	background: #D7DAE1 url('../../../../../img/waterproof.webp') no-repeat center bottom;
	background-size: 100%;
	border-radius: 20px;
	padding: 20px 16px 180px;
	color: #222;
	display: flex;
	flex-direction: column;
}

.waterproof-title {
	font-size: 20px;
	font-weight: 600;
	margin: 0 0 12px;
}

.waterproof-text {
	font-size: 15px;
	line-height: 1.4;
	margin: 0;
}

/* Мобильная версия */
@media (max-width: 779px) {
	.waterproof-info {
		order: 7;
	}
	
	.wide-shape {
		background-size: 130% auto;
		mask-size: 130% auto;
		-webkit-mask-size: 130% auto;
	}
	
	.wide-title {
		font-size: 16px;
		line-height: 1.4;
	}
	
	.wide-card {
		height: 220px;
	}
	.wide-shape,
	.wide-shape::before{
    transition:none !important;   /* нет плавности */
	}
	.wide-card:hover .wide-shape,
	.wide-card:hover .wide-shape::before{
  	transform:none !important;    /* нет zoom/поворота */
	}
}

/* Десктоп: инфо-блок справа на две строки */
@media (min-width: 780px) {
	.waterproof-info {
		grid-column: 4;
		grid-row: 1/span 2;
		padding: 20px 16px;
		background-size: 100%;
		order: 0;
	}
}


/* ------------------------------------------------------------------
   5.2  /labels/ — «Заказать печать этикеток»
   ------------------------------------------------------------------ */

/* Блок «Заказать» (страница стикеров) */
.sticker-label-card {
    background-color: #095EF7;
    background-image: url(../../../../../img/second-labels.webp);
    background-repeat: no-repeat;
    background-position: 50% 80%;
    background-size: 120% auto;
    padding: 40px 30px;
    border-radius: 16px;
    color: #fff; }

/* Заголовок и подзаголовок внутри блока */
.sticker-label-card .second-title {
      color: inherit;
    max-width: 530px;
    font-size: 50px;
    font-weight: 500;
    margin: 0 0 16px 0;
}

.sticker-label-card .second-subtitle {
color: inherit;
font-size:20px;
line-height: 24px;
    margin-bottom: 40px;
    max-width: 450px; 
}


@media (max-width:780px){
    
.sticker-label-card {
    background-position: 70% bottom;
    background-size: 250%;
    padding: 20px 16px;
}

.sticker-label-card .second-title {
    font-size: 26px;
    line-height: 28px;
}
.sticker-label-card .second-subtitle {
font-size:16px;
line-height: 20px;
    margin-bottom: 260px;
}
}
/* ====================================================================
   УНИКАЛЬНЫЕ СТИЛИ ДЛЯ «label-grid»
   ==================================================================== */

/* --- СЕТКА --- */
.label-grid{
	display:grid;
	gap:20px;
	grid-template-columns:repeat(3,1fr) 380px;  /* десктоп: 3 карточки + 1 блок */
  }
  
  /* --- КАРТОЧКИ --- */
  .label-card{
	position:relative;
	height:400px;
	background:#F2F2F2;
	border-radius:24px;
	overflow:hidden;
	text-decoration:none;
	color:#222;
	display:flex;
	flex-direction:column;
  }
  .label-title{
	font-family:'Bounded Variable',display;
	font-size:20px;
	line-height:24px;
	font-weight:400;
	padding:30px 20px 16px;
	position:relative;
	z-index:2;
  }
  .label-choose{
	display:block;
	margin:0 20px;
	font-size:16px;
	line-height: 1;
	color:#A3A3A3;
	position:relative;
	z-index:2;
  }
  .label-card:hover .label-choose{color:#FF3600;}
  
  /* --- ФОН-СИЛУЭТ + МАСКА --- */
  .label-shape{
	position:absolute;
	inset:0;
	background-repeat:no-repeat;
	background-position:-20px bottom;
	background-size:150% auto;
	transition:transform .35s ease;
	z-index:1;
  
	mask-repeat:no-repeat;
	mask-position:-20px bottom;
	mask-size:150% auto;
	-webkit-mask-repeat:no-repeat;
	-webkit-mask-position:-20px bottom;
	-webkit-mask-size:150% auto;
  }
  /* блик */
  .label-shape::before{
	content:'';
	position:absolute;
	top:-20%;
	left:-150%;
	width:200%;
	height:140%;
	background:linear-gradient(128deg,transparent 20%,transparent 40%,rgba(255,255,255,.8) 50%,transparent 60%,transparent 80%);
	z-index:3;
  }
  .label-card:hover .label-shape{transform:scale(1.05);}
  .label-card:hover .label-shape::before{left:150%;transition:left 2s ease;}
  
  /* --- ПОДКЛЮЧИТЕ СВОИ PNG --- */
  .label-card:nth-child(1) .label-shape{
	background-image:url('../../../../../img/label-figurn.webp');
	mask-image:url('../../../../../img/label-figurn.webp');
	-webkit-mask-image:url('../../../../../img/label-figurn.webp');
  }
  .label-card:nth-child(2) .label-shape{
	background-image:url('../../../../../img/label-round.webp');
	mask-image:url('../../../../../img/label-round.webp');
	-webkit-mask-image:url('../../../../../img/label-round.webp');
  }
  .label-card:nth-child(3) .label-shape{
	background-image:url('../../../../../img/label-rectangle.webp');
	mask-image:url('../../../../../img/label-rectangle.webp');
	-webkit-mask-image:url('../../../../../img/label-rectangle.webp');
  }
  
  /* --- ИНФО-КАРТОЧКА --- */
  .label-grid .waterproof-info{
	background:#D7DAE1 url('../../../../../img/waterproof.webp') no-repeat center bottom;
	background-size:100%;
	border-radius:20px;
	padding:20px 16px 180px;
	color:#222;
	display:flex;
	flex-direction:column;
  }
  .label-grid .waterproof-title{font-size:20px;font-weight:600;margin:0 0 12px;}
  .label-grid .waterproof-text{font-size:15px;line-height:1.4;margin:0;}
  
  /* ---------- МОБИЛЬНЫЙ (<768 px) ---------- */
  @media(max-width:780px){
	.label-grid{grid-template-columns:1fr;}           /* всё в один столбик   */
	.label-card{height:200px;}
	.label-title{font-size:18px;line-height:22px;padding:20px 16px 0;}
	.label-choose{margin:16px 16px 0;font-size:16px;}
	.label-shape {
	  background-position: 40px -30px;
	  background-size: 110% auto;
	  mask-position: -20px bottom;
	  mask-size: 150% auto;
	  -webkit-mask-position: 40px -30px;
	  -webkit-mask-size: 110% auto;
  }
  
  /* 1. Убираем все переходы и трансформации */
  .label-shape,
  .label-shape::before{
	transition:none !important;   /* нет плавности */
  }
  .label-card:hover .label-shape,
  .label-card:hover .label-shape::before{
	transform:none !important;    /* нет zoom/поворота */
  }
  
  /* 2. Убираем «блик» полностью */
  .label-shape::before{display:none !important;}
  
  /* 3. (Необязательно) оставляем курсор без изменений над карточкой */
  .label-card{cursor:default;}
  
	/* переносим waterproof-info в самый низ */
	.label-grid .waterproof-info{
	  order:99;
	  height: 400px;
	  padding:20px 16px 120px;
	}
  }
  
  /* ---------- ДЕСКТОП (≥768 px) ---------- */
  @media(min-width:768px){
	/* располагаем waterproof-info в первой строке справа */
	.label-grid .waterproof-info{
	  grid-column:4;
	  grid-row:1 / span 1;                            /* первая строка */
	  padding:20px 16px;
	  background-size:100%;
	}
  }


/* ------------------------------------------------------------------
   5.3  /samples/ — «Образцы»
   ------------------------------------------------------------------ */

  /* ----- ОБРАЗЦЫ ----- */
  .main-samples {
    display: flex;
    justify-content: space-between;
    gap: 20px;
  }
  .samples-first-column,
  .samples-second-column {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
  }

  /* Базовый блок */
  .samples-block {
    background: #095ef7;
    color: #fff;
    padding: 30px 30px 40px 30px;
    border-radius: 16px;
    position: relative;
    overflow: hidden;
  }

  .samples-block__title {
    margin: 0 0 8px;
    font-size: 32px;
    line-height: 1;
    font-weight: 450;
    color: #fff;
    margin-bottom: 16px;
    max-width: 320px;
  }

  .samples-block__text {
    margin: 0 0 16px;
    font-size: 16px;
    line-height: normal;
    margin-bottom: 60px;
    max-width: 300px;
  }

  .samples-block__actions {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 60px;
  }

  .sample-price {
    font-family: "Bounded Variable", sans-serif;
    font-size: 22px;
    font-weight: 300;
  }

  /* Текст внутри кнопки для мобилы */
  .btn-mobile-price { display: none; }

  /* Фоны по заданию для верхних блоков */
  .samples-block-materials {
    background-image: url('../../../../../img/samples/background-materials.webp');
    background-repeat: no-repeat;
    background-position: top right;
    background-size: clamp(340px, 48%, 520px) auto;
  }

  .samples-block-colors {
    background-image: url('../../../../../img/samples/background-colors.webp');
    background-repeat: no-repeat;
    background-position: top right;
    background-size: clamp(280px, 44%, 500px) auto;
  }

  /* "В комплект входят" */
  .samples-includes__title {
    font-family: "Bounded Variable", display;
    font-size: 20px;
    font-weight: 400;
    line-height: 1;
    margin-bottom: 20px;
  }

  .includes-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
  }

  .include-card {
    position: relative;
    height: 200px;
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 12px;
    padding: 20px 15px;
    background-image: var(--bg);
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size: 100% auto;
    line-height: 16px;
	transition: all 0.1s ease-in-out;
  }

  .include-card:hover {
	background-size: 102% auto;
  }

  .include-card__label {
    align-self: flex-start;
    font-size: 14px;
    line-height: 1.2;
    font-weight: 400;
    max-width: 80%;
  }

  /* Информационный блок */
  .samples-block-info {
    background: #F5F5F5;
    background-image: url('../../../../../img/samples/materials.webp');
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: right center;
    padding: 30px;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .samples-info-text {
    font-family: Bounded Variable, display;
    font-size: 20px;
    font-weight: 400;
    line-height: 24px;
    max-width: 360px;
    margin-bottom: 38px;
  }

  .third-btn {
    color: #262626;
    border: 2px solid #262626;
    border-radius: 16px;
    padding: 12px 60px;
    font-family: Bounded Variable, display;
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
    width: fit-content;
  }

  /* Адаптив */
  @media (max-width: 1024px) {
    .includes-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  @media (max-width: 780px) {
	
    .main-samples {
      flex-direction: column;
    }

    .samples-block {
      padding: 250px 16px 30px 16px;
    }
    
    .samples-block-materials {
    background-size: contain;
  }
    
    .samples-block-colors {
    background-image: url('../../../../../img/samples/background-colors-mobile.webp');
    background-size: contain;
  }
    
    .samples-block__title {
    margin-bottom: 12px;
    font-size: 26px;
    line-height: 28px;
    }
    
    .samples-block__text {
    margin-bottom: 20px;
    }
    
    .samples-block__actions {
    margin-bottom: 52px;
    }
    
    .samples-block__actions .second-btn {
    padding: 12px;
    max-width: 100%;
    width: 100%;
    }

    .includes-grid {
      grid-template-columns: 1fr;
      gap: 6px;
    }

    .include-card {
      height: auto;
      padding: 8px 16px;
      background-image: none;
    }
    
    .samples-block-info {
    padding: 20px 16px;
    height: 300px;
    background-image: url('../../../../../img/samples/materials-mobile.webp');
    background-size: 100%;
    background-position: right center;
  }
  
  .third-btn {
    width: 100%;
    max-width: 100%;
    text-align: center;
}

    /* На мобилках объединяем кнопку и цену */
    .btn-mobile-price { display: inline; }
    .samples-block__actions .sample-price { display: none; }
  }


/* ------------------------------------------------------------------
   5.4  /materials/ — «Материалы» (из HTML-виджетов)
   ------------------------------------------------------------------ */

.materials-label-card{
	background:#f5f5f5 url('../../../../../img/materials-page.png') no-repeat right center;
	background-size:cover;
	padding:30px;
	border-radius:16px;
	color:#262626;
}
.materials-label-card .second-title{
	max-width:400px;
	margin:0 0 30px;
}
.materials-label-card .second-subtitle{
	max-width:500px;
	font-size:20px;
	line-height:26px;
}

/* Адаптив как в предыдущих блоках */

@media (max-width:780px){
	.materials-label-card{
		background-image:url('../../../../../img/materials-mobile-page.png');
		background-position:center bottom;
		background-size:cover;
		padding:20px 16px;
	}
	.materials-label-card .second-title{
		max-width:100%;
		margin:0 0 12px;
		font-size: 26px;
		line-height: 28px;
	}
	.materials-label-card .second-subtitle{
		max-width:100%;
		font-size:16px;
		line-height:20px;
		margin-bottom: 300px;
	}
}
.ss-materials-section{color:#262626}
.ss-materials-section__inner{display:flex;gap:20px;align-items:stretch}
@media (max-width:780px){.ss-materials-section__inner{flex-direction:column}}

.ss-materials-section__left{flex:1;display:flex;flex-direction:column;gap:20px}
.ss-materials-section__item{
	background:#262626;
	color:#fff;
	border-radius:16px;
	padding:30px;
	position:relative;
	overflow:hidden;
	width:900px;max-width:100%;
	background-repeat:no-repeat;background-position:right center;background-size:contain;
}
/* Персональные фоны */
.ss-materials-section__item--white{background-image:url('../../../../../img/materials-white.png')}
.ss-materials-section__item--clear{background-image:url('../../../../../img/materials-clear.png')}
.ss-materials-section__item--holo{background-image:url('../../../../../img/materials-holo.png')}

.ss-materials-section__item-title{margin:0 0 16px 0;font-size:26px;line-height:1.2;font-weight:700;color:#fff}
.ss-materials-section__item-text{margin:0 0 34px 0;font-size:14px;line-height:18px;color:#fff;max-width:250px}
.ss-materials-section__item-text.is-green{margin: 0; color:#ADEB00}

@media (max-width:1200px){
	.ss-materials-section__item{padding:20px 16px}
}
@media (max-width:780px){
	.ss-materials-section__item{
		width:100%;
		background-position:center bottom;background-size:contain;
		padding:20px 16px 190px;
	}
	.ss-materials-section__item-title{margin:0 0 12px 0;font-size:20px;}
	.ss-materials-section__item-text{margin:0 0 8px 0;max-width:100%;}
	.more-btn.ss-materials-section__btn {margin-top:30px;}
	/* Мобильные фоны */
	.ss-materials-section__item--white{background-image:url('../../../../../img/materials-white-mobile.png')}
	.ss-materials-section__item--clear{background-image:url('../../../../../img/materials-clear-mobile.png')}
	.ss-materials-section__item--holo{background-image:url('../../../../../img/materials-holo-mobile.png')}
}

/* Правая колонка */
.ss-materials-section__right{flex:1;display:flex}
.ss-materials-section__card{
	background:#F5F5F5;border-radius:16px;padding:30px;
	color:#262626;
	display:flex;flex-direction:column;gap:12px;
	width:100%;height:100%;
}
.ss-materials-section__p{margin:0;font-size:14px;line-height:18px}
.ss-materials-section__img{width:100%;height:auto;display:block;border-radius:12px}
/* Только для rounds */
.ss-materials-section__img--rounds{    margin: -12px -30px;
    width: 360px;
    max-width: 360px !important;}
    
.ss-materials-section__img--printer{    margin-bottom:18px;}

.ss-materials-section__btn{margin-top:auto;display:inline-block;text-align:center}

@media (max-width:1200px){
	.ss-materials-section__card{padding:20px 16px}
}
.ss-materials-lamination{color:#262626}
.ss-materials-lamination__row{display:flex;gap:20px;align-items:stretch}
.ss-materials-lamination__row + .ss-materials-lamination__row{margin-top:20px}
@media (max-width:780px){.ss-materials-lamination__row{flex-direction:column}}

.ss-materials-lamination__card{
	background:#F5F5F5;border-radius:16px;padding:30px;position:relative;overflow:hidden;
	display:flex;flex-direction:column;gap:16px
}
.ss-materials-lamination__card--img{
	background-repeat:no-repeat;background-position:right bottom;background-size:contain;
}
.ss-materials-lamination__card--matt{background-image:url('../../../../../img/materials-mattlam.png')}
.ss-materials-lamination__card--gloss{background-image:url('../../../../../img/materials-glosslam.png')}
.ss-materials-lamination__card--nolam{background-image:url('../../../../../img/materials-nolam.png')}

.ss-materials-lamination__card--dark{
	background:#262626;color:#fff
}

.ss-materials-lamination__title{margin:0;font-size:26px;line-height:1;font-weight:700; max-width: 500px;}
.ss-materials-lamination__text{margin:0;font-size:14px;line-height:18px; max-width:250px;}
.ss-materials-lamination__text--blue{color:#2F6BFF; margin-top:6px;}

.ss-materials-lamination__card--dark .ss-materials-lamination__text {
    max-width: 100%;
}

.ss-materials-lamination__card--nolam .ss-materials-lamination__text {
    max-width: 450px;
}

@media (max-width:1200px){
	.ss-materials-lamination__card{padding:20px 16px}
}
@media (max-width:780px){
	.ss-materials-lamination__card--img{
		background-position:center bottom;background-size:contain;padding-bottom:280px; gap: 8px;
	}
	.ss-materials-lamination__title{font-size:20px;line-height:1.2;margin-bottom:4px}
	.ss-materials-lamination__text--blue{margin-top:0;}
	.ss-materials-lamination__text{max-width:100%;}
}


/* ------------------------------------------------------------------
   5.5  /faq/templates/ — «Макеты» (из HTML-виджетов)
   ------------------------------------------------------------------ */

.ss-templates{background:#262626;color:#fff;border-radius:16px;
	background-image:url('../../../../../img/templates-main.png');
	background-repeat:no-repeat;background-position:right center;background-size:auto 100%}
.ss-templates__inner{padding:30px;max-width:470px;}
@media (max-width:1200px){.ss-templates__inner{padding:20px 16px}}
.ss-templates__title{    margin: 0 0 16px 0;
    font-size: 50px;
    line-height: 50px;
    font-weight: 500; color:#fff;}
.ss-templates__text{margin:0;max-width:680px;font-size:16px;line-height:20px;}

/* Мобилка: другая картинка, снизу по центру, запас места под фон */
@media (max-width:780px){
	.ss-templates{
		background-image:url('../../../../../img/templates-main-mobile.png');
		background-position:center bottom;background-size:contain}
		.ss-templates__title{    margin: 0 0 12px 0;
    font-size: 26px;
    line-height: 28px;}
	.ss-templates__text{margin-bottom:220px}
}
/* ====== Templates: Examples (Figma) ====== */
.ss-tpl-ex2{color:#262626}
.ss-tpl-ex2__inner{
	display:flex;
	align-items:center;
	justify-content:space-between;
}

/* Left */
.ss-tpl-ex2__left{flex:0 0 320px; margin: 0 30px}
.ss-tpl-ex2__title{
	margin:0 0 16px 0;
	font-family:'Bounded', sans-serif;
	font-style:normal;
	font-weight:500;
	font-size:50px;
	line-height:50px;
	color:#262626;
}
.ss-tpl-ex2__text{
	margin:0;
	width:250px;
	font-family:'Golos Text', sans-serif;
	font-style:normal;
	font-size:16px;
	line-height:20px;
	color:#262626;
}

/* Right */
.ss-tpl-ex2__right{flex:1 1 auto;min-width:0}
.ss-tpl-ex2__cards{
	display:flex;
	gap:20px;
	align-items:stretch;
}

/* Card */
.ss-tpl-ex2__card{
	position:relative;
	display:block;
	width:100%;
	height:160px;
	background:#095EF7;
	border-radius:16px;
	overflow:hidden;
	color:#fff;
	text-decoration:none;
	padding:30px;
	box-sizing:border-box;
	background-image:url('../../../../../img/templates-file.png');
	background-repeat:no-repeat;
	background-position:right bottom;
	background-size:auto 100%;
	transition:background-size .35s ease; /* ← важно */
}

.ss-tpl-ex2__card:focus{
	outline:2px solid rgba(173,235,0,.6);
	outline-offset:2px
}

/* Hover ТОЛЬКО на десктопе */
@media (min-width:781px){
	.ss-tpl-ex2__card:hover{
		background-size:auto 105%;
	}
}

.ss-tpl-ex2__card-title{
	margin:0 0 14px 0;
	font-family:'Bounded', sans-serif;
	font-style:normal;
	font-weight:466;
	font-size:20px;
	line-height:24px;
	color:#fff;
}

.ss-tpl-ex2__meta{
	display:flex;
	align-items:center;
	gap:8px;
	margin:0 0 28px 0;
}
.ss-tpl-ex2__meta-label{
	font-family:'Golos Text', sans-serif;
	font-style:normal;
	font-size:14px;
	line-height:14px;
	color:#fff;
}

.ss-tpl-ex2__badge{
	display:inline-flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	padding:2px 6px 3px;
	height:19px;
	font-weight:500;
	background:#ADEB00;
	border-radius:12px;
	font-family:'Golos Text', sans-serif;
	line-height:14px;
	color:#262626;
}

.ss-tpl-ex2__download{
	display:inline-flex;
	align-items:center;
	gap:10px;
	font-family:'Golos Text', sans-serif;
	font-style:normal;
	font-weight:500;
	font-size:14px;
	line-height:14px;
	color:#ADEB00;
	text-decoration:none;
}
.ss-tpl-ex2__download-icon{
	width:18px;
	height:18px;
	display:block;
	flex:0 0 18px;
}
.ss-tpl-ex2__card:hover .ss-tpl-ex2__download{opacity:.9}

/* Mobile */
@media (max-width:780px){
	.ss-tpl-ex2__inner{flex-direction:column;gap:14px;align-items:stretch;}
	.ss-tpl-ex2__left{flex:1 1 auto; margin:0 16px;}
	.ss-tpl-ex2__title{
		font-size:26px;
		line-height:26px;
		margin-bottom:10px;
	}
	.ss-tpl-ex2__text{
		font-size:14px;
		line-height:18px;
		max-width:100%;
	}

	.ss-tpl-ex2__cards{flex-direction:column;gap:12px}
	.ss-tpl-ex2__card{
		height:160px;
		padding:20px 16px;
		background-image:url('../../../../../img/templates-file-mobile.png');
		background-position:right bottom;
		background-size:auto 100%;
	}
}
/* ====== Templates: Formats block ====== */
.ss-tpl-formats{color:#262626}

/* Top gray panel */
.ss-tpl-formats__panel{
	background:#F5F5F5;
	border-radius:16px;
	padding:20px 30px;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:16px;
}

.ss-tpl-formats__title{
	margin:0;
	font-family:'Bounded', sans-serif;
	font-style:normal;
	font-weight:400;
	font-size:20px;
	line-height:26px;
	color:#262626;
}

/* Pills row */
.ss-tpl-formats__pills{
	display:flex;
	align-items:center;
	flex-wrap:wrap;
	gap:10px;
	justify-content:flex-end;
}

.ss-tpl-formats__pill{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:8px 14px 7px;
	height:38px;
	border-radius:16px;
	font-family:'Bounded', sans-serif;
	font-style:normal;
	font-weight:350;
	font-size:20px;
	line-height:20px;
	white-space:nowrap;
	box-sizing:border-box;
}

.ss-tpl-formats__pill--green{background:#ADEB00;color:#262626}
.ss-tpl-formats__pill--gray{background:#DADADA;color:#262626}

/* Tips cards */
.ss-tpl-formats__tips{
	margin-top:20px;
	display:flex;
	gap:20px;
	align-items:stretch;
}

.ss-tpl-formats__tip{
	position:relative;
	flex:1 1 0;
	min-width:0;
	background:#262626;
	border-radius:16px;
	padding:20px 30px;
	color:#fff;
	overflow:hidden;

	/* картинка фоном прижата к правой стенке */
	background-repeat:no-repeat;
	background-position:right center;
	background-size:auto 100%;
}

.ss-tpl-formats__tip--procreate{background-image:url('../../../../../img/templates-procreate.png')}
.ss-tpl-formats__tip--figma{background-image:url('../../../../../img/templates-figma.png')}

.ss-tpl-formats__tip-title{
	margin:0 0 12px 0;
	font-family:'Bounded', sans-serif;
	font-style:normal;
	font-weight:400;
	font-size:20px;
	line-height:20px;
	color:#fff;
}

.ss-tpl-formats__tip-text{
	margin:0;
	font-family:'Golos Text', sans-serif;
	font-style:normal;
	font-weight:400;
	font-size:14px;
	line-height:16px;
	color:#fff;
	max-width:360px;
}

.ss-tpl-formats__tip-text--accent{
	font-weight:500;
	color:#ADEB00;
}

/* ==== Adaptive ==== */
@media (max-width:1200px){
	.ss-tpl-formats__panel{padding:18px 20px}
	.ss-tpl-formats__pill{font-size:18px}
	.ss-tpl-formats__tip{padding:18px 20px}
}

@media (max-width:780px){
    .ss-tpl-formats__tip--procreate{background-image:url('../../../../../img/templates-procreate-mobile.png')}
.ss-tpl-formats__tip--figma{background-image:url('../../../../../img/templates-figma-mobile.png')}
	/* panel becomes “card” */
	.ss-tpl-formats__panel{
		padding:20px 16px;
		flex-direction:column;
		align-items:flex-start;
		justify-content:flex-start;
		gap:14px;
	}

	.ss-tpl-formats__title{
		font-size:26px;
		line-height:26px;
	}

	.ss-tpl-formats__pills{
		justify-content:flex-start;
		gap:10px;
	}

	/* tips stacked */
	.ss-tpl-formats__tips{
		margin-top:12px;
		flex-direction:column;
		gap:12px;
	}

	.ss-tpl-formats__tip{
		min-height:132px;      /* как в фигме на мобиле */
		padding:20px 16px;
		background-position:right bottom;
		background-size:auto 100%;
	}

	.ss-tpl-formats__tip-title{
		font-size:20px;
		line-height:24px; /* на мобиле в фигме 20/24 */
		margin-bottom:10px;
	}

	.ss-tpl-formats__tip-text{
		max-width:190px; /* чтобы не залезать на картинку справа, как в макете */
	}
}
/* ====== Templates: Quality tips ====== */
.ss-tpl-qt{color:#262626}

/* desktop grid: 380 / 620 / 300 */
.ss-tpl-qt__grid{
	display:grid;
	grid-template-columns:380px auto 300px;
	gap:20px;
	align-items:stretch;
}

/* card base */
.ss-tpl-qt__card{
	position:relative;
	height:400px;
	border-radius:16px;
	overflow:hidden;
	box-sizing:border-box;
	padding:30px;
	background-repeat:no-repeat;
	background-position:center bottom; /* картинка привязана к низу */
	background-size:100% auto;
}

/* variants */
.ss-tpl-qt__card--dark{
	background-color:#262626;
	color:#fff;
}
.ss-tpl-qt__card--light{
	background-color:#F5F5F5;
	color:#262626;
}

/* text */
.ss-tpl-qt__text{
	margin:0;
	font-family:'Golos Text', sans-serif;
	font-style:normal;
	font-size:16px;
	line-height:20px;
	max-width:520px;
}

/* specific widths like figma */
.ss-tpl-qt__card--1 .ss-tpl-qt__text{max-width:320px;color:#fff}
.ss-tpl-qt__card--2 .ss-tpl-qt__text{max-width:494px}
.ss-tpl-qt__card--3 .ss-tpl-qt__text{max-width:240px}

/* ====== Background images (desktop) ====== */
.ss-tpl-qt__card--1{background-image:url('../../../../../img/templates-quality-1.png')}
.ss-tpl-qt__card--2{background-image:url('../../../../../img/templates-quality-2.png')}
.ss-tpl-qt__card--3{background-image:url('../../../../../img/templates-quality-3.png')}

/* Responsive */
@media (max-width:1200px){
	.ss-tpl-qt__grid{
		grid-template-columns:1fr 1fr;
	}
	.ss-tpl-qt__card--3{grid-column:1 / -1}
	.ss-tpl-qt__card{height:360px}
}

@media (max-width:780px){
	.ss-tpl-qt__grid{
		grid-template-columns:1fr;
		gap:12px;
	}
	.ss-tpl-qt__card{
		height:330px;           /* как в фигме на мобиле */
		padding:20px 16px;
	}
	.ss-tpl-qt__text{
		max-width:308px;        /* как в фигме */
	}
	.ss-tpl-qt__card--1 .ss-tpl-qt__text{color:#fff}

	/* ====== Background images (mobile) ====== */
	.ss-tpl-qt__card--1{background-image:url('../../../../../img/templates-quality-1-mobile.png')}
	.ss-tpl-qt__card--2{background-image:url('../../../../../img/templates-quality-2-mobile.png')}
	.ss-tpl-qt__card--3{background-image:url('../../../../../img/templates-quality-3-mobile.png')}
}
/* ====== Templates: Colors / Preview block ====== */
.ss-tpl-col{color:#262626}

/* desktop: left auto, mid 300, right 380 */
.ss-tpl-col__grid{
	display:grid;
	grid-template-columns:auto 300px 380px;
	gap:20px;
	align-items:stretch;
}

/* card base */
.ss-tpl-col__card{
	position:relative;
	height:400px;
	border-radius:16px;
	overflow:hidden;
	box-sizing:border-box;
	padding:30px;
	background-repeat:no-repeat;
	background-position:center bottom;
	background-size:auto 78%;
	background-color:#F5F5F5;
	color:#262626;
}

/* variants */
.ss-tpl-col__card--dark{
	background-color:#262626;
	color:#fff;
}

/* text */
.ss-tpl-col__text{
	margin:0;
	font-family:'Golos Text', sans-serif;
	font-style:normal;
	font-size:16px;
	line-height:20px;
	max-width:560px;
}

/* text accents */
.ss-tpl-col__text b{font-weight:700}
.ss-tpl-col__link{
	color:#095EF7;
	font-weight:700;
	text-decoration:none;
}
.ss-tpl-col__link:hover{opacity:.9}

/* button */
.ss-tpl-col__btn{
	position:absolute;
	left:30px;
	right:30px;
	bottom:30px;
}

/* ====== Background images (desktop) ====== */
.ss-tpl-col__card--1{background-image:url('../../../../../img/templates-colors-1.png')}
.ss-tpl-col__card--2{background-image:url('../../../../../img/templates-colors-2.png')}
.ss-tpl-col__card--3{
	background-image:url('../../../../../img/templates-colors-3.png');
	background-size:100% auto;
}

/* individual text widths */
.ss-tpl-col__card--2 .ss-tpl-col__text{max-width:320px}
.ss-tpl-col__card--3 .ss-tpl-col__text{max-width:300px}

/* Responsive */
@media (max-width:1200px){
	.ss-tpl-col__grid{grid-template-columns:1fr 1fr}
	.ss-tpl-col__card--3{grid-column:1 / -1}
	.ss-tpl-col__card{height:360px}
}

@media (max-width:780px){
	.ss-tpl-col__grid{
		grid-template-columns:1fr;
		gap:12px;
	}
	.ss-tpl-col__card{
		height:330px;
		padding:20px 16px;
		background-size:auto 72%;
	}
	.ss-tpl-col__text{max-width:308px}
	.ss-tpl-col__btn{
		left:16px;
		right:16px;
		bottom:16px;
	}

	/* ====== Background images (mobile) ====== */
	.ss-tpl-col__card--1{background-image:url('../../../../../img/templates-colors-1-mobile.png')}
	.ss-tpl-col__card--2{background-image:url('../../../../../img/templates-colors-2-mobile.png')}
	.ss-tpl-col__card--3{
		background-image:url('../../../../../img/templates-colors-3-mobile.png');
		background-size:100% auto;
	}
}
/* ====== Templates: Cut lines block ====== */
.ss-tpl-cut{color:#262626}

/* desktop grid: 380 / auto / 300 */
.ss-tpl-cut__grid{
	display:grid;
	grid-template-columns:380px auto 300px;
	gap:20px;
	align-items:stretch;
}

/* card base */
.ss-tpl-cut__card{
	position:relative;
	height:400px;
	border-radius:16px;
	overflow:hidden;
	box-sizing:border-box;
	padding:30px;
	background-repeat:no-repeat;
	background-position:bottom right; /* фон к низу */
	background-size:100%;
	background-color:#F5F5F5;
	color:#262626;
}

/* variants */
.ss-tpl-cut__card--dark{
	background-color:#262626;
	color:#fff;
}

/* text */
.ss-tpl-cut__text{
	margin:0;
	font-family:'Golos Text', sans-serif;
	font-style:normal;
	font-size:16px;
	line-height:20px;
	max-width:520px;
}

/* specific widths like figma */
.ss-tpl-cut__card--1 .ss-tpl-cut__text{max-width:320px;color:#fff}
.ss-tpl-cut__card--2 .ss-tpl-cut__text{max-width:494px}
.ss-tpl-cut__card--3 .ss-tpl-cut__text{max-width:240px}

/* ====== Background images (desktop) ====== */
.ss-tpl-cut__card--1{
	background-image:url('../../../../../img/templates-cut-1.png');
}
.ss-tpl-cut__card--2{
	background-image:url('../../../../../img/templates-cut-2.png');
}
.ss-tpl-cut__card--3{
	background-image:url('../../../../../img/templates-cut-3.png');
}

/* Responsive */
@media (max-width:1200px){
	.ss-tpl-cut__grid{grid-template-columns:1fr 1fr}
	.ss-tpl-cut__card--3{grid-column:1 / -1}
	.ss-tpl-cut__card{height:360px}
}

@media (max-width:780px){
	.ss-tpl-cut__grid{
		grid-template-columns:1fr;
		gap:12px;
	}
	.ss-tpl-cut__card{
		height:330px;
		padding:20px 16px;
	}
	.ss-tpl-cut__text{max-width:308px}
	.ss-tpl-cut__card--1 .ss-tpl-cut__text{color:#fff}

	/* ====== Background images (mobile) ====== */
	.ss-tpl-cut__card--1{
		background-image:url('../../../../../img/templates-cut-1-mobile.png');
	}
	.ss-tpl-cut__card--2{
	    height: 767px;
		background-image:url('../../../../../img/templates-cut-2-mobile.png');
		background-position:bottom center;
	}
	.ss-tpl-cut__card--3{
		background-image:url('../../../../../img/templates-cut-3-mobile.png');
	}
}
/* ====== Templates: Opacity & cut rules (final) ====== */
.ss-tpl-op{color:#262626}

/* desktop: 300 / 380 / auto — как в твоём коде */
.ss-tpl-op__grid{
	display:grid;
	grid-template-columns:300px 380px auto;
	gap:20px;
	align-items:stretch;
}

/* card base */
.ss-tpl-op__card{
	position:relative;
	height:400px;
	border-radius:16px;
	overflow:hidden;
	box-sizing:border-box;
	padding:30px;
	background-repeat:no-repeat;
	background-position:center bottom;
	background-size:100% auto; /* важно, всю ширину */
	background-color:#F5F5F5;
	color:#262626;
}

/* dark variant */
.ss-tpl-op__card--dark{
	background-color:#262626;
	color:#fff;
}

/* text */
.ss-tpl-op__text{
	margin:0;
	font-family:'Golos Text', sans-serif;
	font-weight:500;
	font-size:16px;
	line-height:20px;
	max-width:520px;
}

/* widths from figma */
.ss-tpl-op__card--1 .ss-tpl-op__text{max-width:320px;}
.ss-tpl-op__card--2 .ss-tpl-op__text{max-width:380px}
.ss-tpl-op__card--3 .ss-tpl-op__text{max-width:436px}

/* ====== Background images (desktop) ====== */
.ss-tpl-op__card--1{
	background-image:url('../../../../../img/templates-opacity-1.png');
}
.ss-tpl-op__card--2{
	background-image:url('../../../../../img/templates-opacity-2.png');
}
.ss-tpl-op__card--3{
	background-image:url('../../../../../img/templates-opacity-3.png');
}

/* Responsive */
@media (max-width:1200px){
	.ss-tpl-op__grid{
		grid-template-columns:1fr 1fr;
	}
	.ss-tpl-op__card--3{
		grid-column:1 / -1;
	}
	.ss-tpl-op__card{height:360px}
}

@media (max-width:780px){
	.ss-tpl-op__grid{
		grid-template-columns:1fr;
		gap:12px;
	}
	.ss-tpl-op__card{
		height:330px;
		padding:20px 16px;
	}
	.ss-tpl-op__text{
		max-width:308px;
	}

	/* ====== Background images (mobile) ====== */
	.ss-tpl-op__card--1{
		background-image:url('../../../../../img/templates-opacity-1-mobile.png');
	}
	.ss-tpl-op__card--2{
		background-image:url('../../../../../img/templates-opacity-2-mobile.png');
	}
	.ss-tpl-op__card--3{
	    height: 700px;
		background-image:url('../../../../../img/templates-opacity-3-mobile.png');
	}
}


/* ------------------------------------------------------------------
   5.6  /business/ и /all-reviews/ — герой и блоки B2B (из HTML-виджетов, hero объединён)
   ------------------------------------------------------------------ */

.ss-biz-hero{background:#262626;color:#fff;border-radius:16px}
.ss-biz-hero__inner{display:flex;gap:24px;align-items:stretch}
.ss-biz-hero__left{padding:30px;flex:1}
.ss-biz-hero .second-title{color:#fff;margin:0 0 12px 0;max-width:750px; font-size:50px; line-height:1;}
.ss-biz-hero .second-subtitle{margin:0;max-width:750px;font-size:20px;line-height:24px}
.ss-biz-hero__right{max-width:380px;flex:1;background:#FF3600;color:#fff;border-radius:16px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.ss-biz-rating {    margin: 0 30px;
    display: flex;
    flex-direction: column;
    gap: 16px;}
.ss-biz-rating__top{font-family:'Bounded Variable';font-size:40px;line-height: 1;font-weight:500;margin:0}
.ss-biz-rating__stars{display:flex;gap:12px;}
.ss-biz-rating__star{line-height:1}
.ss-biz-rating__star i{font-size:28px}
.ss-biz-rating__star.is-full i,
.ss-biz-rating__star.is-half i{color:#F8C50A}
.ss-biz-rating__star.is-empty i{color:rgba(255,255,255,.45)}
.ss-biz-rating__caption {font-size: 16px; line-height: 20px;}

@media (max-width:780px){.ss-biz-rating {
    margin: 20px 16px;}
    .ss-biz-hero .second-title{max-width:750px; font-size:26px; line-height:28px;}
    .ss-biz-hero__left{padding:20px 16px;}
    .ss-biz-hero__right{max-width:100%;}
    .ss-biz-hero__inner{flex-direction:column; gap:0;}}
.ss-biz-benefits{color:#262626}
.ss-biz-benefits__inner{display:flex;gap:20px;align-items:stretch}
@media (max-width:768px){.ss-biz-benefits__inner{flex-direction:column}}

.ss-biz-benefits__left{flex:1;padding:30px;}
.ss-biz-benefits__title{    margin: 0 0 16px 0;
    font-size: 32px;
    line-height: 38px;
    font-weight: 500;}
.ss-biz-benefits__text{margin:0 0 16px 0;font-size:16px;line-height:1.4;    margin-bottom: 32px;}
.ss-biz-benefits__btn{display:inline-block}
a.more-btn.ss-biz-benefits__btn {
    width: 100%;
    text-align: center;
}
.ss-biz-benefits__right{flex:1;}
.ss-biz-benefits__cards{display:flex;gap:20px;flex-wrap:nowrap}
@media (max-width:1200px){.ss-biz-benefits__cards{flex-wrap:wrap;}
    .ss-biz-benefits__left{padding:20px 16px;}
}
@media (max-width:768px){.ss-biz-benefits__cards{flex-direction:column; gap:12px}}

.ss-biz-benefits__card{
	width:300px;height:318px;flex:0 0 300px;
	background:#F5F5F5;border-radius:16px;padding:30px;
	display:flex;flex-direction:column;justify-content:flex-start;
	position:relative;overflow:hidden;
	background-repeat:no-repeat;background-position:center bottom;background-size:contain;
}
@media (max-width:780px){
	.ss-biz-benefits__card{width:100%;max-width:100%;height:318px;padding:20px 16px;}
}
.ss-biz-benefits__card-title{margin:0 0 12px 0;font-size:20px;line-height:20px;font-weight:700}
.ss-biz-benefits__card-text{margin:0;font-size:16px;line-height:1.4}
.ss-biz-branding{color:#262626}
.ss-biz-branding__inner{display:flex;gap:20px;align-items:stretch}
@media (max-width:768px){.ss-biz-branding__inner{flex-direction:column}}

.ss-biz-branding__left{flex:1; padding: 30px 0 30px 30px;}
@media (max-width:1200px){.ss-biz-branding__left{padding:20px 16px}}
.ss-biz-branding__title{margin:0 0 16px 0;font-size:32px;line-height:38px;font-weight:500}
.ss-biz-branding__highlight{color:#FF3600}
.ss-biz-branding__lead{margin:0 0 26px 0;font-size:16px;line-height:22px}
.ss-biz-branding__desc{margin:0;font-size:14px;line-height:18px}

.ss-biz-branding__right{flex:1}
.ss-biz-branding__cards{display:flex;gap:20px;flex-wrap:nowrap}
@media (max-width:1200px){.ss-biz-branding__cards{flex-wrap:wrap}}
@media (max-width:768px){.ss-biz-branding__cards{flex-direction:column;gap:12px}}

.ss-biz-branding__card{
	width:460px;height:354px;flex:0 0 460px;
	border-radius:16px;padding:30px;
	position:relative;overflow:hidden;
	display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;
	background-repeat:no-repeat;background-position:center center;background-size:cover;
	background-color:#F5F5F5;
}
@media (max-width:780px){
	.ss-biz-branding__card{width:100%;max-width:100%;height:354px;padding:20px 16px;flex:0 0 354px;background-position:center right}
}
.ss-biz-branding__card .second-btn{width:100%;max-width:100%;}


/* ------------------------------------------------------------------
   5.7  Новая «О нас» (из HTML-виджетов)
   ------------------------------------------------------------------ */

/* ====== About: Hero Banner ====== */
.ss-about-hero{position:relative;border-radius:16px;overflow:hidden;min-height:260px}
.ss-about-hero__bg{
	width:100%;height:100%;position:absolute;top:0;left:0;
	object-fit:cover;object-position:center center;
}
.ss-about-hero__inner{
	position:relative;z-index:1;
	padding:40px 30px 30px;
	max-width:500px;
}
.ss-about-hero__title{
	margin:0 0 20px 0;
	font-family:'Grandis Extended', 'Bounded', sans-serif;
	font-weight:700;
	font-size:44px;
	line-height:48px;
	color:#262626;
}
.ss-about-hero__text{
	margin:0;
	font-family:'Golos Text', sans-serif;
	font-weight:400;
	font-size:18px;
	line-height:22px;
	color:#262626;
}

/* Мобилка */
@media (max-width:780px){
	.ss-about-hero{min-height:400px}
	.ss-about-hero__inner{padding:20px 16px;max-width:100%}
	.ss-about-hero__title{
		font-size:28px;
		line-height:30px;
		margin-bottom:14px;
	}
	.ss-about-hero__text{
		font-size:16px;
		line-height:20px;
	}
}
/* ====== About: Features (Quality + 3 cards) ====== */
.ss-about-feat{color:#262626}
.ss-about-feat__row{
	display:flex;
	gap:20px;
	align-items:stretch;
}

/* Левая большая карточка "Качество" */
.ss-about-feat__main{
	flex:0 0 28%;
	min-width:0;
	background:#F5F5F5;
	border-radius:16px;
	padding:30px;
	box-sizing:border-box;
	display:flex;
	flex-direction:column;
	justify-content:space-between;
	position:relative;
	overflow:hidden;
	min-height:350px;
}
.ss-about-feat__main-title{
	margin:0 0 16px 0;
	font-family:'Bounded', sans-serif;
	font-weight:500;
	font-size:36px;
	line-height:38px;
	color:#262626;
	position:relative;z-index:1;
}
.ss-about-feat__main-text{
	margin:0 0 24px 0;
	font-family:'Golos Text', sans-serif;
	font-weight:500;
	font-size:14px;
	line-height:18px;
	color:#262626;
	max-width:260px;
	position:relative;z-index:1;
}
.ss-about-feat__main-img{
	position:absolute;
	bottom:0;right:0;left:0;
	width:100%;
	height:auto;
	object-fit:contain;
	object-position:bottom center;
	pointer-events:none;
}
.ss-about-feat__btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:12px 30px;
	background:#262626;
	border-radius:12px;
	font-family:'Bounded', sans-serif;
	font-weight:400;
	font-size:18px;
	line-height:22px;
	color:#fff;
	text-decoration:none;
	border:none;
	cursor:pointer;
	position:relative;z-index:1;
	transition:background .25s ease;
	align-self:flex-start;
}
.ss-about-feat__btn:hover{background:#3a3a3a}

/* Правые 3 карточки */
.ss-about-feat__cards{
	flex:1 1 0;
	min-width:0;
	display:flex;
	gap:20px;
}
.ss-about-feat__card{
	flex:1 1 0;
	min-width:0;
	background:#F5F5F5;
	border-radius:16px;
	padding:30px 24px;
	box-sizing:border-box;
	display:flex;
	flex-direction:column;
	position:relative;
	overflow:hidden;
	min-height:350px;
}
.ss-about-feat__card-title{
	margin:0 0 12px 0;
	font-family:'Bounded', sans-serif;
	font-weight:400;
	font-size:24px;
	line-height:26px;
	color:#262626;
}
.ss-about-feat__card-text{
	margin:0;
	font-family:'Golos Text', sans-serif;
	font-weight:500;
	font-size:14px;
	line-height:18px;
	color:#262626;
	max-width:220px;
}
.ss-about-feat__card-img{
	margin-top:auto;
	width:100%;
	height:auto;
	border-radius:8px;
	object-fit:contain;
	object-position:center bottom;
}

/* Мобилка */
@media (max-width:780px){
	.ss-about-feat__row{flex-direction:column;gap:12px}
	.ss-about-feat__main{
		flex:1 1 auto;
		min-height:300px;
		padding:20px 16px;
	}
	.ss-about-feat__main-title{
		font-size:28px;
		line-height:30px;
	}
	.ss-about-feat__cards{flex-direction:column;gap:12px}
	.ss-about-feat__card{
		min-height:280px;
		padding:20px 16px;
	}
	.ss-about-feat__card-title{
		font-size:20px;
		line-height:22px;
	}
}

/* Планшет */
@media (min-width:781px) and (max-width:1024px){
	.ss-about-feat__row{flex-wrap:wrap}
	.ss-about-feat__main{flex:0 0 100%}
	.ss-about-feat__cards{flex:1 1 100%}
	.ss-about-feat__main-title{font-size:30px;line-height:32px}
}
/* ====== About: «Ваши наклейки — наша забота» ====== */
.ss-about-care{color:#262626}
.ss-about-care__title{
	margin:0 0 30px 0;
	font-family:'Bounded', sans-serif;
	font-weight:500;
	font-size:44px;
	line-height:48px;
	text-align:center;
	color:#262626;
}
.ss-about-care__row{
	display:flex;
	gap:20px;
	align-items:stretch;
}

/* Карточка */
.ss-about-care__card{
	flex:1 1 0;
	min-width:0;
	border-radius:16px;
	overflow:hidden;
	position:relative;
	min-height:260px;
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
}
.ss-about-care__card-bg{
	position:absolute;top:0;left:0;
	width:100%;height:100%;
	object-fit:cover;
	object-position:center;
	pointer-events:none;
}
.ss-about-care__card-inner{
	position:relative;z-index:1;
	padding:30px;
	max-width:340px;
}
.ss-about-care__card-title{
	margin:0 0 12px 0;
	font-family:'Bounded', sans-serif;
	font-weight:500;
	font-size:30px;
	line-height:32px;
	color:#262626;
}
.ss-about-care__card-text{
	margin:0;
	font-family:'Golos Text', sans-serif;
	font-weight:400;
	font-size:14px;
	line-height:18px;
	color:#262626;
	max-width:300px;
}

/* Мобилка */
@media (max-width:780px){
	.ss-about-care__title{
		font-size:26px;
		line-height:28px;
		text-align:left;
		margin-bottom:16px;
	}
	.ss-about-care__row{flex-direction:column;gap:12px}
	.ss-about-care__card{min-height:220px}
	.ss-about-care__card-inner{padding:20px 16px;max-width:100%}
	.ss-about-care__card-title{
		font-size:24px;
		line-height:26px;
	}
}
/* ====== About: «Ещё больше бонусов для вас» ====== */
.ss-about-bonus{color:#262626}
.ss-about-bonus__title{
	margin:0 0 30px 0;
	font-family:'Bounded', sans-serif;
	font-weight:500;
	font-size:44px;
	line-height:48px;
	text-align:center;
	color:#262626;
}

/* Ряд карточек */
.ss-about-bonus__row{
	display:flex;
	gap:20px;
	align-items:stretch;
	margin-bottom:20px;
}
.ss-about-bonus__row:last-child{margin-bottom:0}

/* Карточка */
.ss-about-bonus__card{
	background:#F5F5F5;
	border-radius:16px;
	padding:30px;
	box-sizing:border-box;
	position:relative;
	overflow:hidden;
	min-height:240px;
	display:flex;
	flex-direction:column;
}
/* Большая карточка ~70% */
.ss-about-bonus__card--lg{flex:0 0 calc(70% - 10px)}
/* Маленькая карточка ~30% */
.ss-about-bonus__card--sm{flex:0 0 calc(30% - 10px)}

.ss-about-bonus__card-title{
	margin:0 0 12px 0;
	font-family:'Bounded', sans-serif;
	font-weight:500;
	font-size:26px;
	line-height:28px;
	color:#262626;
	position:relative;z-index:1;
}
.ss-about-bonus__card-text{
	margin:0 0 20px 0;
	font-family:'Golos Text', sans-serif;
	font-weight:500;
	font-size:14px;
	line-height:18px;
	color:#262626;
	max-width:300px;
	position:relative;z-index:1;
}

/* Кнопка «Заказать» */
.ss-about-bonus__btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:12px 30px;
	background:#262626;
	border-radius:12px;
	font-family:'Bounded', sans-serif;
	font-weight:400;
	font-size:16px;
	line-height:20px;
	color:#fff;
	text-decoration:none;
	border:none;
	cursor:pointer;
	position:relative;z-index:1;
	transition:background .25s ease;
	align-self:flex-start;
	margin-top:auto;
}
.ss-about-bonus__btn:hover{background:#3a3a3a}

/* Картинка-иллюстрация, прижата к правому краю */
.ss-about-bonus__img{
	position:absolute;
	right:0;bottom:0;
	height:100%;width:auto;
	max-width:60%;
	object-fit:contain;
	object-position:right bottom;
	pointer-events:none;
}
/* Для маленьких карточек — картинка снизу по центру */
.ss-about-bonus__card--sm .ss-about-bonus__img{
	max-width:80%;
	right:50%;
	transform:translateX(50%);
	height:auto;
	bottom:0;
}

/* Бейджи (50 шт / 1000 шт -44%) в карточке скидок */
.ss-about-bonus__badges{
	display:flex;
	gap:10px;
	margin-bottom:16px;
	position:relative;z-index:1;
}
.ss-about-bonus__badge{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:5px 12px;
	border-radius:8px;
	background:#EFEFEF;
	font-family:'Golos Text', sans-serif;
	font-weight:400;
	font-size:14px;
	line-height:16px;
	color:#262626;
}
.ss-about-bonus__badge--accent{
	background:#ADEB00;
	color:#262626;
}


/* Мобилка */
@media (max-width:780px){
	.ss-about-bonus__title{
		font-size:26px;
		line-height:28px;
		text-align:left;
		margin-bottom:16px;
	}
	.ss-about-bonus__row{
		flex-direction:column;
		gap:12px;
		margin-bottom:12px;
	}
	.ss-about-bonus__card--lg,
	.ss-about-bonus__card--sm{
		flex:1 1 auto;
	}
	.ss-about-bonus__card{
		min-height:200px;
		padding:20px 16px;
	}
	.ss-about-bonus__card-title{
		font-size:22px;
		line-height:24px;
	}
	.ss-about-bonus__img{max-width:50%}
	.ss-about-bonus__card--sm .ss-about-bonus__img{max-width:60%}
}
/* ====== About: «Немного статистики» ====== */
.ss-about-stats{color:#262626}
.ss-about-stats__title{
	margin:0 0 30px 0;
	font-family:'Bounded', sans-serif;
	font-weight:500;
	font-size:44px;
	line-height:48px;
	text-align:center;
	color:#262626;
}
.ss-about-stats__row{
	display:flex;
	gap:20px;
	align-items:stretch;
}

/* Левая часть — сетка 3×2 */
.ss-about-stats__grid{
	flex:1 1 0;
	min-width:0;
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:20px;
}

/* Ячейка статистики */
.ss-about-stats__cell{
	display:flex;
	flex-direction:column;
	gap:4px;
}
.ss-about-stats__number{
	margin:0;
	font-family:'Bounded', sans-serif;
	font-weight:500;
	font-size:36px;
	line-height:40px;
	color:#262626;
}
.ss-about-stats__label{
	margin:0;
	font-family:'Golos Text', sans-serif;
	font-weight:400;
	font-size:14px;
	line-height:18px;
}

/* Правая тёмная CTA-карточка */
.ss-about-stats__cta{
	flex:0 0 calc(28% - 10px);
	min-width:0;
	background:#262626;
	border-radius:16px;
	padding:30px;
	box-sizing:border-box;
	display:flex;
	flex-direction:column;
	justify-content:space-between;
	min-height:280px;
}
.ss-about-stats__cta-title{
	margin:0 0 12px 0;
	font-family:'Bounded', sans-serif;
	font-weight:500;
	font-size:30px;
	line-height:34px;
	color:#fff;
}
.ss-about-stats__cta-text{
	margin:0 0 24px 0;
	font-family:'Golos Text', sans-serif;
	font-weight:500;
	font-size:14px;
	line-height:18px;
	color:#fff;
	opacity:.75;
	max-width:300px;
}
.ss-about-stats__cta-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:14px 40px;
	background:#fff;
	border-radius:12px;
	font-family:'Bounded', sans-serif;
	font-weight:400;
	font-size:18px;
	line-height:22px;
	color:#262626;
	text-decoration:none;
	border:none;
	cursor:pointer;
	transition:background .25s ease;
	align-self:stretch;
	text-align:center;
}
.ss-about-stats__cta-btn:hover{background:#f0f0f0}

/* Мобилка */
@media (max-width:780px){
	.ss-about-stats__title{
		font-size:26px;
		line-height:28px;
		text-align:left;
		margin-bottom:16px;
	}
	.ss-about-stats__row{flex-direction:column;gap:20px}
	.ss-about-stats__grid{
		grid-template-columns:repeat(2,1fr);
		gap:16px;
	}
	.ss-about-stats__number{
		font-size:28px;
		line-height:32px;
	}
	.ss-about-stats__cta{
		flex:1 1 auto;
		min-height:auto;
		padding:24px 20px;
	}
	.ss-about-stats__cta-title{
		font-size:24px;
		line-height:28px;
	}
}


/* ------------------------------------------------------------------
   5.8  /pickup/ — самовывоз: карта и телефон
   ------------------------------------------------------------------ */

/* -------------------------------------------------------------------------- */
/*	Самовывоз - блок с картой и информацией
/* -------------------------------------------------------------------------- */

.self-pickup-block-description {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.self-pickup-block-description-map {
	display: flex;
	align-items: center;
}

.self-pickup-block-description-map i {
	font-size: 12px;
}
    button#show-phone {
        width: 100%;
        cursor: pointer;
        border-radius: 10px;
    }
    #phone-container {
        text-align: center;
        font-size: 16px;
    }
    #phone-number {
        margin-right: 10px;
        cursor: pointer;
    }
    #copy-icon {
        cursor: pointer;
    }
    #copy-message {
    margin-top: 5px;
    color: #1e91fe;
    text-align: center;
}


/* ------------------------------------------------------------------
   5.9  /dostavka-oplata/ — доставка и оплата (из HTML-виджета)
   ------------------------------------------------------------------ */

/* Oplata/Dostavka shared */
.ss-od{color:#262626}
.ss-od__cards{display:flex;gap:20px;align-items:stretch}
@media (max-width:780px){.ss-od__cards{flex-direction:column}}

.ss-od__card{
	background:#F5F5F5;border-radius:16px;position:relative;overflow:hidden;
	height:460px;padding:30px;
	display:flex;flex-direction:column;justify-content:flex-start;
	background-repeat:no-repeat;background-position:center bottom;background-size:contain;
	flex:1 1 0
}
.ss-od__card--narrow{flex:0 0 380px;max-width:380px}

.ss-od__title{margin:0 0 12px 0;font-size:32px;line-height:38px;font-weight:500}
.ss-od__text{margin:0 0 8px 0;font-size:16px;line-height:20px}
.ss-od__text:last-child{margin-bottom:0}

/* Персональные фоны: ОПЛАТА */
.ss-od__card--oplata-cards{background-image:url('../../../../../img/oplata-cards-clean.png')}
.ss-od__card--oplata-corporate{background-image:url('../../../../../img/oplata-corporate-clean.png')}
.ss-od__card--oplata-bonus{background-image:url('../../../../../img/oplata-bonus-clean.png')}

/* Персональные фоны: ДОСТАВКА */
.ss-od__card--dostavka-pochta{background-image:url('../../../../../img/dostavka-pochta-clean.png')}
.ss-od__card--dostavka-cdek{background-image:url('../../../../../img/dostavka-cdek-clean.png')}
.ss-od__card--dostavka-pickup{background-image:url('../../../../../img/dostavka-pickup-clean.png')}

/* Мобильные замены изображений */
@media (max-width:780px){
    .ss-od__card {height: 380px;padding: 20px 16px; flex: auto;}
    .ss-od__title{font-size:20px;line-height:20px;font-weight:500}
	.ss-od__card--oplata-cards{background-image:url('../../../../../img/oplata-cards-mobile-clean.png')}
	.ss-od__card--dostavka-cdek{background-image:url('../../../../../img/dostavka-cdek-mobile-clean.png')}
	.ss-od__card--dostavka-pochta{background-image:url('../../../../../img/dostavka-pochta-mobile-clean.png')}
}

/* CTA общий для обеих страниц */
.ss-od__cta{background:#262626;color:#fff;border-radius:16px;margin-top:20px;padding:20px 30px;display:flex;gap:20px;align-items:center;justify-content:space-between}
.ss-od__cta-text{margin:0;max-width:500px;font-size:16px;line-height:20px}
.ss-od__cta-btn{display:inline-block}
@media (max-width:780px){
	.ss-od__cta{flex-direction:column;align-items:flex-start;padding:20px 16px}
	.ss-od__cta-btn{width:100%;}
}


/* ------------------------------------------------------------------
   5.10  /quick-order/ — быстрый заказ (из HTML-виджета)
   ------------------------------------------------------------------ */

    .quick-order-card {
    background-color: #262626;
	background-image: url(../../../../../img/quick-order.png);
	background-repeat: no-repeat;
	background-position: right bottom;
	background-size: 100%;
	padding: 30px;
	border-radius: 16px;
	color: #fff;
	margin-bottom: 40px;
    }
    
    .quick-order-card .second-title, .quick-order-card .second-subtitle{
        color: #fff;
        max-width: 500px;
    }
    
    .quick-order-card .second-title {
        font-size: 50px;
        font-weight: 500;
        margin: 16px 0;
    }
    
    .quick-order-card .second-subtitle {
        font-size: 20px;
        line-height: 24px;
        margin: 0;
    }
    
    @media (max-width: 780px) {
        .quick-order-card .second-title {
        font-size: 26px;
         margin: 0;
        }
        .quick-order-card .second-subtitle {
        font-size: 16px;
        line-height: 20px;
        margin-bottom: 160px;
        }
        .quick-order-card {
        background-image: url(../../../../../img/quick-order-mobile.png);
        padding: 20px 16px;
        }
    }


/* ==============================================================================
   6. ТОВАРЫ
   ============================================================================== */


/* ------------------------------------------------------------------
   6.1  Блок «Заказать» и заголовок калькулятора
   ------------------------------------------------------------------ */

/* Блок «Заказать» (страница стикеров) */
.product-label-card {
    position: relative;
    background-color: #EFEFEF;
    background-repeat: no-repeat;
    background-size: auto 100%;
	background-position: right;
    padding: 40px 30px;
    border-radius: 16px;
    overflow: hidden;
}

/* Заголовок и подзаголовок внутри блока */
.product-label-card .second-title {
    color: inherit;
    max-width: 750px;
    font-size: 50px;
    font-weight: 500;
    margin: 0 0 16px 0;
    color: #262626;
}

.product-label-card .second-subtitle {
    color: inherit;
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 30px;
    max-width: 550px;
    color: #262626;
}

/* Стили для параграфов внутри описания */
.product-label-card .second-subtitle p {
    margin: 0;
    color: inherit;
}


.calculator-heading {
    text-align: center;
    margin: 60px 0 30px 0;
    font-weight: 500;
}

@media (max-width: 780px) {
    .calculator-heading {
        font-size: 24px;
        margin: 40px 0 20px 0;
    }
    
    .product-label-card {
        padding: 20px 16px;
        background-position: top;
        background-size: 100%;
    }

    .product-label-card .second-title {
        font-size: 26px;
        line-height: 28px;
    }
    
    .product-label-card .second-subtitle {
        font-size: 16px;
        line-height: 20px;
        margin-bottom: 260px;
    }
    
    .product-label-card .second-subtitle p {
        font-size: 16px;
        line-height: 20px;
    }
    
}


/* ------------------------------------------------------------------
   6.2  Сетка «Другие типы» (была продублирована в 9 шаблонах Elementor)
   ------------------------------------------------------------------ */

/* ====================================================================
   УНИКАЛЬНЫЕ СТИЛИ ДЛЯ «label-grid»
   ==================================================================== */

/* --- СЕТКА --- */
.advantage-grid{
  display:grid;
  gap:12px;
  grid-template-columns:repeat(3,1fr) 380px;  /* десктоп: 3 карточки + 1 блок */
}

/* --- КАРТОЧКИ --- */
.advantage-card{
  position:relative;
  height:360px;
  background:#F5F5F5;
  border-radius:24px;
  overflow:hidden;
  text-decoration:none;
  color:#222;
  display:flex;
  flex-direction:column;
}
.advantage-title{
  font-family:'Bounded Variable',display;
  font-size:24px;
  line-height:28px;
  font-weight:400;
  padding:30px 30px 6px;
  position:relative;
  z-index:2;
}
.advantage-choose{
  display:block;
  margin:0 30px;
  font-size:16px;
  line-height: 20px;
  position:relative;
  z-index:2;
}
.advantage-sample .second-btn {
    margin-top: auto;
    max-width: 100%;
}
/* --- ФОН-СИЛУЭТ + МАСКА --- */
.advantage-shape{
  position:absolute;
  inset:0;
  background-repeat:no-repeat;
  background-position: center;
  background-size:100%;
  z-index:1;
}

/* --- ПОДКЛЮЧИТЕ СВОИ PNG --- */
.advantage-card:nth-child(1) .advantage-shape{
  background-image:url('../../../../../img/free-delivery.png');
}
.advantage-card:nth-child(2) .advantage-shape{
  background-image:url('../../../../../img/optimise-print.png');
}
.advantage-card:nth-child(3) .advantage-shape{
  background-image:url('../../../../../img/premium-quality.png');
}

/* --- ИНФО-КАРТОЧКА --- */
.advantage-sample{
  background:#095EF7 url('../../../../../img/samples-adventage-clean.png') no-repeat center 10px;
  background-size: 100%;
  border-radius:20px;
  padding:20px 16px 180px;
  color:#222;
  display:flex;
  flex-direction:column;
}
.sample-title{font-size: 24px;
    line-height: 28px;
    font-weight: 400;
    margin: 0 0 6px;
    color: #fff;}
.sample-lime{color:#BBFF00;}
.sample-text{font-size:16px;line-height:20px;margin:0;color:#fff;}


/* ---------- МОБИЛЬНЫЙ (<768 px) ---------- */
@media(max-width:780px){
  .advantage-grid{grid-template-columns:1fr;}           /* всё в один столбик   */
  .advantage-card{height:300px;}
  .advantage-title{font-size:18px;line-height:22px;padding:20px 16px 0;}
  .advantage-choose{margin: 6px 16px 0;font-size:16px;line-height: 20px;}
  .advantage-shape {
    background-position: center;
}

  /* переносим waterproof-info в самый низ */
  .advantage-sample{
    order:99;
    height: 350px;
    padding:20px 16px;
  }
  .sample-title {font-size: 20px;margin: 0 0 6px;line-height:1;}
  .sample-text {line-height: 20px;}
}

/* ---------- ДЕСКТОП (≥768 px) ---------- */
@media(min-width:768px){
  /* располагаем waterproof-info в первой строке справа */
  .advantage-sample{
    grid-column:4;
    grid-row:1 / span 1;                            /* первая строка */
    padding:30px;
    background-size:100%;
  }
}


/* ==============================================================================
   7. МАГАЗИН WOOCOMMERCE
   ============================================================================== */


/* ------------------------------------------------------------------
   7.1  Уведомления, баллы, кнопки, пароль
   ------------------------------------------------------------------ */

/* -------------------------------------------------------------------------- */

/*	4. WooCommerce
/* -------------------------------------------------------------------------- */
.blockUI.blockOverlay {
	opacity: 1 !important;
	z-index: 300 !important;
	background-color: #F5F5F5 !important;
	opacity: 0.7 !important;
}
.blockUI.blockOverlay:before {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 32px;
	height: 32px;
	margin: -16px 0 0 -16px;
	border-radius: 50%;
	border: 6px solid #095EF7;
	border-color: #095EF7 #095EF7 #095EF7 rgba(242,70,70,0.16);
	-webkit-animation: lds-dual-ring 1.2s linear infinite;
	animation: lds-dual-ring 700ms linear infinite;
}

@-webkit-keyframes lds-dual-ring {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}


label.checkbox input[type="checkbox"] + span::before,
label.inline input[type="checkbox"] + span::before {
	border-color: #c0c1c1;
}
label.checkbox input[type="checkbox"] + span::after,
label.inline input[type="checkbox"] + span::after {
	top: 3px;
	left: 3px;
}

body.post-type-archive-product .site-content {
	margin-top: 0;
	margin-bottom: 0;
}
.shop-page-title {
	text-align: center;
	font-size: 30px;
	font-weight: 400;
	margin: 15px 0 30px;
}

.woocommerce-form-coupon-toggle {
    margin-top: 10px;
}

.woocommerce form .form-row .required {
	color: red;
}

.woocommerce form .form-row.woocommerce-invalid .input-text {
	border-color: red;
}

.woocommerce form .form-row.woocommerce-validated .select2-container,
.woocommerce form .form-row.woocommerce-validated input.input-text,
.woocommerce form .form-row.woocommerce-validated select {
    border-color: #2fd3ae;
}

.variation dt,
.variation dd {
	display: inline-block;
	margin: 0;
}

.variation p,
.wc-item-meta p {
	display: inline;
	margin: 0;
}

ul.wc-item-meta {
	margin: 0;
	padding: 0;
	list-style: none;
}
.wc-item-meta li {
    font-size: 12px;
    line-height: 17px;
}

.cart .cart_item .product-name {
	font-family: 'Bounded Variable';
	color: #262626;
	font-weight: 500;
	font-size: 22px;
	line-height: 1;
}

.product-name a {
	color: #262626;
}

.product-item.product-quantity, .product-subtotal, .product-remove, .product-properties {
	padding: 16px 0;
	max-width: 380px;
}

.product-item.product-subtotal {
	font-size: 20px;
	line-height: 1.2;
}

.product-item.product-remove {
text-align: right;
}

div.quantity .input-text.qty {
color: #262626;
background: transparent;
padding: 4px 8px;
border: 2px solid #DADADA;
}

.woocommerce-cart-form__cart-item .variation__item {
	background: #fff;
	padding: 4px 8px;
	border-radius: 8px;
	line-height: 1.2;
}

.variation__item.variation__maket {
	background: #095EF7;
	color: #fff;
}

.variation__item.variation__maket .variation-, .variation__item.variation__comment .variation- {
	max-width: 15ch;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.woocommerce-error > li {
	display: block;
}

/* Notice от ss-sticker-storage о повторе заказа.
 * Родительский monstroid2 ставит .woocommerce-message {flex-direction:row-reverse}
 * — без второго элемента (типа кнопки) текст уезжает вправо. Растягиваем span
 * на flex:1 + text-align:left чтобы текст был слева. */
.woocommerce-message .ss-reorder-msg-text {
	flex: 1;
	text-align: left;
}
.woocommerce-message .ss-reorder-msg-link {
	color: #fff;
	text-decoration: underline;
}
.woocommerce-message .ss-reorder-msg-link:hover {
	text-decoration: none;
	opacity: 0.85;
}

/* «+N баллов» под subtotal каждой позиции в корзине/чекауте.
 * Печатает Sticker_Reorder_Cashback_Boost::render_item_points через фильтр
 * woocommerce_cart_item_subtotal. */
.ss-cart-item-points {
	color: #FF3600;
	font-weight: 600;
	font-size: 14px;
	line-height: 1;
	margin-top: 6px;
	white-space: nowrap;
}

/* На мобильных делаем строку компактнее (мелкий шрифт + меньше отступ),
 * чтобы вторая строка под ценой выглядела как аккуратная подпись, а не
 * выпирала. В одну строку с ценой не положить — grid в 3 колонки
 * (~100px каждая) не вмещает «1 215 ₸ +134 балла» при больших цифрах. */
@media (max-width: 768px) {
	.ss-cart-item-points {
		font-size: 12px;
		margin-top: 4px;
		font-weight: 700;
	}
}

.woocommerce-form.woocommerce-form-login,
.woocommerce-form.woocommerce-form-register {
	text-align: left;
}
button.woocommerce-button.button.woocommerce-form-login__submit,
button.woocommerce-Button.register {
    width: 100%;
    height: 40px;
    margin: 10px 0;
}

.woocommerce-LostPassword.lost_password {
	text-align: center;
    margin: 4px 0 28px;
    font-size: 12px;
    line-height: 1;
	color: #a3a3a3;
}

.woocommerce-checkout .woocommerce-checkout-review-order table tr th:last-child,
.woocommerce-checkout .woocommerce-checkout-review-order table tr td:last-child {
	width: auto;
	text-align: right;
}

section.woocommerce-order-details {
    padding: 10px;
    border: 1px solid #dadada;
    border-radius: 10px;
}

/* Стили row-info-shipping и row-info-stickers удалены */

/* Базовые стили для кнопки */
.show-password-input {
	background: none;
	position: absolute !important;
	right: 16px !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	margin: 0 !important;
	padding: 0 !important;
	height: auto !important;
	font-size: 16px !important;
	line-height: 1 !important;
	cursor: pointer !important;
	z-index: 10 !important;
}

.show-password-input:hover {
	background: none;
}

/* Стиль для кнопки "Показать пароль" (закрытый) */
.show-password-input:after {
	content: "" !important;
	display: inline-block !important;
	width: 28px !important;
	height: 20px !important;
	background-image: url('../../../../../img/visible-password.svg') !important;
	background-repeat: no-repeat !important;
	background-size: contain !important;
	background-position: center center !important;
	background-color: transparent !important;
}

/* Стиль для кнопки "Показать пароль" (открытый) */
.show-password-input.display-password:after {
	content: "" !important;
	background-image: url('../../../../../img/hidden-password.svg') !important;
}

/* Обеспечиваем правильное позиционирование родительского контейнера */
.password-input {
	position: relative !important;
}

/* Добавляем отступ для текста в поле ввода, чтобы не перекрывался кнопкой */
.woocommerce-Input[type="password"] {
	padding-right: 35px !important;
}


/* ------------------------------------------------------------------
   7.2  Список товаров
   ------------------------------------------------------------------ */

.wc-empty-cart-message {
    width: 100%;
}

.elementor-element.elementor-products-grid ul.products li.product {
	max-width: 100%;
	width: 100%;
	border: none;
}
.product-content {
	display: flex;
	flex-direction: column;
	align-items: center;
}
.products .product .product-content {
	padding: 9px;
	border-radius: 15px;
	border: none;
}
@media (min-width: 800px){
.products .product .product-content:hover {
	background-color: #fff;
}
}
.woocommerce-LoopProduct-link img {
	vertical-align: top;
}
.woocommerce-loop-product__title {
	text-align: center;
	text-decoration: none;
	font-weight: 400;
	font-family: 'Exo 2';
    font-size: 14px;
}
.woocommerce-variation-price {
    display: none;
}


/* ------------------------------------------------------------------
   7.3  Корзина
   ------------------------------------------------------------------ */

/* -------------------------------------------------------------------------- */

/*	7. Корзина
/* -------------------------------------------------------------------------- */

.woocommerce-cart .woocommerce {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	align-items: flex-start;
}

a.restore-item {
    color: #fff;
}

.order-cashback-value {
	color: #ff3600;
	font-weight: 600;
}

.totals-line {
	display: flex;
	justify-content: space-between;
	line-height: 1.9;
}

.estimated-delivery-date-cart {
	font-size: 14px;
	text-align: center;
}

a.remove-item, a.woocommerce-remove-coupon.remove-coupon-icon {
	color: #DADADA;
	font-size: 16px;
}

a.woocommerce-remove-coupon.remove-coupon-icon {
	margin-left: 8px;
}

.my-coupon-amount {
	background: #ADEB00;
	border-radius: 8px;
	padding: 4px 8px;
}

.shop_table.shop_table_responsive.cart.woocommerce-cart-form__contents {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.woocommerce-cart-form__cart-item.cart_item {
	display: grid;
	gap:20px;
	background: #f5f5f5;
	padding: 12px 30px;
	border-radius: 16px;
	grid-template-columns: 140px auto 85px 120px 15px;
}

.product-item { grid-column: span 1; }

a.remove-item:hover, a.woocommerce-remove-coupon.remove-coupon-icon:hover {color: #ff3600;}

.woocommerce-cart .woocommerce .cart-collaterals .cart_totals {
	display: inline-block;
}


[name="update_cart"]:disabled {
	opacity: .3;
	pointer-events: none;
}

@media (max-width: 780px) {
	.woocommerce-cart-form__cart-item.cart_item {
		padding: 20px 16px;
		grid-template-columns: repeat(3, 1fr);
	  }
	
	  /* Первый ряд — два блока, 1 : 2 = 7 : 11 */
	  .product-item:nth-child(1) { grid-column: span 1; } /* 14 из 36 ≈ 140/360 */
	  .product-item:nth-child(2) { grid-column: span 2; } /* 22 из 36 ≈ 220/360 */
	
	  /* Второй ряд — три блока, 2 : 3 : 4  
		 (2+3+4 = 9, значит 2 = 8 tr, 3 = 12 tr, 4 = 16 tr) */
	  .product-item:nth-child(3) { grid-column: span 1; }
	  .product-item:nth-child(4) { grid-column: span 1; }
	  .product-item:nth-child(5) { grid-column: span 1; }
	
	.qo-upload--in-cart {
	height: 150px;
	}
	
	.cart_item .product-name {
	font-size: 18px;
	}
	
	.cart_item .product-subtotal {
	line-height: 1.7;
	font-size: 16px;
	font-weight: 500;
	}
	
	.woocommerce-cart-form__cart-item .variation__item {
	font-size: 12px;
	padding: 4px 6px;
	}
	
	.product-item.product-quantity, .product-subtotal, .product-remove, .product-properties {
	padding: 0;
	}
	
}

@media (min-width: 940px) {
	.woocommerce-cart .woocommerce .woocommerce-cart-form {
		width: 69.84%;
	}

	.woocommerce-cart .woocommerce .cart-collaterals {
		width: 30.16%;
	}

}


@media (max-width: 639px) {

	.woocommerce-cart-form__cart-item {
		position: relative;
	}
	
}


/* ------------------------------------------------------------------
   7.4  Оформление заказа и доставка
   ------------------------------------------------------------------ */

/* -------------------------------------------------------------------------- */

/*	8. Оформление заказа
/* -------------------------------------------------------------------------- */
form.checkout.woocommerce-checkout{
	display: flex;
	justify-content: space-between;
	gap: 20px;
	align-items: flex-start;
}

.woocommerce-billing-fields, .company-fields-group, .woocommerce-additional-fields, .checkout_custom_shipping {
	background: #F5F5F5;
	border-radius: 16px;
	padding: 40px 30px;
}

.checkout-details {
	width: 69.84%;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.checkout-payment {
	width: 30.16%;
	padding: 40px 30px;
	background: #F5F5F5;
	border-radius: 16px;
}

h3#order_review_heading, 
.woocommerce-billing-fields h3, .woocommerce-additional-fields h3, .checkout_custom_shipping h3, .company-fields-group h3 {
	font-weight: 500;
	font-family: "Bounded Variable";
	font-size: 30px;
	margin: 0px 0px 30px;
}

.form-row label {
	display: none;
}

/* ── ДВЕ КОЛОНКИ ДЛЯ ПОЛЕЙ "ПОЛЬЗОВАТЕЛЬ" ────────────────────────────── */
.user-fields-group, .account-fields-group{
	/* grid = самая надёжная раскладка без костылей float/flex  */
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr)); /* 2 равных столбца */
	column-gap: 50px;  /* расстояние между столбцами */
	row-gap: 16px;     /* расстояние между рядами */
}

/* убираем нижние внешние отступы, которые WooCommerce даёт каждому <p> */
.user-fields-group .form-row{
	margin: 0;
}

/* WooCommerce по умолчанию задаёт float/width для form-row-first|last;
   в grid они не нужны, поэтому сбрасываем */
.user-fields-group .form-row-first,
.user-fields-group .form-row-last{
	float: none !important;
	width: auto !important;
}

/* ── МОБИЛЬНЫЙ БРЕЙКПОЙНТ: одна колонка ─────────────────────────────── */
@media (max-width: 780px){
	.user-fields-group{
		grid-template-columns: 1fr;
		column-gap: 0;   /* между колонками уже ничего нет */
	}
}

.custom-account-header {
	margin-top: 30px;
}

.checkout_item_more, .checkout_item_less, .custom-account-header a{
	color: #FF3600;
}

.shop_table_body {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

textarea#order_comments {
	border: none;
	border-radius: 8px;
	padding: 10px 16px;
}
textarea#order_comments::-webkit-resizer {
	resize: none; 
}
.totals-quantity {
	color: #A3A3A3;
	line-height: 1;
}

.product-total {
	font-size: 16px;
}

.checkout_item {
	display: flex;
	justify-content: space-between;
}

.woocommerce-terms-and-conditions-checkbox-text {
	font-size: 10px;
	line-height: 1.2;
	text-align: center;
	margin: 12px;
}

.woocommerce-terms-and-conditions-checkbox-text a {
	color: #262626;
	text-decoration: underline;
}

.woocommerce-terms-and-conditions-checkbox-text a:hover {
	color: #FF3600;
}

.shop_table_footer {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: 30px;
}

.shop_table_footer .order-total {
	margin: 30px 0 19px 0;
	font-family: 'Bounded Variable';
	font-size: 22px;
	font-weight: 500;
}


.shop_table_footer .order-cashback-value {
	font-weight: normal;
	color: #262626;
}

.shop_table_footer .totals-line.cart-subtotal {
	line-height: 1;
	margin-bottom: 30px;
}

.shop_table_footer .cart-discount, .shop_table_footer .total-value, .shop_table_footer .shipping-total, .shop_table_footer .order-total, .shop_table_footer .total-full-width {
	display: flex;
	justify-content: space-between;
	line-height: 1;
	align-items: center;
}

.woocommerce-checkout .wc_payment_methods {
	display: none;
}

.woocommerce-form-coupon {
	max-width: 50%;
}
.woocommerce-checkout .woocommerce {
	max-width: 100%;
}

.woocommerce-shipping-fields .customer_types {
	margin-top: 25px;
}

.estimated-delivery-checkout {
	display: flex;
	justify-content: space-between;
	margin-top: 20px;
}

.woocommerce-shipping-methods label {
	line-height: 16px;
}

.select2-container--default .select2-selection--single {
	background-color: #fff;
	border: 1px solid #dadada;
	border-radius: 10px;
}

.woocommerce-shipping-methods .shipping_method {
	vertical-align: top;
	margin: 5px 8px 0 0;
}

.woocommerce-account-fields {
	font-size: 14px;
	margin-top: 10px;
    margin-bottom: 10px;
}
.woocommerce-account-fields label {
    font-size: 14px;
}

.woocommerce-checkout .woocommerce-form-login {
	max-width: 620px;
	background-color: aliceblue;

    padding: 15px 20px 0;
    margin-bottom: 15px;
}
.woocommerce-checkout .woocommerce-form-login p:not(.form-row) {
	margin-bottom: 15px;
}
.woocommerce-form__label.woocommerce-form__label-for-checkbox.woocommerce-form-login__rememberme {
	font-size: 14px;
}

/* ── НОВЫЙ ДИЗАЙН СПОСОБОВ ДОСТАВКИ ────────────────────────────── */
.shipping-methods-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	margin-bottom: 30px;
}

.shipping-method-card {
	background: #fff;
	border-radius: 16px;
	padding: 16px;
	cursor: pointer;
	transition: all 0.3s ease;
	min-height: 120px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.shipping-method-card:hover {
	transform: translateY(-2px);
}

.shipping-method-card.active {
	color: #fff;
	background: #095EF7;
}

.shipping-method-bottom {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
	line-height: 1;
}

.shipping-method-icon i.fa-regular.fa-circle {
    color: #a3a3a3;
}

.shipping-method-header {
	flex-grow: 1;
	line-height: 18px;
}

.shipping-method-title {
	font-family: 'Golos Text';
	font-size: 16px;
	font-weight: 500;
}

.shipping-method-cost {
	color: #A3A3A3;
	display: flex;
	flex-direction: column;
	line-height: 16px;
}

.active .shipping-method-cost {
	color: #DADADA;
}

.shipping-method-details {
	display: none;
}

.shipping-method-details.active {
	display: block;
}

.shipping-method-description {
	line-height: 1;
}

.shipping-method-address-fields {
    margin-top: 16px;
}

.shipping-method-additional-fields {
	margin-top: 20px;
}


/* Скрываем оригинальные радиокнопки */
#shipping_method {
	display: none !important;
}

.shipping-method-address-fields .address-field-wrapper input.loading {
	background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="rgba(0,0,0,0.3)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><path d="M12 6v6l4 2"></path></svg>');
	background-repeat: no-repeat;
	background-position: right 10px center;
	background-size: 20px;
}


/* Мобильные стили для способов доставки */
@media (max-width: 780px) {
	.woocommerce-billing-fields, .company-fields-group, .woocommerce-additional-fields, .checkout_custom_shipping, .checkout-payment {
		padding: 30px 16px;
	}
	.shipping-methods-grid {
		grid-template-columns: 1fr;
		gap: 12px;
	}
	
	.shipping-method-card {
		padding: 16px;
		min-height: 100px;
	}
	
	.shipping-method-title {
		font-size: 14px;
	}
	
	.shipping-method-cost {
		font-size: 12px;
	}

	.shipping-method-address-fields .address-fields-row {
		flex-direction: column;
		gap: 10px;
	}
	
}

@media (max-width: 780px) {
	.shipping-method-additional-fields {
		margin-top: 0;
	}

	.shipping-method-fields-block {
		margin: 18px 0;
	}
	
	.shipping-methods-grid {
		margin-bottom: 0;
	}
	form.checkout.woocommerce-checkout {
		flex-direction: column;
	}
	.checkout-details, .checkout-payment {
	width: 100%;
	}
}

.cdekfw-map-btn {
    background-color: #262626;
    color: white;
    border: none;
    border-radius: 16px;
    padding: 12px;
    cursor: pointer;
    font-weight: 400;
    transition: background-color 0.3s ease;
    width: 100%;
    font-family: 'Bounded Variable';
    font-size: 22px;
    line-height: 1;
}

.cdekfw-map-btn:hover {
	background-color: #FF3600;
}

.cdekfw-map-btn svg {
	margin-right: 10px;
	fill: white;
}


/* ------------------------------------------------------------------
   7.5  Ошибки полей на чекауте
   ------------------------------------------------------------------ */

/* -------------------------------------------------------------------------- */
/*  Checkout: скрываем дефолтные уведомления об ошибках и подсвечиваем поля   */
/* -------------------------------------------------------------------------- */

/* Скрыть группу уведомлений WooCommerce на странице оформления заказа */
.woocommerce-checkout .woocommerce-NoticeGroup.woocommerce-NoticeGroup-checkout {
  display: none !important;
}

/* Скрыть любые стандартные inline-ошибки под полями, используем свои */
.woocommerce-checkout .checkout-inline-error-message {
  display: none !important;
}

/* Подсветка невалидных полей: красная рамка */
.woocommerce form .form-row.woocommerce-invalid .input-text,
.woocommerce form .form-row.woocommerce-invalid select,
.woocommerce form .form-row.woocommerce-invalid .select2-container--default .select2-selection--single,
.woocommerce form .form-row.woocommerce-invalid .select2-container--default .select2-selection--multiple {
  border: 2px solid #FF3600 !important;
  border-radius: 8px;
}

/* Короткое текстовое сообщение под полем */
.field-error-message {
  margin-top: 6px;
  font-size: 14px;
  line-height: 1.2;
  color: #FF3600;
}


/* ------------------------------------------------------------------
   7.6  Аккаунт
   ------------------------------------------------------------------ */

/* -------------------------------------------------------------------------- */

/*	10. Акаунт
/* -------------------------------------------------------------------------- */

#my-account-menu .user-profile .username {
    margin: 0;
    padding: 7px 0;
}

.woocommerce-order-pay .page-header {
	display: block;
}
.woocommerce-order-pay .page-header .page-title {
	font-size: 20px;
}
.woocommerce-order-pay #order_review {
	max-width: 760px;
}

.woocommerce-order-pay .repay_order_table {
	width: 100%;
}
.woocommerce-order-pay .repay_order_table tr th {
	white-space: nowrap;
}
.woocommerce-order-pay .repay_order_table tr th,
.woocommerce-order-pay .repay_order_table tr td {
    border-bottom: 1px solid #ebeced;
    font-size: 14px;
    padding: 5px;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content table.woocommerce-orders-table {
	border: none;
	padding:0;
}
.woocommerce-account .woocommerce .woocommerce-MyAccount-content table.woocommerce-orders-table tr th {
    padding: 16px;
}
.woocommerce-account .woocommerce .woocommerce-MyAccount-content table.woocommerce-orders-table tr th.woocommerce-orders-table__header-order-actions {
	text-align: right;
}
.woocommerce-account .woocommerce .woocommerce-MyAccount-content table.woocommerce-orders-table tr td {
	border-bottom: none;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content table.woocommerce-orders-table tr th,
.woocommerce-account .woocommerce .woocommerce-MyAccount-content table.woocommerce-orders-table tr td {
	padding-left: 15px !important;
	padding-right: 15px !important;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content table.woocommerce-orders-table tr th.woocommerce-orders-table__header-order-actions .nobr,
.woocommerce-account .woocommerce .woocommerce-MyAccount-content table.woocommerce-orders-table tr th.download-file .nobr,
.woocommerce-account .woocommerce .woocommerce-MyAccount-content table.shop_table.order_details tr th.woocommerce-orders-table__header-order-actions .nobr,
.woocommerce-account .woocommerce .woocommerce-MyAccount-content table.shop_table.order_details tr th.download-file .nobr {
	font-size: 14px;
}

.woocommerce .woocommerce-MyAccount-content table.woocommerce-orders-table tr td.woocommerce-orders-table__cell-order-number a {
    font-weight: 300;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content table.woocommerce-orders-table tr td {
	padding: 10px;
}

.woocommerce-account .woocommerce .woocommerce-MyAccount-content .order-status-cancelled {
    color: grey;
}
.woocommerce-account .woocommerce .woocommerce-MyAccount-content .order-status-pending {
    color: black;
}
.woocommerce-account .woocommerce .woocommerce-MyAccount-content .order-status-template-problems {
    color: red;
}
.woocommerce-account .woocommerce .woocommerce-MyAccount-content .order-status-maket {
    color: red;
}
.woocommerce-account .woocommerce .woocommerce-MyAccount-content .order-status-print {
    color: black;
}
.woocommerce-account .woocommerce .woocommerce-MyAccount-content .order-status-completed {
    color: black;
}
.woocommerce-account .woocommerce .woocommerce-MyAccount-content .order-status-pickup {
    color: green;
}
.woocommerce-account .woocommerce .woocommerce-MyAccount-content .order-status-ru_post {
    color: green;
}


.woocommerce-account .woocommerce .woocommerce-MyAccount-content table.woocommerce-orders-table tr td.woocommerce-orders-table__cell-order-actions .button,
.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-pagination--without-numbers .button {
	display: inline-block;
    padding: 8px 16px;
    background: #E60020;
    color: #fff !important;
    margin: 0 0 3px 3px;
    border-radius: 30px;
}
.woocommerce-account .woocommerce .woocommerce-MyAccount-content table.woocommerce-orders-table tr td.woocommerce-orders-table__cell-order-actions .button:hover,
.woocommerce-account .woocommerce .woocommerce-MyAccount-content .woocommerce-pagination--without-numbers .button:hover {
	background-color: #000;
	color: #fff;
}


.woocommerce-shipping-methods li input:checked + label {
	pointer-events: none;
}

.dom_travelers_fields {
	display: none;
}

@media (min-width: 640px) {
	.woocommerce-account .woocommerce .woocommerce-MyAccount-content {
		flex: 1;
		width: auto;
	}
}

span.woocommerce-terms-and-conditions-checkbox-text {
    font-size: 12px;
    font-weight: lighter;
}

a.button.wcst-myaccount-tracking-button {
	margin: 0 0 3px 3px;
}

#my-account-menu {
	width: 100%;
	float: none;
	margin-bottom: 3rem;
}

#my-account-menu.position-left,
#my-account-menu.position-right {
	padding-left: 0;
	padding-right: 0;
}

#my-account-menu .myaccount-menu:after {
	content: none;
}

#my-account-menu .myaccount-menu li i {
	display: inline-block;
}
#my-account-menu .myaccount-menu li > a {
	padding-left: 13px;
}

.woocommerce-orders-table__cell-order-total {
	min-width: 140px;
}

.woocommerce-table__product-name.product-name {
	min-width: 186px;
}

@media (min-width: 992px) {
	#my-account-menu {
		flex: 0 0 25%;
		max-width: 25%;
		padding-right: 30px;
	}
	#my-account-menu.position-left {
		padding-right: 30px;
	}
	#my-account-menu.position-right {
		padding-left: 30px;
	}
}

@media (max-width: 768px) {
	.woocommerce-order-pay .repay_order_table thead,
	.woocommerce table.woocommerce-orders-table thead,
	.woocommerce-page table.woocommerce-orders-table thead {
		display: none;
	}
	.woocommerce-order-pay .repay_order_table tbody tr:first-child td:first-child,
	.woocommerce table.woocommerce-orders-table tbody tr:first-child td:first-child,
	.woocommerce-page table.woocommerce-orders-table tbody tr:first-child td:first-child {
		border-top: 0;
	}
	.woocommerce table.woocommerce-orders-table tbody th,
	.woocommerce-page table.woocommerce-orders-table tbody th {
		display: none;
	}
	.woocommerce-order-pay .repay_order_table tbody,
	.woocommerce-order-pay .repay_order_table tfoot,
	.woocommerce-order-pay .repay_order_table tr,
	.woocommerce-order-pay .repay_order_table tr td,
	.woocommerce table.woocommerce-orders-table tr,
	.woocommerce-page table.woocommerce-orders-table tr {
		display: block;
	}
	.woocommerce-order-pay .repay_order_table tbody tr td {
		border: none;
	}
	.woocommerce-order-pay .repay_order_table tbody tr {
		border-bottom: 1px solid #ebeced;
	}
	.woocommerce-order-pay .repay_order_table tbody tr .product-quantity,
	.woocommerce-order-pay .repay_order_table tbody tr .product-subtotal {
		padding: 0 5px;
	}
	.woocommerce-order-pay .repay_order_table tbody tr .product-subtotal {
		padding-bottom: 7px;
	}
	.woocommerce-order-pay .repay_order_table tbody tr .product-subtotal {
		font-size: 17px;
	}
	.woocommerce-order-pay .repay_order_table tfoot tr th {
		border-bottom: none;
		padding-bottom: 0;
	}
	.woocommerce-MyAccount-content {
		padding: 20px;
		border: none;
	}

	.woocommerce-order-pay .repay_order_table tfoot tr:first-child .product-total,
	.woocommerce-order-pay .repay_order_table tfoot tr:last-child .product-total {
		font-size: 19px;
	}

	.woocommerce table.woocommerce-orders-table tr td,
	.woocommerce-page table.woocommerce-orders-table tr td {
		display: block;
		text-align: right !important;
	}
	.woocommerce table.woocommerce-orders-table tr td.order-actions,
	.woocommerce-page table.woocommerce-orders-table tr td.order-actions {
		text-align: left !important;
	}
	.woocommerce-order-pay .repay_order_table tbody tr td:not(:first-child):before,
	.woocommerce table.woocommerce-orders-table tr td::before,
	.woocommerce-page table.woocommerce-orders-table tr td::before {
		content: attr(data-title) ": ";
		font-weight: 700;
		float: left;
	}
	.woocommerce-order-pay .repay_order_table tbody tr td:not(:first-child):before {
		font-size: 14px;
		margin-right: 10px;
	}
	.woocommerce table.woocommerce-orders-table tr td.actions::before,
	.woocommerce table.woocommerce-orders-table tr td.product-remove::before,
	.woocommerce-page table.woocommerce-orders-table tr td.actions::before,
	.woocommerce-page table.woocommerce-orders-table tr td.product-remove::before {
		display: none;
	}
	tr.woocommerce-orders-table__row.order {
    border-radius: 10px;
    border: 1px solid #dcdcdc;
    margin-bottom: 10px;
	}
	.woocommerce table.my_account_orders tr td.order-actions,
	.woocommerce-page table.my_account_orders tr td.order-actions {
		text-align: left;
	}
	.woocommerce table.my_account_orders tr td.order-actions::before,
	.woocommerce-page table.my_account_orders tr td.order-actions::before {
		display: none;
	}
	.woocommerce table.my_account_orders tr td.order-actions .button,
	.woocommerce-page table.my_account_orders tr td.order-actions .button {
		float: none;
		margin: 0.125em 0.25em 0.125em 0;
	}
}


/* ------------------------------------------------------------------
   7.7  Подарочная карта
   ------------------------------------------------------------------ */

/* -------------------------------------------------------------------------- */

/*	11. Подарочная карта
/* -------------------------------------------------------------------------- */

	.amount_wrapper {
    font-size: 24px;
	}

	.image-transition {
  opacity: 0;
  transition: opacity 1.5s ease-in-out;
}

.image-visible {
  opacity: 1;
}


#samples-container, #email-container {
    padding: 20px 0 20px 0;
    border-top: 1px solid #dadada;
}

#image-container {
	display: flex;
}

.delivery-methods-container {
    display: flex;
    justify-content: space-around;
}

input.wps_wgm_price {
	padding: 10px;
    border-radius: 5px 0 0 5px;
}

input#wps_wgm_to_email {
    display: inline-block;
    width: auto;
    margin-left: 10px;
	padding: 2px 16px;
	border: 1px solid #dadada;
}

.wps-cart-button.single_add_to_cart_button.button.alt.support_cart {
    display: inline-block;
    margin: 0;
    padding: 10px;
    width: 100%;
    border-radius: 0 5px 5px 0;
}

.wps-cart-button.single_add_to_cart_button.button.alt.support_cart:hover {
	    border-radius: 0 5px 5px 0;

}

.input-wrapper {
    position: relative;
    display: inline-block;
    width: 100%;
}

.price-block {
	padding-top: 20px;
    border-top: 1px solid #dadada;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.wps-cgw-column p {
    margin: 0;
}

.wps_wgm_price {
    padding-right: 20px; /* Расстояние между значком валюты и числом */
}

.currency-symbol {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}
.delivery-text {
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #545454;
    padding: 20px;
}

/* переключатели видов сертификата */
.delivery-methods-container {
    display: block;
    overflow: hidden;
    width: 100%;
}
.wps-cgw-radio {
    display: inline-block;
    float: left;
    width: 50%;
}
.delivery-methods-container label {
	background: #efefef;
    cursor: pointer;
    padding: 5px;
    line-height: 34px;
    border: 1px solid #d5d5d5;
    text-align: center;
    color: #949494;
    display: block;
}
.delivery-methods-container input[type=radio] {
    display: none;
}
.delivery-methods-container input[type=radio]:checked + label {
    border-bottom: 0;
    color: #000;
    background: white;
    border-left: 0;
    border-right: 0;
}
.wps-cgw-radio:first-child label {
    border-radius: 6px 0 6px 0;
    border-left: 0;
}

.wps-cgw-radio:last-child label {
    border-radius: 0 6px 0 6px;
    border-right: 0;
}

.wps-cgw-product-image.wps-cgw-column {
    border: 1px solid #d5d5d5;
    border-radius: 6px;
    border-top: 0;
    padding-bottom: 20px;
}

/** 8 ПОДАРОЧНАЯ КАРТА **/
.wps-cgw-wrapper {
    padding: 20px;
    padding-top: 0;
}

.wps-cgw-wrapper img{
	margin: 0 0 0 100px;
}

.wps-cgw-wrapper-row.clearfix {
    display: flex;
    align-items: center;
}

.wps-cgw-main-container {
    box-sizing: border-box;
    margin: 0 auto;
    max-width: 1300px;
    width: 100%;
}

.wps-cgw-product-image-wrapper {
    border: none;
    padding: 0;
}

.wps-cgw-preview-wrapper {
    box-shadow: none;
    padding: 0;
    border: none;
}

.wps-cgw-gift-details-wrapper {
    padding: 0 20px 0 20px;
    border: none;
}

.wps-cgw-preview {
    float: left;
    width: 50%;
}

.wps-cgw-product-image {
    float: left;
    width: 50%;
}

.wps-cgw-wrapper img {
    height: auto;
    max-width: 600px;
}

.wps-cgw-column {
    margin: 0;
    padding: 0;
}

#wps_wgm_message, #wps_wgm_to_ship {
	display: none;
}

input#wps_wgm_price {
    width: 8em;
	border: 1px solid #dadada;
}

h1.product_title.entry-title {
    margin-bottom: 10px;
}

h4.wps-cgw-heading:before {
	display: none;
}

button.single_add_to_cart_button.button.alt.support_cart {
    background: #e60020;
    border-radius: 5px;
}
button.single_add_to_cart_button.button.alt.support_cart:hover{
    background: #000;
    border-radius: 5px;
}

/**адаптация подарочная карта**/
@media (max-width: 940px) {
    .wps-cgw-product-image, .wps-cgw-preview {
    width: 100%;
    }
    .wps-cgw-wrapper-row.clearfix {
    flex-direction: column-reverse;
    }
    .wps-cgw-wrapper img{
	margin: 0;
	}
    h1.product_title.entry-title {
    font-size: 24px;
    }
	input#wps_wgm_price {
    width: 6em;
	}
}
/** свитч**/
.additional-cost {
    color: #999;
    margin-left: 5px;
    font-size: 14px;
    line-height: 20px;
    transition: color 0.2s ease;
}

.ios-switch {
    display: none;
}

.ios-switch + .switch-label {
    position: relative;
    padding-left: 45px;
    cursor: pointer;
    font-size: 14px;
    line-height: 20px;
    font-weight: unset;
}

.ios-switch + .switch-label:before,
.ios-switch + .switch-label:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 30px;
    height: 16px;
    border-radius: 16px;
    background-color: #ccc;
}

.ios-switch + .switch-label:before {
    background-color: #ccc;
    transition: 0.4s ease;
}

.ios-switch + .switch-label:after {
    top: 0;
    left: 0;
    border-radius: 50%;
    background-color: #fff;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    width: 16px;
    height: 16px;
    transition: 0.2s ease;
}

.ios-switch:checked + .switch-label:before {
    background-color: #1d91fe;
}

.ios-switch:checked + .switch-label:after {
    left: 14px;
}

.ios-switch:checked + .switch-label ~ .additional-cost {
    color: #1d91fe;
}


/* ------------------------------------------------------------------
   7.8  Слайдер (swiper)
   ------------------------------------------------------------------ */

/**  swiper-slider  **/

.swiper{
	margin-bottom: 15px;
}

.swiper-slide{
	display: flex;
	justify-content: center;
    align-items: center;
    cursor: pointer;
}

.swiper-slide a{
	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	text-decoration: none;
	color: #000;
}

.swiper-slide img{
    width: 120px;
    height: 100%;
}

.swiper-slide:hover{
    background-color: rgb(202,202,202);
    border-radius: 5px;
}


.swiper-button{
	padding: 2px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: white;
	background-size: 15px;
	box-shadow: 0 0 5px rgba(0,0,0,0.5);
    color: grey;
}

.swiper-button-prev::after, .swiper-button-next::after{
	display: none;
}

.swiper-container:not(.swiper-container-initialized)>.swiper-wrapper, .swiper:not(.swiper-initialized)>.swiper-wrapper{
	overflow: unset;
}

@media (max-width: 767px){
    .swiper-slide img{
        width: 50px;
        height: 100%;
    }

    .swiper-button{
        width: 25px;
        height: 25px;
		background-size: 10px;
    }

	.swiper-slide p{
		font-size: 9px;
	}

    :root{
        --swiper-navigation-size: 20px;
    }
}


/* ------------------------------------------------------------------
   7.9  Мой аккаунт: заказы и трекинг
   ------------------------------------------------------------------ */

/* 9 Мой аккаунт */

/* Main Order Card */
.main-order-card {
	border: 1px solid #ddd;
	border-radius: 15px;
	padding: 20px 20px 0 20px;
	margin-bottom: 20px;
	background-color: #f9f9f9;
}

/* Order Card */
.order-card {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

/* Order Details */
.order-main-details {
	display: flex;
}

.order-details {
	margin-bottom: 5px;
	margin-right: 50px;
}

.dt-order {
	font-weight: lighter;
	color: #858585;
}

.dd-order {
	margin: 0;
}

/* Order Actions */
a.order-actions-button {
	background: none;
	color: #000;
}

a.order-actions-button:hover {
	color: #e60020;
}

/* Dropdown Styling */
.wc-order-actions-dropdown {
	position: relative;
	display: inline-block;
}

.wc-order-actions-dropdown i.fa-ellipsis {
	cursor: pointer;
	font-size: 18px;
	background-color: #f7f7f7;
	border-radius: 100%;
	transition: all 0.3s;
	width: 40px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.wc-order-actions-dropdown i.fa-ellipsis:hover {
	background-color: #ebebeb;
	color: #000000;
}

.wc-dropdown-menu {
	display: none;
	position: absolute;
	right: 0;
	min-width: 160px;
	background-color: white;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
	border-radius: 10px;
	padding: 10px 0;
	z-index: 1000;
	list-style: none;
	margin: 0;
}

.wc-dropdown-menu.active {
	display: block;
}

.wc-dropdown-menu li {
	padding: 0;
	margin: 0;
}

.wc-dropdown-menu a {
	display: block;
	padding: 8px 16px;
	text-decoration: none;
	color: #515151;
	font-size: 14px;
	transition: background-color 0.3s;
}

.wc-dropdown-menu a:hover {
	background-color: #f7f7f7;
	color: #000000;
}

/* Order Tracking */
.order-tracking {
	display: flex;
	align-items: center;
	position: relative;
	margin: 20px;
}

.tracking-line-background {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	height: 4px;
	background: #ddd;
	transform: translateY(-50%);
	z-index: 1;
}

.tracking-line-fill {
	position: absolute;
	top: 50%;
	left: 0;
	height: 4px;
	background: #008bff;
	transform: translateY(-50%);
	z-index: 2;
	transition: width 0.5s ease-in-out;
}

.tracking-status {
	flex: 1;
	text-align: center;
	position: relative;
	z-index: 3;
}

.tracking-status .status-icon {
	display: inline-block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	margin-bottom: 10px;
	position: relative;
	z-index: 4;
}

.tracking-status .status-icon i {
	font-size: 1.2em;
	color: #858585;
}

.tracking-status.active .status-icon i {
	color: #008bff;
}

.special-icon i {
	font-size: 1.5em;
	color: #e60020;
}

.special-icon i.fa.fa-check,
.special-icon i.fa.fa-truck {
	color: #008cff;
}

.tracking-status .status-title {
	font-size: 0.8em;
	color: #858585;
	z-index: 4;
}

.tracking-status.active .status-title {
	color: #000;
}

/* Mobile Adjustments */
@media only screen and (max-width: 768px) {
	
	.main-order-card {
		padding: 0 20px 0 20px;
	}
	
	.order-card {
		position: relative;
		padding-top: 20px; /* Space for actions at the top */
		flex-direction: column;
		align-items: flex-start;
	}

	.order-main-actions {
		position: absolute;
		top: 10px;
		right: 0px;
		width: auto; /* Override width: 100% */
		margin-top: 0; /* Override margin-top: 10px */
	}

	.order-main-details {
		flex-direction: column;
		margin-right: 0;
		width: 100%; /* Ensure details take full width */
	}

	.order-details {
		margin-right: 0;
		margin-bottom: 10px;
	}

	/* Dropdown Menu Adjustments (existing) */
	.wc-dropdown-menu {
		width: 180px;
		right: -60px; /* Shift left on mobile */
	}

	.wc-dropdown-menu:after {
		right: 75px; /* Adjust arrow position */
	}

	.wc-order-actions-dropdown i.fa-ellipsis {
		padding: 8px 12px; /* Larger click area */
	}

	/* Tracking Adjustments for Mobile */
	.order-tracking {
		margin: 10px 0; /* Reduce margin for tighter layout */
	}

	.tracking-status .status-title {
		font-size: 0.75em; /* Slightly smaller text for readability */
	}

	.tracking-status .status-icon {
		width: 18px; /* Slightly smaller icons */
		height: 18px;
	}
}

 .woocommerce-customer-details-wrapper {
        border: 1px solid #ddd;
        border-radius: 10px;
        padding: 15px;
        display: flex;
        justify-content: space-between;
    }
    .woocommerce-column {
        flex: 1;
        margin-right: 20px;
    }
    .woocommerce-column:last-child {
        margin-right: 0;
    }
    table.table-itogo {
    width: 100%;
	}
    .table-itogo tfoot tr {
    display: flex;
    justify-content: space-between;
    width: 100%;
	}

	a.button-in-order {
    color: #000;
    background: #dddddd;
    padding: 5px 10px;
    border-radius: 5px;
    display: inline-block;
    margin: 5px;
    text-align: center;
}

a.button-in-order:hover {
    background: #858585;
}

.bfw-card {
	color: #fff;
	box-shadow: none;
	box-shadow: 0 10px 20px 0 rgb(178 176 176);
	border: none;
	border-radius: 25px;
	padding: 30px;
	background: radial-gradient(100% 283.68% at 0 100%, #fcab14 0, #fa6641 15.91%, #e60020 40.21%, rgba(80, 90, 221, 0) 100%), radial-gradient(107.24% 195.45% at 100% 0, #48cce0 0, #428beb 28.85%, #505add 60.18%);
	background-size: 200% 200%;
	animation: gradient 10s ease infinite;
	transform: translate3d(0, 0, 0);
	max-width: 450px;
	margin: 50px auto;
}

.bfw-progressbar-title {
	color: #000;
	margin: 5px;
	font-weight: lighter;
}

small.remaining-amount {
	text-align: center;
	display: flex;
	justify-content: center;
	margin: 5px;
}

span.value_bca {
	display: inline-block;
}

.bfw-account_status_name {
	font-size: 30px;
	font-weight: bold;
}

.bfw-account_percent {
	margin-top: 0px;
	font-size: 14px;
	font-weight: normal;
}

.bfw-account_count_points {
	font-size: 21px;
	margin-top: 100px;
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
}

ol.bfw-progress-bar {
    display: none !important;
}

#bfw-progressbar {
	border-radius: 13px;
	padding: 3px;
	border: 1px solid #dddddd;
	padding: 5px;
}

#bfw-progressbar > div {
	background: #0c8cff;
	height: 10px;
	border-radius: 10px;
	position: relative;
}

.devider {
	border-bottom: 1px solid #dddddd;
	margin: 50px 0;
}

.dataTables_info {
	display: none;
}

.dataTables_wrapper .dataTables_paginate {
	float: none !important;
	text-align: center !important;
	padding-top: 20px !important;
}


/* ==============================================================================
   8. БЛОГ
   ============================================================================== */

/* Override blog blockquote borders */
.single-post blockquote:not(.post-format-quote) {
    border-top: 1px solid #A3A3A3;
    border-bottom: 1px solid #A3A3A3;
}

/* Related Articles block (single post) */
.ss-related-articles {
    /* Breakout of narrow article column to full site width */
    position: relative;
    left: 50%;
    right: 50%;
    width: 100vw;
    max-width: 100vw;
    margin-left: -50vw;
    margin-right: -50vw;
    padding: 60px 20px 40px;
    box-sizing: border-box;
    overflow-x: hidden;
}
.ss-related-articles__title {
    text-align: center;
    margin: 0 auto 40px;
    max-width: 1280px;
}
.ss-related-articles__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    max-width: 1280px;
    margin: 0 auto;
}
.ss-related-articles__card {
    display: flex;
    flex-direction: column;
}
.ss-related-articles__thumb {
    display: block;
    overflow: hidden;
    border-radius: 16px;
    margin-bottom: 20px;
    aspect-ratio: 16 / 9;
    background: #f0f0f0;
}
.ss-related-articles__thumb img {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 16px;
    object-fit: cover;
}
.ss-related-articles__card-title {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 12px;
    line-height: 1.3;
    min-height: 2.6em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.ss-related-articles__card-title a {
    color: inherit;
    text-decoration: none;
}
.ss-related-articles__card-title a:hover {
    color: #ff3600;
}
.ss-related-articles__excerpt {
    font-size: 16px;
    line-height: 1.5;
    color: #595959;
    margin: 0 0 16px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.ss-related-articles__link {
    color: #095EF7;
    text-decoration: none;
    font-weight: 500;
    font-size: 16px;
    margin-top: auto;
}
.ss-related-articles__link:hover {
    text-decoration: underline;
}
@media (max-width: 780px) {
    .ss-related-articles__grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .ss-related-articles {
        padding: 40px 20px 20px;
    }
}
