@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');


/* === CSS ПЕРЕМЕННЫЕ === */
:root {
  --font-family: 'Rubik', sans-serif;

  --color-body: #f4f4f4;
  --color-accent: #f45792;
  --color-dark: #1e5945;

  --font-size-h1: 3rem;
  --font-size-h2: 2.5rem;
  --font-size-h3: 2rem;
  --font-size-p: 18px;
  --font-size-p-big: 20px;

  --line-height-h1: 50px;
  --line-height-h2: 42px;
  --line-height-h3: 36px;
  --line-height-p: 28px;
  --line-height-p-big: 30px;
}

html, body {
  margin: 0;
  padding: 0;
  font-family: var(--font-family);
  font-size: var(--font-size-p);
  line-height: var(--line-height-p);
  height: 100%;
  
}

body {
  background-image: url('/images/bg.webp');
  background-repeat: repeat; /* повторяет узор */
  background-size: auto; /* можно заменить на 'cover' или 'contain', если нужно масштабировать */
  background-position: top left;
  background-color: #f9f9f9;
}

.site-wrapper {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

a {
  color: var(--color-accent);
  text-decoration: none;
  transition: color 0.2s ease;
}

a:hover {
  text-decoration: underline;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 500;
  margin: 0 0 1rem;
  line-height: 1;
  color:var(--color-dark)
}

h1 {
  font-size: var(--font-size-h1);
  margin-bottom:3rem;
}

button {
  font-family: var(--font-family);
  cursor: pointer;
  border: none;
  border-radius: 6px;
  transition: all 0.2s ease;
}

.container {
  max-width: 1260px;
  margin: 0 auto;
  padding: 2rem 1rem;
}

@media (max-width: 768px) {
  h1 {
    font-size: 40px;
    line-height: 44px;
  }
}

/* Общий фон и центрирование */
.page-wrapper {
  background-color: #f4f4f4;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
}

/* Общая обёртка профиля */
.page-box {
  background: #fff;
  border-radius: 16px;
  padding: 50px;
  max-width: 880px;
  margin: 0 auto;
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.05);
}

.page-box.register-box {
  background: #F45792;
  background: linear-gradient(75deg,rgba(244, 87, 146, 1) 0%, rgba(199, 60, 164, 1) 100%);
}

@media (max-width: 768px) {
	.page-box {
		padding: 10px;
	}
}

/* Внутренний блок с отступами */
.content-inner {
  padding: 2rem 2rem 3.5rem;
}

@media (max-width: 768px) {
  .content-inner {
    padding: 2rem 1rem;
  }
  .page-wrapper {
  padding: 2rem 1rem;
  }
}

/* Картинка */
.content-cover {
  width: 100%;
  display: block;
  margin: 0;
  padding: 0;
  border-radius: 16px 16px 0 0;
}

/* Карточка */
.content-card {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
  width: 100%;
  max-width: 600px;
  text-align: left;
  position: relative;
  overflow: hidden;
}

.payment-error {
  background-color: #fce4e4;
  border: 1px solid #fcc2c3;
  padding: 20px 30px;
  color: #cc0033;
  margin-bottom:2rem;
}




/* === ГЛАВНАЯ СТРАНИЦА === */


.home-wrapper {
  padding: 6.25rem 1rem;
  text-align: center;
}

@media (max-width: 768px) {
  .home-wrapper {
    padding: 3rem 1.25rem;
  }
}

.home-image {
  max-width: 100%;
  height: auto;
  margin-bottom: 2rem;
  border-radius: 8px;
}


/* Кнопки */
.payment-button, .accept-button {
  width: 60%;
  padding: 16px 0;
  font-size: 15px;
  border: none;
  border-radius: 50px;
  cursor: pointer;
  display: block;
  margin-top: 1rem;
  text-transform: uppercase;
  transition: background 0.3s;
  font-weight: 500;
  margin: 1rem auto 0;
}

@media (max-width: 768px) {
  .payment-button, .accept-button {
  margin:1rem auto 0;
  width: 100%;
  }
}

.payment-button:disabled {
  background-color: #ccc;
  color: #666;
  cursor: not-allowed;
}

.payment-button:not(:disabled) {
  background-color: #8dc63f;
  color: #fff;
}

.payment-button:not(:disabled):hover {
  background-color: #79BC3E;
}

.payment-checkboxes .accept-button {
  background-color: #ff9c00;
  color: #fff;
  margin-top:2.5rem;
}

.accept-button:hover {
  background-color: #e68a00;
}

.tg-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background-color: #229ED9;
  color: #fff;
  padding: 14px 0px;
  border-radius: 50px;
  font-size: 15px;
  font-weight: 500;
  text-transform: uppercase;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: background 0.3s;
  margin: 2rem auto 0;
  width: 60%;
}


.gv-button {
  width: 60%;
  padding: 16px 0;
  font-size: 15px;
  border: none;
  border-radius: 50px;
  cursor: pointer;
  display: block;
  margin-top: 1rem;
  text-transform: uppercase;
  transition: background 0.3s;
  font-weight: 500;
  margin: 1rem auto 0;
  background-color:rgba(0,0,0,0.3);
  color:white;
  text-align:center;
}

.gv-button:hover {
  background-color:#79bc3e;
  color:white;
}

.tg-button:hover {
  background-color: #1b7cb2;
  color: white;
}

.tg-button img {
  width: 20px;
  height: 20px;
}

@media (max-width: 768px) {
  .tg-button {
    width:auto;
  }
  .gv-button {
  width: 100%;
  }
}


/* Layout fix for sticky footer */
body, html, #root {
  height: 100%;
  margin: 0;
}

#root {
  display: flex;
  flex-direction: column;
}

main {
  flex: 1 0 auto;
}

.site-footer {
  flex-shrink: 0;
}

main {
  flex-grow: 1;
}

/* === Header === */

.site-header {
  width: 100%;
  background: linear-gradient(90deg, #f0cccc, #f45792);
  padding: 20px 0;
  color: white;
  flex-shrink: 0;
}

.header-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  align-items: center;
  height: 60px; /* высота шапки */
  justify-content: space-between;
}

.logo {
  display: flex;
  align-items: center;
  height: 100%;
  margin-right: 16px;
}

.logo img {
  max-height: 60px; /* или нужный размер */
  height: auto;
  width: 164px;
  vertical-align: middle;
}

.search-bar {
  flex: 1;
  margin: 0 20px;
}

.search-input-wrapper {
  display: flex;
  align-items: center;
  background: white;
  border-radius: 16px;
  overflow: hidden;
}

.search-input-wrapper input {
  border: none;
  padding: 17px 20px 17px 0px;
  font-size: 18px;
  line-height: 24px;
  width: 100%;
  outline: none;
}

.search-icon {
  width: 28px;
  height: 26px;
  margin-right: 10px;
  margin-left: 12px;
  vertical-align: middle;
  color: #c8c8d1;
}

.header-icons {
  display: flex;
  align-items: center;
  gap: 16px;
}

.icon-button {
  color: white;
  text-decoration: none;
  font-size: 20px;
}


/* Логин-иконка */

.header-login {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  margin-right: 20px;
}

.login-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  color: white;
  font-size: 12px;
}

.login-link:hover, .login-link:hover .login-text {
	opacity:1;
	color:white;
}

.login-icon {
  width: 30px;
  height: 30px;
}

.login-text {
  margin-top: 6px;
  line-height: 14px;
  font-size: 14px;
  opacity:0.7;
}


/* Бургер-меню */
.burger-wrapper {
  display: flex;
  align-items: center;
}

.burger {
  width: 58px;
  height: 58px;
  background: 0 0;
  border: 1px solid rgba(255, 255, 255, .4);
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.burger span {
  background: #fff;
  border-radius: 3px;
  width: 26px;
  height: 3px;
  margin: 3px 0;
  border-radius: 1px;
}


/* Адаптив */
@media (max-width: 768px) {
  .nav {
    display: none;
    flex-direction: column;
    background: var(--color-dark);
    position: absolute;
    top: 70px;
    right: 1rem;
    padding: 1rem;
    border-radius: 8px;
  }

  .nav.open {
    display: flex;
  }

  .burger {
    display: flex;
  }
}

.mobile-menu {
  position: fixed;
  top: 0;
  right: -100%;
  width: 260px;
  height: 100%;
  background: #f45792;
  color: white;
  z-index: 1001;
  padding: 2rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  transition: right 0.3s ease;
}

.mobile-menu.open {
  right: 0;
}

.mobile-menu nav {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 4rem;
}

.mobile-menu nav a {
  color: white;
  font-size: 16px;
  font-weight: 500;
  text-decoration: none;
  text-transform: uppercase;
  padding: 7px 0px 5px 12px;
  border-radius: 30px 0px 0px 30px;
  transition: all 0.3s ease;
}

.mobile-menu nav a:hover {
  padding-left:20px;
}

.mobile-menu nav a.active {
  color: #fff;
  background: #FFF;
  background: linear-gradient(90deg,rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
}

.close-btn {
  position: absolute;
  top: 1rem;
  right: 1rem;
  background: transparent;
  border: none;
  font-size: 2rem;
  color: white;
  cursor: pointer;
}

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.4);
  z-index: 1000;
}

/* ПК-меню */
.desktop-nav {
  display: flex;
  gap: 2rem;
}

.desktop-nav a {
  color: white;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  text-transform: uppercase;
}

.desktop-nav a:hover {
  color: var(--color-accent);
}

.desktop-nav a.active {
  color: #ff9c00;
}

/* Скрываем ПК-меню на мобильных */
@media (max-width: 768px) {
  .desktop-nav {
    display: none;
  }
}


/* === Main === */

.main-content {
  flex-grow: 1;
  padding: 50px 20px;
}

.main-inner {
  max-width: 1200px;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .main-content {
    padding: 30px 10px;
  }
  .main-inner {
    text-align: left;
    
  }
}


.main-inner p {
  font-size: 18px;
  margin-bottom: 30px;
  color: #444;
}

