
/* ============================================================
   INNOLEAD - innolead.ru
   Главное правило: ШЕСТЬ размеров текста на весь сайт.
   Ни одного font-size мимо шкалы. Если нужен размер между -
   берется соседняя ступень, а не новое число.
   ============================================================ */

:root{
  /* Палитра из программ Точка Роста / Управление */
  --deep:#0d4a39;
  --dark:#082f24;
  --gold:#b8912f;
  --gold-br:#d3b054;
  --sage:#e5efe8;
  --tint:#f3ecd9;
  --bg:#fbf9f1;
  --ink:#22352c;
  --muted:#6f7d74;
  --line:#dfe6dc;

  --disp:'Playfair Display', Georgia, serif;
  --body:'Golos Text', 'Helvetica Neue', Arial, sans-serif;

  /* ---- ШКАЛА. Шесть ступеней, других размеров в файле нет ---- */
  --t1:0.82rem;                              /* рубрика, подпись */
  --t2:1.0rem;                               /* вспомогательный текст */
  --t3:1.12rem;                              /* основной текст */
  --t4:clamp(1.4rem, 1.2rem + 0.8vw, 1.9rem);/* название карточки, лид */
  --t5:clamp(1.8rem, 1.4rem + 1.7vw, 2.5rem);  /* заголовок секции */
  --t6:clamp(2.4rem, 1.5rem + 3.6vw, 4rem);/* первый экран */

  /* ---- РИТМ. Четыре шага отступа ---- */
  --s1:0.6rem; --s2:1.4rem; --s3:2.6rem; --s4:clamp(4rem,9vw,7rem);

  --ease:cubic-bezier(0.22,1,0.36,1);
  --gut:clamp(1.25rem,4vw,3.5rem);
  --r:14px;
}

*,*::before,*::after{ box-sizing:border-box; }
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--body); font-size:var(--t3); line-height:1.65; font-weight:400;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{ font-family:var(--disp); font-weight:400; margin:0; color:var(--deep); line-height:1.12; }
p{ margin:0; }
img{ max-width:100%; display:block; }
.wrap{ width:min(100% - var(--gut)*2, 1160px); margin-inline:auto; }

.kicker{
  font-size:var(--t1); letter-spacing:0.22em; text-transform:uppercase;
  color:var(--gold); font-weight:600; margin-bottom:var(--s2);
}

/* ---------- Шапка ---------- */
.top{
  position:sticky; top:0; z-index:20; background:color-mix(in srgb, var(--bg) 92%, transparent);
  backdrop-filter:blur(14px); border-bottom:1px solid var(--line);
}
.top__in{ display:flex; align-items:center; justify-content:space-between; gap:var(--s3); padding:1rem 0; }
.wordmark{ font-family:var(--disp); font-size:var(--t3); letter-spacing:0.2em; color:var(--deep); text-decoration:none; }
.wordmark span{ color:var(--gold); }
.top nav{ display:flex; gap:var(--s3); font-size:var(--t2); }
.top nav a{ color:var(--ink); text-decoration:none; }
.top nav a:hover{ color:var(--deep); }
@media(max-width:900px){ .top nav{ display:none; } }

/* ---------- Кнопки ---------- */
.btn{
  display:inline-flex; align-items:center; gap:0.5rem; padding:0.85rem 1.5rem;
  background:var(--deep); color:var(--bg); border:1px solid var(--deep); border-radius:var(--r);
  text-decoration:none; font-size:var(--t2); font-weight:500;
  transition:transform 0.4s var(--ease), background 0.35s ease;
}
.btn:hover{ transform:translateY(-2px); background:var(--dark); }
.btn:active{ transform:translateY(0); }
.btn .arr{ transition:transform 0.4s var(--ease); }
.btn:hover .arr{ transform:translateX(4px); }
.btn--soft{ background:transparent; color:var(--deep); border-color:var(--line); }
.btn--soft:hover{ background:var(--sage); border-color:var(--sage); }
.btn--light{ background:var(--bg); color:var(--deep); border-color:var(--bg); }
:where(a,button,summary):focus-visible{ outline:2px solid var(--gold); outline-offset:3px; border-radius:4px; }

