@charset "UTF-8";
/*
  Журнал powerstop.com.ru — стили текста статьи.
  Файл на сайте: /css/magazine/style.css

  Стили статей журнала лежат только здесь. В тексте статьи стилей нет:
  ни блока <style>, ни атрибутов style в тегах — только теги и классы.

  Каждое правило начинается с .review__text .psa:
  .review__text — блок текста статьи в шаблоне, .psa — обёртка текста в статье.
  На статьи без обёртки .psa правила не действуют.

  Таблицы: если колонка статьи шире 739 px — обычная таблица, если уже —
  каждая строка показывается карточкой (@container: зависит от ширины колонки,
  а не экрана). Браузер без @container покажет таблицу с прокруткой вбок.

  Классы:
  .psa            обёртка текста статьи
  .psa-byline     строка автора
  .psa-deck       подзаголовок
  .psa-lead       вводный абзац
  .psa-sum        «Коротко»
  .psa-jump       ссылки к таблицам
  .psa-tt         заголовок таблицы (h3)
  .psa-tw, .psa-t таблица и её обёртка; .psa-t--txt — таблица с длинным текстом
  .psa-tn         сноска под таблицей
  .psa-warn       блок «Важно»
  .psa-fig        картинка с подписью; .psa-hero — главная картинка
  .psa-myth       абзац «Миф / На деле»
  .psa-author     блок автора
  .psa-src        источники
*/
.review__text .psa{--ink:#1a1a1a;--txt:#333;--mut:#5a5a5a;--line:#dadcde;--soft:#f9f9f9;--red:#ff000d;container-type:inline-size}
.review__text .psa ::selection{background:#ffd6d8;color:#1a1a1a}
.review__text .psa>p,.review__text .psa>ul>li,.review__text .psa>ol>li,.review__text .psa-sum>ul>li,.review__text .psa-sum>.psa-next,.review__text .psa-warn p{text-align:justify;hyphens:auto}
.review__text .psa>.psa-byline,.review__text .psa>.psa-deck{text-align:left;hyphens:manual}
.review__text .psa>p{margin:0 0 16px;font-size:17px;line-height:1.65;color:var(--txt);text-wrap:pretty}
.review__text .psa>ul,.review__text .psa>ol{margin:8px 0 20px}
.review__text .psa>ul>li,.review__text .psa>ol>li{margin-bottom:10px;font-size:17px;line-height:1.65;color:var(--txt)}
.review__text .psa b{font-weight:700;color:var(--ink)}
.review__text .psa>p a,.review__text .psa>ul a,.review__text .psa>ol a,.review__text .psa-warn a,.review__text .psa-author a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--red);text-decoration-thickness:2px;text-underline-offset:3px}
.review__text .psa>p a:hover,.review__text .psa>ul a:hover,.review__text .psa>ol a:hover,.review__text .psa-warn a:hover,.review__text .psa-author a:hover{color:var(--red)}
.review__text .psa a:focus-visible{outline:2px solid var(--red);outline-offset:2px;border-radius:2px}
.review__text .psa>.psa-byline{margin:0 0 14px;font-size:14px;line-height:1.5;color:var(--mut)}
.review__text .psa>.psa-byline b{font-weight:400;color:var(--mut)}
.review__text .psa>.psa-deck{margin:0 0 20px;font-size:21px;line-height:1.4;color:var(--ink)}
.review__text .psa>.psa-lead{font-size:19px;line-height:1.6;color:var(--ink)}
.review__text .psa-fig{margin:28px 0}
.review__text .psa-fig img{border-radius:12px;background:var(--soft)}
.review__text .psa-fig figcaption{margin-top:10px;font-size:14px;line-height:1.5;color:var(--mut)}
.review__text .psa-fig.psa-hero{margin:0 0 24px}
.review__text .psa-sum{margin:32px 0 20px;padding:22px 28px 6px;background:var(--soft);border:1px solid var(--line);border-radius:16px}
.review__text .psa-sum>h3{margin:0 0 16px;padding-bottom:14px;border-bottom:2px solid var(--red);font-size:32px;line-height:1;color:var(--ink)}
.review__text .psa-sum>ul{margin:0}
.review__text .psa-sum>ul>li{margin-bottom:12px;font-size:16px;line-height:1.6;color:var(--txt)}
.review__text .psa-sum>.psa-next{margin:16px 0;padding-top:14px;border-top:1px solid #e6e7e9;font-size:15px;line-height:1.55;color:var(--mut)}
.review__text .psa-jump{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 8px}
.review__text .psa-jump span{flex:0 0 100%;font-size:15px;line-height:1.5;color:var(--mut)}
.review__text .psa-jump a{display:inline-flex;align-items:center;min-height:44px;padding:4px 16px;border:1px solid var(--ink);border-radius:8px;background:#fff;color:var(--ink);font-size:15px;line-height:1.3;font-weight:500;text-decoration:none}
.review__text .psa-jump a:hover{background:var(--ink);color:#fff}
.review__text .psa>h2,.review__text .psa .faq>h2{margin:56px 0 20px;padding-bottom:14px;border-bottom:2px solid var(--red);font-size:36px;line-height:1.12;color:var(--ink);text-align:left;text-wrap:balance;scroll-margin-top:96px}
.review__text .psa>h3{margin:36px 0 12px;font-size:28px;line-height:1.15;color:var(--ink);text-wrap:balance;scroll-margin-top:96px}
.review__text .psa>h3.psa-tt{margin-top:44px;font-size:26px}
.review__text .psa-tw{margin:14px 0 12px;border:1px solid var(--line);border-radius:12px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.review__text .psa table.psa-t{display:table;width:100%;min-width:640px;border:0;border-collapse:collapse;font-size:14px;line-height:1.45;font-variant-numeric:tabular-nums;color:var(--ink)}
.review__text .psa-t th{padding:10px;background:var(--ink);color:#fff;font-size:13px;line-height:1.3;font-weight:500;text-align:left;vertical-align:bottom}
.review__text .psa-t td{padding:10px;border-top:1px solid #e6e7e9;vertical-align:top}
.review__text .psa-t tbody tr:nth-child(even) td{background:var(--soft)}
.review__text .psa-t td:first-child{min-width:150px;font-weight:500}
.review__text .psa-t .psa-s{color:var(--mut);white-space:nowrap}
.review__text .psa-t .psa-a{font-weight:500;white-space:nowrap}
.review__text .psa-t .psa-nw{white-space:nowrap}
.review__text .psa-t .psa-na{color:#8a8a8a}
.review__text .psa-t td[data-label="PowerStop"]{white-space:nowrap}
.review__text .psa-t td[data-label="HARDi Performance"]{min-width:172px}
.review__text .psa table.psa-t--wide{font-size:13px}
.review__text .psa-t--wide th{padding:9px 7px;font-size:12px}
.review__text .psa-t--wide td{padding:9px 7px}
.review__text .psa-t--wide td:first-child{min-width:112px}
.review__text .psa-t--wide .psa-nw{white-space:normal}
.review__text .psa>.psa-tn{margin:12px 0 14px;font-size:14px;line-height:1.55;color:var(--mut)}
.review__text .psa-warn{margin:16px 0 8px;padding:16px 20px;background:#fff4f4;border:1px solid #f5c2c5;border-radius:12px}
.review__text .psa-warn p{margin:0;font-size:16px;line-height:1.55;color:var(--ink)}
.review__text .psa-warn .psa-warn__t{margin-bottom:6px;font-weight:700;color:#b0000a}
.review__text .psa-warn.psa-warn--n{background:var(--soft);border-color:var(--line)}
.review__text .psa-warn--n .psa-warn__t{color:var(--ink)}
.review__text .psa>.psa-myth{padding:16px 20px;background:var(--soft);border-radius:12px}
.review__text .psa-cta{display:grid;grid-template-columns:1fr auto;gap:16px 28px;align-items:center;margin:32px 0;padding:22px 28px;background:var(--soft);border:1px solid var(--line);border-radius:16px}
.review__text .psa-cta p{margin:0;font-size:16px;line-height:1.55;color:var(--txt);text-align:left}
.review__text .psa-cta .psa-cta__t{margin-bottom:4px;font-size:20px;line-height:1.3;font-weight:700;color:var(--ink)}
.review__text .psa-cta p a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--red);text-decoration-thickness:2px;text-underline-offset:3px}
.review__text .psa-cta p a:hover{color:var(--red)}
.review__text .psa-cta__b{display:flex;flex-wrap:wrap;gap:10px}
.review__text .psa-cta .btn{min-height:50px;padding:14px 28px;font-family:inherit;font-size:16px;line-height:1.2;text-decoration:none;white-space:nowrap}
.review__text .psa-cta .btn-primary,.review__text .psa-cta .btn-primary:hover{color:#fff}
.review__text .psa-cta .psa-btn-o{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.review__text .psa-cta .psa-btn-o:hover{background:var(--ink);color:#fff}
.review__text .psa-cta .btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.review__text .psa-cta.psa-cta--s{margin:16px 0 8px;padding:16px 20px;background:#fff4f4;border-color:#f5c2c5;border-radius:12px}
.review__text .psa-cta--s .psa-cta__t{margin-bottom:6px;font-size:16px;color:#b0000a}
.review__text .psa-author{display:grid;grid-template-columns:88px 1fr;gap:20px;align-items:center;margin:40px 0 0;padding:20px 24px;border:1px solid var(--line);border-radius:16px}
.review__text .psa-author img{width:88px;height:88px;border-radius:12px;object-fit:cover}
.review__text .psa-author p{margin:0;font-size:15px;line-height:1.55;color:var(--txt)}
.review__text .psa-author .psa-author__n{margin-bottom:4px;font-size:18px;font-weight:700;color:var(--ink)}
.review__text .psa-src{margin-top:40px}
.review__text .psa-src>h3{margin:0 0 12px;font-size:24px;line-height:1.15;color:var(--ink)}
.review__text .psa-src>ul{margin:0}
.review__text .psa-src>ul>li{margin-bottom:8px;font-size:14px;line-height:1.5;color:var(--mut);overflow-wrap:anywhere}
.review__text .psa-src a{color:inherit;text-decoration:underline}
@media (max-width:768px){
.review__text .psa>p,.review__text .psa>ul>li,.review__text .psa>ol>li{font-size:16px;line-height:1.6}
.review__text .psa>.psa-deck{font-size:18px}
.review__text .psa>.psa-lead{font-size:17px}
.review__text .psa>h2,.review__text .psa .faq>h2{margin-top:44px;font-size:30px}
.review__text .psa>h3{font-size:24px}
.review__text .psa>h3.psa-tt{font-size:22px}
.review__text .psa-sum{padding:18px 16px 4px}
.review__text .psa-sum>h3{font-size:26px}
}
@media (max-width:640px){
.review__text .psa-author{grid-template-columns:64px 1fr;gap:14px;align-items:start;padding:16px}
.review__text .psa-author img{width:64px;height:64px}
.review__text .psa-jump a{flex:1 1 100%}
}
@container (max-width:739px){
.review__text .psa-tw{border:0;border-radius:0;overflow:visible}
.review__text .psa table.psa-t{display:block;min-width:0}
.review__text .psa-t tbody,.review__text .psa-t tr,.review__text .psa-t td{display:block}
.review__text .psa-t thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.review__text .psa-t tr{margin:0 0 12px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.review__text .psa-t tbody tr:nth-child(even) td{background:transparent}
.review__text .psa-t td{display:grid;grid-template-columns:minmax(92px,34%) 1fr;gap:12px;padding:9px 14px;border-top:1px solid #eef0f1;font-size:15px}
.review__text .psa-t td[data-label]{min-width:0;white-space:normal}
.review__text .psa-t td::before{content:attr(data-label);font-size:13px;line-height:1.6;font-weight:400;color:var(--mut)}
.review__text .psa-t td:first-child,.review__text .psa-t tbody tr:nth-child(even) td:first-child{display:block;min-width:0;padding:11px 14px;border-top:0;background:var(--soft);font-size:16px;line-height:1.35;font-weight:700}
.review__text .psa-t td:first-child::before{content:none}
.review__text .psa-t--txt td{display:block}
.review__text .psa-t--txt td::before{display:block;margin-bottom:2px}
.review__text .psa-t .psa-nw{white-space:normal}
.review__text .psa-t td.psa-e{display:none}
.review__text .psa-cta{grid-template-columns:1fr}
.review__text .psa-cta__b .btn{flex:1 1 100%}
}
@container (min-width:560px) and (max-width:739px){
.review__text .psa-t:not(.psa-t--txt) tbody{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.review__text .psa-t:not(.psa-t--txt) tr{margin:0}
.review__text .psa-tw{margin-bottom:16px}
}