/* Товарооборот. Цвета и базовые параметры из существующего сайта.
   Компоненты .brand-* — рекомендации для повторного использования. */
:root {
  --navy: #1b3544;
  --bronze: #987440;
  --bronze-light: #cda874;
  --ink: #243c49;
  --muted-ink: #61717a;
  --line: #dce3e6;
  --mist: #f3f6f7;
  --card-mist: #f4f6f7;
  --white: #fff;
  --destructive: #b33636;
  --font-sans: Arial, Helvetica, sans-serif;
  --font-graphics: 'DejaVu Sans', sans-serif;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 12px;
  --space-unit: 8px;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--white); color: var(--ink); font: 400 16px/1.6 var(--font-sans); }
button, input, textarea, select { font: inherit; }
.brand-container { width: 100%; max-width: 1232px; margin: auto; padding: 0 36px; }
.brand-title { color: var(--navy); font-size: clamp(32px, 4.4vw, 64px); font-weight: 500; line-height: 1.18; letter-spacing: -.035em; }
.brand-eyebrow { color: var(--bronze); font-size: 12px; font-weight: 600; letter-spacing: .115em; text-transform: uppercase; }
.brand-muted { color: var(--muted-ink); }
.brand-button { display: inline-flex; justify-content: center; align-items: center; min-height: 50px; padding: 13px 22px; border: 1px solid transparent; border-radius: 5px; color: white; background: var(--navy); text-decoration: none; text-align: center; font-weight: 500; line-height: 1.4; }
.brand-button:hover { background: #294b5e; }
.brand-button-secondary { background: white; color: var(--navy); border-color: #c8d1d6; }
.brand-button-secondary:hover { background: var(--mist); }
a:focus-visible, button:focus-visible { outline: 3px solid var(--bronze-light); outline-offset: 5px; }
/* Окно показывает область изображения, использованную в утвержденных карточках.
   PNG остается неизменным; подложка должна быть белой. */
.brand-logo { display: block; position: relative; width: min(360px, 100%); aspect-ratio: 1390 / 460; overflow: hidden; background: white; }
.brand-logo img { display: block; position: absolute; width: 110.503597%; max-width: none; height: auto; left: -6.834532%; top: -50%; }
.brand-card { background: white; border: 1px solid var(--line); border-radius: 8px; padding: 32px; }
@media (max-width: 640px) { .brand-container { padding: 0 21px; } .brand-card { padding: 24px; } }