/**
 * HUD-линия под персонажем на главной (линия + уголковые скобы).
 * Не связана с каруселью баннеров.
 */

body.page-home {
  --hud-line-h: 3px;
  --hud-corner-overlap: 2px;
  --hud-corner-clip: 22px;
}

/* HUD внизу hero — вплотную к персонажу */
body.page-home .hero .hero-promo-hud-strap {
  position: relative;
  z-index: 5;
  width: 100%;
  margin: -36px 0 0;
  padding: 0;
  pointer-events: none;
}

body.page-home .hero-hud {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 26px;
  flex-shrink: 0;
  pointer-events: none;
}

body.page-home .hero-hud::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: auto;
  height: var(--hud-line-h, 3px);
  border-radius: 3px;
  clip-path: inset(0 var(--hud-corner-clip, 22px) 0 var(--hud-corner-clip, 22px));
  -webkit-clip-path: inset(0 var(--hud-corner-clip, 22px) 0 var(--hud-corner-clip, 22px));
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255, 255, 255, 0.06) 6%,
    rgba(255, 255, 255, 0.2) 12%,
    rgba(255, 255, 255, 0.95) 50%,
    rgba(255, 255, 255, 0.2) 88%,
    rgba(255, 255, 255, 0.06) 94%,
    transparent 100%
  );
  box-shadow:
    0 0 6px rgba(255, 255, 255, 0.45),
    0 0 20px rgba(255, 255, 255, 0.22);
}

body.page-home .hero-hud::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: auto;
  height: 100%;
  transform: translateY(3px);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-1.5 -1.5 23 23' shape-rendering='geometricPrecision'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='5.5' stroke-opacity='0.24' stroke-linecap='round' stroke-linejoin='round' d='M 3 3 L 3 10 A 7 7 0 0 0 10 17 L 22 17'/%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='3.6' stroke-opacity='0.96' stroke-linecap='round' stroke-linejoin='round' d='M 3 3 L 3 10 A 7 7 0 0 0 10 17 L 22 17'/%3E%3C/svg%3E") left 0 bottom 0 / 22px 22px no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-1.5 -1.5 23 23' shape-rendering='geometricPrecision'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='5.5' stroke-opacity='0.24' stroke-linecap='round' stroke-linejoin='round' d='M 17 3 L 17 10 A 7 7 0 0 1 10 17 L 0 17'/%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='3.6' stroke-opacity='0.96' stroke-linecap='round' stroke-linejoin='round' d='M 17 3 L 17 10 A 7 7 0 0 1 10 17 L 0 17'/%3E%3C/svg%3E") right 0 bottom 0 / 22px 22px no-repeat;
}

@media (prefers-reduced-motion: reduce) {
  body.page-home .hero-hud::before {
    box-shadow: none;
  }
}