/* =========================================================
   BASTION — SVG RING CORE EFFECTS v16
   FIX: прибрано “розліт” окремого великого кола.
   Принцип: новий SVG-шар більше не малює власне велике кільце,
   а працює тільки як тонка внутрішня анімація всередині базового HUD.
   ========================================================= */

.hud-ring {
  --ringTiltX: 0deg;
  --ringTiltY: 0deg;
  --ringReactive: 0;
  isolation: isolate;
  perspective: 1200px;
}

/* Головний фікс:
   - було занадто близько до країв HUD;
   - велике SVG-коло читалось як окреме кільце;
   - тепер шар компактніший і обрізаний по геометрії контейнера. */
.ring-v14-core {
  position: absolute;
  inset: 9.5%;
  z-index: 3;
  pointer-events: none;
  transform-style: preserve-3d;
  transform:
    rotateX(var(--ringTiltX))
    rotateY(var(--ringTiltY));
  transition: transform .35s ease-out;
  mix-blend-mode: screen;
  opacity: .58;
  overflow: hidden;
  border-radius: 50%;
  -webkit-mask-image: radial-gradient(
    circle,
    transparent 0%,
    transparent 43%,
    #000 44%,
    #000 72%,
    transparent 73%
  );
  mask-image: radial-gradient(
    circle,
    transparent 0%,
    transparent 43%,
    #000 44%,
    #000 72%,
    transparent 73%
  );
}

.ring-v14-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  transform: scale(.82);
  transform-origin: 50% 50%;
}

.ring-v14-svg circle,
.ring-v14-svg path {
  fill: none;
  vector-effect: non-scaling-stroke;
  transform-box: view-box;
  transform-origin: 300px 300px;
}

/* Прибираємо великий halo, бо саме він давав відчуття другого “плаваючого” кола */
.ring-v14-halo {
  display: none !important;
}

/* Основні SVG-сегменти — тонкі, внутрішні, без великих білих уламків */
.ring-v14-segments-a {
  animation: ringV16RotateSlow 118s linear infinite;
}

