/* Брендбук-страница системы «Нова»: раскладка витрины (префикс bb-). Компоненты — из components.css. */

.bb-skip { position: absolute; left: 16px; top: -60px; z-index: 100; padding: 10px 14px; background: var(--nv-amber); color: var(--nv-ink); border-radius: 10px; font-weight: 600; }
.bb-skip:focus { top: 16px; }

/* ---------- Первый экран: прилавок ---------- */
.bb-hero { position: relative; color: #fff; overflow: clip; }
.bb-hero__glaze { position: absolute; inset: 0; background-color: var(--nv-brand-field); background-image: var(--nv-lamp-light), var(--nv-tile-bg), linear-gradient(165deg, var(--nv-brand-field-light), var(--nv-brand-field) 42%, var(--nv-brand-field-deep)); transition: background-color var(--nv-dur-glaze) var(--nv-ease-in-out); }
.bb-hero__lamp { position: absolute; left: 50%; top: -6%; width: 70vw; max-width: 1100px; aspect-ratio: 2 / 1; transform: translateX(-50%); background: radial-gradient(50% 50% at 50% 50%, var(--nv-amber-glow), transparent 70%); pointer-events: none; animation: bb-lamp 1.2s var(--nv-ease-out) both; }
@keyframes bb-lamp { from { opacity: 0; transform: translateX(-50%) scale(0.9); } to { opacity: 1; transform: translateX(-50%) scale(1); } }
.bb-hero__in { position: relative; display: grid; gap: clamp(28px, 4vw, 48px); padding-top: var(--nv-space-5); }
.bb-bar { display: flex; align-items: center; gap: var(--nv-space-4); min-height: 56px; min-width: 0; max-width: 100%; }
.bb-bar__logo img { height: 34px; width: auto; }
.bb-nav { margin-left: auto; min-width: 0; display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; max-width: 100%; padding: 4px; border-radius: 12px; background: rgba(255,255,255,0.08); }
.bb-nav::-webkit-scrollbar { display: none; }
.bb-nav a { flex: none; padding: 8px 12px; border-radius: 9px; color: rgba(255,255,255,0.86); font-size: var(--nv-fs-sm); font-weight: 500; text-decoration: none; white-space: nowrap; transition: background var(--nv-dur-state), color var(--nv-dur-state); }
.bb-nav a:hover { background: rgba(255,255,255,0.12); color: #fff; }
.bb-nav a.is-active { background: #fff; color: var(--nv-ink); }
.bb-hero__copy { display: grid; gap: var(--nv-space-5); max-width: 860px; }
.bb-hero__title { font-family: var(--nv-font-display); font-weight: 600; font-size: var(--nv-fs-d1); line-height: 1.06; letter-spacing: -0.025em; text-wrap: balance; }
.bb-hero__lead { font-size: var(--nv-fs-lg); line-height: 1.6; color: rgba(255,255,255,0.84); max-width: 60ch; }
.bb-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--nv-space-3); }

/* Переключатель подбрендов: эмалевые таблички */
.bb-switch { display: inline-flex; flex-wrap: wrap; gap: 6px; padding: 6px; background: rgba(8, 14, 32, 0.28); border-radius: 14px; box-shadow: inset 0 1px 2px rgba(0,0,0,0.25); }
.bb-switch label { position: relative; }
.bb-switch input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.bb-switch span { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px; border-radius: 9px; font-weight: 600; font-size: var(--nv-fs-sm); color: rgba(255,255,255,0.86); cursor: pointer; transition: background var(--nv-dur-state), color var(--nv-dur-state), transform var(--nv-dur-press) var(--nv-ease-spring); user-select: none; }
.bb-switch span::before { content: ""; width: 10px; height: 10px; border-radius: 3px; background: var(--_sw, var(--nv-amber)); box-shadow: inset 0 1px 0 rgba(255,255,255,0.5); }
.bb-switch input:hover + span { background: rgba(255,255,255,0.1); }
.bb-switch input:checked + span { background: #fff; color: var(--nv-ink); }
.bb-switch input:focus-visible + span { box-shadow: 0 0 0 2px var(--nv-brand-field), 0 0 0 5px var(--nv-amber); }
.bb-switch input:active + span { transform: scale(0.97); }

/* Столешница с устройствами */
.bb-counter { position: relative; margin-top: var(--nv-space-4); }
.bb-counter__top { height: 14px; border-radius: 14px 14px 0 0; background: linear-gradient(180deg, #FFFFFF, #E6EAF0); box-shadow: 0 1px 0 rgba(15,27,51,0.18); }
.bb-counter__front { height: clamp(28px, 4vw, 44px); background: linear-gradient(180deg, #D9DEE6, #C3CAD6); border-radius: 0 0 6px 6px; }
.bb-counter__devices { position: absolute; left: 0; right: 0; bottom: calc(100% - 8px); padding: 0 2%; display: block; }
.bb-counter__devices img { width: 100%; height: auto; }
.bb-counter__labels { display: grid; grid-template-columns: 200fr 200fr 240fr 260fr 320fr 320fr; padding: 10px 2% 0; font-size: var(--nv-fs-xs); color: rgba(255,255,255,0.78); text-align: center; font-variant-numeric: tabular-nums; }
.bb-hero__spacer { height: clamp(140px, 22vw, 330px); }
@media (max-width: 720px) { .bb-counter__labels { font-size: 10px; } .bb-hero__spacer { height: 28vw; } }

/* ---------- Разделы ---------- */
.bb-section { padding-block: clamp(56px, 8vw, 112px); scroll-margin-top: 24px; }
.bb-section + .bb-section { border-top: var(--nv-line); }
.bb-section__head { display: grid; gap: var(--nv-space-4); margin-bottom: clamp(28px, 4vw, 48px); max-width: 820px; }
.bb-section__head .nv-lead { max-width: 60ch; }
.bb-sub { margin: clamp(32px, 5vw, 56px) 0 var(--nv-space-4); display: flex; align-items: baseline; gap: var(--nv-space-4); flex-wrap: wrap; }
.bb-sub .nv-h3 { font-weight: 500; }
.bb-sub__note { color: var(--nv-ink-3); font-size: var(--nv-fs-sm); }
.bb-sub:first-child { margin-top: 0; }
.bb-note { font-size: var(--nv-fs-sm); color: var(--nv-ink-2); max-width: 70ch; }
.bb-note code, .bb-inline-code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.92em; padding: 1px 6px; border-radius: 5px; background: var(--nv-ground-2); color: var(--nv-ink); }
.bb-two { display: grid; gap: var(--nv-grid-gap); grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); align-items: start; }
.bb-three { display: grid; gap: var(--nv-grid-gap); grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); align-items: start; }

/* Идея */
.bb-idea { display: grid; gap: var(--nv-grid-gap); grid-template-columns: 1.1fr 1fr; align-items: stretch; }
@media (max-width: 900px) { .bb-idea { grid-template-columns: 1fr; } }
.bb-idea__text { display: grid; gap: var(--nv-space-5); align-content: start; }
.bb-idea__text h3 { font-size: var(--nv-fs-xl); font-weight: 600; margin-bottom: 6px; }
.bb-idea__text p { color: var(--nv-ink-2); max-width: 60ch; }
.bb-idea__diagram { position: relative; min-height: 360px; border-radius: var(--nv-radius-lg); overflow: clip; display: grid; align-items: end; padding: var(--nv-space-5); }
.bb-idea__diagram .bb-lampbulb { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 12px; height: 48px; background: var(--nv-ink); border-radius: 0 0 6px 6px; }
.bb-idea__diagram .bb-lampbulb::after { content: ""; position: absolute; top: 46px; left: 50%; transform: translateX(-50%); width: 56px; height: 18px; border-radius: 0 0 28px 28px; background: var(--nv-amber); box-shadow: 0 10px 60px 20px var(--nv-amber-glow); }
.bb-idea__legend { position: relative; display: grid; gap: 6px; padding: var(--nv-space-4); background: rgba(255,255,255,0.94); color: var(--nv-ink); border-radius: var(--nv-radius-md); font-size: var(--nv-fs-sm); }
.bb-idea__legend b { font-weight: 600; }
.bb-before { display: grid; gap: 10px; }
.bb-before li { display: grid; grid-template-columns: 1fr 1fr; gap: var(--nv-space-4); padding: 12px 16px; background: var(--nv-paper); border: var(--nv-line); border-radius: var(--nv-radius-sm); font-size: var(--nv-fs-sm); }
.bb-before li > span:first-child { color: var(--nv-ink-3); text-decoration: line-through; text-decoration-color: var(--nv-grout-2); }
@media (max-width: 600px) { .bb-before li { grid-template-columns: 1fr; gap: 4px; } }

/* Логотип */
.bb-logo-hero { display: grid; place-items: center; padding: clamp(40px, 8vw, 96px) var(--nv-space-5); background: var(--nv-paper); border: var(--nv-line); border-radius: var(--nv-radius-lg); box-shadow: var(--nv-glaze-highlight); }
.bb-logo-hero img { width: min(100%, 560px); height: auto; }
.bb-logos { display: grid; gap: var(--nv-grid-gap); grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.bb-logo-card { display: grid; gap: var(--nv-space-3); }
.bb-logo-card__pane { display: grid; place-items: center; min-height: 170px; padding: var(--nv-space-5); background: var(--nv-paper); border: var(--nv-line); border-radius: var(--nv-radius-md); box-shadow: var(--nv-glaze-highlight); }
.bb-logo-card__pane--dark { background: var(--nv-ink); border-color: transparent; }
.bb-logo-card__pane--field { background: var(--nv-brand-field); border-color: transparent; }
.bb-logo-card__pane--ground { background: var(--nv-ground-2); }
.bb-logo-card__pane img { max-width: 100%; height: auto; width: 100%; max-height: 110px; object-fit: contain; }
.bb-logo-card__pane img.bb-mark { width: 96px; }
.bb-logo-card__cap { font-size: var(--nv-fs-sm); color: var(--nv-ink-2); display: flex; justify-content: space-between; gap: var(--nv-space-3); }
.bb-logo-card__cap code { color: var(--nv-ink-3); font-size: var(--nv-fs-xs); }
.bb-construct { position: relative; display: grid; place-items: center; padding: var(--nv-space-6); background: var(--nv-paper); border: var(--nv-line); border-radius: var(--nv-radius-md); overflow: hidden; }
.bb-construct::before { content: ""; position: absolute; inset: 0; background: linear-gradient(to right, var(--nv-grout) 1px, transparent 1px) 0 0 / 28px 28px, linear-gradient(to bottom, var(--nv-grout) 1px, transparent 1px) 0 0 / 28px 28px; opacity: 0.8; }
.bb-construct img { position: relative; width: min(100%, 440px); }
.bb-rules { display: grid; gap: 12px; }
.bb-rules li { display: grid; grid-template-columns: 24px 1fr; gap: 12px; align-items: start; font-size: var(--nv-fs-sm); color: var(--nv-ink-2); }
.bb-rules .nv-icon { width: 20px; height: 20px; margin-top: 1px; }
.bb-rules--no .nv-icon { color: var(--nv-danger); }
.bb-rules--yes .nv-icon { color: var(--nv-success); }

/* Цвет */
.bb-swatches { display: grid; gap: var(--nv-space-3); grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.bb-swatch { display: grid; grid-template-rows: 96px auto; border: var(--nv-line); border-radius: var(--nv-radius-md); overflow: hidden; background: var(--nv-paper); box-shadow: var(--nv-glaze-highlight); }
.bb-swatch__color { position: relative; }
.bb-swatch__color[data-text]::after { content: attr(data-text); position: absolute; left: 12px; bottom: 10px; font-family: var(--nv-font-display); font-weight: 600; font-size: 20px; letter-spacing: -0.02em; }
.bb-swatch__meta { padding: 10px 12px 12px; display: grid; gap: 2px; font-size: var(--nv-fs-xs); }
.bb-swatch__name { font-size: var(--nv-fs-sm); font-weight: 600; color: var(--nv-ink); }
.bb-swatch__hex { font-variant-numeric: tabular-nums; color: var(--nv-ink-2); text-transform: uppercase; }
.bb-swatch__token { color: var(--nv-ink-3); font-family: ui-monospace, Menlo, monospace; font-size: 11px; overflow-wrap: anywhere; }
.bb-swatch__use { color: var(--nv-ink-2); margin-top: 4px; }
.bb-swatch--wide { grid-column: span 2; }
@media (max-width: 400px) { .bb-swatch--wide { grid-column: auto; } }
.bb-brandrow { display: grid; gap: var(--nv-space-3); grid-template-columns: 220px 1fr; align-items: stretch; }
@media (max-width: 720px) { .bb-brandrow { grid-template-columns: 1fr; } }
.bb-brandrow__card { display: grid; align-content: space-between; gap: var(--nv-space-4); padding: var(--nv-space-4); color: #fff; border-radius: var(--nv-radius-md); background-color: var(--_f); background-image: var(--nv-tile-bg), linear-gradient(160deg, var(--_fl), var(--_f) 50%, var(--_fd)); }
.bb-brandrow__card img { height: 30px; width: auto; }
.bb-brandrow__card p { font-size: var(--nv-fs-sm); color: rgba(255,255,255,0.8); }
.bb-contrast { width: 100%; min-width: 640px; border-collapse: collapse; font-size: var(--nv-fs-sm); background: var(--nv-paper); border: var(--nv-line); border-radius: var(--nv-radius-md); overflow: hidden; }
.bb-contrast th, .bb-contrast td { padding: 10px 14px; text-align: left; border-bottom: var(--nv-line); vertical-align: middle; }
.bb-contrast tr:last-child > * { border-bottom: 0; }
.bb-contrast th { color: var(--nv-ink-3); font-weight: 500; background: var(--nv-ground-2); }
.bb-contrast .bb-sample { display: inline-flex; align-items: center; height: 32px; padding: 0 12px; border-radius: 8px; font-weight: 600; white-space: nowrap; }
.bb-contrast .bb-ratio { font-variant-numeric: tabular-nums; font-weight: 600; }
.bb-contrast .bb-pass { color: var(--nv-success); } .bb-contrast .bb-pass-large { color: var(--nv-warning); } .bb-contrast .bb-fail { color: var(--nv-danger); }

/* Типографика */
.bb-type-hero { display: grid; gap: var(--nv-space-5); padding: clamp(28px, 4vw, 48px); background: var(--nv-paper); border: var(--nv-line); border-radius: var(--nv-radius-lg); box-shadow: var(--nv-glaze-highlight); overflow: hidden; }
.bb-type-hero .bb-face { font-size: var(--nv-fs-sm); color: var(--nv-ink-3); display: flex; gap: var(--nv-space-4); flex-wrap: wrap; }
.bb-glyphs { font-family: var(--nv-font-display); font-weight: 600; font-size: clamp(1.4rem, 3.4vw, 3rem); letter-spacing: -0.02em; line-height: 1.2; overflow-wrap: anywhere; color: var(--nv-ink); }
.bb-glyphs--text { font-family: var(--nv-font-text); font-weight: 500; font-size: clamp(1.1rem, 2.4vw, 1.9rem); letter-spacing: 0; }
.bb-scale { display: grid; gap: 0; background: var(--nv-paper); border: var(--nv-line); border-radius: var(--nv-radius-md); overflow: hidden; }
.bb-scale__row { display: grid; grid-template-columns: 160px 1fr; gap: var(--nv-space-4); align-items: baseline; padding: 16px 20px; border-bottom: var(--nv-line); }
.bb-scale__row:last-child { border-bottom: 0; }
.bb-scale__meta { display: grid; gap: 2px; font-size: var(--nv-fs-xs); color: var(--nv-ink-3); }
.bb-scale__meta b { color: var(--nv-ink); font-weight: 600; font-size: var(--nv-fs-sm); }
.bb-scale__sample { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 640px) { .bb-scale__row { grid-template-columns: 1fr; gap: 6px; } }
.bb-nums { display: grid; grid-template-columns: 1fr auto; gap: 8px 24px; font-variant-numeric: tabular-nums; font-size: var(--nv-fs-lg); }
.bb-nums span:nth-child(2n) { text-align: right; font-weight: 600; }
.bb-nums--bad { font-variant-numeric: proportional-nums; color: var(--nv-ink-3); }

/* Сетка и модуль */
.bb-cols { display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--nv-grid-gap); height: 72px; }
.bb-cols span { background: var(--nv-brand-tint); border: 1px solid var(--nv-brand-tint-2); border-radius: 6px; }
@media (max-width: 640px) { .bb-cols span:nth-child(n+5) { display: none; } .bb-cols { grid-template-columns: repeat(4, 1fr); } }
.bb-spaces { display: flex; align-items: flex-end; gap: var(--nv-space-3); flex-wrap: wrap; }
.bb-spaces div { display: grid; gap: 6px; justify-items: center; font-size: var(--nv-fs-xs); color: var(--nv-ink-3); font-variant-numeric: tabular-nums; }
.bb-spaces i { display: block; width: var(--s); height: var(--s); background: var(--nv-brand-field); border-radius: 3px; }
.bb-radii { display: flex; gap: var(--nv-space-4); flex-wrap: wrap; }
.bb-radii div { width: 96px; height: 72px; display: grid; place-items: end start; padding: 8px; background: var(--nv-paper); border: var(--nv-line-strong); border-radius: var(--r); font-size: var(--nv-fs-xs); color: var(--nv-ink-3); }
.bb-module { position: relative; height: 196px; border-radius: var(--nv-radius-md); background-color: var(--nv-brand-field); background-image: var(--nv-lamp-light), linear-gradient(to right, rgba(255,255,255,0.14) 1px, transparent 1px) 0 0 / var(--nv-module) var(--nv-module), linear-gradient(to bottom, rgba(255,255,255,0.14) 1px, transparent 1px) 0 0 / var(--nv-module) var(--nv-module); overflow: hidden; }
.bb-module span { position: absolute; left: var(--nv-module); top: var(--nv-module); width: calc(var(--nv-module) * 2); height: var(--nv-module); background: #fff; border-radius: 10px; display: grid; place-items: center; font-size: var(--nv-fs-xs); color: var(--nv-ink-2); }
.bb-module span + span { left: calc(var(--nv-module) * 4); width: calc(var(--nv-module) * 3); top: var(--nv-module); }
.bb-module span + span + span { left: var(--nv-module); top: calc(var(--nv-module) * 2.25); width: calc(var(--nv-module) * 6); height: calc(var(--nv-module) * 0.75); background: var(--nv-amber); }
.bb-depth { display: grid; gap: var(--nv-space-4); grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.bb-depth > div { padding: var(--nv-space-4); min-height: 120px; display: grid; align-content: end; font-size: var(--nv-fs-sm); color: var(--nv-ink-2); }
.bb-depth b { color: var(--nv-ink); display: block; margin-bottom: 4px; }
.bb-depth .bb-float { background: var(--nv-paper); border-radius: var(--nv-radius-md); box-shadow: var(--nv-shadow-float); }
.bb-motion { display: grid; gap: var(--nv-space-3); }
.bb-motion__row { display: grid; grid-template-columns: minmax(180px, max-content) 1fr auto; gap: var(--nv-space-4); align-items: center; padding: 12px 16px; background: var(--nv-paper); border: var(--nv-line); border-radius: var(--nv-radius-sm); font-size: var(--nv-fs-sm); }
.bb-motion__row b { font-family: ui-monospace, Menlo, monospace; font-weight: 500; font-size: var(--nv-fs-xs); white-space: nowrap; }
.bb-motion__track { position: relative; height: 24px; }
.bb-motion__dot { position: absolute; left: 0; top: 2px; width: 20px; height: 20px; border-radius: 6px; background: var(--nv-brand-field); transition: transform var(--_d, 300ms) var(--_e, ease); }
.bb-motion.is-go .bb-motion__dot { transform: translateX(calc(100% * 8)); }
@media (max-width: 640px) { .bb-motion__row { grid-template-columns: 1fr; } }

/* Компоненты */
.bb-demo { padding: clamp(20px, 3vw, 32px); background: var(--nv-paper); border: var(--nv-line); border-radius: var(--nv-radius-lg); box-shadow: var(--nv-glaze-highlight); }
.bb-demo--ground { background: var(--nv-ground); }
.bb-demo--frame { padding: 0; overflow: clip; }
.bb-demo .nv-header { position: static; backdrop-filter: none; background: var(--nv-paper); }
.bb-demo .nv-toast { position: static; transform: none; }
.bb-row { display: flex; flex-wrap: wrap; gap: var(--nv-space-3); align-items: center; }
.bb-row--start { align-items: flex-start; }
.bb-label { display: block; font-size: var(--nv-fs-xs); color: var(--nv-ink-3); margin-bottom: 8px; }
.bb-stack { display: grid; gap: var(--nv-space-5); }
.bb-code { margin: 0; padding: 16px 20px; background: var(--nv-ink); color: #E6EBF5; border-radius: var(--nv-radius-md); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; line-height: 1.6; overflow-x: auto; white-space: pre; }
.bb-code .c { color: #8FA3C8; } .bb-code .s { color: #FFD27A; } .bb-code .k { color: #8BE3C9; }

/* Устройства */
.bb-devices { display: grid; gap: var(--nv-grid-gap); grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
.bb-device { display: grid; gap: 10px; }
.bb-device__stage { display: grid; place-items: end center; aspect-ratio: 1; padding: 12%; background: var(--nv-paper); border: var(--nv-line); border-radius: var(--nv-radius-md); box-shadow: var(--nv-glaze-highlight); }
.bb-device__stage img { width: 100%; height: auto; }
.bb-device__name { font-weight: 600; }
.bb-device__spec { font-size: var(--nv-fs-xs); color: var(--nv-ink-3); }
.bb-photos { display: grid; gap: var(--nv-space-3); grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
.bb-photos div { display: grid; place-items: center; aspect-ratio: 1; padding: 12px; background: var(--nv-paper); border: var(--nv-line); border-radius: var(--nv-radius-md); }
.bb-photos img { max-width: 100%; max-height: 100%; object-fit: contain; }
.bb-lineup { padding: clamp(20px, 4vw, 48px) clamp(12px, 3vw, 40px) 0; border-radius: var(--nv-radius-lg); overflow: hidden; }
.bb-lineup img { width: 100%; height: auto; }

/* Иконки и иллюстрации */
.bb-icons { display: grid; gap: 6px; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); }
.bb-icons div { display: grid; gap: 6px; justify-items: center; padding: 12px 4px 10px; background: var(--nv-paper); border: var(--nv-line); border-radius: var(--nv-radius-sm); font-size: 10px; color: var(--nv-ink-3); text-align: center; overflow-wrap: anywhere; }
.bb-icons .nv-icon { width: 24px; height: 24px; color: var(--nv-ink); }
.bb-illus { display: grid; gap: var(--nv-space-3); grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); }
.bb-illus div { display: grid; gap: 8px; justify-items: center; font-size: var(--nv-fs-xs); color: var(--nv-ink-3); text-align: center; }
.bb-illus img { width: 100%; height: auto; border-radius: 22%; }
.bb-illus img.bb-novik { border-radius: 0; background: var(--nv-paper); border: var(--nv-line); border-radius: var(--nv-radius-md); }

/* Голос */
.bb-voice { display: grid; gap: var(--nv-space-3); }
.bb-voice__item { display: grid; grid-template-columns: minmax(180px, 0.9fr) 1fr 1fr; gap: var(--nv-space-4); padding: var(--nv-space-4) var(--nv-space-5); background: var(--nv-paper); border: var(--nv-line); border-radius: var(--nv-radius-md); box-shadow: var(--nv-glaze-highlight); align-items: start; }
.bb-voice__rule b { display: block; font-weight: 600; margin-bottom: 4px; }
.bb-voice__rule p { font-size: var(--nv-fs-sm); color: var(--nv-ink-2); }
.bb-voice__ex { display: grid; gap: 8px; font-size: var(--nv-fs-sm); }
.bb-voice__ex small { font-size: var(--nv-fs-xs); color: var(--nv-ink-3); }
.bb-voice__ex--no { color: var(--nv-ink-3); }
.bb-voice__ex--no q { text-decoration: line-through; text-decoration-color: var(--nv-grout-2); }
.bb-voice__ex q { quotes: "«" "»"; }
.bb-voice__ex--yes q { color: var(--nv-ink); }
@media (max-width: 760px) { .bb-voice__item { grid-template-columns: 1fr; } }

/* Применение */
.bb-apply { display: grid; gap: var(--nv-grid-gap); grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr)); }
.bb-apply__card { display: grid; gap: var(--nv-space-3); }
.bb-apply__cap { display: flex; justify-content: space-between; gap: var(--nv-space-3); font-size: var(--nv-fs-sm); color: var(--nv-ink-2); }
.bb-apply__cap b { color: var(--nv-ink); }
.bb-mock { border: var(--nv-line); border-radius: var(--nv-radius-lg); overflow: clip; background: var(--nv-ground); }
.bb-mock .nv-header { position: static; }
.bb-mock__in { padding: var(--nv-space-5); display: grid; gap: var(--nv-space-5); }
.bb-ads { display: grid; gap: var(--nv-space-4); grid-template-columns: 300px 1fr; align-items: start; }
@media (max-width: 760px) { .bb-ads { grid-template-columns: 1fr; } }
.bb-ad { position: relative; color: #fff; border-radius: 12px; overflow: clip; display: grid; background-color: var(--nv-brand-field); background-image: var(--nv-lamp-light), var(--nv-tile-bg), linear-gradient(165deg, var(--nv-brand-field-light), var(--nv-brand-field) 45%, var(--nv-brand-field-deep)); }
.bb-ad--tall { width: 300px; height: 600px; max-width: 100%; padding: 24px; grid-template-rows: auto 1fr auto; }
.bb-ad--wide { height: 250px; padding: 20px 28px; grid-template-columns: 1fr auto; align-items: center; gap: 24px; }
.bb-ad__logo { height: 28px; width: auto; }
.bb-ad__title { font-family: var(--nv-font-display); font-weight: 600; letter-spacing: -0.02em; line-height: 1.1; }
.bb-ad--tall .bb-ad__title { font-size: 30px; margin-top: 16px; }
.bb-ad--wide .bb-ad__title { font-size: 26px; }
.bb-ad__sub { font-size: 14px; color: rgba(255,255,255,0.84); margin-top: 10px; }
.bb-ad__device { justify-self: center; width: 200px; height: auto; margin-top: 8px; }
.bb-ad--wide .bb-ad__device { width: 190px; margin: 0; align-self: end; }
.bb-ad__cta { align-self: end; }
@media (max-width: 760px) { .bb-ad--wide { height: auto; grid-template-columns: 1fr; } .bb-ad--wide .bb-ad__device { display: none; } }

/* Подключение */
.bb-connect { display: grid; gap: var(--nv-grid-gap); grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: start; }
.bb-connect > * { min-width: 0; }
@media (max-width: 900px) { .bb-connect { grid-template-columns: minmax(0, 1fr); } }
.bb-checklist { display: grid; gap: 10px; }
.bb-checklist li { display: grid; grid-template-columns: 22px 1fr; gap: 10px; font-size: var(--nv-fs-sm); color: var(--nv-ink-2); align-items: start; }
.bb-checklist .nv-icon { width: 18px; height: 18px; margin-top: 2px; color: var(--nv-success); }
.bb-checklist li.is-no .nv-icon { color: var(--nv-danger); }

/* Подвал витрины */
.bb-foot { padding: var(--nv-space-6) 0 calc(var(--nv-space-6) + env(safe-area-inset-bottom)); border-top: var(--nv-line); font-size: var(--nv-fs-sm); color: var(--nv-ink-3); display: flex; flex-wrap: wrap; gap: var(--nv-space-3) var(--nv-space-5); align-items: center; }
.bb-foot img { height: 24px; width: auto; }

/* Плавающая кнопка «наверх» */
.nv-body .bb-up { position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 40; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; background: var(--nv-ink); color: #fff; border: 0; cursor: pointer; box-shadow: var(--nv-shadow-float); opacity: 0; transform: translateY(8px); pointer-events: none; transition: opacity var(--nv-dur-state), transform var(--nv-dur-state) var(--nv-ease-out); }
.bb-up.is-on { opacity: 1; transform: none; pointer-events: auto; }

@media (prefers-reduced-motion: reduce) { .bb-hero__lamp { animation: none; } }