/* Steelland.ru — оформление 2026 «сталь и раскалённый металл». Слой 1: тикер цен, шапка, меню. */
:root {
  --sl-graphite: #1c2027; --sl-graphite-2: #262b34; --sl-steel: #8a97a8; --sl-steel-light: #c9d2dd;
  --sl-hot: #e8501d; --sl-hot-2: #ff7a2f; --sl-up: #2fb36b; --sl-down: #e5484d;
  --sl-head-font: "Roboto Condensed", "Arial Narrow", "Fira Sans", Arial, sans-serif;
}
/* Тикер цен — биржевая лента; виден и на телефоне (листается пальцем) */
.top1, .top1 .tp { display: block !important; height: auto; }
.top1 { background: #121419; border-bottom: 1px solid #2b313b; color: var(--sl-steel-light); }
.top1 .tp { display: flex !important; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; max-width: 1500px; }
.top1 .tp::-webkit-scrollbar { display: none; }
.top1 .price_top {
  flex: 0 0 auto; width: auto; float: none; display: grid; grid-template-columns: auto auto; column-gap: 8px; align-items: baseline;
  padding: 6px 14px; border-right: 1px solid #232831; text-align: left; white-space: nowrap;
  color: var(--sl-steel-light); font: 11px/1.35 var(--sl-head-font); background: none; transition: background .2s;
}
.top1 .price_top:hover { background: #1b1f27; color: #fff; text-decoration: none; }
.top1 .price_top span { grid-column: 1 / -1; color: #9aa6b6; letter-spacing: .02em; }
.top1 .price_top br { display: none; }
.top1 .price_top .price1, .top1 .price_top .drop, .top1 .price_top .rise, .top1 .price_top .nochange {
  display: inline; float: none; margin: 0; font-variant-numeric: tabular-nums;
  font-family: "Roboto Mono", ui-monospace, Menlo, Consolas, monospace; font-size: 12.5px;
}
.top1 .price_top .price1 { color: #fff; font-weight: 600; }
.top1 .price_top .drop { color: var(--sl-down); }
.top1 .price_top .drop::before { content: "▼ "; font-size: 8px; }
.top1 .price_top .rise { color: var(--sl-up); }
.top1 .price_top .rise::before { content: "▲ "; font-size: 8px; }
.top1 .price_top .nochange { color: #7d8796; }
/* Шапка: графит с фактурой проката и раскалённой полосой снизу */
.dark_bg {
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(0,0,0,.08)),
              repeating-linear-gradient(90deg, rgba(255,255,255,.018) 0 2px, transparent 2px 6px), var(--sl-graphite);
  box-shadow: inset 0 -3px 0 var(--sl-hot), 0 6px 18px rgba(0,0,0,.18);
}
.dark_bg .light_small_font h1, .dark_bg .light_small_font h3 {
  color: var(--sl-steel-light); font-family: var(--sl-head-font); font-weight: 400; letter-spacing: .42em; text-transform: lowercase;
}
.dark_bg .main_menu li a {
  font-family: var(--sl-head-font); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #e9edf2;
  border-radius: 6px; transition: color .2s, background .2s;
}
.dark_bg .main_menu li a:hover { color: var(--sl-hot-2); background: rgba(255,255,255,.04); }
.dark_bg .main_menu li.active a { color: #fff; background: var(--sl-hot); }
.dark_bg .main_menu li a:focus-visible, .dark_bg a:focus-visible { outline: 2px solid var(--sl-hot-2); outline-offset: 2px; }
/* Заголовки по всему сайту — узкий гротеск */
h1, h2, h3, .sub_head { font-family: var(--sl-head-font); }
@media (max-width: 700px) {
  .top1 .price_top { padding: 5px 10px; }
  .dark_bg .light_small_font h1, .dark_bg .light_small_font h3 { letter-spacing: .3em; }
}
