/* ═══════════════════════════════════════════════════════════════════════════
   СЛУЖБА ЗАБОТЫ — redesign 2026-07: hero + карточки-инструменты
   Порядок секций файла = порядок секций страницы:
   настройки → hero/контакты → карточки-инструментов → липкие чипы → панели/
   сабтабы → формы → вердикт-панель сборки → строки узлов → rig-visual →
   ручная сборка → compat-проверки → квизы/карточки товаров → FAQ →
   mobile → reduced-motion
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Настройки страницы ──
   Локальные алиасы репойнтятся на семантические токены (00-settings/colors.css),
   тот же паттерн, что в compare.css/cart.css. */
.care-page{
  --sup-ok:var(--success);      /* совместимо, «мощности хватает» */
  --sup-warn:var(--warning);    /* предупреждение: слабоват, не хватает */
  --sup-danger:var(--danger);  /* ошибка: несовместимо */
  padding:var(--sp-9) var(--page-x) var(--sp-8);
  max-width:var(--container-page);
  margin:0 auto;
}

/* ── Hero: бренд-строка, заголовок, живой контакт ── */
.care-hero{ max-width:720px; margin-bottom:var(--sp-5); }
.care-eyebrow{
  display:flex; align-items:center; gap:10px; margin:0 0 14px;
  font-family:var(--font-mono); font-size:.78rem; font-weight:500;
  letter-spacing:.22em; color:var(--cyan);
}
.care-eyebrow-dot{
  width:8px; height:8px; border-radius:50%; background:var(--cyan);
  box-shadow:0 0 12px var(--cyan-a80);
  animation:carePulse 2.4s ease-in-out infinite;
}
@keyframes carePulse{
  0%,100%{ opacity:1; transform:scale(1); }
  50%{ opacity:.45; transform:scale(.8); }
}
.care-title{
  font-size:clamp(2.2rem,5.5vw,3.6rem); font-weight:800; color:var(--text-hi);
  margin:0; letter-spacing:-.01em;
}
.care-sub{ color:var(--text-soft); margin:14px 0 0; font-size:1rem; line-height:1.65; }

.care-contacts{ display:flex; flex-wrap:wrap; gap:10px; margin-top:var(--sp-3); }
.care-chip{
  display:inline-flex; align-items:center; gap:8px;
  height:var(--h-btn-sm); padding:0 16px; border-radius:var(--r-pill);
  border:1px solid var(--line); background:var(--glass);
  color:var(--text); font-size:.88rem; text-decoration:none;
  transition:border-color .2s, color .2s;
}
.care-chip .ic{ width:18px; height:18px; }
.care-chip-wa{ color:var(--text-hi); }
.care-chip-wa:hover{ border-color:var(--cyan-a45); color:var(--cyan); }
.care-chip-status{ color:var(--text-dim); }
.care-chip-status.is-open{ color:var(--sup-ok); border-color:color-mix(in srgb, var(--success) 30%, transparent); }
.care-status-dot{
  width:8px; height:8px; border-radius:50%; background:var(--text-faint);
  flex-shrink:0;
}
.care-chip-status.is-open .care-status-dot{
  background:var(--sup-ok); box-shadow:0 0 10px color-mix(in srgb, var(--success) 70%, transparent);
}

/* ── Карточки-инструменты ── */
.care-tools{
  display:grid; grid-template-columns:repeat(3,1fr); gap:12px;
  margin-bottom:var(--sp-2);
}
.care-tool{
  display:flex; flex-direction:column; align-items:flex-start; gap:4px;
  padding:18px; text-align:left; cursor:pointer;
  background:var(--glass); border:1px solid var(--line); border-radius:var(--r-lg);
  color:var(--text); font-family:var(--font-body);
  transition:border-color .25s, background .25s, transform .25s;
}
.care-tool:hover{ border-color:var(--cyan-a35); transform:translateY(-3px); }
.care-tool:focus-visible{ outline:2px solid var(--cyan); outline-offset:2px; }
.care-tool.is-active{
  border-color:var(--cyan);
  background:var(--cyan-a05);
}
.care-tool-top{
  display:flex; align-items:center; justify-content:space-between;
  width:100%; margin-bottom:6px; color:var(--text-dim);
}
.care-tool.is-active .care-tool-top{ color:var(--cyan); }
.care-tool-top .ic{ width:22px; height:22px; }
.care-tool-name{ font-size:1rem; font-weight:700; color:var(--text-hi); }
.care-tool-desc{ font-size:.84rem; color:var(--text-dim); line-height:1.45; }

