/* ============================================================================
   LEXPREMISE — page-tariff.css
   Универсальный шаблон для тарифных страниц (проверка / обслуживание / суд).
   Подключать ПОСЛЕ chrome.css.
   ============================================================================ */

/* ===== HERO ТАРИФА ===== */
.th { background: var(--c-primary); color: var(--c-text-on-dark); padding: clamp(48px,8vw,88px) 0; }
.th__grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: var(--sp-7); align-items: start; }
.th__text { display: grid; gap: var(--sp-4); }
.th h1 { color: #fff; }
.th .lead { color: var(--c-on-dark-soft); max-width: 52ch; }
.th__card { background: rgba(255,255,255,.06); border: 1px solid var(--c-line-on-dark); border-radius: var(--r-lg); padding: var(--sp-6); display: grid; gap: var(--sp-4); }
.th__price { font-family: var(--font-head); font-size: clamp(2.6rem,1.8rem+3vw,3.6rem); font-weight: 700; color: var(--c-accent); line-height: 1; }
.th__price small { font-size: .45em; color: var(--c-on-dark-soft); font-weight: 500; }
.th__meta { display: grid; gap: var(--sp-2); }
.th__meta span { display: flex; align-items: center; gap: .5em; font-size: var(--fs-sm); color: var(--c-on-dark-soft); }
.th__meta svg { width: 16px; height: 16px; color: var(--c-accent); flex: none; }
.th__badge { display: inline-flex; font-size: var(--fs-xs); font-weight: 600; padding: 5px 12px; border-radius: var(--r-pill); background: var(--c-accent); color: #fff; justify-self: start; }

/* ===== COMPARE STRIP (reuses plan-compare + overrides) ===== */
.compare-strip { margin-top: calc(-1 * var(--sp-7)); position: relative; z-index: 2; }

/* ===== INCLUDED / EXCLUDED ===== */
.ie-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-6); }
.ie-col h3 { font-size: var(--fs-h4); margin-bottom: var(--sp-4); }

/* ===== WHEN TO CHOOSE ===== */
.when-list { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--sp-3); }
.when-list li { display: grid; grid-template-columns: 26px 1fr; gap: .6em; align-items: start; font-size: var(--fs-sm); }
.when-list .w-ic { width: 24px; height: 24px; border-radius: 50%; background: var(--c-accent-100); color: var(--c-accent-600); display: grid; place-items: center; flex: none; }
.when-list .w-ic svg { width: 14px; height: 14px; }

/* ===== RISK / EDIT CARDS ===== */
.risk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--gutter); }
.risk-card { background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--r-md); padding: var(--sp-5); display: grid; gap: var(--sp-2); }
.risk-card__ic { width: 36px; height: 36px; border-radius: var(--r-sm); background: rgba(178,59,59,.08); color: var(--c-danger); display: grid; place-items: center; }
.risk-card__ic svg { width: 18px; height: 18px; }
.risk-card h4 { font-size: var(--fs-sm); font-weight: 700; }
.risk-card p { font-size: var(--fs-xs); color: var(--c-text-soft); }
/* edit cards (green variant) */
.edit-card .risk-card__ic { background: rgba(46,125,91,.08); color: var(--c-success); }

/* ===== GUARANTEE DUAL ===== */
.guar-dual { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-6); }
.guar-block { padding: var(--sp-5); border-radius: var(--r-md); }
.guar-block--yes { background: rgba(46,125,91,.06); border: 1px solid rgba(46,125,91,.15); }
.guar-block--no { background: rgba(178,59,59,.04); border: 1px solid rgba(178,59,59,.12); }
.guar-block h4 { font-size: var(--fs-sm); font-weight: 700; margin-bottom: var(--sp-3); display: flex; align-items: center; gap: .5em; }
.guar-block--yes h4 { color: var(--c-success); }
.guar-block--no h4 { color: var(--c-danger); }
.guar-block ul { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--sp-2); }
.guar-block li { font-size: var(--fs-sm); color: var(--c-text-soft); }

/* ===== CASE MINI ===== */
.case-mini { background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--r-lg); padding: var(--sp-6); }
.case-mini h4 { font-size: var(--fs-h4); margin-bottom: var(--sp-4); }

/* ===== RESPONSIVE ===== */
@media (max-width: 900px) {
  .th__grid { grid-template-columns: 1fr; }
  .ie-grid, .guar-dual { grid-template-columns: 1fr; }
}