/* =======================================================================
   БЛОКИ, КОТОРЫХ НЕ БЫЛО В v2.
   Услуги списком, отзывы, FAQ, форма заявки, контакты, карта структуры.
   Всё на переменных темы из style.css — цвета и радиусы отсюда не задаются.
   ======================================================================= */

/* Якоря: шапка липкая, без этого заголовок блока уезжает под неё */
section[id]{scroll-margin-top:calc(var(--header-h, 76px) + 18px);}

/* --- 03. Услуги списком ------------------------------------------------ */

.offer-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:var(--grid-gap);
  margin-top:36px;
}
.offer-card{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:var(--card-pad);
  background:var(--card-bg);
  border:var(--card-border);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-md);
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.offer-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-lg);
  border-color:rgba(255,255,255,.98);
}
.offer-card.is-main{
  border-color:rgba(168,50,88,.34);
  box-shadow:0 0 0 1px rgba(168,50,88,.22),0 26px 60px -34px rgba(91,75,196,.5);
}
.offer-tag{
  align-self:flex-start;
  font-family:var(--font-label);
  font-size:var(--fs-label);
  font-weight:var(--label-weight);
  letter-spacing:var(--label-tracking);
  text-transform:var(--label-transform);
  color:var(--accent);
  background:rgba(255,255,255,.7);
  border-radius:999px;
  padding:6px 12px;
}
.offer-card h3{margin:6px 0 0;font-size:var(--fs-card-h);}
.offer-card p{margin:0;color:var(--text-soft);font-size:15.5px;}
.offer-price{
  margin-top:auto;
  padding-top:14px;
  font-family:var(--font-num);
  font-size:24px;
  font-weight:var(--price-weight);
  color:var(--price-color);
}
.offer-more{
  font-size:13.5px;
  font-weight:600;
  color:var(--text-strong);
  border-top:1px solid var(--border);
  padding-top:14px;
}
.offer-card:hover .offer-more span{margin-left:4px;}

/* --- 06. Отзывы -------------------------------------------------------- */

.reviews-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:var(--grid-gap);
  margin-top:34px;
}
.review-card{margin:0;}
.review-card figcaption{
  margin-top:12px;
  font-size:13.5px;
  color:var(--text-faint);
  text-align:center;
}
.review-slot{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:230px;
  padding:24px;
  text-align:center;
  border-radius:var(--radius-lg);
  border:2px dashed rgba(21,19,30,.16);
  background:rgba(255,255,255,.4);
  color:var(--text-faint);
}
.review-slot svg{width:34px;height:34px;opacity:.7;}
.review-slot span{
  font-family:var(--font-label);
  font-size:var(--fs-label);
  font-weight:var(--label-weight);
  letter-spacing:var(--label-tracking);
  text-transform:var(--label-transform);
}
.review-note{margin-top:26px;}

/* --- 08. Частые вопросы ------------------------------------------------ */

