/* 113-я, страницы заводов /zavody и /zavody/<id> (эскиз oap_dsgn_2026 brand\r2\a.html, принят 29.10.2026).
   Всё внутри .oapz — на остальной сайт не влияет. Цвета и шрифты — сайта (#1b6bb1, Open Sans / Lato); цвет завода — --bc (и --ba у LEON). */
.oapz {
  --o-blue: #1b6bb1; --o-blue-2: #155a96;
  --o-ink: #222; --o-ink-2: #424242; --o-ink-3: #555; --o-ink-4: #6b6b6b; --o-ink-5: #9e9e9e;
  --o-bg: #f5f5f5; --o-bg-2: #eee; --o-sky: #f5f9fd; --o-sky-2: #e9f1fb;
  --o-line: #e5e5e5; --o-line-2: #d0d0d0; --o-line-sky: #d1e0ed;
  --o-ok: #2e6b1f; --o-ok-bg: #e7f4e4; --o-wa: #3ba535;
  --o-text: 'Open Sans', Arial, sans-serif; --o-head: 'Lato', 'Open Sans', Arial, sans-serif;
  --bc: var(--o-blue); --ba: var(--bc);
  color: var(--o-ink); font: 400 14px/1.45 var(--o-text); padding-bottom: 40px;
}
.oapz *, .oapz *::before, .oapz *::after { box-sizing: border-box; }
.oapz img { max-width: 100%; }
.oapz a { color: var(--o-blue); }
.oapz a:hover, .oapz a:focus { text-decoration: none; }
.oapz h2, .oapz h3 { font-family: var(--o-head); font-weight: 400; color: var(--o-ink); }

/* общее */
.oapz .z-sec { padding: 44px 0 0; }
.oapz .z-h { display: flex; align-items: baseline; justify-content: space-between; gap: 8px 24px; flex-wrap: wrap; margin: 0 0 18px; }
.oapz .z-h h2 { font-size: 26px; line-height: 1.2; margin: 0; }
.oapz .z-h p { margin: 0; color: var(--o-ink-4); font-size: 14px; }
.oapz .z-h .all { color: var(--o-blue); text-decoration: none; font-size: 14px; white-space: nowrap; }
.oapz .z-h .all .fa { font-size: 12px; margin-left: 3px; }
.oapz .lg { display: flex; align-items: center; min-width: 0; }
.oapz .lg img { max-height: 100%; max-width: 100%; width: auto; object-fit: contain; }
.oapz .lg .word { font: 900 34px/1 var(--o-head); letter-spacing: .04em; color: var(--bc); }
.oapz .lg .word-leon { text-shadow: 2px 2px 0 var(--ba); }
.oapz .lg .word-frey { font-style: italic; letter-spacing: .1em; }
.oapz .chip { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; line-height: 1; padding: 5px 8px; border-radius: 4px; background: var(--o-bg); color: var(--o-ink-3); white-space: nowrap; }
.oapz .chip img { height: 14px; width: auto; }