/* ---------- Первый экран ---------- */
.hero{ padding:var(--s4) 0 var(--s3); }
.hero h1{ font-size:var(--t6); line-height:1.0; max-width:15ch; margin-bottom:var(--s2); text-wrap:balance; }
.hero h1 u{ text-decoration:none; background:linear-gradient(transparent 66%, var(--gold-br) 66%); }
.hero__lead{ font-size:var(--t4); line-height:1.42; max-width:38ch; color:var(--deep); font-family:var(--disp); }
.hero__cta{ display:flex; gap:0.8rem; flex-wrap:wrap; margin:var(--s3) 0 var(--s1); }
.hero__note{ font-size:var(--t2); color:var(--muted); }

.facts{
  display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s2) var(--s3);
  margin-top:var(--s4); padding-top:var(--s3); border-top:1px solid var(--line);
}
.fact__num{ font-family:var(--disp); font-size:var(--t4); color:var(--deep);
  display:block; margin-bottom:var(--s1); font-variant-numeric:tabular-nums; }
.fact__txt{ font-size:var(--t2); color:var(--muted); line-height:1.5; display:block; }
@media(max-width:760px){ .facts{ grid-template-columns:1fr; } }

/* ---------- Секции ---------- */
.section{ padding:var(--s4) 0; }
.section--sage{ background:var(--sage); }
.section--tint{ background:var(--tint); }
.section__head{ max-width:52ch; margin-bottom:var(--s3); }
.section-title{ font-size:var(--t5); text-wrap:balance; }
.section-lead{ margin-top:var(--s2); font-size:var(--t3); color:var(--muted); max-width:48ch; }

/* ---------- Одна главная мысль ---------- */
.panel-dark{
  background:linear-gradient(135deg, var(--dark), var(--deep) 65%);
  color:#f4f7f2; border-radius:var(--r); padding:var(--s4) var(--s3);
  text-align:center; position:relative; overflow:hidden;
}
.panel-dark h2{ color:#fff; font-size:var(--t5); max-width:20ch; margin-inline:auto; }
.panel-dark p{ margin:var(--s2) auto 0; font-size:var(--t3); opacity:0.85; max-width:46ch; }
.panel-dark .btn{ margin-top:var(--s3); }

/* ---------- Четыре карточки продуктов ---------- */
.cards{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--s2); }
@media(max-width:820px){ .cards{ grid-template-columns:1fr; } }

.card{
  background:var(--bg); border:1px solid var(--line); border-radius:var(--r);
  padding:var(--s3); display:flex; flex-direction:column; height:100%;
  transition:transform 0.5s var(--ease), box-shadow 0.5s var(--ease);
}
.card:hover{ transform:translateY(-3px); box-shadow:0 16px 44px rgba(13,74,57,0.09); }
.card__n{ font-size:var(--t1); letter-spacing:0.2em; color:var(--gold); font-weight:600; }
.card__name{ font-family:var(--disp); font-size:var(--t4); color:var(--deep); margin:var(--s1) 0 0; }
.card__who{
  font-size:var(--t2); color:var(--deep); background:var(--sage);
  border-radius:99px; padding:0.35rem 0.9rem; align-self:flex-start; margin-top:var(--s2);
}
.card ul{ list-style:none; margin:var(--s2) 0 var(--s3); padding:0; font-size:var(--t2); color:var(--muted); }
.card li{ position:relative; padding-left:1.1rem; margin-bottom:0.5rem; line-height:1.5; }
.card li::before{ content:""; position:absolute; left:0; top:0.62em; width:6px; height:6px;
  border-radius:50%; background:var(--gold-br); }
.card__foot{
  margin-top:auto; padding-top:var(--s2); border-top:1px solid var(--line);
  display:flex; align-items:center; justify-content:space-between; gap:var(--s2); flex-wrap:wrap;
}
.card__price{ font-size:var(--t2); font-weight:600; color:var(--deep); font-variant-numeric:tabular-nums; }

/* ---------- Ленты ---------- */
.rail-head{ display:flex; justify-content:space-between; gap:var(--s2); margin-bottom:var(--s2); }
.rail-hint{ font-size:var(--t1); letter-spacing:0.18em; text-transform:uppercase; color:var(--muted); }
.rail{
  display:grid; grid-auto-flow:column; grid-auto-columns:minmax(320px,380px); gap:var(--s2);
  overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:var(--s2);
  margin-inline:calc(var(--gut)*-1); padding-inline:var(--gut);
  scrollbar-width:thin; scrollbar-color:var(--line) transparent;
}
.rail > *{ scroll-snap-align:start; }
.rail::-webkit-scrollbar{ height:3px; }
.rail::-webkit-scrollbar-thumb{ background:var(--line); border-radius:3px; }