.faq-list{margin-top:34px;}
.faq-item{
  background:var(--card-bg);
  border:var(--card-border);
  border-radius:var(--radius-md);
  box-shadow:var(--shadow-sm);
  margin-bottom:10px;
  overflow:hidden;
}
.faq-item summary{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:20px 24px;
  cursor:pointer;
  list-style:none;
  font-family:var(--font-display);
  font-weight:var(--display-weight);
  font-size:17px;
  line-height:1.4;
  letter-spacing:var(--display-tracking);
  color:var(--text-strong);
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{
  content:"";
  flex:0 0 auto;
  width:12px;height:12px;
  margin-top:6px;
  border-right:2px solid var(--accent);
  border-bottom:2px solid var(--accent);
  transform:rotate(45deg);
  transition:transform .25s ease;
}
.faq-item[open] summary::after{transform:rotate(-135deg);}
.faq-item[open] summary{padding-bottom:6px;}
.faq-a{padding:0 24px 22px;}
.faq-a p{margin:0;color:var(--text-soft);}
.faq-item:hover{border-color:rgba(255,255,255,.98);}

/* --- 09. Форма заявки (лежит на тёмной секции) ------------------------- */

.lead-form{max-width:660px;margin:26px auto 0;}
.lead-form-fields{
  display:grid;
  grid-template-columns:1fr 1fr auto;
  gap:12px;
  align-items:end;
}
.field{display:flex;flex-direction:column;gap:8px;text-align:left;}
.field-label{
  font-family:var(--font-label);
  font-size:var(--fs-label);
  font-weight:var(--label-weight);
  letter-spacing:var(--label-tracking);
  text-transform:var(--label-transform);
  color:var(--dark-accent);
}
.field input{
  width:100%;
  padding:15px 18px;
  font-family:var(--font-body);
  font-size:16px;
  color:var(--dark-text-strong);
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.2);
  border-radius:var(--radius-sm);
  transition:border-color .2s ease,background .2s ease;
}
.field input::placeholder{color:rgba(179,174,196,.65);}
.field input:hover{background:rgba(255,255,255,.12);}
.field input:focus{
  outline:none;
  border-color:var(--dark-accent);
  background:rgba(255,255,255,.14);
}
.field input.is-error{border-color:#FF7A9B;}
.lead-submit{white-space:nowrap;}
.final-cta .lead-submit{
  background:var(--dark-accent);
  color:#15131E;
  border-color:transparent;
}
.final-cta .lead-submit:hover{background:#FAAFC9;color:#15131E;}
.lead-form-error{
  margin:14px 0 0;
  font-size:14px;
  color:#FF9DB6;
}
.lead-form-note{
  margin:16px 0 0;
  font-size:14px;
  color:var(--dark-text);
}
.lead-done{
  max-width:660px;
  margin:26px auto 0;
  padding:30px;
  border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.06);
}
.lead-done h3{margin:0 0 10px;}
.lead-done p{margin:0 0 20px;}
.lead-done .contact-buttons{justify-content:center;}

/* --- 10. Контакты ------------------------------------------------------ */

.contacts-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:var(--grid-gap);
  margin-top:34px;
}
.contact-item{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:24px;
  background:var(--card-bg);
  border:var(--card-border);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm);
  transition:transform .25s ease,box-shadow .25s ease;
}
.contact-item:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);}
.contact-item svg{width:26px;height:26px;color:var(--accent);}
.contact-item-mark{
  font-family:var(--font-num);
  font-size:16px;
  font-weight:600;
  color:var(--accent);
  line-height:26px;
}
.contact-item-label{
  font-family:var(--font-label);
  font-size:var(--fs-label);
  font-weight:var(--label-weight);
  letter-spacing:var(--label-tracking);
  text-transform:var(--label-transform);
  color:var(--text-faint);
}
.contact-item strong{color:var(--text-strong);font-size:16px;}

/* --- Стекло: новые панели нужно добавить в общий список темы ----------- */

.offer-card,.faq-item,.contact-item,.review-slot,.lead-done{
  backdrop-filter:blur(18px) saturate(170%);
  -webkit-backdrop-filter:blur(18px) saturate(170%);
}

/* --- Карта структуры. Только для прототипа, на бой не выкладывать ------- */

