/* ══════════════════════════════════════════════════════════════
   «Твой репетитор» — страница «Тарифы» (новый дизайн)
   Подключается только на /tarify/ (build.js → meta.css).
   Первый экран, карточка тарифа (.price) и финальный призыв — общие, в site.css.
   ══════════════════════════════════════════════════════════════ */

/* Тариф сразу под первым экраном — без большого отступа, как на главной */
.price { padding: clamp(8px, 2vw, 24px) 0 clamp(56px, 7vw, 96px); }
.price__note { margin-top: clamp(28px, 4vw, 44px); text-align: center; font-size: 13.5px; line-height: 1.55; color: var(--text-muted); }

/* ══════════════ ЧАСТЫЕ ВОПРОСЫ ══════════════ */
.qa { padding-bottom: clamp(64px, 8vw, 110px); }
.qa__wrap { max-width: 860px; }
.qa__list { margin-top: clamp(28px, 4vw, 44px); display: flex; flex-direction: column; gap: 12px; }
.qa__item { border-radius: 22px; background: #fff; border: 1px solid var(--border); box-shadow: var(--shadow-xs); transition: border-color .25s ease, box-shadow .25s ease; }
.qa__item:hover { border-color: rgba(26, 26, 31, .16); }
.qa__item[open] { border-color: rgba(232, 115, 74, .35); box-shadow: 0 24px 50px -30px rgba(232, 115, 74, .45), var(--shadow-xs); }
.qa__item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px clamp(20px, 3vw, 28px); list-style: none; cursor: pointer; font-size: clamp(16px, 1.6vw, 18px); font-weight: 600; letter-spacing: -.01em; }
.qa__item summary::-webkit-details-marker { display: none; }
.qa__item summary i { flex-shrink: 0; width: 34px; height: 34px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; background: rgba(232, 115, 74, .1); color: var(--tutor-t); transition: transform .3s var(--ease-out), background .25s ease, color .25s ease; }
.qa__item[open] summary i { transform: rotate(45deg); background: var(--tutor); color: #fff; }
.qa__item summary:focus-visible { outline: 2px solid var(--tutor); outline-offset: 2px; border-radius: 22px; }
.qa__item p { padding: 0 clamp(20px, 3vw, 28px) 24px; max-width: 700px; font-size: 15.5px; line-height: 1.65; color: var(--text-secondary); }

.final .final__fine { margin-top: 18px; font-size: 14px; color: rgba(255, 255, 255, .5); }