/* ── Панели инструментов ── */
.care-panel{ display:none; }
.care-panel.is-active{ display:block; animation:careFadeUp .35s ease both; }
@keyframes careFadeUp{
  from{ opacity:0; transform:translateY(10px); }
  to{ opacity:1; transform:none; }
}
.care-panel-head{ max-width:760px; margin-bottom:var(--sp-3); }
.care-panel-head h2{
  font-size:1.5rem; font-weight:700; color:var(--text-hi); margin:0 0 10px;
}
.care-panel-head p{ color:var(--text-soft); margin:0; line-height:1.6; font-size:.94rem; }

.care-subtabs{ display:flex; justify-content:center; gap:8px; flex-wrap:wrap; margin-bottom:var(--sp-3); }
.care-subtab{
  height:var(--h-tab); padding:0 18px; cursor:pointer;
  border-radius:var(--r-md); border:1px solid var(--line);
  background:transparent; color:var(--text-dim);
  font-size:.9rem; font-family:var(--font-body);
  transition:border-color .2s, color .2s, background .2s;
}
.care-subtab:hover{ color:var(--text-hi); }
.care-subtab.is-active{
  background:var(--cyan); border-color:var(--cyan);
  color:var(--cta-ink); font-weight:600;
}
.build-sub{ display:none; }
.build-sub.is-active{ display:block; }

/* ── Гайд «с чего начать» ── */
.care-steps{ display:grid; gap:14px; max-width:760px; margin:0 auto; }
.care-step{
  display:flex; gap:16px; padding:18px;
  background:var(--glass); border:1px solid var(--line); border-radius:var(--r-lg);
}
.care-step-num{
  flex-shrink:0; width:38px; height:38px; display:flex; align-items:center;
  justify-content:center; border-radius:50%;
  border:1px solid var(--cyan-a40); color:var(--cyan);
  font-family:var(--font-mono); font-weight:500;
}
.care-step-title{ font-size:1rem; font-weight:700; color:var(--text-hi); margin:6px 0 6px; }
.care-step-text{ color:var(--text-soft); font-size:.9rem; line-height:1.6; margin:0; }
.care-presets{ display:flex; gap:10px; flex-wrap:wrap; margin-top:12px; }
.preset-btn{
  display:inline-flex; align-items:center; gap:8px;
  height:var(--h-btn-sm); padding:0 16px; cursor:pointer;
  border-radius:var(--r-md); border:1px solid var(--line);
  background:var(--glass-2); color:var(--text);
  font-size:.88rem; font-family:var(--font-body);
  transition:border-color .2s, color .2s, transform .2s;
}
.preset-btn:hover{ border-color:var(--cyan-a45); color:var(--text-hi); transform:translateY(-2px); }
.preset-btn .ic{ width:18px; height:18px; }

/* ── Формы подбора ──
   Переключатель уценки живёт внутри формы/квиза, который он влияет (несколько
   независимых чекбоксов синхронизирует main.js по data-clearance-toggle) - не
   единой плашкой над страницей. В desktop-ряду он стоит рядом с кнопкой
   действия (align-items:flex-end выравнивает по низу); на мобильном форма
   становится колонкой, и чекбокс просто идёт по DOM-порядку перед кнопкой. */