.ring-v14-segments-a circle {
  stroke: url(#ringV14RedStroke);
  stroke-width: 2.2;
  stroke-linecap: butt;
  stroke-dasharray: 42 52 84 70 36 88 96 112 58 362;
  filter: url(#ringV14Glow);
  opacity: .30;
}

.ring-v14-segments-b {
  animation: ringV16RotateReverse 144s linear infinite;
}

.ring-v14-segments-b circle {
  stroke: rgba(255, 84, 96, .20);
  stroke-width: 1.05;
  stroke-linecap: square;
  stroke-dasharray: 12 40 38 66 10 72 62 96 28 576;
  filter: drop-shadow(0 0 4px rgba(255, 48, 72, .10));
  opacity: .34;
}

/* Мітки кільця — залишаємо як технічний noise, але без домінування */
.ring-v14-ticks-a {
  animation: ringV16RotateTicks 112s linear infinite;
}

.ring-v14-ticks-a circle {
  stroke: rgba(255,255,255,.13);
  stroke-width: 1.15;
  stroke-dasharray: .8 13.2;
  opacity: .22;
}

.ring-v14-ticks-b {
  animation: ringV16RotateReverse 86s linear infinite;
}

.ring-v14-ticks-b circle {
  stroke: rgba(255, 54, 76, .18);
  stroke-width: .75;
  stroke-dasharray: .6 20;
  opacity: .22;
}

/* Scanner — дуже короткий, теплий, не білий уламок */
.ring-v14-scanner {
  animation: ringV16ScannerRotate 11.5s linear infinite;
}

.ring-v14-scanner circle {
  stroke: rgba(255, 180, 174, .34);
  stroke-width: 1.45;
  stroke-linecap: round;
  stroke-dasharray: 14 986;
  filter:
    drop-shadow(0 0 4px rgba(255, 210, 210, .22))
    drop-shadow(0 0 11px rgba(255, 38, 66, .18));
  opacity: .38;
}

/* Прибираємо data-flow дуги: вони створювали враження розлетілого кола */
.ring-v14-data-flow {
  display: none !important;
}

/* Crosshair залишаємо ледь помітним */
.ring-v14-crosshair path {
  stroke: rgba(255, 70, 88, .075);
  stroke-width: .65;
  filter: drop-shadow(0 0 5px rgba(255, 40, 62, .10));
  animation: ringV16CrosshairPulse 9.5s ease-in-out infinite;
}

/* Energy nodes у v16 ховаємо: вони додавали зайвий “розсип” */
.ring-v14-node {
  display: none !important;
}

/* Старий active-layer теж не має перетворюватись на “банан” */
.hud-ring .ring-active-layer {
  opacity: .10 !important;
  filter: drop-shadow(0 0 4px rgba(255, 54, 72, .06)) !important;
}

/* Легка реакція на hover */
.hud-ring:hover .ring-v14-segments-a circle,
.hud-ring.is-ring-reactive .ring-v14-segments-a circle {
  opacity: .42;
  stroke-width: 2.45;
}

.hud-ring:hover .ring-v14-scanner circle,
.hud-ring.is-ring-reactive .ring-v14-scanner circle {
  opacity: .55;
}

/* Українські написи */
.hud-ring .brand-subtitle,
.hud-ring .enter-link {
  font-family: "Rajdhani", "Exo 2", system-ui, sans-serif !important;
  text-transform: uppercase !important;
}

.hud-ring .brand-subtitle {
  letter-spacing: .28em !important;
  color: rgba(255, 82, 72, .88) !important;
}

.hud-ring .enter-link {
  letter-spacing: .30em !important;
  color: rgba(245, 247, 255, .86) !important;
}

/* Animations */
@keyframes ringV16RotateSlow { to { transform: rotate(360deg); } }
@keyframes ringV16RotateReverse { to { transform: rotate(-360deg); } }
@keyframes ringV16RotateTicks { to { transform: rotate(360deg); } }
@keyframes ringV16ScannerRotate { to { transform: rotate(360deg); } }

@keyframes ringV16CrosshairPulse {
  0%, 100% { opacity: .10; }
  50% { opacity: .20; }
}

@media (prefers-reduced-motion: reduce) {
  .ring-v14-core,
  .ring-v14-core *,
  .ring-v14-svg * {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition: none !important;
  }
}

@media (max-width: 900px) {
  .ring-v14-core { inset: 12%; }
}


/* =========================================================
   BASTION — LIVE PREMIUM EFFECTS v17
   Додає:
   1) золотий енергетичний спалах логотипа;
   2) 3D-нахил HUD-кільця від курсора;
   3) hover-режим “система прокидається”;
   4) metallic sweep по BASTION;
   5) мікро-іскри на кільці;
   6) scan-line через центр;
   7) активний стан напису “ВХІД • РЕЄСТРАЦІЯ”.
   ========================================================= */

.hero-center,
.bastion-core,
.core-shell {
  transform-style: preserve-3d;
}

/* 3D tilt */
.hud-ring {
  transform:
    translate3d(var(--ring-parallax-x, 0px), var(--ring-parallax-y, 0px), 0)
    rotateX(var(--ring-tilt-x, 0deg))
    rotateY(var(--ring-tilt-y, 0deg));
  transform-style: preserve-3d;
  transition:
    transform .28s cubic-bezier(.2,.8,.2,1),
    filter .35s ease,
    opacity .35s ease;
  will-change: transform, filter;
}

.hud-ring.is-ring-awake {
  filter:
    drop-shadow(0 0 10px rgba(255, 58, 78, .16))
    drop-shadow(0 0 34px rgba(255, 30, 54, .10));
}

/* Logo gold burst */
.brand-mark,
.logo-mark,
.bastion-logo,
.hero-logo,
.core-logo {
  position: relative;
  transform-style: preserve-3d;
  will-change: filter, transform;
  animation: bastionLogoBreathV17 6.8s ease-in-out infinite;
}

.brand-mark::before,
.logo-mark::before,
.bastion-logo::before,
.hero-logo::before,
.core-logo::before {
  content: "";
  position: absolute;
  inset: -42%;
  pointer-events: none;
  opacity: 0;
  background:
    radial-gradient(circle, rgba(255, 213, 72, .55) 0%, rgba(255, 140, 0, .16) 28%, transparent 62%);
  filter: blur(10px);
  mix-blend-mode: screen;
  animation: bastionLogoGoldBurstV17 10.5s ease-in-out infinite;
}

.brand-mark::after,
.logo-mark::after,
.bastion-logo::after,
.hero-logo::after,
.core-logo::after {
  content: "";
  position: absolute;
  inset: -30%;
  pointer-events: none;
  opacity: 0;
  background:
    linear-gradient(115deg,
      transparent 0%,
      transparent 38%,
      rgba(255, 235, 150, .0) 43%,
      rgba(255, 235, 150, .75) 49%,
      rgba(255, 160, 20, .18) 54%,
      transparent 62%,
      transparent 100%);
  transform: translateX(-80%);
  mix-blend-mode: screen;
  animation: bastionLogoShardSweepV17 10.5s ease-in-out infinite;
}

/* Metallic sweep on BASTION */
.bastion-wordmark,
.brand-title,
.wordmark-bastion {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.bastion-wordmark::after,
.brand-title::after,
.wordmark-bastion::after {
  content: "";
  position: absolute;
  top: -35%;
  bottom: -35%;
  width: 18%;
  left: -26%;
  pointer-events: none;
  opacity: 0;
  background:
    linear-gradient(105deg,
      transparent 0%,
      rgba(255,255,255,0) 30%,
      rgba(255,255,255,.82) 48%,
      rgba(255,80,80,.22) 55%,
      transparent 72%);
  transform: skewX(-18deg);
  filter: blur(.4px);
  mix-blend-mode: screen;
  animation: bastionWordSweepV17 8.4s cubic-bezier(.55,0,.22,1) infinite;
}

/* Center scan line */
.hero-center::after,
.bastion-core::after,
.core-shell::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(760px, 62vw);
  height: 1px;
  pointer-events: none;
  opacity: 0;
  transform: translate(-50%, -50%);
  background:
    linear-gradient(90deg,
      transparent,
      rgba(255, 52, 76, .12),
      rgba(255, 255, 255, .62),
      rgba(255, 52, 76, .18),
      transparent);
  box-shadow:
    0 0 8px rgba(255,255,255,.24),
    0 0 22px rgba(255,36,60,.16);
  animation: bastionCenterScanLineV17 11s ease-in-out infinite;
}

/* Ring sparks */
.ring-v17-sparks {
  position: absolute;
  inset: 0;
  z-index: 9;
  pointer-events: none;
  border-radius: 50%;
  overflow: visible;
  transform-style: preserve-3d;
  opacity: .85;
}

.ring-v17-spark {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: rgba(255, 235, 220, .88);
  box-shadow:
    0 0 8px rgba(255, 235, 220, .55),
    0 0 18px rgba(255, 40, 66, .28);
  opacity: 0;
  transform:
    rotate(var(--spark-angle))
    translateX(var(--spark-radius))
    rotate(calc(var(--spark-angle) * -1))
    scale(.65);
  animation: bastionRingSparkV17 var(--spark-duration) ease-in-out infinite;
  animation-delay: var(--spark-delay);
}

.ring-v17-spark::after {
  content: "";
  position: absolute;
  left: -10px;
  top: 1px;
  width: 20px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 70, 90, .58), transparent);
  opacity: .5;
}