.case{
  background:var(--bg); border:1px solid var(--line); border-radius:var(--r);
  padding:var(--s3); display:flex; flex-direction:column;
  transition:transform 0.5s var(--ease), box-shadow 0.5s var(--ease);
}
.case:hover{ transform:translateY(-3px); box-shadow:0 16px 44px rgba(13,74,57,0.09); }
.case--wide{ grid-column:span 2; }
.case__tag{ font-size:var(--t1); letter-spacing:0.16em; text-transform:uppercase; color:var(--gold); }
.case__num{
  font-family:var(--disp); font-size:var(--t4); color:var(--deep);
  margin:var(--s2) 0 var(--s1); font-variant-numeric:tabular-nums; line-height:1.05;
  white-space:nowrap;                 /* цифра не рвется на две строки */
}
/* Строки карточки одинаковой высоты - тогда заголовки и тексты
   во всех карточках начинаются на одном уровне */
.case{ display:grid; grid-template-rows:auto auto minmax(2.4em,auto) 1fr; align-content:start; }
.case__name{ font-family:var(--disp); font-size:var(--t4); color:var(--deep); display:block; margin-bottom:var(--s1); }
.case__txt{ font-size:var(--t2); color:var(--muted); line-height:1.55; }
@media(max-width:640px){ .case--wide{ grid-column:span 1; } }

/* ---------- Клиенты: лента, листается ---------- */
.rail--clients{ grid-auto-columns:minmax(170px,190px); }
.client{
  background:var(--bg); border:1px solid var(--line); border-radius:var(--r);
  display:grid; grid-template-rows:1fr auto; gap:var(--s1); place-items:center;
  padding:var(--s2); text-align:center; text-decoration:none; color:var(--deep);
  aspect-ratio:1; transition:background 0.4s ease, transform 0.45s var(--ease);
}
.client img{ max-height:44px; max-width:100%; width:auto; object-fit:contain;
  filter:grayscale(1); opacity:0.55; transition:filter 0.4s ease, opacity 0.4s ease; }
.client__name{ font-family:var(--disp); font-size:var(--t3); }
.client__field{ font-size:var(--t1); letter-spacing:0.12em; text-transform:uppercase; color:var(--muted); }
a.client:hover{ background:var(--sage); transform:translateY(-3px); }
a.client:hover img{ filter:none; opacity:1; }

/* ---------- Обо мне ---------- */
.about{ display:grid; grid-template-columns:0.8fr 1.2fr; gap:var(--s4); align-items:center; }
.about__photo{ border-radius:var(--r); overflow:hidden; background:var(--sage); }
.about__photo img{ width:100%; height:auto; display:block; }
.about h2{ font-size:var(--t5); margin-bottom:var(--s2); }
.about p + p{ margin-top:var(--s2); }
.about__list{ list-style:none; margin:var(--s3) 0 0; padding:0; }
.about__list li{ position:relative; padding-left:1.2rem; margin-bottom:0.6rem; font-size:var(--t2); }
.about__list li::before{ content:""; position:absolute; left:0; top:0.62em; width:6px; height:6px;
  border-radius:50%; background:var(--gold-br); }
@media(max-width:860px){ .about{ grid-template-columns:1fr; gap:var(--s3); } }

/* ---------- Отзывы ---------- */
.rail--rev{ grid-auto-columns:minmax(190px,220px); }
.vreview{ all:unset; cursor:pointer; position:relative; display:block; border-radius:var(--r);
  overflow:hidden; aspect-ratio:9/16; background:var(--sage); }
.vreview img{ width:100%; height:100%; object-fit:cover; transition:transform 0.7s var(--ease); }
.vreview:hover img{ transform:scale(1.05); }
.vreview__grad{ position:absolute; inset:auto 0 0 0; height:56%;
  background:linear-gradient(to top, rgba(8,47,36,0.9), transparent); }
