/* Сертификаты + общий «герой» внутренних страниц + лайтбокс. */
.page-hero { padding: clamp(40px, 6vw, 72px) 0 32px; border-bottom: 1px solid var(--hairline); margin-bottom: 40px;
  background: radial-gradient(120% 120% at 85% -20%, var(--brand-tint), transparent 55%); }
.page-hero .section-title { margin-top: 8px; }
.page-lead { color: var(--steel); max-width: 60ch; margin-top: 14px; }

.cert-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 22px; padding-bottom: 40px; }
.cert-card { cursor: pointer; border: 1px solid var(--hairline); border-radius: var(--r-lg); overflow: hidden; background: var(--paper); transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease); }
.cert-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lift); border-color: #cfd9e4; }
.cert-thumb { position: relative; aspect-ratio: 3 / 4; background: var(--bg-2); overflow: hidden; }
.cert-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s var(--ease); }
.cert-card:hover .cert-thumb img { transform: scale(1.04); }
.cert-zoom { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(14,61,107,.32); color: #fff; font-size: 1.5rem; opacity: 0; transition: opacity .3s var(--ease); }
.cert-card:hover .cert-zoom { opacity: 1; }
.cert-card figcaption { padding: 16px 18px; }
.cert-type { display: block; font-family: var(--font-display); text-transform: uppercase; letter-spacing: .1em; font-size: .66rem; color: var(--brand-glow); }
.cert-title { display: block; font-weight: 600; font-size: .96rem; margin-top: 5px; color: var(--ink); }

.lightbox { position: fixed; inset: 0; z-index: 400; background: rgba(8,11,14,.95); display: flex; flex-direction: column; align-items: center; justify-content: center; opacity: 0; visibility: hidden; transition: .3s var(--ease); }
.lightbox.open { opacity: 1; visibility: visible; }
.lb-toolbar { position: absolute; top: 0; left: 0; right: 0; display: flex; gap: 10px; justify-content: flex-end; padding: 16px 20px; z-index: 3; }
.lb-btn { display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); color: #fff; padding: 9px 15px; border-radius: var(--r); font-family: var(--font-display); text-transform: uppercase; letter-spacing: .06em; font-size: .78rem; cursor: pointer; transition: .2s var(--ease); }
.lb-btn:hover, .lb-btn.active { background: var(--accent-grad); border-color: transparent; color: #fff; }
.lb-btn.lb-x { padding: 9px 13px; font-size: 1.05rem; }
.lb-btn.lb-x span { display: none; }
.lb-stage { max-width: 92vw; max-height: 76vh; overflow: hidden; border-radius: var(--r); box-shadow: 0 20px 60px rgba(0,0,0,.55); touch-action: none; }
.lb-stage img { display: block; max-width: 92vw; max-height: 76vh; user-select: none; -webkit-user-drag: none; transition: transform .12s linear; will-change: transform; }
.lb-stage.zooming { cursor: crosshair; }
.lb-stage.zooming img { transition: none; }
.lb-cap { color: #cfd6dc; margin-top: 16px; font-family: var(--font-display); text-transform: uppercase; letter-spacing: .08em; font-size: .9rem; text-align: center; padding: 0 16px; }
.lb-hint { position: absolute; bottom: 16px; left: 0; right: 0; text-align: center; color: var(--steel-light); font-size: .74rem; pointer-events: none; }
@media (max-width: 560px) { .lb-btn span { display: none; } .lb-btn { padding: 10px 13px; font-size: 1rem; } }

/* Поиск по документам */
.doc-search { position: relative; max-width: 560px; margin: 4px auto 38px; }
.doc-search i { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); color: var(--steel-light); font-size: 1rem; pointer-events: none; }
.doc-search input {
  width: 100%; height: 56px; padding: 0 20px 0 52px; border: 1px solid var(--hairline); border-radius: 999px;
  font: inherit; font-size: 1.02rem; color: var(--ink); background: var(--paper);
  -webkit-appearance: none; appearance: none; box-shadow: var(--shadow);
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.doc-search input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.doc-search input::placeholder { color: var(--steel-light); }
.doc-search input:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 4px rgba(21,88,156,.12); }
.doc-noresult { color: var(--steel-light); padding: 32px 0; text-align: center; }
