/* === AUDIT FIXES 2026-08-10 v2 === */

/* Fix 2: FAB button — move above bottom-nav, don't overlap */
.chat-fab, .chatbot-fab, .fab-button {
    bottom: 72px !important;
    z-index: 999 !important;
}
.bottom-nav {
    z-index: 1000 !important;
    position: relative !important;
}

/* Fix 3: Breadcrumbs — contain overflow on mobile */
.page-head {
    max-width: 100% !important;
    overflow: hidden !important;
}
.crumbs {
    max-width: 100% !important;
    overflow: hidden !important;
}
.crumb-list {
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    display: flex !important;
    flex-wrap: nowrap !important;
}
.crumb-list::-webkit-scrollbar { display: none; }
.crumb-list li {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    display: flex !important;
    align-items: center !important;
}
.crumb-active {
    flex-shrink: 1 !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

/* Fix 7: Award slider — contain cards on mobile */
.awards-slider, .award-slider {
    overflow: hidden !important;
}
.awards-slider__track, .awards-slider__container {
    overflow-x: auto !important;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}
.awards-slider__track::-webkit-scrollbar { display: none; }
.award-card {
    flex-shrink: 0 !important;
}

/* Prevent horizontal scroll on body */
body {
    overflow-x: hidden !important;
}

/* FIX: horizontal scroll on mobile — use overflow-x clip instead of hidden to avoid breaking vertical scroll */
html { overflow-x: clip; max-width: 100%; }
body { overflow-x: clip; max-width: 100%; position: relative; }
.awards-slider, .awards-slider__track { overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
.awards-slider__slide { flex-shrink: 0; }
.awards-slider { width: 100%; }

/* FIX: duplicate H1 in content-section */
.content-section h2:first-child { margin-top: 0; }

/* === FIGMA COMPARISON FIXES 2026-08-10 v3 === */

/* Fix A: /services page — карточки услуг по Figma (figma_services_block.png).
   service-card--full не имел стилей → ссылки выглядели plain text. */
.services-grid--full {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 24px !important;
}
@media (max-width: 1100px) {
    .services-grid--full { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 640px) {
    .services-grid--full { grid-template-columns: 1fr !important; }
}
.service-card--full {
    min-height: 180px !important;
    border-radius: 24px !important;
    background: #F3F7FA !important; /* Grey Extra Light — дизайн-система */
    padding: 24px 20px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    text-decoration: none !important;
    transition: transform .2s, box-shadow .2s, background .2s !important;
    overflow: hidden !important;
}
.service-card--full:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(0,0,0,.08);
    background: #fff !important;
}
.service-card--full .service-card__title {
    color: #009294 !important; /* Primary teal — по Figma */
    font-weight: 600 !important;
    font-size: 18px !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    text-decoration: none !important;
}
.service-card--full .service-card__chips:empty { display: none !important; }
.service-card--full .service-card__chips { margin-bottom: 12px; }

/* Перебиваем legacy nth-child override из figma-final.css (строки 641-645):
   часть заголовков карточек принудительно красилась в тёмный */
.services-grid .service-card:nth-child(n) .service-card__title {
    color: #009294 !important; /* Primary teal — по Figma */
}

/* Fix B: футер — цвет текста по Figma (Grey Light #A8B4BD, белый фон) */
.footer-bottom,
.footer-bottom span,
.footer-bottom a,
.footer-legal a,
.footer-bottom__contacts a {
    color: #A8B4BD !important;
}
.footer-bottom a:hover,
.footer-legal a:hover {
    color: #009294 !important;
}
.footer-bottom {
    background: #FFFFFF !important;
}

/* Fix C: hero — видео-фон не должен обрезать контент на узких экранах */
.hero__media video {
    object-fit: cover;
    object-position: center center;
}

/* Photo cards for services (Figma: 2 cards with lab photos) */
.service-card--image {
  position: relative;
  background-size: cover !important;
  background-position: center !important;
  min-height: 240px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.service-card--image .service-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,10,58,0.85) 0%, rgba(0,10,58,0.3) 60%, transparent 100%);
  border-radius: 24px;
  z-index: 0;
}
.service-card--image .service-card__chips,
.service-card--image .service-card__divider,
.service-card--image .service-card__title,
.service-card--image .service-card__desc {
  position: relative;
  z-index: 1;
}
.service-card--image .service-card__title {
  color: #fff !important;
}
.service-card--image .service-card__desc {
  color: rgba(255,255,255,0.85) !important;
}
.service-card--image .chip--bright {
  background: rgba(0,146,148,0.9) !important;
}