.care-form{
  display:flex; align-items:flex-end; gap:14px; flex-wrap:wrap;
  margin-bottom:var(--sp-3);
}
.care-form-inline{ margin-bottom:var(--sp-2); }
.care-form .clearance-check{ margin-bottom:1px; }
.clearance-inline-row{ margin-bottom:var(--sp-2); }
.care-field{ display:flex; flex-direction:column; gap:6px; min-width:200px; }
.care-field>span{
  font-size:.78rem; color:var(--text-dim); letter-spacing:.04em;
}
.care-field input[type="number"], .care-field input[type="search"]{
  height:var(--h-input); padding:0 14px; border-radius:var(--r-md);
  border:1px solid var(--field-border); background:var(--glass);
  color:var(--text-hi); font-size:.95rem; font-family:var(--font-body);
  font-variant-numeric:tabular-nums;
}
.care-field input:focus-visible{ outline:2px solid var(--cyan); outline-offset:-1px; }
.care-submit{
  height:var(--h-input); padding:0 26px; cursor:pointer;
  border:none; border-radius:var(--r-md);
  background:var(--grad-cta); color:var(--cta-ink);
  font-size:.95rem; font-weight:700; font-family:var(--font-body);
  transition:transform .2s, box-shadow .2s;
}
.care-submit:hover{ transform:translateY(-2px); box-shadow:var(--shadow-cta); }
.care-submit:focus-visible{ outline:2px solid var(--cyan); outline-offset:2px; }

.care-hint{ color:var(--text-dim); font-size:.88rem; line-height:1.6; margin:0 0 var(--sp-2); }
.care-hint a{ color:var(--cyan); }

/* ── Вердикт-панель сборки (рендерит main.js) ── */
.care-verdict-slot{ margin-bottom:14px; }
.care-verdict{
  padding:20px; border-radius:var(--r-lg);
  background:var(--glass); border:1px solid color-mix(in srgb, var(--success) 35%, transparent);
}
.care-verdict.is-partial{ border-color:var(--line); }
.care-verdict-main{
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:18px; flex-wrap:wrap;
}
.care-verdict-status{
  display:flex; align-items:center; gap:10px;
  font-size:1.05rem; font-weight:700; color:var(--text-hi);
}
.care-verdict-status .ic{ width:22px; height:22px; color:var(--sup-ok); }
.care-verdict.is-partial .care-verdict-status .ic{ color:var(--text-dim); }
.care-verdict-chips{ display:flex; gap:6px; flex-wrap:wrap; margin-top:10px; }
.care-check{
  display:inline-flex; align-items:center;
  padding:4px 11px; border-radius:var(--r-pill);
  font-size:.78rem; border:1px solid var(--line); color:var(--text-dim);
  cursor:default;
}
.care-check.is-ok{ color:var(--sup-ok); border-color:color-mix(in srgb, var(--success) 32%, transparent); }
.care-check.is-warn{ color:var(--sup-warn); border-color:color-mix(in srgb, var(--warning) 32%, transparent); }
.care-check.is-error{ color:var(--sup-danger); border-color:color-mix(in srgb, var(--danger) 40%, transparent); }
.care-check.is-info{ color:var(--ice); border-color:var(--ice-a25); }

.care-verdict-total{ text-align:right; }
.care-total-label{ display:block; font-size:.78rem; color:var(--text-dim); }
.care-total-sum{
  display:block; font-family:var(--font-mono); font-weight:500;
  font-size:1.5rem; color:var(--text-hi); font-variant-numeric:tabular-nums;
}
.care-total-note{ display:block; font-size:.8rem; color:var(--text-dim); max-width:260px; }

