/* ТЗ-126 В8: раздел «Сертификаты» (ТЗ 2.8), блок на категории и карточке товара,
   страница одного сертификата.

   Файл один на все места намеренно: плитка .sertifikaty__item рисуется и в разделе,
   и в блоке на чужой странице, и в карусели на «О компании», а та же вёрстка,
   разложенная по двум файлам, расходится по частям (ТЗ-100). Чужих классов файл не
   переопределяет — только свои .sertifikaty*, .sertifikat*, поэтому его безопасно
   подключать на категории и карточке (RULES п. 131: чужой бандл переписал бы .help).

   Палитра и радиусы — как у плиток отгрузок и статей: фон #f5f5f6, текст #333,
   служебное #a9adb4, акцент #001960, радиус 12px.

   Главное отличие от плиток отгрузок: скан сертификата — вертикальный лист А4, а не
   фотография. Картинка вписывается ЦЕЛИКОМ (object-fit: contain) на белом поле:
   обрезка по границе плитки, как у горизонтальных фото, срезала бы документу шапку и
   печать — ровно это делала старая галерея нарезкой 350×200. */

/* ── сетка плиток ───────────────────────────────────────────────── */
.sertifikaty { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.sertifikaty--spisok { margin-top: 24px; }
@media screen and (max-width: 1200px) { .sertifikaty { grid-template-columns: repeat(3, 1fr); } }
@media screen and (max-width: 992px) { .sertifikaty { grid-template-columns: repeat(2, 1fr); gap: 12px; } }
@media screen and (max-width: 440px) { .sertifikaty { grid-template-columns: 1fr; } }

.sertifikaty__item { display: flex; flex-direction: column; background-color: #f5f5f6; border-radius: 12px; overflow: hidden; }

.sertifikaty__img { display: block; height: 300px; padding: 12px; background-color: #fff; }
.sertifikaty__img img { width: 100%; height: 100%; object-fit: contain; transition-duration: 400ms; }
.sertifikaty__img:hover img { transform: scale(1.03); }
@media screen and (max-width: 992px) { .sertifikaty__img { height: 240px; } }

.sertifikaty__card { padding: 16px 20px 20px; display: flex; flex-direction: column; flex-grow: 1; gap: 6px; }
.sertifikaty__title { color: #333; font-weight: 600; font-size: 17px; line-height: 130%; }
@media screen and (max-width: 992px) { .sertifikaty__title { font-size: 15px; } }
.sertifikaty__nomer { color: #001960; font-size: 13px; line-height: 140%; word-break: break-word; }
.sertifikaty__organ { margin-top: auto; padding-top: 6px; color: #a9adb4; font-size: 13px; line-height: 140%; }

/* ── фраза о документах на партию (решение владельца 18.09, п. 52) ── */
.sertifikaty__intro { margin: 12px 0 0; max-width: 820px; color: #5c6169; font-size: 16px; line-height: 150%; }
.sertifikaty__fraza { margin: 16px 0 0; max-width: 820px; padding: 14px 18px; background-color: #f5f5f6; border-left: 3px solid #001960; border-radius: 0 8px 8px 0; color: #5c6169; font-size: 15px; line-height: 150%; }
.sertifikaty-blok .sertifikaty__fraza { margin-top: 20px; }

/* ── блок на категории и карточке ───────────────────────────────── */
.sertifikaty-blok { display: flex; flex-direction: column; gap: 20px; }

/* ── страница одного сертификата ────────────────────────────────── */
.sertifikat { margin-top: 24px; display: grid; grid-template-columns: minmax(0, 560px) minmax(0, 1fr); gap: 32px; align-items: start; }
@media screen and (max-width: 992px) { .sertifikat { grid-template-columns: 1fr; gap: 20px; } }

.sertifikat__skan { display: block; padding: 16px; background-color: #fff; border: 1px solid #e6e7ea; border-radius: 12px; }
.sertifikat__skan img { width: 100%; height: auto; }

.sertifikat__svedeniya { display: flex; flex-direction: column; gap: 24px; }
.sertifikat__polya { display: grid; grid-template-columns: 1fr; gap: 4px; }
.sertifikat__polya dt { color: #a9adb4; font-size: 14px; line-height: 140%; }
.sertifikat__polya dd { margin: 0 0 12px; color: #333; font-size: 16px; line-height: 150%; }

.sertifikat__razdely-title { margin-bottom: 8px; color: #a9adb4; font-size: 14px; line-height: 140%; }
.sertifikat__spisok { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; }
.sertifikat__spisok a { display: inline-block; padding: 8px 14px; background-color: #f5f5f6; border-radius: 8px; color: #001960; font-size: 15px; line-height: 130%; transition-duration: 400ms; }
.sertifikat__spisok a:hover { background-color: #e6e7ea; }

.sertifikat__nazad { margin-top: 28px; font-size: 15px; line-height: 140%; }
.sertifikat__nazad a { color: #001960; text-decoration: underline; }