/* Active access link */
.enter-link,
.access-actions,
.access-link,
.start-access {
  position: relative;
  isolation: isolate;
  cursor: pointer;
  transition:
    color .25s ease,
    text-shadow .25s ease,
    letter-spacing .25s ease,
    filter .25s ease;
}

.enter-link::before,
.access-actions::before,
.access-link::before,
.start-access::before {
  content: "";
  position: absolute;
  left: -34px;
  right: -34px;
  top: 50%;
  height: 32px;
  transform: translateY(-50%) scaleX(.75);
  opacity: 0;
  pointer-events: none;
  border-left: 1px solid rgba(255, 68, 86, .72);
  border-right: 1px solid rgba(255, 68, 86, .72);
  background:
    linear-gradient(90deg,
      rgba(255, 48, 72, .0),
      rgba(255, 48, 72, .08),
      rgba(255, 48, 72, .0));
  transition:
    opacity .28s ease,
    transform .28s ease;
}

.enter-link:hover,
.access-actions:hover,
.access-link:hover,
.start-access:hover {
  color: rgba(255,255,255,.96) !important;
  text-shadow:
    0 0 8px rgba(255,255,255,.28),
    0 0 20px rgba(255, 50, 72, .26);
  filter: brightness(1.12);
}

.enter-link:hover::before,
.access-actions:hover::before,
.access-link:hover::before,
.start-access:hover::before {
  opacity: 1;
  transform: translateY(-50%) scaleX(1);
}