.vreview__who{ position:absolute; left:1rem; right:1rem; bottom:0.9rem; color:#fff; }
.vreview__name{ font-family:var(--disp); font-size:var(--t3); display:block; }
.vreview__role{ font-size:var(--t1); opacity:0.85; display:block; }
.vreview__play{ position:absolute; top:50%; left:50%; translate:-50% -50%; width:48px; height:48px;
  border-radius:50%; background:rgba(251,249,241,0.93); display:grid; place-items:center;
  transition:transform 0.45s var(--ease); }
.vreview__play::after{ content:""; border-left:11px solid var(--deep);
  border-block:7px solid transparent; margin-left:3px; }
.vreview:hover .vreview__play{ transform:translate(-50%,-50%) scale(1.1); }

/* ---------- Появление ---------- */
.rv{ opacity:0; transform:translateY(14px); animation:rv 0.8s var(--ease) both; }
@keyframes rv{ to{ opacity:1; transform:none; } }
.d1{ animation-delay:0.05s; } .d2{ animation-delay:0.16s; } .d3{ animation-delay:0.28s; } .d4{ animation-delay:0.4s; }
@supports (animation-timeline: view()){
  .section .rv{ animation-timeline:view(); animation-range:entry 5% cover 26%; animation-delay:0s; }
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:0.01ms !important; transition-duration:0.01ms !important; }
  .rv{ opacity:1; transform:none; }
}

.note{ position:fixed; left:50%; bottom:1rem; translate:-50% 0; z-index:30; background:var(--deep);
  color:var(--bg); font-size:var(--t1); padding:0.6rem 1.1rem; border-radius:10px;
  box-shadow:0 10px 30px rgba(8,47,36,0.25); }

/* ============================================================
   Секции, которых не было в образце: материалы, форма, подвал,
   мобильное меню, модалка видео.
   Размеры - только по шкале --t1...--t6, отступы - --s1...--s4.
   ============================================================ */

/* ---------- Бесплатные материалы ---------- */
.magnets{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:var(--s2); }
.magnet{
  background:var(--bg); border:1px solid var(--line); border-radius:var(--r);
  padding:var(--s3); display:flex; flex-direction:column;
  transition:transform 0.5s var(--ease), box-shadow 0.5s var(--ease);
}
.magnet:hover{ transform:translateY(-3px); box-shadow:0 16px 44px rgba(13,74,57,0.09); }
.magnet h3{ font-size:var(--t4); margin-bottom:var(--s1); }
.magnet p{ font-size:var(--t2); color:var(--muted); }
.magnet .btn{ margin-top:auto; align-self:flex-start; }
.magnet p{ margin-bottom:var(--s3); }

/* ---------- Форма ---------- */
.form{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--s2); }
.field{ display:flex; flex-direction:column; gap:0.4rem; }
.field--wide{ grid-column:1 / -1; }
.field label{ font-size:var(--t2); color:var(--muted); }
.field input, .field select, .field textarea{
  font-family:var(--body); font-size:var(--t3); color:var(--ink);
  background:var(--bg); border:1px solid var(--line); border-radius:var(--r);
  padding:0.85rem 1rem; transition:border-color 0.3s ease;
}
.field input:hover, .field select:hover, .field textarea:hover{ border-color:var(--muted); }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible{
  outline:2px solid var(--gold); outline-offset:2px; border-color:var(--gold);
}
.field textarea{ resize:vertical; min-height:7rem; }
.field--error input, .field--error select{ border-color:var(--gold); }
.field__err{ font-size:var(--t2); color:var(--gold); }
.form__agree{
  grid-column:1 / -1; display:flex; gap:0.7rem; align-items:flex-start;
  font-size:var(--t2); color:var(--muted);
}
.form__agree input{ margin-top:0.3rem; accent-color:var(--deep); width:1.05rem; height:1.05rem; flex:none; }
.form__agree a{ color:var(--deep); }
.form__submit{ grid-column:1 / -1; display:flex; align-items:center; gap:var(--s2); flex-wrap:wrap; }
.form__done{
  grid-column:1 / -1; background:var(--sage); border-radius:var(--r); padding:var(--s3);
  font-size:var(--t3); color:var(--deep);
}
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
@media(max-width:720px){ .form{ grid-template-columns:1fr; } }

/* Кнопка в состоянии отправки */
.btn[aria-busy="true"]{ opacity:0.7; pointer-events:none; }
.btn:disabled{ opacity:0.5; cursor:not-allowed; }

