/* ==========================================================================
   INSTICK Israel — стили ЛЕНДИНГА АКЦИИ «נסו בחינם» (promo.css)
   --------------------------------------------------------------------------
   Секции: шапка-оверлей → полноэкранный hero → преимущества → выбор набора
   (+ мастер оформления 2–5 со sticky-сводкой) → видео → FAQ → рецепты →
   финальный CTA → условия. Ниже — сначала общие/лендинговые стили,
   затем стили мастера (сохранены из первой версии).
   • Подключается ПОСЛЕ css/instick-home.css (токены, шапка, футер, виджеты).
   • Все классы страницы — с префиксом .pr-* (изоляция от остального сайта).
   • RTL: только логические свойства. Радиусы 3–5px. Rubik облегчённый.
   • Основная кнопка — зелёная (#157A44, как «оплата/успех» на сайте).
   • Мобайл — приоритет: сводка корзины на мобильном превращается
     в фиксированную нижнюю панель с раскрытием.
   • prefers-reduced-motion — все анимации отключаются.
   ========================================================================== */

/* ---------- Переменные темы страницы --------------------------------------- */
:root {
  --pr-green:      #157A44;          /* основная кнопка / успех */
  --pr-green-deep: #0F6236;          /* hover */
  --pr-green-soft: rgba(21, 122, 68, .09);
  --pr-warn:       #B7791F;          /* предупреждение (закончился, повтор) */
  --pr-warn-soft:  rgba(183, 121, 31, .1);
  --pr-err:        #C2262E;          /* ошибка */
  --pr-err-soft:   rgba(194, 38, 46, .08);
  --pr-bar-h:      64px;             /* высота мобильной панели сводки */
  --pr-title-ink:  #161016;          /* тёмный заголовочный цвет (как на thank-you) */
}
:root[data-theme="dark"] {
  --pr-green-soft: rgba(21, 122, 68, .22);
  --pr-title-ink: var(--ink);
}

/* ---------- База страницы --------------------------------------------------- */
.pr-body { background: var(--ground); }
/* Атрибут hidden должен побеждать любые display у .pr-* (flex/grid) */
.pr-body [hidden] { display: none !important; }
/* Страховка от горизонтального скролла на узких экранах */
html, body.pr-body { overflow-x: clip; }
/* Заголовки страницы — Rubik 500, как везде на сайте */
.pr-main h1, .pr-main h2, .pr-main h3 { font-family: var(--font-display); font-weight: 500; color: var(--pr-title-ink); }
.pr-main { padding-block-end: 3rem; }

/* Ссылка «перейти к содержимому» — видна только при фокусе с клавиатуры */
.pr-skip {
  position: absolute; inset-block-start: -100px; inset-inline-start: 1rem; z-index: 999;
  padding: .6rem 1rem; background: var(--pr-green); color: #fff; border-radius: var(--radius);
}
.pr-skip:focus { inset-block-start: 1rem; }

/* ---------- Шапка: только логотип, фиксирована поверх первого экрана --------- */
.pr-header {
  position: fixed; inset-block-start: .8rem; inset-inline: 0; margin-inline: auto;
  width: min(1080px, 100% - 1.6rem);
}
.pr-header__bar { justify-content: flex-start; padding-block: .35rem; }
/* Скрытие при скролле вниз — класс ставит instick-home.js */
.pr-header.header--hidden { transform: translateY(calc(-100% - 1.2rem)); }

/* ---------- Кнопки страницы (зелёная основная) -------------------------------- */
.pr-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .55em;
  padding: .9em 1.6em; border-radius: var(--radius-lg);
  font-family: var(--font-display); font-weight: 500; font-size: var(--step-0);
  line-height: 1; letter-spacing: .02em; white-space: nowrap;
  transition: transform .3s var(--ease), background-color .3s var(--ease), box-shadow .3s var(--ease), color .3s var(--ease), opacity .2s;
}
.pr-btn svg { width: 18px; height: 18px; flex: none; }
.pr-btn--green { background: var(--pr-green); color: #fff; box-shadow: 0 8px 20px -10px rgba(21,122,68,.55); }
.pr-btn--green:hover { background: var(--pr-green-deep); transform: translateY(-2px); }
.pr-btn--ghost { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--ink); }
.pr-btn--ghost:hover { background: var(--ink); color: var(--ground); }
.pr-btn--dark { background: var(--is-dark); color: #fff; }
.pr-btn--dark:hover { background: var(--is-black); }
.pr-btn--lg { padding: 1.05em 1.9em; font-size: var(--step-1); }
.pr-btn:disabled { opacity: .45; cursor: not-allowed; transform: none !important; box-shadow: none; }
.pr-btn b { font-weight: 600; direction: ltr; unicode-bidi: isolate; }
/* Текстовая кнопка-ссылка */
.pr-link { color: var(--pr-green); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; padding: 0; }
.pr-link:hover { color: var(--pr-green-deep); }

/* ---------- Общие заголовки секций лендинга ----------------------------------- */
.pr-eyebrow { color: var(--pr-green); }
.pr-sec-head { max-width: 60ch; margin-block-end: clamp(1.6rem, 4vw, 2.8rem); }
.pr-sec-head--center { margin-inline: auto; text-align: center; }
.pr-sec-head--split { max-width: none; display: flex; flex-direction: column; align-items: center; gap: 1rem; }
.pr-sec-title { font-size: var(--step-3); margin-block-start: .5rem; }
.pr-sec-title--big { font-size: clamp(2rem, 1.4rem + 3.2vw, 3.6rem); }
.pr-sec-sub { margin-block-start: .8rem; font-size: var(--step-1); font-weight: 300; color: var(--ink-soft); }
.pr-green { color: var(--pr-green); }
.pr-arrowlink { color: var(--pr-green); }
/* Лендинговые секции скрываются на экране thank-you */
.pr-body.is-thanks .pr-land { display: none; }

/* ---------- 1 · Первый экран: фото на весь экран ------------------------------- */
.pr-hero {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: 100vh; min-height: 100svh;
  display: flex; align-items: center;          /* контент — по центру экрана */
  color: #fff; text-align: center;
  padding-block: clamp(6rem, 18vh, 9rem) clamp(4rem, 10vh, 6rem);
}
.pr-hero__bg {
  position: absolute; inset: 0; z-index: -2;
  width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%;
  /* Мягкий kenburns на десктопе; отключается при reduced-motion */
  animation: pr-kenburns 14s var(--ease-out) both;
}
@keyframes pr-kenburns { from { transform: scale(1.08); } to { transform: scale(1); } }
/* Затемняющий градиент: снизу плотнее (текст), сверху — лёгкая вуаль под шапку */
.pr-hero__shade {
  position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(180deg, rgba(11,11,12,.45) 0%, rgba(11,11,12,.05) 30%, rgba(11,11,12,.25) 55%, rgba(11,11,12,.82) 100%);
}
.pr-hero__content { display: flex; flex-direction: column; align-items: center; gap: .9rem; max-width: 860px; margin-inline: auto; }
.pr-hero__eyebrow { font-size: .82rem; letter-spacing: .16em; text-transform: uppercase; font-weight: 500; color: rgba(255,255,255,.85); }
.pr-main .pr-hero__title {
  font-size: clamp(2.5rem, 1.6rem + 5.5vw, 5.4rem); line-height: 1.02; color: #fff;
  text-shadow: 0 4px 30px rgba(0,0,0,.35);
}
.pr-hero__sub { font-size: var(--step-1); font-weight: 300; color: rgba(255,255,255,.9); max-width: 42ch; }
.pr-btn--hero { padding: 1.1em 2em; font-size: var(--step-1); margin-block-start: .4rem; box-shadow: 0 14px 40px -12px rgba(21,122,68,.7); }
.pr-hero__note { font-size: .82rem; color: rgba(255,255,255,.7); letter-spacing: .04em; }
/* Стрелка «листайте вниз» */
.pr-hero__cue {
  position: absolute; inset-block-end: 1.1rem; inset-inline: 0; margin-inline: auto;
  width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center;
  color: rgba(255,255,255,.8); border: 1px solid rgba(255,255,255,.35);
  animation: pr-bob 2s var(--ease) infinite;
}
.pr-hero__cue svg { width: 20px; height: 20px; }
@keyframes pr-bob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(5px); } }
@media (max-width: 640px) {
  .pr-hero { padding-block-end: 4.5rem; }
  .pr-hero__bg { object-position: 50% 30%; }
  .pr-btn--hero { width: 100%; }
}