.proto-toggle{
  position:fixed;
  right:18px;bottom:18px;
  z-index:60;
  padding:11px 18px;
  font-family:var(--font-label);
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#FFFFFF;
  background:#15131E;
  border:none;
  border-radius:999px;
  cursor:pointer;
  box-shadow:0 14px 34px -14px rgba(21,19,30,.6);
}
.proto-toggle:hover{background:#241F35;}
.proto-map{
  position:fixed;
  right:18px;bottom:68px;
  z-index:60;
  width:264px;
  max-height:70vh;
  overflow:auto;
  padding:22px 24px;
  border-radius:var(--radius-lg);
  background:rgba(21,19,30,.94);
  color:#B3AEC4;
  box-shadow:0 30px 70px -30px rgba(21,19,30,.8);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.proto-map[hidden]{display:none;}
.proto-map h4{margin:0 0 14px;color:#F6F4FB;font-size:15px;}
.proto-map ol{margin:0;padding:0;list-style:none;}
.proto-map li{margin-bottom:2px;}
.proto-map a{
  display:flex;
  gap:10px;
  padding:7px 9px;
  border-radius:10px;
  font-size:14px;
  transition:background .2s ease,color .2s ease;
}
.proto-map a:hover{background:rgba(255,255,255,.08);color:#F6F4FB;}
.proto-map b{color:var(--dark-accent);font-family:var(--font-num);font-weight:400;}
.proto-map > p{
  margin:16px 0 0;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.12);
  font-size:12.5px;
}
.proto-map > p a{display:inline;padding:0;text-decoration:underline;}

/* --- Адаптив ----------------------------------------------------------- */

@media (max-width:1000px){
  .offer-cards,.reviews-grid{grid-template-columns:1fr;}
  .contacts-grid{grid-template-columns:repeat(2,1fr);}
  .lead-form-fields{grid-template-columns:1fr;}
  .lead-submit{width:100%;justify-content:center;}
}

@media (max-width:760px){
  .contacts-grid{grid-template-columns:1fr;}
  .faq-item summary{padding:17px 18px;font-size:16px;}
  .faq-a{padding:0 18px 18px;}
  .proto-map{width:calc(100vw - 36px);}
}

/* =======================================================================
   РОЗОВАЯ ПАЛИТРА.
   В блоке «Загляните внутрь» бежевые карточки заменены на розовые —
   фирменный цвет сайта (--pink:#E0457B). Блок с ценой выделен тёмным
   розовым. Файл подключён после style.css, поэтому переопределяет тему.
   ======================================================================= */

:root{
  /* Светлый розовый: темнее фона #F2F1F6, но текст остаётся читаемым */
  --pink-tint:rgba(224,69,123,.13);
  --pink-tint-strong:rgba(224,69,123,.22);
  --pink-border:rgba(224,69,123,.2);
  --pink-label:#B03462;
  --pink-ink:#5B2038;
  /* Концы фирменного градиента. Белый текст: 6.4:1 на розовом, 6.5:1 на фиолетовом */
  --pink-deep:#A83258;
  --pink-deeper:#8A2249;
  --violet-deep:#5B4BC4;
  --grad-panel:linear-gradient(155deg,var(--pink-deep),var(--violet-deep));
  --grad-inline:linear-gradient(115deg,var(--pink-deep),var(--violet-deep));
}

/* --- Карточки альбома: обложка и разворот ------------------------------ */

.peek-mock--cover,
.peek-mock--spread{
  background:var(--pink-tint);
  border-color:var(--pink-border);
}
.peek-mock--cover .eyebrow,
.peek-tags span,
.peek-spread-house{color:var(--pink-label);}
.peek-tags span{border-color:var(--pink-border);background:rgba(255,255,255,.72);}

/* Вставки внутри разворота — белые, чтобы читались поверх розового */
.peek-box{
  background:rgba(255,255,255,.94);
  border:1px solid rgba(255,255,255,.9);
}
.peek-box-label{color:var(--pink-label);}

/* «Для родителя» — самый тёмный слой карточки */
.peek-box--note{
  background:var(--pink-tint-strong);
  border-color:var(--pink-border);
}
.peek-box--note svg{color:var(--pink-label);}
.peek-box--note p{color:var(--pink-ink);}

/* --- Блок с ценой: 2 900 ₽ и «Хочу Дом Котёнка» ------------------------ */

.pricing-buy{
  background:var(--grad-panel);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 26px 60px -30px rgba(91,75,196,.6);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.pricing-buy .price{color:#FFFFFF;}
.pricing-buy .price-note{color:rgba(255,255,255,.88);}
.pricing-buy .contact-cta-label{color:#FFFFFF;}
.pricing-buy .fine-print{color:rgba(255,255,255,.84);}
.pricing-buy .btn-chip{
  /* затемняющая подложка, а не осветляющая: иначе белый текст
     на чипе теряет контраст со светлым концом градиента */
  background:rgba(0,0,0,.16);
  color:#FFFFFF;
  border-color:rgba(255,255,255,.34);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.pricing-buy .btn-chip:hover{
  background:#FFFFFF;
  color:var(--pink-deeper);
  border-color:#FFFFFF;
}

/* --- Воркшопы: таблица форматов крупнее и тёмно-розовая ---------------- */

.workshop-card{grid-template-columns:1fr 1.05fr;}
.workshop-specs{
  background:var(--grad-panel);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 26px 60px -30px rgba(91,75,196,.6);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.workshop-specs .spec-row{
  padding:21px 26px;
  font-size:15.5px;
  border-top-color:rgba(255,255,255,.22);
}
.workshop-specs .spec-row span{color:rgba(255,255,255,.86);}
.workshop-specs .spec-row strong{color:#FFFFFF;}

@media (max-width:1000px){
  .workshop-card{grid-template-columns:1fr;}
}

/* --- Мобильное меню: панель была полупрозрачной ------------------------
   background:var(--surface) — это rgba(255,255,255,.62) без backdrop-filter,
   поэтому сквозь меню читался текст страницы. Делаем непрозрачной, вместе
   с шапкой над ней. */

.mobile-nav{
  background:#F7F5FB;
  box-shadow:0 24px 60px -30px rgba(21,19,30,.5);
}
body.nav-open .site-header{
  background:#F7F5FB;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

/* --- Диалог мамы и дочки: реплики ребёнка розовые, а не фиолетовые ----- */

.dlg-line.kid .dlg-bubble{background:var(--grad-inline);}

/* --- Карта структуры: номера в колонку фиксированной ширины ------------ */

.proto-map a{align-items:baseline;gap:12px;}
.proto-map b{
  flex:0 0 auto;
  width:2.2em;
  text-align:right;
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
}

/* --- Весы решений: коричневый акцент -> фиолетово-розовый -------------- */

.scales-widget .scales-token.is-active{color:var(--pink-deep);}
.scales-widget .option-icon{color:var(--pink-deep);}
.scales-widget .option-card.is-checked{border-color:var(--pink-deep);}
.scales-widget .option-card.is-checked .option-check{
  background:var(--pink-deep);
  border-color:transparent;
}
.scales-reveal-btn{
  background:var(--grad-inline);
  color:#FFFFFF;
}

/* =======================================================================
   КОРИЧНЕВЫЙ УХОДИТ С САЙТА.
   --accent был #8A3B07 и раскрашивал 31 место: надзаголовки, галочки
   в списках, номера опор, иконку логотипа, стрелку в «Что меняется
   в разговоре», плашки. Переопределяем переменную — меняется всё сразу.
   ======================================================================= */

:root{
  --accent:#A83258;
  /* Сноска «для родителя» и заметка на первом экране — были в тёплом коричневом */
  --note-bg:rgba(168,50,88,.12);
  --note-fg:#5B2038;
}

/* Реплики пользователя в демо-чате с Котёнком — тот же градиент */
.bubble.user{background:var(--grad-inline);color:#FFFFFF;}

/* Свечение под карточкой «Доступен сейчас» было коричневым */
.roadmap-card.is-active{
  border-color:rgba(255,255,255,.95);
  box-shadow:0 0 0 1px rgba(168,50,88,.3),0 22px 60px -34px rgba(91,75,196,.55);
}

/* Золотой акцент тёмных секций — последнее тёплое пятно на странице.
   #FFB35C -> светло-розовый. Контраст на тёмном фоне #15131E: 8.1:1,
   тёмный текст на кнопке заявки — тоже 8.1:1. */
:root{
  --glow-amber:#F58BB0;
  --dark-accent:#F58BB0;
}

/* --- Ловушка для ботов и второй бейдж в демо-чате ---------------------- */

/* Уводим поле за экран, а не display:none: часть ботов пропускает
   скрытые через display поля, а это как раз должно их поймать. */
.hp-field{
  position:absolute;
  left:-9999px;
  width:1px;height:1px;
  opacity:0;
  pointer-events:none;
}

.chat-badges{
  margin-left:auto;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:3px;
}
.chat-badges .chat-badge{margin-left:0;}