.care-verdict-actions{
  display:flex; gap:10px; flex-wrap:wrap; align-items:center;
  margin-top:16px;
}
.care-btn-primary{
  height:var(--h-btn-sm); padding:0 18px; cursor:pointer;
  border:none; border-radius:var(--r-md);
  background:var(--cyan); color:var(--cta-ink);
  font-size:.88rem; font-weight:700; font-family:var(--font-body);
  transition:transform .2s, box-shadow .2s;
}
.care-btn-primary:hover{ transform:translateY(-2px); box-shadow:0 10px 26px var(--cyan-a30); }
.care-btn-primary.is-done{ background:var(--sup-ok); }
.care-btn-ghost{
  height:var(--h-btn-sm); padding:0 18px; cursor:pointer;
  border-radius:var(--r-md); border:1px solid var(--line);
  background:transparent; color:var(--text);
  font-size:.88rem; font-family:var(--font-body);
  transition:border-color .2s, color .2s;
}
.care-btn-ghost:hover{ border-color:var(--cyan-a45); color:var(--text-hi); }
.care-btn-mini{
  height:var(--h-chip); padding:0 13px; cursor:pointer;
  border-radius:var(--r-pill); border:1px solid var(--line);
  background:transparent; color:var(--text-dim);
  font-size:.8rem; font-family:var(--font-body);
  transition:border-color .2s, color .2s;
}
.care-btn-mini:hover{ color:var(--text-hi); border-color:var(--glass-line); }
.care-btn-ghost.is-done{ border-color:color-mix(in srgb, var(--success) 40%, transparent); color:var(--sup-ok); }
/* гость нажал «Оставить заявку» → кнопка превращается в WhatsApp + регистрацию */
.care-request-alt{ display:inline-flex; align-items:center; gap:12px; flex-wrap:wrap; }
.care-request-alt .care-btn-ghost{ display:inline-flex; align-items:center; text-decoration:none; }
.care-request-reg{ font-size:.8rem; color:var(--text-dim); }
.care-request-reg:hover{ color:var(--cyan); }
.care-verdict-note{ margin:12px 0 0; font-size:.82rem; color:var(--text-dim); line-height:1.55; }
.care-verdict-note a{ color:var(--cyan); }

/* ── Строки узлов сборки ── */
.care-rows-slot{ margin-bottom:var(--sp-2); }
.care-rows{ border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
.care-row{ padding:12px 16px; }
.care-row+.care-row{ border-top:1px solid var(--line); }
.care-row-main{
  display:grid; grid-template-columns:120px 1fr auto auto;
  align-items:center; gap:14px;
}
.care-row-slot{
  font-family:var(--font-mono); font-size:.7rem; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase; color:var(--text-faint);
}
.care-row-name{ color:var(--text-hi); font-size:.92rem; text-decoration:none; min-width:0; }
.care-row-name:hover{ color:var(--cyan); }
.care-row-price{
  font-family:var(--font-mono); font-size:.92rem; color:var(--text-hi);
  font-variant-numeric:tabular-nums; white-space:nowrap;
}
.care-row-arg{
  grid-column:2/-1; margin:4px 0 0; font-size:.8rem;
  color:var(--text-dim); line-height:1.5;
}
.care-row.is-order{ background:var(--pure-white-a02); }
.care-row-badge{
  display:inline-flex; align-items:center; padding:3px 10px;
  border-radius:var(--r-pill); border:1px dashed var(--glass-line);
  font-family:var(--font-mono); font-size:.7rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--text-dim); white-space:nowrap;
}
.build-add{
  height:32px; padding:0 13px; cursor:pointer; white-space:nowrap;
  border-radius:var(--r-md); border:1px solid var(--cyan-a40);
  background:transparent; color:var(--cyan);
  font-size:.8rem; font-family:var(--font-body);
  transition:background .2s, color .2s;
}
.build-add:hover{ background:var(--cyan-a12); }
.build-add.is-added{ border-color:color-mix(in srgb, var(--success) 40%, transparent); color:var(--sup-ok); }
.build-error{ color:var(--sup-warn); font-size:.9rem; }

/* ── Визуальная «сборка» — 8 узлов из pc_builder.SLOTS «загораются» по мере
   подбора (бюджет) или ручного выбора. Разметка общая для обоих режимов
   (store/_rig_visual.html); main.js переключает .is-filled и текст плитки. ── */
.rig-visual{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
  gap:.7rem;
  margin-bottom:1.4rem;
}
.rig-slot{
  position:relative;
  display:flex;
  align-items:center;
  gap:.6rem;
  padding:.8rem .9rem;
  background:var(--glass);
  border:1px solid var(--line);
  border-radius: var(--r-md);
  transition:border-color .3s ease, background .3s ease, box-shadow .3s ease;
}
.rig-slot-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  flex-shrink:0;
  border-radius: var(--r-sm);
  background:var(--pure-white-a04);
  color:var(--white-a35);
  transition:color .3s ease, background .3s ease;
}
.rig-slot-icon .ic{ width:20px; height:20px; }

/* название узла (не выбранного товара - см. комментарий в _rig_visual.html).
   Перенос на 2 строки, а не обрезка троеточием: без второй строки (текст
   товара убран) в плитке хватает высоты, а «Материнская плата»/«Оперативная
   память» в одну строку с иконкой и чеком физически не влезают. */