/* ---------- Подвал ---------- */
.foot{ background:var(--dark); color:#e7ece7; padding:var(--s4) 0 var(--s3); }
.foot a{ color:#e7ece7; }
.foot__grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:var(--s3); }
.foot__grid h3{ color:#fff; font-size:var(--t4); margin-bottom:var(--s2); }
.foot ul{ list-style:none; margin:0; padding:0; font-size:var(--t2); }
.foot li{ margin-bottom:0.6rem; }
.foot__bottom{
  margin-top:var(--s4); padding-top:var(--s2); border-top:1px solid rgba(255,255,255,0.14);
  display:flex; justify-content:space-between; gap:var(--s2); flex-wrap:wrap;
  font-size:var(--t2); opacity:0.75;
}
.foot :where(a):focus-visible{ outline-color:var(--gold-br); }
@media(max-width:760px){ .foot__grid{ grid-template-columns:1fr; } }

/* ---------- Мобильное меню ---------- */
.burger{
  display:none; background:none; border:1px solid var(--line); border-radius:var(--r);
  padding:0.55rem 0.7rem; cursor:pointer;
}
.burger span{ display:block; width:20px; height:1.5px; background:var(--deep); margin:4px 0;
  transition:transform 0.4s var(--ease), opacity 0.3s ease; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(5.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-5.5px) rotate(-45deg); }
.mnav{
  position:fixed; inset:0; background:var(--bg); z-index:30; padding:var(--s4) var(--gut);
  display:flex; flex-direction:column; gap:var(--s2);
  opacity:0; visibility:hidden; transition:opacity 0.35s ease, visibility 0.35s;
}
.mnav.is-open{ opacity:1; visibility:visible; }
.mnav a{ font-family:var(--disp); font-size:var(--t4); color:var(--deep); text-decoration:none; }
@media(max-width:900px){
  .burger{ display:block; }
  .top__in > .btn{ display:none; }
}

/* ---------- Модалка видео ---------- */
.modal{
  position:fixed; inset:0; z-index:40; background:rgba(8,47,36,0.9);
  display:grid; place-items:center; padding:var(--gut);
  opacity:0; visibility:hidden; transition:opacity 0.3s ease, visibility 0.3s;
}
.modal.is-open{ opacity:1; visibility:visible; }
.modal__box{ width:min(100%, 420px); aspect-ratio:9/16; border-radius:var(--r); overflow:hidden; background:#000; }
.modal__box iframe{ width:100%; height:100%; border:0; }
.modal__close{
  position:absolute; top:var(--s2); right:var(--gut); background:none; border:0; cursor:pointer;
  color:#fff; font-size:var(--t4); font-family:var(--disp);
}

/* ---------- Если JS не отработал, текст все равно виден ---------- */
.no-js .rv{ opacity:1; transform:none; animation:none; }

/* ============================================================
   Телефон. Проверено от 320px: горизонтальной прокрутки нет,
   ни один блок не выходит за экран.
   ============================================================ */
@media (max-width:560px){
  :root{ --s3:1.8rem; --s4:3.2rem; }

  /* На узком экране заголовок должен помещаться, а не рваться */
  .hero h1{ max-width:none; }
  .hero__lead{ max-width:none; }
  .hero__cta .btn{ width:100%; justify-content:center; }

  /* Ленты: карточка почти во всю ширину, видно край следующей */
  .rail{ grid-auto-columns:minmax(0, 82vw); }
  .rail--rev{ grid-auto-columns:minmax(0, 58vw); }
  .rail--clients{ grid-auto-columns:minmax(0, 44vw); }

  .card__foot{ flex-direction:column; align-items:flex-start; }
  .card__foot .btn{ width:100%; justify-content:center; }

  .form__submit{ flex-direction:column; align-items:stretch; }
  .form__submit .btn{ width:100%; justify-content:center; }

  .panel-dark{ padding:var(--s4) var(--s2); }
  .modal__box{ width:100%; }
  .modal__close{ right:var(--s2); }
}

/* Ничто не должно вылезать за ширину экрана */
html, body{ max-width:100%; overflow-x:hidden; }
img, svg, iframe{ max-width:100%; }

/* ============================================================
   Правки по аудиту 16.08.2026
   ============================================================ */

/* Ошибка не должна выглядеть как рубрика: у золотого другая роль */
:root{ --error:#b4552f; }
.field--error input, .field--error select, .field--error textarea{ border-color:var(--error); }
.field__err{ color:var(--error); }

/* Ленты листаются на любом экране - решение Виктории.
   Общее количество не бросается в глаза, человек листает сам. */
@media (min-width:900px){
  .rail{ scroll-behavior:smooth; }
  .rail::-webkit-scrollbar{ height:6px; }
  .rail::-webkit-scrollbar-thumb{ background:var(--line); border-radius:6px; }
  .rail::-webkit-scrollbar-thumb:hover{ background:var(--muted); }
}

/* Sticky-шапка ломается, если overflow-x стоит на html или body.
   Ограничиваем ширину без обрезки на корневых элементах. */
html, body{ max-width:none; overflow-x:visible; }
body{ overflow-x:clip; }

/* Лента листается с клавиатуры: сама получает фокус, дальше стрелки */
.rail:focus-visible{ outline:2px solid var(--gold); outline-offset:6px; border-radius:var(--r); }

/* ---------- Значки в подвале ---------- */
.foot__links a{ display:inline-flex; align-items:center; gap:0.6rem; }
.ico{
  width:20px; height:20px; flex:none; border-radius:5px;
  background:rgba(255,253,250,0.12); display:inline-grid; place-items:center;
  background-repeat:no-repeat; background-position:center; background-size:13px 13px;
}
.ico--tg{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e7ece7'%3E%3Cpath d='M21.9 4.3 18.8 19c-.2 1-.9 1.3-1.7.8l-4.7-3.5-2.3 2.2c-.3.3-.5.5-1 .5l.4-4.9L18.4 6c.4-.3-.1-.5-.6-.2L7.7 12.1 3 10.6c-1-.3-1-1 .2-1.5l17.4-6.7c.9-.3 1.6.2 1.3 1.9z'/%3E%3C/svg%3E"); }
.ico--ig{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e7ece7' stroke-width='2'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1.2' fill='%23e7ece7' stroke='none'/%3E%3C/svg%3E"); }
.ico--tel{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e7ece7'%3E%3Cpath d='M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.2.4 2.4.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1-9.4 0-17-7.6-17-17 0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1l-2.3 2.2z'/%3E%3C/svg%3E"); }
.ico--bot{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e7ece7' stroke-width='2'%3E%3Crect x='4' y='7' width='16' height="13" rx='3'/%3E%3Cpath d='M12 7V3'/%3E%3Ccircle cx='9' cy='13' r='1.2' fill='%23e7ece7'/%3E%3Ccircle cx='15' cy='13' r='1.2' fill='%23e7ece7'/%3E%3C/svg%3E"); }

/* ============================================================
   Страница продукта: подробности и цена внизу
   ============================================================ */
.product{ padding-top:var(--s4); padding-bottom:var(--s4); max-width:78ch; }
.product__back{ font-size:var(--t2); color:var(--muted); text-decoration:none; display:inline-block; margin-bottom:var(--s3); }
.product__back:hover{ color:var(--deep); }
.product__h1{ font-size:var(--t6); line-height:1.02; margin-bottom:var(--s2); text-wrap:balance; }
.product__who{
  display:inline-block; background:var(--sage); color:var(--deep);
  border-radius:99px; padding:0.4rem 1rem; font-size:var(--t2); margin-bottom:var(--s2);
}
.product__lead{ font-family:var(--disp); font-size:var(--t4); line-height:1.4; color:var(--deep); }
.product__block{ margin-top:var(--s4); }
.product__block h2{ font-size:var(--t5); margin-bottom:var(--s2); }
.product__list{ list-style:none; margin:0; padding:0; }
.product__list li{ position:relative; padding-left:1.3rem; margin-bottom:0.7rem; }
.product__list li::before{ content:""; position:absolute; left:0; top:0.68em; width:7px; height:7px;
  border-radius:50%; background:var(--gold-br); }
.product__list li b{ color:var(--deep); font-weight:600; }
.product__list--no li::before{ border-radius:0; height:1px; width:11px; background:var(--muted); top:0.85em; }
.product__list--no li{ color:var(--muted); }

.weeks{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.week{
  display:grid; grid-template-columns:7rem 1fr 1fr; gap:0.4rem var(--s2);
  padding:var(--s2) 0; border-bottom:1px solid var(--line); align-items:baseline;
}
.week__n{ font-family:var(--disp); color:var(--gold); font-size:var(--t2); }
.week__t{ font-family:var(--disp); color:var(--deep); font-size:var(--t3); }
.week__r{ color:var(--muted); font-size:var(--t2); }
@media(max-width:720px){
  .week{ grid-template-columns:1fr; gap:0.25rem; }
}

.price-box{
  margin-top:var(--s4); padding:var(--s3); border-radius:var(--r);
  background:var(--sage); display:flex; justify-content:space-between;
  align-items:center; gap:var(--s3); flex-wrap:wrap;
}
.price-box__num{ font-family:var(--disp); font-size:var(--t5); color:var(--deep);
  font-variant-numeric:tabular-nums; }
.price-box__note{ font-size:var(--t2); color:var(--muted); margin-top:var(--s1); max-width:44ch; }