/* ---------- 2 · Преимущества: крупные плитки с большими иконками ----------------- */
.pr-benefits__grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: .9rem; grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 900px) { .pr-benefits__grid { grid-template-columns: repeat(4, 1fr); gap: 1.2rem; } }
.pr-benefit {
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: .6rem;
  padding: clamp(1.2rem, 3vw, 2rem) 1rem;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
  transition: transform .35s var(--ease), box-shadow .35s var(--ease);
}
.pr-benefit:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
/* Иконка: большой зелёный круг-подложка + тонкий stroke 2px в viewBox 64 */
.pr-benefit__icon {
  width: clamp(84px, 22vw, 116px); aspect-ratio: 1; border-radius: 50%;
  display: grid; place-items: center; color: var(--pr-green);
  background: var(--pr-green-soft);
}
.pr-benefit__icon svg { width: 62%; height: 62%; }
.pr-benefit__title { font-family: var(--font-display); font-weight: 500; font-size: clamp(1.15rem, 1rem + .8vw, 1.5rem); color: var(--pr-title-ink); }
.pr-benefit__text { font-size: .9rem; color: var(--ink-soft); font-weight: 300; line-height: 1.5; max-width: 26ch; }
/* Дополнительные чипы */
.pr-benefits__chips { list-style: none; margin: 1.4rem 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; }
.pr-benefits__chips li {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .65rem 1.1rem; border-radius: var(--radius); font-weight: 500; font-size: .95rem;
  background: var(--surface); border: 1px solid var(--border);
}
.pr-benefits__chips svg { width: 20px; height: 20px; color: var(--pr-green); }

/* ---------- 3 · Выбор набора (карточки — стили ниже, в блоке мастера) ------------- */
.pr-choose { scroll-margin-block-start: 1rem; }
.pr-choose__terms { list-style: none; margin: 1.2rem 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem .9rem; font-size: .88rem; color: var(--ink-soft); }
.pr-choose__terms li { display: inline-flex; align-items: center; gap: .35rem; }
.pr-choose__terms li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--pr-green); }
.pr-choose__hint { margin-block-start: 1rem; text-align: center; font-size: .85rem; color: var(--ink-soft); }
.pr-kits__empty { margin-block-start: 1rem; text-align: center; }
/* Блокировка выбора (акция завершена / повтор) */
.pr-choose.is-locked .pr-kits, .pr-choose.is-locked .pr-choose__hint { opacity: .35; pointer-events: none; filter: grayscale(.6); }
.pr-choose .pr-states { margin-block-end: 1.5rem; }
.pr-choose .pr-state { margin-block: 0; }

/* ---------- 4 · Видео «как приготовить» ----------------------------------------- */
.pr-how__grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: 1fr; counter-reset: how; }
@media (min-width: 700px) { .pr-how__grid { grid-template-columns: repeat(3, 1fr); gap: 1.2rem; } }
.pr-howtile { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .45rem; }
.pr-howtile__media {
  position: relative; aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--radius-lg);
  background: var(--is-dark); box-shadow: var(--shadow-soft);
}
@media (max-width: 699px) { .pr-howtile__media { aspect-ratio: 16 / 10; } }
.pr-howtile__media video { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Play-иконка: показываем, пока видео не играет (нет файла / автоплей запрещён) */
.pr-howtile__play {
  position: absolute; inset: 0; display: grid; place-items: center; color: #fff;
  background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.45));
  opacity: 0; transition: opacity .3s var(--ease); pointer-events: none;
}
.pr-howtile__play svg { width: 64px; height: 64px; filter: drop-shadow(0 6px 18px rgba(0,0,0,.4)); }
.pr-howtile.is-static .pr-howtile__play { opacity: 1; }
.pr-howtile__num {
  position: absolute; inset-inline-start: .8rem; inset-block-start: .8rem;
  width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center;
  background: var(--pr-green); color: #fff; font-family: var(--font-display); font-weight: 500;
}
.pr-howtile__title { font-family: var(--font-display); font-weight: 500; font-size: var(--step-1); color: var(--pr-title-ink); margin-block-start: .3rem; }
.pr-howtile__text { font-size: .92rem; color: var(--ink-soft); font-weight: 300; }