.rig-slot-name{
  min-width:0;
  flex:1;
  font-size:.74rem;
  font-weight:600;
  line-height:1.25;
  letter-spacing:.01em;
  color:var(--white-a50);
  transition:color .3s ease;
}
.rig-slot.is-filled{
  border-color:var(--cyan-a35);
  background:var(--cyan-a05);
  box-shadow:0 0 0 1px var(--cyan-a08), 0 8px 24px var(--cyan-a10);
}
.rig-slot.is-filled .rig-slot-icon{ color:var(--cyan); background:var(--cyan-a14); }
.rig-slot.is-filled .rig-slot-name{ color:var(--white); }

/* каскадная «сборка» по очереди — только в момент применения результата
   подбора по бюджету (main.js на миг добавляет .is-cascading перед update);
   у ручной сборки клик по одному узлу остаётся мгновенным. */
.rig-visual.is-cascading .rig-slot{ transition-delay:calc(var(--i, 0) * 55ms); }
.rig-visual.is-cascading .rig-slot-icon{ transition-delay:calc(var(--i, 0) * 55ms); }

/* ── Ручная сборка ── */
.care-manual{ display:flex; flex-direction:column; gap:10px; margin-bottom:var(--sp-2); }
.care-manual-row{
  display:grid; grid-template-columns:230px 1fr; align-items:center; gap:14px;
  padding:10px 14px; border:1px solid var(--line); border-radius:var(--r-md);
  background:var(--glass);
}
.care-manual-name{
  display:flex; align-items:center; gap:10px;
  font-size:.9rem; font-weight:600; color:var(--text);
}
.care-manual-name .ic{ width:18px; height:18px; color:var(--text-dim); flex-shrink:0; }
.care-manual-advice{ margin:0; font-size:.82rem; color:var(--text-dim); line-height:1.5; }
.care-total{
  font-family:var(--font-mono); font-size:1.1rem; font-weight:500;
  color:var(--text-hi); font-variant-numeric:tabular-nums;
  margin-bottom:var(--sp-2);
}

/* ── Проверки совместимости (ручная сборка + апгрейд) ── */
.care-compat{ display:flex; flex-direction:column; gap:10px; margin-bottom:var(--sp-2); }
.compat-missing{ color:var(--text-dim); font-size:.88rem; margin:0; }
.care-check-card{
  padding:14px 16px; border-radius:var(--r-md);
  background:var(--glass); border:1px solid var(--line);
  border-left:3px solid var(--text-faint); border-top-left-radius:0; border-bottom-left-radius:0;
}
.care-check-card.is-ok{ border-left-color:var(--sup-ok); }
.care-check-card.is-warn{ border-left-color:var(--sup-warn); }
.care-check-card.is-error{ border-left-color:var(--sup-danger); }
.care-check-card.is-info{ border-left-color:var(--ice); }
.care-check-title{ margin:0 0 4px; font-size:.92rem; font-weight:700; color:var(--text-hi); }
.care-check-msg{ margin:0; font-size:.85rem; color:var(--text-soft); line-height:1.55; }
.care-suggest{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; flex-wrap:wrap; margin-top:10px; padding-top:10px;
  border-top:1px solid var(--line);
}
.care-suggest-info{ font-size:.85rem; color:var(--text-soft); }
.care-suggest-info a{ color:var(--cyan); text-decoration:none; }
.care-suggest-info a:hover{ text-decoration:underline; }

/* ── Апгрейд: сетка «что у вас стоит» ── */
.care-grid-head{
  font-family:var(--font-mono); font-size:.74rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--text-dim);
  margin:0 0 12px;
}
.care-grid{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(230px, 1fr));
  gap:14px; margin-bottom:var(--sp-3);
}