.access-dot,
.enter-dot {
  display: inline-block;
  color: rgba(255, 46, 62, .95);
  text-shadow:
    0 0 8px rgba(255, 38, 62, .65),
    0 0 18px rgba(255, 38, 62, .28);
  animation: bastionAccessDotPulseV17 2.4s ease-in-out infinite;
}

.enter-link:hover,
.access-actions:hover {
  animation: bastionAccessRowWakeV17 1.4s ease-in-out infinite;
}

/* Wake mode */
.hud-ring.is-ring-awake .ring-v14-segments-a circle {
  opacity: .48;
  stroke-width: 2.55;
}

.hud-ring.is-ring-awake .ring-v14-segments-b circle {
  opacity: .44;
}

.hud-ring.is-ring-awake .ring-v14-scanner circle {
  opacity: .64;
  stroke-width: 1.8;
}

.hud-ring.is-ring-awake .ring-v14-ticks-a circle,
.hud-ring.is-ring-awake .ring-v14-ticks-b circle {
  opacity: .34;
}

/* Keyframes */
@keyframes bastionLogoBreathV17 {
  0%, 100% {
    filter:
      drop-shadow(0 0 7px rgba(255, 196, 30, .28))
      drop-shadow(0 0 18px rgba(255, 140, 0, .12));
    transform: translateZ(0) scale(1);
  }
  50% {
    filter:
      drop-shadow(0 0 10px rgba(255, 220, 70, .44))
      drop-shadow(0 0 30px rgba(255, 145, 0, .20));
    transform: translateZ(8px) scale(1.012);
  }
}

@keyframes bastionLogoGoldBurstV17 {
  0%, 68%, 100% { opacity: 0; transform: scale(.72); }
  72% { opacity: .34; transform: scale(.95); }
  76% { opacity: .70; transform: scale(1.12); }
  84% { opacity: .12; transform: scale(1.35); }
}

@keyframes bastionLogoShardSweepV17 {
  0%, 69%, 100% { opacity: 0; transform: translateX(-88%) skewX(-18deg); }
  73% { opacity: .34; }
  78% { opacity: .90; transform: translateX(92%) skewX(-18deg); }
  84% { opacity: 0; transform: translateX(128%) skewX(-18deg); }
}

@keyframes bastionWordSweepV17 {
  0%, 58%, 100% { left: -28%; opacity: 0; }
  64% { opacity: .18; }
  70% { opacity: .58; }
  78% { left: 110%; opacity: .12; }
  82% { opacity: 0; }
}

@keyframes bastionCenterScanLineV17 {
  0%, 74%, 100% {
    opacity: 0;
    transform: translate(-50%, -50%) scaleX(.45);
  }
  78% {
    opacity: .36;
    transform: translate(-50%, -50%) scaleX(.78);
  }
  84% {
    opacity: .15;
    transform: translate(-50%, -50%) scaleX(1.08);
  }
  90% {
    opacity: 0;
    transform: translate(-50%, -50%) scaleX(1.18);
  }
}

@keyframes bastionRingSparkV17 {
  0%, 72%, 100% {
    opacity: 0;
    transform:
      rotate(var(--spark-angle))
      translateX(var(--spark-radius))
      rotate(calc(var(--spark-angle) * -1))
      scale(.35);
  }
  78% {
    opacity: .85;
    transform:
      rotate(calc(var(--spark-angle) + 4deg))
      translateX(calc(var(--spark-radius) + 2px))
      rotate(calc((var(--spark-angle) + 4deg) * -1))
      scale(1);
  }
  86% {
    opacity: .14;
    transform:
      rotate(calc(var(--spark-angle) + 11deg))
      translateX(calc(var(--spark-radius) + 9px))
      rotate(calc((var(--spark-angle) + 11deg) * -1))
      scale(.62);
  }
}