.main-button {
  display: inline-block;
  padding: 12px 24px;
  background: linear-gradient(90deg, #8e00ff, #d000f9);
  color: white;
  font-size: 16px;
  border-radius: 8px;
  text-decoration: none;
  transition: 0.2s;
}

.main-button:hover {
  opacity: 0.85;
}



/* ====== FOOTER (gvpitanie) ============================================ */
.tpf-footer{
  background: linear-gradient(90deg, #8dcee4, #38acdb);
  color:#cfd3dc;
  font-size:14px;
  line-height:1.5;
}
.tpf-footer a{ color:#fff; text-decoration:none; }
.tpf-footer a:hover{ text-decoration:underline; }

/* --- Верхняя зона: 3 колонки ----------------------------------------- */
.tpf-wrap{
  max-width:1200px;
  margin:0 auto;
  padding:50px 20px 24px;
  display:grid;
  grid-template-columns: 1.1fr 1.6fr .7fr; /* контакты / 2 колонки ссылок / бейджи */
  gap:48px;
}

/* Левая колонка (контакты) */
.tpf-col--contact .tpf-phone, .tpf-col--contact .tpf-mail { font-size:24px; font-weight:700; color:#fff; }
.tpf-col--contact .tpf-sub { color:rgba(255,255,255,0.65); font-size:13px; font-weight:400;}
.tpf-mail { margin-top:18px; display:inline-block; font-weight:600; }
.tpf-note { margin-top:12px; color: rgba(255,255,255,0.65); font-size:12px; max-width:340px; }
.tpf-copy { margin-top:18px; color: rgba(255,255,255,0.65); font-size:12px; }

/* Соц-сети */
.tpf-socials{ display:flex; gap:10px; }
.tpf-socials img{ width:28px; height:28px; display:block; }

/* Телефон + соц-иконки (моб. вариант в строку) */
.tpf-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }

/* Десктоп: виден «нижний» блок соц-иконок под почтой, «верхний» скрыт */
.tpf-socials--head{ display:none; }
.tpf-socials--desktop{ display:flex; gap:10px; margin-top:18px; }

/* Центр: ДВЕ колонки ссылок */
.tpf-col--links{
  display:grid;
  grid-template-columns: repeat(2,1fr);
  gap:24px;
}

/* --- Аккордеоны ------------------------------------------------------- */
.tpf-acc{ border:0; }
.tpf-acc > summary{
  list-style:none;
  cursor:pointer;
  font-weight:700;
  color:#fff;
  font-size:24px;
  padding:0px 24px 0px 0;        /* место справа под стрелку */
  position:relative;
  display:flex; align-items:center;
}
.tpf-acc > summary::-webkit-details-marker{ display:none; }

.tpf-acc > summary::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0; /* линия под текстом */
  width: 70%; /* длина линии */
  height: 1px;
  bottom: -10px;
  background-color: rgba(255,255,255,0.4);
}

.tpf-acc > ul{
  margin:8px 0 0 0; padding:0; list-style:none;
  display:flex; flex-direction:column; gap:8px; line-height:36px;
}
.tpf-acc > ul a{ color:#ffffff; font-weight:400; }
.tpf-acc > ul a:hover{ color:#fff; }

/* Стрелка (chevron). По умолчанию — ВНИЗ (закрыто). */
.tpf-acc > summary::after{
  content:"";
  position:absolute; right:0; top:50%;
  width:24px; height:24px;
  transform:translateY(-50%) rotate(0deg); /* вниз */
  transition:transform .2s ease;
  background:center/contain no-repeat
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
}
/* Открыто — ВВЕРХ */
.tpf-acc[open] > summary::after{ transform:translateY(-50%) rotate(180deg); }

/* Правая колонка: бейджи вертикально */
.tpf-col--badges{
  display:flex; flex-direction:column; gap:14px; align-items:flex-start;
}
.tpf-col--badges img{ width:224px; height:60px; object-fit:contain; filter:grayscale(20%); }

@media (max-width:768px){
	.tpf-col--badges img{ width:280px; height:75px;}
}

/* --- Нижняя полоса ---------------------------------------------------- */
.tpf-bottom{
  border-top:1px solid rgb(255, 255, 255, 0.4);
  margin:20px auto;
  padding:20px;
  max-width:1200px;
}
.tpf-actions{ display:flex; align-items:center; gap:14px; padding: 20px 0; margin-bottom: 10px;}
.tpf-actions .tpf-support{ margin-left:auto; }  /* кнопка вправо */
.tpf-support {
	border: 2px solid #ffffff;
    padding: 10px 15px;
    border-radius: 7px;
}
.tpf-support:hover {
	text-decoration:none !important;
}

.tpf-support{
  display:inline-flex; align-items:center; gap:8px; text-decoration:none;
}
.tpf-support img{ width:18px; height:auto; display:block; }

.tpf-logo{ height:50px; width:auto; display:block; }
.tpf-cookie{ max-width:1200px; margin:0 auto; color:rgba(255,255,255,0.65); font-size:12px; }

/* ====================== АДАПТИВ ====================================== */
@media (max-width:1024px){
  .tpf-wrap{ grid-template-columns:1fr; gap:28px; }
  .tpf-col--links{ grid-template-columns:1fr; gap:0px; }
  .tpf-actions{ flex-direction:column; align-items:flex-start; }
  .tpf-actions .tpf-support{ margin-left:0; }
}

/* Мобилка (≤768px): соц-иконки у телефона, email скрываем, стрелки показываем */
@media (max-width:768px){
  .tpf-phone{ font-size:18px; line-height:1.2; }
  .tpf-mail{ display:none; }

  .tpf-socials--head{ display:flex; gap:10px; }
  .tpf-socials--desktop{ display:none; }
  .tpf-acc > summary::before {display:none;}

  /* деликатные разделители у аккордеонов */
  .tpf-acc{ border-top:1px solid rgba(255,255,255,.4); padding-top:24px; padding-bottom: 24px;}

  /* кнопку поддержки скрываем */
  .tpf-support{ display:none !important; }
}

/* Десктоп (≥769px): аккордеоны ВСЕГДА раскрыты, стрелок нет, заголовок не кликабелен */
@media (min-width:769px){
  /* показываем содержимое независимо от атрибута open */
  .tpf-acc > *:not(summary){ display:block !important; }
  /* стрелки убираем и отключаем курсовый указатель */
  .tpf-acc > summary::after{ display:none !important; }
  .tpf-acc > summary{ cursor:default; }
}

@media (min-width:769px){
  .tpf-acc > summary{ pointer-events:none; margin-bottom: 30px;}
}

/* по умолчанию мобильную копию не показываем */
.tpf-note--mobile, .tpf-copy--mobile { display: none; }


/* мобилка: оригинал прячем, копию под логотипом показываем */
@media (max-width: 768px){
  .tpf-col--contact .tpf-note,  .tpf-copy { display: none; }   /* верхний текст скрыть */
  .tpf-note--mobile, .tpf-copy--mobile {
    display: block;
    margin-top: 10px;         /* отступ под логотипом */
    color: color:rgba(255,255,255,0.65);
    font-size: 12px;
    max-width: 540px;         /* можно ширину подстроить */
  }
}




/* === Карточки на Главной === */

.cards-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* ❗ Чётко 2 карточки в ряд */
  gap: 20px;
  max-width: 1200px;
  margin: 40px auto;
  padding: 0 20px;
}

@media (max-width: 640px) {
.cards-grid {
    grid-template-columns: 1fr;
	margin: 0px auto;
	padding: 0px;
  }
}

.card {
  display: flex;
  flex-direction: column;
  background: white;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
  text-decoration: none;
  color: inherit;
  transition: 0.2s;
}


.card:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 15px rgba(0,0,0,0.1);
  text-decoration:none;
}

.card-image {
  height: 0;
  padding-top: 100%; /* 4:4 соотношение */
  background-size: cover;
  background-position: center;
  position: relative;
}

.card-title {
  padding: 30px 15px 15px 15px;
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  text-align: center;
  color: #333;
}

.card-title span {
  display: block;
  font-size: 24px;
  font-weight: 700;
  text-transform: uppercase;
}

.card-footer {
  padding: 5px 15px 30px 15px;
  text-align: center;
}

.card-button {
  background: linear-gradient(90deg, #8dcee4, #58d0f4);
  border: none;
  color: white;
  padding: 15px 50px;
  border-radius: 50px;
  cursor: pointer;
  font-size: 16px;
  transition: 0.2s;
}

.card-button:hover {
  opacity: 0.9;
}

/* === Страница Меню === */

/* Заголовки и вступление */
h1 {
  font-size: 32px;
  margin-bottom: 10px;
  color: #333;
}

.intro {
  font-size: 18px;
  margin-bottom: 30px;
  color: #666;
  line-height: 1.6;
}

/* Форма выбора дня */
form {
  margin: 30px 0;
}

label[for="day"] {
  font-size: 16px;
  margin-right: 10px;
  font-weight: 500;
}

select {
  padding: 10px 14px;
  border-radius: 12px;
  border: 1px solid #ccc;
  background-color: #fff;
  font-size: 16px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
  transition: 0.3s;
}
select:hover {
  border-color: #ff99cc;
}

.day-selector {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 5px;
  margin-bottom: 15px;
}

.day-selector label {
  font-weight: bold;
  margin: 0 auto;
}

.day-selector select {
  width: 100%;
  max-width: 880px;
  margin: 0 auto;
}


/* Стилизация <select> */
select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-color: #ffffff;
  border: 1px solid #ddd;
  border-radius: 12px;
  padding: 16px 50px 16px 50px;
  text-align: center;
  font-size: 18px;
  color: #333;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg width='10' height='6' viewBox='0 0 10 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23999'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 10px 6px;
  cursor: pointer;
}

select:focus {
  border-color: #ff99cc;
  outline: none;
}

/* Ограничения: стилизовать <option> нельзя полноценно во всех браузерах, но можно сделать плавный переход при смене */
option {
  color: #333;
  background: #fff;
}



/* Заголовок выбранного дня */
h2 {
  font-size: 24px !important;
  margin: 20px 0 30px;
  color: #222;
}

/* Аккордеон */
.accordion {
  max-width: 880px;
  margin: 0 auto;
  text-align: left;
}

.accordion-item {
  margin-bottom: 16px;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
  background: #fdfdff;
  border: 1px solid #eee;
}

.accordion-toggle {
  background: linear-gradient(90deg, #ffe6f0, #e6f5ff);
  color: #333;
  padding: 16px 20px;
  font-size: 18px;
  font-weight: 500;
  border: none;
  width: 100%;
  text-align: left;
  cursor: pointer;
  transition: background 0.3s;
  border-radius:0px;
}
.accordion-toggle:hover {
  background: linear-gradient(90deg, #ffd6ec, #d4f0ff);
}

.accordion-content {
  background: #fff;
  padding: 18px 20px;
  display: none;
}

@media (max-width: 768px) {
	.accordion-content {
	padding: 10px;
	}
}

.accordion-content p {
  
}

.accordion-content ul {
  padding-left: 0px;
  margin: 0;
  list-style:none;
}

.accordion-content ul li {
  margin-bottom: 8px;
  color: #333;
  line-height: 1.5;
  position: relative;
}

.accordion .locked-block {
	background: linear-gradient(180deg, rgba(222, 239, 255, .7) 0%, rgba(255, 230, 245, .7) 100%);
	padding:20px;
	border-radius:16px;
}
.accordion .locked-block .reg-menu__btn--primary {
	margin: 10px 0px 0px;
}


/* === Страница Оплаты === */

input[type="email"] {
  width: 100%;
  padding: 14px;
  border: 1px solid #ccc;
  border-radius: 50px;
  font-size: 16px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}

input[type="email"]:focus, input[type="email"]:active {
  border: 1px solid #ff99cc;
  outline: none;
}


.checkbox-group {
  display: flex;
  flex-direction: column;
  align-items: start;
  font-size: 14px;
  margin-bottom: 25px;
  color: #333;
}

.checkbox-row label {
  margin: 8px 0;
  align-items: center;
  font-size: 12px;
}

.checkbox-row input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  background-color: transparent;
  border: 1px solid #a1a1a1;
  width: 18px;
  height: 18px;
  cursor: pointer;
  position: relative;
  border-radius: 5px;
}

.checkbox-row input[type="checkbox"]:checked::after  {
  content: "✓";
  color: #ff99cc;
  font-size: 14px;
  position: absolute;
  left: 2px;
  top: -1px;
}

.checkbox-row input[type="checkbox"]:checked {
  border: 1px solid #ff99cc;;
}

.checkbox-row label a {
  color: #8e00ff;
  text-decoration: none;
}

.checkbox-group a:hover {
  text-decoration: underline;
}

.payment-button2 {
  background: linear-gradient(90deg, #8dcee4, #58d0f4);
  color: #fff;
  font-weight: 600;
  border: none;
  padding: 16px 32px;
  border-radius: 30px;
  font-size: 16px;
  cursor: pointer;
  width: 100%;
  margin-top: 24px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  transition: background 0.3s;
}




/* === Страница Login === */

.auth-box {
  max-width: 400px;
  margin: 40px auto;
  background: #fff;
  padding: 40px 40px;
  border-radius: 24px;
  box-shadow: 0 0 20px rgba(0,0,0,0.05);
  text-align: center;
}

.auth-box h1 {
  margin-bottom: 30px;
  font-size: 28px;
  font-weight: 600;
}

.form-auth .form-group {
  
}

.form-auth .form-group input[type="email"], .form-auth .form-group input[type="password"] {
  width: 100%;
  padding: 14px;
  border: 1px solid #ccc;
  border-radius: 50px;
  margin-bottom: 20px;
  font-size: 16px;
  max-width: 300px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}

.form-auth .form-group input[type="email"]:focus, .form-auth .form-group input[type="email"]:active,
.form-auth .form-group input[type="password"]:focus, .form-auth .form-group input[type="password"]:active {
  border: 1px solid #ff99cc;
  outline: none;
}

.btn-login, a.btn-login {
  background: linear-gradient(90deg, #8dcee4, #58d0f4);
  color: #fff;
  font-weight: 600;
  border: none;
  padding: 16px 32px;
  border-radius: 30px;
  font-size: 16px;
  cursor: pointer;
  width: 100%;
  max-width: 320px;
  margin-top: 24px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  transition: background 0.3s;
}

.btn-login:hover, a.btn-login:hover {
  opacity: 0.9;
  color: #fff;
}

.form-success {
	max-width: 300px;
    margin: 0 auto;
}

.btn-enter {
  background: linear-gradient(90deg, #8dcee4, #58d0f4);
  color: #fff;
  font-weight: 600;
  border: none;
  padding: 12px 32px;
  border-radius: 30px;
  font-size: 16px;
  cursor: pointer;
  max-width: 320px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  transition: background 0.3s;
  margin:0 auto;
  text-transform:uppercase;
  display:block;
}

.btn-enter:hover {
  opacity: 0.9;
  color: #fff;
}

.auth-links {
  margin-top: 20px;
  font-size: 14px;
}

.auth-links p {
	margin:0px;
}

.auth-links a {
  color: #ed6693;
  text-decoration: none;
}

.auth-links a:hover {
  text-decoration: underline;
}


.form-error {
    color: red;
    text-align: center;
    margin-bottom: 15px;
    font-size: 16px;
    background-color: #ffecec;
    border: 1px solid #ffc3c3;
    border-radius: 24px;
    padding: 15px 0;
    max-width: 320px;
    margin: 0 auto;
}

.btn-login[disabled] {
    background: linear-gradient(90deg, #bbbbbb, #8d8d8d);
    color: #fff;
    cursor: not-allowed;
    opacity: 0.6;
  }
 
 
.smart-captcha {
	min-width:250px !important;
	max-width:330px;
	margin:0 auto;
}

@media (max-width: 768px) {
  .btn-login {
  max-width: 290px; 
  }
  .form-auth .form-group input[type="email"], .form-auth .form-group input[type="password"] {
  max-width: 260px;
  }
  
  .smart-captcha {
  max-width:290px;
  margin:0 auto;
  }

}





/* === Страница Profile === */



/* Заголовок профиля */
.profile-main-section {
	border-bottom:1px solid #e0e6ef;
}

.profile-access-section, .profile-subscription-management {
	border-bottom:1px solid #e0e6ef;
	padding: 30px 0 60px 0;
}

.profile-recommendation-section {
	padding-top: 30px;
}



.profile-header {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 50px 0;
}

@media (max-width: 768px) {
	.profile-access-section, .profile-subscription-management {
	padding: 10px 0 40px 0;
	}

	.profile-recommendation-section {
	padding-top: 10px;
	}
	.profile-header {
	padding: 20px 0;
	}
}

.profile-avatar img {
  border-radius: 200px;
  width: 200px;
}
.profile-header .info {
  flex-grow: 1;
}
.profile-header .email {
  font-weight: 500;
  font-size: 18px;
  margin-bottom: 6px;
}
.profile-header .since {
  font-size: 14px;
  color: #888;
}
.profile-info form .logout-btn {
    cursor: pointer;
    border: none;
    transition: all 0.2s ease;
    background: none;
    font-weight: bold;
    color: #f12b8a;
	padding: 0px;
	font-size: 18px;
}

.profile-info p {
    margin: 10px 0;
}

.profile-info form {
margin: 0px 0px 30px 0;
}

@media (max-width: 768px) {
  .profile-header {
    flex-direction: column;
  }

  .profile-info {
    align-items: center;
  }
}


/* Карточки */
.section-title {
  font-size: 16px;
  font-weight: 600;
  margin: 32px 0 16px;
}

.card-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.access-card {
  display: flex;
  background: linear-gradient(135deg, #e2e8ff, #f0f4ff);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.03);
}
.access-card .info {
  flex: 1;
  padding: 20px;
}
.access-card .info h3 {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 8px;
}
.access-image-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 20px;
}

.access-image-card img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
}

@media (max-width: 768px) {
  .access-image-grid {
    grid-template-columns: 1fr;
  }
}

.subscription-management {
  margin-top: 40px;
}

.subscription-box {
  background: #f0f0f0;
  border-radius: 12px;
  padding: 30px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.subscription-info {
  font-size: 16px;
  color: #000;
}

.subscription-info p {
	margin:10px 0px;
	
}

.subscription-info .status {
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 8px;
}

.subscription-actions {
  text-align: right;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: center;
}


.subscription-actions a:hover {
	color:#f12b8a;
}


.btn-history {
  background: #fff;
  border: none;
  padding: 8px 16px;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 600;
}

.btn-get-access {
  background: linear-gradient(90deg, #8dcee4, #58d0f4);
  border: none;
  color:#fff;
  padding: 8px 16px;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 600;
}

.cancel-link {
  color: #000;
  text-decoration: underline;
  font-size: 14px;
  cursor: pointer;
  margin-top:10px;
}

@media (max-width: 768px) {
  .subscription-box {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }

  .subscription-actions {
    text-align:center;
  }
}


.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(30, 30, 30, 0.7);
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding-top: 60px;
  z-index: 1000;
}

.modal-window {
  background: #fff;
  border-radius: 20px;
  width: 100%;
  max-width: 520px;
  padding: 20px;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
  max-height: 80vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 25px;
}

.modal-header h2 {
  font-size: 24px;
  margin: 0;
}

.modal-close {
  background: none;
  border: none;
  font-size: 32px;
  cursor: pointer;
  line-height: 1;
  color: #888;
  transition: color 0.2s;
}
.modal-close:hover {
  color: #000;
}

.modal-content {
  overflow-y: auto;
  flex-grow: 1;
  padding-right: 5px;
}

.transaction-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #f6f8ff;
  border-radius: 12px;
  padding: 14px 18px;
  margin-bottom: 12px;
}

.transaction-left {
  display: flex;
  align-items: center;
  gap: 14px;
}

.transaction-icon {
  width: 36px;
  height: 36px;
}

.transaction-details {
  font-size: 15px;
  line-height: 1.4;
}

.transaction-title {
  font-weight: 600;
}

.transaction-status {
  color: #666;
}

.transaction-status.failed {
  color: #f12b8a;
}

.transaction-amount {
  font-size: 15px;
  font-weight: bold;
}

.modal-footer {
  margin-top: 10px;
  text-align: center;
}

.load-more-btn {
  padding: 10px 18px;
  font-size: 15px;
  background-color: #f3f3f3;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  transition: background 0.2s;
}
.load-more-btn:hover {
  background-color: #e2e2e2;
}


.modal__actions .btn-danger {
  background: linear-gradient(90deg, #f0cccc, #f45792);
  border: none;
  color: white;
  padding: 15px 50px;
  border-radius: 50px;
  cursor: pointer;
  font-size: 16px;
  transition: 0.2s;
  min-width: 200px;
  margin: 0px 10px 20px 10px;
}

.modal__actions .btn-danger:hover {
  opacity: 0.9;
}

.modal__actions {
	text-align:center;
}

.modal__actions .btn-light {
  background: linear-gradient(90deg, #8dcee4, #58d0f4);
  border: none;
  color: white;
  padding: 15px 50px;
  border-radius: 50px;
  cursor: pointer;
  font-size: 16px;
  transition: 0.2s;
  min-width: 200px;
  margin: 0px 10px 20px 10px;
}

.modal__actions .btn-light:hover {
  opacity: 0.9;
}


/* ===== Product Search (локальные стили страницы) ===== */

/* Вступление */
.ps-intro {
  color:#5d6b7c;
  margin: 12px 0 18px;
}

/* Липкий контейнер поиска (над оверлеем) */
.ps-sticky{
  position: sticky;
  top: 16px;
  z-index: 1200;
  width: 100%;           /* тянемся ровно по .page-box */
}


/* Поле поиска и слой для выпадашки */
.ps-search{
  position: relative;
  z-index: 1210;
  width: 100%;           /* ровно по внутренней ширине .page-box */
  max-width: none;       /* никаких фиксированных пределов */
  box-sizing: border-box;
}

/* Инпут */
#ps-input{
  width:100%;
  padding:16px;
  border-radius:16px;
  border:1px solid rgba(0,0,0,.08);
  outline: none;
  font-size:18px;
  color:#444;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.06);
  transition: all 0.3s ease;
  box-sizing: border-box;   /* чтобы бордеры/паддинги не раздували ширину */
  padding-right: 40px;          /* место под крестик справа */
}

#ps-input:hover {
	box-shadow:0 6px 16px rgba(0,0,0,.07); 
}

#ps-input:focus{  }

/* Крестик очистки */
.ps-clear{
  position:absolute; top:45%; right:10px; transform:translateY(-50%);
  border:0; background:transparent; cursor:pointer;
  font-size:50px; line-height:1; color:rgba(0,0,0,.45); display:none; z-index:1310;
    font-weight: 100;
}
.ps-clear:hover{ background:none; color:rgba(0,0,0,1); }
.ps-clear.show{ display:block; }




/* Выпадающий список подсказок */
.ps-suggest{
  position:absolute;
  top:100%; left:0; right:0;
  box-sizing: border-box;   /* ширина = ширина .ps-search */
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:0 0 10px 10px;
  margin:0; padding:0px;
  list-style:none;
  z-index: 1300;
  display:none;
  max-height: 280px;
  overflow:auto;
}
.ps-suggest.show{ display:block; }
.ps-suggest li{
  padding:10px 14px;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:10px;
}
.ps-suggest li:hover{ background:#ffeff5; }

/* Карточка результата */
.ps-result{ margin-top:22px; width:100%; }
.ps-card{ background:#fff; padding:20px 0 0 0; }
.ps-title{ margin:0 0 6px; font-size:22px; font-weight:800; }
.ps-status{ margin:0 0 14px; font-weight:700; }
.ps-status.ok{ color:#1a8f4b; }
.ps-status.no{ color:#b33434; }
.ps-block{ margin:14px 0; }
.ps-block h3{ margin:0 0 6px; font-size:16px; }
.ps-block p{ margin:0; }
.ps-block .mono{ background:#f3f6fa; padding:10px; border-radius:8px; }

.ps-result .ps-card .accordion .accordion-content p {
	font-weight:400 !important;
}

.ps-card .ps-status {
	margin:30px 0;
}

/* Оверлей затемнения (под поиском, над страницей) */
.ps-overlay{
  position: fixed; inset: 0;
  background: rgba(0,0,0,.35);
  backdrop-filter: blur(1px);
  z-index: 900;
  display: none;
}
.ps-overlay.show{ display:block; }


/* Подсветка поиска, когда он прилипаeт к верху */
.ps-sticky.is-stuck .ps-search{
  background:#fff;
  border:none;                  /* ⬅️ убрали внутреннюю обводку */
  border-radius:16px;
  box-shadow: 0 10px 24px rgba(0,0,0,.3);
  transition: box-shadow .2s ease, background .2s ease;
}

/* Когда открыт список подсказок — ровные нижние углы у поля и единая рамка */
.ps-search.has-suggest #ps-input{
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-color: transparent; /* убираем «шов» между инпутом и списком */
}

/* На всякий случай — верх списка без скругления */
.ps-search.has-suggest .ps-suggest{
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

/* Если в «прилипшем» состоянии есть внутренний отступ — убираем низ, чтобы не было щели */
.ps-sticky.is-stuck .ps-search.has-suggest{
  padding-bottom: 0;
}

/* Во «прилипшем» состоянии рамка у инпута не нужна — остаётся только тень контейнера */
.ps-sticky.is-stuck #ps-input{
  border:none;
}

/* Когда открыт список: выпрямляем низ у инпута и убираем «шов» */
.ps-sticky.is-stuck .ps-search.has-suggest #ps-input{
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

/* Верх списка без скругления и без верхней линии, чтобы не было двойной границы */
.ps-sticky.is-stuck .ps-search.has-suggest .ps-suggest{
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-top: none;
}


/* Когда открыто мобильное меню — поиск не мешает */
body.menu-open .ps-overlay { display: none !important; }
body.menu-open .ps-suggest { display: none !important; }
body.menu-open .ps-sticky  { z-index: 0 !important; pointer-events: none; }

/* контейнер уже, скорее всего, position:relative; — на всякий */
.ps-search { position: relative; }

/* иконка-лупа справа, на месте крестика */
.ps-lens {
  position: absolute;
  right: 12px;              /* подгоните под ваш крестик */
  top: 50%;
  transform: translateY(-50%);
  width: 35px;
  height: 35px;
  opacity: .45;
  pointer-events: none;     /* клики проходят в input */
  display: block;           /* по умолчанию показываем */
  background: no-repeat center / contain
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24"><path fill="%23999" d="M15.5 14h-.79l-.28-.27A6.471 6.471 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l4.25 4.25a1 1 0 0 0 1.41-1.41L15.5 14Zm-6 0A4.5 4.5 0 1 1 14 9.5 4.5 4.5 0 0 1 9.5 14Z"/></svg>');
}
.ps-lens[hidden] { display: none; }


/* =========================
   Day selector (native + desktop)
   ========================= */

/* Общий контейнер */
.day-selector{ margin:16px 0 12px; }
.day-selector label{ display:block; margin-bottom:8px; font-weight:600; }

/* ---------- Native select (mobile / fallback) ---------- */
.day-native-wrap{
  position: relative;
  display: block;
  width: 100%;
}

.day-native{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  background:#fff;
  border: 1px solid #eed;
  border-radius:16px;
  padding:16px 42px 16px 16px;
  font-size:18px;
  line-height:1.2;
  box-shadow:0 3px 10px rgba(0,0,0,.06);
}

.is-stuck .day-native{
    box-shadow: 0 10px 24px rgba(0, 0, 0, .3);
    transition: box-shadow .2s ease, background .2s ease;
}

.day-native:focus, .day-native:active {
  border: 1px solid #eed;
}

/* наша «стрелочка» у нативного */
.day-native-wrap::after{
  content:"";
  position:absolute;
  right:12px; top:50%;
  width:18px; height:18px;
  transform:translateY(-50%);
  pointer-events:none;
  background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23999" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>') no-repeat center/contain;
}
/* когда сверху построен кастомный — псевдо-стрелку глушим */
.day-selector .day-native-wrap.has-ds::after{
  content:none !important; display:none !important;
}

/* iOS/Android: не дублируем системную стрелку */
@supports (-webkit-touch-callout:none){
  .day-native{ padding-right:16px; }
  .day-native-wrap::after{ display:none; }
}

/* ---------- Desktop Select (custom) ---------- */
.ds{ position:relative; display:inline-flex; }
.ds-native{               /* прячем нативный, но оставляем в DOM */
  position:absolute !important;
  inset:0 auto auto 0;
  width:1px; height:1px;
  opacity:0; pointer-events:none;
}
.ds-toggle{
  width:100%;
  display:flex; align-items:center; justify-content:space-between; gap:.5rem;
  min-width:220px; padding:16px 44px 16px 16px;
  border:1px solid #eed; border-radius:16px; background:#fff; color:#333;
  box-shadow:0 3px 10px rgba(0,0,0,.05);
  font-size:18px; font-weight:400; cursor:pointer;
  transition:box-shadow .2s, border-color .2s;
}
.ds-toggle:hover{ box-shadow:0 6px 16px rgba(0,0,0,.07); }
.ds.open .ds-toggle{ border-bottom-left-radius:0; border-bottom-right-radius:0; }

/* стрелка-каретка (единственная!) */
.ds-caret{
  position:absolute; right:14px; top:50%;
  transform:translateY(-50%);
  width:20px; height:20px; line-height:0; pointer-events:none; color:#777;
}
.ds-caret svg{ width:100%; height:100%; transition:transform .18s ease; }
.ds.open .ds-caret svg{ transform:rotate(180deg); }

/* список опций */
.ds-list{
  position:absolute; left:0; right:0; top:100%; margin-top:0px; z-index:50;
  background:#fff;
  border:1px solid #eef2f7; border-radius: 0px 0px 16px 16px;
  box-shadow:0 12px 28px rgba(0,0,0,.08);
  max-height:260px; overflow:auto;
  display:none;
}
.ds.open .ds-list{ display:block; }

.day-native-wrap .open .ds-list {
	padding-left:0px;
	text-align: center;
}

.ds-list li{
  list-style:none;
  padding:10px 14px;
  cursor:pointer;
  font-size:18px; color:#333;
  transition:background .15s;
}
.ds-list li:hover{ background:#fdf2f8; }
.ds-list li.is-selected{ background:#fdf2f8; color:#cc2d7f; font-weight:600; }

/* Небольшая адаптация размера на узких экранах */
@media (max-width:600px){
  .ds-toggle{ font-size:16px; padding:10px 44px 10px 14px; }
  .ds-list li{ font-size:15px; }
}

/* ---------- Показываем нужный вариант ---------- */
/* Десктоп: кастомный показываем, нативный прячем */
@media (pointer:fine) and (min-width:900px){
  .day-selector .day-native{ display:none !important; }
  .day-selector .ds{ display:inline-flex !important; }
}
/* Мобила / узкий экран: наоборот */
@media (pointer:coarse), (max-width:899px){
  .day-selector .ds{ display:none !important; }
  .day-selector .day-native{ display:block !important;
  }
}

.day-selector { width:100%; margin: 15px 0 40px; }
/* мобильный (нативный select) */
.day-native{ width:100%; }

/* десктоп (наш кастомный) */
.day-selector .ds{ display:flex !important; width:100%; }
.ds-toggle{ width:100%; }          /* сама «кнопка» селекта */
.ds-list{ left:0; right:0; }       /* дропдаун тоже по ширине */


/* кнопка селектора */
.ds-toggle{
  position: relative;          /* чтобы можно было абсолютно поставить стрелку */
  justify-content: center;     /* центрируем текст */
  text-align: center;          /* на всякий случай */
}

/* сам текст */
.ds-label{
  margin: 0 auto;              /* гарантированный центр */
      padding-left: 24px;
}

/* стрелка справа, не влияет на выравнивание текста */
.ds-caret{
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
}



/* === БЛОК: Sticky для выбора дня на странице меню ===================== */
/* Обёртка, которая прилипает при прокрутке */
.mm-sticky{
  position: sticky;
  top: 16px;                 /* зазор от шапки; подстройте при желании */
  z-index: 901;              /* выше контента, ниже выпадашки */
  max-width: 880px;
  margin: 0 auto 18px auto;
}
/* Подсветка, когда прилипли */

.mm-sticky.is-stuck .ds-toggle{
  background:#fff;
  border:none;                  /* ⬅️ убрали внутреннюю обводку */
  border-radius:16px;
  box-shadow: 0 10px 24px rgba(0,0,0,.3);
  transition: box-shadow .2s ease, background .2s ease;
}

/* Затемнение фона при открытой выпадашке (как в product-search) */
.mm-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.35);
  z-index: 900;            /* ниже выпадашки, выше страницы */
  display: none;
}
.mm-overlay.show{ display: block; }

/* Блокировка прокрутки страницы при открытой выпадашке */
body.no-scroll{ overflow: hidden; }

/* Уточнения для кастомного селекта дня (если уже есть .ds-стили — это доп.штрихи) */
.ds{ position: relative; }                 /* позиция для абсолютного списка */
.ds-list{
  position: absolute;
  left: 0; right: 0; top: calc(100% + 0px);
  background: #fff;
  border: 1px solid #eee;
  border-radius: 0 0 16px 16px;
  max-height: 320px; overflow: auto;
  z-index: 902;                             /* выше .mm-sticky и .mm-overlay */
}
.ds-list li{
  list-style: none; padding: 12px 16px; cursor: pointer;
}
.ds-list li.is-selected{ background: #fdf2f8; font-weight: 600; }
.ds-toggle{
  width: 100%;
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px;
  padding: 16px 44px 16px 16px;
  border: 1px solid #eed;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}
.ds-label{ flex: 1; text-align: center; } /* текст по центру, как просили ранее */
.ds-caret svg{ width: 20px; height: 20px; opacity:.45; }


/* Неприлипающая подпись над селектом (центр и зазор) */
.day-selector-head{
  max-width: 880px;
  margin: 0 auto 6px;
  font-weight: 600;
  text-align: center;
}

/* Базовый случай — селект открыт */
.ds.open .ds-toggle{
  border-bottom-left-radius: 0 !important;   /* снять скругление снизу */
  border-bottom-right-radius: 0 !important;
  border-bottom-color: transparent;          /* убрать тонкую линию стыка */
}

/* Список — верхние углы 0, чтобы "соединился" с кнопкой */
.ds.open .ds-list{
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-top-color: transparent;
}

/* Специально повышаем специфичность для липкого состояния (перебитие любых
   .mm-sticky.* или .is-stuck стилей, которые могли вернуть радиус назад) */
.mm-sticky .ds.open .ds-toggle,
.mm-sticky.is-stuck .ds.open .ds-toggle{
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}
.mm-sticky .ds.open .ds-list,
.mm-sticky.is-stuck .ds.open .ds-list{
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border: 1px solid rgba(0, 0, 0, .08);
}


.ps-locked div, .locked-block div {
	padding:30px 0 0;
}


.btn-register  {
  background: linear-gradient(90deg, #8dcee4, #58d0f4);
  color: #fff;
  font-weight: 600;
  border: none;
  padding: 16px 32px;
  border-radius: 30px;
  font-size: 16px;
  cursor: pointer;
  text-decoration:none;
  width: 100%;
  max-width: 320px;
  margin-top: 24px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  transition: background 0.3s;
}

.btn-register:hover {
  opacity: 0.9;
  text-decoration:none;
  color: #fff;
}

.btn-pink  {
  background: linear-gradient(90deg, #ffabbb, #f45792);
  color: #fff;
  font-weight: 600;
  border: none;
  padding: 16px 32px;
  border-radius: 30px;
  font-size: 16px;
  cursor: pointer;
  text-decoration:none;
  width: 100%;
  max-width: 320px;
  margin-top: 24px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  transition: background 0.3s;
}

.btn-pink:hover {
  opacity: 0.9;
  text-decoration:none;
  color: #fff;
}




.hero-media{position:relative;max-width:900px;margin:0 auto 50px;border-radius:16px;overflow:hidden}
  /* картинка остаётся со своей пропорцией 900×400 */
.hero-media img{display:block; border-radius:16px}
.hero-media .is-guest-img{visibility:hidden;position:absolute;width:1px;height:1px;overflow:hidden}

@media (max-width:600px){
  .hero-media img{display:block; border-radius:16px;width: 100%; height:auto;}
}

.hero-player {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;         /* сохраняем пропорции на мобилке/ПК */
  border-radius: 12px;
  overflow: hidden;
}
.hero-player iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.hero-loader {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px 16px;
  font-weight: 600;
  backdrop-filter: blur(1px);
  background: rgba(0,0,0,.06);
}



.after-accordion {
	margin-top:50px;
}

.after-accordion__banner {
	margin:30px auto;
    display: block;
}

.after-accordion__banner img {
	width:100%;
	border-radius: 16px;
}

.menu-conclusion div {
	margin-top:50px;
} 

.after-accordion div {
	margin-bottom: 50px;
}


/* === БЛОК стили хлебных крошек (без микроразметки) === */
.breadcrumbs { font-size: 14px; max-width: 880px; padding: 0px 50px 20px; margin: 0 auto; line-height: 14px;}

@media (max-width:600px){
  .breadcrumbs {padding: 0px 20px 20px;}
}

.breadcrumbs ol { display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:0; }
.breadcrumbs li { display:flex; align-items:center; }
.breadcrumbs li::after { content:"/"; margin:0 8px; opacity:.5; }
.breadcrumbs li:last-child::after { content:""; margin:0; }
.breadcrumbs a { text-decoration:none; }
.breadcrumbs .active { font-weight:600; cursor:default; }



/* ====== REGISTER PAGE ====== */
.reg-hero{
  --g1:#7b2cff; --g2:#ff4ec8;
  background: linear-gradient(135deg,var(--g1),var(--g2));
  padding: 32px 16px 48px;
  color:#fff;
}
.reg-hero__inner{
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 24px;
  align-items: start;
}
.reg-title{
  margin: 0 0 20px;
  color:#fff;
}

.reg-usps {
	color: #fff;
}

.reg-usps__lead{
  margin: 8px 0 12px;
  font-size: 18px;
}
.reg-usps__lead strong{ font-weight: 800; }
.reg-usps__list{
  margin:0; padding-left: 20px; font-size:16px; line-height:1.5;
}
.reg-usps__list li{ margin: 6px 0; }




.reg-offer__now{
  font-size:26px; font-weight:800; letter-spacing:.2px; color:#fff;
}

.reg-offer__old{
  font-size:16px; opacity:.8; text-decoration: line-through;
}



.deal-timer{
  
  min-height: 48px;
  display:flex; align-items:center; justify-content:center;
  display:block;
  background-color: rgba(255, 255, 255, 0.3);
    border-radius: 16px;
  padding: 10px 25px;
}

.deal-timer.mobile {
  min-height: 48px;
  display:flex; align-items:center; justify-content:center;
  display:none;
    background-color: rgba(255, 255, 255, 0.3);
    border-radius: 16px;
    padding: 10px 38px;
}

@media (max-width:600px){
  .deal-timer {display:none;}
  .deal-timer.mobile {display:block;}
}

/* карточка с формой */
.reg-card{
  background:#fff;
  color:#222;
  border-radius:20px;
  box-shadow: 0 12px 30px rgba(0,0,0,.15);
  padding:24px;
}

#payment-form {
	margin:0px;
}

.reg-form{ display:flex; flex-direction:column; gap:14px; }
.reg-card .reg-field input,
#payment-form input[type="email"] {
  width: 100%;
  max-width: 100%;
  display: block;
  box-sizing: border-box;  /* чтобы width учитывал padding и border */
  height: 70px;
  padding: 12px 14px;
  border: 1px solid #ddd;
  border-radius: 12px;
}
.reg-check{
  display:flex; gap:10px; align-items:flex-start;
  font-size:11px; line-height:1.25; color:#333; opacity:0.8;
}
.reg-check input{ transform: translateY(2px); }

.reg-check a {
	color:#333;
	text-decoration:underline;
}

.reg-submit{
  width:100%;
  height:52px;
  border-radius:12px;
  font-weight:800;
  font-size:16px;
  letter-spacing:.2px;
}
.reg-note{
  font-size:12px; color:#666; margin:4px 0 0;
}

.reg-usps__list span{
  font-size:12px;
}

/* уведомления */
.reg-alert{ padding:12px 14px; border-radius:12px; font-weight:600; }
.reg-alert--error{ background:#ffe8ea; color:#8a1b2a; }
.reg-alert--success{ background:#e8fff1; color:#116a3d; }
.btn-link{ color:#116a3d; text-decoration: underline; }

/* адаптив */
@media (max-width: 900px){
  .reg-hero__inner{ grid-template-columns: 1fr; }
  .reg-title{ font-size: 30px; }
  .reg-offer{ gap:12px; }
  .deal-timer{ width:100%; min-width:0; }
}
@media (max-width: 480px){
  .reg-title{ font-size: 26px; }
  .reg-usps__lead{ font-size:16px; }
  .reg-usps__list{ font-size:15px; }
}


.reg-akciya {
	background: rgba(255, 255, 255, 0.3);
    color: #fff;
    padding: 15px;
    border-radius: 16px;
    line-height: 20px;
    text-align: center;
    margin-top: 30px;
}

#timer37f4bfbe88bab5248780082e88df8b73 {
	text-align:left !important;
}
#timer-text-37f4bfbe88bab5248780082e88df8b73-minutes,
#timer-text-37f4bfbe88bab5248780082e88df8b73-secundes {text-align: center !important;}


/* ===== Success page (scoped) ========================================= */
.page-box .success-wrap {
  /* собственный контекст, чтобы правила ниже не лезли на другие страницы */
}

/* карточка автора */
.page-box .success-wrap .author-card{
  display:flex;
  flex-direction:column;      /* на мобилке — в столбик */
  gap:16px;
  padding:16px;
  background:#fff;
  border-radius:16px;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
}

.page-box .success-wrap .author-photo-wrap{
  display:flex;
  justify-content:center;
  margin: 20px 0;
}

.page-box .success-wrap .author-photo{
  width:200px;
  height:200px;
  border-radius:50%;
  object-fit:cover;
  display:block;
}

.page-box .success-wrap .author-meta{
  flex:1 1 auto;
  min-width:0;
}

.page-box .success-wrap .author-name{
  font-size:20px;
  font-weight:700;
  margin:0 0 4px;
}

.page-box .success-wrap .author-role{
  color:#6b7280;
  font-size:14px;
  margin-bottom:10px;
  line-height: 16px;
}

/* кнопки соцсетей */
.page-box .success-wrap .social-cta{
  margin-top:16px;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.page-box .success-wrap .success-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:100%;
  max-width:100%;
  padding:14px 18px;
  border-radius:12px;
  color:#fff;
  font-weight:700;
  text-decoration:none;
  box-sizing:border-box;      /* ← не вылезет из контейнера */
}

.page-box .success-wrap .success-btn svg{
  width:20px;height:20px;fill:currentColor;flex:0 0 auto;
}

.page-box .success-wrap .tg-btn{ background:#2AABEE; }
.page-box .success-wrap .vk-btn{ background:#0077FF; }

/* десктоп: фото слева, текст справа */
@media (min-width: 768px){
  .page-box .success-wrap .author-card{
    flex-direction:row;
    align-items:center;
    padding:20px 24px;
  }
  .page-box .success-wrap .author-photo{ width:220px; height:220px; }
}

/* ===== Success page: тексты над карточкой и навигация ================== */
.page-box .lead{
  margin: .25rem 0 1rem;
  color: #555;
}

/* Быстрый переход к разделам */
.page-box .nav-block{ margin-top:22px; }
.page-box .nav-title{ font-size:18px; margin: 50px 0 20px; }
.page-box .nav-buttons{ display:grid; gap:10px; }

/* сами кнопки навигации */
.page-box .nav-btn{
  display:block;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  padding:14px 16px;
  border-radius:12px;
  text-align:center;
  text-decoration:none;
  font-weight:700;
  background:#f6f8ff;
  border:1px solid #e6ecff;
  transition:.15s;
}
.page-box .nav-btn:hover{ background:#eef2ff; }

/* ссылка «На главную» */
.page-box .link{
  color:#e65f9c;
  text-decoration:none;
  border-bottom:1px dotted currentColor;
}
.page-box .link:hover{ opacity:.85; }
.page-box .back-home{ margin-top:16px; text-align: center;}



/* ===== Profile: access cards ========================================== */
.profile-access-section .access-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

@media (min-width: 980px){
  .profile-access-section .access-grid{
    grid-template-columns: 1fr 1fr;
  }
}

.profile-access-section .access-card{
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 16px;
  border-radius: 16px;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  overflow: hidden;
}

/* фон: активная подписка — голубой градиент, нет подписки — розовый */
.profile-access-section .access-card.is-active{
  background: linear-gradient(90deg,#e6f4ff 0%, #def1ff 100%);
}
.profile-access-section .access-card.is-locked{
  background: linear-gradient(90deg,#ffeef5 0%, #ffe5ef 100%);
}

.profile-access-section .ac-thumb{
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  align-self: center;
}
.profile-access-section .ac-thumb img{
  display:block;
  width:130px; height:130px; object-fit:cover;
}

.profile-access-section .ac-body{
  display:flex; flex-direction:column; gap:8px;
}

.profile-access-section .ac-title{
  margin: 10px 0 0;
  font-size:20px;
  font-weight:600;
  color:#333;
}

.profile-access-section .ac-meta{
  display:flex; flex-direction:column; line-height: 16px;
  font-size:14px;
}
.profile-access-section .ac-row{
  display:flex; gap:6px; align-items:baseline;
}
.profile-access-section .ac-row span{ color:#445; opacity:.85; }
.profile-access-section .ac-row strong{ font-weight:800; }

.profile-access-section .ac-btn{
  align-self:flex-start;
  display:inline-flex;
  align-items:center; justify-content:center;
  min-width:140px;
  padding:5px 16px;
  border-radius:50px;
  background: linear-gradient(90deg, #8dcee4, #58d0f4);
  color:#fff;
  font-weight:600;
  text-decoration:none;
  font-size:16px
}

.profile-access-section .access-card.is-locked .ac-btn{
  background: linear-gradient(90deg, #ffabbb, #f45792);
}


.profile-access-section .ac-btn:hover{
  opacity:0.9;
}

/* мобильная адаптация карточки */
@media (max-width: 600px){
  .profile-access-section .access-card{
    grid-template-columns: 1fr;
    text-align:left;
  }
  .profile-access-section .ac-thumb img{
    width:100%;
    height:400px;
  }
  .profile-access-section .ac-btn{
    width:100%;
	box-sizing: border-box;
  }
  
  .profile-access-section .ac-body {
	  padding: 0px 20px 20px;
  }
  .profile-access-section .ac-title {
	  margin:0px;
	  font-size: 26px;
  }
  .profile-access-section .ac-body {
	  gap: 18px;
  }
  .profile-access-section .ac-meta {
	  line-height: 20px;
    font-size: 16px;
  }
}

.guide-cover {
	display:block;
	margin-bottom:50px;
	border-radius:16px;
}

@media (max-width: 600px){
	.guide-cover {
	margin:0 auto 50px;
	width:100%;
	}
}

.guide-main h1 {
	margin-bottom:40px;
	line-height: 34px;
}

.guide-intro, .guide-accordion, .accordion_register, .program-cta-slot {
	margin-bottom:50px;
}



/* Авторская карточка — desktop уже ок */
.author-card{
  display:flex; gap:12px; align-items:center; margin: 30px 0 40px;
}
.author-card__photo{
  width:150px; height:150px; border-radius:50%; object-fit:cover;
}

/* Мобилка: фото по центру, текст под фото */
@media (max-width: 768px){
  .author-card{
    flex-direction:column;
    align-items:center;          /* центр по горизонтали */
    text-align:left;           /* центр текста */
  }
  .author-card__photo{
    width:200px; height:200px;     /* можно чуть крупнее на мобилке */
    margin-bottom:8px;
  }
  .author-card__text a{ display:inline-block;}
}

.author-card__text{font-size:.85rem;line-height:1.45}
.author-card__text a{white-space:nowrap}

/* === БЛОК стиль заблокированного аккордеона ===
     Серые некликабельные заголовки, контент скрыт */
  .accordion--locked .accordion-toggle {
    background: #f2f2f5;       /* светло-серый */
    color: #9aa0a6;            /* приглушённый текст */
    cursor: default;
    pointer-events: none;      /* запрет кликов */
  }
  .accordion--locked .accordion-content {
    display: none !important;  /* контент всегда закрыт */
  }
  
/* === БЛОК сетка двух карточек (ПК: 2 колонки, мобайл: 1) === */
.conclusion-sections{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:32px;
  margin-top:40px;
  align-items:stretch; /* одинаковая высота колонок */
}

/* Мобайл — одну колонку */
@media (max-width: 768px){
  .conclusion-sections{ grid-template-columns:1fr; }
}

/* === БЛОК оформление карточек и внутренний поток === */
.conclusion-sections section{
  background:#fff;
  border-radius:16px;
  padding:20px 20px 24px;   /* ⬅ нижний padding ЧТОБЫ кнопка не прилипала */
  box-shadow:0 3px 10px rgba(0,0,0,.05);
  display:flex;             /* вертикальная колонка */
  flex-direction:column;
  overflow:visible;         /* ⬅ тень кнопки не обрезается */
}

/* Баннерам — аккуратное поведение */
.conclusion-sections .after-accordion__banner{
  display:block; margin-bottom:16px;
}
.conclusion-sections .after-accordion__banner img{
  display:block; width:100%; height:auto; border-radius:12px;
}

/* Текстовые отступы */
.conclusion-sections section > p{ margin:0 0 16px; }

/* Контейнер с кнопкой — уводим к низу, но оставляем «воздух» */
.conclusion-sections section > div:last-child{
  margin-top:auto;          /* прижимает кнопку к низу карточки */
  padding-top:12px;         /* небольшой верхний отступ над кнопкой */
}

/* Кнопка: уберём нижний внешний отступ на всякий случай */
.conclusion-sections section .btn-pink{ display:inline-block; margin-bottom:0; }


.conclusion-sections .after-accordion__banner {
	margin:0 auto 20px;
}

.product-search-conclusion a, .mama-menu-conclusion a {
	text-align:center;
}

.product-search-conclusion .btn-pink, .mama-menu-conclusion .btn-pink {
	margin-top:0px;
}

/* Кнопка внутри карточек — всегда на всю ширину блока */
.conclusion-sections section .btn-pink{
  display: block;         /* вместо inline-block */
  width: 100%;            /* занимать всю доступную ширину */
  max-width: 100%;
  box-sizing: border-box; /* учитываем padding внутри 100% ширины */
  margin: 0;              /* убираем возможные внешние отступы по бокам */
}

/* На очень узких экранах подрежем тень по краям, если нужно */
@media (max-width: 600px){
  .conclusion-sections section{
    overflow: hidden;     /* чтобы тень/радиус не «вылезали» за рамку карточки */
  }
}


/* При печати скрыть контент, можно показать свою заглушку */
  @media print {
    body * { visibility: hidden !important; }
    /* если есть спец-блок "print-protect" — он будет виден */
    .print-protect { visibility: visible !important; }
  }
  
  
  
/* === БЛОК: HERO / ВВЕДЕНИЕ ==================================================
   Назначение: полноширинный фон, центрированная колонка до 890px.
   Вёрстка: мобильная — одна колонка; на десктопе — также одна, но с ограничением
   ширины видео, как на референсных скринах.
============================================================================= */

.main-content-register {
  flex-grow: 1;
  padding: 0px;
}



/* === БАЗОВЫЙ КОНТЕЙНЕР БЛОКА ============================================== */
.reg-landing {
  /* Нежный голубо-розовый градиент под бренд-палитру */
  background: linear-gradient(180deg, rgba(222,239,255,.7) 0%, rgba(255,230,245,.7) 100%);
      padding: 100px 15px;                    /* комфортные отступы сверху/снизу */
  scroll-margin-top: 80px;               /* чтобы якорь не прятался под фикс-хедер */
}

@media (max-width: 600px){
  .reg-landing section{
    padding: 50px 15px;
  }
}

.reg-landing__wrap {
  max-width: 890px;                      /* твоя целевая ширина контента */
  margin: 0 auto;                        /* центрируем */
  display: flex;
  flex-direction: column;                /* в этом блоке всё стекается вертикально */
  align-items: center;
  text-align: center;
}

/* === ТЕКСТ ================================================================ */
.reg-landing__text {
  max-width: 820px;                      /* немного уже контейнера для читабельности */
}

.reg-landing__title {
  /* крупная типографика под hero */
  font-size: 34px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: 0;
  margin: 0 0 16px 0;
}

.reg-landing__lead {
  font-size: 18px;
  line-height: 1.6;
  margin: 0 auto 24px auto;
  max-width: 740px;
  color: #334;                           /* мягкий тёмный для контраста */
}

.nowrap { white-space: nowrap; }

/* === КНОПКА-ЯКОРЬ ========================================================= */
.reg-landing__cta {
  display: inline-flex;
  align-items: center; margin: 30px;
  justify-content: center;
  padding: 14px 22px;
  border-radius: 14px;
  font-weight: 700;
  text-decoration: none;
  box-sizing: border-box;
  background: linear-gradient(145deg, rgba(244, 87, 146, 1) 0%, rgba(199, 60, 164, 1) 100%);
  color: #fff;
  box-shadow: 0 6px 18px rgba(80, 105, 255, 0.28);
  transition: transform .12s ease, box-shadow .12s ease;
  min-width: 250px;
}
.reg-landing__cta:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(80, 105, 255, 0.45); text-decoration:none;}

/* === ВИДЕО ================================================================ */
.reg-landing__media {
  width: 100%;
  margin-top: 28px;
}

.reg-landing__video {
  width: 100%;
  display: flex;
  justify-content: center;
}

/* Обёртка, ограничивающая видео на десктопе и дающая тень/скругления */
.reg-landing__video-iframe {
  width: 100%;
  max-width: 760px;                      /* ключ: на ПК видео не «на всю» */
  border-radius: 16px;
  overflow: hidden;                       /* скругляем сам iframe по краям */
  box-shadow: 0 14px 34px rgba(50, 60, 90, .18);
  background: #f7f9ff;                   /* фон до загрузки iframe */
}

/* === АДАПТИВ =============================================================== */
@media (max-width: 1024px) {
  .reg-landing__title { font-size: 30px; }
  .reg-landing__lead  { font-size: 17px; }
  .reg-landing__video-iframe { max-width: 720px; }
}

@media (max-width: 768px) {
  .reg-landing__title { font-size: 28px; }
  .reg-landing__lead  { font-size: 16px; }
  .reg-landing__video-iframe { max-width: 100%; } /* На мобиле — по всей ширине */
}

@media (max-width: 480px) {
  .reg-landing__title { font-size: 26px; }
  .reg-landing__lead  { font-size: 15.5px; }
  .reg-landing__cta   { width: 100%; }
}


/* === БЛОК 2: МЕНЮ ПИТАНИЯ ================================================== */
/* Фон белый, ограничение 890px, split-layout, мобильный порядок: media → text */
.reg-landing--menu {
  background: #fff;
  padding: 56px 16px;
}

.reg-landing__wrap--split {
  max-width: 890px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;    /* мобайл — одна колонка */
  gap: 28px;
  align-items: center;
}

/* --- Медиа (картинка справа на ПК) --------------------------------------- */
.reg-menu__media {
  order: 1;                       /* мобайл: первая */
}
.reg-menu__media img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 16px;
  box-shadow: 0 14px 34px rgba(50,60,90,.12);
}

/* --- Текст --------------------------------------------------------------- */
.reg-menu__text {
  order: 2;                       /* мобайл: вторая */
  text-align: left;
}

.reg-menu__eyebrow {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #6b7a99;
  margin-bottom: 10px;
}

.reg-menu__title {
  font-size: 30px;
  line-height: 1.25;
  font-weight: 800;
  margin: 0 0 14px 0;
}

.reg-menu__lead {
  font-size: 17px;
  line-height: 1.6;
  color: #334;
  margin: 0 0 16px 0;
}

.reg-menu__list {
  margin: 0 0 20px 0;
  padding: 0;
  list-style: none;
}
.reg-menu__list li {
  position: relative;
  padding-left: 28px;
  margin: 10px 0;
  line-height: 1.55;
}
.reg-menu__list li::before {
  content: "✔";
  position: absolute;
  left: 0;
  top: 0;
  transform: translateY(1px);
  font-weight: 700;
  /* без явных цветов — унаследует брендовый, можно при необходимости подстроить */
}

/* --- Кнопки -------------------------------------------------------------- */
.reg-menu__cta { display: flex; flex-wrap: wrap; gap: 12px; }

.reg-menu__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 18px;
  border-radius: 12px;
  font-weight: 700;
  text-decoration: none;
  transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease, border-color .12s ease;
}

.reg-menu__btn--primary {
  background: linear-gradient(145deg, rgba(244, 87, 146, 1) 0%, rgba(199, 60, 164, 1) 100%);
  color: #fff; margin: 30px 0;
  box-shadow: 0 6px 18px rgba(80, 105, 255, 0.28);
  transition: transform .12s ease, box-shadow .12s ease;
  min-width: 250px;
}
.reg-menu__btn--primary:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(80,105,255,.38); text-decoration:none;}

.reg-menu__btn--ghost {
  background: transparent;
  border: 2px solid rgba(80,105,255,.4);
  color: #2a2a33;
}
.reg-menu__btn--ghost:hover { border-color: rgba(80,105,255,.7); text-decoration:none;}

/* --- Адаптив ------------------------------------------------------------- */
@media (min-width: 992px) {
  .reg-landing--menu { padding: 72px 16px; }
  .reg-landing__wrap--split { grid-template-columns: 1fr 1fr; gap: 36px; }
  .reg-menu__media { order: 2; }   /* ПК: справа */
  .reg-menu__text  { order: 1; }   /* ПК: слева  */
  .reg-menu__title { font-size: 34px; }
  .reg-menu__lead  { font-size: 18px; }
}

@media (max-width: 600px) {
  .reg-menu__btn, .reg-search__btn, .reg-guides__btn--primary, .rev-cta { width: 100%; box-sizing: border-box;}
}


/* === БЛОК 1 (HERO) — контейнер шире =======================================
   Было: max-width: 890px;  Стало: 1300px
   Видео оставляем умеренным (как в референсе), max-width не трогаем.
========================================================================== */
.reg-landing__wrap {
  max-width: 1300px;   /* ↑ было 890 */
}

/* Дополнительно чуть расширим текстовый контейнер, чтобы смотрелся уверенней */
.reg-landing__text {
  max-width: 980px;    /* ↑ было 820 */
}

/* При широких экранах типографика может быть смелее */
@media (min-width: 1200px) {
  .reg-landing__title { font-size: 38px; }
  .reg-landing__lead  { font-size: 19px; }
}

/* === БЛОК 2 (МЕНЮ) — контейнер шире + «вылет» картинки ====================
   Было: max-width: 890px;  Стало: 1300px
   На десктопе картинка уходит вправо за контейнер примерно на 300px.
========================================================================== */
.reg-landing__wrap--split {
  max-width: 1300px;   /* ↑ было 890 */
  overflow: visible;   /* важно: позволяем вылезать контенту */
}

/* Базовые стили без изменений (мобайл) остаются выше */

/* Десктопное поведение: картинка справа + вылет на ~300px */
@media (min-width: 1200px) {
  .reg-landing__wrap--split { grid-template-columns: 1fr 1fr; gap: 40px; }
  .reg-menu__media { 
    order: 2;                 /* справа */
    margin-right: -300px;     /* выносим за контейнер вправо */
    justify-self: end;
  }
  .reg-menu__text  { order: 1; }

  /* Чуть увеличим сам кадр, чтобы вылет был эффектнее и без пустот */
  .reg-menu__media img {
    max-width: none;          /* снимаем ограничение */
    width: 110%;              /* немного увеличим внутри колонки */
    border-radius: 18px;
    box-shadow: 0 18px 38px rgba(50,60,90,.16);
  }

  .reg-menu__title { font-size: 36px; }
  .reg-menu__lead  { font-size: 19px; }
}

/* Страховка: на очень широких экранах не даём тексту растягиваться чрезмерно */
@media (min-width: 1600px) {
  .reg-menu__text { max-width: 680px; }
}


/* === Мобилка/планшет: НИКАКОГО вылета ==================================== */
@media (max-width: 1199.98px) {
  .reg-landing--menu .reg-menu__media {
    order: 1;
    margin: 0 !important;            /* снять -300px и любые translate */
    transform: none !important;
  }
  .reg-landing--menu .reg-menu__media img {
    width: 100% !important;          /* строго по контейнеру */
    max-width: 100% !important;
    height: auto;
    border-radius: 16px;
    box-shadow: 0 14px 34px rgba(50,60,90,.12);
  }
  /* защита от горизонтального скролла из-за вложенных элементов */
  .reg-landing--menu,
  .reg-landing--menu .reg-landing__wrap--split {
    overflow-x: hidden;
  }
}

/* === ПК: вылет вправо ~300px ============================================ */
@media (min-width: 1200px) {
  .reg-landing__wrap--split { grid-template-columns: 1fr 1fr; gap: 40px; }
  .reg-landing--menu .reg-menu__media {
    order: 2;
    margin-right: -300px;            /* вылет только на ПК */
    justify-self: end;
  }
  .reg-landing--menu .reg-menu__media img {
    max-width: none;
    width: 110%;
    border-radius: 18px;
    box-shadow: 0 18px 38px rgba(50,60,90,.16);
  }
}


/* =======================================================================
   === БЛОК 2: МЕНЮ (фикс переполнения на мобилке + вылет на ПК) ==========
   ======================================================================= */

/* === БЛОК 2: МЕНЮ ПИТАНИЯ (финальная версия) ============================= */
.reg-landing--menu { background:#fff;     padding: 100px 16px; }

@media (max-width: 480px) {
  .reg-landing--menu { background:#fff;     padding: 50px 16px; }
}

.reg-landing--menu .reg-landing__wrap--split{
  max-width:1300px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr;       /* мобилка: одна колонка */
  gap:28px;
  align-items:center;
  overflow:visible;                /* ничего не режем */
}

/* МЕДИА (мобилка: без вылета) */
.reg-landing--menu .reg-menu__media{ order:1; margin:0; position:static; }
.reg-landing--menu .reg-menu__media img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  border-radius:16px;
  box-shadow:0 14px 34px rgba(50,60,90,.12);
}

/* ТЕКСТ */
.reg-landing--menu .reg-menu__text{
  order:2;
  text-align:left;
  overflow-wrap:anywhere;          /* предотвращаем горизонтальный скролл */
  word-break:break-word;
}

/* Если внутри использован .nowrap — на мобилке разрешаем переносы */
@media (max-width:1199.98px){
  .reg-landing--menu .nowrap{ white-space:normal; }
}

/* === ДЕСКТОП: две колонки + вылет картинки ============================== */
@media (min-width:1200px){
  .reg-landing--menu .reg-landing__wrap--split{
    grid-template-columns:1fr 1fr;
    gap:40px;
  }
  .reg-landing--menu .reg-menu__media{
    order:2;
    justify-self:end;
    margin-right:-300px;           /* вылет вправо ТОЛЬКО на ПК */
  }
  .reg-landing--menu .reg-menu__text{ order:1; }
  .reg-landing--menu .reg-menu__media img{
    max-width:none;
    width:110%;
    border-radius:18px;
    box-shadow:0 18px 38px rgba(50,60,90,.16);
  }
}


/* === БЛОК 3: ПОИСК ПО ПРОДУКТАМ ========================================== */
.reg-landing--search {
  background: linear-gradient(180deg, rgba(222,239,255,.7) 0%, rgba(255,230,245,.7) 100%);
      padding: 100px 16px;
}

.reg-landing--search .reg-landing__wrap--split {
  max-width: 1300px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
  align-items: center;
}

/* КАРТИНКА */
.reg-search__media {
  order: 1;
  text-align: center;
}
.reg-search__media img {
  max-width: 100%;
  height: auto;
  display: inline-block;
}

/* ТЕКСТ */
.reg-search__text {
  order: 2;
  text-align: left;
}

.reg-search__eyebrow {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #6b7a99;
  margin-bottom: 10px;
}

.reg-search__title {
  font-size: 30px;
  line-height: 1.25;
  font-weight: 800;
  margin: 0 0 14px 0;
}

.reg-search__lead {
  font-size: 17px;
  line-height: 1.6;
  margin: 0 0 20px 0;
  color: #334;
}

.reg-search__list {
  margin: 0 0 24px 0;
  padding: 0;
  list-style: none;
}
.reg-search__list li {
  margin: 8px 0;
  line-height: 1.5;
}

/* КНОПКА */
.reg-search__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 24px;
  border-radius: 14px;
  font-weight: 700;
  text-decoration: none;
  background: linear-gradient(145deg, rgba(244, 87, 146, 1) 0%, rgba(199, 60, 164, 1) 100%);
  color: #fff; margin-top: 30px;
  box-shadow: 0 6px 18px rgba(80, 105, 255, 0.28);
  transition: transform .12s ease, box-shadow .12s ease;
  min-width: 250px;
}
.reg-search__btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(80,105,255,.38);
  text-decoration: none;
}

/* === ДЕСКТОП ============================================================= */
@media (min-width: 1200px) {
  .reg-landing--search .reg-landing__wrap--split {
    grid-template-columns: 1fr 1fr;
    gap: 40px;
  }
  .reg-search__media { order: 1; text-align: left; }
  .reg-search__text  { order: 2; }
  .reg-search__title { font-size: 36px; }
  .reg-search__lead  { font-size: 18px; }
}



/* === БЛОК 4: МИНИ-ГАЙДЫ ================================================== */
.reg-landing--guides {
  background: #fff;
      padding: 100px 15px;
}

.reg-landing--guides .reg-landing__wrap--split {
  max-width: 1300px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;   /* мобилка */
  gap: 28px;
  align-items: center;
}

/* Текстовая колонка */
.reg-guides__text { order: 2; text-align: left; }
.reg-guides__eyebrow {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #6b7a99;
  margin-bottom: 10px;
}
.reg-guides__title {
  font-size: 30px;
  line-height: 1.25;
  font-weight: 800;
  margin: 0 0 14px 0;
}
.reg-guides__lead {
  font-size: 17px;
  line-height: 1.6;
  color: #334;
  margin: 0 0 18px 0;
}
.reg-guides__list {
  margin: 0 0 18px 0;
  padding: 0;
  list-style: none;
}
.reg-guides__list li { margin: 8px 0; line-height: 1.55; }

/* Бейджи */
.reg-guides__badges {
  display: flex; flex-wrap: wrap; gap: 8px 10px;
  margin: 5px 0 40px 0;
}
.reg-guides__gift, .reg-guides__count, .reg-guides__updates {
  display: inline-flex; align-items: center;
  padding: 6px 10px; border-radius: 999px; font-weight: 700; font-size: 13px;
}
.reg-guides__gift    { background: #ffe8f5; color: #b01774; }
.reg-guides__count   { background: #e9f2ff; color: #274b9f; }
.reg-guides__updates { background: #eef8f0; color: #1c7b46; }

/* Кнопки */
.reg-guides__cta { display: flex; flex-wrap: wrap; gap: 12px; }
.reg-guides__btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 12px 18px; border-radius: 12px; font-weight: 700; text-decoration: none;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.reg-guides__btn--primary {
  padding:14px 24px; border-radius:14px; font-weight:700; text-decoration:none;
  background: linear-gradient(145deg, rgba(244, 87, 146, 1) 0%, rgba(199, 60, 164, 1) 100%);
  box-shadow:0 6px 18px rgba(80,105,255,.28);
  color: #fff;
    min-width: 250px; margin-top: 30px;
  transition:transform .12s ease, box-shadow .12s ease;
}
.reg-guides__btn--primary:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(80,105,255,.38); text-decoration: none;}
.reg-guides__btn--ghost {
  background: transparent; border: 2px solid rgba(80,105,255,.4); color: #2a2a33;
}
.reg-guides__btn--ghost:hover { border-color: rgba(80,105,255,.7); text-decoration: none;}

/* Картинка */
.reg-guides__media { order: 1; text-align: center; }
.reg-guides__media img {
  max-width: 100%; height: auto; display: inline-block;
}

/* Десктоп: текст слева, картинка справа */
@media (min-width: 1200px) {
  .reg-landing--guides .reg-landing__wrap--split {
    grid-template-columns: 1fr 1fr; gap: 40px;
  }
  .reg-guides__text  { order: 1; }
  .reg-guides__media { order: 2; text-align: right; }
  .reg-guides__title { font-size: 36px; }
  .reg-guides__lead  { font-size: 18px; }
}




/* =================== БЛОК 5: ОТЗЫВЫ / СТАТИСТИКА ======================= */
/* ====== СЕТКА БЛОКА: две равные колонки ====== */
.reg-landing--reviews .reg-landing__wrap--split{
  max-width:1300px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr;
  gap:40px;
  align-items:start;
}
@media (min-width:1100px){
  .reg-landing--reviews .reg-landing__wrap--split{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    align-items:center; /* левый блок по вертикали по центру к слайдеру */
  }
  .rev-left{ order:1; }
  .rev-right{ order:2; }
  
}

@media (max-width:600px){
	.reg-landing--reviews .reg-landing__wrap--split{ gap:80px;}
}

/* ====== Левая колонка (как было) ====== */
.rev-left{ text-align:left; }
.rev-kpis{ display:grid; grid-template-columns:1fr 1fr; gap:18px 24px; margin-bottom:50px; }
.rev-kpi__num{ font-weight:800; line-height:1; font-size:48px; }
.rev-kpi__label{ margin-top:6px; color:#3a463d; font-size:15px;     line-height: 18px;}
.rev-title{ font-size:32px; font-weight:800; line-height:1.2; margin:12px 0 10px; }
.rev-lead{ font-size:17px; line-height:1.6; color:#334; margin:0 0 20px; }
.rev-cta{
  display:inline-flex; align-items:center; justify-content:center;
  padding:14px 24px; border-radius:14px; font-weight:700; text-decoration:none;
  background: linear-gradient(145deg, rgba(244, 87, 146, 1) 0%, rgba(199, 60, 164, 1) 100%);
  box-shadow:0 6px 18px rgba(80,105,255,.28);
  color: #fff;
    min-width: 250px; margin-top: 30px;
  transition:transform .12s ease, box-shadow .12s ease;
}
.rev-cta:hover{ transform:translateY(-1px); box-shadow:0 10px 22px rgba(80,105,255,.38); text-decoration:none;}

/* ====== ПРАВАЯ колонка / слайдер ====== */
.rev-right .rev-slider{
  --rev-accent:#6b7cff;
  --rev-accent-weak:rgba(107,124,255,.25);
  width:100%;
  max-width:700px;
  margin-left:auto;
}

/* Окно просмотра: фиксируем пропорции и округляем */
#rev-viewport{
  width:100%;
  overflow:hidden;
  border-radius:18px;
}

/* Трек и слайды */
#rev-track{
  display:flex;
  gap:0;
  height:100%;
  will-change:transform;
  transition:transform .55s ease;
}
.rev-slide{
  flex:0 0 100%;
  width:100%;
  height:100%;
  display:flex; align-items:center; justify-content:center;
  box-sizing:border-box;
}
.rev-slide img{
  width:100%; height:100%;
  object-fit:contain;            /* вся карточка помещается целиком */
  border-radius:18px;
  user-select:none;
  -webkit-user-drag:none;
  pointer-events:none;
}

/* Панель управления снизу: ← точки → */
.rev-controls{
  display:flex; align-items:center; justify-content:center;
  gap:14px;
  margin-top:16px;
}
.rev-nav{
  width:52px; height:52px;
  border:0; border-radius:999px; cursor:pointer; line-height: 23px;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:20px; font-weight:800; color:#fff;
  background:#f45792;
  box-shadow:0 8px 20px rgba(80,105,255,.28);
  transition:transform .12s ease;
}
.rev-nav:active{ transform:scale(.98); }
#rev-dots{ display:flex; align-items:center; gap:10px; }
#rev-dots button{
  height:6px; width:10px; border-radius:999px; border:0; cursor:pointer;
  background:#ffb6d1;
  transition:width .25s ease, background-color .2s ease;
}
#rev-dots button.is-active{ width:20px; background:#f45792; }

/* Мобайл: одна колонка и пониже слайдер */
@media (max-width:1099px){
  .reg-landing--reviews .reg-landing__wrap--split{ align-items:start; }
  #rev-viewport{ max-height:500px; }
}


/* 1) слайдер не ограничиваем по ширине в мобилке */
@media (max-width: 1099px){
  .rev-right .rev-slider{
    max-width: 100%;
    margin-left: 0;         /* чтобы не «съедал» ширину */
  }
}

/* 2) окно просмотра: ширина 100%, высота авто от соотношения сторон,
      скругления работают за счёт overflow:hidden */
.rev-viewport{
  width: 100%;
  /* если все карточки одинаковые (624x533 ≈ 1.17), фиксируем соотношение: */
  aspect-ratio: 624 / 533;     /* даёт стабильную высоту без «прыжков» */
  /* если вдруг не хотите фиксировать высоту — просто удалите строку выше */

  border-radius: 18px;
  overflow: hidden;
  background: #fff;            /* подложка по краям карточки */
}

/* 3) трек и слайды — без фиксированной высоты */
#rev-track{
  display: flex;
  gap: 0;
  will-change: transform;
  transition: transform .55s ease;
  height: auto;                /* было 100% — снимаем */
}
.rev-slide{
  flex: 0 0 100%;
  width: 100%;
  height: auto;                /* было 100% — снимаем */
  display: block;
}

/* 4) картинка: действительно во всю ширину, без обрезания,
      скругления наследуем от вьюпорта и ничего не «лезет» за края */
.rev-slide img{
  display: block;
  width: 100%;
  height: auto;                /* вместо object-fit/height:100% */
  border-radius: inherit;      /* скругления совпадают с контейнером */
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: none;
  box-shadow: none;            /* при желании можете вернуть свою тень */
}


/* один раз задаём «десктопное» соотношение (пример: 624x533) */
.rev-slider { --ratio-desk: 624/565; --ratio-mob: 624/565; } /* подставь свои */

.rev-viewport{
  width: 100%;
  aspect-ratio: var(--ratio-desk); /* десктоп по умолчанию */
  overflow: hidden;
  border-radius: 18px;
  background: #fff;
}

@media (max-width: 600px){
  .rev-viewport{ aspect-ratio: var(--ratio-mob); } /* выше/уже для мобайла */
}

/* чтобы <picture>/<img> реально тянулись на всю ширину слайдера */
.rev-slide picture,
.rev-slide img{
  display: block;
  width: 100%;
  height: auto;
  border-radius: inherit; /* скругления совпадают с контейнером */
}

/* окно слайдера можно «тянуть» горизонтально, вертикальный скролл не блокируем */
#rev-viewport{
  touch-action: pan-y;
  cursor: grab;
}
#rev-viewport.is-drag{ cursor: grabbing; }

/* чтобы картинка не «выделялась» при перетаскивании */
.rev-slide img{
  user-select:none;
  -webkit-user-drag:none;
}


/* окно просмотра держит форму и режет всё лишнее */
#rev-viewport{
  position: relative;
  overflow: hidden;
  border-radius: 18px;
}

/* лента и слайды всегда по высоте окна */
#rev-track{ height: 100%; }
.rev-slide{
  height: 100%;
  position: relative;
  line-height: 0;          /* убираем baseline-зазор у inline-детей */
}

/* <picture> и <img> растягиваем на весь слайд */
.rev-slide picture{ 
  display: block;
  width: 100%;
  height: 100%;
}
.rev-slide img{
  display: block;          /* чтобы не было нижнего зазора */
  width: 100%;
  height: 100%;
  object-fit: contain;     /* текст на карточке не обрезаем */
  border-radius: 18px;
  background: #fff;        /* подложка вокруг карточки, если соотношение не совпадает */
}



/* ===== FAQ: секция полностью белая ===== */
.faq-block{
  background:#fff;
  padding:100px 0;
}

/* Заголовок */
.faq-block .faq-title{
  margin:0 0 28px;
  text-align:center;
  font-size:24px;
  line-height:1.2;
  font-weight:800;
  color:#111;
}

/* Контейнер аккордеона */
.faq-block .faq-card{
  max-width:1100px;
  margin:0 auto;
  padding:0 16px;
  background:transparent;          /* сам аккордеон прозрачный */
  border-top:1px solid #eceff3;    /* тонкие линии сверху/снизу группы */
  border-bottom:1px solid #eceff3;
}

/* Пункт аккордеона (details) — без радиусов и теней */
.faq-block .faq-item{
  border-radius:0 !important;
  box-shadow:none !important;
  background:transparent;
  border-top:1px solid #eceff3;    /* разделитель между пунктами */
}
.faq-block .faq-item:first-child{ border-top:0; }

/* Заголовок пункта */
.faq-block .faq-q{
  list-style:none;                 /* убираем маркер summary */
  cursor:pointer;
  padding:24px 24px;               /* ↑ увеличенные вертикальные отступы */
  font-size:20px;
  font-weight:600;
  display:grid;
  grid-template-columns:1fr auto;  /* текст + стрелка справа */
  align-items:center;
  outline:none;
}
.faq-block .faq-q::-webkit-details-marker{ display:none; }

/* Стрелка */
.faq-block .faq-q::after{
  content:"";
  width:22px; height:22px;
  border:2px solid #ffa2ca;
  border-left-color:transparent;
  border-top-color:transparent;
  transform:rotate(-45deg);        /* стрелка вправо */
  transition:transform .2s ease;
}
.faq-block .faq-item[open] > .faq-q{
  border-bottom:1px solid #eceff3;
}
.faq-block .faq-item[open] > .faq-q::after{
  transform:rotate(135deg);        /* стрелка вниз */
}

/* Контент ответа */
.faq-block .faq-a{
  padding:18px 24px 24px;
  color:#29313a;
  font-size:17px;
  line-height:1.6;
}

/* Адаптив */
@media (max-width:600px){
  .faq-block .faq-title{ font-size:30px; margin-bottom:22px; }
  .faq-block .faq-q{ padding:20px 18px; font-size:17px; }
  .faq-block .faq-a{ padding:14px 18px 20px; font-size:15.5px; }
  .faq-block .faq-q::after{ width:20px; height:20px; }
}

.register-menyu-pc {
	display:block;
}

.register-menyu-mobile {
	display:none !important;
}

@media (max-width:600px){
	.register-menyu-pc {
		display:none !important;
	}

	.register-menyu-mobile {
		display:block !important;
		box-shadow: none !important;
	}
}



/* ====== Регистрация: общий блок ====== */
.reg-final{
  background: linear-gradient(180deg, rgba(222, 239, 255, .7) 0%, rgba(255, 230, 245, .7) 100%);
  padding: 100px 20px;
}
.reg-final__wrap{
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr;
  gap:28px;
  align-items:start;
}
@media (min-width:1100px){
  .reg-final__wrap{ grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap:36px; }
}

/* ====== Левая колонка (промо) ====== */
.reg-promo{
  background:#fff;
  border-radius:22px;
  box-shadow:0 10px 28px rgba(32,45,90,.08);
  padding: 50px 25px;
}
.reg-promo__head{ display:flex; gap:16px; align-items:center; margin-bottom:30px; }
.reg-promo__avatar{ width:150px; height:150px; border-radius:999px; object-fit:cover; }
@media (max-width:700px){
  .reg-promo__avatar{ width:100px; height:100px; }
}

.reg-promo__by{ font-size:13px; color:#657084; }
.reg-promo__name{ font-weight:800; font-size:24px; line-height:1.1; }
.reg-promo__role{ font-size:13px; color:#7a8699; margin-top: 10px; line-height: 12px;}
.reg-promo__title{ font-size:22px; font-weight:800; margin:14px 0 6px; }
.reg-promo__lead{ color:#2f3747; margin:0 0 16px; }

/* список преимуществ */
.reg-usps__lead{ margin:0 0 8px; }
.reg-usps__list{ margin:0; padding-left:18px; display:grid; gap:8px; color:#2f3747; }

/* предложение + таймер */
.reg-offer{
  display:flex; flex-wrap:wrap;   margin-top:20px;
  align-items:center;
  margin:0 0 20px;
}
.reg-offer__price{ display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; margin:0 auto; padding: 24px 0px 0px; color: #fff;}
.reg-offer__badge{ display:inline-block; border-radius:999px; color:#ffffff; font-weight:600; font-size:36px; line-height: 36px;text-align: center; width: 100%;text-transform: uppercase;}
.reg-offer__old{ color: rgba(255,255,255,0.7); text-decoration:line-through; font-weight:600; font-size:30px;}
.reg-offer__now{ font-weight:900; font-size: 60px; line-height: 60px;}
.reg-offer__now span{ font-size: 14px; color: rgba(255,255,255, 0.5); font-weight: 300;}

.reg-offer__timer{ margin-top:14px; align-items:center; width:100%;}

.reg-offer__timer-title{ font-size:24px; color:#ffffff; margin-bottom:8px; text-align:center;}

/* ====== Таймер (HH:MM:SS с «плитками») ====== */
.reg-timer{
	width: 100%;
  display: flex;            /* или grid; place-content:center; — тоже ок */
  justify-content: center;  /* по центру по горизонтали */
  align-items: center;      /* по вертикали */
  gap: 12px;                /* расстояние между группами и двоеточием */
  margin: 8px auto 16px;    /* чтобы сам блок тоже был по центру */
}
.reg-timer .rg{ display: flex; gap: 8px;  }
.reg-timer .d{
	color: #000;
    min-width: 44px;
    padding: 24px 8px;
    text-align: center;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 6px 18px rgba(80, 105, 255, .14);
    font: 700 40px / 1.1 "Inter", system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, sans-serif;
}
.reg-timer .sep{ font-weight:800; font-size:30px; color:#ffffff; }

/* ====== Правая колонка (карточка) ====== */
.reg-card{
  background: #F45792;
  background: linear-gradient(145deg,rgba(244, 87, 146, 1) 0%, rgba(199, 60, 164, 1) 100%);
  border-radius:22px;
  box-shadow:0 12px 30px rgba(32,45,90,.10);
  padding: 94px 25px;
}
.reg-alert{
  border-radius:14px; padding:14px 16px; margin-bottom:14px; font-weight:600;
}
.reg-alert--error{ background:#ffe9ea; color:#8b1a23; }
.reg-alert--success{ background:#e9f9ee; color:#1e7a3b; }

.reg-form{ display:grid; gap:14px; }
.reg-field input{
  width:100%; height:56px; border-radius:14px; border:1px solid #e4e7ee;
  padding:0 16px; font-size:18px; outline:none; transition:border-color .15s ease, box-shadow .15s ease;
  background:#fff;
}
.reg-field input:focus{ border-color:#6b7cff; box-shadow:0 0 0 4px rgba(107,124,255,.15); }

.payment-button2{
  height:70px; border:0; border-radius:16px; cursor:pointer;
  font-weight:600; font-size:24px; color:#000;
  background:linear-gradient(90deg, #fffb6e 0%, #ffd07b 100%);
  box-shadow:0 10px 28px rgba(80,105,255,.28);
  margin-top:0px;
  padding: 0px;
  transition:transform .12s ease, box-shadow .12s ease;    margin-bottom: 20px;
}

.payment-button2:hover{opacity: 0.9; box-shadow:0 14px 32px rgba(80,105,255,.33); }

/* Лёгкий пульс и свечение для кнопки */
.payment-button2{
  --pulse-scale: 1.008;          /* насколько «увеличивать» (≈ +1–2px) */
  --glow: 255, 208, 123;         /* базовый жёлто-оранжевый (из твоего градиента) */
  animation: btn-pulse 2.2s ease-in-out infinite;
  transform-origin: center;
  will-change: transform, box-shadow;
}

/* На ховере можно чуть усилить эффект и приостановить авто-пульс */
.payment-button2:hover,
.payment-button2:focus-visible{
  animation-play-state: paused;
  transform: scale(var(--pulse-scale));
  box-shadow:
    0 10px 28px rgba(80,105,255,.20),
    0 0 26px 10px rgba(var(--glow), .55);
  outline: none;
}

/* При нажатии — привычная «усадка» */
.payment-button2:active{
  transform: scale(.985);
}

/* Ключевые кадры */
@keyframes btn-pulse{
  0%, 100%{
    transform: scale(1);
    /* твоя исходная синяя тень + нет жёлтого свечения */
    box-shadow:
      0 10px 28px rgba(80,105,255,.28),
      0 0 0 0 rgba(var(--glow), 0);
  }
  50%{
    transform: scale(var(--pulse-scale));
    /* мягкий жёлтый «ореол», который затем исчезает */
    box-shadow:
      0 10px 28px rgba(80,105,255,.18),
      0 0 26px 10px rgba(var(--glow), .6);
  }
}

/* Уважение настроек пользователя: отключаем анимацию */
@media (prefers-reduced-motion: reduce){
  .payment-button2{ animation: none; }
}





.reg-legal{
  margin:0px; font-size:12px; line-height:14px; color: rgba(255,255,255,0.5);
}
.reg-legal a{ color: rgba(255,255,255,0.5); text-decoration:underline; }

/* мобильная колонка сверху-вниз — уже задано, но подправим отступы */
@media (max-width:640px){
  .reg-card{ padding: 60px 10px; }
  .reg-promo{ padding: 60px 10px; }
  .reg-timer .d{ min-width:38px; font-size: 34px; }
}


/* ============ KPI: счётчик + рейтинг ============ */
.reg-kpis{
  --accent:#6b7cff;
  --soft:rgba(107,124,255,.10);

  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:16px 0 20px;
}

.kpi{
  background:#fff8fd;                 /* мягкая карточка */
  border:1px solid rgba(0,0,0,.04);
  border-radius:16px;
  padding:14px 16px;
}

.kpi__num{
  font-weight:800;
  line-height:1;
  font-size:clamp(28px, 3.2vw, 40px);
  letter-spacing:.5px;
}

.kpi__label{
  margin-top:6px;
  font-size:14px;
  color:#545454;
  opacity:.9;
}

/* Рейтинг со звёздами */
.kpi--rating .kpi__num{
  font-size:clamp(26px, 3vw, 36px);
}
.kpi-stars{
  display:inline-block;
  font-size:18px;
  letter-spacing:3px;
  color:#ffbf3f;                      /* цвет звёзд */
  text-shadow:0 1px 0 rgba(0,0,0,.06);
}

/* Мобильный стак KPI в одну колонку */
@media (max-width:600px){
  .reg-kpis{ grid-template-columns:1fr; }
}

/* ============ Чек-лист ============ */
.reg-checks{
  list-style:none;
  padding:0;
  margin:4px 0 18px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.reg-checks li{
  position:relative;
  padding-left:32px;
  line-height:1.5;
  font-size:16px;
  color:#1f2430;
}

/* маркер-пилюля + галочка */
.reg-checks li::before{
  content:"";
  position:absolute; left:0; top:6px;
  width:18px; height:18px; border-radius:50%;
  background: linear-gradient(90deg, #ffa5c6 0%, #eb7bff 100%);
}
.reg-checks li::after{
  content:"";
  position:absolute; left:5px; top:11px;
  width:8px; height:4px;
  border:2px solid #fff;
  border-top:0; border-right:0;
  transform:rotate(-45deg);
}



.reg-menu__text .badge-green {
  background-color: #E6F4EA;
  color: #1E7B34;
  padding: 6px 12px;
  border-radius: 9999px; /* pill-shape */
  font-size: 14px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.reg-menu__text .badge-blue {
  background-color: #E7F0FB;
  color: #1E5AA8;
  padding: 6px 12px;
  border-radius: 9999px;
  font-size: 14px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.reg-menu__text .badge-pink {
  background-color: #FDE7ED;
  color: #C6285E;
  padding: 6px 12px;
  border-radius: 9999px;
  font-size: 14px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
 
 
.reg-menu__text .reg-guides__badges {
  display: flex; flex-wrap: wrap; gap: 8px 10px;
  margin: 40px 0 40px 0;
}

.reg-menu__text .reg-guides__gift, .reg-menu__text  .reg-guides__count, .reg-menu__text  .reg-guides__updates {
    display: inline-flex;
    align-items: center;
    padding: 15px 20px 15px 15px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 16px;
	line-height: 16px;
}

.reg-menu__text .reg-guides__gift span, .reg-menu__text  .reg-guides__count span, .reg-menu__text  .reg-guides__updates span {

    font-size: 26px;
}

.reg-menu__text .reg-menu__list {
    margin: 30px 0 20px 0;
    padding: 0;
    list-style: none;
}

@media (max-width:600px){
  .reg-menu__text .reg-menu__list li {margin: 30px 0;}
}

.reg-menu__list .menyu-icon-1::before {
    content: "🗓️";
    position: absolute;
    left: 0;
    top: 0;
    transform: translateY(1px);
    font-weight: 700;
}

.reg-menu__list .menyu-icon-2::before {
    content: "🥣";
    position: absolute;
    left: 0;
    top: 0;
    transform: translateY(1px);
    font-weight: 700;
}

.reg-menu__list .menyu-icon-3::before {
    content: "🥦";
    position: absolute;
    left: 0;
    top: 0;
    transform: translateY(1px);
    font-weight: 700;
}

.reg-menu__list .menyu-icon-4::before {
    content: "👶";
    position: absolute;
    left: 0;
    top: 0;
    transform: translateY(1px);
    font-weight: 700;
}

.reg-menu__list .menyu-icon-5::before {
    content: "💪";
    position: absolute; 
    left: 0;
    top: 0;
    transform: translateY(1px);
    font-weight: 700;
}

.reg-menu__list .menyu-icon-6::before {
    content: "🍼";
    position: absolute;
    left: 0;
    top: 0;
    transform: translateY(1px);
    font-weight: 700;
}


/* === Глобально: гарантируем, что [hidden] реально скрывает узел === */
[hidden] { display: none !important; }

/* === Оверлей: клики только когда он "показан" ====================== */
.rm-overlay{
  position: fixed; inset: 0;
  background: rgba(0,0,0,.45);
  backdrop-filter: saturate(120%) blur(2px);
  z-index: 1000;
  opacity: 0;
  pointer-events: none;           /* <-- важно */
  transition: opacity .2s;
}
.rm-overlay.show{
  opacity: 1;
  pointer-events: auto;           /* <-- кликабелен только когда видим */
}

/* === Модалка: полный рост на мобиле, норм на десктопе ============== */
.rm-modal{
  position: fixed;
  top: 8px; right: 0; bottom: 8px; left: 0; /* почти во весь экран */
  margin: auto;
  width: 96vw; max-width: 720px;
  max-height: calc(100vh - 16px);
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(0,0,0,.25);
  z-index: 1001;
  display: flex; flex-direction: column;
  opacity: 0; transform: translateY(12px);
  transition: opacity .2s, transform .2s;
  padding: 0;                      /* уберём внутренний paddings у контейнера */
  overflow: hidden;                /* скролл только в body-модалки */
}
.rm-modal.show{ opacity: 1; transform: translateY(0); }

/* Шапка модалки фиксированная, контент скроллится */
.rm-head{
  position: sticky; top: 0; z-index: 1;
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid #f0e6ee;
  background: #fff;
}
.rm-title{ font-size: 20px; margin: 0; color:#111; }
.rm-close{ font-size: 50px; line-height: 1; border: 0; background: transparent; cursor: pointer; padding: 0 4px; }

/* Тело модалки скроллится */
.rm-body{
  padding: 12px 16px 16px;
  overflow: auto;                  /* <-- скролл здесь */
  -webkit-overflow-scrolling: touch;
}

/* Аккордеон как был, оставим твои цвета */
.rm-accordion .item{border:1px solid #f0e6ee;border-radius:12px;margin-bottom:8px;overflow:hidden}
.rm-accordion .head{width:100%;text-align:left;background:linear-gradient(90deg,#ffe2ea,#e4f1ff);border:0;padding:12px 14px;font-weight:600;cursor:pointer}
.rm-accordion .content{display:none;padding:10px 14px;background:#fff}
.rm-accordion .item.open .content{display:block}
.rm-accordion .item.lock .head{background:#f6f6f8;color:#a1a1a1;cursor:not-allowed}
.rm-accordion .item.lock .content{display:none}

/* === Низ модалки ======================================================= */
.rm-cut{margin-top:12px;border-top:1px solid #f0e6ee;padding-top:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:9999px;padding:12px 18px;font-weight:600;text-decoration:none}
.btn-outline{border:1px solid #e5d8e9;background:#fff;box-shadow: 0 6px 18px rgba(80, 105, 255, 0.28); min-width: 250px;margin: 30px 0 0;  padding: 0px 40px; border-radius: 12px; font-weight: 500; font-size:16px; height: 50px;}
.btn-outline:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(80, 105, 255, .38);
    text-decoration: none;
}
.btn-pink{background:linear-gradient(90deg,#ff4fa1,#fd7fb5);color:#fff;border:0}

.rm-accordion ul {list-style:none;    padding-left: 0px;}

/* === Глобально: гарантируем, что [hidden] реально скрывает узел === */
[hidden] { display: none !important; }

@media (max-width:600px){
	.rm-modal { top: 0px; bottom: 0px; max-height: calc(100vh - 0px); border-radius: 0px; left:0px; right:0px;}
}

.reg-landing--menu .reg-menu__btn--primary { margin: 30px 0 0;}

@media (max-width:600px){
.reg-landing--menu .btn-outline { margin: 20px 0 50px; width: 100%; box-sizing: border-box;}
}


.pricing {
  padding: 100px 20px 150px;
  background: linear-gradient(135deg, #fbe3ec, #e0f0ff);
  text-align: center;
}

.pricing-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
  max-width: 1100px;
  align-items: stretch; /* все карточки одинаковой высоты */
  margin: 0 auto;
}

.pricing-card {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 20px rgba(0,0,0,0.08);
  padding: 40px 20px 20px 20px;
  height: 320px !important;
  width: 300px;
  transition: transform 0.2s ease;
  display: flex; 
  flex-direction: column;
  justify-content: space-between; /* растягивает содержимое */
  height: 100%; /* уравнивает высоту */
}

.pricing-card h3 {
	color:#111;
}

/* Для мобилы — авто */
@media (max-width: 768px) {
  .pricing-card {
    height: auto; /* растягивается по содержимому */
  }
}

.pricing-card .btn {
  margin-top: auto; /* кнопка уходит вниз */
}

.pricing-card:hover {
  transform: translateY(-5px);
}

.pricing-card h3 {
  font-size: 20px;
  margin-bottom: 10px;
  font-weight: 600;
}

.price {
  font-size: 28px;
  font-weight: bold;
  margin: 10px 0 20px;
  color: #e62e73;
}

.price span {
  font-size: 14px;
  color: #555;
}

.features {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
  font-size: 14px;
  color: #444;
}

.features li {
  margin-bottom: 8px;
}

.btn-buy {
  display: inline-block;
  width: 100%;
  padding: 12px;
  border: none;
  border-radius: 12px;
  background: linear-gradient(90deg, #f770b5, #6bc6ff);
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: 0.3s ease;
}

.btn-buy:hover {
  opacity: 0.9;
}

.featured {
  border: 2px solid #f770b5;
  transform: scale(1.05);
}


.pricing-head { text-align:center; margin-bottom:24px; }
.pricing-head h2 { font-size:28px; margin:0 0 6px; }
.pricing-head .sub { color:#555; margin:0 0 10px; }

.trust { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; padding:0; margin:0; list-style:none; }
.trust li { font-size:14px; background:#fff; border-radius:9999px; padding:6px 12px; box-shadow:0 2px 8px rgba(0,0,0,.06); }

/* Ленты */
.pricing-card { position:relative; }
.ribbon{
  position:absolute; top:12px; left:12px;
  background:#e9eef9; color:#1E5AA8; font-weight:600;
  padding:4px 10px; border-radius:9999px; font-size:12px;
}
.ribbon-pink{ background:#FDE7ED; color:#C6285E; }
.ribbon-blue{ background:#E7F0FB; color:#1E5AA8; }

/* Примечание под карточками */
.note{ max-width:900px; margin:16px auto 0; text-align:center; color:#666; font-size:14px; }


.reg-final-menu {
	background: #fff;
    padding: 100px 20px;
}

.reg-final__wrap-menu {
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr;
  gap:28px;
  align-items:start;
}

@media (min-width:1100px){
  .reg-final__wrap-menu { max-width:600px; }
}

.reg-final[hidden]{ display:none; }

.pricing-title {
	margin: 0 0 28px;
    text-align: center;
    font-size: 24px;
    line-height: 1.2;
    font-weight: 800;
    color: #111;
}
	