/* ── Квизы ── */
.care-quiz-q{ font-size:.95rem; font-weight:600; color:var(--text-hi); margin:0 0 12px; }
.care-quiz-opts{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:var(--sp-3); }
.quiz-opt{
  height:var(--h-btn-sm); padding:0 18px; cursor:pointer;
  border-radius:var(--r-pill); border:1px solid var(--line);
  background:var(--glass); color:var(--text);
  font-size:.88rem; font-family:var(--font-body);
  transition:border-color .2s, color .2s, background .2s;
}
.quiz-opt:hover{ border-color:var(--cyan-a40); color:var(--text-hi); }
.quiz-opt.is-active{
  border-color:var(--cyan); color:var(--cyan);
  background:var(--cyan-a07);
}
.quiz-result{ max-width:820px; }
.quiz-result h3{ font-size:1.1rem; font-weight:700; color:var(--text-hi); margin:0 0 8px; }
.quiz-result>p{ color:var(--text-soft); font-size:.92rem; line-height:1.6; margin:0 0 10px; }
.care-link{
  display:inline-block; color:var(--cyan); font-size:.88rem;
  text-decoration:none; margin-bottom:var(--sp-2);
}
.care-link:hover{ text-decoration:underline; }

/* ── Карточки товаров в подборах (ноутбуки/периферия/принтеры) ── */
.care-cards-head{
  font-family:var(--font-mono); font-size:.72rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--text-dim);
  margin:0 0 10px;
}
.care-cards{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr));
  gap:12px;
}
.care-card{
  display:flex; flex-direction:column; text-decoration:none;
  border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden;
  background:var(--glass);
  transition:border-color .25s, transform .25s;
}
.care-card:hover{ border-color:var(--cyan-a40); transform:translateY(-3px); }
.care-card-img{
  display:block; aspect-ratio:4/3; background:var(--pure-white);
}
.care-card-img img{ width:100%; height:100%; object-fit:contain; display:block; }
.care-card-body{ display:flex; flex-direction:column; gap:6px; padding:12px 14px 14px; }
.care-card-name{ font-size:.88rem; color:var(--text-hi); line-height:1.4; }
.care-card-reason{ font-size:.78rem; color:var(--text-dim); line-height:1.45; }
.care-card-price{
  font-family:var(--font-mono); font-size:.95rem; font-weight:500;
  color:var(--cyan); font-variant-numeric:tabular-nums;
}
.care-card.is-skeleton{ min-height:220px; }

/* подбор пуст → предложение заявки */
.care-empty-suggest{
  padding:16px 18px; border:1px dashed var(--glass-line); border-radius:var(--r-lg);
}
.care-empty-suggest p{ margin:0 0 12px; color:var(--text-soft); font-size:.9rem; }

/* ── Чекбокс «Учитывать уценённый товар» (общий компонент страницы) ── */
.clearance-check{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  height:var(--h-btn-sm, 40px);
  padding:0 .9rem;
  border-radius: var(--r-md);
  background:var(--pure-white-a04);
  border:1px solid var(--pure-white-a12);
  color:var(--white-a80);
  font-size:.88rem;
  font-weight:500;
  cursor:pointer;
  user-select:none;
  transition:border-color .2s, background .2s, color .2s;
}
.clearance-check:hover{
  border-color:var(--cyan-a35);
  color:var(--pure-white);
}
.clearance-check input[type="checkbox"]{
  position:absolute;
  width:0;
  height:0;
  opacity:0;
}
.clearance-check-box{
  position:relative;
  width:16px;
  height:16px;
  flex-shrink:0;
  border-radius: var(--r-xs);
  border:1.5px solid var(--pure-white-a32);
  background:var(--pure-white-a04);
  transition:background .2s, border-color .2s;
}
.clearance-check-box::after{
  content:'';
  position:absolute;
  left:4px;
  top:1px;
  width:5px;
  height:9px;
  border:solid var(--bg);
  border-width:0 2px 2px 0;
  transform:rotate(45deg) scale(0);
  transition:transform .15s cubic-bezier(.22, .68, 0, 1.2);
}
.clearance-check input:checked~.clearance-check-box{
  background:var(--cyan);
  border-color:var(--cyan);
}
.clearance-check input:checked~.clearance-check-box::after{
  transform:rotate(45deg) scale(1);
}
.clearance-check input:focus-visible~.clearance-check-box{
  box-shadow:0 0 0 3px var(--cyan-a30);
}