@keyframes bastionAccessDotPulseV17 {
  0%, 100% { opacity: .48; transform: scale(.86); }
  50% { opacity: 1; transform: scale(1.18); }
}

@keyframes bastionAccessRowWakeV17 {
  0%, 100% { text-shadow: 0 0 10px rgba(255, 60, 80, .16); }
  50% { text-shadow: 0 0 18px rgba(255, 60, 80, .38); }
}

@media (prefers-reduced-motion: reduce) {
  .hud-ring,
  .hud-ring *,
  .brand-mark,
  .logo-mark,
  .bastion-logo,
  .hero-logo,
  .core-logo,
  .bastion-wordmark,
  .brand-title,
  .wordmark-bastion,
  .hero-center::after,
  .bastion-core::after,
  .core-shell::after {
    animation: none !important;
    transition: none !important;
  }
}



/* =========================================================
   BASTION — VISIBLE PREMIUM EFFECTS v18
   ФІКС: v17 частково не працював, бо стилі били по неіснуючих
   класах .hero-center / .bastion-wordmark / .hero-logo.
   Актуальні класи сторінки:
   .hud-ring, .ring-center, .brand-mark, .brand-name,
   .brand-subtitle, .signal-line, .enter-link
   ========================================================= */

/* ---------- actual center core ---------- */

.ring-center {
  position: absolute;
  isolation: isolate;
  transform-style: preserve-3d;
  will-change: transform, filter;
}

/* ---------- 3D ring tilt: stronger, visible ---------- */

.hud-ring {
  transform:
    perspective(1200px)
    translate3d(var(--ring-parallax-x, 0px), var(--ring-parallax-y, 0px), 0)
    rotateX(var(--ring-tilt-x, 0deg))
    rotateY(var(--ring-tilt-y, 0deg));
  transform-style: preserve-3d;
  transition:
    transform .18s cubic-bezier(.2,.8,.2,1),
    filter .25s ease;
  will-change: transform, filter;
}

.hud-ring.is-ring-awake {
  filter:
    drop-shadow(0 0 16px rgba(255, 58, 78, .24))
    drop-shadow(0 0 52px rgba(255, 20, 50, .14));
}

/* ---------- logo: pseudo-elements do not work on img, so JS injects real layers ---------- */

.brand-mark {
  position: relative;
  z-index: 5;
  animation: bastionLogoBreathV18 5.8s ease-in-out infinite;
  filter:
    drop-shadow(0 0 8px rgba(255, 190, 24, .38))
    drop-shadow(0 0 22px rgba(255, 120, 0, .18));
}

.logo-burst-v18,
.logo-sweep-v18 {
  position: absolute;
  left: 50%;
  top: var(--logo-v18-top, 16%);
  width: 128px;
  height: 128px;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 4;
  mix-blend-mode: screen;
}

.logo-burst-v18 {
  opacity: 0;
  border-radius: 50%;
  background:
    radial-gradient(circle,
      rgba(255, 224, 84, .88) 0%,
      rgba(255, 150, 22, .32) 28%,
      rgba(255, 50, 20, .08) 48%,
      transparent 68%);
  filter: blur(12px);
  animation: bastionLogoGoldBurstV18 8.2s ease-in-out infinite;
}

.logo-sweep-v18 {
  opacity: 0;
  overflow: hidden;
  clip-path: polygon(16% 0, 100% 0, 84% 100%, 0 100%);
}

.logo-sweep-v18::before {
  content: "";
  position: absolute;
  inset: -15% 0;
  width: 42%;
  background:
    linear-gradient(105deg,
      transparent 0%,
      rgba(255,255,255,.0) 22%,
      rgba(255,255,255,.92) 48%,
      rgba(255,196,50,.44) 60%,
      transparent 82%);
  transform: translateX(-130%) skewX(-18deg);
  animation: bastionLogoShardSweepV18 8.2s cubic-bezier(.55,0,.22,1) infinite;
}

/* ---------- BASTION metallic sweep: actual class .brand-name ---------- */

