/* ============================================================
   Akdeniz — бегущая лента направлений. Две встречные строки,
   слегка завалены — чтобы не выглядело линейкой.
   ============================================================ */

.ticker{
  position:relative; z-index:5;
  /* шире экрана: наклон не должен обнажать углы */
  width:100%; overflow:hidden; margin:clamp(30px,6vh,66px) 0 clamp(10px,3vh,34px);
  padding:clamp(10px,1.6vh,18px) 0;
  rotate:-2.4deg;
  border-top:1px solid rgba(143,178,198,.1);
  border-bottom:1px solid rgba(143,178,198,.1);
  background:linear-gradient(90deg, rgba(8,32,52,0), rgba(8,32,52,.5) 12%, rgba(8,32,52,.5) 88%, rgba(8,32,52,0));
}

.ticker__row{ overflow:hidden; padding:4px 0; width:114%; margin-left:-7%; }
.ticker__row + .ticker__row{ margin-top:9px; }
.ticker__track{
  display:flex; align-items:center; width:max-content;
  animation:ticker-run 46s linear infinite;
  will-change:transform;
}
.ticker__row--back .ticker__track{ animation-name:ticker-back; animation-duration:54s; }

/* половина трека — это ровно один набор, поэтому петля не видна */
@keyframes ticker-run{
  from{ transform:translateX(0); }
  to  { transform:translateX(-50%); }
}
@keyframes ticker-back{
  from{ transform:translateX(-50%); }
  to  { transform:translateX(0); }
}

.ticker span{
  font-family:var(--mono); font-size:clamp(13px,1.5vw,17px);
  text-transform:uppercase; letter-spacing:.06em; white-space:nowrap;
  color:#a9c6d6;
}
.ticker i{
  font-style:normal; color:var(--accent);
  margin:0 clamp(14px,1.8vw,26px); font-size:11px; opacity:.75;
}
/* нижняя строка тише — иначе две одинаковые полосы спорят между собой */
.ticker__row--back span{ font-size:clamp(12px,1.25vw,14.5px); color:#7f9fb2; }
.ticker__row--back i{ opacity:.5; }

/* наведёшь — остановится, можно прочитать */
.ticker:hover .ticker__track{ animation-play-state:paused; }

@media (max-width:900px){
  .ticker{ rotate:-3deg; }
}
@media (prefers-reduced-motion:reduce){
  .ticker__track{ animation:none; }
  .ticker__row{ width:132%; margin-left:-16%; }
}