/* ── FAQ: поиск + группы ── */
.care-faq-search{
  display:flex; align-items:center; gap:10px;
  max-width:520px; height:var(--h-input); padding:0 16px;
  border:1px solid var(--field-border); border-radius:var(--r-md);
  background:var(--glass); margin-bottom:var(--sp-2);
}
.care-faq-search .ic{ width:18px; height:18px; color:var(--text-dim); flex-shrink:0; }
.care-faq-search input{
  flex:1; min-width:0; border:none; background:transparent;
  color:var(--text-hi); font-size:.92rem; font-family:var(--font-body);
}
.care-faq-search input:focus{ outline:none; }
.care-faq-search:focus-within{ border-color:var(--cyan-a45); }
.care-faq-empty{ color:var(--text-dim); font-size:.88rem; margin:0 0 var(--sp-2); }
.care-faq-empty a{ color:var(--cyan); }

.care-faq-group{
  font-family:var(--font-mono); font-size:.74rem; font-weight:500;
  letter-spacing:.18em; text-transform:uppercase; color:var(--cyan);
  margin:var(--sp-3) 0 12px;
}
.care-faq-list{ display:flex; flex-direction:column; gap:8px; max-width:860px; }
.faq-item{
  border:1px solid var(--line); border-radius:var(--r-md);
  background:var(--glass);
}
.faq-item summary{
  padding:14px 18px; cursor:pointer; list-style:none;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  font-size:.94rem; font-weight:600; color:var(--text);
  transition:color .2s;
  /* радиус плашки повторён явно — кольцо фокуса идёт по её форме
     (наследовать радиус <details> нельзя, см. 01-base/accessibility.css) */
  border-radius:var(--r-md);
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{
  content:'+'; flex-shrink:0;
  font-family:var(--font-mono); font-size:1rem; color:var(--text-dim);
  transition:transform .25s;
}
.faq-item[open] summary{ color:var(--text-hi); }
.faq-item[open] summary::after{ transform:rotate(45deg); color:var(--cyan); }
.faq-item summary:hover{ color:var(--text-hi); }
.faq-item p{
  margin:0; padding:0 18px 16px;
  color:var(--text-soft); font-size:.88rem; line-height:1.65;
}
.faq-item a{ color:var(--cyan); }

/* ── Mobile ── */
@media(max-width: 1100px){
  .care-tools{ grid-template-columns:repeat(2, 1fr); }
}

@media(max-width: 760px){
  /* top = высота фикс-навбара (--nav-h) + воздух: иначе заголовок «Служба
     заботы» заезжает под шапку (та же схема, что account/compare/wishlist). */
  .care-page{ padding:calc(var(--nav-h) + var(--sp-1)) var(--sp-2) var(--sp-6); }
  .care-contacts{ gap:8px; }
  .care-tools{ gap:8px; }
  .care-tool{ padding:14px; }
  .care-tool-desc{ display:none; }
  .care-form{ align-items:stretch; flex-direction:column; }
  .care-field{ min-width:0; }
  .care-verdict-main{ flex-direction:column; }
  .care-verdict-total{ text-align:left; }
  .care-total-note{ max-width:none; }
  .care-row-main{ grid-template-columns:1fr auto; }
  .care-row-slot{ grid-column:1/-1; }
  .care-row-arg{ grid-column:1/-1; }
  .care-manual-row{ grid-template-columns:1fr; align-items:stretch; }
  .care-cards{ grid-template-columns:repeat(auto-fill, minmax(160px, 1fr)); }
}

@media(max-width: 480px){
  .care-tools{ grid-template-columns:repeat(2, 1fr); }
  .care-tool-name{ font-size:.88rem; }
  .care-quiz-opts{ gap:8px; }
  .quiz-opt{ font-size:.82rem; padding:0 14px; }
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce){
  .care-eyebrow-dot{ animation:none; }
  .care-panel.is-active{ animation:none; }
  .care-tool, .care-tool:hover,
  .care-card, .care-card:hover,
  .preset-btn, .preset-btn:hover,
  .care-submit, .care-submit:hover,
  .care-btn-primary, .care-btn-primary:hover{
    transition:none; transform:none;
  }
  .rig-slot, .rig-slot-icon{
    transition:none;
  }
}