/* ---------- 5 · FAQ -------------------------------------------------------------- */
.pr-faq__wrap { max-width: 860px; }

/* ---------- 6 · Рецепты ------------------------------------------------------------ */
.pr-recipes__grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 900px) { .pr-recipes__grid { grid-template-columns: repeat(4, 1fr); } }
.pr-recipe__link { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .35rem; }
.pr-recipe__photo { width: 100%; }
.pr-recipe__photo { position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--radius-lg); background: var(--ground-2); }
.pr-recipe__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.pr-recipe__link:hover img { transform: scale(1.05); }
.pr-recipe__time { position: absolute; inset-inline-start: .6rem; inset-block-end: .6rem; padding: .25rem .55rem; border-radius: var(--radius-sm); background: rgba(255,255,255,.92); color: var(--pr-title-ink); font-size: .74rem; font-weight: 500; }
.pr-recipe__title { font-family: var(--font-display); font-weight: 500; color: var(--pr-title-ink); margin-block-start: .3rem; }
.pr-recipe__text { font-size: .85rem; color: var(--ink-soft); font-weight: 300; }

/* ---------- 7 · Финальный CTA ------------------------------------------------------- */
.pr-final { background: var(--is-black); color: #fff; padding-block: clamp(3.5rem, 8vw, 6rem); text-align: center; }
.pr-final__inner { display: flex; flex-direction: column; align-items: center; gap: .8rem; max-width: 760px; }
.pr-final__eyebrow { font-size: .82rem; letter-spacing: .16em; text-transform: uppercase; color: #7FD0A2; font-weight: 500; }
.pr-main .pr-final__title { font-size: clamp(1.9rem, 1.3rem + 3vw, 3.2rem); color: #fff; }
.pr-final__sub { color: rgba(255,255,255,.72); font-weight: 300; font-size: var(--step-1); }
.pr-final .pr-btn--hero { margin-block-start: .6rem; }

/* ==========================================================================
   МАСТЕР ОФОРМЛЕНИЯ (шаги 2–5), сводка, состояния, thank-you — из первой версии
   ========================================================================== */

/* ---------- Глобальные состояния (экраны) ------------------------------------- */
.pr-states:empty { display: none; }
.pr-state {
  text-align: center; align-items: center;
  margin-block: 1rem 2rem; padding: clamp(1.4rem, 3vw, 2.2rem);
  border-radius: var(--radius-lg); border: 1px solid var(--border);
  background: var(--surface); box-shadow: var(--shadow-soft);
  display: flex; flex-direction: column; gap: .7rem;
  border-inline-start: 4px solid var(--pr-green);
}
.pr-state--warn { border-inline-start-color: var(--pr-warn); }
.pr-state--err { border-inline-start-color: var(--pr-err); }
.pr-state__icon { width: 40px; height: 40px; color: var(--pr-green); }
.pr-state--warn .pr-state__icon { color: var(--pr-warn); }
.pr-state--err .pr-state__icon { color: var(--pr-err); }
.pr-state__title { font-size: var(--step-2); }
.pr-state__text { color: var(--ink-soft); font-weight: 300; max-width: 60ch; }
.pr-state__code { font-size: .8rem; color: var(--ink-soft); direction: ltr; text-align: end; }
.pr-state__code:empty { display: none; }
.pr-state__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .7rem; margin-block-start: .4rem; }
.pr-state__form { display: flex; gap: .6rem; flex-wrap: wrap; justify-content: center; width: 100%; max-width: 460px; margin-inline: auto; }
.pr-state__form .pr-input { flex: 1 1 200px; }
.pr-state__note { color: var(--pr-green); font-weight: 500; }

/* ---------- Раскладка мастер + сводка (под блоком выбора) --------------------- */
.pr-layout { display: grid; gap: 1.5rem; grid-template-columns: 1fr; align-items: start; scroll-margin-block-start: 5rem; padding-block: 1.5rem 3rem; }
@media (min-width: 980px) { .pr-layout { grid-template-columns: minmax(0, 1fr) 360px; gap: 2.5rem; } }
.pr-wizard { min-width: 0; }
/* Когда мастер заблокирован (акция завершена/повтор) — гасим */
.pr-layout.is-locked .pr-wizard { opacity: .35; pointer-events: none; filter: grayscale(.6); }

/* Индикатор прогресса */
.pr-progress {
  list-style: none; margin: 0 0 1.6rem; padding: 0;
  display: grid; grid-template-columns: repeat(5, 1fr); gap: .3rem;
  counter-reset: none;
}
.pr-progress__item { display: flex; flex-direction: column; align-items: center; gap: .35rem; position: relative; text-align: center; }
.pr-progress__num {
  width: 30px; height: 30px; border-radius: 50%; z-index: 1;
  display: grid; place-items: center; font-family: var(--font-display); font-size: .82rem; font-weight: 500;
  background: var(--ground-2); color: var(--ink-soft); border: 2px solid var(--border);
  transition: background-color .3s var(--ease), border-color .3s var(--ease), color .3s var(--ease);
}
.pr-progress__label { font-size: .76rem; color: var(--ink-soft); }
/* Соединительная линия между шагами (в RTL растёт справа налево) */
.pr-progress__item::before {
  content: ""; position: absolute; inset-block-start: 14px; inset-inline-start: -50%;
  width: 100%; height: 2px; background: var(--border);
}
.pr-progress__item:first-child::before { display: none; }
.pr-progress__item.is-done .pr-progress__num { background: var(--pr-green); border-color: var(--pr-green); color: #fff; }
.pr-progress__item.is-done::before { background: var(--pr-green); }
.pr-progress__item.is-current .pr-progress__num { border-color: var(--pr-green); color: var(--pr-green); background: var(--surface); }
.pr-progress__item.is-current::before { background: var(--pr-green); }
.pr-progress__item.is-current .pr-progress__label, .pr-progress__item.is-done .pr-progress__label { color: var(--pr-title-ink); font-weight: 500; }

/* Панель шага */
.pr-step {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-soft);
  padding: clamp(1.1rem, 2.5vw, 1.8rem);
  animation: pr-fade .4s var(--ease-out);
}
@keyframes pr-fade { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.pr-step__head { margin-block-end: 1.2rem; text-align: center; }
.pr-step__title { font-size: var(--step-2); }
.pr-step__sub { margin-block-start: .4rem; color: var(--ink-soft); font-weight: 300; }
.pr-step__foot { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: flex-end; margin-block-start: 1.4rem; padding-block-start: 1.2rem; border-block-start: 1px solid var(--border); }
.pr-step__foot .pr-btn--ghost { margin-inline-end: auto; }
@media (max-width: 560px) {
  .pr-step__foot { flex-direction: column-reverse; }
  .pr-step__foot .pr-btn { width: 100%; }
  /* На мобильном кнопки могут переноситься по словам и занимать всю ширину */
  .pr-btn { white-space: normal; text-align: center; line-height: 1.25; }
  .pr-hero__cta { flex-direction: column; align-items: stretch; text-align: center; }
  .pr-state__actions .pr-btn { width: 100%; }
}

/* ---------- Карточки наборов (шаг 1) ------------------------------------------ */
.pr-kits { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .pr-kits { grid-template-columns: repeat(3, 1fr); } }
/* На узких экранах карточки идут в колонку — фото ниже, чтобы не растягивать шаг */
@media (max-width: 639px) { .pr-kit__photo { aspect-ratio: 16 / 9; } }
.pr-kit {
  position: relative; display: flex; flex-direction: column;
  border: 1.5px solid var(--border); border-radius: var(--radius-lg);
  background: var(--surface); overflow: hidden; text-align: start;
  transition: border-color .25s var(--ease), box-shadow .25s var(--ease), transform .25s var(--ease);
}
.pr-kit:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.pr-kit.is-selected { border-color: var(--pr-green); box-shadow: 0 0 0 3px var(--pr-green-soft), var(--shadow); }
.pr-kit__photo { aspect-ratio: 4 / 3; overflow: hidden; background: var(--ground-2); }
.pr-kit__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.pr-kit:hover .pr-kit__photo img { transform: scale(1.04); }
.pr-kit__body { padding: .9rem 1rem 1rem; display: flex; flex-direction: column; align-items: center; text-align: center; gap: .4rem; flex: 1; }
.pr-kit__bottom { display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;}
.pr-kit__name { font-family: var(--font-display); font-weight: 500; font-size: var(--step-1); color: var(--pr-title-ink); }
.pr-kit__desc { font-size: .9rem; color: var(--ink-soft); font-weight: 300; }
.pr-kit__contents { list-style: none; margin: .2rem 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .3rem; }
.pr-kit__contents li { font-size: .75rem; padding: .2rem .5rem; border-radius: var(--radius-sm); background: var(--ground-2); color: var(--ink-soft); }
.pr-kit__count { font-size: .8rem; color: var(--ink-soft); }
/* Обязательная пометка для «молочного» набора */
.pr-kit__note {
  text-align: start; margin-block-start: .3rem; padding: .5rem .65rem; border-radius: var(--radius-sm);
  background: var(--pr-green-soft); color: var(--pr-title-ink); font-size: .78rem; line-height: 1.45;
  display: flex; gap: .4rem; align-items: flex-start;
}
.pr-kit__note svg { width: 15px; height: 15px; flex: none; color: var(--pr-green); margin-block-start: .15em; }
.pr-kit__foot { margin-block-start: auto; width: 100%; display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding-block-start: .6rem; }
.pr-kit__price { display: flex; align-items: baseline; gap: .4rem; }
.pr-kit__price b { font-family: var(--font-display); font-weight: 600; font-size: 1.4rem; color: var(--pr-green); }
.pr-kit__price s { font-size: .8rem; color: var(--ink-soft); }
.pr-kit__btn {
  padding: .6em 1.1em; border-radius: var(--radius); font-family: var(--font-display); font-weight: 500; font-size: .9rem;
  box-shadow: inset 0 0 0 1.5px var(--pr-green); color: var(--pr-green);
  transition: background-color .25s var(--ease), color .25s var(--ease);
  display: inline-flex; align-items: center; gap: .35rem;
}
.pr-kit__btn svg { width: 15px; height: 15px; }
.pr-kit:hover .pr-kit__btn { background: var(--pr-green); color: #fff; }
.pr-kit.is-selected .pr-kit__btn { background: var(--pr-green); color: #fff; }
/* Бейдж «выбрано» на фото */
.pr-kit__badge {
  position: absolute; inset-inline-start: .7rem; inset-block-start: .7rem;
  padding: .3rem .6rem; border-radius: var(--radius-sm);
  font-size: .75rem; font-weight: 500; color: #fff; background: var(--pr-green);
  opacity: 0; transform: translateY(-4px); transition: opacity .25s, transform .25s;
}
.pr-kit.is-selected .pr-kit__badge { opacity: 1; transform: none; }
/* Состояние «אזל» — выбор заблокирован */
.pr-kit.is-soldout { cursor: not-allowed; }
.pr-kit.is-soldout:hover { transform: none; box-shadow: none; }
.pr-kit.is-soldout .pr-kit__photo img { filter: grayscale(1); opacity: .55; }
.pr-kit.is-soldout .pr-kit__badge { opacity: 1; transform: none; background: var(--ink-soft); }
.pr-kit.is-soldout .pr-kit__btn { box-shadow: inset 0 0 0 1.5px var(--border); color: var(--ink-soft); background: transparent !important; cursor: not-allowed; }
.pr-kit.is-soldout .pr-kit__price b { color: var(--ink-soft); }
/* Мало осталось */
.pr-kit__low { font-size: .75rem; color: var(--pr-warn); font-weight: 500; }

/* ---------- Формы ------------------------------------------------------------- */
.pr-form { display: flex; flex-direction: column; gap: 1rem; }
.pr-field { display: flex; flex-direction: column; gap: .35rem; }
.pr-label { font-size: .88rem; font-weight: 500; color: var(--pr-title-ink); }
.pr-req { color: var(--pr-err); font-weight: 600; }
.pr-input {
  width: 100%; padding: .8em 1em; border-radius: var(--radius);
  border: 1px solid var(--border); background: var(--ground-2); color: var(--ink);
  font: inherit; font-size: 1rem; line-height: 1.4;
  transition: border-color .2s var(--ease), background-color .2s var(--ease);
}
.pr-input:focus { outline: none; border-color: var(--pr-green); background: var(--surface); }
.pr-input::placeholder { color: #9a8a90; }
.pr-input--ltr { direction: ltr; text-align: start; }
.pr-input.is-invalid { border-color: var(--pr-err); background: var(--pr-err-soft); }
textarea.pr-input { resize: vertical; min-height: 64px; }
.pr-field__hint { font-size: .8rem; color: var(--ink-soft); }
.pr-field__err { font-size: .8rem; color: var(--pr-err); font-weight: 500; min-height: 0; }
.pr-field__err:empty { display: none; }
.pr-grid2 { display: grid; gap: 1rem; grid-template-columns: 1fr; }
.pr-grid3 { display: grid; gap: 1rem; grid-template-columns: repeat(3, 1fr); }
@media (min-width: 560px) { .pr-grid2 { grid-template-columns: 1fr 1fr; } }
.pr-fieldset { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .8rem; }
.pr-fieldset > legend { padding: 0; margin-block-end: .4rem; }

/* Кастомные чекбоксы согласий */
.pr-consents { display: flex; flex-direction: column; gap: .7rem; padding: 1rem; border-radius: var(--radius); background: var(--ground-2); }
.pr-check { display: flex; align-items: flex-start; gap: .6rem; cursor: pointer; font-size: .88rem; line-height: 1.45; }
.pr-check input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.pr-check__box {
  flex: none; width: 20px; height: 20px; margin-block-start: .1em; border-radius: var(--radius-sm);
  border: 1.5px solid var(--ink-soft); background: var(--surface); position: relative;
  transition: background-color .2s, border-color .2s;
}
.pr-check__box::after {
  content: ""; position: absolute; inset: 3px; border-radius: 2px;
  background: #fff; opacity: 0; transform: scale(.4);
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
  transition: opacity .15s, transform .15s;
}
.pr-check input:checked + .pr-check__box { background: var(--pr-green); border-color: var(--pr-green); }
.pr-check input:checked + .pr-check__box::after { opacity: 1; transform: scale(1); }
.pr-check input:focus-visible + .pr-check__box { outline: 3px solid var(--pr-green); outline-offset: 2px; }
.pr-check.is-invalid .pr-check__box { border-color: var(--pr-err); }
.pr-check__text a { color: var(--pr-green); text-decoration: underline; text-underline-offset: 3px; }

/* Уведомления внутри шагов */
.pr-alert { padding: .8rem 1rem; border-radius: var(--radius); font-size: .9rem; border: 1px solid transparent; }
.pr-alert--warn { background: var(--pr-warn-soft); color: var(--pr-warn); border-color: rgba(183,121,31,.3); }
.pr-alert--err { background: var(--pr-err-soft); color: var(--pr-err); border-color: rgba(194,38,46,.25); }
.pr-alert--ok { background: var(--pr-green-soft); color: var(--pr-green); }

/* ---------- OTP (SMS-код) ------------------------------------------------------- */
.pr-otp__lead { color: var(--ink-soft); display: flex; flex-wrap: wrap; gap: .4rem; align-items: baseline; }
.pr-otp__phone { font-weight: 500; color: var(--pr-title-ink); }
.pr-otp__inputs { display: flex; gap: .5rem; justify-content: center; }
.pr-otp__digit {
  width: clamp(40px, 12vw, 54px); height: clamp(50px, 14vw, 64px);
  text-align: center; font-family: var(--font-display); font-size: 1.5rem; font-weight: 500;
  border: 1.5px solid var(--border); border-radius: var(--radius); background: var(--ground-2); color: var(--ink);
  transition: border-color .2s, background-color .2s;
}
.pr-otp__digit:focus { outline: none; border-color: var(--pr-green); background: var(--surface); }
.pr-otp.is-error .pr-otp__digit { border-color: var(--pr-err); animation: pr-shake .35s var(--ease); }
@keyframes pr-shake { 0%,100% { transform: none; } 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }
.pr-otp__resend { text-align: center; font-size: .88rem; color: var(--ink-soft); }
.pr-otp__resend b { color: var(--pr-title-ink); font-variant-numeric: tabular-nums; }
.pr-otp__demo { text-align: center; opacity: .7; }
/* Экран ожидания проверки */
.pr-checking { align-items: center; text-align: center; padding-block: 2rem; color: var(--ink-soft); }
.pr-spinner {
  width: 34px; height: 34px; border-radius: 50%;
  border: 3px solid var(--border); border-block-start-color: var(--pr-green);
  animation: pr-spin .8s linear infinite; display: inline-block;
}
@keyframes pr-spin { to { transform: rotate(360deg); } }

/* ---------- Доп. товары (шаг 3) -------------------------------------------------- */
.pr-products { display: grid; gap: .9rem; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 720px) { .pr-products { grid-template-columns: repeat(3, 1fr); } }
.pr-prod { display: flex; flex-direction: column; gap: .45rem; border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; background: var(--surface); }
.pr-prod__photo { aspect-ratio: 4 / 5; overflow: hidden; background: var(--ground-2); position: relative; }
.pr-prod__photo img { width: 100%; height: 100%; object-fit: cover; }
.pr-prod__tag { position: absolute; inset-inline-start: .5rem; inset-block-start: .5rem; padding: .2rem .5rem; border-radius: var(--radius-sm); font-size: .72rem; font-weight: 500; color: #fff; background: var(--tag, var(--is-dark)); }
.pr-prod__body { padding: 0 .75rem .75rem; display: flex; flex-direction: column; gap: .3rem; flex: 1; }
.pr-prod__name { font-weight: 500; font-size: .92rem; color: var(--pr-title-ink); }
.pr-prod__meta { font-size: .78rem; color: var(--ink-soft); }
.pr-prod__foot { margin-block-start: auto; display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding-block-start: .3rem; }
.pr-prod__price { font-family: var(--font-display); font-weight: 600; font-variant-numeric: tabular-nums; }
/* Кнопка быстрого добавления → превращается в степпер */
.pr-prod__add {
  width: 36px; height: 36px; border-radius: var(--radius); display: grid; place-items: center;
  background: var(--is-dark); color: #fff; transition: background-color .2s;
}
.pr-prod__add:hover { background: var(--pr-green); }
.pr-prod__add svg { width: 18px; height: 18px; }
.pr-qty { display: inline-flex; align-items: center; border: 1.5px solid var(--pr-green); border-radius: var(--radius); overflow: hidden; }
.pr-qty button { width: 32px; height: 34px; display: grid; place-items: center; color: var(--pr-green); font-size: 1.1rem; transition: background-color .2s; }
.pr-qty button:hover { background: var(--pr-green-soft); }
.pr-qty output { min-width: 28px; text-align: center; font-weight: 500; font-variant-numeric: tabular-nums; }
/* Промокод */
.pr-promocode { margin-block-start: 1.2rem; display: flex; flex-direction: column; gap: .4rem; }
.pr-promocode__row { display: flex; gap: .5rem; }
.pr-promocode__row .pr-input { flex: 1; }
.pr-promocode .is-ok { color: var(--pr-green); font-weight: 500; }
.pr-promocode .is-err { color: var(--pr-err); font-weight: 500; }

/* ---------- Доставка (шаг 4) ------------------------------------------------------ */
.pr-shipopts { display: grid; gap: .8rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .pr-shipopts { grid-template-columns: 1fr 1fr; } }
.pr-shipopt { cursor: pointer; }
.pr-shipopt input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.pr-shipopt__body {
  display: flex; align-items: center; gap: .8rem; padding: 1rem;
  border: 1.5px solid var(--border); border-radius: var(--radius-lg); background: var(--surface);
  transition: border-color .2s, box-shadow .2s;
}
.pr-shipopt__body > svg { width: 28px; height: 28px; color: var(--pr-green); flex: none; }
.pr-shipopt__text { display: flex; flex-direction: column; gap: .1rem; flex: 1; min-width: 0; }
.pr-shipopt__text b { font-weight: 500; color: var(--pr-title-ink); }
.pr-shipopt__text small { font-size: .78rem; color: var(--ink-soft); }
.pr-shipopt__price { font-family: var(--font-display); font-weight: 600; white-space: nowrap; direction: ltr; }
.pr-shipopt__price.is-free { color: var(--pr-green); }
.pr-shipopt__price.is-free s { color: var(--ink-soft); font-weight: 400; font-size: .8em; margin-inline-end: .3em; }
.pr-shipopt input:checked + .pr-shipopt__body { border-color: var(--pr-green); box-shadow: 0 0 0 3px var(--pr-green-soft); }
.pr-shipopt input:focus-visible + .pr-shipopt__body { outline: 3px solid var(--pr-green); outline-offset: 2px; }
/* Список пунктов выдачи */
.pr-points { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; max-height: 300px; overflow: auto; padding-inline-end: .2rem; }
.pr-point {
  display: flex; align-items: center; gap: .7rem; width: 100%; text-align: start;
  padding: .7rem .9rem; border: 1.5px solid var(--border); border-radius: var(--radius); background: var(--surface);
  transition: border-color .2s, background-color .2s;
}
.pr-point:hover { border-color: var(--ink-soft); }
.pr-point[aria-checked="true"] { border-color: var(--pr-green); background: var(--pr-green-soft); }
.pr-point__dot { flex: none; width: 16px; height: 16px; border-radius: 50%; border: 1.5px solid var(--ink-soft); position: relative; }
.pr-point[aria-checked="true"] .pr-point__dot { border-color: var(--pr-green); }
.pr-point[aria-checked="true"] .pr-point__dot::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--pr-green); }
.pr-point__text { display: flex; flex-direction: column; gap: .05rem; flex: 1; min-width: 0; }
.pr-point__text b { font-weight: 500; font-size: .92rem; color: var(--pr-title-ink); }
.pr-point__text small { font-size: .78rem; color: var(--ink-soft); }
.pr-point__hours { font-size: .74rem; color: var(--ink-soft); white-space: nowrap; }

/* ---------- Оплата (шаг 5) ---------------------------------------------------------- */
.pr-review { margin: 0 0 1.2rem; display: grid; gap: .5rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .pr-review { grid-template-columns: 1fr 1fr; } }
.pr-review > div { padding: .8rem 1rem; border-radius: var(--radius); background: var(--ground-2); font-size: .88rem; }
.pr-review dt { color: var(--ink-soft); font-size: .78rem; margin-block-end: .15rem; }
.pr-review dd { margin: 0; color: var(--pr-title-ink); font-weight: 500; }
.pr-payopts { display: grid; gap: .8rem; grid-template-columns: 1fr; margin-block-end: .8rem; }
@media (min-width: 640px) { .pr-payopts { grid-template-columns: 1fr 1fr; } }
.pr-payopt { cursor: pointer; }
.pr-payopt input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.pr-payopt__body {
  display: flex; align-items: center; gap: .8rem; padding: 1rem;
  border: 1.5px solid var(--border); border-radius: var(--radius-lg); background: var(--surface);
  transition: border-color .2s, box-shadow .2s;
}
.pr-payopt__body > svg { width: 28px; height: 28px; flex: none; color: var(--pr-title-ink); }
.pr-payopt__body > span { display: flex; flex-direction: column; gap: .1rem; }
.pr-payopt__body b { font-weight: 500; color: var(--pr-title-ink); }
.pr-payopt__body small { font-size: .78rem; color: var(--ink-soft); }
.pr-payopt input:checked + .pr-payopt__body { border-color: var(--pr-green); box-shadow: 0 0 0 3px var(--pr-green-soft); }
.pr-payopt input:focus-visible + .pr-payopt__body { outline: 3px solid var(--pr-green); outline-offset: 2px; }
/* Демо-выбор результата оплаты (прототип) */
.pr-demo-pay { margin-block-start: 1rem; padding: .7rem .9rem; border: 1px dashed var(--pr-warn); border-radius: var(--radius); font-size: .82rem; color: var(--ink-soft); }
.pr-demo-pay summary { cursor: pointer; color: var(--pr-warn); font-weight: 500; }
.pr-demo-pay label { display: block; margin-block-start: .4rem; }

/* ---------- Sticky-сводка --------------------------------------------------------- */
.pr-summary {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-soft);
}
@media (min-width: 980px) { .pr-summary { position: sticky; inset-block-start: 5.6rem; } }
.pr-summary__toggle { display: none; }
.pr-summary__body { padding: 1.2rem; display: flex; flex-direction: column; gap: 1rem; }
.pr-summary__title { font-size: var(--step-1); }
.pr-lines { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.pr-line { display: flex; align-items: center; gap: .7rem; padding-block: .6rem; border-block-end: 1px solid var(--border); font-size: .9rem; }
.pr-line img { width: 44px; height: 55px; object-fit: cover; border-radius: var(--radius-sm); flex: none; }
.pr-line__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .1rem; }
.pr-line__text b { font-weight: 500; color: var(--pr-title-ink); }
.pr-line__text small { font-size: .76rem; color: var(--ink-soft); }
.pr-line__price { font-variant-numeric: tabular-nums; white-space: nowrap; direction: ltr; }
/* Акционная позиция: бейдж «מתנה», количество зафиксировано */
.pr-line--gift .pr-line__price { color: var(--pr-green); font-weight: 600; }
.pr-line__gift { display: inline-block; font-size: .7rem; padding: .1rem .4rem; border-radius: var(--radius-sm); background: var(--pr-green-soft); color: var(--pr-green); font-weight: 500; }
.pr-line__qty { font-size: .78rem; color: var(--ink-soft); }
.pr-line__remove { color: var(--ink-soft); font-size: .74rem; text-decoration: underline; padding: 0; }
.pr-line__remove:hover { color: var(--pr-err); }
/* Прогресс до бесплатной доставки */
.pr-shipbar { display: flex; flex-direction: column; gap: .4rem; padding: .8rem; border-radius: var(--radius); background: var(--ground-2); }
.pr-shipbar__text { font-size: .82rem; color: var(--ink-soft); }
.pr-shipbar__text b { color: var(--pr-title-ink); direction: ltr; unicode-bidi: isolate; }
.pr-shipbar.is-free .pr-shipbar__text { color: var(--pr-green); font-weight: 500; }
.pr-shipbar__track { height: 6px; border-radius: 3px; background: var(--border); overflow: hidden; }
.pr-shipbar__fill { display: block; height: 100%; width: 0; background: var(--pr-green); border-radius: 3px; transition: width .5s var(--ease-out); }
/* Итоги. Отрицательные суммы обёрнуты в <bdi dir="ltr"> — минус остаётся слева */
.pr-totals { margin: 0; display: flex; flex-direction: column; gap: .4rem; }
.pr-totals__row { display: flex; justify-content: space-between; gap: 1rem; font-size: .92rem; color: var(--ink-soft); }
.pr-totals__row dt small { font-size: .78rem; }
.pr-totals__row dd { margin: 0; font-variant-numeric: tabular-nums; color: var(--pr-title-ink); }
.pr-totals__row--discount dd { color: var(--pr-green); font-weight: 500; }
.pr-totals__grand {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: .8rem 1rem; margin-block-start: .3rem; border-radius: var(--radius); background: var(--ground-2);
}
.pr-totals__grand dt { font-family: var(--font-display); font-weight: 500; font-size: var(--step-1); color: var(--pr-title-ink); }
.pr-totals__grand dd { margin: 0; font-family: var(--font-display); font-weight: 600; font-size: 1.6rem; color: var(--pr-title-ink); font-variant-numeric: tabular-nums; }
.pr-summary__note { font-size: .74rem; color: var(--ink-soft); }

/* Мобильная версия сводки: фиксированная нижняя панель, тело раскрывается вверх */
@media (max-width: 979px) {
  .pr-summary {
    position: fixed; inset-inline: 0; inset-block-end: 0; z-index: 320;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0; border-block-end: 0;
    box-shadow: 0 -12px 40px -18px rgba(0,0,0,.35);
    max-height: 80vh; display: flex; flex-direction: column;
  }
  .pr-summary__toggle {
    display: flex; align-items: center; gap: .8rem; width: 100%;
    min-height: var(--pr-bar-h); padding: .6rem 1.1rem; text-align: start;
  }
  .pr-summary__toggle-label { font-weight: 500; color: var(--pr-title-ink); }
  .pr-summary__toggle-total { margin-inline-start: auto; color: var(--ink-soft); font-size: .9rem; }
  .pr-summary__toggle-total b { color: var(--pr-title-ink); font-family: var(--font-display); font-size: 1.15rem; direction: ltr; unicode-bidi: isolate; }
  .pr-summary__chev { width: 20px; height: 20px; color: var(--ink-soft); transition: transform .3s var(--ease); }
  .pr-summary.is-open .pr-summary__chev { transform: rotate(180deg); }
  .pr-summary__body { display: none; overflow: auto; border-block-start: 1px solid var(--border); }
  .pr-summary.is-open .pr-summary__body { display: flex; }
  .pr-summary__title { display: none; }
  /* Отступ контента под панель + поднимаем виджеты сайта над панелью */
  .pr-main { padding-block-end: calc(var(--pr-bar-h) + 2rem); }
  .pr-body .a11y { bottom: calc(var(--pr-bar-h) + 1rem); }
  .pr-body .cookies { inset-block-end: calc(var(--pr-bar-h) + .8rem); }
  .pr-body .footer { padding-block-end: calc(var(--pr-bar-h) + 1.5rem); }
  /* Когда сводка скрыта (thank-you / заблокировано) — панели нет */
  .pr-summary[hidden] { display: none; }
}

/* ---------- Thank-you ------------------------------------------------------------- */
.pr-thanks { max-width: 860px; padding-block: 6.5rem 2rem;  /* сверху — место под фиксированную шапку */ display: flex; flex-direction: column; gap: 1.2rem; }
.pr-thanks__hero { text-align: center; padding-block: 1rem; }
/* Анимированная галочка (как на thank-you.html) */
.pr-thanks__check { width: 92px; height: 92px; margin-inline: auto; display: block; }
.pr-thanks__check circle { fill: none; stroke: var(--pr-green); stroke-width: 2.4; stroke-dasharray: 264; stroke-dashoffset: 264; animation: pr-draw .8s var(--ease-out) forwards; }
.pr-thanks__check path { fill: none; stroke: var(--pr-green); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 60; stroke-dashoffset: 60; animation: pr-draw .5s .55s var(--ease-out) forwards; }
@keyframes pr-draw { to { stroke-dashoffset: 0; } }
.pr-thanks__title { font-size: var(--step-3); margin-block-start: .8rem; }
.pr-thanks__num { display: inline-flex; gap: .45rem; margin-block-start: .6rem; padding: .5rem 1.1rem; border-radius: var(--radius); background: var(--ground-2); font-family: var(--font-display); font-weight: 500; }
.pr-thanks__num b { font-weight: 600; letter-spacing: .04em; }
.pr-thanks__sub { color: var(--ink-soft); font-weight: 300; margin-block-start: .6rem; }
.pr-thanks__grid { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 700px) { .pr-thanks__grid { grid-template-columns: 1fr 1fr; } }
.pr-box { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-soft); padding: 1.3rem; display: flex; flex-direction: column; gap: .8rem; }
.pr-box h3 { font-size: var(--step-1); }
.pr-thanks__kit { display: flex; align-items: center; gap: .8rem; }
.pr-thanks__kit img { width: 72px; height: 90px; object-fit: cover; border-radius: var(--radius-sm); }
.pr-thanks__kit b { display: block; font-weight: 500; color: var(--pr-title-ink); }
.pr-thanks__kit small { color: var(--pr-green); font-weight: 500; }
.pr-thanks__extras { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .3rem; font-size: .88rem; color: var(--ink-soft); }
.pr-thanks__extras:empty { display: none; }
.pr-thanks__extras li { display: flex; justify-content: space-between; gap: .6rem; }
.pr-thanks__total { padding-block-start: .6rem; border-block-start: 1px solid var(--border); font-weight: 500; }
.pr-thanks__total b { font-family: var(--font-display); font-weight: 600; font-size: 1.2rem; }
.pr-thanks__ship { font-size: .92rem; color: var(--ink-soft); }
.pr-thanks__ship b { color: var(--pr-title-ink); font-weight: 500; }
.pr-thanks__eta b { color: var(--pr-green); }
.pr-thanks__actions { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: center; }
@media (max-width: 560px) { .pr-thanks__actions .pr-btn { width: 100%; } }

/* ---------- Условия (аккордеон) ---------------------------------------------------- */
.pr-terms { padding-block: 2rem 1rem; max-width: 860px; text-align: center; }
.pr-terms__title { font-size: var(--step-2); margin-block-end: 1rem; }
.pr-acc { display: flex; flex-direction: column; gap: .5rem; }
.pr-acc__item { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); }
.pr-acc__item summary {
  text-align: start; cursor: pointer; padding: .9rem 1.1rem; font-weight: 500; color: var(--pr-title-ink);
  list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 1rem;
}
.pr-acc__item summary::-webkit-details-marker { display: none; }
.pr-acc__item summary::after { content: "+"; font-family: var(--font-display); font-size: 1.2rem; color: var(--pr-green); transition: transform .3s var(--ease); }
.pr-acc__item[open] summary::after { transform: rotate(45deg); }
.pr-acc__body { text-align: start; padding: 0 1.1rem 1rem; font-size: .9rem; color: var(--ink-soft); line-height: 1.6; }
.pr-terms__links { margin-block-start: 1.2rem; font-size: .82rem; color: var(--ink-soft); }
.pr-terms__links a { text-decoration: underline; text-underline-offset: 3px; }
.pr-terms__links a:hover { color: var(--pr-green); }

/* ---------- Оверлей перехода к оплате ------------------------------------------------ */
.pr-overlay { position: fixed; inset: 0; z-index: 400; display: grid; place-items: center; background: rgba(43,27,46,.55); backdrop-filter: blur(4px); }
.pr-overlay[hidden] { display: none; }
.pr-overlay__card { background: var(--surface); border-radius: var(--radius-lg); padding: 2rem 2.4rem; display: flex; flex-direction: column; align-items: center; gap: 1rem; box-shadow: var(--shadow-lg); text-align: center; max-width: 320px; }

/* ---------- Демо-панель (?demo=1) ---------------------------------------------------- */
.pr-demo {
  position: fixed; inset-inline-start: 1rem; inset-block-start: 50%; transform: translateY(-50%); z-index: 360;
  display: flex; flex-direction: column; gap: .3rem; padding: .6rem;
  background: var(--is-black); color: #fff; border-radius: var(--radius); font-size: .74rem;
  box-shadow: var(--shadow-lg); max-width: 130px;
}
.pr-demo[hidden] { display: none; }
.pr-demo button { text-align: start; padding: .3rem .5rem; border-radius: var(--radius-sm); color: rgba(255,255,255,.8); }
.pr-demo button:hover { background: rgba(255,255,255,.12); color: #fff; }
.pr-demo button.is-active { background: var(--pr-green); color: #fff; }

/* ---------- Футер: 3 колонки на десктопе --------------------------------------------- */
@media (min-width: 620px) { .pr-footer__grid { grid-template-columns: 1.6fr 1fr 1fr; } }

/* ---------- Reduced motion ------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .pr-step, .pr-thanks__check circle, .pr-thanks__check path, .pr-hero__bg, .pr-hero__cue { animation: none; }
  .pr-benefit, .pr-recipe__photo img { transition: none; }
  .pr-benefit:hover { transform: none; }
  .pr-thanks__check circle, .pr-thanks__check path { stroke-dashoffset: 0; }
  .pr-btn, .pr-kit, .pr-kit__photo img, .pr-shipbar__fill, .pr-summary__chev, .pr-acc__item summary::after { transition: none; }
  .pr-btn:hover, .pr-kit:hover { transform: none; }
  .pr-spinner { animation-duration: 1.6s; }
  .pr-otp.is-error .pr-otp__digit { animation: none; }
}