/* Divider line between chips and title (Figma) */
.service-card__divider {
  height: 1px;
  background: var(--c-accent, #009294);
  opacity: 0.3;
  margin: 12px 0;
  width: 40px;
}
.service-card--image .service-card__divider {
  background: rgba(255,255,255,0.3);
  opacity: 1;
}

/* Button "All services" (Figma: outline pill) */
.services-all-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 32px;
  border: 2px solid var(--c-accent, #009294);
  border-radius: 100px;
  color: var(--c-accent, #009294);
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  transition: all 200ms;
  margin: 32px auto 0;
}
.services-all-btn:hover {
  background: var(--c-accent, #009294);
  color: #fff;
}

/* Marketing badges (Figma: TOP, OT 3 DNEY) */
.chip--top {
  background: #009294 !important;
  color: #fff !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  letter-spacing: 0.04em !important;
}
.chip--days {
  background: transparent !important;
  color: #009294 !important;
  border: 1px solid #85BAAF !important;
  font-weight: 500 !important;
  font-size: 11px !important;
  padding: 3px 9px !important;
  border-radius: 6px !important;
  text-transform: lowercase !important;
}

/* === FIGMA INNER PAGES + VIDEO BLOCKS 2026-08-11 (v9) === */

/* Hero-card: заголовок + подзаголовок внутри карточки #F3F7FA (Figma inner template G-04) */
.hero-card {
  background: #F3F7FA;
  border-radius: 24px;
  padding: 40px;
  min-height: 200px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-sizing: border-box;
}
.hero-card h1 { margin: 0 0 12px !important; }
.hero-card .page-intro { margin: 0; color: #5A6E7C; font-size: 18px; line-height: 1.5; }
@media (max-width: 640px) {
  .hero-card { padding: 24px 20px; min-height: 0; }
  .hero-card .page-intro { font-size: 16px; }
}

/* Content-cards: radius 24px, фон #F3F7FA (Figma) */
.content-section .card,
.content-section .panel,
.content-section .panel--soft {
  background: #F3F7FA !important;
  border: none !important;
  border-radius: 24px !important;
  box-shadow: none !important;
}
.content-section .card { padding: 24px; }
.content-section .panel,
.content-section .panel--soft { padding: 32px; }
@media (max-width: 640px) {
  .content-section .panel,
  .content-section .panel--soft { padding: 20px; }
}

/* Карточка раздела с фото лаборатории (О центре) */
.card--photo { padding: 0 !important; overflow: hidden; display: flex; flex-direction: column; }
.card--photo .card__photo { width: 100%; height: 180px; object-fit: cover; display: block; }
.card--photo .card__body { padding: 24px; }

/* Фильтры карьеры вне тёмного hero (светлый вариант pills) */
.career-filters { margin: 0 0 32px; }
.career-filters .career-hero__pills { margin-top: 0; }
.career-filters .career-pill {
  background: #F3F7FA;
  border: 1px solid #85BAAF;
  color: #5A6E7C;
}
.career-filters .career-pill.is-active,
.career-filters .career-pill:hover {
  background: #009294;
  border-color: #009294;
  color: #fff;
}

/* CTA-баннер (главная): видео-фон вместо статичного изображения */
.cta-banner__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.cta-banner .cta-banner__overlay {
  display: block !important;
  position: absolute;
  inset: 0;
  background: rgba(61, 78, 93, 0.55);
  z-index: 1;
}
.cta-banner__content { z-index: 2 !important; }

/* Карьера (главная): видео вместо фото команды */
.career-banner__media { overflow: hidden; }
.career-banner__media video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.career-banner__media .career-banner__overlay { z-index: 1; }

/* Fix: all badges in one row at top, aligned */
.service-card__chips {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  align-items: center !important;
  margin-bottom: 8px !important;
}
.service-card__chips .chip {
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1.4 !important;
}

/* ===== Services page v2 (id=3): hero slider, filter catalog, cart ===== */
.services-hero{position:relative;max-width:1201px;margin:16px auto 0;height:400px;border-radius:24px;overflow:hidden;background:#0E2A2C}
.services-hero__slides,.services-hero__slide{position:absolute;inset:0}
.services-hero__slide{background-size:cover;background-position:center;opacity:0;transition:opacity .8s ease}
.services-hero__slide.is-active{opacity:1}
.services-hero__overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,60,62,.75) 0%,rgba(0,60,62,.4) 55%,rgba(0,60,62,.18) 100%)}
.services-hero__content{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center;padding:0 56px;max-width:660px;color:#fff}
.services-hero__title{margin:0 0 12px;font-size:40px;font-weight:700;line-height:1.15;color:#fff}
.services-hero__subtitle{margin:0 0 24px;font-size:16px;line-height:1.55;color:rgba(255,255,255,.92)}
.services-hero__actions{display:flex;gap:12px;flex-wrap:wrap}
.services-hero__btn-solid{display:inline-flex;align-items:center;padding:13px 26px;border-radius:100px;background:#009294;color:#fff;text-decoration:none;font-size:14px;font-weight:600;transition:background .2s}
.services-hero__btn-solid:hover{background:#007B7D}
.services-hero__btn-outline{display:inline-flex;align-items:center;padding:13px 26px;border-radius:100px;border:1px solid rgba(255,255,255,.75);background:transparent;color:#fff;text-decoration:none;font-size:14px;font-weight:600;transition:all .2s}
.services-hero__btn-outline:hover{background:rgba(255,255,255,.15)}
.services-hero__dots{position:absolute;z-index:3;left:56px;bottom:20px;display:flex;gap:8px}
.services-hero__dot{width:10px;height:10px;border-radius:100px;border:none;background:rgba(255,255,255,.45);cursor:pointer;padding:0;transition:background .3s,width .3s}
.services-hero__dot.is-active{background:#fff;width:26px}

.services-filter-bar{position:sticky;top:76px;z-index:90;max-width:1201px;margin:16px auto 0;background:#fff;border:1px solid #E8EDF4;border-radius:16px;box-shadow:0 8px 24px rgba(15,40,60,.07)}
.services-filter-bar__inner{display:flex;gap:12px;align-items:center;padding:14px 20px;flex-wrap:wrap}
.services-search{flex:1 1 220px;position:relative}
.services-search input{width:100%;box-sizing:border-box;padding:12px 16px 12px 42px;border:1px solid #85BAAF;border-radius:12px;font:inherit;font-size:14px;background:#F3F7FA;color:#2A3548}
.services-search input:focus{outline:none;border-color:#009294;background:#fff}
.services-search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;stroke:#85BAAF;fill:none;stroke-width:2}
.services-filter{padding:12px 14px;border:1px solid #85BAAF;border-radius:12px;background:#fff;font:inherit;font-size:14px;color:#2A3548;cursor:pointer;max-width:220px}
.services-filter:focus{outline:none;border-color:#009294}
.services-equip-btn{padding:12px 22px;border-radius:100px;border:1px solid #009294;color:#009294;text-decoration:none;font-size:14px;font-weight:600;white-space:nowrap;transition:all .2s}
.services-equip-btn:hover{background:#009294;color:#fff}
.cart-status{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:100px;border:none;background:#009294;color:#fff;font:inherit;font-size:14px;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .2s}
.cart-status:hover{background:#007B7D}
.cart-counter{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;border-radius:100px;background:#fff;color:#009294;font-size:12px;font-weight:700}

.services-catalog{max-width:1201px;margin:0 auto;padding:24px 0 8px}
.services-catalog__list{display:flex;flex-direction:column;gap:12px}
.service-row{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;padding:20px 24px;background:#F3F7FA;border-radius:24px;transition:box-shadow .2s}
.service-row:hover{box-shadow:0 10px 30px rgba(0,146,148,.13)}
.service-row__badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.service-row__badges:empty{margin-bottom:0}
.service-row__title{margin:0 0 6px;font-size:18px;font-weight:600;line-height:1.35}
.service-row__title a{color:#2A3548;text-decoration:none}
.service-row__title a:hover{color:#009294}
.service-row__desc{margin:0;font-size:14px;line-height:1.5;color:#5A6B7B}
.service-row__actions{display:flex;flex-direction:column;gap:8px;align-items:stretch;min-width:170px}
.service-row__more{text-align:center;font-size:13px;color:#009294;text-decoration:none}
.service-row__more:hover{text-decoration:underline}
.cart-btn{padding:11px 18px;border-radius:100px;border:none;background:#009294;color:#fff;font:inherit;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s}
.cart-btn:hover{background:#007B7D}
.cart-btn.is-in-cart{background:#85BAAF}
.services-catalog__empty{padding:40px 24px;text-align:center;background:#F3F7FA;border-radius:24px;color:#5A6B7B;font-size:15px}
.services-catalog__empty button{margin-left:8px;padding:8px 18px;border-radius:100px;border:1px solid #009294;background:#fff;color:#009294;cursor:pointer;font:inherit;font-size:14px}

.services-seo{max-width:1201px;margin:0 auto;padding:24px 0 8px;font-size:15px;line-height:1.6;color:#5A6B7B}

.services-cta{position:relative;max-width:1201px;margin:32px auto 48px;border-radius:24px;overflow:hidden;min-height:280px;display:flex;align-items:center;background:#0E2A2C}
.services-cta__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.services-cta__overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,60,62,.8),rgba(0,146,148,.45))}
.services-cta__content{position:relative;z-index:2;padding:48px 56px;color:#fff;max-width:640px}
.services-cta__content h2{margin:0 0 12px;font-size:30px;line-height:1.2;color:#fff}
.services-cta__content p{margin:0 0 24px;font-size:15px;line-height:1.55;color:rgba(255,255,255,.92)}
.services-cta__actions{display:flex;gap:12px;flex-wrap:wrap}

.cart-drawer{position:fixed;inset:0;z-index:1200;background:rgba(15,40,60,.45);opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}
.cart-drawer.is-open{opacity:1;visibility:visible}
.cart-drawer__panel{position:absolute;top:0;right:0;height:100%;width:min(420px,92vw);background:#fff;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .3s ease;box-shadow:-12px 0 40px rgba(15,40,60,.18)}
.cart-drawer.is-open .cart-drawer__panel{transform:none}
.cart-drawer__head{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid #E8EDF4}
.cart-drawer__head h2{margin:0;font-size:20px}
.cart-drawer__close{border:none;background:none;font-size:28px;line-height:1;cursor:pointer;color:#5A6B7B;padding:0 4px}
.cart-drawer__close:hover{color:#2A3548}
.cart-drawer__body{flex:1;overflow:auto;padding:16px 24px}
.cart-drawer__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.cart-drawer__list li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;background:#F3F7FA;border-radius:16px;font-size:14px;color:#2A3548}
.cart-drawer__remove{border:none;background:none;font-size:20px;line-height:1;cursor:pointer;color:#A8B4BD;padding:0 4px}
.cart-drawer__remove:hover{color:#C0392B}
.cart-drawer__empty{color:#5A6B7B;font-size:14px;margin:8px 0}
.cart-drawer__foot{display:flex;gap:10px;padding:16px 24px;border-top:1px solid #E8EDF4}
.cart-drawer__clear{padding:12px 18px;border-radius:100px;border:1px solid #A8B4BD;background:#fff;color:#5A6B7B;font:inherit;font-size:14px;cursor:pointer}
.cart-drawer__foot .services-hero__btn-solid{flex:1;justify-content:center;text-align:center}

@media (max-width:900px){
  .services-hero{height:300px;margin:8px 12px 0}
  .services-hero__content{padding:0 24px}
  .services-hero__title{font-size:28px}
  .services-hero__subtitle{font-size:14px}
  .services-hero__dots{left:24px;bottom:14px}
  .services-filter-bar{top:64px;margin:12px 12px 0}
  .services-filter-bar__inner{padding:10px 12px;gap:8px}
  .services-filter{max-width:none;flex:1 1 46%}
  .services-search{flex:1 1 100%}
  .services-catalog{padding:16px 12px 8px}
  .service-row{grid-template-columns:1fr;padding:16px 18px;gap:12px}
  .service-row__actions{flex-direction:row;align-items:center;justify-content:space-between;min-width:0}
  .services-seo{padding:16px 12px 8px}
  .services-cta{margin:28px 12px 40px}
  .services-cta__content{padding:32px 24px}
  .services-cta__content h2{font-size:24px}
}

/* Services rows: badge contrast + dedupe polish */
.service-row .chip--top{background:#009294;color:#fff}
.service-row .chip--days{background:#fff;color:#007B7D;border:1px solid #85BAAF}
.service-row .chip--bright{background:#DDEEEC;color:#0B5E60;font-weight:600}

/* Fix: nav dropdown items in column, not row */
.nav__group.is-open .nav__dropdown {
  display: flex !important;
  flex-direction: column !important;
}
.nav__dropdown .nav__item {
  display: block !important;
  width: 100% !important;
}

/* Fix: nav centered, not shifted left */
.site-header__inner {
  justify-content: space-between !important;
}
.nav {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* === Bootstrap grid compatibility for old pages === */
.content-section .container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.content-section .row,
.content-section .row-fluid {
  display: flex;
  flex-wrap: wrap;
  margin-left: -15px;
  margin-right: -15px;
}
.content-section .row.centerAb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin: 24px 0;
}
.content-section [class*=col-] {
  flex: 0 0 auto;
  padding-left: 15px;
  padding-right: 15px;
  box-sizing: border-box;
}
.content-section .col-xs-6 { flex: 0 0 50%; max-width: 50%; }
.content-section .col-sm-2 { flex: 0 0 16.66%; max-width: 16.66%; }
.content-section .col-sm-3 { flex: 0 0 25%; max-width: 25%; }
.content-section .col-sm-4 { flex: 0 0 33.33%; max-width: 33.33%; }
.content-section .col-sm-6 { flex: 0 0 50%; max-width: 50%; }
.content-section .col-sm-8 { flex: 0 0 66.66%; max-width: 66.66%; }
.content-section .col-sm-9 { flex: 0 0 75%; max-width: 75%; }
.content-section .col-sm-12 { flex: 0 0 100%; max-width: 100%; }
.content-section .col-md-3 { flex: 0 0 25%; max-width: 25%; }
.content-section .col-md-4 { flex: 0 0 33.33%; max-width: 33.33%; }
.content-section .col-md-6 { flex: 0 0 50%; max-width: 50%; }
.content-section .col-md-8 { flex: 0 0 66.66%; max-width: 66.66%; }
.content-section .col-md-9 { flex: 0 0 75%; max-width: 75%; }

/* Style the advantage cards */
.content-section .centerAb > [class*=col-] {
  text-align: center;
  margin-bottom: 24px;
}
.content-section .centerAb img.img-responsive {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto 12px;
  border-radius: 12px;
}
.content-section .centerAb span {
  display: block;
  font-size: 13px;
  color: var(--c-ink-700, #5A6E7C);
  line-height: 1.4;
}

/* Responsive: 2 columns on tablet, 1 on mobile */
@media (max-width: 991px) {
  .content-section .col-sm-2,
  .content-section .col-sm-3,
  .content-section .col-sm-4,
  .content-section .col-md-3,
  .content-section .col-md-4 { flex: 0 0 50%; max-width: 50%; }
}
@media (max-width: 575px) {
  .content-section [class*=col-] { flex: 0 0 100%; max-width: 100%; }
  .content-section .row { margin-left: 0; margin-right: 0; }
}

/* Equipment page: sidebar filters */
.equipment-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 32px;
  align-items: start;
}
.equipment-sidebar {
  position: sticky;
  top: 90px;
}
.equipment-sidebar .filter-group {
  background: #F3F7FA;
  border-radius: 16px;
  padding: 20px;
  margin-bottom: 16px;
}
.equipment-sidebar .filter-group h4 {
  font-size: 14px;
  font-weight: 600;
  color: #009294;
  margin-bottom: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.equipment-sidebar label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  font-size: 14px;
  color: #5A6E7C;
  cursor: pointer;
}
.equipment-sidebar input[type=checkbox] {
  accent-color: #009294;
}
.equipment-content { min-width: 0; }

@media (max-width: 900px) {
  .equipment-layout { grid-template-columns: 1fr; }
  .equipment-sidebar { position: static; }
}

/* === Info materials page === */
.content-section .item-wrap {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  padding: 20px 0;
}
.content-section .item-img {
  flex: 0 0 200px;
}
.content-section .item-img img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
}
.content-section .item-content {
  flex: 1;
}
.content-section .item-content .h3 {
  font-size: 18px;
  font-weight: 600;
  color: #009294;
  margin-bottom: 8px;
}
.content-section .item-content .h3 a {
  color: inherit;
  text-decoration: none;
}
.content-section .item-content .h3 a:hover { text-decoration: underline; }
.content-section .item-more a {
  color: #009294;
  font-size: 14px;
  text-decoration: none;
  font-weight: 500;
}
.content-section .item-more a:hover { text-decoration: underline; }
.content-section .item-divider {
  border-bottom: 1px solid #E8EDF4;
  margin: 0;
}
.content-section .d-flex { display: flex; }
.content-section .mb20px { margin-bottom: 20px; }
.content-section .mt20px { margin-top: 20px; }
.content-section .img-responsive {
  max-width: 100%;
  height: auto;
  display: block;
}

/* === Проверить статус заявки page === */
.content-section .elemnts_pagination .pagination {
  display: flex;
  gap: 8px;
  padding: 16px 0;
}

/* === Equipment page sidebar layout === */
.content-section .equipment-page > .container > .row {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 32px;
  align-items: start;
}
@media (max-width: 900px) {
  .content-section .equipment-page > .container > .row {
    grid-template-columns: 1fr;
  }
}

/* Fix: constrain container width in content-section */
.content-section .container {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 20px !important;
  width: 100% !important;
}
.content-section {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

/* === Page hero (inner pages) — 2026-08-11 === */
 .page-hero-old {
  position: relative;
  width: 100%;
  height: 320px;
  border-radius: 24px;
  overflow: hidden;
  margin-bottom: 32px;
  background-size: cover;
  background-position: center;
}
.page-hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0,10,58,0.7) 0%, rgba(0,146,148,0.3) 100%);
}
.page-hero__content {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 48px;
  max-width: 700px;
  color: #fff;
}
.page-hero__content h1 {
  color: #fff !important;
  font-size: 36px;
  margin: 0 0 12px;
}
.page-hero__content p {
  color: rgba(255,255,255,0.85);
  font-size: 18px;
  margin: 0;
  line-height: 1.5;
}
@media (max-width: 768px) {
   .page-hero-old { height: 240px; border-radius: 16px; }
  .page-hero__content { padding: 0 24px; }
  .page-hero__content h1 { font-size: 26px; }
  .page-hero__content p { font-size: 15px; }
}

/* === Page Hero Slider === */
 .page-hero-old {
  position: relative;
  width: 100%;
  height: 360px;
  border-radius: 24px;
  overflow: hidden;
  margin-bottom: 32px;
  background: #0E2A2C;
}
.page-hero__slides {
  position: absolute;
  inset: 0;
}
.page-hero__slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 0.8s ease;
}
.page-hero__slide.is-active {
  opacity: 1;
}
.page-hero__slide .page-hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0,10,58,0.65) 0%, rgba(0,146,148,0.25) 100%);
  z-index: 1;
}
.page-hero__content {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 48px;
  max-width: 700px;
  color: #fff;
}
.page-hero__content h1 {
  color: #fff !important;
  font-size: 36px;
  margin: 0 0 12px;
  text-shadow: 0 2px 8px rgba(0,0,0,0.3);
}
.page-hero__content p {
  color: rgba(255,255,255,0.9);
  font-size: 18px;
  margin: 0;
  line-height: 1.5;
  text-shadow: 0 1px 4px rgba(0,0,0,0.3);
}
.page-hero__dots {
  position: absolute;
  z-index: 3;
  bottom: 20px;
  left: 48px;
  display: flex;
  gap: 8px;
}
.page-hero__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 2px solid rgba(255,255,255,0.6);
  background: transparent;
  cursor: pointer;
  padding: 0;
  transition: all 0.2s;
}
.page-hero__dot.is-active {
  background: #fff;
  border-color: #fff;
  transform: scale(1.2);
}
@media (max-width: 768px) {
   .page-hero-old { height: 260px; border-radius: 16px; }
  .page-hero__content { padding: 0 24px; }
  .page-hero__content h1 { font-size: 26px; }
  .page-hero__content p { font-size: 15px; }
  .page-hero__dots { left: 24px; bottom: 16px; }
}

/* Fix: remove border between header and hero */
.site-header {
  border-bottom: none !important;
  box-shadow: none !important;
}

/* === Page Hero Slider — taller === */
.page-hero {
  position: relative;
  width: 100%;
  height: 520px !important;
  border-radius: 24px;
  overflow: hidden;
  margin-bottom: 40px;
  background: #0E2A2C;
}
.page-hero__slides {
  position: absolute;
  inset: 0;
}
.page-hero__slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 0.8s ease;
}
.page-hero__slide.is-active {
  opacity: 1;
}
.page-hero__slide .page-hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0,10,58,0.6) 0%, rgba(0,146,148,0.2) 100%);
  z-index: 1;
}
.page-hero__content {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 64px;
  max-width: 800px;
  color: #fff;
}
.page-hero__content h1 {
  color: #fff !important;
  font-size: 44px !important;
  margin: 0 0 16px;
  text-shadow: 0 2px 12px rgba(0,0,0,0.4);
}
.page-hero__content p {
  color: rgba(255,255,255,0.9);
  font-size: 20px;
  margin: 0;
  line-height: 1.5;
  text-shadow: 0 1px 6px rgba(0,0,0,0.3);
}
.page-hero__dots {
  position: absolute;
  z-index: 3;
  bottom: 24px;
  left: 64px;
  display: flex;
  gap: 10px;
}
.page-hero__dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 2px solid rgba(255,255,255,0.6);
  background: transparent;
  cursor: pointer;
  padding: 0;
  transition: all 0.2s;
}
.page-hero__dot.is-active {
  background: #fff;
  border-color: #fff;
  transform: scale(1.3);
}
@media (max-width: 768px) {
  .page-hero { height: 340px !important; border-radius: 16px; }
  .page-hero__content { padding: 0 24px; }
  .page-hero__content h1 { font-size: 28px !important; }
  .page-hero__content p { font-size: 15px; }
  .page-hero__dots { left: 24px; bottom: 16px; }
}

/* === Full-bleed hero === */
.page-hero {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(-50vw + 50%) !important;
  margin-right: calc(-50vw + 50%) !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  border-radius: 0 !important;
  height: 560px !important;
}
.page-head {
  padding: 0 !important;
  max-width: 100% !important;
}
.page-head .crumbs {
  position: absolute;
  top: 24px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  width: min(1201px, calc(100% - 40px));
}
.page-hero__content {
  max-width: 1201px !important;
  margin: 0 auto !important;
  padding: 0 40px !important;
  width: 100%;
}
.page-hero__dots {
  left: 50% !important;
  transform: translateX(-50%) !important;
  max-width: 1201px;
  width: 100%;
  padding-left: 40px;
}
/* Content section below hero */
.content-section {
  max-width: 1201px !important;
  margin: 0 auto !important;
  padding: 40px 20px !important;
  width: 100% !important;
}
@media (max-width: 768px) {
  .page-hero { height: 380px !important; }
  .page-hero__content { padding: 0 24px !important; }
  .page-hero__dots { padding-left: 24px; }
  .page-head .crumbs { width: calc(100% - 32px); }
}

/* Fix: slides behind overlay, z-index order */
.page-hero__slides { z-index: 0; }
.page-hero__slide { z-index: 0; }
.page-hero__slide.is-active { z-index: 1; }
.page-hero__overlay { z-index: 2; }
.page-hero__content { z-index: 3; }
.page-hero__dots { z-index: 4; }

/* Fix: ensure background images render */
.page-hero__slide {
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

/* === Fix full-bleed hero — proper approach === */
.page-head {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}
.page-hero {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  border-radius: 0 !important;
  height: 560px !important;
  position: relative !important;
}
.page-hero__content {
  max-width: 1201px !important;
  margin: 0 auto !important;
  padding: 0 40px !important;
  width: 100% !important;
}
.page-hero__dots {
  left: 0 !important;
  transform: none !important;
  max-width: 1201px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding-left: 40px !important;
}
.page-head .crumbs {
  position: absolute !important;
  top: 20px !important;
  left: 0 !important;
  width: 100% !important;
  max-width: 1201px !important;
  margin: 0 auto !important;
  padding-left: 40px !important;
  padding-right: 40px !important;
  box-sizing: border-box !important;
  z-index: 10 !important;
}

/* Fix: break hero out of .page padding */
.page-hero {
  margin-left: -20px !important;
  margin-right: -20px !important;
  width: calc(100% + 40px) !important;
}

/* === Hero slide <img> rendering === */
.page-hero__slide img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.page-hero__slide.is-active img {
  z-index: 1;
}

/* === Make hero truly full-width === */
main.page {
  padding: 0 !important;
  overflow-x: hidden !important;
}
.page-head {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}
.page-hero {
  width: 100vw !important;
  max-width: 100vw !important;
  margin: 0 !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  border-radius: 0 !important;
}
.page-hero__content {
  max-width: 1201px !important;
  margin: 0 auto !important;
  padding: 0 40px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
.page-hero__dots {
  left: 50% !important;
  transform: translateX(-50%) !important;
  max-width: 1201px !important;
  width: 100% !important;
  padding-left: 40px !important;
  box-sizing: border-box !important;
}
.page-head .crumbs {
  position: absolute !important;
  top: 20px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 100% !important;
  max-width: 1201px !important;
  padding-left: 40px !important;
  padding-right: 40px !important;
  box-sizing: border-box !important;
  z-index: 10 !important;
}
.content-section {
  max-width: 1201px !important;
  margin: 0 auto !important;
  padding: 40px 20px !important;
  width: 100% !important;
}

/* Fix: hero rounded corners */
.page-hero {
  border-radius: 24px !important;
  margin-top: 16px !important;
  margin-bottom: 32px !important;
}
@media (max-width: 768px) {
  .page-hero { border-radius: 16px !important; }
}

/* === Equipment page (Figma-эталон) === */
.equip-page { max-width: 1201px; margin: 0 auto; padding: 0 20px; }

/* Controls bar */
.equip-controls {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.equip-tabs {
  display: flex;
  align-items: center;
  gap: 0;
  border: 1px solid #B3DFDF;
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  height: 56px;
}
.equip-tab {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 10px;
  border: none;
  background: transparent;
  font: inherit;
  font-size: 16px;
  font-weight: 500;
  color: #809CAF;
  cursor: pointer;
  height: 100%;
  transition: all 0.2s;
}
.equip-tab.is-active {
  background: #009294;
  color: #fff;
  border-radius: 8px;
}
.equip-tab.is-active::before {
  content: ;
  width: 8px;
  height: 8px;
  background: #fff;
  border-radius: 100px;
}
.equip-search {
  flex: 1 1 300px;
  display: flex;
  align-items: center;
  gap: 8px;
  height: 56px;
  border: 1px solid #B3DFDF;
  background: #F3F7FA;
  border-radius: 16px;
  padding: 12px 16px;
}
.equip-search input {
  flex: 1;
  border: none;
  background: transparent;
  font: inherit;
  font-size: 18px;
  color: #272D31;
  outline: none;
}
.equip-search input::placeholder { color: #A8B4BD; }
.equip-search__btn {
  width: 40px;
  height: 40px;
  border: none;
  background: #009294;
  border-radius: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
}
.equip-search__btn svg { width: 20px; height: 20px; stroke: #fff; }
.equip-btn-equip {
  display: inline-flex;
  align-items: center;
  height: 56px;
  padding: 0 24px;
  background: #009294;
  color: #fff;
  border-radius: 100px;
  font-size: 18px;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
}

/* Layout: sidebar + content */
.equip-layout {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 32px;
  align-items: start;
}
.equip-sidebar {
  position: sticky;
  top: 90px;
}
.filter-group {
  background: #F3F7FA;
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 12px;
}
.filter-group h4 {
  font-size: 14px;
  font-weight: 600;
  color: #009294;
  margin: 0 0 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.filter-group label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  font-size: 14px;
  color: #5A6E7C;
  cursor: pointer;
}
.filter-group input[type=checkbox] { accent-color: #009294; }
.equip-reset {
  width: 100%;
  padding: 12px;
  border: 1px solid #009294;
  background: transparent;
  color: #009294;
  border-radius: 100px;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}
.equip-reset:hover { background: #009294; color: #fff; }

/* Equipment rows */
.equip-list { display: flex; flex-direction: column; gap: 8px; }
.equip-row {
  display: grid;
  grid-template-columns: 1fr auto 200px;
  gap: 24px;
  align-items: center;
  padding: 16px 20px;
  background: #F3F7FA;
  border-radius: 16px;
  transition: background 0.2s;
}
.equip-row:hover { background: #EDF3F5; }
.equip-row__tags { display: flex; gap: 8px; margin-bottom: 8px; }
.bage {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px;
  background: #85BAAF;
  color: #fff;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 500;
  line-height: 18px;
  letter-spacing: 0.02em;
}
.equip-row__title {
  font-size: 18px;
  font-weight: 500;
  color: #009294;
  margin: 0 0 4px;
  line-height: 22px;
}
.equip-row__desc {
  font-size: 14px;
  color: #809CAF;
  margin: 0;
  line-height: 16px;
}
.equip-row__meta {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: flex-end;
}
.equip-row__time {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 10px;
  background: #E4ECF3;
  border-radius: 4px;
  font-size: 14px;
  color: #809CAF;
  white-space: nowrap;
}
.equip-row__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 24px;
  border: 1px solid #009294;
  background: transparent;
  color: #009294;
  border-radius: 100px;
  font: inherit;
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s;
}
.equip-row__btn:hover { background: #009294; color: #fff; }
.equip-row__btn.is-in-cart {
  background: #009294;
  color: #fff;
}
.equip-row__photo img {
  width: 200px;
  height: 130px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}
.equip-empty {
  text-align: center;
  padding: 60px 20px;
  color: #809CAF;
}
.equip-empty button {
  margin-top: 16px;
  padding: 10px 24px;
  border: 1px solid #009294;
  background: transparent;
  color: #009294;
  border-radius: 100px;
  font: inherit;
  cursor: pointer;
}

/* Responsive */
@media (max-width: 900px) {
  .equip-layout { grid-template-columns: 1fr; }
  .equip-sidebar { position: static; }
  .filter-group { display: none; }
  .filter-group.is-open { display: block; }
  .equip-row {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .equip-row__photo img { width: 100%; height: auto; }
  .equip-row__meta { flex-direction: row; align-items: center; justify-content: space-between; }
}

/* === FINAL page-hero — matches home hero === */
.page-hero {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 520px !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  margin: 16px 0 32px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  background: #000A3A !important;
}
@media (max-width: 768px) {
  .page-hero {
    height: 340px !important;
    border-radius: 16px !important;
  }
}

/* === Service rows (no photo, wider info) === */
.equip-row--service {
  grid-template-columns: 1fr auto !important;
  gap: 24px !important;
}
.equip-row--service .equip-row__info {
  padding-right: 16px;
}
.equip-row--service .equip-row__title {
  font-size: 20px !important;
}
.equip-row--service .equip-row__desc {
  font-size: 15px !important;
  line-height: 1.6 !important;
}
.equip-row--service .bage--top {
  background: #009294 !important;
  color: #fff !important;
}

/* === Fix advantages grid === */
.content-section .row.centerAb {
  gap: 0 !important;
  margin: 24px 0 !important;
}
.content-section .centerAb > [class*=col-] {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin-bottom: 32px;
  padding-left: 12px;
  padding-right: 12px;
}
.content-section .centerAb img.img-responsive {
  width: 80px;
  height: 80px;
  object-fit: contain;
  margin: 0 auto 12px;
  border-radius: 16px;
  background: #F3F7FA;
  padding: 12px;
  box-sizing: border-box;
}
.content-section .centerAb span {
  display: block;
  font-size: 13px;
  color: #5A6E7C;
  line-height: 1.5;
  max-width: 180px;
  margin: 0 auto;
}

/* === Advantages grid (clean) === */
.advantages-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 24px;
  max-width: 1201px;
  margin: 32px auto;
  padding: 0 20px;
}
.adv-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background: #F3F7FA;
  border-radius: 16px;
  padding: 24px 16px;
}
.adv-card img {
  width: 72px;
  height: 72px;
  object-fit: contain;
  margin: 0 auto 16px;
}
.adv-card span {
  display: block;
  font-size: 13px;
  color: #5A6E7C;
  line-height: 1.5;
}
@media (max-width: 991px) {
  .advantages-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 575px) {
  .advantages-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .adv-card { padding: 16px 12px; }
  .adv-card img { width: 56px; height: 56px; }
}

/* === Status Check Form === */
.status-check {
  max-width: 720px;
  margin: 0 auto;
  padding: 20px;
}
.status-check__card {
  background: #F3F7FA;
  border-radius: 24px;
  padding: 48px 40px;
  text-align: center;
}
.status-check__title {
  font-size: 28px;
  font-weight: 700;
  color: #009294;
  margin: 0 0 8px;
}
.status-check__subtitle {
  font-size: 16px;
  color: #809CAF;
  margin: 0 0 32px;
}
.status-check__form {
  display: flex;
  gap: 16px;
  align-items: flex-end;
  flex-wrap: wrap;
  justify-content: center;
}
.status-check__field {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  flex: 1 1 200px;
  min-width: 180px;
}
.status-check__field label {
  font-size: 14px;
  font-weight: 500;
  color: #5A6E7C;
}
.status-check__field input,
.status-check__field select {
  width: 100%;
  height: 56px;
  padding: 0 16px;
  border: 1px solid #85BAAF;
  border-radius: 12px;
  font: inherit;
  font-size: 16px;
  color: #272D31;
  background: #fff;
  box-sizing: border-box;
  outline: none;
  transition: border-color 0.2s;
}
.status-check__field input:focus,
.status-check__field select:focus {
  border-color: #009294;
}
.status-check__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 56px;
  padding: 0 32px;
  background: #009294;
  color: #fff;
  border: none;
  border-radius: 100px;
  font: inherit;
  font-size: 18px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.2s;
}
.status-check__btn:hover { background: #007B7B; }
.status-check__btn svg { stroke: #fff; }

/* Loader */
.status-check__loader {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 32px;
  color: #809CAF;
}
.status-check__spinner {
  width: 24px;
  height: 24px;
  border: 3px solid #E4ECF3;
  border-top-color: #009294;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Result */
.status-check__result { margin-top: 24px; }
.status-check__alert {
  padding: 16px 24px;
  border-radius: 12px;
  font-size: 15px;
  text-align: center;
}
.status-check__alert--error {
  background: #FFF0F0;
  color: #D64545;
}
.status-check__alert--info {
  background: #E8F4F4;
  color: #009294;
}

/* Order cards */
.status-check__orders {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.status-order {
  background: #F3F7FA;
  border-radius: 16px;
  padding: 20px 24px;
}
.status-order--border { border-top: 1px solid #E4ECF3; }
.status-order__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.status-order__number {
  font-size: 16px;
  font-weight: 600;
  color: #272D31;
}
.status-order__date {
  font-size: 14px;
  color: #A8B4BD;
}
.status-order__body {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
.status-order__status {
  display: inline-flex;
  padding: 6px 16px;
  background: #E8F4F4;
  color: #009294;
  border-radius: 100px;
  font-size: 14px;
  font-weight: 500;
}
.status-order__mesto {
  font-size: 14px;
  color: #5A6E7C;
}

/* Responsive */
@media (max-width: 600px) {
  .status-check__card { padding: 32px 20px; }
  .status-check__form { flex-direction: column; align-items: stretch; }
  .status-check__btn { justify-content: center; }
  .status-check__title { font-size: 22px; }
}

/* Fix: hidden attribute must override display:flex */
.status-check__loader[hidden] {
  display: none !important;
}

/* === Social articles === */
 .social-articles-OLD {
  max-width: 900px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.social-article {
  background: #F3F7FA;
  border-radius: 20px;
  padding: 32px 36px;
}
.social-article__title {
  font-size: 22px;
  font-weight: 600;
  color: #009294;
  margin: 0 0 4px;
}
.social-article__date {
  font-size: 14px;
  color: #A8B4BD;
  margin: 0 0 16px;
}
.social-article p {
  font-size: 16px;
  line-height: 1.7;
  color: #5A6E7C;
  margin: 0 0 12px;
}
.social-article p:last-child { margin-bottom: 0; }
.social-article strong { color: #272D31; font-weight: 600; }
/* Gallery slider inside article */
.page-hero--gallery .page-hero__slide img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.page-hero--gallery .page-hero__overlay {
  background: linear-gradient(180deg, rgba(0,10,58,0.2) 0%, rgba(0,10,58,0.4) 100%) !important;
}
@media (max-width: 600px) {
  .social-article { padding: 24px 20px; }
  .social-article__title { font-size: 18px; }
  .social-article p { font-size: 15px; }
}

/* === Fix social articles width === */
.social-articles {
  max-width: 1201px !important;
  margin: 0 auto !important;
  padding: 0 20px !important;
}

/* === Social article cards (main page) === */
.social-card {
  display: flex;
  gap: 24px;
  background: #F3F7FA;
  border-radius: 20px;
  padding: 24px;
  text-decoration: none;
  color: inherit;
  transition: box-shadow 0.2s, transform 0.2s;
  margin-bottom: 20px;
}
.social-card:hover {
  box-shadow: 0 4px 20px rgba(0,146,148,0.12);
  transform: translateY(-2px);
}
.social-card__icon {
  flex: 0 0 200px;
  height: 140px;
  border-radius: 12px;
  overflow: hidden;
}
.social-card__icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.social-card__body {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.social-card__date {
  font-size: 14px;
  color: #A8B4BD;
  margin-bottom: 4px;
}
.social-card__title {
  font-size: 20px;
  font-weight: 600;
  color: #009294;
  margin: 0 0 8px;
}
.social-card__text {
  font-size: 15px;
  color: #5A6E7C;
  line-height: 1.5;
  margin: 0 0 12px;
  flex: 1;
}
.social-card__link {
  font-size: 15px;
  color: #009294;
  font-weight: 500;
}

/* === Article detail pages === */
.article-detail {
  max-width: 900px;
  margin: 0 auto;
}
.article-detail__lead {
  font-size: 18px;
  color: #272D31;
  line-height: 1.7;
  margin: 0 0 24px;
  font-weight: 500;
}
.article-detail h2 {
  font-size: 22px;
  font-weight: 600;
  color: #009294;
  margin: 32px 0 12px;
}
.article-detail p {
  font-size: 16px;
  color: #5A6E7C;
  line-height: 1.7;
  margin: 0 0 16px;
}
.article-detail ul {
  margin: 0 0 16px;
  padding-left: 20px;
}
.article-detail li {
  font-size: 16px;
  color: #5A6E7C;
  line-height: 1.7;
  margin-bottom: 8px;
}
.article-detail strong { color: #272D31; }
.article-detail__quote {
  border-left: 4px solid #009294;
  padding: 16px 24px;
  margin: 24px 0;
  background: #F3F7FA;
  border-radius: 0 12px 12px 0;
  font-size: 16px;
  color: #272D31;
  font-style: italic;
}

@media (max-width: 600px) {
  .social-card { flex-direction: column; gap: 16px; }
  .social-card__icon { flex: 0 0 auto; width: 100%; height: 200px; }
  .article-detail { padding: 0 16px; }
}
/* === Clients page (Заказчикам) === */
.clients-page { max-width: 1201px; margin: 0 auto; padding: 0 20px; }

/* HERO */
.clients-hero {
  position: relative;
  height: 520px;
  border-radius: 24px;
  overflow: hidden;
  background: linear-gradient(135deg, #60bbd7 0%, #009294 100%);
  margin: 16px 0 60px;
}
.clients-hero__bg {
  position: absolute; inset: 0;
  background: url(/assets/images/figma-new/hero-main.jpg) center/cover;
  opacity: 0.3;
}
.clients-hero__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,10,58,0.3) 0%, rgba(0,76,89,0.6) 100%);
}
.clients-hero__content {
  position: relative; z-index: 2;
  padding: 60px 48px;
  display: flex; flex-direction: column;
  gap: 24px; height: 100%;
  justify-content: center;
  max-width: 700px;
}
.clients-hero__title {
  color: #fff; font-size: 42px; font-weight: 700; line-height: 46px; margin: 0;
}
.clients-hero__sub {
  color: rgba(255,255,255,0.9); font-size: 18px; line-height: 22px; margin: 0;
}
.clients-hero__search { margin-top: 8px; }
.clients-hero__search-label {
  color: #fff; font-size: 20px; font-weight: 500; margin: 0 0 12px;
}
.clients-search-bar {
  display: flex; align-items: center; gap: 12px;
  background: #F3F7FA; border-radius: 100px; padding: 8px 10px 8px 20px;
  max-width: 540px;
}
.clients-search-bar input {
  flex: 1; border: none; background: transparent; outline: none;
  font: inherit; font-size: 18px; color: #272D31;
}
.clients-search-bar input::placeholder { color: #A8B4BD; }
.clients-search-btn {
  width: 40px; height: 40px; border: none; border-radius: 50%;
  background: #009294; color: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.clients-search-btn svg { stroke: #fff; }

/* STATS */
.clients-stats {
  background: linear-gradient(180deg, #009294 0%, #F3F7FA 100%);
  border-radius: 24px; padding: 40px 32px; margin-bottom: 60px;
}
.clients-stats__title {
  color: #fff; font-size: 32px; font-weight: 500; margin: 0 0 32px;
}
.clients-stats__grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-bottom: 24px;
}
.stat-card {
  background: #fff; border-radius: 24px; padding: 24px;
  display: flex; flex-direction: column; gap: 16px;
}
.stat-card__badge {
  display: inline-flex; align-self: flex-start;
  padding: 6px 12px; background: #009294; color: #ccf2ea;
  border-radius: 100px; font-size: 14px; font-weight: 500;
}
.stat-card__num {
  color: #009294; font-size: 28px; font-weight: 500; line-height: 30px; margin: 0;
}
.stat-card__desc {
  color: #85BAAF; font-size: 16px; line-height: 18px; margin: 0;
}
.clients-stats__features {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;
  background: #fff; border-radius: 24px; padding: 24px; margin-bottom: 24px;
}
.feature-item {
  display: flex; align-items: flex-start; gap: 16px;
}
.feature-item__icon {
  width: 40px; height: 40px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px;
}
.feature-item__title { color: #009294; font-size: 20px; font-weight: 500; margin: 0 0 4px; }
.feature-item__desc { color: #009294; font-size: 16px; line-height: 18px; margin: 0; }

/* BANNER */
.clients-banner {
  position: relative; height: 380px; border-radius: 24px; overflow: hidden;
  margin-bottom: 60px;
  background: url(/assets/images/figma-new/hero-main.jpg) center/cover;
}
.clients-banner__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(248,250,252,0.85) 0%, rgba(248,250,252,0.3) 100%);
}
.clients-banner__content {
  position: relative; z-index: 2; padding: 56px;
  display: flex; flex-direction: column; gap: 32px;
  max-width: 606px; height: 100%; justify-content: center;
}
.clients-banner__title {
  color: #809CAF; font-size: 36px; font-weight: 500; line-height: 40px; margin: 0;
}
.clients-banner__actions { display: flex; flex-direction: column; gap: 16px; }
.clients-banner__hint { color: #6D8A9F; font-size: 18px; font-weight: 500; margin: 0; }

/* LABS */
.clients-labs { margin-bottom: 60px; }
.clients-labs__layout {
  display: flex; gap: 8px; align-items: stretch;
}
.clients-labs__list {
  display: flex; flex-direction: column; gap: 8px; flex-shrink: 0;
}
.lab-tag {
  padding: 24px; background: #F3F7FA; border-radius: 12px;
  font-size: 18px; color: #5A6E7C; cursor: pointer;
  transition: background 0.2s;
}
.lab-tag:hover { background: #E8F4F4; color: #009294; }
.clients-labs__image {
  flex: 1; min-width: 0; border-radius: 24px;
  background: url(/assets/images/figma-new/lab_preview_1.jpg) center/cover;
  min-height: 400px;
}

/* SERVICES */
.clients-services {
  background: linear-gradient(180deg, #009294 0%, #F3F7FA 100%);
  border-radius: 24px; padding: 40px 32px; margin-bottom: 60px;
}
.section-title--light { color: #fff; font-size: 32px; font-weight: 500; margin: 0 0 32px; }
.clients-services__grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
}
.svc-card {
  background: #fff; border-radius: 24px; padding: 24px 20px;
  display: flex; flex-direction: column; gap: 12px;
  min-height: 292px;
}
.svc-card__badges { display: flex; gap: 5px; flex-wrap: wrap; }
.svc-card__badges span {
  padding: 4px 10px; background: #85BAAF; color: #fff;
  border-radius: 4px; font-size: 10px; font-weight: 500;
}
.svc-card__divider { height: 1px; background: #009294; margin: 4px 0; }
.svc-card h3 { color: #009294; font-size: 20px; font-weight: 500; line-height: 22px; margin: 0; }
.svc-card p { color: #5A6E7C; font-size: 14px; line-height: 16px; margin: 0; }

/* LK BANNER */
.clients-lk {
  display: flex; gap: 8px; align-items: stretch; margin-bottom: 60px;
}
.clients-lk__text {
  flex: 1; background: #fff; border-radius: 24px; padding: 32px;
  display: flex; flex-direction: column; gap: 24px;
}
.clients-lk__text h2 { color: #009294; font-size: 32px; font-weight: 500; line-height: 34px; margin: 0; }
.clients-lk__text p { color: #809CAF; font-size: 18px; line-height: 24px; margin: 0; }
.clients-lk__image {
  flex: 1.4; border-radius: 24px;
  background: url(/assets/images/figma-new/lab_preview_3.jpg) center/cover;
  min-height: 400px;
}

/* STEPS */
.clients-steps {
  margin-bottom: 60px;
}
.section-title--center { color: #009294; font-size: 32px; font-weight: 500; text-align: center; margin: 0 0 32px; }
.clients-steps__grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
  position: relative;
}
.step-card {
  border: 1px solid #B3DFDF; background: #F3F7FA; border-radius: 24px;
  padding: 24px; display: flex; flex-direction: column; gap: 16px;
  min-height: 170px;
}
.step-card__num {
  width: 52px; height: 52px; background: #009294; border-radius: 8px;
  color: #fff; font-size: 36px; font-weight: 400;
  display: flex; align-items: center; justify-content: center;
  line-height: 1;
}
.step-card h3 { color: #009294; font-size: 20px; font-weight: 500; line-height: 22px; margin: 0; }
.step-card p { color: #5A6E7C; font-size: 16px; line-height: 18px; margin: 0; }

/* FAQ */
.clients-faq { margin-bottom: 60px; }
.section-title { color: #009294; font-size: 32px; font-weight: 500; margin: 0 0 32px; }
.faq-list { display: flex; flex-direction: column; gap: 8px; }
.faq-item {
  border: 1px solid #B3DFDF; background: #fff; border-radius: 24px; overflow: hidden;
}
.faq-item__header {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 24px; cursor: pointer;
}
.faq-item__header span { color: #5A6E7C; font-size: 20px; font-weight: 500; line-height: 22px; }
.faq-item__toggle {
  width: 48px; height: 48px; border-radius: 50%; border: none;
  background: #85BAAF; color: #fff; font-size: 24px; cursor: pointer;
  flex-shrink: 0;
}
.faq-item__body {
  max-height: 0; overflow: hidden; transition: max-height 0.3s ease;
  padding: 0 24px;
}
.faq-item__body p { color: #5A6E7C; font-size: 16px; line-height: 18px; margin: 0 0 24px; }
.faq-item.is-open .faq-item__toggle { background: #009294; }

/* CTA */
.clients-cta {
  text-align: center; padding: 60px 20px; margin-bottom: 40px;
}
.clients-cta h2 {
  color: #009294; font-size: 36px; font-weight: 500; line-height: 40px;
  margin: 0 0 32px; max-width: 600px; margin-left: auto; margin-right: auto;
}

/* BUTTONS */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 18px 24px; border-radius: 100px; font: inherit; font-size: 18px;
  font-weight: 500; text-decoration: none; cursor: pointer; border: none;
  transition: opacity 0.2s;
}
.btn:hover { opacity: 0.9; }
.btn--solid { background: #009294; color: #fff; }
.btn--outline-light { background: transparent; color: #6D8A9F; border: 1px solid #6D8A9F; }
.btn--lg { padding: 20px 40px; font-size: 20px; }

/* RESPONSIVE */
@media (max-width: 991px) {
  .clients-hero__title { font-size: 28px; line-height: 32px; }
  .clients-stats__grid, .clients-services__grid, .clients-steps__grid { grid-template-columns: repeat(2, 1fr); }
  .clients-stats__features { grid-template-columns: 1fr; }
  .clients-labs__layout, .clients-lk { flex-direction: column; }
  .clients-lk__image { min-height: 240px; }
}
@media (max-width: 600px) {
  .clients-hero { height: 420px; }
  .clients-hero__content { padding: 32px 24px; }
  .clients-hero__title { font-size: 22px; line-height: 26px; }
  .clients-stats__grid, .clients-services__grid, .clients-steps__grid { grid-template-columns: 1fr; }
  .clients-banner { height: auto; }
  .clients-banner__content { padding: 32px 24px; }
  .clients-banner__title { font-size: 24px; line-height: 28px; }
  .faq-item__header span { font-size: 16px; }
}
/* === UNIFIED WIDTH: all blocks match hero (1201px) === */
.content-section { max-width: 1201px !important; margin: 0 auto !important; padding: 0 20px !important; }
.article-detail { max-width: 1201px !important; margin: 0 auto !important; padding: 0 20px !important; }
.status-check { max-width: 1201px !important; margin: 0 auto !important; padding: 20px !important; }
.social-articles { max-width: 1201px !important; margin: 0 auto !important; padding: 0 20px !important; }
.clients-page { max-width: 1201px !important; margin: 0 auto !important; padding: 0 20px !important; }
.equip-page { max-width: 1201px !important; margin: 0 auto !important; padding: 0 20px !important; }
.advantages-grid { max-width: 1201px !important; margin: 32px auto !important; padding: 0 20px !important; }
.page-hero { max-width: 1201px !important; margin-left: auto !important; margin-right: auto !important; }

/* legal-footer uplift (2026-08-31): вернуть читаемые размеры/отступы */
.legal-footer__in { font-size: 14px !important; line-height: 16px; padding: 4px 0 8px; color: #a8b4bd; }
.legal-footer__in > * { display: block; }
.legal-footer a { text-underline-offset: 2px; }
.legal-links a { font-size: 11px; }


/* legal-footer uplift (2026-08-31): вернуть читаемые размеры и отступы */
.legal-footer__in { font-size: 14px !important; line-height: 16px; padding: 4px 0 8px; color: #a8b4bd; }
.legal-footer__in > * { display: block; }
.legal-links a { font-size: 11px; }

/* legal-footer uplift (2026-08-31): readable sizes */
.legal-footer__in { font-size: 14px !important; line-height: 16px; padding: 4px 0 8px; color: #a8b4bd; }
.legal-footer__in > * { display: block; }
.legal-links a { font-size: 11px; }

/* Mobile footer cleanup (2026-08-31): hide maps and labs accordion in mobile footer */
@media(max-width:767px){
  #contacts .maps-grid { display: none !important; }
  #contacts .labs-card { display: block !important; }
}

/* FB2.Contacts per Figma (2026-09-01) */
/* .hero-copy{max-width:660px} — УБРАНО 10.09.2026: перебивало канон base.css (588px, Figma 182:4143),
   из-за чего хиро-заголовок переносился иначе («Проверяем качество» / «лекарств» вместо «Проверяем» / «качество лекарств») */
.footer-top .contacts-card{grid-row:span 2}
.footer-top .contacts-card{display:flex;flex-direction:column;gap:23px}
.footer-top .contacts-card > p{margin:0}
.footer-top .contacts-card .foot-org{margin-bottom:0}
.footer-top .callback{grid-column:2;grid-row:2}
/* Footer CTA «Остались вопросы?»: Figma Frame 888 — grey #F3F7FA, radius 24px, padding 24px 40px */
.footer-top .callback{background:#f3f7fa;border-radius:24px;padding:24px 40px}
.footer-top .callback strong{color:#272d31;font-size:17px;margin-bottom:6px}
.footer-top .callback span{color:#5a6e7c;font-size:13px;line-height:1.45}
.footer-top .callback .btn{background:#009294;color:#fff;border-color:#009294}
.footer-top .callback .btn:hover{transform:translateY(-1px)}
@media(max-width:767px){.footer-top .callback{padding:20px 24px}}
.labs-card h2{grid-column:1/-1}
.labs-sub{grid-column:1/-1;color:#536b78;font-size:14px;line-height:1.5;margin:4px 0 18px}
.labs-grid{grid-column:1/-1;display:grid !important;grid-template-columns:1fr 1fr !important;gap:28px}.labs-grid .lab-col{min-width:0}
.lab-label{margin:12px 0 2px;color:#536b78;font-size:12px}
.map-link{color:var(--teal);font-size:12px;text-decoration:underline;text-underline-offset:3px}
.foot-org{font-size:13px;line-height:1.45;letter-spacing:.01em}
@media(max-width:767px){.labs-grid{grid-template-columns:1fr}}

/* Legal index cards */
.legal-index{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:28px}
.legal-card{display:flex;flex-direction:column;gap:8px;padding:22px 24px;background:#fff;border:1px solid var(--line,#dce8ee);border-radius:14px;text-decoration:none;transition:box-shadow .15s,border-color .15s}
.legal-card:hover{border-color:var(--teal);box-shadow:0 4px 18px rgba(0,60,80,.08)}
.legal-card strong{color:var(--teal);font-size:16px;font-weight:600}
.legal-card span{color:#5b6b76;font-size:13px;line-height:1.5}
.legal-page h1{margin-bottom:6px}
.legal-page p{color:#5b6b76}
@media(max-width:767px){.legal-index{grid-template-columns:1fr}}

/* Company form in account profile */
.account-company-form{margin-top:22px;padding:22px 24px;background:#fff;border:1px solid var(--line,#dce8ee);border-radius:14px;display:grid;gap:14px}
.account-company-form h4{margin:0;color:var(--teal);font-size:16px}
.account-company-form .account-form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.account-company-form label{display:grid;gap:5px;font-size:12px;color:#5b6b76}
.account-company-form input{padding:9px 12px;border:1px solid #cfe1e6;border-radius:9px;font-size:14px;color:#22313b}
.account-company-form input:focus{outline:0;border-color:var(--teal)}
.account-company-form .form-actions{display:flex;align-items:center;gap:12px}
.account-company-form [data-company-message]{font-size:12px}
@media(max-width:767px){.account-company-form .account-form-row{grid-template-columns:1fr}}

/* Home hero background video */
.hero-box video.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s ease}
.hero-box.video-ready video.hero-video{opacity:1}
.hero-box.video-ready > img{visibility:hidden}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,22,34,.55) 0%,rgba(0,22,34,.28) 55%,rgba(0,22,34,.05) 78%);pointer-events:none}
.hero-box .hero-copy{z-index:2}
/* 28.09.2026: раньше здесь видео глушилось на телефоне целиком (display:none) — снято,
   теперь на ≤767 играет облегчённая пара (hero-main-mobile.*, ~1 МБ). display:none
   остаётся только пока видео не стартовало: тогда виден постер-кадр (img в .hero-box). */
@media(max-width:767px){.hero-box:not(.video-ready) video.hero-video{display:none}}

/* News list cards with photos — scoped to .news-list so the legacy home
   carousel (.soft-block--blue .news-card) keeps its base min-height:200px */

/* Press-center block per Figma (2026-09-02) */
.soft-block--blue{background:linear-gradient(180deg,#e6eef4 0%,#feffff 100%);border-radius:24px;padding:40px 32px}
.soft-block--blue .news-card{border-radius:24px;padding:24px;height:360px}
.soft-block--blue .news-card .news-date{background:#85baaf !important;color:#fff !important;font-size:10px !important;padding:0 10px !important;height:22px;line-height:22px;text-transform:uppercase;letter-spacing:.02em;font-weight:700;border-radius:4px !important}
.soft-block--blue .news-card h3{font-size:16px;line-height:18px;color:#272d31}
.soft-block--blue .news-card a{font-size:14px;line-height:16px;text-decoration:underline;text-underline-offset:3px}
.soft-block--blue .carousel-viewport{margin:0 48px}
.soft-block--blue .carousel .nav-arrow{left:0;right:auto;width:44px;height:44px;border-color:#85baaf;box-shadow:0 4px 14px rgba(44,76,90,.10)}
.soft-block--blue .carousel .nav-arrow.next{left:auto;right:0}
.soft-block--blue .section-title{font-size:28px}
.soft-block--blue .btn{background:transparent;border:1px solid var(--teal)}
/* 14.09.2026: сетка страницы новостей — три колонки, по аналогии с блоком
   новостей внизу главной. Дизайнер: «сейчас всё гигантское».
   Было: repeat(2,1fr) — карточка 589×578 при контейнере 1201.
   Эталон с главной: карточка 336×300, media 200, радиус 24.
   В контейнере 1201 три колонки по (1201-2*20)/3 = 387 — это шире эталонных 336,
   но главная живёт в карусели, где 336 задаётся слайдом. Здесь 387 при том же
   соотношении media/текста. */
.news-list{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:1023px){.news-list{grid-template-columns:repeat(2,1fr)}}
@media(max-width:767px){.news-list{grid-template-columns:1fr}}
.news-list .news-card{padding:0;overflow:hidden;display:flex;flex-direction:column;min-height:0}
.news-card__media{height:200px;overflow:hidden;background:#eef4f7}
.news-card__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease}
.news-card:hover .news-card__media img{transform:scale(1.04)}
.news-card__body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px}
.news-card__date{color:#8aa0af;font-size:12px}
.news-card__title{margin:0;font-size:16px;line-height:1.35;color:#22313b}
.news-card__intro{margin:0;font-size:13px;color:#5b6b76;line-height:1.5}
.news-card__link{color:var(--teal);font-size:13px;margin-top:auto}
.news-card .news-date{color:#8aa0af;font-size:12px}
.news-card h3{margin:0;font-size:15px;line-height:1.35}
.news-card .btn{margin-top:8px;align-self:flex-start}

/* 14.09.2026: рубрики пресс-центра. Ссылки на научную и социальную
   ответственность перенесены сюда из главного меню (там их больше нет).
   Вид — как у фильтров-чипов сайта: пилюля r100, активная заливка #009294,
   обычная — светлая подложка с бордером. Текущая рубрика — span, не ссылка.

   16.09.2026 (t_22f8c48b): вертикальный ритм был сломан — ряд рубрик приклеен
   к карточкам зазором 4px, а подзаголовок к рубрикам — 8px (замер живого /news/).
   Сайт для связки «заголовок → ряд фильтров → содержимое» держит 24px:
   /contacts .contact-tabs__nav и .contact-tabs__panel — по 24px @1440 и @375
   (тот же паттерн «ряд вкладок → панель»). Приведено к нему.

   ПИТФОЛЛ (замер: route-подмена audit-fixes и сравнение вычисленных стилей).
   У блоков ДВА класса — `section news-head` / `section news-rubrics`, и есть
   `responsive.css .section{padding:12px 0}` + `base.css .section{padding:34px 0}`.
   1) Отдельное `padding-bottom` НЕЛЬЗЯ: без шортката верх/бока подхватывает
      `.section` из base.css, и верх блока молча уезжает (0 → 34px).
   2) `.section.news-rubrics` (0,2,0) нужен на мобильном, чтобы обойти
      `.section` из responsive.css, но тогда «оживает» и авторский верх.
   Поэтому шорткат ВСЕГДА со явным верхом, равным живому значению:
   desktop 0px, мобильный 12px. Так меняются ровно два заявленных зазора,
   и ничего больше. Проверено 360/375/414/767/768/1024/1280/1440/1600. */
.news-rubrics{padding:0 0 24px}
.rubric-list{display:flex;flex-wrap:wrap;gap:10px}
.rubric{display:inline-flex;align-items:center;min-height:40px;padding:0 18px;border-radius:100px;
  font-size:15px;line-height:18px;font-weight:500;text-decoration:none;white-space:nowrap;
  border:1px solid #85BAAF;color:#009294;background:#fff;transition:.2s}
.rubric:hover{background:#CCF2EA;border-color:#009294}
.rubric.is-active{background:#009294;border-color:#009294;color:#fff}
@media(max-width:767px){
  .rubric-list{gap:8px}
  .rubric{min-height:36px;padding:0 14px;font-size:14px;line-height:16px}
}

/* News detail photo */
.news-detail__photo{margin:0 0 20px;border-radius:12px;overflow:hidden}
.news-detail__photo img{width:100%;height:auto;display:block}

/* News pagination */
.news-more{display:flex;align-items:center;gap:14px;justify-content:center;margin-top:28px}
/* 24.09.2026 (t_d688442c): кнопка «Показать ещё» @375 = 76px вместо канонных 56.
   Причина: .news-more flex-row + gap:14 → кнопка (197) + спан (132) = 343 = вся ширина,
   текст кнопки переносится на 2 строки (padding 18+18 + 2×20 = 76). Решение: на ≤767
   стопим колонкой, кнопке — white-space:nowrap, высота фикс 56 (--fb-btn-lg). */
.news-more .btn[data-news-more]{white-space:nowrap}
@media(max-width:767px){
  .news-more{flex-direction:column;gap:10px}
  .news-more .btn[data-news-more]{min-height:56px;height:56px;padding:0 24px;white-space:nowrap}
  .news-more .muted{font-size:14px;line-height:16px}
}

/* Awards without photo: text card */
.awards-stage--noimg .awards-doc{display:none}
.awards-stage--noimg{background:linear-gradient(135deg,#f4fafb,#e8f3f4);min-height:280px}

/* Header login button alignment: same height as circle-btn (34px) */
.header-actions .login{height:34px;padding:0 14px;border-radius:999px;align-items:center}
.header-actions .login .icon{flex:0 0 18px}
/* Logged-in state */
.header-actions .login.is-auth{background:var(--teal);color:#fff;border-color:var(--teal)}
.header-actions .login.is-auth:hover{background:#00807f;border-color:#00807f}
.header-actions .login.is-auth .login-name{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* History: compact year rail — 15 years fit without scroll-jump */
.history-rail{max-height:480px;padding:24px 26px}
.history-years{gap:0}
.history-year{font-size:17px;padding:6px 18px}
.history-year.active{transform:scale(1.18)}

/* History rail: narrow fade zones so last years stay readable */
.history-rail:before{background:linear-gradient(#fff 0%,transparent 3%,transparent 100%)!important}

/* History active year: no blur halo (it blurs neighbouring years) */
.history-year.active:after{display:none!important}
.history-year.active{background:rgba(213,240,235,.92)!important;box-shadow:inset 0 0 0 1px rgba(0,154,155,.14)!important}

/* Header icons + form checkboxes per Figma (2026-09-02) */
.site-header .circle-btn{border:0;background:#f0f4f6}
.site-header .login{border:0;background:transparent;padding:6px 8px}
/* round consent checkboxes */
.checks label{display:flex;align-items:center;gap:10px;font-size:13px;color:#6d8291;cursor:pointer}
.checks input[type="checkbox"]{appearance:none;-webkit-appearance:none;width:20px;height:20px;flex:0 0 auto;border:1.5px solid #85baaf;border-radius:50%;background:#fff;margin:0;cursor:pointer;display:inline-grid;place-items:center}
.checks input[type="checkbox"]:checked{background:#85baaf}
.checks input[type="checkbox"]:checked::after{content:'';width:8px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) translateY(-1px)}
.checks input[type="checkbox"]:focus-visible{outline:2px solid var(--teal);outline-offset:2px}

/* Home page per Figma export index_18 (2026-09-02) */
/* Hero */
.hero-copy h1{font-size:60px;line-height:62px;font-weight:500}
.hero-copy p{font-size:24px;line-height:26px;font-weight:500}
/* Numbers */
.stats-panel{border-radius:24px;padding:40px 32px;gap:32px;background:linear-gradient(180deg,#cde3de 0%,#feffff 100%)}
.stats-panel h2{font-size:32px;line-height:34px;font-weight:500}
.stat-value{font-size:60px;font-weight:500;line-height:60px;color:#009294}
.stat-text{font-size:16px;line-height:18px;color:#85baaf}
.stats-grid .stat{border-radius:24px;background:#fff}
/* Banner */
.cta-water{border-radius:24px;height:455px;overflow:hidden}
.cta-water__copy{max-width:606px}
.cta-water__copy h2{font-size:40px;line-height:42px;font-weight:500;color:#809caf;max-width:606px}
.cta-water__copy .btn{font-size:18px;padding:18px 24px;border-color:#6d8a9f;color:#6d8a9f}
/* Services (teal-block) */
.teal-block{border-radius:24px;padding:40px 32px;background:linear-gradient(180deg,#019294 0%,#feffff 100%)}
.teal-block>.section-title{font-size:32px;line-height:34px;font-weight:500;color:#fff}
.service-grid{gap:8px}
.service-card{border-radius:24px;min-height:292px;padding:24px 20px}
.chip{height:22px;display:inline-flex;align-items:center;padding:0 10px;border-radius:4px;background:#85baaf;color:#fff;font-size:10px;font-weight:700}
/* Career banner */
.career-banner .career-photo__num strong{font-size:86px;font-weight:500}
/* Form */
.form-head h2{font-size:40px;line-height:42px;font-weight:500;text-align:center}
.field,input.field,select.field,textarea.field{min-height:56px;border:1px solid #85baaf;border-radius:12px;padding:16px}

/* Career banner per Figma: left = single card #f3f7fa */
.career-banner{gap:8px}
.career-banner .career-copy{background:#f3f7fa;border-radius:24px;padding:32px;min-height:493px;justify-content:space-between}
.career-banner .career-copy h2{font-size:32px;line-height:34px;font-weight:500;color:#809caf;max-width:525px}

/* Footer legal links: 2-column grid per Figma (was inline-squeezed) */
.legal-footer .legal-footer__in{display:grid;grid-template-columns:1.15fr 1fr 1fr 1.1fr 1fr;gap:24px;align-items:start}
.legal-footer .f-col{font-size:14px;line-height:16px;color:#a8b4bd}
.legal-footer .legal-links{display:grid;gap:8px;align-content:start}
.legal-footer .legal-links a{display:block;font-size:14px;line-height:16px;color:#a8b4bd;text-decoration:underline;text-underline-offset:2px}
.legal-footer .legal-links a:hover{color:#009294}
@media(max-width:1023px){.legal-footer .legal-footer__in{grid-template-columns:1fr 1fr}}
@media(max-width:767px){.legal-footer .legal-footer__in{grid-template-columns:1fr}}

/* About "Решаем комплексные…" per Figma (index_17) */
.capability{background:#daefec;border-radius:24px;padding:40px 32px}
.capability .cap-title{margin:0 0 32px;font-size:24px;line-height:26px;font-weight:500;color:#009294;max-width:464px}
.capability .capability-grid{display:grid;grid-template-columns:380px 1fr;gap:16px;align-items:stretch}
.capability .capability-photo img{width:100%;height:100%;min-height:520px;object-fit:cover;border-radius:24px}
.capability .capability-list{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-content:stretch}
.capability .cap-item{display:flex;flex-direction:column;justify-content:space-between;gap:24px;background:#fff;border-radius:24px;padding:24px 24px 32px;min-height:292px;height:auto}
.capability .cap-ico{font-size:40px;line-height:40px;color:#009294}
.capability .cap-item p{margin:0;font-size:20px;line-height:22px;font-weight:500;color:#009294}
@media(max-width:1023px){.capability .capability-grid{grid-template-columns:1fr}.capability .capability-photo img{min-height:320px}}
@media(max-width:767px){.capability .capability-list{grid-template-columns:1fr}.capability .cap-item{min-height:200px}}

/* Золотой Меркурий block per Figma (index_17) */
.mercury-head{display:grid;grid-template-columns:1fr;gap:16px;margin-bottom:24px}
.mercury-note{font-size:16px;line-height:18px;color:#5a6e7c;max-width:698px}
.mercury-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.mercury-card{display:flex;gap:16px;align-items:flex-start}
.mercury-card img{width:239px;height:340px;object-fit:cover;border-radius:16px;flex:0 0 auto}
.mercury-card__body{display:flex;flex-direction:column;gap:16px;padding-top:8px}
.mercury-badges{display:flex;gap:4px;align-items:flex-start}
.badge-year{height:22px;display:inline-flex;align-items:center;padding:0 10px;background:#85baaf;border-radius:4px;color:#fff;font-size:14px;font-weight:700;line-height:12px}
.badge-status{color:#009294;font-size:14px;font-weight:400;line-height:16px;align-self:center}
.mercury-card__body p{margin:0;font-size:16px;line-height:18px;color:#272d31;max-width:223px}
@media(max-width:1023px){.mercury-grid{grid-template-columns:1fr}}
@media(max-width:767px){.mercury-card img{width:160px;height:228px}}

/* About page per Figma export index_19 — missed details (2026-09-02) */
/* Mission: quote block */
#mission h2{font-size:32px;line-height:34px;font-weight:500}
#mission .lead{font-size:24px;line-height:26px;font-weight:500;color:#5a6e7c;max-width:545px}
#mission .muted{font-size:18px;line-height:22px;font-weight:400;color:#5a6e7c;text-transform:none}
#mission img{border-radius:24px;aspect-ratio:1/1;object-fit:cover;width:100%;max-width:394px}
/* Numbers (about): teal gradient, white title, white 15-let card text */
#stats{background:linear-gradient(180deg,#019294 0%,#feffff 100%)}
#stats h2{color:#fff}
#stats .stat{background:#fff}
#stats .stat-year{background:transparent}
#stats .stat-year .stat-value{color:#fff}
#stats .stat-year .stat-text{color:rgba(255,255,255,.9)}
/* History: year scale per Figma */
.history-years button,.history-year{color:#809caf;font-weight:500}
/* Press (about): gradient like index_19 news */
.about .soft-block--blue{background:linear-gradient(180deg,#e6eef4 0%,#feffff 100%);border-radius:24px;padding:40px 32px}

/* /clients/ per Figma export index_20 (2026-09-02) */
/* Hero title: 50px/700 per Figma */
.hero--clients .hero-copy h1, section.hero .hero-copy h1 { font-size:60px; font-weight:500; line-height:62px; }
/* Каноны отдельных хиро: products 50/52/700 (Figma 1105:13306 и 1105:14840), career 52px (pages.css).
   Только ≥1024px — внутри media, чтобы повышенная специфичность не перебивала мобильные 44/26px. */
@media(min-width:1024px){
  section.hero.hero--products .hero-copy{max-width:688px}
  section.hero.career-hero .hero-copy{max-width:650px}
}

/* --- Хиро /services/ + /tools/ (Figma 1035:13097 / 1105:13306 / 1105:14840): фото капсул занимает
   правую часть блока (смещение 236 от левого края, обрезка справа на 87px), слайдер из 6 кадров,
   точки 8x8 с шагом 14 на смещении 562/579 от верхнего левого угла хиро --- */
/* === fb: хиро /products/ — подложка под текст над слайдером (2026-09-29) ===
   Владелец: «текст не так отображается как в фигме» на /services/.
   Причина: .hero--products .hero-slider имеет z-index:1, а .hero-box:after
   (светлая панель под текст) — z-index:auto, поэтому панель оставалась ПОД
   слайдером и не влияла: бирюзовый H1 ложился на насыщенное фото капсул.
   Канон Figma 1105:13306: панель Rectangle 3975904 731x618 (вся высота блока),
   фото капсул начинается с x=236 (dx=275 от фрейма), подрезка справа 87px.
   Панель 731/1201 = 60.9% ширины -> держим плотной до ~61%, дальше растворяем. */
.hero--products .hero-box:after{z-index:2;height:100%;top:0;bottom:auto;
  background:linear-gradient(90deg,rgba(239,246,249,.97) 0%,rgba(239,246,249,.95) 44%,
    rgba(239,246,249,.86) 55%,rgba(239,246,249,.45) 63%,rgba(239,246,249,0) 74%)}
.hero--products .hero-copy{z-index:3}
.hero--products .hero-slider{position:absolute;inset:0;overflow:hidden;z-index:1}
.hero--products .hero-slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:left center;
  opacity:0;transition:opacity .6s ease}
.hero--products .hero-slide.is-active{opacity:1}
.hero--products .hero-dots{position:absolute;left:16px;bottom:14px;display:flex;gap:6px;z-index:5}
/* 16.09.2026: цвет по канону Figma 1035:13108 — активная #009294, остальные #85BAAF.
   Были белые (rgba(255,255,255,.55)/#fff) — на светлом фоне hero /services/
   (градиент #EAF0FA) их почти не видно. */
.hero-dot{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:#85BAAF;
  cursor:pointer;transition:background .2s ease}
.hero-dot.is-active{background:#009294}
.hero-dot:focus-visible{outline:2px solid #004C59;outline-offset:2px}

/* --- Каталог /services/ + /tools/ ≥1024 (Figma z51MVZ2MBMlTUIZd8SjVUo, Frame 987/1062/1065):
   заголовок 24/26/500 teal + текстовый переключатель (#009294 / #A8B4BD) в .catalogue-head;
   тулбар — ОДНА строка 56: вкладки 354 (белая плашка r16, border #B3DFDF, неактивные
   16/18/500 #809CAF, активная пилюля #009294 r8 padding 12); поиск 839 (r16 #F3F7FA,
   border #B3DFDF, padding 12/8/12/16). Раскладка тулбара — catalogue.css ([data-catalog]).
   Кнопка-переключатель «Оборудование» из тулбара убрана 24.09.2026: в каноне её нет. --- */
.catalogue-title{font-size:24px!important;line-height:26px!important;font-weight:500;color:#009294}
.catalogue-toolbar{grid-template-columns:auto 1fr auto;gap:8px;align-items:center}
.mode-tabs{height:56px;padding:0 10px;gap:12px;border:1px solid #B3DFDF!important;border-radius:16px!important;background:#fff!important;align-items:center}
.mode-tabs button{background:transparent!important;border:0!important;padding:0!important;font-size:16px!important;line-height:18px!important;font-weight:500;color:#809CAF!important}
.mode-tabs button.active{background:#009294!important;color:#fff!important;padding:12px!important;border-radius:8px!important}
.catalogue-toolbar .search-line{height:56px;border:1px solid #B3DFDF!important;border-radius:16px!important;background:#F3F7FA!important;padding:12px 8px 12px 16px}
/* --- Оборудование: карточка с фото и пуш-окно описания (реестр 07.07.2026 + прайс) --- */
.catalogue-item.equipment-item{grid-template-columns:295px minmax(0,1fr) auto;align-items:start;gap:20px}
.equip-media{width:295px}
.equip-photo{width:295px;height:200px;object-fit:contain;background:#fff;border-radius:12px;display:block}
.equip-photo--none{background:linear-gradient(135deg,#eef4f5,#dce9ea)}
.equip-det,.equip-tests{font-size:14px;line-height:18px;color:#7b92a0;margin-bottom:4px}
.catalogue-side .info-btn{justify-self:end;width:32px;height:32px;border-radius:50%;border:1px solid var(--teal);background:#fff;color:var(--teal);font-size:16px;font-weight:600;cursor:pointer}
.catalogue-side .info-btn:hover{background:#e6f5f5}
.fb-modal{border:0;border-radius:24px;padding:0;max-width:min(1040px,92vw);width:100%;box-shadow:0 30px 80px rgba(8,20,27,.35);background:transparent}
.fb-modal::backdrop{background:rgba(8,20,27,.55)}
.fb-modal__in{position:relative;background:#fff;border-radius:24px;padding:0;max-height:86vh;overflow:auto}
.fb-modal__body{padding:32px}
.fb-modal__body:empty{display:none}
/* 25.09.2026: крестик закрытия залипает у верхней кромки при прокрутке окна (был absolute и
   уезжал вместе с контентом). position:sticky+float:right — крестик остаётся в потоке,
   top:14px работает как порог залипания и в покое держит прежние 14px от края окна
   (Chromium меряет sticky от content-box скроллера, поэтому padding окна перенесён на
   .fb-modal__body — см. ниже). Первые блоки контента (.news-modal__head, .fb-req__title,
   .video-modal__cap) уже несут padding-right:48px — обтекание крестика не ломаем. */
.fb-modal__close{position:sticky;float:right;top:14px;margin:0 14px 0 0;width:40px;height:40px;border-radius:50%;border:0;background:#eef4f5;color:#35505d;font-size:24px;line-height:1;cursor:pointer;z-index:2}
.fb-modal__body h3{font-size:24px;line-height:28px;color:var(--teal);margin:10px 0 6px}
.fb-modal__body h4{font-size:18px;line-height:22px;color:#35505d;margin:22px 0 8px}
.equip-modal__grid{display:grid;grid-template-columns:360px minmax(0,1fr);gap:24px;align-items:start}
.equip-modal__media img{width:100%;height:auto;border-radius:16px;background:#f4f8f9}
.equip-modal__man{color:#516977}
.equip-modal__dets{margin:0;padding-left:18px;color:#516977;font-size:15px;line-height:20px}
.equip-modal__tests{width:100%;border-collapse:collapse;font-size:15px}
.equip-modal__tests th,.equip-modal__tests td{text-align:left;padding:10px 12px;border-bottom:1px solid #e2ecee}
.equip-modal__tests th{color:#516977;font-weight:500;background:#f4f8f9}
.equip-modal__note{color:#7b92a0;font-size:14px;line-height:18px;margin-top:14px}
.equip-modal__actions{display:flex;gap:12px;margin-top:22px;align-items:center}
.equip-modal__tablewrap{max-height:min(52vh,560px);overflow:auto;border:1px solid #e2ecee;border-radius:12px}
.equip-modal__tests{border-collapse:separate;border-spacing:0}
.equip-modal__tests thead th{position:sticky;top:0;z-index:1}
.equip-modal__actions{position:sticky;bottom:0;background:#fff;padding:14px 0 6px;margin-top:16px;border-top:1px solid #eef4f5}
/* Испытания в окне «Подробнее»: сначала 12 строк, дальше кнопка «Показать ещё» (владелец 23.09.2026).
   Счётчик и кнопка живут в закреплённой нижней панели окна (.equip-modal__actions): ниже таблицы
   они уезжали за край окна, и добраться до них без прокрутки было нельзя. */
.equip-modal__actions{justify-content:space-between;flex-wrap:wrap;row-gap:10px}
.equip-modal__more-slot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-left:auto}
.equip-modal__count{color:#7b92a0;font-size:14px;line-height:18px}
.equip-modal__more-btn{min-width:190px;justify-content:center}
/* Выпадающие списки в карточке оборудования (детекторы / характеристики / испытания) */
.equip-dd{border:1px solid #dbe8ea;border-radius:12px;background:#f8fbfb;margin:10px 0 0;overflow:hidden}
.equip-dd>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;padding:10px 14px;color:var(--teal);font-size:15px;line-height:20px;font-weight:500;list-style:none}
.equip-dd>summary::-webkit-details-marker{display:none}
.equip-dd>summary .icon{width:16px;height:16px;transition:transform .2s ease}
.equip-dd[open]>summary .icon{transform:rotate(180deg)}
.equip-dd[open]>summary{border-bottom:1px solid #e2ecee;background:#fff}
.equip-dd__list{margin:0;padding:10px 16px 12px 30px;color:#516977;font-size:14px;line-height:19px}
.equip-dd__list li{margin:4px 0}
.equip-dd__term{color:#809caf;font-size:13px;white-space:nowrap}
.equip-dd__more{color:#809caf;list-style:none;margin-left:-14px;font-style:italic}
.equip-dd__dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 14px;margin:0;padding:12px 16px;font-size:14px;line-height:18px}
.equip-dd__dl dt{color:#809caf}.equip-dd__dl dd{margin:0;color:#35505d}
/* Фото оборудования скрыты по просьбе Павла (флаг SHOW_EQUIP_PHOTOS=false в catalogue.js): карточка и окно без фото */
.catalogue-item.equipment-item--nophoto{grid-template-columns:minmax(0,1fr) auto}
.equip-modal__grid--nophoto{grid-template-columns:minmax(0,1fr)}
@media(max-width:1023px){
  .catalogue-item.equipment-item{grid-template-columns:minmax(0,1fr)}
  .equip-media,.equip-photo{width:100%}.equip-photo{height:220px}
  .equip-modal__grid{grid-template-columns:1fr}
  .fb-modal__body{padding:20px}
  .fb-modal__close{margin:0 14px 0 0}
}
/* Оборудование — справочник: выбор приборов убран 18.09.2026 по требованию владельца
   (правила .equip-picked/.pick-btn удалены вместе с кнопкой и полосой выбора).
   Колонка справа больше не держит кнопку выбора — снимаем её резерв 145px,
   иначе в карточке остаётся пустой провал между разделителем и кнопкой «i». */
.catalogue-item.equipment-item .catalogue-side{min-width:0}
/* 24.09.2026: переключатель «Услуги/Оборудование» переехал из тулбара в заголовок текстом
   (канон Frame 1091) — правило кнопки .catalogue-switch (h56 r16 фон #809CAF) удалено,
   стиль ссылки в заголовке задан в catalogue.css. */

/* Кадр один и тот же (капсулы/пилюли), поэтому панорамируем его по-разному: слайды выглядят единообразно,
   но точки работают. Картинка растянута на весь блок — пустых полей слева/справа нет. */
.hero--products .hero-slide:nth-child(1){object-position:38% 50%}
.hero--products .hero-slide:nth-child(2){object-position:52% 50%}
.hero--products .hero-slide:nth-child(3){object-position:64% 48%}
.hero--products .hero-slide:nth-child(4){object-position:30% 52%}
.hero--products .hero-slide:nth-child(5){object-position:58% 55%}
.hero--products .hero-slide:nth-child(6){object-position:72% 50%}
/* 16.09.2026: разрыв подзаголовок->кнопка. Замер: было 0px (кнопка липнет
   к подзаголовку) при каноне Figma 1035:13103 (Frame 788 gap 24). */
.hero--products .hero-copy .btn{margin-top:24px}
@media(min-width:1024px){
  /* 16.09.2026: было left:326px — вычитание 236 было ошибочным (замер: .hero-slider
     absolute inset:0, смещения нет, слайдер = бокс). Точки уезжали влево: центр 365
     при центре бокса 601. Канон Figma 1035:13108 — точки на 562 от бокса 1201, т.е.
     по центру. Центрируем по боксу; bottom 31 = 618-579-8 (канон). */
  .hero--products .hero-dots{left:50%;transform:translateX(-50%);bottom:31px}
}

/* About-хиро: h1 в макете 60px в боксе 893px («Научно-испытательный центр» / «ФАРМОБОРОНА»);
   при базовых 588px первая строка не влезала и заголовок ломался на 3-4 строки. */
.about-hero .hero-copy{max-width:893px}
/* Career-хиро: в макете 637–893px, при 600px «в НИЦ «ФАРМОБОРОНА»» (641px при 52px) не влезала
   и заголовок ломался на три строки. */
.career-hero .hero-copy{max-width:650px}
/* products-хиро (САМЫЙ поздний канон Figma 1105:13306 / 1105:14840): 50px/52px/700 и бокс 688px.
   Без этого правила заголовок ломался на 4 строки. Только в @media(min-width:1024px) —
   иначе специфичность перебила бы мобильные 44/26px (audit-fixes ≤1023/≤767). */
@media(min-width:1024px){section.hero.hero--products .hero-copy h1{font-size:50px;line-height:52px;font-weight:700}}
/* Trust section.
   ВНИМАНИЕ (15.09.2026): правило `.trust-card strong{font-size:32px}` отсюда УБРАНО.
   Оно имело специфичность (0,1,1) и перебивало канонные `.trust-card__num` (60px) и
   `.trust-card__title` (24px) из pages.css — специфичность (0,1,0) — при ЛЮБОМ порядке
   загрузки, поэтому порядком это не лечилось. Из-за него цифры «15 лет/250/400+/970+»
   рисовались 32px, а блок /clients/ был 882 вместо канонных 816 (Figma 1068:13848). */
.trust h2 { font-size:32px; line-height:34px; font-weight:500; margin:0; }
.trust-card h3 { font-size:20px; line-height:22px; font-weight:500; color:#009294; }
.trust-card p { font-size:16px; line-height:18px; color:#85baaf; }
.trust-mini { font-size:16px; }
/* Steps cards white + border */
.step-card { background:#fff !important; border:1px solid #b3dfdf; border-radius:24px; }
/* FAQ section: white bg */
.faq { background:transparent; }
.faq-item button { font-size:20px; line-height:22px; font-weight:500; color:#5a6e7c; }

.hero-search-title{font-size:24px;line-height:26px;font-weight:500;color:#fff;margin:24px 0 12px}

.trust{background:linear-gradient(180deg,#019294 0%,#feffff 100%);border-radius:24px;padding:40px 32px}
.trust .chip{background:#009294;color:#ccf2ea;border-radius:100px;padding:6px 12px;font-size:14px;font-weight:500;line-height:18px}

/* Labs tabs per Figma: horizontal chip row on top, photo below full-width */
.labs-tabs{display:flex;flex-direction:column;gap:24px}
.labs-tabs__nav{display:flex;flex-wrap:wrap;gap:8px}
.labs-tabs__nav button{background:#f3f7fa;border:0;border-radius:12px;padding:16px 24px;font-size:18px;line-height:22px;color:#5a6e7c;cursor:pointer;text-align:left}
.labs-tabs__nav button.active{background:#009294;color:#fff}
.labs-tabs__media img,.labs-tabs__media{border-radius:24px;width:100%}

/* Press-center mobile: 1 card per view (was 3 squeezed) */
@media(max-width:767px){
  /* per Figma mobile: title left, NO arrows, dots, centered outline button below */
  .soft-block--blue .press-head,.soft-block--blue>div:first-child{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
  .soft-block--blue .carousel .nav-arrow{display:none}
  .soft-block--blue .carousel-viewport{width:100%}
  .soft-block--blue .slide{flex:0 0 86%;max-width:86%}
  .soft-block--blue .news-card{min-height:230px}
  .soft-block--blue .news-card a{font-size:16px;text-decoration:underline;text-underline-offset:3px}
  /* «Все новости» по центру под каруселью */
  .soft-block--blue a.all-news{display:block;width:max-content;margin:16px auto 0}
}

/* Services photo-cards: dark gradient, white text (per index_18 services) */
.service-card.photo{background:linear-gradient(180deg,rgba(61,78,93,0) 0%,#3d4e5d 100%),#3d4e5d;color:#fff}
.service-card.photo h3{color:#fff}
.service-card.photo p{color:rgba(255,255,255,.75)}
.service-card.photo .chip{background:rgba(255,255,255,.15);color:#fff}

/* Header icons per Figma index_27: uniform #dae7f0 circles, no borders, grey #5a6e7c glyphs; cart visible */
.header-actions .circle-btn{width:36px;height:36px;border:0;background:#dae7f0;color:#5a6e7c;display:grid;place-items:center}
.header-actions .circle-btn:hover{background:#cfe0ea;color:#5a6e7c}
.header-actions .circle-btn svg,.header-actions .circle-btn .icon{width:16px;height:16px}
/* пустой бейдж счётчика ломает grid-центрирование иконки — скрываем */
.header-actions .circle-btn [data-cart-count]:empty{display:none!important}
.header-actions .circle-btn.cart-open-btn .icon{width:16px;height:16px}
.header-actions .login{border:0;padding:6px 8px;font-size:14px;font-weight:500;color:#272d31}
.header-actions .login svg{width:16px;height:16px;color:#5a6e7c}
.header-actions .login:hover{background:transparent;color:#272d31}
/* Press head: flex row desktop (title left, button right); mobile: button pinned bottom-center */
.soft-block--blue{position:relative}
.soft-block--blue .press-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
@media(max-width:767px){
  .soft-block--blue .press-head{flex-direction:column;align-items:flex-start}
  /* mobile: button visually moved below carousel via order — кнопка остаётся в head, поэтому просто центр под каруселью невозможен без перемещения; делаем кнопку последней в head и центрируем отступом — по макету она ПОД каруселью, для этого на мобиле кнопка absolute низ блока */
  .soft-block--blue .all-news{position:absolute;left:50%;transform:translateX(-50%);bottom:24px;margin:0}
  .soft-block--blue{padding-bottom:96px}
}

/* Mobile carousels: native swipe (touch scroll + snap) — JS drag не реализован */
@media(max-width:767px){
  .soft-block--blue .carousel-viewport,
  .soft-block--blue .carousel .carousel-viewport{overflow-x:auto;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .soft-block--blue .carousel-viewport::-webkit-scrollbar{display:none}
  .soft-block--blue .carousel-track{transform:none!important;scroll-snap-type:x mandatory;display:flex}
  .soft-block--blue .slide{scroll-snap-align:center;flex:0 0 86%}
}
/* Главная news-карусель на мобиле — тоже swipe */
@media(max-width:767px){
  .soft-block .carousel-viewport{overflow-x:auto;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .soft-block .carousel-viewport::-webkit-scrollbar{display:none}
  .soft-block .carousel-track{transform:none!important;scroll-snap-type:x mandatory;display:flex}
  .soft-block .slide{scroll-snap-align:center;flex:0 0 86%}
}

/* Service cards per Figma index_18 */
.service-grid{gap:16px}
.service-card{border-radius:24px;background:#fff;min-height:300px;padding:24px;display:flex;flex-direction:column;gap:24px;position:relative;overflow:hidden}
.service-card .chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:0}
.service-card .chip{display:inline-flex;align-items:center;padding:6px 12px;border-radius:100px;background:#009294;color:#fff;font-size:12px;font-weight:500;white-space:nowrap;text-transform:none}
.service-card .line{height:0;align-self:stretch;border-top:1px solid #009294;opacity:.3}
.service-card h3{font-size:20px;line-height:22px;color:#009294;font-weight:500;margin:0}
.service-card p{font-size:14px;line-height:1.4;color:#77919e;margin:0}
.service-card.photo{color:#fff;background:#31515d;min-height:300px}
.service-card.photo h3,.service-card.photo p{color:#fff}
.teal-block{border-radius:24px;background:linear-gradient(180deg,#019294 0%,#feffff 100%);padding:40px 32px}
.teal-block>.section-title{color:#fff;font-size:32px;font-weight:500}

/* View tabs: Услуги/Оборудование — единый переключатель */
.view-tabs{display:flex;gap:0;border-bottom:2px solid #e0e8ed;margin-bottom:16px}
.view-tabs button{border:0;background:transparent;padding:12px 24px;font-size:16px;font-weight:500;color:#809caf;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .2s}
.view-tabs button.active{color:#009294;border-bottom-color:#009294}
.view-tabs button:hover{color:#009294}
.mode-tabs[data-mode-wrap]{display:flex;gap:8px}
.mode-tabs[data-mode-wrap] button{border:1px solid #d0e0e6;background:#fff;border-radius:100px;padding:6px 16px;font-size:14px;color:#5a6e7c;cursor:pointer}
.mode-tabs[data-mode-wrap] button.active{background:#009294;color:#fff;border-color:#009294}
/* equipment view hidden by default */
.catalogue[data-view="equipment"] .catalogue-list{display:none}
.catalogue[data-view="equipment"] .equipment-list{display:block}
.equipment-list{display:none}

/* Logo: Figma spec 221x36.4 (cropped PNG 517x86, ratio 6.01) */
.logo{width:221px}
@media(max-width:1100px){.site-header .logo{width:190px!important}}
@media(max-width:767px){.site-header .logo{width:170px!important}}

/* Header actions: Figma index_27 — иконки В КРУГАХ 36px #dae7f0, внутри grey #5a6e7c */
.header-actions{gap:16px}
.header-actions .circle-btn{width:36px;height:36px;background:#dae7f0;border:0;border-radius:50%;color:#5a6e7c;display:grid;place-items:center;position:relative}
.header-actions .circle-btn .icon{width:16px;height:16px}
.header-actions .circle-btn:hover{background:#c9dce8;color:#5a6e7c}

/* Hero search: Figma index_21 — непрозрачное поле #f3f7fa, h=54, radius 100px, кнопка-круг 36px #009294 */
.hero-search{background:#f3f7fa;border:0;border-radius:100px;height:54px;padding:0 9px 0 24px;display:flex;align-items:center}
.hero-search input{background:transparent;color:#272d31;font-size:18px;flex:1;min-width:0}
.hero-search input::placeholder{color:#a8b4bd}
.hero-search button{background:#009294;border:0;width:36px;height:36px;border-radius:50%;color:#fff;display:grid;place-items:center;flex:0 0 auto}
.hero-search button svg{width:18px;height:18px}

/* Legal documents — readable layout with proper margins */
/* Legal documents — only when wrapped in .legal-doc (not global main) */
.legal-doc{max-width:820px;margin:0 auto;padding:40px 24px 60px}
.legal-doc h1{font-size:32px;font-weight:500;color:#009294;margin:0 0 24px;line-height:1.2}
.legal-doc h2{font-size:22px;font-weight:600;color:#283137;margin:32px 0 16px;line-height:1.3}
.legal-doc h3{font-size:18px;font-weight:600;color:#283137;margin:24px 0 12px}
.legal-doc p{font-size:15px;line-height:1.65;color:#3a4751;margin:0 0 16px}
.legal-doc ul,.legal-doc ol{font-size:15px;line-height:1.65;color:#3a4751;margin:0 0 16px;padding-left:24px}
.legal-doc li{margin:0 0 8px}
.legal-doc ul{list-style:disc}
.legal-doc ol{list-style:decimal}
.legal-doc strong,.legal-doc b{font-weight:600;color:#283137}
.legal-doc a{color:#009294;text-decoration:underline}
.legal-doc table{width:100%;border-collapse:collapse;margin:0 0 20px;font-size:14px}
.legal-doc th,.legal-doc td{border:1px solid #d0dde4;padding:8px 12px;text-align:left}
.legal-doc th{background:#f3f7fa;font-weight:600}
.legal-doc blockquote{border-left:3px solid #009294;padding:8px 16px;margin:0 0 16px;color:#5a6e7c;font-style:italic}
.legal-doc hr{border:0;border-top:1px solid #e0e8ed;margin:24px 0}
@media(max-width:767px){
  .legal-doc{padding:20px 16px 40px}
  .legal-doc h1{font-size:24px}
  .legal-doc h2{font-size:18px}
  .legal-doc p,.legal-doc ul,.legal-doc ol{font-size:14px}
}

/* Legal documents — template 20 (.page .content-section) */
main.page .section.content-section{max-width:820px!important;margin:0 auto;padding:20px 24px 60px!important}
main.page .content-section h1{font-size:32px;font-weight:500;color:#009294;margin:0 0 24px;line-height:1.2}
main.page .content-section h2{font-size:22px;font-weight:600;color:#283137;margin:32px 0 16px;line-height:1.3}
main.page .content-section h3{font-size:18px;font-weight:600;color:#283137;margin:24px 0 12px}
main.page .content-section p{font-size:15px;line-height:1.65;color:#3a4751;margin:0 0 16px}
main.page .content-section ul,mainmain.page .content-section ol{font-size:15px;line-height:1.65;color:#3a4751;margin:0 0 16px;padding-left:24px}
main.page .content-section li{margin:0 0 8px}
main.page .content-section ul{list-style:disc}
main.page .content-section ol{list-style:decimal}
main.page .content-section strong,main.page .content-section b{font-weight:600;color:#283137}
main.page .content-section a{color:#009294;text-decoration:underline}
main.page .content-section table{width:100%;border-collapse:collapse;margin:0 0 20px;font-size:14px}
main.page .content-section th,main.page .content-section td{border:1px solid #d0dde4;padding:8px 12px;text-align:left}
main.page .content-section th{background:#f3f7fa;font-weight:600}
@media(max-width:767px){
  main.page .content-section{padding:16px 16px 40px!important}
  mainmain.page .content-section h1{font-size:24px}
  mainmain.page .content-section h2{font-size:18px}
  .page .content-section p,main.page .content-section ul,mainmain.page .content-section ol{font-size:14px}
}

/* ================= Catalogue toolbar per Figma index_25/26 (2026-09-03) ================= */
/* Row: selector left, search center, switch-button right; chips wrap below on mobile */
.catalogue-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:22px 0}
.catalogue-toolbar .mode-tabs{border:1px solid #b3dfdf;border-radius:16px;overflow:hidden;display:flex;background:#fff}
.catalogue-toolbar .mode-tabs button{border:0;background:transparent;padding:14px 18px;color:#809caf;font-size:15px;font-weight:500;cursor:pointer;white-space:nowrap;transition:.2s}
.catalogue-toolbar .mode-tabs button + button{border-left:1px solid #e3eef2}
.catalogue-toolbar .mode-tabs button:hover{color:var(--teal)}
.catalogue-toolbar .mode-tabs button.active{background:var(--teal);color:#fff}
.catalogue-toolbar .search-line{flex:1 1 320px;min-width:260px;border:1px solid #b3dfdf;background:#f3f7fa;border-radius:16px;height:56px;padding:0 8px 0 16px}
.catalogue-toolbar .search-line input{font-size:17px;color:#5a6e7c}
.catalogue-toolbar .search-line input::placeholder{color:#a8b4bd}
.catalogue-toolbar .search-line button{width:40px;height:40px}
.catalogue-toolbar .catalogue-switch{height:56px;border-radius:16px;padding:0 26px;font-size:17px;white-space:nowrap}
@media(max-width:900px){.catalogue-toolbar{flex-wrap:wrap}.catalogue-toolbar .search-line{order:3;flex-basis:100%}}
/* Figma chips row (categories under toolbar) */
.category-list{display:flex;flex-wrap:wrap;gap:8px;align-self:start}
.category-list button{border:0;background:#f3f7fa;border-radius:12px;padding:15px 18px;text-align:left;color:#5a6e7c;font-size:15px;cursor:pointer;transition:.2s}
.category-list button:hover{background:#e4eef3;color:var(--teal)}
.category-list button.active{background:#009294;color:#fff}
.category-list button small{opacity:.65;margin-left:4px}
/* Equipment card: detectors dropdown */
.catalogue-item .detectors{margin-top:10px;border:1px solid #009294;border-radius:12px;background:#fff;overflow:hidden}
.catalogue-item .detectors summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;color:#5a6e7c;font-size:15px;cursor:pointer}
.catalogue-item .detectors summary::-webkit-details-marker{display:none}
.catalogue-item .detectors summary .icon{width:12px;height:12px;transition:transform .2s;color:var(--teal)}
.catalogue-item .detectors[open] summary .icon{transform:rotate(180deg)}
.catalogue-item .detectors ul{list-style:none;margin:0;padding:4px 14px 12px;display:grid;gap:8px;color:#5a6e7c;font-size:14px;line-height:1.45}
.catalogue-item .detectors ul li{padding-left:14px;position:relative}
.catalogue-item .detectors ul li:before{content:'';position:absolute;left:0;top:9px;width:5px;height:5px;border-radius:50%;background:var(--teal)}
/* Cart highlight: whole cell stays highlighted while item is in cart */
.catalogue-item{border-radius:12px;transition:background .2s,box-shadow .2s}
.catalogue-item.in-cart{background:#e8f4f2;box-shadow:inset 0 0 0 2px #009294}
.catalogue-item.in-cart .add-btn{background:var(--teal);color:#fff;border-color:var(--teal)}
.catalogue-item.in-cart .add-btn:hover{opacity:.9}
/* detectors: override legacy display:none from catalogue.css — native <details> */
.catalogue-item .detectors{display:block}
.catalogue-item .detectors[open] ul{display:grid}

/* Nav header per Figma index_26: gap 24px between menu items */
.nav{gap:24px}
/* Chevron: flat filled triangle 6x4 like Figma (.drop .icon), not rounded stroke */
.nav-drop__toggle svg{display:none}
.nav-drop__toggle{position:relative}
.nav-drop__toggle:after{content:'';position:absolute;left:50%;top:50%;width:0;height:0;transform:translate(-50%,-30%);border-left:5px solid transparent;border-right:5px solid transparent;border-top:5px solid #272d31;transition:transform .2s}
.nav-drop.open .nav-drop__toggle:after{transform:translate(-50%,-70%) rotate(180deg)}
/* Search icon inside toolbar button: force block centering */
.catalogue-toolbar .search-line button .icon{display:block;margin:auto}

/* search-line: flat #f3f7fa fill, no white gaps, centered teal button (Figma index_26) */
.catalogue-toolbar .search-line{align-items:center;padding:0 6px 0 16px}
.catalogue-toolbar .search-line input{background:transparent;height:100%}
.catalogue-toolbar .search-line button{width:44px;height:44px;flex:0 0 auto;align-self:center}

/* Contacts green card per Figma index_25/26 (contacts block) */
.footer-top .contacts-card{padding:40px;gap:32px;border-radius:24px;width:497px;flex:0 0 auto}
.footer-top .contacts-card h2{font-size:32px;line-height:34px;font-weight:500;margin:0 0 16px}
.foot-org{font-size:16px;line-height:18px;font-weight:500;letter-spacing:0;max-width:417px}
.footer-top .contacts-card > p{font-size:16px;line-height:18px;color:#fff}
.footer-top .contacts-card .foot-org strong{font-size:16px;line-height:18px;font-weight:500;color:#fff}
.footer-top .contacts-card a{font-size:16px;line-height:18px;color:#fff}
.footer-top .contacts-card strong{font-size:16px;line-height:18px;font-weight:500;color:#fff}
@media(max-width:767px){.footer-top .contacts-card{padding:24px}}

/* Benefits section per Figma index_29 — logo+brand centered left, text right */
.benefits-section{padding:0}.benefits{background:#fff!important;border-radius:0;padding:44px 32px 56px;width:min(1264px,calc(100vw - 80px));margin-inline:auto;box-sizing:border-box}
.benefits{display:grid;grid-template-columns:462px 1fr;gap:89px;align-items:center}
.benefits__brand{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;flex:0 0 auto}
.benefits__logo{width:96px;height:96px;max-width:none;object-fit:contain}
.benefits__brand-text{display:flex;flex-direction:column;align-items:center;line-height:1.15;gap:6px}
.benefits__brand-text small{font-size:26px;font-weight:300;color:#009294;text-align:center;white-space:nowrap;letter-spacing:.045em}
.benefits__brand-text strong{font-size:54px;font-weight:700;color:#009294;text-align:center;line-height:1.05}
.benefits__content{display:flex;flex-direction:column;gap:32px;max-width:648px;justify-self:start;width:100%}
.benefits__text{font-size:18px;font-weight:400;line-height:22px;color:#5a6e7c;margin:0;max-width:586px}
.benefits__certs{display:flex;align-items:center;gap:35px;flex-wrap:wrap}
.benefits__cert-item{display:flex;align-items:center;gap:10px}
.benefits__cert-img{height:50px;width:auto;object-fit:contain;filter:grayscale(1);opacity:1}
.benefits__cert-item:first-child .benefits__cert-img{height:50px;width:100px}
.benefits__cert-item:last-child .benefits__cert-img{width:50px;height:50px}
.benefits__cert-text{font-size:9.47px;font-weight:400;line-height:12.313px;color:#a8b4bd;max-width:107px}
.benefits__cert-item:nth-child(2) .benefits__cert-text{font-size:9.47px;font-weight:400;line-height:12.313px;color:#a8b4bd;max-width:80px;text-align:left}
@media(max-width:1024px){.benefits{grid-template-columns:1fr;gap:24px}.benefits__logo{width:300px}.benefits__content{margin-left:0}}
@media(max-width:767px){.benefits__logo{width:220px}.benefits__text{font-size:16px}.benefits__certs{gap:16px}}

/* ===== Homepage per reference screenshot (2026-09-04) ===== */
/* 15-let card: transparent, sage text, outline button — as in reference */
.stats-panel .stat-year{background:transparent}
.stats-panel .stat-year .stat-value{color:#72b8ad;font-weight:600}
.stats-panel .stat-year .stat-text{color:#72b8ad}
.stats-panel .stat-year .btn-outline{background:transparent;border:1px solid #72b8ad;color:#72b8ad}
.stats-panel .stat-year .btn-outline:hover{background:rgba(114,184,173,.12)}
/* Career "250" plate: centered bottom band, glassmorphism, wide — per reference */
.career-banner .career-photo__num{left:24px;right:24px;bottom:24px;padding:22px 32px;gap:14px;align-items:center;justify-content:flex-start;background:rgba(255,255,255,.2);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:24px}
.career-banner .career-photo__num strong{font-size:86px;line-height:.9;font-weight:500}
.career-banner .career-photo__num span{font-size:20px;line-height:22px;max-width:320px;font-weight:500}
@media(max-width:1023px){.career-banner .career-photo__num{padding:20px 28px;border-radius:24px}.career-banner .career-photo__num strong{font-size:64px}.career-banner .career-photo__num span{font-size:12px;max-width:220px}}

/* === Intro responsive (2026-09-04) === */
@media(max-width:1024px){
  .benefits{grid-template-columns:1fr;gap:40px;padding:40px 24px 48px;width:min(1200px,calc(100vw - 48px))}
  .benefits__brand{justify-items:center}
  .benefits__logo{width:clamp(80px,14vw,110px);height:clamp(80px,14vw,110px)}
  .benefits__brand-text small{white-space:normal;text-align:center;font-size:clamp(15px,2.8vw,24px);letter-spacing:.04em;max-width:100%}
  .benefits__brand-text strong{font-size:clamp(30px,6.4vw,52px);text-align:center;line-height:1.08}
  .benefits__content{max-width:640px;justify-self:center}
  .benefits__text{max-width:100%}
  .benefits__certs{flex-wrap:wrap;justify-content:center;gap:24px}
}
@media(max-width:767px){
  .benefits{gap:32px;padding:32px 20px 40px;width:calc(100vw - 32px)}
  .benefits__logo{width:84px;height:84px}
  .benefits__brand-text small{font-size:15px}
  .benefits__brand-text strong{font-size:clamp(28px,8.6vw,36px)}
  .benefits__text{font-size:16px;line-height:22px}
  .benefits__certs{gap:16px}
  .benefits__cert-item{flex-direction:column;align-items:center;text-align:center}
  .benefits__cert-text{text-align:center!important}
}

/* === Press responsive (2026-09-04) === */
@media(max-width:1023px){
  .news-track .slide{flex-basis:calc((100% - 16px)/2)}
  .soft-block--blue .news-card{height:auto;min-height:340px}
  .soft-block--blue .carousel-viewport{margin:0 44px}
}
@media(max-width:767px){
  .news-track .slide{flex-basis:100%}
  .soft-block--blue{padding:28px 16px}
  .soft-block--blue .carousel-viewport{margin:0 36px}
  .soft-block--blue .news-card{padding:20px;min-height:300px}
  .soft-block--blue .section-title{font-size:26px}
}

/* === Contacts/footer responsive (2026-09-04) === */
@media(max-width:1024px){
  .footer-top{grid-template-columns:1fr;gap:20px}
  .footer-top .contacts-card{width:auto;grid-row:auto}
  .labs-card{padding:28px}
  .callback{flex-direction:column;align-items:flex-start;gap:16px}
}
@media(max-width:767px){
  .footer-top{gap:14px}
  .footer-top .contacts-card{padding:24px}
  .labs-card{padding:24px;grid-template-columns:1fr}
  .legal-footer__in{grid-template-columns:1fr;gap:10px;font-size:11px}
}

/* === Stats grid + footer-top + header responsive (2026-09-04 fix2) === */
@media(max-width:1023px){
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .stat-media{grid-column:1/-1}
  .footer-top{grid-template-columns:1fr;gap:16px}
  .footer-top .contacts-card{grid-row:auto;width:auto}
  .site-header .header-actions{gap:10px}
  .site-header .nav{display:none}
}
@media(max-width:767px){
  .stats-grid{grid-template-columns:1fr;gap:12px}
  .stat{padding:20px}
  .stat .stat-value{font-size:44px}
  .callback{flex-direction:column;align-items:flex-start;gap:14px}
  .legal-footer__in{grid-template-columns:1fr}
}

/* === Bottom mobile nav (2026-09-04): был без стилей — svg 1440px === */
.bottom-nav{display:none}
@media(max-width:767px){
  .bottom-nav{display:block;position:fixed;left:0;right:0;bottom:0;z-index:900;
    background:#fff;border-top:1px solid var(--c-ink-100,#e3eaee);box-shadow:0 -4px 14px rgba(44,76,90,.08)}
  .bottom-nav__inner{display:flex;justify-content:space-around;align-items:center;padding:6px 8px calc(6px + env(safe-area-inset-bottom))}
  .bottom-nav__item{display:flex;flex-direction:column;align-items:center;gap:3px;
    text-decoration:none;color:#516977;font-size:10px;padding:4px 10px;border-radius:10px}
  .bottom-nav__item svg{width:22px;height:22px}
  .bottom-nav__label{font-size:10px}
}

/* === Full site type audit fixes (2026-09-04 evening) === */

/* 1. Кнопки: line-height 20px фикс (эталон), не 1.35em */
.btn{line-height:20px}

/* 2. Чипы услуг: 10px/12px 500 (эталон) */
.service-card .chip, .chips .chip{font-size:10px;line-height:12px}

/* 3. Годы истории: эффект масштабирования к центру (эталон index_19) */
.history-years .history-year{font-size:17px}
.history-years .history-year:nth-child(4){font-size:24px}
.history-years .history-year:nth-child(5){font-size:40px;font-weight:500}
.history-years .history-year:nth-child(6){font-size:50px;font-weight:600}
.history-years .history-year:nth-child(7){font-size:60px;font-weight:700}
.history-years .history-year:nth-child(8){font-size:50px;font-weight:600}
.history-years .history-year:nth-child(9){font-size:40px}
.history-years .history-year:nth-child(10){font-size:24px}
.history-years .history-year.active{font-weight:600}
/* active-год (центр) должен быть крупным — сдвигаем логику: JS ставит active на текущий.
   Масштаб применяется по позиции в видимой группе, статические nth — приближение. */

/* 4. Контакты: типографика лабораторий (эталон index_38) */
.contacts-page h2, .labs-head h2{font-size:32px;line-height:34px;font-weight:500}
.lab-col h3{font-size:16px;line-height:18px;font-weight:700;color:#272d31;text-transform:uppercase}
.lab-label{font-size:16px;line-height:18px;font-weight:500;color:#5a6e7c}
.map-link{font-size:14px;line-height:16px;color:#272d31}

/* 5. Остались вопросы (контакты): 24/26 500 */
.callback strong, .callback .callback-title{font-size:24px;line-height:26px;font-weight:500;color:#272d31}

/* 6. Career: perks 24/26 500 (эталон), наставник 18/22, лестница 16/18, заголовки 32 */
.benefit-grid .benefit-item strong, .benefit-grid strong{font-size:24px;line-height:26px;font-weight:500}
.mentor p, .mentor .muted{font-size:18px;line-height:22px}
.career-ladder p{font-size:16px;line-height:18px}
.career-ladder h2, .calculator h2{font-size:32px;line-height:34px;font-weight:500}
.career-prof span, .career-tags span{font-size:14px;line-height:18px;font-weight:500}
.career-intro p{font-size:20px;line-height:22px}

/* 7. Clients: hero-подзаголовок 20/22; лаб-табы 16/18 */
.clients-hero .muted, .clients .hero p{font-size:20px;line-height:22px}
.labs-tabs__nav button{font-size:16px;line-height:18px}

/* 8. Section titles 32px (эталон) для about/news */
.section-title{font-size:32px;line-height:34px}



/* === MOBILE FIXES (2026-09-05): история-линза, пресс-центр, футер, куки === */

/* 1. История: grid item раздувался min-content (1360px) — грузим фикс */
.history-widget>*{min-width:0}
.history-rail{max-width:100%}
@media(max-width:1100px){
  .history-rail{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .history-rail::-webkit-scrollbar{display:none}
  .history-years{gap:14px}
  .history-year{padding:8px 4px}
}

/* 2. Пресс-центр: шапка секции — кнопка под заголовком, не рядом */
@media(max-width:768px){
  .section-header{flex-direction:column;align-items:flex-start;gap:12px}
  .section-header .btn{width:100%;justify-content:center}
  /* новости на мобиле: 1 колонка (эталон).
     Только для списка новостей (.fb-news .news-grid): карусель «Пресс-центра»
     (.news-track) остаётся горизонтальной лентой, иначе карточки складываются в
     столбец выше жёсткой высоты блока (480px) и наезжают на форму обращения. */
  .fb-news .news-grid{grid-template-columns:1fr!important;flex-direction:column}
  .fb-news .news-grid .news-card{flex-basis:100%!important;grid-column:1/-1}
}

/* 3. Футер: колонки в столбик с отступами */
@media(max-width:768px){
  .legal-footer__in{grid-template-columns:1fr!important;gap:18px!important}
  .f-col{min-width:0}
}

/* 4. Куки-баннер: fixed снизу, кнопки в ряд, выше bottom-nav */
.cookie-consent{position:fixed!important;left:0;right:0;bottom:0;z-index:9999;
  display:flex!important;flex-wrap:wrap;gap:8px;align-items:center;
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));margin:0}
.cookie-consent__text{flex:1 1 100%;font-size:13px;line-height:1.45;margin:0}
.cookie-consent button{flex:1 1 auto;min-height:44px;margin:0}

/* === Audit fixes 5 (2026-09-05): каталог services/tools — бейджи кодов по эталону index_27 === */
/* Бейдж кода ОФС/метода: 14/18/500 на teal (эталон .bage).
   24.09.2026 (t_a3f0d542): кегль 14/18 расходился с кадром — в Figma Bage 79×22 даёт текст
   10/12 w500 #fff (Services 1280 1035:13095, инстанс Bage 1019:13050; у прибора бейдж 49×22
   тоже 10/12, Tools 1280 1105:14840). Кегль снят — работает канонное 10/12 из catalogue.css
   (.catalogue-item .code). Здесь остаётся то, ради чего правило заводилось: перенос длинного
   кода внутри строки (max-width + white-space), кегль перебивать больше нечем. */
.catalogue-item .code{font-weight:500;max-width:182px;white-space:normal}
/* Чипы-фильтры каталога: 10/12 (эталон) */
.catalogue-filters .chip, .catalogue .chip{font-size:10px;line-height:12px}

/* === Full audit fixes 2 (2026-09-04 late): остатки === */

/* CTA «Узнать о возможности...»: 20/22 500 #6d8a9f */
.cta-water .muted, .cta-water__copy p{font-size:20px;line-height:22px;font-weight:500;color:#6d8a9f}

/* Карточки услуг: описание 20/22 500 teal (эталон .name — оба абзаца 20px) */
.service-card p{font-size:20px;line-height:22px;font-weight:500;color:var(--teal)}

/* Пресс-центр заголовок 32px */
.soft-block--blue .section-title{font-size:32px;line-height:34px}

/* Форма: подзаголовок 18/22, «Загрузите файл» 18/22 400, чекбоксы 14px */
.form-head p{font-size:18px;line-height:22px;color:#809caf}
.upload strong, .upload .upload-title{font-size:18px;line-height:22px;font-weight:400;color:#272d31}
.checks label, .checks, .form-checks label{font-size:14px;color:#a8b4bd}

/* Лаборатории (about/contacts): lab-label 16/18 500 */
p.lab-label{font-size:16px!important;line-height:18px!important;font-weight:500!important;color:#5a6e7c!important}

/* Header nav: 16/20 400 (эталон header index_50: .txt = 16/20 fw400) */
.site-header .nav a{font-size:16px;line-height:20px;font-weight:400}
.site-header .login{font-size:16px}

/* === Full audit fixes 3: контакты-блоки и nav lh === */

/* nav: line-height 18px (эталон index_50: 16/18? нет — .txt lh=20 у header; у nav-drop 18?) */
/* по index_50: .frame .text .txt {fs16, lh20} — но матчер взял 18 из футерного .txt. */
/* Проверка скрином: nav обычный 16/20. Возвращаю точное соответствие эталону nav: */
.site-header .nav a{line-height:18px}
.site-header .login{font-size:18px}

/* «Испытательные лаборатории» h2 32/34 (about + contacts) */
section h2, .section-title, .labs-card h2, .labs-head h2{font-size:32px!important;line-height:34px!important}
section .cta-water__copy h2, .form-head h2{font-size:40px!important;line-height:42px!important}
/* CTA-баннер и форма-обращение: 40px (эталон index_34) */
.cta-water__copy h2, .form-head h2, .request-form h2{font-size:40px!important;line-height:42px!important}
/* career/awards section-title остаются 32 */

/* «Остались вопросы?» 24/26 500 */
.callback strong{font-size:24px!important;line-height:26px!important;font-weight:500!important}

/* Войти: 18/20 (эталон header) */
.site-header .login{font-size:18px!important;line-height:20px!important}

/* Career perks: 24/26 500 (эталон index_65) */
.benefit-item strong, .benefit-grid strong, .perk-item strong{font-size:24px!important;line-height:26px!important;font-weight:500!important}

/* === Audit fixes 4 (post-test): about mission + cap-title === */
/* Миссия-цитата: 18/22 (эталон index_19 .каждый) */
.about .lead, .mission .lead, p.lead{font-size:18px!important;line-height:22px!important}

/* «Решаем комплексные» cap-title 32/34 (эталон index_19 .решаем... на about = 32) */
.cap-title{font-size:32px!important;line-height:34px!important}

/* main.page .content-section h3 перебивал lab-col/услуги h3 — точечно выше специфичность */
main.page .content-section .lab-col h3{font-size:16px!important;line-height:18px!important;font-weight:700!important;text-transform:uppercase}

/* === Service cards per Figma 1003:11474 — final overrides (2026-09-10) === */
.service-card{gap:12px}
.service-card h3{font-size:20px;line-height:22px;color:#009294;font-weight:500;margin:0}
.service-card p{font-size:14px;line-height:16px;color:#809CAF;margin:0}
.service-card .service-divider,hr.service-divider{width:100%;height:2px;border:0;margin:0;background:#009294;align-self:stretch}
.service-card.photo .card-bottom .service-divider{display:none}
.service-card.photo video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.service-card.photo .chip{background:#85BAAF;color:#fff}
.service-card.photo p{display:none}
.service-card .card-bottom{margin-top:auto;display:flex;flex-direction:column;gap:8px;width:100%;padding:0 20px 20px;box-sizing:border-box;position:relative;z-index:4}
.service-card.photo{justify-content:flex-end;min-height:235px;padding:0}
.service-card.photo .chips{padding:0;margin:0}
.service-card.photo h3{color:#fff;margin-top:0;padding:0}
.service-card.photo:after{content:"";position:absolute;inset:auto 0 0 0;height:200px;background:linear-gradient(180deg,rgba(61,78,93,0) 0%,#3D4E5D 100%);mix-blend-mode:multiply;z-index:3;pointer-events:none}
/* === Footer per Figma 1003:11571 === */
.legal-footer__in{display:flex !important;flex-direction:row !important;justify-content:space-between !important;align-items:flex-start !important;gap:40px !important;grid-template-columns:none !important;padding:24px 0 !important;min-height:80px;box-sizing:border-box}
.legal-footer__company{display:flex;flex-direction:row;gap:40px;align-items:flex-start;font-size:14px;line-height:16px;color:#a8b4bd}
.legal-footer__copyright{display:inline}
.legal-footer__contacts{display:flex;flex-direction:column;gap:8px;font-size:14px;line-height:16px;color:#a8b4bd}
.legal-footer__contacts a{color:#a8b4bd;text-decoration:none}
.legal-footer__contacts a:hover{text-decoration:underline}
.legal-footer .legal-links{display:flex !important;flex-direction:column;gap:8px !important;grid-template-columns:none !important;align-content:flex-start !important}
.legal-footer .legal-links a{display:block;font-size:14px;line-height:16px;color:#a8b4bd;text-decoration:underline;text-underline-offset:2px}
.legal-footer .legal-links a:hover{color:#009294}
@media(max-width:1023px){.legal-footer__in{flex-direction:column !important;gap:16px !important;align-items:flex-start !important}.legal-footer__company{flex-direction:column;gap:8px}}
@media(max-width:767px){.legal-footer__in{flex-direction:column !important;gap:12px !important}}

.service-card .chip{display:inline-flex;align-items:center;min-height:22px;padding:0 10px;border-radius:4px;background:#85BAAF;color:#fff;font-size:10px;line-height:12px;font-weight:500;white-space:nowrap;box-sizing:border-box}

/* === 2026-09-10 canon pass по выгрузке Павла (Figma 602:9821 / 182:4157 + секции 182:4182, 182:4197, 225:3214, 310:5051, 310:4295) ===
   Правило: только добавляем переопределения в конец файла, ничего не удаляем (skill farmoborona-v3-static).
   Геометрия desktop-канона ограничена min-width:1024px, чтобы не ломать мобильный контракт в responsive.css. */

/* --- Numbers: карточка — внутренний gap 24 (Figma Cards: Frame 917 → Txt = 24) --- */
@media(min-width:1024px){.stats-grid>.stat{gap:24px}}
/* --- stat-year: значение/подпись #85BAAF (было #72b8ad), кнопка-аутлайн 252×56 прозрачная (skill 182:4171-4175) --- */
.stats-panel .stat-year .stat-value{color:#85BAAF;font-weight:500}
.stats-panel .stat-year .stat-text{color:#85BAAF}
.stats-panel .stat-year .btn{background:transparent!important;border:1px solid #85BAAF!important;color:#85BAAF!important;width:252px;height:56px;min-height:56px;padding:0 24px;border-radius:100px;font-size:18px;line-height:20px;font-weight:500;white-space:nowrap;align-self:flex-start;justify-content:center}
/* --- Services: сетка gap 8, карточка 278.67×292 pad 24/20 gap 12 (Figma Frame 768/800, Cards) --- */
.service-grid{gap:8px!important}
.service-card{padding:24px 20px;gap:12px}
@media(min-width:1024px){.service-grid .service-card{height:292px;min-height:292px}}
.service-card p{font-weight:400}
/* --- Пресс-центр/новости: карточка 331×300 (Figma News Frame 824 + канон press-center) --- */
@media(min-width:1024px){.soft-block--blue .news-card{height:300px;min-height:300px}}
/* --- Форма: заголовок → подзаголовок 16px (Figma Frame 788 gap 16) --- */
.form-head h2{margin-bottom:16px}
/* --- Career: колонки канона 589 / 604 (Figma Frame 952 / Frame 927) --- */
.career-banner{grid-template-columns:minmax(0,589fr) minmax(0,604fr)}
/* --- Футер (Figma 1003:11571 / 310:4233, references/footer-canon.md): 3 зоны, высота 80, © под названием,
       юр.ссылки в 2 колонки на desktop, 1 колонка ≤767, «Разрешительные документы» удалены из чанка --- */
.legal-footer__in{display:flex!important;flex-direction:row!important;justify-content:space-between!important;align-items:flex-start!important;gap:40px!important;grid-template-columns:none!important;padding:20px 0!important;min-height:80px;box-sizing:border-box}
.legal-footer__company{display:flex!important;flex-direction:column!important;gap:8px!important;font-size:14px;line-height:16px;color:#a8b4bd}
.legal-footer__copyright{display:block}
.legal-footer .legal-links{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px 24px!important;flex-direction:row!important;align-content:flex-start!important;max-width:100%!important}
.legal-footer .legal-links a{display:block;font-size:14px;line-height:16px;color:#a8b4bd;text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
/* --- Контакты подвала (почта → телефон), канон Figma: 8 px между строками
       (Figma z51MVZ2MBMlTUIZd8SjVUo, кадр 1077:13380: Frame 983 gap 8; footer-канон
       Frame 892: почта 16 + 8 + телефон 16 = 40).
   Отступ был объявлен только в более раннем блоке «Footer per Figma 1003:11571» выше
   (.legal-footer__contacts{display:flex;flex-direction:column;gap:8px}), а этот — актуальный —
   блок правит .legal-footer__in и .legal-footer__company, но про контакты молчал: промежуток
   держался «по наследству», и правка того блока могла его схлопнуть. Объявляем явно и с
   приоритетом (base.css/responsive.css тоже пишут .legal-footer__in). Раскладка — колонка на
   всех ширинах, поэтому одно правило закрывает оба брейкпоинта: замер 320…1920 на живом проде
   даёт ровно 8 px (см. docs/handover-20261007-footer-contacts-spacing.md). */
.legal-footer .legal-footer__contacts{display:flex;flex-direction:column;gap:8px!important}
.legal-footer .legal-footer__contacts>a{display:block;margin:0}
@media(max-width:1023px){.legal-footer__in{flex-direction:column!important;gap:16px!important;align-items:flex-start!important}}
@media(max-width:767px){.legal-footer__in{gap:12px!important}.legal-footer .legal-links{grid-template-columns:minmax(0,1fr)!important}}
/* 2 колонки юр.ссылок требуют ≥ 311+24+311 = 646px на зону ссылок. В полосе 1024–1279
   (контейнер 944–1201, раскладка ещё в ряд) ей достаётся 167–295px, и строки
   «Согласие…»/«Условия…» НАЛЕЗАЛИ друг на друга (замер 15.09.2026: перекрытие 1.7px уже
   при 1260, 31.7px при 1200, 119.7px при 1024) — текст читался как «персональныхУданвыхх»
   и обрезался по краю. `nowrap` там не помещается физически, поэтому в этой полосе
   разрешаем перенос внутри колонки: структура канона (2 колонки) сохранена, строки целые.
   Полосы, где канон достижим, не трогаем: ≥1280 — 2 колонки в одну строку (канон 80px),
   ≤1023 — колонка-раскладка, там колонки 310px и перенос не нужен. */
@media(min-width:1024px) and (max-width:1279px){.legal-footer .legal-links a{white-space:normal!important}}
/* --- Контакты: внутренние gap 24 → карточка садится на канонную высоту 626 (min-height в base.css) --- */
@media(min-width:1024px){.footer-top .contacts-card{gap:24px}}

/* --- Контакты/лаборатории/коллбэк по Figma 310:4295 (канонные gap-и и типографика; scope = .footer-top) ---
   Frame 871 (contacts-card 497×626): h2 →40→ Frame 870 (org →16→ email/phone) →32→ Frame 873 (строки gap 24)
   Frame 883 (labs-card 696×504): h2 →8→ labs-sub 18/22 →32→ labs-grid 306
   Frame 888 (callback 696×114): текст 294×66 (24/26 + 4 + 16/18 #272D31) + кнопка 193×56                     */
@media(min-width:1024px){
  .footer-top .contacts-card{gap:0}
  .footer-top .contacts-card h2{margin:0 0 40px}
  .footer-top .contacts-card p{margin:0 0 24px}
  .footer-top .contacts-card p.foot-org{margin-bottom:16px}
  .footer-top .contacts-card p.foot-org+p{margin-bottom:32px}
  .footer-top .contacts-card p:last-child{margin-bottom:0}
  .footer-top .labs-card{gap:0}
  .footer-top .labs-card h2{margin:0 0 8px}
  .footer-top .labs-sub{margin:0 0 32px;font-size:18px;line-height:22px;color:#5A6E7C;max-width:456px}
  .footer-top .callback>div{flex:0 0 294px;width:294px;max-width:294px;line-height:18px}
  .footer-top .callback strong{margin-bottom:4px}
  .footer-top .callback span{font-size:16px;line-height:18px;color:#272D31}
  /* labs-grid: канон Frame 882 gap 16 → колонки 300, labs-card 504 (замер 15.09.2026:
     при gap 28 колонки были 294, карточка 500 — на 4px ниже канона) */
  .footer-top .labs-grid{gap:16px}
}

/* === 2026-09-10 форма «Отправить обращение» по канону Figma (компонент 310:5051;
       страницы 182:4142 Main / 1003:11400 Clients / 392:7446 Career) =========================
   1) красная звёздочка обязательного поля — отдельный элемент 8x21 #F93004 + gap 2 (в плейсхолдере её больше нет)
   2) стрелка селекта — канонный вектор 24x24 (заливка #232222) вместо нативной
   3) блок загрузки: строка (бейдж 48 + заголовок 18/22 + вторая строка 16/18 #5A6E7C) + подпись 12/14 #A8B4BD снизу
   4) сабтайтл с явными переносами (markup), селекты 56px (были 57)                             */
.field-req{position:relative;display:block}
/* Звёздочка обязательного поля — 6-конечная «снежинка» из Figma (узел 63:1931, Inter 16px → глиф 7×7, #F93004).
   Раньше тут был текстовый «*», который рендерился звездой Onest другой формы. */
.field-req>svg.req{width:7px;height:7px;display:block;color:#F93004}
.field-req>.req{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:#F93004;font-size:16px;line-height:20.8px;font-weight:400;font-style:normal;pointer-events:none}
.field-req>.field{padding-left:26px}
select.field{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M10.7708 13.525L9.18691 11.6243L9.18691 11.6243C8.48929 10.7872 8.14049 10.3686 8.13516 10.0151C8.13052 9.70776 8.26746 9.41539 8.50651 9.22221C8.7815 9 9.32635 9 10.4161 9L13.5839 9C14.6736 9 15.2185 9 15.4935 9.22221C15.7325 9.41539 15.8695 9.70776 15.8648 10.0151C15.8595 10.3686 15.5107 10.7872 14.8131 11.6243L14.8131 11.6243L13.2292 13.525L13.2291 13.525C12.807 14.0316 12.596 14.2848 12.3433 14.3772C12.1216 14.4582 11.8784 14.4582 11.6567 14.3772C11.404 14.2848 11.193 14.0316 10.7708 13.525Z' fill='%23232222'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;background-size:24px 24px;height:56px;min-height:56px;box-sizing:border-box;padding-right:56px;line-height:18px}
#apply .upload{flex-direction:column!important;align-items:stretch!important;justify-content:space-between;gap:16px}
.upload-row{display:flex;align-items:center;gap:16px}
.upload-text{display:flex;flex-direction:column;gap:4px;min-width:0}
.upload-text strong{font-size:18px;line-height:22px;font-weight:400;color:#272D31}
.upload-text span{font-size:16px;line-height:18px;color:#5A6E7C}
.upload small{font-size:12px;line-height:14px;color:#A8B4BD;margin:0}

/* --- тех же канонных отступов форма: заголовок→поля 40 (Form frame gap 40), сетка→строка чекбоксов 16 --- */
.form-head{margin-bottom:40px}
form[data-demo-form]{row-gap:16px}
.form-status:empty{display:none}

/* обёртка обязательного поля не должна добавлять baseline-зазор вокруг textarea */
.field-req>.field{display:block;width:100%}

/* ===================================================================================
   10.09.2026 — карточка t_f265c612: /clients/ «Наши лаборатории» (Figma 1068:13934).
   БАГ: фотографии не отображались (img 0x0). Причина: в этом же файле ВЫШЕ лежит старая
   версия блока `.labs-tabs{flex-direction:column}` и она перебивает pages.css; в колонке
   `flex:1 1 0` даёт flex-basis по высоте = 0 → у картинки height:0 при height:382px.
   Канон: ряд nav 418px + фото 775x382 (1201 = 418 + 8 + 775), кнопки 70px pad 24 r12.
   Ниже responsive.css (@media max-width:767px) переводит блок в колонку с фото 240px.
   =================================================================================== */
.labs-tabs{display:flex;flex-direction:row;align-items:stretch;gap:8px;flex-wrap:nowrap}
/* === fb:LABS_GALLERY — полоска фото в блоке «Наши лаборатории» (29.09.2026) ===
   Запрос владельца: «в блоке про лаборатории нет для каждой лаборатории галереи
   с фотографиями». Большой кадр таба + его галерея из ТВ fb2_gallery (3 кадра).
   Стиль — как у блока: радиус 24 (16 на мобильном), акцент #009294, шаг 8.
   На ≤767 блок показывает ленту карточек (.labs-carousel), поэтому полоска скрыта. */
.labs-tabs__stage{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:8px}
.labs-tabs__stage .labs-tabs__img{flex:1 1 auto;min-height:0}
.labs-tabs__thumbs{display:flex;gap:8px}
.labs-thumb{flex:1 1 0;min-width:0;height:96px;padding:0;border:2px solid transparent;
  border-radius:16px;overflow:hidden;background:#F3F7FA;cursor:pointer;
  transition:border-color .2s ease}
.labs-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.labs-thumb:hover{border-color:#85BAAF}
.labs-thumb:focus-visible{outline:2px solid #004C59;outline-offset:2px}
@media (max-width:767px){
  .labs-tabs__thumbs{display:none}
}

.labs-tabs__nav{display:flex;flex-direction:column;flex-wrap:nowrap;gap:8px;flex:0 0 418px;width:418px}
.labs-tabs__nav button{min-height:70px;width:100%;padding:24px;border:0;border-radius:12px;background:#F3F7FA;color:#5A6E7C;font-size:18px;line-height:22px;font-weight:400;text-align:left;box-sizing:border-box;cursor:pointer;white-space:normal}
.labs-tabs__nav button.active{background:#009294;color:#fff}
.labs-tabs__img{flex:1 1 0;min-width:0;height:382px;border-radius:24px;overflow:hidden;position:relative}
.labs-tabs__img img{display:block;width:100%;height:100%;object-fit:cover;border-radius:24px}

/* ===================================================================================
   10.09.2026 — карточки t_b8d9e210 / t_2323805b / t_be8c32fb / t_d440b659
   (главная: шапка, награды, кнопки услуг и CTA).
   1) .awards-head .btn: в этом файле ниже лежит legacy-reset `.btn{...border:none...}` —
      он (та же специфичность, но позже base.css) убивал обводку кнопки «Все награды».
      Канон Figma 182:4213: Button 114x36, pad 10/14, r100, stroke 1px #009294, текст 14/16/500 #009294.
   2) «Все услуги» / «Отправить заявку»: фикс-ширина box-sizing:border-box + border 1px оставляла
      контенту 95/155px при ширине текста 96.3/156.6 → текст переносился на 2 строки.
      Фикс: nowrap + width:auto при min-width по канону (145 / 205).
   3) «Войти»: иконка (figma-user.png) #009294, текст был #272D31 — красим текст в цвет иконки.
   =================================================================================== */
.awards-head .btn{border:1px solid #009294;min-height:36px;height:36px;padding:0 14px;font-size:14px;line-height:16px;font-weight:500;background:transparent;color:#009294}
.teal-block .btn{width:auto;min-width:145px;white-space:nowrap}
.cta-water .btn{width:auto;min-width:205px;white-space:nowrap}
.awards-head .btn,.career-copy .btn,.form-actions .btn,.soft-block--blue .btn,.cabinet-copy .btn{white-space:nowrap}
.site-header .login,.site-header .login span{color:#009294}

/* ===================================================================================
   10.09.2026 — вторая партия: /about/ и /clients/ (карточки t_f3e61096, t_0108b4c7,
   t_9b09f6e9, t_5f6f6b28, t_627259f8, t_aeda0ab7).
   Причина почти всех расхождений — «кувалда» ниже по файлу:
   `section h2, .section-title, ... {font-size:32px!important;line-height:34px!important}`
   (она же перебивает 24/26 у .services-block__title и 40/42 у «Будьте уверены»),
   плюс `p.lead{font-size:18px!important}` — он ломал лид «Нашей миссии» (канон 24/26).
   Каноны: 975:12852 (миссия), 975:12883 (решаем комплексные), 989:11529 (Меркурий),
   1003:11402 (хиро клиентов), 1003:11567 («Будьте уверены»), 1003:11555 (FAQ).
   =================================================================================== */

/* --- 1) /about/ Меркурий (989:11529): большая рамка 436x340 + три карточки 239x460 в РЯД --- */
.mercury-grid{display:flex!important;flex-direction:row;align-items:flex-start;gap:32px}
.mercury-placeholder{flex:0 0 436px;width:436px;height:340px;border-radius:24px;background:#eef4f7}
.mercury-awards{display:flex;flex-direction:row;gap:8px;flex:1 1 0;min-width:0}
.mercury-card{display:flex;flex-direction:column;gap:16px;width:239px;flex:0 0 239px}
.mercury-card img{width:239px;height:340px;object-fit:cover;border-radius:16px}
.mercury-card__body{display:flex;flex-direction:column;gap:10px;padding:0 8px}
.mercury-card__body p{font-size:16px;line-height:18px;color:#272d31;max-width:none;margin:0}
.mercury-badges{display:flex;gap:4px;align-items:center}
@media(max-width:1023px){
  .mercury-grid{flex-direction:column;gap:24px}
  .mercury-placeholder{width:100%;flex:0 0 auto;height:240px}
  .mercury-awards{width:100%;flex:0 0 auto;height:auto;overflow-x:auto;padding-bottom:4px}
}

/* === Соразмерность блока «Наша миссия» на широком экране (заявка владельца 07.10.2026) =========
   Кадр 975:12852 нарисован для канвы 1200: блок 1201 = пад 60/101 + фото 394 + gap 60 + колонка 545.
   На мониторе 1440 контейнер оставался 1201, и блок выглядел мелко («в фигме он сделан для 1200,
   а я смотрю на 1440»). Масштаб = тот же коэффициент, что даёт контейнер сайта:
   k = min(1440px, 100vw − 80px) / 1201, поэтому пропорции кадра держатся на любой ширине
   (замер 1301 → фото 400; 1366 → 422; 1440 → 446; 1920 → 472 при кадровых 394).
   Ниже 1301 не трогаем — там свои кадры: 1280 (блок 1201), 1024 (944), 375 (343).
   Полосу расширяем ТОЛЬКО на страницах с блоком миссии (:has(#mission)), остальные страницы не трогаем. */
@media(min-width:1301px){
  body:has(#mission) .container{width:min(1440px,calc(100% - 80px))}
  .container.mission{--mk:min(1440px,100vw - 80px);
    grid-template-columns:calc(0.328*var(--mk)) minmax(0,1fr);
    gap:calc(0.04996*var(--mk));
    padding:calc(0.04996*var(--mk)) calc(0.0841*var(--mk))}
  #mission>img{width:calc(0.328*var(--mk));max-width:calc(0.328*var(--mk));height:calc(0.328*var(--mk))}
  #mission img.quote-mark{width:calc(0.04496*var(--mk));max-width:calc(0.04496*var(--mk));height:calc(0.0383*var(--mk))}
  /* body-префикс: у .lead/.muted ниже по файлу стоят одноимённые правила с !important (аудит-пакет),
     при равной специфичности побеждал поздний — кегль оставался 24/18 вместо кадровых ×k. */
  body #mission h2{font-size:calc(0.02664*var(--mk))!important;line-height:calc(0.02831*var(--mk))!important}
  body #mission .lead{font-size:calc(0.01998*var(--mk))!important;line-height:calc(0.02165*var(--mk))!important;max-width:calc(0.4538*var(--mk))!important}
  body #mission .muted{font-size:calc(0.01499*var(--mk))!important;line-height:calc(0.01832*var(--mk))!important}
}

/* --- 2) /about/ «Наша миссия» (975:12852): рамка 1201, фото 394, колонка 545, лид 24/26/500 --- */
.mission{max-width:none;grid-template-columns:394px 1fr;gap:60px;padding:60px 101px;align-items:stretch}
/* Канон Figma 975:12854 (About 1280): колонка текста растянута до высоты фото (394px),
   h2 «Наша миссия» вверху колонки, блок кавычка+цитата+подпись прижат к низу,
   зазоры 16 (кавычка→цитата) и 24 (цитата→подпись). Раньше align-items:center
   центрировал короткий блок и h2 уезжал на 51px ниже макета. */
.mission>div{display:flex;flex-direction:column;min-width:0}
.mission h2{margin:0 0 auto}
.mission .quote-mark{margin:0 0 16px}
.mission .lead{margin:0}
.mission .muted{margin:24px 0 0}
.mission img{max-width:394px;height:394px;border-radius:24px}
#mission .lead,.mission .lead{font-size:24px!important;line-height:26px!important;font-weight:500!important;color:#5a6e7c;max-width:545px}
.mission .muted{font-size:18px;line-height:22px;font-weight:400;color:#5a6e7c;text-transform:none}

/* --- 3) /about/ «Решаем комплексные...» (975:12883): заголовок 24/26, не 32/34 --- */
.services-block__title{font-size:24px!important;line-height:26px!important;font-weight:500;max-width:464px}

/* --- 4) /clients/ хиро (1003:11402): заголовок 50/52/700, подзаголовок 20/22/500 --- */
@media(min-width:768px){
  section.hero.clients-page-hero .hero-copy h1{font-size:50px;line-height:52px;font-weight:700}
  section.hero.clients-page-hero .hero-copy p{font-size:20px;line-height:22px;font-weight:500}
  /* Боксы из макета 1003:11402: h1 — нода 866px, подзаголовок — 637px. При базовых 588px
     строка «Мы рады предложить вам услуги» не влезала и заголовок распадался на 6 строк,
     вылезая из hero-box. */
  section.hero.clients-page-hero .hero-copy{max-width:866px}
  section.hero.clients-page-hero .hero-copy p{max-width:637px}
}

/* --- 5) /clients/ «Будьте уверены...» (1003:11567): заголовок 40/42/500, блок 588 --- */
section.center .title{font-size:40px!important;line-height:42px!important;font-weight:500!important}
section.center .container{max-width:588px}

/* --- 6) /clients/ FAQ (1003:11555): сетка gap 8, ячейка r24 pad 24, вопрос 20/22/500 --- */
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:start}
.faq-item{border-radius:24px}
.faq-item button{padding:24px;gap:24px;align-items:flex-start}
.faq-answer{padding:0 24px 24px}

/* --- 7) /clients/ «Личный кабинет» (1003:11510): карточка 497 + фото 697 gap 8, список 18/22 #809CAF --- */
.cabinet{grid-template-columns:497px 1fr;gap:8px}
.cabinet-copy{padding:32px;background:#fff;border-radius:24px}
.cabinet-copy h2{font-size:32px!important;line-height:34px!important;font-weight:500;color:#009294}
.cabinet-copy ul{display:flex;flex-direction:column;gap:0;margin:0 0 24px;padding:0;list-style:none}
.cabinet-copy li{color:#809caf;font-size:18px;line-height:22px;font-weight:400;margin:0}
@media(max-width:1023px){.cabinet{grid-template-columns:1fr}.cabinet-copy{padding:24px;background:#fff;border-radius:24px}}
/* медиа-часть в макете 697x464 — ровно высота блока, а не 340px из pages.css (из-за этого
   «фото меньше левого блока» и кнопка казалась ниже) */
@media(min-width:1024px){.cabinet>video,.cabinet>img{height:464px;min-height:464px;object-fit:cover;border-radius:24px}}
/* height:100% тут не работает: grid-строка растягивается по интринсик-размеру видео
   (блок раздувался до 1044px) — поэтому жёстко 464px как в макете. */

/* --- 8) FAQ-иконка по канону 1003:11555: круг 48x48 #85BAAF, белый плюс 24x24, при открытии — поворот 45° --- */
.faq-item button:after{content:'';flex:0 0 48px;width:48px;height:48px;border-radius:50%;background-color:#85BAAF;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><rect x='11' y='0' width='2' height='24' rx='1' fill='white'/><rect x='0' y='11' width='24' height='2' rx='1' fill='white'/></svg>");
  background-repeat:no-repeat;background-position:center;background-size:24px 24px;transition:transform .2s ease,background-color .2s ease;
  font-size:0;color:transparent;display:block}
.faq-item.open button:after{background-color:#009294;transform:rotate(45deg)}
.faq-item button{color:#5a6e7c}
.faq-answer{font-size:16px;line-height:18px;color:#5a6e7c}

/* --- 9) «Этапы сотрудничества» /clients/ (1003:11538): ячейки закрашены #F3F7FA, стрелки убраны,
       прокрутка — нативный рейл (свайп) + перетаскивание мышью + клавиатура --- */
.steps .steps-nav{display:none}
.steps-viewport{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;cursor:grab;padding-bottom:2px}
.steps-viewport::-webkit-scrollbar{display:none}
.steps-viewport.is-dragging{cursor:grabbing;scroll-snap-type:none}
.steps-viewport:focus-visible{outline:2px solid #009294;outline-offset:4px;border-radius:24px}
.steps-track{transform:none!important}
.step-card{background:#F3F7FA!important;border:1px solid #B3DFDF;border-radius:24px;padding:24px;flex:0 0 394px;width:394px;min-height:206px;scroll-snap-align:start;display:flex;flex-direction:column;gap:16px}
.step-card h3{font-size:20px;line-height:22px;font-weight:500;color:#272D31;margin:0}
.step-card p{font-size:16px;line-height:18px;color:#5A6E7C;margin:0}
.step-card__num{width:38px;height:38px;border-radius:50%;background:#009294;color:#fff;display:grid;place-items:center;font-size:18px;font-weight:500}
@media(max-width:767px){.step-card{flex:0 0 86%;width:86%;min-height:auto}}


/* --- 9) МОБИЛЬНЫЙ ХИРО (найдено 10.09 при финальной проверке): правило
   `section.hero .hero-copy h1{font-size:60px}` (audit-fixes, специфичность 0,2,2)
   перебивало responsive.css (`.hero-copy h1{44px}` ≤1023 и `.hero h1{26px}` ≤767) на ВСЕХ
   страницах → на 375 заголовок 60/62 давал 186-496px высоты в блоке hero-box 215px
   и обрезался (overflow:hidden). Возвращаю замысел responsive.css.
   Десктопный канон (50/52/700 для /clients/) объявлен выше и не затрагивается. --- */
@media(min-width:768px) and (max-width:1023px){
  section.hero .hero-copy h1{font-size:44px;line-height:46px}
}
@media(max-width:767px){
  section.hero .hero-copy h1{font-size:26px;line-height:28px}
}


/* --- 10) /clients/ хиро на телефоне: контент (заголовок + подзаголовок + поиск) не влезал
   в hero-box 215px — .hero-copy absolute bottom:20px уходил на -237px выше бокса (заголовок
   вылезал за пределы hero). На ≤767 переводим копирайт в поток, бокс — по высоте контента. --- */
@media(max-width:767px){
  /* canon 1255:18636: hero 343×400 — Txt 250 (h1 24/26 + p 14/16) + поиск 80,
     отступы кадра дают 400 (content ≈330 + padding ≈70). */
  .clients-page-hero .hero-box{height:400px}
}

/* --- 11) /clients/ ЛК @375 (кадр 1255:18714 = 343×699): заголовок 24/26 (две строки = 52),
   медиа 343×285 r16, текстовый блок 343×322 (список 18/22 + кнопка 197×56).
   Порядок в кадре: заголовок → медиа → список+кнопка. В HTML порядок статичный
   (cabinet-copy[h2,ul,a] → video), поэтому переводим .cabinet в flex-direction:column,
   а .cabinet-copy в display:contents чтобы её дети (h2, ul, a) встали в поток .cabinet
   между собой, а видео получило order:2 (после h2). --- */
@media(max-width:767px){
  .cabinet{display:flex;flex-direction:column;gap:0}
  .cabinet-copy{display:contents}
  .cabinet-copy h2{font-size:24px!important;line-height:26px!important;margin:0 0 16px;order:0}
  .cabinet-copy ul{margin:0 0 24px;order:3}
  .cabinet-copy li{font-size:18px;line-height:22px}
  .cabinet-copy .btn{width:197px;min-width:0;height:56px;order:4}
  .cabinet>video,.cabinet>img{order:1;width:100%;height:285px;min-height:285px;object-fit:cover;border-radius:24px;margin:0 0 24px}
}


/* ===================================================================================
   10.09.2026 (партия 3) — блоки, по которым Павел задал «особые вопросы»:
   FAQ (1003:11555), Этапы сотрудничества (1068:13964/1003:11538), Меркурий (989:11529).
   =================================================================================== */

/* --- FAQ: у блока по канону есть плашка-контейнер с градиентом #CDE3DE -> #FDFDFD,
   r24, поля 40/32 (в audit-fixes ниже по файлу было `.faq{background:transparent}`) --- */
.faq{background:linear-gradient(180deg,#CDE3DE 0%,#FDFDFD 100%);border-radius:24px;padding:40px 32px}
.faq h2{color:#009294;font-size:32px;line-height:34px;font-weight:500;margin:0 0 40px}
.faq-grid{gap:8px;grid-auto-rows:1fr}
.faq-item button{align-items:center;gap:24px;padding:24px}
/* иконка канон: круг 48x48 #85BAAF, знак + (белый), при раскрытии знак меняется на −,
   цвет круга НЕ меняется и поворота нет (в Figma + и − одного цвета) */
.faq-item.open button:after{background-color:#85BAAF;transform:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24'><rect x='0' y='11' width='24' height='2' rx='1' fill='%23FFFFFF'/></svg>")}

/* --- Этапы сотрудничества: канон 1068:13964 — карточка 394x206, поля 24, r24, фон #F3F7FA,
   рамка #B3DFDF; номер — квадратная плашка 52x52 r8 #009294 В ОДНОЙ СТРОКЕ с заголовком
   (20/22/500 #009294), описание ниже 16/18/400 #5A6E7C.
   t_38a5b510: десктоп-карусель ≥1280 — тут; <1280 — вертикальный стек в responsive.css --- */
@media(min-width:1280px){
.steps .step-card{display:grid;grid-template-columns:52px 1fr;grid-auto-rows:auto;gap:16px;padding:24px;border-radius:24px;background:#F3F7FA!important;border:1px solid #B3DFDF;align-content:start;flex:0 0 394px;width:394px;min-height:206px}
.steps .step-card__num{grid-column:1;grid-row:1;width:52px;height:52px;border-radius:8px;background:#009294;color:#fff;font-size:40px;line-height:52px;font-weight:400;display:grid;place-items:center;margin:0}
.steps .step-card h3{grid-column:2;grid-row:1;align-self:center;margin:0;font-size:20px;line-height:22px;font-weight:500;color:#009294}
.steps .step-card p{grid-column:1 / -1;grid-row:2;margin:0;font-size:16px;line-height:18px;font-weight:400;color:#5A6E7C}
}

/* --- Меркурий: пустая рамка 436x340 по канону залита #DAEFEC (было #EEF4F7) --- */
.mercury-placeholder{background:#DAEFEC}


/* --- 11) Форма: звёздочка обязательного поля у textarea «Сообщение» стояла по центру
   (top:50%) и визуально «уезжала» в середину/низ большого поля — по канону 310:5051 она
   в одну строку с плейсхолдером, т.е. у верхней кромки. + красные звёздочки у чекбоксов. --- */
.field-req:has(> textarea)>.req{top:22px;transform:none}
.checks .req--inline{position:static;left:auto;top:auto;transform:none;color:#F93004;font-style:normal;font-size:16px;line-height:20px;margin-left:1px}


/* --- 12) /career/ хиро на телефоне: копирайт-блок выше бокса (top:-8px) и заголовок
   подрезался overflow:hidden — увеличиваем бокс на мобиле, чтобы контент помещался --- */
@media(max-width:767px){section.hero.career-hero .hero-box{height:440px}}


/* --- 13) Форма «Отправить обращение»: на широких экранах был «разрыв» между колонками.
   Причина: base.css задаёт `#apply .form-grid{grid-template-columns:1fr 1.4fr}`, а левая колонка
   жёстко `width:497px` — на контейнере 1440 (мониторы >=1441) трек 1fr = 596px, а поля 497px →
   108px пустоты. Канон: 182:4142 (контейнер 1201) = 497 + 8 + 696; 444:12041 (контейнер 1440,
   padL/R 100) = 497 + 8 + 735, т.е. левая колонка всегда 497, правая занимает остаток. --- */
/* правка 10.09 (Павел): форма должна быть ТОЙ ЖЕ ширины, что и остальные блоки, и адаптивной:
   левая колонка больше не фиксирована 497px (это и давало «разрыв»), колонки — 1fr / 1.4fr,
   на 1201 это ровно канонные 497 + 8 + 696, на 1440+ тянутся на всю ширину контейнера. */
#apply .form-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr)}
#apply .form-grid>.form-stack:first-child{width:auto;min-width:0}
#apply .form-grid>.form-stack:last-child{width:auto;min-width:0}


/* ===================================================================================
   10.09.2026 (мобильный аудит всего сайта, 150 страниц @375) — системные находки:
   (1) .crumbs>.crumb-active не был ограничен по ширине → длинный заголовок новости вылезал
       на 1191px и обрезался без многоточия (92 страницы); (2) таблицы в статьях и юр.документах
       (410/379px при вьюпорте 375) обрезались без возможности прокрутки; (3) .mobile-accordion p
       было 10px — нечитаемо на телефоне (145 страниц).
   --- */
.crumbs>.crumb-active{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}

.news-detail table,.content-section table,.legal-doc table,.legal-doc__table,main.page table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}

@media(max-width:767px){
  /* responsive.css задаёт .mobile-accordion p{font-size:10px} и грузится ПОЗЖЕ — перебиваем !important */
  .mobile-accordion p{font-size:13px!important;line-height:18px!important}
  .mobile-accordion summary{font-size:14px;line-height:18px}
  /* таблицы в контенте (новости, юр.документы, каталог) — прокрутка вместо обрезки */
  main table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
}

/* --- 13) /services/ и /tools/ на телефоне: табы mode-tabs обрезались (overflow:hidden), а длинные
   названия категорий (до 663px) вылезали за вьюпорт, т.к. .category-list{flex-wrap:wrap} из audit-fixes
   перебивает прокрутку из catalogue.css --- */
@media(max-width:767px){
  .mode-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .mode-tabs::-webkit-scrollbar{display:none}
  .mode-tabs button{padding:12px 14px;font-size:14px}
  .category-list button{max-width:100%;white-space:normal;text-align:left}
}

/* ===================================================================================
   10.09.2026 — стрелки выпадающих меню в шапке (жалоба Павла: «в фигме немного выше»).
   Канон (dev-mode дамп 310:4649, Frame 814): бокс «Drop down» 10x10 в строке 20px, глиф
   Icon 6x4 по центру (left calc(50% - 3px), top calc(50% - 2px)). Живой был 10x5 (border 5px)
   и по вертикали с translate(-50%,-30%) → центр глифа на 1px НИЖЕ центра текста и шире канона.
   --- */
.nav-drop__toggle{width:10px;height:10px;min-width:10px;padding:0;display:grid;place-items:center;overflow:visible}
.nav-drop__toggle:after{position:absolute;left:50%;top:50%;width:0;height:0;transform:translate(-50%,-50%);border-left:3px solid transparent;border-right:3px solid transparent;border-top:4px solid #272D31}
.nav-drop.open .nav-drop__toggle:after{transform:translate(-50%,-50%) rotate(180deg)}

/* --- 14) остатки мобильного аудита (150 стр. @375, второй прогон): --- */
@media(max-width:767px){
  /* .catalogue-toolbar .mode-tabs (специфичность 0,2,0) перебивал мой .mode-tabs — табы
     «Все услуги / По методу / По показателю» обрезались (scrollW 393 > 341) */
  .catalogue-toolbar .mode-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .catalogue-toolbar .mode-tabs::-webkit-scrollbar{display:none}
  .catalogue-toolbar .mode-tabs button{padding:12px 14px;font-size:14px}
  /* теги вакансий на «Карьере» были 9px (responsive.css) — подняли до десктопных 12px */
  section.career-hero .career-tags span{font-size:12px;line-height:16px;padding:8px 12px}
  /* длинные URL в текстах новостей вылезали за вьюпорт (440px) — переносим */
  .news-detail a, .content-section a, main p a{overflow-wrap:anywhere;word-break:break-word}
}
/* --- /career/ хиро: канон Figma `Career_1280` 392:7468 (11.09.2026 брали СКРЫТЫЙ инстанс
   392:7448 с 40/42 w500 — исправлено 15.09.2026) -------------------------------------
   H1 50/52 w700 #fff (бокс 637x104), подзаголовок 20/22 w500 (637x80); теги — белые плашки
   r8 pad 8x16, 16/28 w500 #009294, ряды 4+3 (контейнер 474); кнопка «Все вакансии на hh.ru»
   без заливки: рамка 1px #fff, r100, h56. Копирайт-блок прижат к низу бокса на 48px и стоит
   слева 48px (Figma 426:6237 = Frame 1002 637x436 в боксе 1201x618). Планшет 1024 (550:12042)
   — те же кегли, копирайт 458 (абзац в 5 строк).
   375 — ОТДЕЛЬНЫЙ канон (560:11522): H1 24/26, подзаголовок 14/16, зазор h1→p 8px; тегов и
   кнопки в макете нет, бокс 320 (в более новой ревизии 560:12808 бокс 215 и кнопка есть).
   Структуру мобильного хиро (скрывать ли теги/кнопку) без решения владельца не меняем. --- */
@media(min-width:1024px){
  section.hero.career-hero .hero-box{height:618px}
  section.hero.career-hero .hero-copy{left:48px;top:auto;bottom:48px;max-width:637px}
  section.hero.career-hero .hero-copy h1{font-size:50px;line-height:52px;font-weight:700;margin-bottom:16px}
  section.hero.career-hero .hero-copy p{font-size:20px;line-height:22px;font-weight:500;margin-bottom:0}
  /* зазор до тегов 52, а не канонные 60: у абзаца в браузере полная строка 22px, а в Figma
     leadingTrim=CAP_HEIGHT обрезает бокс до 4*20=80 — лишние 8px уже в самом абзаце. */
  section.hero.career-hero .career-tags{gap:8px;margin-top:52px;max-width:474px}
  section.hero.career-hero .career-tags+div{margin-top:24px!important}
}
section.hero.career-hero .career-tags span{background:#fff;color:#009294;border-radius:8px;padding:8px 16px;font-size:16px;line-height:28px;font-weight:500}
section.hero.career-hero .btn-secondary{background:transparent;color:#fff;border:1px solid #fff;border-radius:100px;min-height:56px;padding:0 24px;font-size:18px;line-height:20px;font-weight:500;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
@media(max-width:767px){
  section.hero.career-hero .hero-copy{max-width:100%}
  /* FB2-канон 560:11527: Frame 788 = 52 + 8 + 96, т.е. зазор h1→p 8px, а не 16.
     fb-canon-20260914.css держит `.hero-copy h1{margin-bottom:16px!important}` — перебиваем
     специфичностью селектора (0,2,2 против 0,1,1), оба с !important. */
  section.hero.career-hero .hero-copy h1{font-size:24px;line-height:26px;margin-bottom:8px!important}
  section.hero.career-hero .hero-copy p{font-size:14px;line-height:16px;margin-bottom:14px}
  section.hero.career-hero .career-tags{margin-top:14px}
  section.hero.career-hero .career-tags span{font-size:12px;line-height:20px;padding:6px 10px;border-radius:8px}
  section.hero.career-hero .career-tags+div{margin-top:16px!important}
  section.hero.career-hero .btn-secondary{min-height:44px;padding:0 20px;font-size:14px;line-height:16px}
}

/* --- /career/: «Защищаем жизнь» (392:7492) и «Что вы получаете» (392:7499) ----------
   Заголовок сообщения 40/42 в боксе 727, кнопка видео — залитая teal, 56px.
   Контейнер преимуществ: градиент #CDE3DE → белый, радиус 24, паддинги 32/40;
   карточки белые, иконка 32 справа от заголовка, заголовок 24/26, текст 16/18. */
section.career-message{padding:60px 0}
/* Глобальный канон section h2 (32/34) идёт с !important, здесь он локально переопределяется:
   в макете 392:7492 заголовок этого блока 40/42 в боксе 727. */
section.career-message h2{font-size:40px!important;line-height:42px!important;font-weight:500;max-width:727px;margin:0 auto}
/* канон Frame 989 = 334 = 60 + h2 126 + 32 (gap) + кнопка 56 + 60. Зазор 32 задаём кнопке:
   в разметке это соседние блоки одного контейнера, отдельного «спейсера» нет. */
section.career-message .btn-primary{margin-top:32px;background:#009294;color:#fff;border:1px solid #009294;border-radius:100px;min-height:56px;padding:0 24px;font-size:18px;line-height:20px;font-weight:500}
/* канон Numbers 392:7499 = 612 = 40 + h2 68 + 32 + сетка 432 + 40; карточки 130/156/130:
   Cards pad 24/24/32 (нижний паддинг больше верхнего на 8) */
.container.career-benefits{background:linear-gradient(180deg,#CDE3DE,#fff);border-radius:24px;padding:40px 32px}
.benefit-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.benefit{background:#fff;border-radius:16px;padding:24px 24px 32px;display:block;align-items:flex-start;color:#009294}
.benefit-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.benefit-title{display:flex;flex-direction:column;gap:8px;min-width:0}
.benefit-icon{width:40px;height:40px;display:block}
.benefit-head h3{margin:0;font-size:24px;line-height:26px;font-weight:500;color:#009294}
/* Кнопка раскрытия — круглая плашка teal с белым плюсом (в макете 392:7499: 32x32, Ellipse+Union) */
.benefit .benefit-toggle{position:relative;flex:0 0 32px;width:32px;height:32px;padding:0;margin:0;cursor:pointer;
  background:#009294;border:0;border-radius:50%;color:#fff}
.benefit .benefit-toggle::before,.benefit .benefit-toggle::after{content:'';position:absolute;background:#fff;border-radius:1px}
.benefit .benefit-toggle::before{left:50%;top:9px;width:2px;height:14px;margin-left:-1px}
.benefit .benefit-toggle::after{top:50%;left:9px;height:2px;width:14px;margin-top:-1px}
.benefit .benefit-toggle:hover{opacity:.85}
.benefit.open .benefit-toggle{transform:rotate(45deg)}
/* Обычное состояние — как в макете: только заголовок и иконка. Текст раскрывается по нажатию. */
.benefit-detail{display:none}
.benefit.open .benefit-detail{display:block}
.benefit-detail p{margin:12px 0 0;font-size:16px;line-height:18px;font-weight:400;color:#516977;max-width:492px}
@media(max-width:767px){
  /* FB2-канон 375 (560:11533): pad-top 40, без нижнего паддинга, gap 32 (40 + h2 104 + 32 +
     кнопка 56 = 232). Заголовок 24/26: десктопное правило выше идёт с !important, поэтому
     мобильное переопределение тоже обязано быть с !important (иначе 40/42 → 420px). */
  section.career-message{padding:40px 0 0}
  section.career-message h2{font-size:24px!important;line-height:26px!important;max-width:100%}
  section.career-message .btn-primary{margin-top:32px;min-height:56px;font-size:18px;line-height:20px;padding:0 24px}
  /* Numbers 375 (560:11539) = 798 = 24 + Frame1015 750 + 24; паддинги 16/16/24/24, gap 16;
     Frame 1015 gap 24 (заголовок → сетка); карточки Cards pad 16/16/16/24, иконка и заголовок
     в одну строку (Frame 984 279x40 = иконка 40 + 16 + текст 18/22) */
  .container.career-benefits{padding:24px 16px;border-radius:16px}
  .career-benefits .section-title{font-size:24px!important;line-height:26px!important;margin:0 0 24px!important}
  .benefit-grid{grid-template-columns:1fr;gap:8px}
  /* responsive.css держит `.benefit{padding:14px 16px!important}` — перебиваем специфичностью
     и !important (канон Cards: 16 сверху, 24 снизу) */
  .container.career-benefits .benefit{padding:16px 16px 24px!important}
  .benefit-title{flex-direction:row;align-items:center;gap:16px}
  .benefit-head h3{font-size:18px;line-height:22px}
  .benefit-text{font-size:14px;line-height:16px}
  /* телефоны в карточке контактов рвались посередине номера («+7 (985)» / «212-11-36»);
     в каноне 375 (604:10298) каждый номер — одной строкой. 320..1440 проверено: overflow нет. */
  .contacts-card a[href^="tel:"],.labs-card a[href^="tel:"]{white-space:nowrap}
}

/* === Канон блока «Калькулятор карьеры» /career/ (Figma 392:7559 → инстанс Calculator 392:7563;
   компонент-сет 388:6291, варианты Calc_1..Calc_5 = шаги 1/5 профессия, 2/5 опыт, 3/5 образование).
   Карточка #F3F7FA r24 pad24; шапка 32/34 + подзаголовок 16/20/500 UPPER (зазоры 16 и 40);
   строка «N/5 + вопрос» 24/26 («N» #272D31, «/5» #809CAF, зазор 16); поля 56px r12, рамка 1px #85BAAF,
   текст 16/18/400 #5A6E7C, кружок-радио 23px (выбранный — залит #85BAAF с белой галочкой);
   кнопка pill 56px 18/20/500: без выбора #B3DFDF/#DAEFEC (State=Disable), после выбора #85BAAF/#fff.
   Телефон 375 (560:11561): r16 pad16, заголовок 24/26, подзаголовок 14/18 в две строки, «N/5» 20/26,
   вопрос 20/22 (зазор 8), ответы — свёрнутое поле-селект со стрелкой (варианты по тапу). === */

/* --- поля и кнопки: одинаковы во всех канонах --- */
.calc-head{display:flex;align-items:flex-start;gap:16px;text-align:left;margin:0 0 16px}
.calc-progress{display:block;font-weight:400;color:#809caf}
.calc-progress>span{color:#272d31}
.calc-question{font-weight:500;color:#272d31;margin:0}
.calc-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.calc-options--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.calc-option{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;height:56px;padding:0 16px;border:1px solid #85baaf;border-radius:12px;background:transparent;color:#5a6e7c;font-family:inherit;font-size:16px;line-height:18px;font-weight:400;text-align:left;cursor:pointer;transition:border-color .2s ease}
.calc-option:hover{border-color:#62998e}
.calc-option.selected{border-color:#85baaf;background:transparent;color:#5a6e7c}
.calc-radio{position:relative;flex:0 0 auto;width:23px;height:23px;border:1px solid #85baaf;border-radius:50%;transition:background .2s ease}
.calc-option.selected .calc-radio{background:#85baaf}
.calc-option.selected .calc-radio::after{content:'';position:absolute;left:6px;top:4px;width:9px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg)}
.calc-select{display:none;width:100%;height:56px;padding:0 56px 0 16px;border:1px solid #85baaf;border-radius:12px;background-color:transparent;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M10.7708 13.525L9.18691 11.6243L9.18691 11.6243C8.48929 10.7872 8.14049 10.3686 8.13516 10.0151C8.13052 9.70776 8.26746 9.41539 8.50651 9.22221C8.7815 9 9.32635 9 10.4161 9L13.5839 9C14.6736 9 15.2185 9 15.4935 9.22221C15.7325 9.41539 15.8695 9.70776 15.8648 10.0151C15.8595 10.3686 15.5107 10.7872 14.8131 11.6243L14.8131 11.6243L13.2292 13.525L13.2291 13.525C12.807 14.0316 12.596 14.2848 12.3433 14.3772C12.1216 14.4582 11.8784 14.4582 11.6567 14.3772C11.404 14.2848 11.193 14.0316 10.7708 13.525Z' fill='%23232222'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;background-size:24px 24px;color:#5a6e7c;font-family:inherit;font-size:16px;line-height:18px;font-weight:400;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;box-sizing:border-box}
.calc-actions{display:flex;justify-content:center;gap:16px;margin-top:24px}
.calculator .btn{min-height:56px;height:56px;padding:0 24px;border-radius:999px;font-size:18px;line-height:20px;font-weight:500}
.calculator .btn-primary{background:#85baaf;border-color:#85baaf;color:#fff}
.calculator .btn-primary:hover{background:#62998e;border-color:#62998e;transform:none;box-shadow:none}
.calculator .btn-primary:disabled,.calculator .btn-primary[disabled]{background:#b3dfdf;border-color:#b3dfdf;color:#daefec;transform:none;box-shadow:none;cursor:default}
.calculator .btn[data-prev]{background:transparent;border-color:#009294;color:#009294}
.calculator .btn[data-prev]:hover{background:#009294;border-color:#009294;color:#fff;transform:none;box-shadow:none}

/* --- десктоп (1200 → карточка 1136, поля 357/540) --- */
@media(min-width:1024px){
  /* канон Benefits 392:7559 = 680 = 40 + Frame993 160 (h2 34 + 24 + p 102) + 40 + калькулятор
     400 + 40; паддинги 40/32 (было 32 — давало 652 вместо 680). Абзац в Figma 102px: строки
     16/18 (5 строк = 90) плюс paragraphSpacing 12 — t_5f2192eb: добавлен padding-bottom:12px
     на абзац, итого p=102, виджет=680 (было 668, −12 на 1024 и 1280). */
  .container.career-ladder{padding:40px 32px;border-radius:24px;background:linear-gradient(180deg,#019294 0%,#feffff 100%)}
  .career-ladder h2{font-size:32px;line-height:34px;font-weight:500;margin:0 0 24px}
  .career-ladder>p{font-size:16px;line-height:18px;font-weight:400;max-width:609px;margin:0;padding-bottom:12px}
  .career-ladder .calculator{padding:24px;border-radius:24px;background:#f3f7fa;margin-top:40px;color:#272d31}
  .calculator>h2{font-size:32px;line-height:34px;font-weight:500;color:#272d31;margin:0}
  .calculator>.muted{font-size:16px;line-height:20px;font-weight:500;color:#5a6e7c;text-transform:uppercase;margin:16px 0 40px}
  .calculator .calc-progress{font-size:24px;line-height:26px}
  .calculator .calc-question{font-size:24px;line-height:26px}
}

/* --- планшет 768–1023: ответы в столбик во всю ширину --- */
@media(max-width:1023px){
  .calculator .calc-options{grid-template-columns:minmax(0,1fr)}
}

/* --- телефон (канон 375) --- */
@media(max-width:767px){
  .container.career-ladder{padding:16px!important;border-radius:16px!important;background:linear-gradient(180deg,#019294 0%,#feffff 100%)!important}
  .career-ladder h2{font-size:24px!important;line-height:26px!important;margin:0 0 16px}
  .career-ladder>p{max-width:none;margin:0}
  .career-ladder .calculator{padding:16px!important;border-radius:16px!important;margin-top:24px!important;background:#f3f7fa!important}
  .calculator>h2{font-size:24px!important;line-height:26px!important;margin:0}
  .calculator>.muted{font-size:14px!important;line-height:18px!important;margin:8px 0 24px!important;text-transform:uppercase}
  .calculator .calc-head{flex-direction:column;gap:8px;margin:0 0 16px}
  .calculator .calc-progress{font-size:20px;line-height:26px}
  .calculator .calc-question{font-size:20px;line-height:22px;margin:0!important}
  .calculator .calc-options{display:none}
  .calculator .calc-select{display:block}
  .calculator .calc-actions{margin-top:24px}
}

/* === Канон блоков /career/ (11.09.2026): «Легкий старт в&nbsp;работе!» (Figma 392:7552),
   «Дух команды» (392:7583), форма «Стать частью команды» (392:7600), заголовок наград (392:7564). === */
@media(min-width:1024px){
  /* «Легкий старт»: фото 697 + панель 497 (зазор 8), высота 353; фото и панель r24, панель pad 32 #F3F7FA,
     заголовок 32/34 teal, текст 18/22 #809CAF (колонка 365), кнопка pill 56 teal «К вакансиям» */
  .container.mentor{display:grid;grid-template-columns:697fr 497fr;gap:8px}
  .mentor img{height:353px;min-height:353px;border-radius:24px;object-fit:cover;object-position:50% 50%}
  .mentor-copy{border-radius:24px;padding:32px}
  .mentor-copy h2{font-size:32px;line-height:34px;font-weight:500;color:#009294}
  .mentor-copy p{font-size:18px;line-height:22px;color:#809caf;max-width:365px}
  /* Канон Figma 444:12117: абзац и кнопка — одна группа, прижатая к низу панели (зазор 16),
     h2 — сверху; вся свободная высота панели уходит в зазор h2→абзац (при h2 в одну строку = 117).
     Снимаем UA-маргины заголовка (0.83em = 26.56px) и абзаца (1em = 18px), из-за которых
     зазор абзац→кнопка раздувался до 62px. */
  .mentor-copy>h2{margin-bottom:0}
  .mentor-copy>p{margin-top:auto;margin-bottom:16px}
  .mentor-copy>div{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
  .mentor-copy .btn{min-height:56px;height:56px;padding:0 24px;font-size:18px;line-height:20px;font-weight:500;background:#009294;border-color:#009294;color:#fff}

  /* «Дух команды»: gradient #E6EEF4→#FEFFFF, r24, pad 40/32, gap 24; h2 32/34 teal;
     мозаика два ряда по 310: 464/328/328 и 328/328/464, зазор 8, картинки r16;
     кнопка «Больше фотографий» 228x56 — обводка и текст #809CAF */
  .container.gallery{background:linear-gradient(180deg,#e6eef4 0%,#feffff 100%);border-radius:24px;padding:40px 32px}
  .gallery h2{font-size:32px;line-height:34px;font-weight:500;color:#009294;margin:0 0 40px}
  .gallery-grid{display:flex;flex-wrap:wrap;gap:8px}
  .gallery-grid img{flex:0 0 auto;width:calc((100% - 16px) * 0.29285);height:310px;border-radius:16px;object-fit:cover}
  .gallery-grid img:nth-child(1),.gallery-grid img:nth-child(6){width:calc((100% - 16px) * 0.4142)}
  .gallery-grid img:nth-child(n+4){height:310px}
  .gallery .center{margin-top:24px!important}
  .gallery .center .btn{min-height:56px;height:56px;padding:0 24px;font-size:18px;line-height:20px;font-weight:500;border:1px solid #809caf;color:#809caf;background:transparent;box-shadow:none}

  /* Награды: заголовок 32/34 в колонке 609 — перенос по ширине, а не жёсткий (392:7564) */
  .awards-head h2.section-title{font-size:32px;line-height:34px;max-width:609px}

  /* Форма. ВАЖНО (14.09.2026): «Сообщение»+upload имеют РАЗНЫЙ канон на двух страницах,
     и оба варианта шли через один селектор #apply — правило 130/110 ломало главную.
     - Главная (444:12041): слева 6 полей = 376px; справа textarea 248 + 8 + upload 120 = 376.
       Эти значения в base.css (#apply textarea.field{248}, #apply .upload{120}).
     - Карьера (392:7446, Frame 868 = 248px): слева 4 поля = 248px;
       справа textarea 130 + 8 + upload 110 = 248. Это правило.
     Различаем по числу полей в левой колонке через :has() (уже используется в responsive.css).
     Без :has() приходилось бы править разметку ради CSS. */
  .form-stack>.field-message{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto 47px auto;
    align-items:center;column-gap:4px;row-gap:8px;box-sizing:border-box;padding:16px;
    border:1px solid #85baaf;border-radius:12px;background:#fff}
  .field-message>.req{width:7px;height:7px;display:block}
  .field-message>.field-cap{font-size:16px;line-height:18px;color:#a8b4bd}
  #apply .field-message>textarea.field{grid-column:1/3;height:47px;min-height:47px;padding:0;border:0;background:transparent;resize:none;font-size:16px;line-height:18px}
  /* карьера: в левой колонке ровно 4 поля (4-е — последнее) */
  #apply .form-grid:has(.form-stack:first-child > :nth-child(4):last-child) .field-message{height:130px}
  #apply .form-grid:has(.form-stack:first-child > :nth-child(4):last-child) .upload{height:110px;min-height:110px}
  .field-message>.form-hint{grid-column:1/3;font-size:12px;line-height:14px;color:#a8b4bd;margin:0}
  form[data-demo-form]{display:flex;flex-wrap:wrap;align-items:flex-start;gap:16px}
  form[data-demo-form]>.form-grid{flex:1 0 100%}
  form[data-demo-form]>.checks{flex:1 1 auto;display:flex;flex-direction:column;gap:8px;margin:0}
  form[data-demo-form]>.checks label{display:flex;align-items:center;gap:8px;font-size:14px;line-height:16px;min-height:24px}
  form[data-demo-form]>.form-actions{flex:0 0 auto;margin:0}
  form[data-demo-form]>.form-status{flex:1 0 100%;margin:0}
}

/* === /career/ @1024 only (t_5f2192eb): канон 550:12032 — gallery 944×752 (image 238h),
   benefits 944×638 (container pad 34, h2 margin-bottom 18). 1280 не трогаем. === */
@media(min-width:1024px) and (max-width:1279px){
  /* Gallery: canon 752 = 40+68+40+484+24+56+40; grid 484 = 2×238+8 */
  .gallery-grid img{height:238px}
  .gallery-grid img:nth-child(n+4){height:238px}
  /* Benefits: canon 638 = 34+68+18+484+34; pad 34 (−12), h2 margin-bottom 18 (−14) */
  .container.career-benefits{padding:34px 32px}
  .career-benefits .section-title{margin-bottom:18px}
}

@media(max-width:767px){
  /* Канон 375: «Легкий старт» — фото 343x221 сверху, панель r16 pad16 gap24, заголовок 24/26, текст 16/18
     (селекторы с двумя классами — в responsive.css те же свойства стоят с !important) */
  .container.mentor img{height:221px!important}
  .container.mentor .mentor-copy{border-radius:16px;padding:16px!important;gap:24px!important}
  .container.mentor .mentor-copy h2{font-size:24px!important;line-height:26px!important}
  .container.mentor .mentor-copy p{font-size:16px!important;line-height:18px!important;color:#809caf}
  /* «Дух команды» — та же градиентная карточка, r16 pad 20/16, фото — горизонтальный слайдер (scroll-snap) */
  .container.gallery{background:linear-gradient(180deg,#e6eef4 0%,#feffff 100%)!important;border-radius:16px;padding:20px 16px}
  .gallery h2{font-size:24px!important;line-height:26px!important;margin:0 0 24px}
  .container.gallery .gallery-grid{display:flex;flex-direction:row;gap:8px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px}
  .container.gallery .gallery-grid::-webkit-scrollbar{display:none}
  .container.gallery .gallery-grid img,
  .container.gallery .gallery-grid img:nth-child(1),
  .container.gallery .gallery-grid img:nth-child(n+4),
  .container.gallery .gallery-grid img:nth-child(6){flex:0 0 100%;min-width:100%;width:100%;max-width:none;height:220px;scroll-snap-align:center}
}

/* === Вьюер изображений (11.09.2026): медиа занимает всю колонку, зум тянется к курсору (см. widgets.js).
   Селектор с классом .fb-viewer — перебивает hardening.css, который подключается после этого файла. === */
.fb-viewer .fb-viewer__stage{place-items:stretch}
.fb-viewer .fb-viewer__media{cursor:zoom-in}
.fb-viewer .fb-viewer__media.is-zoomed{cursor:grab}
.fb-viewer .fb-viewer__media.is-dragging{cursor:grabbing}
.fb-viewer .fb-viewer__media.is-dragging .fb-viewer__img{transition:none}
.fb-viewer .fb-viewer__img{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;transition:transform .12s ease}
.fb-viewer__meta:empty,.fb-viewer__title:empty,.fb-viewer__caption:empty{display:none}

/* Точки мобильного слайдера галереи (разметку делает widgets.js) */
.gallery-dots{display:none}
@media(max-width:767px){
  .gallery-dots{display:flex;justify-content:center;gap:6px;margin-top:12px}
  .gallery-dots button{width:6px;height:6px;border-radius:50%;border:0;padding:0;background:#bcd3d6;cursor:pointer;transition:width .15s ease,background .15s ease}
  .gallery-dots button.active{width:18px;border-radius:3px;background:#009294}
}

/* === /news/ (11.09.2026, решение владельца — вариант Б): карточки 2 в ряд, фото 16:9,
   равная высота в ряду, рамка + мягкая тень; дата — плашка #85BAAF (канон карточек пресс-центра). === */
/* 11.09.2026: списки /news/ обёрнуты в .container (как /science/, /social/, /media/) —
   своя ширина не нужна: боковые поля = .container на всех брейкпоинтах */
.news-list{width:100%}
.news-list .news-card{width:100%;max-width:none;min-width:0;background:#fff;border:1px solid #e3edf0;border-radius:24px;box-shadow:0 10px 28px rgba(12,38,48,.06);overflow:hidden;display:flex;flex-direction:column;height:100%;padding:0;transition:box-shadow .2s ease,transform .2s ease}
.news-list .news-card:hover{box-shadow:0 16px 40px rgba(12,38,48,.12);transform:translateY(-2px)}
.news-list .news-card__media{aspect-ratio:16/9;height:auto;min-height:0}
.news-list .news-card__media img{width:100%;height:100%;object-fit:cover}
/* 16.09.2026: у 38 карточек из 124 нет фото — они схлопывались в узкую полоску
   (высота 214px против 410 у соседей по ряду). Та же заглушка, что в editorial-списке
   (`.editorial-card__placeholder`): сохраняет 16:9 и выравнивает ряды. */
.news-list .news-card__placeholder{display:block;width:100%;height:100%;
  background:linear-gradient(135deg,#dce8ea,#edf3f5)}
.news-list .news-card__body{padding:20px 24px 24px;display:flex;flex-direction:column;gap:12px;flex:1 1 auto}
.news-list .news-card__date{align-self:flex-start;display:inline-flex;align-items:center;height:22px;padding:0 10px;border-radius:4px;background:#85baaf;color:#fff;font-size:10px;line-height:22px;font-weight:700;letter-spacing:.02em;text-transform:uppercase}
.news-list .news-card__title{margin:0;font-weight:400;color:#272d31}
.news-list .news-card__intro{margin:0;font-size:15px;line-height:20px;color:#5a6e7c;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.news-list .news-card__link{margin-top:auto;color:#009294;font-size:14px;line-height:16px;text-decoration:underline;text-underline-offset:3px}
/* шапка страницы: как заголовки форм на этом шаблоне (40/42 teal + 18/22 серо-синий)
   16.09.2026 (t_22f8c48b): `padding-bottom` 8px давал зазор 8px до ряда рубрик
   (замер живого /news/ @1280/1440/1600). Ритм сайта — 24px: /news/ после правки,
   /science/ и /social/ дают 36px (`.editorial-hero{margin-bottom:36px}`).
   Взято 24px — нижняя граница ритма сайта; на /news/ шапка не hero-плашка,
   а обычный заголовок формы, поэтому 36px от hero сюда не переносится.
   Шорткат со явным верхом (56px = живое значение) — см. ПИТФОЛЛ у блока рубрик. */
.news-head{padding:56px 0 24px}
.news-head__title{margin:0 0 12px;font-size:40px;line-height:42px;font-weight:500;color:#009294}
.news-head__sub{margin:0;max-width:760px;font-size:18px;line-height:22px;color:#809caf}
@media(min-width:768px){
  /* 14.09.2026: три колонки — дизайнер просил «по аналогии с блоком внизу
     главной, сейчас всё гигантское». Это правило стоит НИЖЕ моего в блоке
     «News list cards» (стр. 2180) и перебивало его — правка именно здесь.
     Было 2 колонки: карточка 589×578. Стало 3: (1201-2*20)/3 = 387. */
  .news-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
  /* 16.09.2026: кегль заголовка — канонный компонент карточки пресс-центра
     `Name=News, Size=1920-1024` (node 63:1677, слой Txt 63:1670) = 16/18 w400.
     Было 17/20 — компромисс сессии 14.09, а не канон. Замер на живом /news/:
     заголовков длиннее 3 строк 5 → 4, блок списка 4045 → 3991 px. */
  .news-list .news-card__title{font-size:16px;line-height:18px}
}
@media(min-width:768px) and (max-width:1023px){
  /* на планшете три колонки тесные (ширина ~230) — возвращаем две */
  .news-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:767px){
  .news-list{grid-template-columns:1fr;gap:16px}
  .news-list .news-card{border-radius:16px;min-width:0;max-width:none}
  .news-list .news-card__body{padding:16px;gap:10px}
  /* 16.09.2026: мобильный канон карточки `Name=News, Size=375` (node 477:8165,
     слой Txt 477:8172) = 14/16 w400. Было 17/20.
     Замер @375: блок списка 10 018 → 9 526 px, заголовков длиннее 3 строк 8 → 4. */
  .news-list .news-card__title{font-size:14px;line-height:16px}
  .news-list .news-card__intro{font-size:14px;line-height:18px;-webkit-line-clamp:3}
  .news-head__title{font-size:28px!important;line-height:30px!important}
  .news-head__sub{font-size:15px;line-height:19px}
  /* 16.09.2026 (t_22f8c48b): мобильная часть зазора rub→cards. 24px = ритм связки
     «ряд вкладок → содержимое» (/contacts @375: .contact-tabs__nav → __panel = 24px).
     Замер @360/@375/@414/@767: было 12px (авторские 4px перебивал responsive.css).
     Верх 12px = живое значение (авторский 0px мёртв, см. ПИТФОЛЛ у блока рубрик).
     `.section` в селекторе обязателен — иначе `.section{padding:12px 0}` перебьёт.
     Шапка мобильно НЕ трогается: её верх 12px от `.section`, а второй зазор
     уже 48px — увеличение нижнего сделало бы 60px, то есть замечания не касается. */
  .section.news-rubrics{padding:12px 0 24px}
}

/* === 11.09.2026: имя пользователя в шапке после входа. Было: правило .site-header .login span{color:#009294}
   перебивало цвет родителя .login.is-auth{color:#fff} → бирюзовый текст на бирюзовой плашке = не читается. === */
.header-actions .login.is-auth span,
.header-actions .login.is-auth .login-name,
.site-header .login.is-auth span{color:#fff}

/* Плашка входа: подстраховка литеральным цветом (var(--teal) в шапке не резолвился) */
.header-actions .login.is-auth{background:#009294;border-color:#009294;color:#fff}

/* 11.09.2026: кнопки переключения вьюера — в панели фото (relative к .fb-viewer__media).
   Было .fb-viewer__next{right:calc(37% + 16px)} — 37% считались от панели фото, кнопка уезжала внутрь кадра. */
.fb-viewer .fb-viewer__prev{left:16px}
.fb-viewer .fb-viewer__next{right:16px}

/* === 11.09.2026: диалог поиска по сайту (#site-search) вообще не был стилизован — отсюда «квадратное окно».
   Оформлен в языке сайта: карточка r24, поле-пилюля r100 #F3F7FA (варианты Figma Search 995:11120 / 182:4095),
   результаты — строки r16 с иконкой. === */
.search-dialog{border:0;padding:0;border-radius:24px;background:#fff;color:#272d31;
  width:min(640px,calc(100vw - 32px));max-width:min(640px,calc(100vw - 32px));
  max-height:min(80dvh,760px);overflow:hidden;box-shadow:0 24px 80px rgba(12,38,48,.35)}
.search-dialog::backdrop{background:rgba(10,30,38,.72);backdrop-filter:blur(4px)}
.search-dialog__in{display:flex;flex-direction:column;gap:16px;padding:24px;max-height:min(80dvh,760px)}
.search-dialog__head{display:flex;align-items:center;justify-content:space-between;gap:16px}
.search-dialog__head strong{font-size:20px;line-height:22px;font-weight:500;color:#272d31}
.search-dialog__head .circle-btn{width:36px;height:36px;flex:0 0 36px;border:0;border-radius:50%;background:#f3f7fa;
  color:#5a6e7c;font-size:20px;line-height:1;cursor:pointer;display:grid;place-items:center}
.search-dialog__head .circle-btn:hover{background:#e6eef4}
.search-dialog input[type="search"]{width:100%;box-sizing:border-box;height:54px;padding:0 22px;border-radius:100px;
  border:1px solid transparent;background:#f3f7fa;color:#272d31;font:500 18px/22px Onest,system-ui,sans-serif;outline:none}
.search-dialog input[type="search"]::placeholder{color:#a8b4bd;font-weight:400}
.search-dialog input[type="search"]:focus{border-color:#85baaf;background:#fff}
.search-results{display:flex;flex-direction:column;gap:8px;overflow:auto;max-height:52dvh;margin:0 -4px;padding:0 4px}
.search-result{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;text-decoration:none;color:inherit}
.search-result:hover{background:#eaf3f4}
.search-result-icon{flex:0 0 36px;width:36px;height:36px;border-radius:50%;background:#eaf3f4;color:#009294;
  display:grid;place-items:center;font-size:16px;line-height:1}
.search-result-title{font-size:16px;line-height:20px;font-weight:500;color:#272d31}
.search-result-hint{font-size:14px;line-height:18px;color:#809caf;margin-top:2px}
.search-result mark{background:transparent;color:#009294;font-weight:500}
.search-no-results{padding:8px 4px;font-size:16px;line-height:20px;color:#809caf}
@media(max-width:767px){
  .search-dialog{width:calc(100vw - 24px);max-width:calc(100vw - 24px);border-radius:20px;max-height:88dvh}
  .search-dialog__in{padding:16px;gap:12px;max-height:88dvh}
  .search-dialog input[type="search"]{height:48px;font-size:16px;line-height:20px}
  .search-results{max-height:64dvh}
}

/* =====================================================================================
   11.09.2026 (карточка «news+form»): FAQ — расстояния между кнопками + пуш-окна.
   --- 1. FAQ на /clients/ (жалоба владельца: «при раскрытии и сворачивании расстояние между
   кнопками не возвращается к исходному»). Измерено до правки (CDP, 1280): высоты кнопок
   116/98/116/138/98/98 при зазорах в колонках 30/30 и 48/8; при 375 все шесть рядов имели
   высоту 256 (зазоры 8 и 118 у соседей). Причина: `.faq-grid{grid-auto-rows:1fr}` растягивает
   КАЖДЫЙ ряд под высоту самого высокого ряда сетки, а `align-items:start` не выравнивает пару
   внутри ряда. Канон Figma 1003:11555: ряды 132/128/96 с зазором ровно 8px, элементы ряда равны
   по высоте. Стало: ряды по содержимому, пара в ряду одной высоты, зазор всегда 8px. */
.faq-grid{align-items:stretch;grid-auto-rows:auto}
.faq-item{display:flex;flex-direction:column}

/* --- 2. Пуш-окно новости (клик по карточке на /news/ больше не уводит на страницу
   с сырой legacy-вёрсткой). Текст собирается скриптом в widgets.js. --- */
.news-modal{max-width:min(920px,92vw)}
.news-modal__head{margin:0 0 18px;padding-right:48px}
.news-modal__date{display:inline-flex;align-items:center;height:22px;padding:0 10px;border-radius:4px;background:#85baaf;color:#fff;font-size:10px;line-height:22px;font-weight:700;text-transform:uppercase;letter-spacing:.02em}
.news-modal__title{margin:10px 0 0;font-size:28px;line-height:32px;font-weight:500;color:#009294;overflow-wrap:anywhere}
.news-modal__body,.news-modal__text{max-width:100%;min-width:0}
.news-modal__body p,.news-modal__text p{margin:0 0 16px;font-size:17px;line-height:26px;color:#35505d;overflow-wrap:anywhere}
.news-modal__text h3{font-size:22px;line-height:26px;font-weight:500;color:#009294;margin:24px 0 10px}
.news-modal__text h4{font-size:18px;line-height:22px;font-weight:500;color:#35505d;margin:20px 0 8px}
.news-modal__text ul,.news-modal__text ol{margin:0 0 16px;padding-left:22px;color:#35505d;font-size:17px;line-height:26px}
.news-modal__text li{margin:4px 0}
.news-modal__text hr{border:0;border-top:1px solid #eef4f5;margin:22px 0}
.news-modal__text a{color:#009294;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.news-modal__fig{margin:0 0 18px;text-align:center}
.news-modal__fig a{display:inline-block;max-width:100%}
.news-modal__fig img{max-width:100%;height:auto;border-radius:16px;display:block;background:#f4f8f9}
.news-modal__lead{margin:0 0 22px}
.news-modal__lead img{width:100%}
.news-modal__tablewrap{max-width:100%;overflow-x:auto;margin:0 0 18px;border:1px solid #e2ecee;border-radius:12px}
.news-modal__tablewrap table{border-collapse:collapse;width:100%;font-size:15px}
.news-modal__tablewrap th,.news-modal__tablewrap td{padding:10px 12px;border-bottom:1px solid #e2ecee;text-align:left;color:#35505d}
.news-modal__loading,.news-modal__empty{margin:0 0 12px;font-size:17px;line-height:24px;color:#5a6e7c}
.news-modal__source{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin-top:22px;padding-top:16px;border-top:1px solid #eef4f5}
.news-modal__open{color:#009294;font-size:14px;line-height:18px;text-decoration:underline;text-underline-offset:3px}
.news-modal__nav{display:flex;flex-wrap:wrap;gap:8px;width:100%}
.news-modal__navlink{display:block;max-width:100%;padding:8px 12px;border:1px solid #dbe8ea;border-radius:10px;background:#f8fbfb;color:#516977;font-size:14px;line-height:18px;text-decoration:none;overflow-wrap:anywhere}
.news-modal__navlink:hover{border-color:#009294;color:#009294}

/* --- 3. Пуш-окно «Оставить заявку» на /clients/ (было href="#contacts", формы нет).
   Отправка — тот же POST request.submit, что у форм на главной и /career/. --- */
.request-modal{max-width:min(760px,92vw)}
.fb-req__title{margin:0 0 8px;padding-right:48px;font-size:28px;line-height:32px;font-weight:500;color:#009294}
.fb-req__lead{margin:0 0 20px;font-size:15px;line-height:22px;color:#5a6e7c}
.fb-req__lead a{color:#009294;text-decoration:underline;text-underline-offset:3px}
.fb-req__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin:0 0 12px}
.fb-req__plain{display:block;min-width:0}
.fb-req__grid .field-req,.fb-req__grid .fb-req__plain{min-width:0}
.fb-req .field{width:100%;margin:0;box-sizing:border-box}
.fb-req textarea.field{min-height:132px;resize:vertical}
.fb-req__checks{margin:14px 0 18px}
.fb-req__checks label{display:flex;gap:10px;align-items:flex-start;color:#5a6e7c;font-size:13px;line-height:18px;cursor:pointer}
.fb-req__checks input{margin:2px 0 0;flex:0 0 auto}
.fb-req__checks a{color:#009294}
.fb-req__actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.fb-req__hint{color:#809caf;font-size:13px;line-height:18px}
.fb-req__status{margin-top:12px;font-size:14px;line-height:20px}
@media(max-width:767px){
  .fb-req__grid{grid-template-columns:minmax(0,1fr)}
  .fb-req__title{font-size:24px;line-height:28px}
  .fb-modal__body p,.news-modal__text p{font-size:16px;line-height:24px}
  .news-modal__title{font-size:22px;line-height:26px}
}

/* 11.09.2026: липкая шапка 76px съедала верх якорной цели (например #steps на /clients/) */
section[id],div[id]{scroll-margin-top:92px}

/* 11.09.2026: кавычки «Наша миссия» — точный SVG из Figma (Group 14, 54x46) вместо глифа,
   который рисовал чернила ~15px при font-size 60. */
#mission img.quote-mark{display:block;width:54px;max-width:54px;height:46px;margin:0 0 16px}

/* 11.09.2026 (пуш-окно заявки): чекбокс согласия — текст и ссылка одним блоком.
   В flex-контейнере непрерывный текст и <a> становились двумя flex-item'ами:
   «…персональных данных и с» слева, ссылка справа отдельным столбцом. */
.fb-req__checks label>span{flex:1 1 auto;min-width:0}
.fb-req__checks input[type=checkbox]{width:18px;height:18px}

/* 11.09.2026 (мобильный, ≤767): карточки Меркурия были фиксированные 239px → в контейнер 343px
   влезало ~1.4 карточки и блок выглядел «уже» соседних. Делаем слайдер: карточки 84% ширины, снап, скрытый скроллбар. */
@media(max-width:767px){
  .mercury-awards{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .mercury-awards::-webkit-scrollbar{display:none}
  .mercury-card{flex:0 0 84%;width:84%;max-width:none;scroll-snap-align:center}
  .mercury-card img{width:100%;flex:0 0 auto}
}

/* =====================================================================================
   11.09.2026: пуш-окно с видео ([data-open-video]) — канва Figma 392:7492 (Career_1280):
   Main screen 1201x600 r24 тёмный кадр; кнопка-пилюля 298x56 r100, текст 18/20/500.
   Ролик в кадре — object-fit:contain (1920x740 не обрезается и не растягивается). === */
.video-modal{max-width:min(1201px,92vw)}
.video-modal__cap{margin:0 0 12px;padding-right:48px;font-size:18px;line-height:20px;font-weight:500;color:#35505d}
.video-modal__frame{position:relative;width:100%;aspect-ratio:16/9;background:#0b3b3c;border-radius:24px;overflow:hidden}
.video-modal__frame video{display:block;width:100%;height:100%;object-fit:contain;background:#0b3b3c}
@media(max-width:1023px){
  .video-modal{max-width:min(1201px,96vw)}
  .video-modal__frame{border-radius:16px}
  .video-modal__cap{font-size:16px;line-height:18px}
}

/* 11.09.2026: затемнение под всеми пуш-окнами сайта (.fb-modal) — как у остальных диалогов
   (search-dialog/.fb-viewer: backdrop-filter blur). Было: только rgba(8,20,27,.55) без blur. */
.fb-modal::backdrop{background:rgba(8,20,27,.55);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}

/* === 11.09.2026: страница новости (/news/<slug>.html) была без оформления — контент на всю ширину,
   p 16px без интерлиньяжа, фото 1265x844. Оформлено в языке сайта (контейнер 1200, плашка даты, типографика). === */
/* Контейнер страницы новости задаётся на самом main (см. body.news-page ниже): так блоки не «разъезжаются». */
/* 16.09.2026 (карточка t_56ac941f): верхний отступ страницы материала держался на
   margin самого фото (.news-detail__photo{margin-top:24px}), поэтому у материала БЕЗ фото
   первый блок (крошки) прилипал к шапке — зазор 0 px (замер живых статей @1440/375).
   Общесайтовый верхний отступ живёт на контейнере: у страниц-эталонов /social/, /science/
   это .editorial-page{padding-top:48px} — зазор шапка → первый блок 48 px @1440 и @768,
   16 px @375 (тот же .section-lg{padding:16px 0} из responsive.css).
   Повторяем ровно этот паттерн на контейнере новости, а не на блоке: отступ теперь есть
   всегда, независимо от того, с чего начинается материал (фото или крошки).
   ПИТФОЛЛ: padding кладём на main-обёртку, а не на первый ребёнок — иначе при разных
   первых блоках отступ снова окажется «на конкретном элементе».
   ПИТФОЛЛ 2: margin-top у фото при этом ОБНУЛЁН (ниже) — иначе у 20 материалов с фото
   зазор стал бы 48 + 24 = 72 px и «канон» превратился бы в «дыру». Отступ считает один
   элемент — main. */
body.news-page main{padding-top:48px}
.news-detail__photo{margin-top:0;margin-bottom:24px;border-radius:24px;overflow:hidden}
.news-detail__photo img{display:block;width:100%;height:auto;max-height:560px;object-fit:cover;border-radius:24px}
.crumbs{font-size:14px;line-height:18px;color:#809caf;margin:0 0 12px}
.crumbs a{color:#809caf;text-decoration:none}
.crumbs a:hover{color:#009294}
.crumbs .sep{margin:0 6px;color:#b9c8d1}
.crumbs .crumb-active{color:#5a6e7c}
.news-nav-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin:0 0 16px}
.news-nav-top__btn{display:inline-flex;align-items:center;height:36px;padding:0 16px;border-radius:100px;
  border:1px solid #bcd3d6;color:#5a6e7c;font-size:14px;line-height:16px;text-decoration:none;background:#fff;
  max-width:48%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.news-nav-top__btn--prev{margin-right:auto}
.news-nav-top__btn--next{margin-left:auto}
.news-nav-top__btn:hover{border-color:#009294;color:#009294}
.news-nav-top__btn--disabled{opacity:.55;border-style:dashed}
.news-detail__date{align-self:flex-start;display:inline-flex;align-items:center;height:22px;padding:0 10px;
  border-radius:4px;background:#85baaf;color:#fff;font-size:10px;line-height:22px;font-weight:700;
  letter-spacing:.02em;text-transform:uppercase;margin:0 0 12px;width:auto}
.news-detail__title{margin:0 0 20px;font-size:32px;line-height:34px;font-weight:500;color:#009294;max-width:900px}
.content-block{font-size:18px;line-height:24px;color:#272d31}
.content-block p{margin:0 0 18px}
.content-block ul,.content-block ol{margin:0 0 18px;padding-left:22px}
.content-block li{margin:0 0 8px}
.content-block h2{font-size:24px;line-height:26px;font-weight:500;color:#272d31;margin:28px 0 12px}
.content-block h3{font-size:20px;line-height:22px;font-weight:500;color:#272d31;margin:24px 0 10px}
.content-block img{display:block;width:100%;height:auto;border-radius:16px;margin:8px 0 20px}
.content-block blockquote{margin:0 0 18px;padding:16px 20px;background:#f3f7fa;border-left:3px solid #85baaf;border-radius:0 12px 12px 0}
.content-block a{color:#009294}
.news-detail__nav{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin:32px auto 56px;padding-top:24px;border-top:1px solid #e3edf0}
.news-detail__nav a{color:#009294;font-size:16px;line-height:20px;text-decoration:none}
.news-detail__nav a:hover{text-decoration:underline}
@media(max-width:767px){

  /* Верхний отступ материала на телефоне — как у /social/ и /science/: там
     .section-lg{padding:16px 0} из responsive.css, то есть зазор шапка → блок 16 px.
     margin-top фото здесь тоже 0 — отступ считает только main (см. комментарий выше). */
  body.news-page main{padding-top:16px}
  .news-detail__photo{margin-top:0;margin-bottom:16px;border-radius:16px}
  .news-detail__photo img{border-radius:16px;max-height:260px}
  .news-detail__title{font-size:24px!important;line-height:26px!important;margin-bottom:16px}
  .content-block{font-size:16px;line-height:22px}
  .content-block h2{font-size:20px;line-height:22px}
  .content-block h3{font-size:18px;line-height:20px}
}

/* 11.09.2026: в поле «Сообщение» красная снежинка (<svg class="req">) стояла перед подписью и наезжала
   на текст «Сообщение». Переносим её сразу за подписью, поле и подсказка — на своих строках. */
.field-message{display:flex;flex-wrap:wrap;align-items:center;column-gap:5px;row-gap:6px}
.field-message>.field-cap{order:1;display:inline-block}
.field-message>svg.req{order:2;position:static;transform:none;left:auto;top:auto;width:7px;height:7px;color:#F93004}
.field-message>textarea.field{order:3;flex:1 1 100%;width:100%;min-width:0}
.field-message>p.form-hint,.field-message>.form-hint{order:4;flex:1 1 100%;margin:0}

/* 11.09.2026: юридические документы (/legal/*) читались в колонке 820px шрифтом 15px — «слишком узко».
   Расширяем до 1100px и приводим типографику к сайту (16/26, заголовки 32/34 и 24/28). */
.legal-doc{max-width:1100px;padding:48px 24px 64px}
.legal-doc p,.legal-doc li{font-size:16px;line-height:26px}
.legal-doc h1{font-size:32px;line-height:34px;font-weight:500;color:#009294;margin:0 0 24px}
.legal-doc h2{font-size:24px;line-height:28px;font-weight:600;color:#283137;margin:32px 0 16px}
.legal-doc h3{font-size:19px;line-height:24px;font-weight:600;color:#283137;margin:24px 0 12px}
.legal-doc .page-content,.legal-doc .page-content.legal-doc{max-width:none;padding:0;margin:0}
@media(max-width:767px){
  .legal-doc{max-width:100%;padding:24px 16px 40px}
  .legal-doc p,.legal-doc li{font-size:15px;line-height:24px}
  .legal-doc h1{font-size:24px;line-height:26px}
  .legal-doc h2{font-size:20px;line-height:24px}
}

/* 11.09.2026: страницы новостей приходят в трёх разных разметках (новая news-detail, старая с crumbs,
   бутстрап-наследие col-xs-12) — типографика теперь вешается на класс body.news-page (ставит шаблон
   по родителю ресурса 7), поэтому одинаково работает на всех страницах новостей. */
/* Единый контейнер для всех страниц новостей — вместо правки каждого блока по отдельности. */
body.news-page main{width:min(1200px,calc(100% - 32px));margin-left:auto;margin-right:auto}
body.news-page main>*{max-width:100%}
body.news-page main time.news-detail__date{width:fit-content}
body.news-page main p{font-size:18px;line-height:24px;color:#272d31;margin:0 0 18px}
body.news-page main li{font-size:18px;line-height:24px;color:#272d31;margin:0 0 8px}
body.news-page main ul,body.news-page main ol{margin:0 auto 18px;padding-left:22px}
body.news-page main h2{font-size:24px;line-height:26px;font-weight:500;color:#272d31;margin:28px 0 12px}
body.news-page main h3{font-size:20px;line-height:22px;font-weight:500;color:#272d31;margin:24px 0 10px}
body.news-page main h1{font-size:32px;line-height:34px;font-weight:500;color:#009294;margin:0 0 20px;max-width:900px}
body.news-page main img{max-width:100%;height:auto;border-radius:16px}
body.news-page main blockquote{margin:0 auto 18px;padding:16px 20px;background:#f3f7fa;border-left:3px solid #85baaf;border-radius:0 12px 12px 0}
body.news-page main table{width:100%;border-collapse:collapse;margin:0 auto 18px}
body.news-page main td,body.news-page main th{border:1px solid #e3edf0;padding:8px 10px;font-size:16px;line-height:20px;text-align:left}
@media(max-width:767px){
  body.news-page main{width:calc(100% - 32px)}
  body.news-page main p,body.news-page main li{font-size:16px;line-height:22px}
  body.news-page main h1{font-size:24px!important;line-height:26px!important}
  body.news-page main h2{font-size:20px;line-height:22px}
  body.news-page main h3{font-size:18px;line-height:20px}
}

/* ============================================================================
   16.09.2026 — /career/ 375: мобильные дельты закрыты по видимому канону Figma.
   Источник: Career_375 (Ready) 560:11521 → Frame 1018 560:11531; сверено с 559:8064 (Work)
   и 560:12808 (новая ревизия). Все числа — из боксов Figma, не «на глаз».
   Карточка канбана t_84895716.
   ============================================================================ */
@media(max-width:767px){
  /* «Защищаем жизнь…» (560:11533): блок 232 = pad-top 40 + h2 104 + 32 + кнопка 56.
     В разметке заголовок разбит тремя <br> на 6 строк (156); в макете бокс 343 без жёстких
     переносов — текст ложится в 4 строки по 26 = 104 (скриншот canon375/msg-h2.png). */
  section.career-message .container>h2 br{display:none}

  /* Numbers/«Что вы получаете» (560:11539): карточки Cards 80/80/204/80/106/84.
     Круглый +/− в мобильном макете СКРЫТ, но место под него зарезервировано:
     Frame 984 = 279 = иконка 40 + 16 + текст 183, поэтому «Насыщенная корпоративная жизнь»
     и «Поддержка семейных ценностей» переносятся в 3 строки. Мобильный Text-стиль макета —
     18/22/w400 (на десктопе 24/26/w500). responsive.css:163 глушил кнопку через display:none —
     колонка текста становилась 223/224, и обе карточки укладывались в 2 строки (84 вместо 106);
     responsive.css:162 так же глушил раскрытие — возвращаем (site.js уже переключает .open). */
  .container.career-benefits .benefit .benefit-toggle{display:block!important;visibility:hidden!important;
    width:32px!important;height:32px!important;flex:0 0 32px!important}
  .container.career-benefits .benefit-head{gap:8px!important}
  .container.career-benefits .benefit-head h3{font-weight:400!important}
  .container.career-benefits .benefit.open .benefit-detail{display:block!important}

  /* «Легкий старт» (560:11552): панель 343x224 = pad 24/16 + h2 26 + 24 + текст 54 + 16 + кнопка 56.
     В макете h2 без собственного нижнего отступа (его роль играет gap 24), абзац — без своего
     (16 задаёт зазор до кнопки). Живая панель была 252: h2 нёс 19.92, абзац 16 при gap 24. */
  .container.mentor .mentor-copy{padding:24px 16px!important;gap:0!important}
  .container.mentor .mentor-copy h2{margin:0 0 24px!important}
  .container.mentor .mentor-copy p{margin:0 0 16px!important}

  /* Форма (560:11624 = 892 = 114 + 24 + 754): шапка 114 = h2 26 (24/26) + 16 + текст 72 (16/18).
     Низ колонок 576 = поле «Сообщение» 200 + 8 + блок загрузки 100.
     Поле: pad 16, метка внутри, подсказки в макете 375 НЕТ (она только в десктопном 392:7618).
     Загрузка: pad 16, gap 8, значок 32, строка 32, подсказка 28 → 16+32+8+28+16 = 100.
     Живая форма была 1054: шапка 188 (40/42 и 18/22), поле 236 с подсказкой, загрузка 140. */
  #apply .form-head{margin-bottom:24px!important}
  #apply .form-head h2{font-size:24px!important;line-height:26px!important;margin-bottom:16px!important}
  #apply .form-head p{font-size:16px!important;line-height:18px!important;margin-bottom:0!important}
  #apply .form-stack .field-message{height:200px!important;padding:16px!important;row-gap:0!important}
  #apply .form-stack .field-message>textarea.field{height:auto!important;min-height:0!important;
    padding:8px 0 0!important;border:0!important;background:transparent!important}
  #apply .form-stack .field-message>.form-hint{display:none!important}
  #apply .form-grid .upload{height:100px!important;min-height:100px!important;padding:16px!important;gap:8px!important;
    flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important}
  #apply .upload .upload-row{gap:8px!important}
  #apply .upload .upload-badge{width:32px!important;height:32px!important;flex:0 0 32px!important}
  #apply .upload .upload-text>span{display:none}
  #apply .upload strong{font-size:16px!important;line-height:18px!important}
  #apply .upload small{font-size:12px!important;line-height:14px!important;margin:0!important}

  /* Награды (560:11585 и 560:12872): заголовок 24/26 в колонке 311
     (десктопное 32/34 стоит вне media и на 375 не должно применяться). */
  .awards-head h2.section-title{font-size:24px!important;line-height:26px!important}

  /* Контакты: лаборатории в блоке показаны ОДИН раз. Историю боя специфичности
     (`#contacts .mobile-accordion{display:none!important}` здесь против
     responsive.css:137 `display:grid!important`) закрыла карточка t_ea97a720
     (решение владельца 4-б): правило снято, аккордеон площадок теперь штатно виден
     на ≤767, а развёрнутая сетка .labs-grid скрыта — дубль больше не рисуется.
     Канон блока — assets/css/fb-canon-20260914.css, блок «КОНТАКТЫ: площадки и роли». */

  /* Футер (560:11725 = 216 = зоны 64 + 16 + 40 + 16 + 40 + pad-bottom 40).
     Замер 320..412: 256 → 216 при 375 (зона компании 56 на узких, канон — 32 при 375). */
  .legal-footer .legal-footer__in{padding:0 0 40px!important;gap:16px!important}
}

/* ============================================================================
   16.09.2026 (продолжение) — /career/ 375: остаток формы до канона 560:11624 (892)
   и «Сообщение»/чекбоксы. Все правила — с префиксом body: responsive.css грузится ПОСЛЕ
   audit-fixes.css и на равной специфичности выигрывает (`#apply .form-head{margin-bottom:16px}`
   перебивал канонные 24). Замер после правки: форма 892, левая колонка 260, поле 68.
   ============================================================================ */
@media(max-width:767px){
  /* шапка: канон Frame 788 = h2 26 + 16 + p 72, зазор до формы 24 (560:11625/560:11628) */
  body #apply .form-head{margin-bottom:24px!important}
  /* первое поле-селект — 68px (канон Text Field 343x68 при 4 полях в колонке);
     у остальных 56. Сетка колонки: 68 + 8 + 56 + 8 + 56 + 8 + 56 = 260 */
  body #apply .form-stack>select.field:first-child{height:68px!important;min-height:68px!important}
  /* чекбоксы (канон 560:11649): подписи 12/14, первая 42 (3 строки), вторая 24, зазор 16 → 82 */
  body #apply .checks{gap:16px!important}
  body #apply .checks label{font-size:12px!important;line-height:14px!important;align-items:flex-start!important}
  /* кнопка «Отправить»: до неё 8 сверх зазора строки (канон 82+24+56; зазор строки даёт 16) */
  body form[data-demo-form]>.form-actions{margin-top:8px!important}
}

/* ============================================================================
   16.09.2026 (продолжение 2) — /career/ 375: зазор «название → ©» в футере.
   Канон 560:11725: имя 2 строки 32 + 16 + © 16 → зона компании 64.
   Живой блок ≤1023 держит gap 8 (зона 56). После правки футер = 264,
   канон 216 = 264 − 48: разницу дают ДВЕ дополнительные юр.ссылки
   (4 живые против 2 в макете) — это решение владельца, не геометрия.
   ============================================================================ */
@media(max-width:767px){
  .legal-footer .legal-footer__company{gap:16px!important}
}

/* ============================================================================
   16.09.2026 (продолжение 3) — /career/ 375: кликабельная площадь поля «Сообщение».
   Канон 560:11636: Text Field 343x200 (pad 16) — это ОДНА рамка, вся площадь которой
   и есть textarea: подпись «Сообщение» лежит внутри рамки, отдельного поля ниже нет.
   Живой вариант (после правки 2) давал рамку 200, но textarea 44 из 200 (22 % кликабельно),
   остальное — пустая площадь внутри рамки. Растягиваем textarea на всю рамку.
   ============================================================================ */
@media(max-width:767px){
  #apply .form-stack .field-message{align-items:stretch!important}
  #apply .form-stack .field-message .field-cap{order:1}
  #apply .form-stack .field-message>textarea.field{order:2;flex:1 1 100%;align-self:stretch;
    height:auto!important;min-height:120px!important;padding:0!important;border:0!important;
    background:transparent!important;resize:none}
}

/* ============================================================================
   16.09.2026 (продолжение 4) — /career/ 375: круглый +/− в карточках Numbers виден.
   Правка 1 ошибочно ставила visibility:hidden. В каноне 560:11543 кнопка НАРИСОВАНА:
   круг 32x32 #009294 с белым плюсом (в раскрытой 560:11545 — минус), поэтому её надо
   показывать, а не скрывать. Геометрия от этого не меняется (бокс 32px остаётся),
   переносы заголовков сохраняются: 183 → 1/1/3/1/3/2 строки = 80/80/106/80/106/84.
   ============================================================================ */
@media(max-width:767px){
  .container.career-benefits .benefit .benefit-toggle{visibility:visible!important;opacity:1!important}
}

/* ============================================================================
   16.09.2026 (продолжение 5) — /career/ 375: раскрытая карточка Numbers = канон 798.
   Канон 560:11545: Cards 311x204 = pad 16 + шапка 66 + 8 + абзац 279x90 (5 строк 18) + pad 24.
   Живой вариант давал 222: `.benefit{display:flex!important}` из responsive.css:206
   ставил .benefit-detail ВТОРЫМ СТОЛБЦОМ (абзац 165px → 9 строк). В макете карточка
   вертикальная: шапка, затем абзац на всю ширину. Плюс нижний отступ абзаца 12 → 8.
   ============================================================================ */
@media(max-width:767px){
  .container.career-benefits .benefit{display:block!important}
  .container.career-benefits .benefit.open .benefit-detail p{margin:8px 0 0!important;
    font-size:16px!important;line-height:18px!important;max-width:100%!important}
}

/* ============================================================================
   16.09.2026 (продолжение 6) — /career/ 375: блок наград — геометрия стрелок.
   Канон мобильный (560:11584): карточка pad 24/16 (живой был 16), карусель — одно
   фото 200x282 по центру, стрелки 40x40 стоят в боковых полях РОВНО ПО ЦЕНТРУ фото
   (как в десктопном 392:7582: «Button 40x40 y=3237» при фото y=3087..3427).
   Живой вариант ставил стрелки столбцом над/под фото (stage flex-column), из-за чего
   они не были выровнены с картинкой. 141 = 282/2 — центр канонной картинки.
   max-width:calc(100% - 104px) не даёт картинке наехать на стрелки на 320px.
   ============================================================================ */
@media(max-width:767px){
  .container.awards-widget{padding:24px 16px!important}
  .awards-stage{position:relative!important;display:block!important;padding:0!important;
    gap:0!important;min-height:0!important}
  .awards-stage .awards-doc{display:block!important;margin:0 auto!important;
    width:auto!important;max-width:calc(100% - 104px)!important;height:282px!important}
  .awards-nav{position:absolute!important;top:141px!important;transform:translateY(-50%)!important;
    margin:0!important;z-index:3!important}
  .awards-nav--prev{left:0!important}
  .awards-nav--next{right:0!important}
  .awards-meta{margin-top:12px!important}
}

/* ============================================================================
   16.09.2026 (продолжение 7) — /career/ 375: рамка поля «Сообщение».
   Канон 560:11636: Text Field 343x200 — это РАМКА 1px #85BAAF, r12, фон #fff, pad 16,
   метка внутри. Живой блок потерял рамку: правило из @media(min-width:1024px)
   (.form-stack>.field-message{border:1px solid #85baaf;...}) на мобильном не действует,
   а мои правки обнулили рамку у внутренней textarea. Возвращаем рамку контейнеру.
   ============================================================================ */
@media(max-width:767px){
  #apply .form-stack .field-message{border:1px solid #85BAAF!important;border-radius:12px!important;
    background:#fff!important;box-sizing:border-box!important}
}

/* ============================================================================
   16.09.2026 (карточка t_2f5d66bb) — таблицы с фото в материалах /news/<slug>.html
   не влезают в вьюпорт на телефоне (320-472 px).

   Причина (замер @375, контейнер 343): у части фото ширина задана инлайном в контенте
   БД — `<img src="..." style="max-width: 400px">` / `max-width: 165px` — рядом с
   `td{width:60%}`. Инлайновая ширина картинки входит в min-content колонки таблицы,
   поэтому таблица считается по ней: 421+21 = 442...459 px при контейнере 343.
   `overflow-x:auto` у таблицы (правило 10.09 выше) ограничивает <table>, но НЕ ячейки:
   5-8 элементов (td/tr/tbody/img) уезжают за вьюпорт на 320-472 и фото обрезается
   правым краем (видно на 375: фото 400 px при main 343).

   Правка: на мобильной ширине разрешаем фото в контенте сжиматься до колонки.
   Инлайн-стиль перебивается только !important; медиа-обёртка обязательна —
   без неё правило растягивает фото на десктопе (замер: 400 -> 698 px при контейнере 1200).

   Границы доказаны замером (шаг 4 px + 412/414/430/500/540/600/700): переполнение
   только при <=472, т.е. медиа(max-width:767px) с запасом; от 480 правилу нечего делать,
   а от 768 оно и не применяется.
   ============================================================================ */
@media(max-width:767px){
  body.news-page main table img{max-width:100%!important;height:auto!important}
}

/* t_b4237601: /clients/ FAQ @1024 — Figma 1242:18265 (944x788): 1 column, not 2.
   At 1024 the canon lays all 6 cards vertically (Frame 1051 VERTICAL gap 8),
   each 880px wide. Desktop 2-column applies at >=1025 (1280 frame 1077:13365). */
@media(max-width:1024px){.faq-grid{grid-template-columns:1fr!important}}

/* t_61ac6914: /clients/ @375 — «Наши лаборатории» лента карточек 239×238 + пейджер (кадр 1255:18667) */
@media(max-width:767px){
  .labs-section{padding:0!important}
  .labs-title{font-size:24px!important;line-height:26px!important;margin:0 0 16px!important}
  .labs-tabs{display:none!important}
  .labs-carousel{display:flex;flex-direction:column;gap:16px}
  .labs-carousel__viewport{overflow-x:auto;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;display:flex;width:100%}
  .labs-carousel__viewport::-webkit-scrollbar{display:none}
  .labs-carousel__track{display:flex;gap:8px;scroll-snap-type:x mandatory}
  .labs-carousel__card{flex:0 0 239px;width:239px;height:238px;border-radius:16px;overflow:hidden;position:relative;scroll-snap-align:start;cursor:pointer}
  .labs-carousel__card img{width:100%;height:100%;object-fit:cover;border-radius:16px}
  .labs-carousel__label{position:absolute;left:16px;bottom:16px;right:16px;background:rgba(0,146,148,.92);color:#fff;font-size:14px;line-height:16px;font-weight:400;padding:8px 16px;border-radius:12px;text-align:center;white-space:normal}
  .labs-carousel__pager{display:flex;gap:6px;justify-content:center;width:100%}
  .labs-carousel__dot{width:8px;height:8px;border-radius:100px;background:#CCF2EA;border:0;padding:0;cursor:pointer;transition:background .2s}
  .labs-carousel__dot.active{background:#85BAAF}
}

/* t_c1441d36 (п.4 батча t_cdaedcca): чипы-рубрики полосы фильтров «Награды» — канон
   кадра 182:4213 (замер аудита блока: паддинг чипа 16 против канонных 12, радиус 15
   против канонного 100). Реальный класс в DOM — .awards-filter (кнопка, widgets.js
   создаёт его в .awards-filters); селектор с .awards-widget скоупит правку виджетом
   (главная /about/ /career/), а не по id секции. base.css держит h30 и цвета
   #F3F7FA/#009294/#CCF2EA — их не трогаем; responsive.css ≤767 (pad 7/11, gap 6)
   гасится его же специфичностью в медиа — там кадр мобильного (493:7845) уже даёт
   pad 12 (fb-canon-20260914.css ≤767, карточка t_1508e5cb), поэтому правка ≥768. */
@media(min-width:768px){
  .awards-widget .awards-filters{gap:8px}
  .awards-widget .awards-filters .awards-filter{
    padding:0 12px!important;border-radius:100px!important;height:30px!important;min-height:30px!important}
}

/* ═══ БАТЧ t_d49cbae8 — /about/ + /career/ канон 1024/1280 ═══
   Целевой слой: prod www (MODX, шаблон 21). Каноны из Figma API z51MVZ2MBMlTUIZd8SjVUo. */

/* B) t_ba52cb3c: «Решаем комплексные…» @1024 — канон 1239:19163 (944x764):
   фото 354x574, сетка 502x574: 3 ряда (186/208/164) по 2 карточки 247w gap 8 (+ один
   скрытый слот 205.75 = бейджный вариант HIDDEN), заголовок 24/26 (464x78, БЕЗ <br>),
   pad 40/32, gap между фото и сеткой 24. Живое: фото 463x526, сетка 385 (2 кол. 232/226),
   правый край 952 (7px обрезка), заголовок с 2 <br>. */
@media(min-width:1024px) and (max-width:1279px){
  .services-block{padding:40px 32px;gap:32px}
  .services-block__title{font-size:24px!important;line-height:26px!important;max-width:464px}
  .services-block__title br{display:none}
  .services-block__content{gap:24px}
  .services-block__photo{width:354px;flex:0 0 354px;height:574px;max-height:574px}
  .services-block__photo img{height:574px}
  .services-block__grid{height:574px;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-content:start}
  .services-card{width:auto;min-height:186px;padding:18px 18px 24px}
  .services-card:nth-child(3n+1){display:none}   /* 3-й слот каждой тройки в кадре — скрытый бейджный вариант */
  .services-card__icon{width:40px;height:40px}
  .services-card__body h3{font-size:18px;line-height:22px;font-weight:400}
}

/* C) t_ba52cb3c: Меркурий @1024 — канон 1239:19286 (944x1178):
   плейсхолдер 944x500 r24 СВЕРХУ, ниже лента 733x460 по центру (3 карточки 239x460,
   img 239x340 + body 104). Живое: одна строка (плейсхолдер 436 + карточки от 1002 —
   третья обрезана на 217px). */
@media(min-width:1024px) and (max-width:1279px){
  .mercury-grid{flex-direction:column;gap:32px}
  .mercury-placeholder{width:100%!important;flex:0 0 auto;height:500px}
  .mercury-awards{width:733px;max-width:100%;margin-left:auto;margin-right:auto;flex:0 0 auto;overflow-x:auto}
}
/* E) t_22374a1f: Меркурий @1280 — канон 989:11529 (1201x646): голова 146 (h2 32/34 2 строки
   + подпись 16/18), строка 460: плейсхолдер 436x340 + лента 733 (3 карточки 239x460 gap 8).
   Живое: 714 (+68) — карточки уже 239x460, но голова выше (note растянут max-width:698
   на 4 строки вместо 2) и зазор голова→сетка 40. Сводим голову к канону. */
@media(min-width:1280px){
  .mercury-head{margin-bottom:40px}
  .mercury-head h2{max-width:698px}
  .mercury-note{max-width:698px;font-size:16px!important;line-height:18px!important}
}

/* F) t_97c64ab2: История @1280 — канон 989:11530 (1200x524): h2 32/34 (609x34) + слайд 450:
   фото 495x450 r16, текст-колонка 370x282 (заголовок события 24/26 + текст 16/18),
   рельс годов 181x450 (вертикаль, кегли 24/30/40/50/60/50/40/30/24), зазор h2→слайд 40. */
@media(min-width:1280px){
  .history-widget{grid-template-columns:495px 1fr 181px;gap:32px;align-items:stretch}
  .history-media{min-height:450px;height:450px}
  .history-years{flex-direction:column;height:100%;gap:0}
  .history-year{white-space:nowrap}
  .history-rail{max-height:none}
}
/* G) t_97c64ab2: История @1024 — канон 1239:19241 (944x356): h2 32/34 + слайд 282:
   фото 309x282 r16, текст-колонка 443x228, рельс 113x282 (кегли 15/18/24/32/36/32/24/18/15). */
@media(min-width:1024px) and (max-width:1279px){
  .history-widget{grid-template-columns:309px 1fr 113px;gap:32px}
  .history-media{min-height:282px;height:282px}
  .history-years{flex-direction:column;gap:0}
  .history-rail{max-height:none}
  /* кегли канона 1024 */
  .history-years .history-year{font-size:15px}
  .history-years .history-year:nth-child(2){font-size:18px}
  .history-years .history-year:nth-child(3){font-size:24px}
  .history-years .history-year:nth-child(4){font-size:32px}
  .history-years .history-year:nth-child(5){font-size:36px;font-weight:500}
  .history-years .history-year:nth-child(6){font-size:32px}
  .history-years .history-year:nth-child(7){font-size:24px}
  .history-years .history-year:nth-child(8){font-size:18px}
  .history-years .history-year:nth-child(9){font-size:15px}
}

/* I) t_97c64ab2: Numbers @1024 — канон 1239:19143 (944x1033), живое 1054 (+21):
   сетка статов: карточка 288x240 pad 40/24/24/24 (значение 60/60 + подпись 16/18).
   Живые ряды выше — сводим карточку к 240. */
@media(min-width:1024px) and (max-width:1279px){
  .stats-grid>.stat{min-height:240px;height:auto;padding:40px 24px 24px}
  .stats-grid>.stat-media{min-height:240px;height:240px}
  .stats-grid>.stat-year{min-height:240px;height:auto;padding:40px 24px 24px}
}

/* === fb: галерея карьеры — 12 кадров, 6 в сетке (2026-09-29) === */
.gallery-grid img:nth-child(n+7){display:none}
.gallery .gallery-grid img:nth-child(1),.gallery .gallery-grid img:nth-child(6){width:calc((100% - 16px) * 0.4142)}
@media(max-width:767px){
  .gallery .gallery-grid img:nth-child(n+7){display:none}
}

/* ── История компании: активный год вылезал за границы блока (владелец 05.10.2026) ──
   Активный год (60px, подложка pad 6/18) занимает 180px в колонке 181px, а глобальное
   `.history-year.active{transform:scale(1.18)}` раздувало бокс до 212px: правый край уходил
   на 31px за блок и обрезался `.history-rail{overflow:hidden}` (rail.scrollWidth 213 >
   clientWidth 181). Кадр-канон History (Figma 989:11344): активный год — 60px без масштаба,
   ширины хватает (текст 144 + паддинг 36 = 180 ≤ 181). Масштаб снимаем только на вертикальном
   рейле (≥1101px); мобильная/планшетная лента (≤1100px, горизонтальный скролл) не тронута. ── */
@media (min-width:1101px){
  .history-year.active{transform:none}
}

/* ── Страница /awards/ «Награды и благодарности» (владелец 05.10.2026) ──
   Карточки наград — тот же вид, что карточки в /news/ (.news-list .news-card), но
   изображения — сканы грамот 390×550, поэтому внутри плитки они показываются целиком
   (object-fit:contain), иначе object-fit:cover срезает верх и низ документа. ── */
.awards-page .news-card__media{height:266px;background:#f1f5f6}
.awards-page .news-card__media img{object-fit:contain}
.awards-page .news-card:hover .news-card__media img{transform:none}
@media(max-width:767px){
  .awards-page .news-card__media{height:220px}
}