.brand-name {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.brand-name::before {
  content: "";
  position: absolute;
  top: -38%;
  bottom: -38%;
  width: 22%;
  left: -32%;
  opacity: 0;
  pointer-events: none;
  background:
    linear-gradient(105deg,
      transparent 0%,
      rgba(255,255,255,0) 28%,
      rgba(255,255,255,.92) 47%,
      rgba(255,72,72,.34) 55%,
      transparent 74%);
  transform: skewX(-18deg);
  filter: blur(.35px);
  mix-blend-mode: screen;
  animation: bastionBrandSweepV18 6.8s cubic-bezier(.55,0,.22,1) infinite;
}

.brand-name::after {
  content: "";
  position: absolute;
  left: 8%;
  right: 8%;
  top: 50%;
  height: 2px;
  pointer-events: none;
  opacity: 0;
  background:
    linear-gradient(90deg,
      transparent,
      rgba(255, 55, 64, .0),
      rgba(255, 245, 240, .65),
      rgba(255, 55, 64, .30),
      transparent);
  box-shadow:
    0 0 8px rgba(255,255,255,.18),
    0 0 24px rgba(255,45,65,.22);
  animation: bastionBrandCoreFlashV18 8.2s ease-in-out infinite;
}

/* ---------- scan line: actual injected node ---------- */

.core-scan-line-v18 {
  position: absolute;
  left: 50%;
  top: 58%;
  width: min(720px, 64vw);
  height: 1px;
  transform: translate(-50%, -50%) scaleX(.45);
  opacity: 0;
  pointer-events: none;
  z-index: 2;
  background:
    linear-gradient(90deg,
      transparent,
      rgba(255, 40, 66, .18),
      rgba(255, 255, 255, .68),
      rgba(255, 40, 66, .18),
      transparent);
  box-shadow:
    0 0 10px rgba(255,255,255,.26),
    0 0 32px rgba(255,32,60,.22);
  animation: bastionCoreScanV18 9.2s ease-in-out infinite;
}

/* ---------- ring sparks: more visible but contained ---------- */

.ring-v17-sparks {
  inset: 6%;
  z-index: 20;
  opacity: 1;
  mix-blend-mode: screen;
}

.ring-v17-spark {
  width: 4px;
  height: 4px;
  background: rgba(255, 238, 228, .98);
  box-shadow:
    0 0 9px rgba(255, 238, 228, .75),
    0 0 24px rgba(255, 48, 72, .42);
}

/* ---------- ring wake: stronger scanner/ticks ---------- */

.hud-ring.is-ring-awake .ring-v14-segments-a circle {
  opacity: .58 !important;
  stroke-width: 2.8 !important;
}

.hud-ring.is-ring-awake .ring-v14-segments-b circle {
  opacity: .52 !important;
  stroke-width: 1.35 !important;
}

.hud-ring.is-ring-awake .ring-v14-scanner circle {
  opacity: .82 !important;
  stroke-width: 2.2 !important;
}

.hud-ring.is-ring-awake .ring-v14-ticks-a circle,
.hud-ring.is-ring-awake .ring-v14-ticks-b circle {
  opacity: .46 !important;
}

/* ---------- Ukrainian UI text wake ---------- */

.brand-subtitle {
  position: relative;
  transition:
    color .25s ease,
    text-shadow .25s ease,
    letter-spacing .25s ease;
}

.hud-ring.is-ring-awake .brand-subtitle {
  color: rgba(255, 94, 78, .96) !important;
  text-shadow:
    0 0 8px rgba(255, 52, 70, .28),
    0 0 24px rgba(255, 52, 70, .18);
}

.enter-link {
  position: relative;
  isolation: isolate;
  cursor: pointer;
  transition:
    color .22s ease,
    text-shadow .22s ease,
    filter .22s ease,
    letter-spacing .22s ease;
}

.enter-link::before {
  content: "";
  position: absolute;
  left: -42px;
  right: -42px;
  top: 50%;
  height: 34px;
  transform: translateY(-50%) scaleX(.72);
  opacity: 0;
  pointer-events: none;
  border-left: 1px solid rgba(255, 68, 86, .82);
  border-right: 1px solid rgba(255, 68, 86, .82);
  background:
    linear-gradient(90deg,
      transparent,
      rgba(255, 42, 70, .12),
      transparent);
  box-shadow:
    inset 0 0 18px rgba(255, 42, 70, .06),
    0 0 18px rgba(255, 42, 70, .08);
  transition:
    opacity .25s ease,
    transform .25s ease;
}

.enter-link:hover,
.hud-ring.is-ring-awake .enter-link {
  color: rgba(255,255,255,.95) !important;
  text-shadow:
    0 0 8px rgba(255,255,255,.28),
    0 0 24px rgba(255, 50, 72, .28);
  filter: brightness(1.12);
}

.enter-link:hover::before {
  opacity: 1;
  transform: translateY(-50%) scaleX(1);
}

.access-dot {
  display: inline-block;
  color: rgba(255, 46, 62, .98);
  text-shadow:
    0 0 8px rgba(255, 38, 62, .75),
    0 0 20px rgba(255, 38, 62, .38);
  animation: bastionAccessDotPulseV18 1.8s ease-in-out infinite;
}

/* ---------- temporary diagnostic mode disabled by default ----------
   Додай клас show-effect-debug на body, якщо хочеш побачити зони ефектів.
*/
body.show-effect-debug .logo-burst-v18,
body.show-effect-debug .core-scan-line-v18 {
  outline: 1px solid rgba(0,255,0,.55);
}

/* ---------- keyframes ---------- */

@keyframes bastionLogoBreathV18 {
  0%, 100% {
    filter:
      drop-shadow(0 0 8px rgba(255, 190, 24, .34))
      drop-shadow(0 0 22px rgba(255, 120, 0, .16));
    transform: translateZ(0) scale(1);
  }
  50% {
    filter:
      drop-shadow(0 0 15px rgba(255, 225, 70, .70))
      drop-shadow(0 0 42px rgba(255, 140, 0, .36));
    transform: translateZ(10px) scale(1.035);
  }
}

@keyframes bastionLogoGoldBurstV18 {
  0%, 54%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(.62); }
  59% { opacity: .32; transform: translate(-50%, -50%) scale(.88); }
  63% { opacity: .86; transform: translate(-50%, -50%) scale(1.16); }
  72% { opacity: .10; transform: translate(-50%, -50%) scale(1.58); }
}