/* шапка завода */
.oapz .hero { position: relative; margin-top: 4px; padding: 28px 30px 24px; border: 1px solid var(--o-line); border-radius: 8px; overflow: hidden;
  background: linear-gradient(180deg, var(--o-sky) 0, #fff 70%); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px 40px; align-items: center; }
.oapz .hero::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 5px; background: linear-gradient(90deg, var(--bc) 0 72%, var(--ba) 72%); }
.oapz .hero .lg { height: 66px; } .oapz .hero .lg img { max-height: 62px; max-width: 260px; } .oapz .hero .lg .word { font-size: 50px; }
.oapz .hero.forga .lg img { height: 52px; max-height: none; max-width: none; width: auto; margin-left: -120px; }   /* логотип брендбука со шлейфом за левый край (30.10) */
.oapz .hero .fac { color: var(--o-ink-2); display: flex; gap: 8px; align-items: baseline; margin: 16px 0; font-size: 15px; }
.oapz .hero .fac .fa { color: var(--bc); }
.oapz .lines { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.oapz .lines > span { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; color: var(--o-ink-3); padding: 5px 10px; border: 1px solid var(--o-line); border-radius: 4px; background: #fff; }
.oapz .lines > span small { color: var(--o-ink-5); font-size: 12px; } .oapz .lines > span img { height: 14px; }
.oapz .lines > em { font-style: normal; font-size: 13px; color: var(--o-ink-4); margin-right: 4px; }
.oapz .stats { display: grid; grid-template-columns: repeat(2, auto); border: 1px solid var(--o-line); border-radius: 8px; background: #fff; align-self: start; }
.oapz .stats > div { padding: 16px 22px; } .oapz .stats > div + div { border-left: 1px solid var(--o-line); }
.oapz .stats b { display: block; font: 300 36px/1 var(--o-head); font-variant-numeric: tabular-nums; }
.oapz .stats span { font-size: 12.5px; color: var(--o-ink-4); white-space: nowrap; }
.oapz .stats .st b, .oapz .stats .av b { color: var(--o-ok); } .oapz .stats .pre b { color: var(--o-blue); } .oapz .stats .none b { color: var(--o-ink-5); }

/* шапка: 4 цифры (наши данные: артикулов, доступно для заказа, сертификатов ЕАЭС, последнее поступление) */
.oapz .stats.s4 { grid-template-columns: repeat(4, auto); }
.oapz .stats .ce b, .oapz .stats .la b { color: var(--o-ink-2); }

/* промо заводов (сбор 29.10): галерея склада / производства / выставок, знаки, продукция → каталог, упаковка, баннеры */
.oapz .marks { display: flex; gap: 10px; align-items: center; }
.oapz .marks img { height: 54px; width: auto; }
.oapz .gal { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.oapz .gal button { position: relative; padding: 0; border: 0; border-radius: 6px; overflow: hidden; cursor: zoom-in; background: var(--o-bg); aspect-ratio: 4 / 3; }
.oapz .gal button:first-child { grid-column: span 2; grid-row: span 2; aspect-ratio: auto; }
/* широкие — по высоте соседних 4 : 3 (30.10: с aspect-ratio auto высоту задавала картинка — ряд вытягивался, LEON) */
.oapz .gal button.w2 { grid-column: span 2; aspect-ratio: 8 / 3; } .oapz .gal button.w3 { grid-column: span 3; aspect-ratio: 4 / 1; } .oapz .gal button.w4 { grid-column: 1 / -1; aspect-ratio: 4 / 1; }
.oapz .gal img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; display: block; }
.oapz .gal button:hover img { transform: scale(1.03); }
.oapz .gal span { position: absolute; left: 0; right: 0; bottom: 0; padding: 16px 10px 7px; color: #fff; font-size: 12.5px; text-align: left; background: linear-gradient(180deg, transparent, rgba(10,20,32,.7)); }
.oapz .tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.oapz .tiles a { display: grid; gap: 4px; padding: 10px 10px 12px; border: 1px solid var(--o-line); border-radius: 8px; background: #fff; text-decoration: none; color: var(--o-ink); transition: border-color .15s, box-shadow .15s; }
.oapz .tiles a:hover { border-color: var(--bc); box-shadow: 0 6px 18px rgba(15,42,73,.08); }
.oapz .tiles .ph { aspect-ratio: 4 / 3; display: grid; place-items: center; overflow: hidden; }
.oapz .tiles .ph img { max-width: 100%; max-height: 100%; object-fit: contain; }
.oapz .tiles b { font-weight: 600; font-size: 14.5px; } .oapz .tiles small { font-size: 12.5px; color: var(--o-ink-4); }
.oapz .packs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.oapz .packs button { position: relative; padding: 0; border: 1px solid var(--o-line); border-radius: 8px; overflow: hidden; cursor: zoom-in; background: #fff; }
.oapz .packs img { width: 100%; display: block; aspect-ratio: 1000 / 357; object-fit: cover; }
.oapz .packs span { display: block; padding: 8px 10px; font-size: 13px; color: var(--o-ink-3); text-align: left; }
.oapz .lbanners { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.oapz .lbanners a { display: block; border-radius: 8px; overflow: hidden; box-shadow: 0 0 0 1px var(--o-line); transition: box-shadow .15s, transform .15s; }
.oapz .lbanners a:hover { box-shadow: 0 10px 26px rgba(15,42,73,.16); transform: translateY(-2px); }
.oapz .lbanners img { width: 100%; display: block; }

/* «О бренде»: текст | видео (или паспорт), затем медиа | текст */
.oapz .about { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 40px; align-items: center; }
.oapz .about.rev { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); }
.oapz .about .txt h2 { font-size: 26px; line-height: 1.2; margin: 0 0 12px; }
.oapz .about .eyebrow { display: block; font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--bc); font-weight: 600; margin-bottom: 8px; }
.oapz .about .txt p { font-size: 15px; line-height: 1.7; color: var(--o-ink-2); margin: 0 0 14px; max-width: 64ch; }
.oapz .about2 { padding-top: 56px; }
.oapz .facts { list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 10px; }
.oapz .facts li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 8px; align-items: baseline; font-size: 14px; }
.oapz .facts .fa { color: var(--bc); font-size: 16px; text-align: center; }
.oapz .vid { position: relative; margin: 0; border-radius: 8px; overflow: hidden; background: #0f1a26; aspect-ratio: 16 / 9; }
.oapz .vid video { width: 100%; height: 100%; object-fit: cover; display: block; background: #0f1a26; }
.oapz .vid .play { position: absolute; inset: 0; display: grid; place-items: center; border: 0; background: linear-gradient(180deg, rgba(10,20,32,0) 40%, rgba(10,20,32,.55)); cursor: pointer; width: 100%; }
.oapz .vid .play span { width: 74px; height: 74px; border-radius: 50%; background: rgba(255,255,255,.94); display: grid; place-items: center; color: var(--o-blue); box-shadow: 0 8px 30px rgba(0,0,0,.3); transition: transform .15s; }
.oapz .vid .play:hover span { transform: scale(1.06); }
.oapz .vid .play svg { width: 30px; height: 30px; margin-left: 4px; }
.oapz .vid figcaption { position: absolute; left: 16px; right: 16px; bottom: 12px; color: #fff; font-size: 14px; font-weight: 600; display: flex; justify-content: space-between; gap: 10px; pointer-events: none; text-shadow: 0 1px 3px rgba(0,0,0,.5); }
.oapz .vid figcaption small { font-weight: 400; opacity: .85; }
.oapz .vid.on .play, .oapz .vid.on figcaption { display: none; }
.oapz .vthumbs { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 8px; margin-top: 8px; }
.oapz .vthumbs button { position: relative; border: 2px solid transparent; border-radius: 6px; overflow: hidden; padding: 0; cursor: pointer; background: #0f1a26; aspect-ratio: 16 / 9; }
.oapz .vthumbs button[aria-pressed="true"] { border-color: var(--o-blue); }
.oapz .vthumbs img { width: 100%; height: 100%; object-fit: cover; opacity: .9; }
.oapz .vthumbs span { position: absolute; left: 6px; right: 6px; bottom: 5px; color: #fff; font-size: 11.5px; text-align: left; text-shadow: 0 1px 3px rgba(0,0,0,.7); line-height: 1.25; }
.oapz .vthumbs .fa { position: absolute; top: 6px; left: 7px; color: #fff; font-size: 13px; text-shadow: 0 1px 3px rgba(0,0,0,.6); }
.oapz .pass { border: 1px solid var(--o-line); border-radius: 8px; background: var(--o-sky); padding: 8px 22px 10px; }
.oapz .pass h3 { font: 400 13px var(--o-text); letter-spacing: .1em; text-transform: uppercase; color: var(--o-ink-4); margin: 14px 0 4px; }
.oapz .pass dl { margin: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); font-size: 14px; }
.oapz .pass dt, .oapz .pass dd { padding: 10px 0; border-bottom: 1px dashed var(--o-line-sky); }
.oapz .pass dt { color: var(--o-ink-4); padding-right: 14px; font-weight: 400; } .oapz .pass dd { margin: 0; text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.oapz .pass dl > :nth-last-child(-n+2) { border-bottom: 0; }
.oapz .photos2 { display: grid; grid-template-columns: 1.3fr 1fr; grid-template-rows: repeat(3, minmax(0, 132px)); gap: 8px; }
.oapz .photos2 button { position: relative; padding: 0; border: 0; border-radius: 6px; overflow: hidden; cursor: zoom-in; background: var(--o-bg); }
.oapz .photos2 button:first-child { grid-row: span 3; }
.oapz .photos2 button:nth-child(n+5) { display: none; }
.oapz .photos2 img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.oapz .photos2 button:hover img { transform: scale(1.03); }
.oapz .photos2 span { position: absolute; left: 0; right: 0; bottom: 0; padding: 16px 10px 7px; color: #fff; font-size: 12.5px; text-align: left; background: linear-gradient(180deg, transparent, rgba(10,20,32,.7)); }
.oapz .photos2 em { position: absolute; right: 8px; top: 8px; background: rgba(10,20,32,.6); color: #fff; font-size: 12px; font-style: normal; padding: 3px 8px; border-radius: 10px; }
.oapz .dfeat { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.oapz .dfeat button { display: grid; gap: 8px; padding: 10px; border: 1px solid var(--o-line); border-radius: 8px; background: #fff; cursor: zoom-in; text-align: left; font: inherit; color: inherit; }
.oapz .dfeat button:hover { border-color: var(--o-blue); }
.oapz .dfeat img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: top; border-radius: 4px; }
.oapz .dfeat b { font-size: 13.5px; } .oapz .dfeat small { font-size: 12px; color: var(--o-ink-4); }
.oapz .collage { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.oapz .collage a { display: grid; grid-template-rows: 1fr auto; gap: 6px; padding: 12px; border: 1px solid var(--o-line); border-radius: 8px; background: #fff; text-decoration: none; color: var(--o-ink); }
.oapz .collage a:hover { border-color: var(--o-blue); }
.oapz .collage .ph { aspect-ratio: 4 / 3; display: grid; place-items: center; min-width: 0; overflow: hidden; }
.oapz .collage img { max-width: 100%; max-height: 100%; object-fit: contain; }
.oapz .collage small { font-size: 12px; color: var(--o-ink-4); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .oapz .collage small b { color: var(--o-blue); font-weight: 600; }

/* документы */
.oapz .docs { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 10px; }
.oapz .docs button { display: grid; gap: 6px; align-content: start; padding: 8px 8px 10px; border: 1px solid var(--o-line); border-radius: 6px; background: #fff; cursor: zoom-in; text-align: left; font: inherit; color: inherit; min-width: 0; }
.oapz .docs button:hover { border-color: var(--o-blue); }
.oapz .docs .ph { aspect-ratio: 3 / 4; overflow: hidden; border-radius: 3px; background: var(--o-bg); }
.oapz .docs .ph img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.oapz .docs b { font-size: 12.5px; font-weight: 600; line-height: 1.3; } .oapz .docs small { font-size: 11.5px; color: var(--o-ink-4); line-height: 1.3; }
.oapz .nodocs { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 18px 22px; border: 1px solid var(--o-line-sky); border-radius: 8px; background: var(--o-sky); }
.oapz .nodocs .ic { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: var(--o-blue); font-size: 22px; border: 1px solid var(--o-line-sky); }
.oapz .nodocs b { display: block; font-size: 15px; } .oapz .nodocs span { font-size: 13.5px; color: var(--o-ink-4); }
.oapz .z-btn { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 4px; border: 1px solid var(--o-wa); background: var(--o-wa); color: #fff; font-weight: 600; text-decoration: none; white-space: nowrap; }
.oapz .z-btn:hover { background: #33912e; color: #fff; }

/* товары полосами по стикерам сайта (цвет полосы = цвет стикера) */
.oapz .bnav { display: flex; flex-wrap: wrap; gap: 8px; }
.oapz .bnav a { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 6px 6px; border: 1px solid var(--o-line); border-radius: 18px; text-decoration: none; color: var(--o-ink); font-size: 13.5px; background: #fff; }
.oapz .bnav a:hover { border-color: var(--o-blue); }
.oapz .bnav i { font: 600 11px/1 var(--o-text); font-style: normal; color: #fff; padding: 5px 8px; border-radius: 12px; background: var(--tag); }
.oapz .bnav b { font-weight: 600; font-variant-numeric: tabular-nums; }
.oapz .bands { display: grid; gap: 18px; }
.oapz .band { border-radius: 8px; padding: 16px 16px 18px; background: var(--tint); border: 1px solid var(--edge); scroll-margin-top: 80px; }
.oapz .t-new { --tint: #effbf3; --edge: #c6eed5; --tag: #1edb71; }
.oapz .t-promo { --tint: #faf1f1; --edge: #ecd3d3; --tag: #b85c5c; }
.oapz .t-hit { --tint: #fff7e8; --edge: #f6dfb2; --tag: #ffa500; }
.oapz .band .bh { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; margin-bottom: 12px; }
.oapz .band .tag { font: 600 12px/1 var(--o-text); color: #fff; background: var(--tag); padding: 6px 10px; border-radius: 4px; }
.oapz .band h3 { font-size: 20px; line-height: 1.2; margin: 0; }
.oapz .band .cnt { font-size: 13px; color: var(--o-ink-4); }
.oapz .band .all { margin-left: auto; color: var(--o-blue); font-size: 14px; text-decoration: none; white-space: nowrap; }
.oapz .row6 { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
/* карточка товара — как плитка каталога, без корзины и остатка: только ссылка на карточку (заказчик 29.10) */
.oapz .pc { overflow: hidden; display: flex; flex-direction: column; gap: 4px; padding: 12px; background: #fff; border: 1px solid var(--o-line);
  border-radius: 6px; text-decoration: none; color: var(--o-ink); transition: border-color .15s, box-shadow .15s; min-width: 0; }
.oapz .pc:hover { border-color: var(--o-blue); box-shadow: 0 4px 14px rgba(15,42,73,.08); }
.oapz .pc .ph { display: grid; place-items: center; aspect-ratio: 1; margin-bottom: 6px; min-width: 0; overflow: hidden; position: relative; }
.oapz .pc .ph img { max-height: 100%; max-width: 100%; object-fit: contain; }
.oapz .pc .ph.nop { background: var(--o-bg); border-radius: 6px; color: var(--o-ink-5); font-size: 38px; }   /* товар без фото (поступления, 30.10) */
.oapz .pc .stk { position: absolute; left: 0; top: 0; display: grid; gap: 3px; justify-items: start; }
.oapz .pc .stk i { font: 600 11px/1 var(--o-text); font-style: normal; color: #fff; padding: 5px 9px; border-radius: 3px; }
.oapz .pc .stk .hit { background: #ffa500; } .oapz .pc .stk .new { background: #1edb71; } .oapz .pc .stk .promo { background: #b85c5c; }
.oapz .pc .ba { font-size: 11.5px; color: var(--o-ink-4); letter-spacing: .03em; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.oapz .pc .ba b { color: var(--o-blue); font-weight: 600; }
.oapz .pc .fin { font-size: 11.5px; color: var(--o-ok); }
.oapz .pc .nm { font-size: 14px; line-height: 1.3; }
.oapz .pc .car { font-size: 12px; color: var(--o-ink-4); line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.oapz .pc .pr { font: 700 18px var(--o-text); margin-top: auto; padding-top: 4px; }
.oapz .pc .go { font-size: 13px; color: var(--o-blue); }
/* авторизованным — как в каталоге (oap-catalogue-redesign.css: .product_div_discount, .product_div_personal): метка скидки, «Вы покупали»,
   «В корзине»; цену подставляет lenta.js. Метка встаёт над ценой и забирает margin-top:auto у цены */
.oapz .pc .pext { margin-top: auto; display: flex; flex-direction: column; gap: 3px; padding-top: 4px; }
.oapz .pc .pext + .pr { margin-top: 0; padding-top: 2px; }
.oapz .pc .pdisc { font-size: 11px; line-height: 1.4; color: #1b6bb1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.oapz .pc .ppers { display: flex; flex-wrap: wrap; gap: 3px 8px; align-items: center; font-size: 11px; line-height: 1.5; }
.oapz .pc .pbought { color: #27ae60; white-space: nowrap; }
.oapz .pc .pincart { color: #27ae60; white-space: nowrap; padding: 1px 6px; background: #e9f8ef; border-radius: 2px; }
.oapz .pc .ppers .fa { font-size: 10px; }

/* подбор по авто, другие заводы */
.oapz .makes { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }
.oapz .makes a { display: grid; justify-items: center; gap: 6px; padding: 12px 6px 10px; border: 1px solid var(--o-line); border-radius: 6px; text-decoration: none; color: var(--o-ink); font-size: 13px; text-align: center; }
.oapz .makes a:hover { border-color: var(--o-blue); }
.oapz .makes img { height: 30px; width: auto; }
.oapz .makes .no { height: 30px; display: grid; place-items: center; font: 900 15px var(--o-head); color: var(--o-ink-5); }
.oapz .makes small { color: var(--o-ink-4); font-size: 12px; }
.oapz .others { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.oapz .others a { display: grid; justify-items: center; gap: 8px; padding: 16px 10px 12px; border: 1px solid var(--o-line); border-radius: 6px; text-decoration: none; color: var(--o-ink-4); font-size: 12.5px; position: relative; overflow: hidden; }
.oapz .others a::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: linear-gradient(90deg, var(--bc) 0 72%, var(--ba) 72%); }
.oapz .others a:hover { border-color: var(--bc); }
.oapz .others .lg { height: 36px; } .oapz .others .lg img { max-height: 30px; max-width: 130px; } .oapz .others .lg .word { font-size: 22px; }
/* FORGA — тёмная, как плашка на главной (заказчик 30.10: «большую там делать не нужно, а чтобы тёмная вся была — нужно») */
.oapz .others a.forga { isolation: isolate; color: rgba(255, 255, 255, .75); border-color: #1c2740;
  background: radial-gradient(90% 130% at 85% 0%, rgba(79, 134, 219, .4), rgba(41, 68, 115, .14) 55%, transparent 76%), #0a101c; }
.oapz .others a.forga::before { background: linear-gradient(90deg, #4a7bd0, #8db2f2); }
.oapz .others a.forga:hover { border-color: #4a7bd0; box-shadow: 0 8px 22px rgba(7, 11, 20, .3); }
.oapz .others a.forga .lg img { width: 100%; max-width: 190px; height: auto; max-height: none; }

/* /zavody и главная: плашки заводов */
.oapz .plates { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.oapz .plate { position: relative; display: grid; grid-template-rows: 64px auto 1fr auto; gap: 12px; padding: 22px 22px 18px; background: #fff; border: 1px solid var(--o-line);
  border-radius: 8px; text-decoration: none; color: var(--o-ink); overflow: hidden; transition: border-color .15s, box-shadow .15s; }
.oapz .plate::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 5px; background: linear-gradient(90deg, var(--bc) 0 72%, var(--ba) 72%); }
.oapz .plate:hover { border-color: var(--bc); box-shadow: 0 6px 20px rgba(15,42,73,.1); }
.oapz .plate .lg { height: 64px; } .oapz .plate .lg img { max-height: 56px; max-width: 210px; }
.oapz .plate .fac { font-size: 14px; color: var(--o-ink-2); display: flex; gap: 8px; align-items: baseline; }
.oapz .plate .fac .fa { color: var(--bc); font-size: 13px; }
.oapz .plate .subs { display: flex; flex-wrap: wrap; gap: 6px; align-content: start; }
.oapz .plate .nums { display: grid; grid-template-columns: repeat(2, auto) 1fr; align-items: end; gap: 14px; border-top: 1px solid var(--o-line); padding-top: 12px; }
.oapz .plate .nums b { display: block; font: 400 24px/1 var(--o-head); color: var(--o-ink); }
.oapz .plate .nums span { font-size: 12.5px; color: var(--o-ink-4); white-space: nowrap; }
.oapz .plate .nums .st b, .oapz .plate .nums .av b { color: var(--o-ok); } .oapz .plate .nums .pre b { color: var(--o-blue); } .oapz .plate .nums .none b { color: var(--o-ink-5); }
.oapz .plate .go { justify-self: end; color: var(--o-blue); font-size: 13.5px; white-space: nowrap; }
.oapz .plate:hover .go { color: var(--o-blue-2); text-decoration: underline; }
.oapz .bsum { display: flex; flex-wrap: wrap; gap: 6px 22px; color: var(--o-ink-4); font-size: 14px; }
.oapz .bsum b { color: var(--o-ink); font-weight: 600; }

/* просмотр фото и документов */
.oapz-lb { position: fixed; inset: 0; z-index: 3000; background: rgba(8,14,22,.9); display: grid; grid-template-rows: minmax(0, 1fr) auto; padding: 50px 70px 20px; }
.oapz-lb[hidden] { display: none; }
.oapz-lb img { max-width: 100%; max-height: 100%; margin: auto; object-fit: contain; border-radius: 4px; background: #fff; }
.oapz-lb p { color: #fff; text-align: center; margin: 12px 0 0; font: 14px 'Open Sans', Arial, sans-serif; } .oapz-lb p small { opacity: .7; margin-left: 8px; }
.oapz-lb button { position: absolute; border: 0; background: rgba(255,255,255,.12); color: #fff; width: 46px; height: 46px; border-radius: 50%; font-size: 20px; cursor: pointer; }
.oapz-lb button:hover { background: rgba(255,255,255,.25); }
.oapz-lb .x { top: 14px; right: 16px; } .oapz-lb .pv { left: 14px; top: 50%; } .oapz-lb .nx { right: 14px; top: 50%; }

@media (max-width: 1100px) {
  .oapz .hero { grid-template-columns: minmax(0, 1fr); } .oapz .tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .oapz .row6 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .oapz .row6 .pc:nth-child(n+5) { display: none; }
  .oapz .makes { grid-template-columns: repeat(5, minmax(0, 1fr)); } .oapz .docs { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (max-width: 991px) { .oapz .plates { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) { .oapz .about, .oapz .about.rev { grid-template-columns: minmax(0, 1fr); gap: 22px; } .oapz .about.rev .txt { order: -1; } .oapz .about2 { padding-top: 40px; } }
@media (max-width: 767px) {
  .oapz .z-sec { padding-top: 32px; } .oapz .z-h h2, .oapz .about .txt h2 { font-size: 22px; }
  .oapz .hero { padding: 20px 14px 16px; } .oapz .hero .lg { height: 46px; } .oapz .hero .lg img { max-height: 42px; max-width: 200px; } .oapz .hero .lg .word { font-size: 36px; }
  .oapz .stats, .oapz .stats.s4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .oapz .stats.s4 > div:nth-child(3) { border-left: 0; } .oapz .stats.s4 > div:nth-child(n+3) { border-top: 1px solid var(--o-line); }
  .oapz .gal { grid-template-columns: repeat(2, minmax(0, 1fr)); } .oapz .gal button.w3 { grid-column: span 2; aspect-ratio: 8 / 3; } .oapz .tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .oapz .packs, .oapz .lbanners { grid-template-columns: minmax(0, 1fr); } .oapz .marks img { height: 40px; } .oapz .stats > div { padding: 12px 10px; } .oapz .stats b { font-size: 22px; } .oapz .stats span { font-size: 11px; white-space: normal; }
  .oapz .band { padding: 12px 10px 14px; } .oapz .band h3 { font-size: 17px; } .oapz .band .all { margin-left: 0; }
  .oapz .row6 { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 46%; overflow-x: auto; scroll-snap-type: x mandatory; padding: 12px 0 4px 12px; margin-left: -10px; }
  .oapz .row6 .pc { scroll-snap-align: start; } .oapz .row6 .pc:nth-child(n+5) { display: flex; }
  .oapz .makes { grid-template-columns: repeat(3, minmax(0, 1fr)); } .oapz .others { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .oapz .others .lg img { max-width: 100%; max-height: 24px; } .oapz .others .lg .word { font-size: 17px; }
  .oapz .photos2 { grid-template-rows: repeat(3, minmax(0, 90px)); }
  .oapz .docs { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .oapz .nodocs { grid-template-columns: minmax(0, 1fr); } .oapz .nodocs .ic { display: none; }
  .oapz .vid .play span { width: 58px; height: 58px; }
  .oapz .plates { gap: 10px; }
  .oapz .plate { padding: 16px 12px 12px; gap: 8px; grid-template-rows: 40px auto auto; }
  .oapz .plate .lg { height: 40px; } .oapz .plate .lg img { max-height: 34px; max-width: 100%; } .oapz .plate .lg .word { font-size: 24px; }
  .oapz .plate .fac { font-size: 12.5px; } .oapz .plate .fac .fa { display: none; }
  .oapz .plate .subs, .oapz .plate .go { display: none; }
  .oapz .plate .nums { grid-template-columns: minmax(0, 1fr); gap: 5px; padding-top: 8px; } .oapz .plate .nums > div { display: flex; align-items: baseline; gap: 6px; }
  .oapz .plate .nums b { font-size: 17px; } .oapz .plate .nums span { font-size: 11.5px; white-space: normal; line-height: 1.2; }   /* 30.10: «доступно для заказа» обрезалось */
  .oapz-lb { padding: 50px 10px 16px; } .oapz-lb .pv, .oapz-lb .nx { top: auto; bottom: 10px; } .oapz-lb .pv { left: 10px; } .oapz-lb .nx { right: 10px; }
}
/* телефон: с пометками «Вы покупали» / «В корзине» места мало — прячем строку машин (заказчик 29.10: «где места не хватает… что-то скрыть») */
@media (max-width: 600px) { .oapz .pc.has-pers .car { display: none; } }

/* ===== FORGA: страница в тёмных тонах и 3D-узел с forga.kz (заказчик 29.10: «элемент 3d… перенести на страницу бренда и страницу было
   бы круто сделать в тёмных тонах»). Палитра — forga.kz (фон #070B14, текст #E8EDF5, акцент #4A7BD0). Фон — во всю ширину окна
   (тень + clip-path, без сдвига вёрстки темы). Карточки товаров, марки авто, плашки заводов, упаковка — светлые «острова»: фото и логотипы
   на белом. --bc FORGA (#1a3567) на чёрном не виден — в тёмной теме акцент ярче. ===== */
.oapz.dk {
  --bc: #4a7bd0 !important; --ba: #4a7bd0 !important;
  --o-blue: #6a9be8; --o-blue-2: #8db2f2;
  --o-ink: #e8edf5; --o-ink-2: #c9d2e0; --o-ink-3: #aeb8c9; --o-ink-4: #8c97ab; --o-ink-5: #6b778c;
  --o-bg: #121c31; --o-bg-2: #18233b; --o-sky: #0c1322; --o-sky-2: #121c31;
  --o-line: rgba(232, 237, 245, .12); --o-line-2: rgba(232, 237, 245, .22); --o-line-sky: rgba(91, 141, 239, .32);
  --o-ok: #4cc27a; --o-ok-bg: rgba(76, 194, 122, .14);
  --dk: #070b14; --dk-2: #0c1322; --dk-3: #121c31;
  position: relative; background: var(--dk); color: var(--o-ink); padding: 18px 0 56px;
  box-shadow: 0 0 0 100vmax var(--dk); clip-path: inset(0 -100vmax);
}
.oapz.dk h2, .oapz.dk h3 { color: #fff; }
.oapz.dk .chip { background: var(--dk-3); color: var(--o-ink-3); }
.oapz.dk .lines > span { background: rgba(255, 255, 255, .04); }
.oapz.dk .stats { background: rgba(10, 16, 30, .62); }
.oapz.dk .stats b { color: #fff; } .oapz.dk .stats .av b, .oapz.dk .stats .st b { color: var(--o-ok); }
/* светлые острова — свои (светлые) переменные внутри */
.oapz.dk .pc, .oapz.dk .plate, .oapz.dk .makes a, .oapz.dk .others a, .oapz.dk .collage a, .oapz.dk .packs button, .oapz.dk .tiles a, .oapz.dk .feat .it, .oapz.dk .tl5 .th img {
  --o-blue: #1b6bb1; --o-ink: #222; --o-ink-2: #424242; --o-ink-3: #555; --o-ink-4: #6b6b6b; --o-ink-5: #9e9e9e; --o-line: #e5e5e5; --o-ok: #2e6b1f; --o-bg: #f5f5f5;
  background: #fff; color: var(--o-ink); border-color: transparent;
}
.oapz.dk .makes a:hover, .oapz.dk .others a:hover, .oapz.dk .collage a:hover, .oapz.dk .pc:hover { border-color: var(--bc); box-shadow: 0 0 0 1px var(--bc), 0 10px 30px rgba(0, 0, 0, .45); }
.oapz.dk .t-new { --tint: rgba(30, 219, 113, .06); --edge: rgba(30, 219, 113, .24); }
.oapz.dk .t-promo { --tint: rgba(208, 104, 104, .08); --edge: rgba(208, 104, 104, .32); }
.oapz.dk .t-hit { --tint: rgba(255, 165, 0, .06); --edge: rgba(255, 165, 0, .26); }
.oapz.dk .pass { background: var(--dk-2); }
.oapz.dk .docs button, .oapz.dk .dfeat button, .oapz.dk .nodocs .ic { background: var(--dk-3); }
/* «Новое у FORGA» (лента) */
.oapz.dk .feat, .oapz.dk .tl5 .cd { background: var(--dk-2); border-color: var(--o-line-sky); }
.oapz.dk .tl5.alt .cd { background: var(--dk-3); border-color: var(--o-line); }
.oapz.dk .tl5 .rail::after { box-shadow: 0 0 0 3px var(--dk); }
.oapz.dk .pst, .oapz.dk .tl5 .ic { background: var(--dk-3); border-color: var(--o-line); }
/* цифры плаката («+41») — цвет завода; у FORGA он тёмно-синий и на чёрном не читается (заказчик 30.10) — светлый */
.oapz.dk .pst { --tc: #8db2f2; }
.oapz.dk .pst.promo { background: rgba(255, 176, 0, .07); border-color: rgba(243, 201, 105, .28); --tc: #f3c969; }
.oapz.dk .pst .steps span { background: transparent; }
.oapz.dk .feat .br .chip, .oapz.dk .ah .br .chip { background: var(--dk-3); }
.oapz.dk .ztype.promo { background: rgba(243, 201, 105, .14); color: #f3c969; }
.oapz.dk .more5, .oapz.dk .tabs button, .oapz.dk .facs button, .oapz.dk .gchips button { background: transparent; }

/* шапка FORGA: сетка, свечение, справа — 3D-узел */
.oapz.dk .hero { isolation: isolate; border-color: var(--o-line); grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 10px 32px; padding: 30px 30px 26px;
  background: radial-gradient(60% 85% at 76% 42%, rgba(79, 134, 219, .32), rgba(41, 68, 115, .12) 55%, transparent 76%), var(--dk-2); }
.oapz.dk .hero::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: linear-gradient(rgba(232, 237, 245, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(232, 237, 245, .05) 1px, transparent 1px);
  background-size: 56px 56px; mask-image: radial-gradient(90% 80% at 72% 40%, #000 30%, transparent 80%); -webkit-mask-image: radial-gradient(90% 80% at 72% 40%, #000 30%, transparent 80%); }
.oapz.dk .hero .stats { margin-top: 22px; }
.oapz.dk .hero .stats.s4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.oapz.dk .hero .stats.s4 > div:nth-child(3) { border-left: 0; } .oapz.dk .hero .stats.s4 > div:nth-child(n+3) { border-top: 1px solid var(--o-line); }

/* 3D-узел (forga.kz site.css: .hero__visual, .hotspot, .hero__hint) — внутри .oapz */
.oapz .hero__visual { position: relative; aspect-ratio: 1 / 1; width: 100%; max-height: 560px; justify-self: center; }
.oapz .hero__ring { position: absolute; inset: 8% 6%; border-radius: 50%; border: 1px solid rgba(232, 237, 245, .1); pointer-events: none;
  background: radial-gradient(circle at 50% 50%, rgba(79, 134, 219, .12), transparent 62%); }
.oapz .hero__ring::before, .oapz .hero__ring::after { content: ''; position: absolute; border-radius: 50%; border: 1px dashed rgba(232, 237, 245, .1); }
.oapz .hero__ring::before { inset: 11%; animation: oapz-spin 60s linear infinite; }
.oapz .hero__ring::after { inset: 26%; border-style: solid; border-color: rgba(91, 141, 239, .22); }
@keyframes oapz-spin { to { transform: rotate(360deg); } }
@keyframes oapz-float { 50% { transform: translateY(-10px); } }
@keyframes oapz-ping { from { transform: scale(.6); opacity: 1; } to { transform: scale(1.7); opacity: 0; } }
.oapz .hero__canvas { position: absolute; left: 0; top: 0; width: 100%; height: calc(100% - 48px); opacity: 0; transition: opacity 1.2s cubic-bezier(.22, .8, .24, 1); cursor: grab; touch-action: pan-y; }
.oapz .hero__canvas:active { cursor: grabbing; }
.oapz .hero__visual.is-3d .hero__canvas { opacity: 1; }
.oapz .hero__fallback { position: absolute; inset: 4% 14% 52px; display: grid; place-items: center; transition: opacity .8s; pointer-events: none; }
.oapz .hero__fallback .strut2d { height: 100%; width: auto; filter: drop-shadow(0 30px 40px rgba(0, 0, 0, .5)); animation: oapz-float 6s ease-in-out infinite; }
.oapz .hero__visual.is-3d .hero__fallback { opacity: 0; }
.oapz .hero__hint { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); z-index: 4; display: flex; gap: 10px; align-items: center; font: 600 11.5px/1 var(--o-text);
  letter-spacing: .12em; text-transform: uppercase; color: rgba(232, 237, 245, .6); white-space: nowrap; padding: 9px 14px 9px 12px; border-radius: 999px;
  border: 1px solid rgba(232, 237, 245, .16); background: rgba(10, 16, 30, .55); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); cursor: pointer; transition: color .25s, border-color .25s; }
.oapz .hero__hint:hover, .oapz .hero__hint:focus-visible { color: #fff; border-color: rgba(141, 178, 242, .6); }
.oapz .hero__hint .fa { color: #4a7bd0; font-size: 15px; }
.oapz .hero__hint .when-touch, .oapz .hero__hint .when-open { display: none; }
@media (hover: none) { .oapz .hero__hint .when-mouse { display: none; } .oapz .hero__hint .when-touch { display: inline; } }
.oapz .hero__visual.is-exploded .hero__hint .when-mouse, .oapz .hero__visual.is-exploded .hero__hint .when-touch { display: none; }
.oapz .hero__visual.is-exploded .hero__hint .when-open--mouse { display: inline; }
@media (hover: none) { .oapz .hero__visual.is-exploded .hero__hint .when-open--mouse { display: none; } .oapz .hero__visual.is-exploded .hero__hint .when-open--touch { display: inline; } }
/* метки деталей: собранный узел — две пульсирующие точки; разобранный — точки у каждой детали, подпись — у детали под курсором */
.oapz .hotspot { position: absolute; left: 50%; top: 50%; z-index: 3; display: flex; align-items: center; gap: 8px; transform: translate(-6px, -6px); opacity: 0; transition: opacity .45s; pointer-events: none; text-decoration: none; }
.oapz .hero__visual.is-3d .hotspot.is-primary.is-placed, .oapz .hero__visual.is-3d.is-exploded .hotspot.is-placed { opacity: 1; }
.oapz .hero__visual.is-3d .hotspot.is-primary.is-placed .hotspot__dot, .oapz .hero__visual.is-3d.is-exploded .hotspot.is-placed .hotspot__dot { pointer-events: auto; }
.oapz .hero__visual.has-active .hotspot.is-placed:not(.is-active) { opacity: .3; }
.oapz .hotspot__dot { position: relative; width: 12px; height: 12px; border-radius: 50%; background: #4a7bd0; box-shadow: 0 0 0 3px rgba(91, 141, 239, .25), 0 0 14px rgba(91, 141, 239, .55); flex: 0 0 12px; transition: transform .3s, background .3s; }
.oapz .hotspot__dot::before { content: ''; position: absolute; inset: -9px; border-radius: 50%; }
.oapz .hotspot__dot::after { content: ''; position: absolute; inset: -6px; border-radius: 50%; border: 1.5px solid rgba(141, 178, 242, .7); animation: oapz-ping 2.4s cubic-bezier(.16, 1, .3, 1) infinite; }
.oapz .hero__visual.is-exploded .hotspot__dot::after { animation: none; opacity: 0; }
.oapz .hotspot.is-active .hotspot__dot, .oapz .hotspot:focus-visible .hotspot__dot { background: #fff; transform: scale(1.2); }
.oapz .hotspot__label { display: flex; align-items: center; gap: 6px; padding: 6px 10px 6px 11px; border-radius: 999px; font: 700 12px/1.2 var(--o-text); color: #fff; white-space: nowrap;
  background: rgba(10, 16, 30, .85); border: 1px solid rgba(91, 141, 239, .55); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  opacity: 0; transform: translateX(-4px); pointer-events: none; transition: opacity .25s, transform .25s; }
.oapz .hotspot__label .fa { font-size: 11px; color: #8db2f2; }
.oapz .hotspot.is-left { flex-direction: row-reverse; transform: translate(calc(-100% + 6px), -6px); }
.oapz .hotspot.is-left .hotspot__label { transform: translateX(4px); }
.oapz .hotspot.is-active .hotspot__label, .oapz .hotspot:focus-visible .hotspot__label { opacity: 1; transform: none; pointer-events: auto; }
@media (max-width: 1100px) { .oapz.dk .hero { grid-template-columns: minmax(0, 1fr); } .oapz .hero__visual { max-width: 560px; } }
@media (max-width: 767px) { .oapz.dk { padding-top: 10px; } .oapz.dk .hero { padding: 20px 14px 16px; } .oapz .hero__visual { aspect-ratio: 5 / 6; } }

/* главная и /zavody: плашка FORGA — «большая» (заказчик 29.10: «тёмной, как страница марки»; 30.10 из трёх вариантов выбрал B: «большая хорошо
   смотрится»): 2 × 2 клетки сетки (FORGA + WXQP / SRR столбиком справа = 3 × 3; порядок — oap_brand_families), логотип брендбука со шлейфом за левый край, слоган, линейки,
   справа 3D-узел картинкой (media/forga/strut-3d.webp — снят со стенда). Сетка рассчитана на 6 плашек: на 2 колонках последняя (LEON) — во всю ширину. */
.oapz .plate.forga { isolation: isolate; grid-column: span 2; grid-row: span 2; grid-template-rows: minmax(0, 1fr) auto; padding: 30px 30px 20px;
  border-color: #1c2740; color: #fff; --o-ink: #fff; --o-ink-2: rgba(255, 255, 255, .86); --o-ink-3: #aeb8c9; --o-ink-4: rgba(255, 255, 255, .7); --o-ink-5: #6b778c;
  --o-line: rgba(255, 255, 255, .2); --o-ok: #7fe0a3; --o-blue: #fff; --o-bg: #121c31;
  background: radial-gradient(85% 95% at 88% 12%, rgba(79, 134, 219, .38), rgba(41, 68, 115, .14) 55%, transparent 76%), #0a101c; }
.oapz .plate.forga::before { background: linear-gradient(90deg, #4a7bd0, #8db2f2); }
.oapz .plate.forga::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: linear-gradient(rgba(232, 237, 245, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(232, 237, 245, .05) 1px, transparent 1px);
  background-size: 40px 40px; mask-image: radial-gradient(90% 90% at 85% 15%, #000 20%, transparent 75%); -webkit-mask-image: radial-gradient(90% 90% at 85% 15%, #000 20%, transparent 75%); }
.oapz .plate.forga:hover { border-color: #4a7bd0; box-shadow: 0 10px 30px rgba(7, 11, 20, .35); }
.oapz .plate.forga .chip { background: rgba(255, 255, 255, .12); color: #fff; }
.oapz .plate.forga .strut { position: absolute; right: 5%; top: 7%; height: 90%; width: auto; max-width: none; pointer-events: none; filter: drop-shadow(0 24px 30px rgba(0, 0, 0, .55)); }
.oapz .plate.forga .fb { position: relative; max-width: 60%; display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.oapz .plate.forga .lg { height: auto; margin-bottom: 10px; }
.oapz .plate.forga .lg img { height: 54px; max-height: none; max-width: none; width: auto; margin-left: -110px; }
.oapz .plate.forga .eyebrow { font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; color: #8db2f2; }
.oapz .plate.forga .slog { font: 400 34px/1.15 var(--o-head); color: #fff; }
.oapz .plate.forga p { margin: 0; font-size: 15px; line-height: 1.55; color: rgba(255, 255, 255, .8); }
.oapz .plate.forga .nums { position: relative; max-width: 60%; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.oapz .plate.forga .cert { font-size: 13.5px; color: rgba(255, 255, 255, .85); white-space: normal; } .oapz .plate.forga .cert .fa { color: #7fe0a3; margin-right: 4px; }
@media (max-width: 991px) { .oapz .plate.forga { grid-row: auto; min-height: 380px; } .oapz .plates .plate:last-child { grid-column: span 2; } }
@media (max-width: 767px) {
  .oapz .plate.forga { min-height: 0; padding: 18px 14px 12px; }
  .oapz .plate.forga .fb { max-width: 64%; gap: 8px; } .oapz .plate.forga .lg { margin-bottom: 2px; } .oapz .plate.forga .lg img { height: 30px; margin-left: -62px; }
  .oapz .plate.forga .slog { font-size: 21px; } .oapz .plate.forga p { font-size: 12.5px; line-height: 1.45; }
  .oapz .plate.forga .strut { right: 2%; top: 5%; height: 92%; } .oapz .plate.forga .nums { max-width: 64%; }
}

/* ===== FORGA (30.10): «Идея названия» на странице марки (oap_zavody_forga_name), плашка — выше (oap_zavody_forga_plate).
   Брендбук FORGA: фирменный синий #1D3D78, чёрный #0A0A0A, белый; логотип не перекрашивать и не искажать; декоративный элемент (силуэт
   машины) — только на фирменном синем; логотип со шлейфом уходит за край (стр. 6 и упаковка). ===== */
.oapz .fname { position: relative; overflow: hidden; border-radius: 10px; color: #fff; padding: 40px 40px 150px;
  background: #1d3d78 url(media/forga/deco-car.webp) no-repeat right -60px bottom -20px / 64% auto; }
.oapz .fname .fn-in { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 24px 48px; align-items: center; }
.oapz .fname .eyebrow { display: block; font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; color: rgba(255, 255, 255, .7); margin-bottom: 8px; }
.oapz .fname h2 { font-size: 34px; line-height: 1.15; color: #fff; margin: 0 0 16px; }
.oapz .fname p { font-size: 15.5px; line-height: 1.6; color: rgba(255, 255, 255, .88); margin: 0 0 12px; }
.oapz .fname .fn-words { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.oapz .fname .fn-words li { display: grid; grid-template-columns: 112px minmax(0, 1fr); column-gap: 18px; align-items: baseline; padding: 14px 18px;
  border: 1px solid rgba(255, 255, 255, .18); border-radius: 8px; background: rgba(10, 10, 10, .16); }
.oapz .fname .fn-words b { grid-row: span 2; font: italic 900 30px/1 var(--o-head); letter-spacing: .03em; color: #fff; align-self: center; }
.oapz .fname .fn-words em { font-style: normal; font-weight: 600; font-size: 15px; color: #fff; }
.oapz .fname .fn-words span { font-size: 13.5px; color: rgba(255, 255, 255, .75); }
.oapz .fname .fn-logo { position: absolute; left: -9%; bottom: 36px; width: 74%; max-width: none; height: auto; pointer-events: none; }
@media (max-width: 900px) { .oapz .fname .fn-in { grid-template-columns: minmax(0, 1fr); } .oapz .fname { background-size: 110% auto; } }
@media (max-width: 767px) {
  .oapz .fname { padding: 24px 16px 84px; background-position: right -40px bottom -10px; }
  .oapz .fname h2 { font-size: 24px; } .oapz .fname p { font-size: 14.5px; }
  .oapz .fname .fn-words li { grid-template-columns: 78px minmax(0, 1fr); column-gap: 12px; padding: 11px 12px; } .oapz .fname .fn-words b { font-size: 21px; }
  .oapz .fname .fn-logo { width: 120%; left: -26%; bottom: 22px; }
  .oapz .hero.forga .lg img { height: 32px; margin-left: -70px; }
}