@keyframes bastionLogoShardSweepV18 {
  0%, 55%, 100% { opacity: 0; }
  59% { opacity: .45; }
  67% { opacity: .95; }
  76% { opacity: 0; }
}

@keyframes bastionLogoShardSweepV18 {
  0%, 55%, 100% { opacity: 0; }
  59% { opacity: .45; }
  67% { opacity: .95; }
  76% { opacity: 0; }
}

.logo-sweep-v18::before {
  animation-name: bastionLogoShardMoveV18;
}

@keyframes bastionLogoShardMoveV18 {
  0%, 55%, 100% { transform: translateX(-150%) skewX(-18deg); }
  68% { transform: translateX(245%) skewX(-18deg); }
}

@keyframes bastionBrandSweepV18 {
  0%, 46%, 100% { left: -32%; opacity: 0; }
  52% { opacity: .26; }
  60% { opacity: .86; }
  72% { left: 114%; opacity: .18; }
  78% { opacity: 0; }
}

@keyframes bastionBrandCoreFlashV18 {
  0%, 63%, 100% { opacity: 0; transform: scaleX(.3); }
  68% { opacity: .42; transform: scaleX(.75); }
  73% { opacity: .18; transform: scaleX(1.05); }
  80% { opacity: 0; transform: scaleX(1.2); }
}

@keyframes bastionCoreScanV18 {
  0%, 70%, 100% {
    opacity: 0;
    transform: translate(-50%, -50%) scaleX(.42);
  }
  75% {
    opacity: .56;
    transform: translate(-50%, -50%) scaleX(.78);
  }
  83% {
    opacity: .18;
    transform: translate(-50%, -50%) scaleX(1.16);
  }
  88% {
    opacity: 0;
    transform: translate(-50%, -50%) scaleX(1.28);
  }
}

@keyframes bastionAccessDotPulseV18 {
  0%, 100% { opacity: .52; transform: scale(.86); }
  50% { opacity: 1; transform: scale(1.22); }
}

@media (prefers-reduced-motion: reduce) {
  .brand-mark,
  .brand-name::before,
  .brand-name::after,
  .logo-burst-v18,
  .logo-sweep-v18,
  .logo-sweep-v18::before,
  .core-scan-line-v18,
  .ring-v17-spark,
  .access-dot {
    animation: none !important;
    transition: none !important;
  }
}