.title-ship-laser {
  --laser-angle: 0deg;
  position: absolute;
  z-index: 40;
  top: 0;
  left: 0;
  width: 1px;
  height: 0;
  pointer-events: none;
  transform: rotate(var(--laser-angle));
  transform-origin: 50% 0;
}

.firstblock .box-visual.is-laser-hit .mboxx {
  animation: titleLaserBoxHit 5200ms ease-in-out both;
}

.firstblock .box-visual.is-laser-hit::before,
.firstblock .box-visual.is-laser-hit::after {
  animation: titleLaserBoxAuraHit 5200ms ease-in-out both;
}

.firstblock.is-laser-passing .firstblock-title {
  animation: none;
}

.firstblock.is-laser-passing .firstblock-copy {
  animation: none;
}

.firstblock .title-laser-text-reflection {
  --laser-reflect-x1: 50%;
  --laser-reflect-y1: 12%;
  --laser-reflect-x2: 50%;
  --laser-reflect-y2: 32%;
  --laser-reflect-x3: 50%;
  --laser-reflect-y3: 52%;
  --laser-reflect-x4: 50%;
  --laser-reflect-y4: 72%;
  --laser-reflect-x5: 50%;
  --laser-reflect-y5: 90%;
  position: absolute !important;
  z-index: 0;
  margin: 0 !important;
  pointer-events: none;
  opacity: 0;
  overflow: visible;
  border-radius: 38% 62% 47% 53% / 58% 42% 61% 39%;
  background:
    radial-gradient(ellipse 62px 34px at var(--laser-reflect-x1) var(--laser-reflect-y1), rgba(255, 68, 24, 0.82) 0 13%, rgba(255, 0, 0, 0.46) 38%, transparent 75%),
    radial-gradient(ellipse 48px 38px at var(--laser-reflect-x2) var(--laser-reflect-y2), rgba(255, 108, 28, 0.78) 0 11%, rgba(235, 15, 0, 0.42) 42%, transparent 78%),
    radial-gradient(ellipse 70px 31px at var(--laser-reflect-x3) var(--laser-reflect-y3), rgba(255, 45, 18, 0.8) 0 12%, rgba(190, 0, 0, 0.44) 40%, transparent 76%),
    radial-gradient(ellipse 52px 42px at var(--laser-reflect-x4) var(--laser-reflect-y4), rgba(255, 118, 34, 0.72) 0 10%, rgba(225, 22, 0, 0.4) 39%, transparent 77%),
    radial-gradient(ellipse 66px 35px at var(--laser-reflect-x5) var(--laser-reflect-y5), rgba(255, 54, 18, 0.76) 0 12%, rgba(170, 0, 0, 0.4) 41%, transparent 78%);
  filter: blur(7px) saturate(1.22);
  mix-blend-mode: screen;
  transition: opacity 90ms linear;
}

.firstblock .title-laser-text-reflection.is-cooling {
  animation: titleLaserLettersCool 1900ms ease-out forwards;
}

.firstblock .conttext {
  isolation: isolate;
}

.firstblock .conttext > .text {
  position: relative;
  z-index: 2;
}

@media (max-width: 480px) {
  .firstblock .title-laser-text-reflection {
    filter: blur(5px) saturate(1.18);
    transform: scale(0.88);
  }
}

@keyframes titleLaserLettersCool {
  0% { opacity: 1; filter: blur(7px) hue-rotate(0deg) brightness(1) saturate(1.22); }
  30% { opacity: 0.88; filter: blur(7px) hue-rotate(8deg) brightness(0.92) saturate(1.1); }
  58% { opacity: 0.66; filter: blur(7px) hue-rotate(18deg) brightness(0.72) saturate(0.9); }
  82% { opacity: 0.34; filter: blur(7px) hue-rotate(28deg) brightness(0.48) saturate(0.66); }
  100% { opacity: 0; filter: blur(7px) hue-rotate(36deg) brightness(0.3) saturate(0.4); }
}

.firstblock .box-visual .title-laser-burn-mark {
  display: none;
}

.firstblock .box-visual .title-laser-burn-scar {
  position: absolute;
  z-index: 6;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
  animation: titleLaserMoltenScar var(--scar-life, 7200ms) ease-out forwards;
}

.title-laser-burn-scar path {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  vector-effect: non-scaling-stroke;
  animation: titleLaserScarDraw var(--scar-draw-duration, 1900ms) linear var(--scar-draw-delay, 140ms) forwards;
}

.title-laser-burn-scar .title-laser-burn-scar__glow {
  stroke: rgba(255, 42, 10, 0.78);
  stroke-width: 9;
  filter: blur(4px) drop-shadow(0 0 9px #ff2400);
  animation:
    titleLaserScarDraw var(--scar-draw-duration, 1900ms) linear var(--scar-draw-delay, 140ms) forwards,
    titleLaserGlowCool 5800ms ease-out var(--scar-cool-delay, 0ms) forwards;
}

.title-laser-burn-scar .title-laser-burn-scar__core {
  stroke: #fff0a0;
  stroke-width: 2.5;
  filter: drop-shadow(0 0 3px #fff) drop-shadow(0 0 7px #ff8a00);
  animation:
    titleLaserScarDraw var(--scar-draw-duration, 1900ms) linear var(--scar-draw-delay, 140ms) forwards,
    titleLaserCoreCool 5800ms ease-out var(--scar-cool-delay, 0ms) forwards;
}

.title-laser-burn-scar .title-laser-burn-scar__charred {
  stroke: rgba(8, 6, 6, 0.58);
  stroke-width: 4.8;
  opacity: 0;
  filter: blur(2.2px) drop-shadow(0 0 2px rgba(20, 4, 2, 0.32));
  animation: titleLaserCharredTrail 4800ms ease-in-out 1350ms forwards;
}

.title-laser-burn-scar .title-laser-burn-scar__drip {
  fill: none;
  stroke: #ff9a12;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 0 3px #fff0a0) drop-shadow(0 0 7px #ff3c00);
  opacity: 0;
  animation: titleLaserHotDrip 3500ms ease-out 1250ms forwards;
}

.title-ship-laser.is-firing {
  animation: none;
}

.empire-title.is-laser-cut-active {
  animation: titleLaserSolanaEdge 2850ms ease-in-out both;
}

.title-laser-welding-spark {
  position: absolute;
  z-index: 46;
  width: var(--spark-length, 10px);
  height: var(--spark-thickness, 2.6px);
  border-radius: 999px;
  pointer-events: none;
  background: linear-gradient(90deg, #fff, #eaffff 30%, #ffd86b 66%, rgba(255, 128, 20, 0));
  box-shadow:
    0 0 3px #fff,
    0 0 7px #d9ffff,
    0 0 11px rgba(255, 169, 46, 0.82),
    0 0 16px rgba(255, 90, 18, 0.38);
  transform: translate(-50%, -50%) rotate(var(--spark-angle, 0deg));
  transform-origin: 0 50%;
  animation: titleLaserWeldingSpark var(--spark-life, 2200ms) linear forwards;
}

.title-laser-welding-spark--shape-1 {
  clip-path: polygon(0 38%, 28% 15%, 52% 42%, 76% 8%, 100% 46%, 78% 78%, 48% 62%, 20% 92%);
}

.title-laser-welding-spark--shape-2 {
  clip-path: polygon(0 52%, 18% 12%, 43% 35%, 65% 4%, 100% 30%, 86% 72%, 57% 58%, 27% 96%);
}

.title-laser-welding-spark--shape-3 {
  clip-path: polygon(0 24%, 23% 44%, 39% 8%, 68% 38%, 100% 18%, 91% 72%, 62% 64%, 33% 94%, 12% 68%);
}

.title-laser-welding-spark--shape-4 {
  clip-path: polygon(0 44%, 15% 6%, 35% 48%, 58% 18%, 78% 46%, 100% 12%, 92% 76%, 64% 62%, 42% 96%, 19% 70%);
}

.title-laser-welding-spark--shape-5 {
  width: calc(var(--spark-length, 10px) * 0.72);
  height: calc(var(--spark-thickness, 2.6px) * 2.2);
  clip-path: polygon(0 50%, 38% 4%, 100% 34%, 72% 58%, 92% 100%, 33% 76%);
}

.title-laser-welding-spark--shape-6 {
  width: calc(var(--spark-thickness, 2.6px) * 2.4);
  height: calc(var(--spark-thickness, 2.6px) * 2.4);
  border-radius: 42% 58% 63% 37% / 55% 35% 65% 45%;
  clip-path: none;
}

.title-ship-laser__muzzle,
.title-ship-laser__beam,
.title-ship-laser__impact {
  position: absolute;
  left: 50%;
  opacity: 0;
  pointer-events: none;
}

.title-ship-laser__muzzle {
  top: -8px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: radial-gradient(circle, #fff 0 8%, #ff6b6b 22%, #ff1010 48%, transparent 72%);
  filter: blur(0.2px) drop-shadow(0 0 8px #ff1010) drop-shadow(0 0 16px rgba(255, 0, 0, 0.85));
  transform: translate(-50%, -50%) scale(0.2);
}

.title-ship-laser__beam {
  top: 0;
  width: 3px;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #ff1d1d, #fff 48%, #ff1d1d);
  box-shadow:
    0 0 3px #fff,
    0 0 8px #ff1010,
    0 0 18px rgba(255, 0, 0, 0.9),
    0 0 30px rgba(255, 0, 0, 0.42);
  transform: translateX(-50%) scaleY(0);
  transform-origin: 50% 0;
}

.title-ship-laser__impact {
  bottom: -8px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background:
    radial-gradient(circle, #fff 0 6%, #ff6767 18%, #ff1010 38%, rgba(255, 0, 0, 0.2) 58%, transparent 72%);
  filter: drop-shadow(0 0 9px #ff1010) drop-shadow(0 0 18px rgba(255, 0, 0, 0.62));
  transform: translate(-50%, 50%) scale(0.15);
}

.title-ship-laser.is-firing .title-ship-laser__muzzle {
  animation: titleShipMuzzle 2850ms ease-out both;
}

.title-ship-laser.is-firing .title-ship-laser__beam {
  animation: titleShipBeam 2850ms ease-out both;
}

.title-ship-laser.is-firing .title-ship-laser__impact {
  animation: titleShipImpact 2850ms ease-out both;
}

@keyframes titleShipLaserSweep {
  0%, 30% { transform: rotate(var(--laser-angle)); }
  43% { transform: rotate(calc(var(--laser-angle) + 1.15deg)); }
  57% { transform: rotate(calc(var(--laser-angle) - 1.15deg)); }
  71% { transform: rotate(calc(var(--laser-angle) + 0.8deg)); }
  84% { transform: rotate(calc(var(--laser-angle) - 0.55deg)); }
  100% { transform: rotate(var(--laser-angle)); }
}

@keyframes titleShipMuzzle {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(0.2); }
  12% { opacity: 1; transform: translate(-50%, -50%) scale(1.25); }
  42%, 97% { opacity: 0.92; transform: translate(-50%, -50%) scale(0.72); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(0.15); }
}

@keyframes titleShipBeam {
  0%, 7% { opacity: 0; transform: translateX(-50%) scaleY(0); }
  18% { opacity: 1; transform: translateX(-50%) scaleY(1); }
  97% { opacity: 0.96; transform: translateX(-50%) scaleY(1); }
  100% { opacity: 0; transform: translateX(-50%) scaleY(1); }
}

@keyframes titleShipImpact {
  0%, 15% { opacity: 0; transform: translate(-50%, 50%) scale(0.15); }
  20% { opacity: 1; transform: translate(-50%, 50%) scale(1.25); }
  97% { opacity: 0.72; transform: translate(-50%, 50%) scale(0.8); }
  100% { opacity: 0; transform: translate(-50%, 50%) scale(0.2); }
}

@keyframes titleLaserBoxHit {
  0% {
    filter:
      brightness(1)
      saturate(1)
      drop-shadow(0 0 8px rgba(20, 241, 149, 0.95))
      drop-shadow(0 0 16px rgba(20, 241, 149, 0.16))
      drop-shadow(0 20px 24px rgba(0, 0, 0, 0.45));
  }
  12% {
    filter:
      brightness(1.08)
      saturate(1.12)
      drop-shadow(0 0 11px rgba(114, 202, 80, 0.72))
      drop-shadow(0 0 22px rgba(255, 126, 28, 0.22))
      drop-shadow(0 18px 23px rgba(0, 0, 0, 0.4));
  }
  24% {
    filter:
      brightness(1.28)
      saturate(1.26)
      drop-shadow(0 0 12px rgba(255, 178, 52, 0.78))
      drop-shadow(0 0 30px rgba(255, 70, 18, 0.5))
      drop-shadow(0 14px 22px rgba(0, 0, 0, 0.34));
  }
  36%, 48% {
    filter:
      brightness(1.75)
      saturate(1.45)
      drop-shadow(0 0 10px #fff)
      drop-shadow(0 0 24px #ff2020)
      drop-shadow(0 0 48px rgba(255, 0, 0, 0.88));
  }
  62% {
    filter:
      brightness(1.22)
      saturate(1.2)
      drop-shadow(0 0 18px rgba(255, 32, 32, 0.78))
      drop-shadow(0 0 28px rgba(153, 69, 255, 0.42))
      drop-shadow(0 8px 20px rgba(0, 0, 0, 0.3));
  }
  78% {
    filter:
      brightness(1.08)
      saturate(1.08)
      drop-shadow(0 0 13px rgba(255, 112, 28, 0.56))
      drop-shadow(0 0 23px rgba(153, 69, 255, 0.38))
      drop-shadow(0 12px 22px rgba(0, 0, 0, 0.36));
  }
  91% {
    filter:
      brightness(1.02)
      saturate(1.02)
      drop-shadow(0 0 9px rgba(116, 126, 90, 0.48))
      drop-shadow(0 0 18px rgba(93, 77, 157, 0.3))
      drop-shadow(0 10px 22px rgba(0, 0, 0, 0.42));
  }
  100% {
    filter:
      brightness(1)
      saturate(1)
      drop-shadow(0 0 8px rgba(20, 241, 149, 0.95))
      drop-shadow(0 0 16px rgba(20, 241, 149, 0.16))
      drop-shadow(0 20px 24px rgba(0, 0, 0, 0.45));
  }
}

@keyframes titleLaserBoxAuraHit {
  0% { opacity: 0.9; filter: drop-shadow(0 0 8px rgba(20, 241, 149, 0.34)) drop-shadow(0 0 16px rgba(153, 69, 255, 0.24)); }
  12% { opacity: 0.93; filter: drop-shadow(0 0 10px rgba(118, 205, 82, 0.58)) drop-shadow(0 0 20px rgba(255, 136, 34, 0.18)); }
  24% { opacity: 0.97; filter: drop-shadow(0 0 13px rgba(255, 158, 42, 0.72)) drop-shadow(0 0 26px rgba(255, 62, 18, 0.46)); }
  36%, 48% { opacity: 1; filter: drop-shadow(0 0 18px #ff2020) drop-shadow(0 0 34px rgba(255, 0, 0, 0.76)); }
  58% { opacity: 0.98; filter: drop-shadow(0 0 13px rgba(255, 32, 32, 0.7)) drop-shadow(0 0 25px rgba(153, 69, 255, 0.4)); }
  76% { opacity: 0.96; filter: drop-shadow(0 0 11px rgba(255, 112, 28, 0.5)) drop-shadow(0 0 22px rgba(153, 69, 255, 0.36)); }
  90% { opacity: 0.93; filter: drop-shadow(0 0 9px rgba(94, 150, 102, 0.42)) drop-shadow(0 0 18px rgba(93, 77, 157, 0.3)); }
  100% { opacity: 0.9; filter: drop-shadow(0 0 8px rgba(20, 241, 149, 0.34)) drop-shadow(0 0 16px rgba(153, 69, 255, 0.24)); }
}

@keyframes titleLaserSolanaEdge {
  0%, 10%, 100% {
    -webkit-text-stroke: 0 rgba(255, 20, 18, 0);
    text-shadow:
      0 0 15px rgba(153, 69, 255, 0.6),
      0 0 30px rgba(20, 241, 149, 0.5),
      0 0 45px rgba(153, 69, 255, 0.4);
    filter: drop-shadow(0 0 0 rgba(255, 0, 0, 0));
  }
  24% {
    -webkit-text-stroke: 0.7px rgba(255, 92, 74, 0.88);
    text-shadow:
      0 0 3px #ffb0a8,
      0 0 10px #ff1b16,
      0 0 22px rgba(255, 0, 0, 0.82),
      0 0 38px rgba(150, 0, 0, 0.5);
    filter: drop-shadow(0 0 7px rgba(255, 20, 16, 0.72));
  }
  42%, 72% {
    -webkit-text-stroke: 1.15px rgba(255, 35, 28, 0.96);
    text-shadow:
      0 0 4px #ffd1c9,
      0 0 12px #ff1712,
      0 0 26px rgba(255, 0, 0, 0.92),
      0 0 46px rgba(160, 0, 0, 0.62);
    filter: drop-shadow(0 0 9px rgba(255, 18, 12, 0.84));
  }
  88% {
    -webkit-text-stroke: 0.5px rgba(255, 58, 38, 0.48);
    text-shadow:
      0 0 8px rgba(255, 50, 32, 0.45),
      0 0 20px rgba(153, 69, 255, 0.42),
      0 0 32px rgba(20, 241, 149, 0.3);
    filter: drop-shadow(0 0 4px rgba(255, 30, 20, 0.3));
  }
}

@keyframes titleLaserHeadingReflection {
  0%, 100% {
    text-shadow: 0 0 10px rgba(153, 69, 255, 0.22);
    filter: drop-shadow(0 0 0 rgba(255, 0, 0, 0));
  }
  24% {
    text-shadow:
      0 0 10px rgba(153, 69, 255, 0.2),
      0 4px 13px rgba(255, 24, 16, 0.72),
      0 9px 24px rgba(255, 0, 0, 0.48);
    filter: drop-shadow(0 7px 9px rgba(255, 0, 0, 0.52));
  }
  48% {
    text-shadow:
      0 0 5px #ffbbb5,
      0 3px 10px rgba(255, 38, 24, 0.98),
      0 8px 23px rgba(255, 0, 0, 0.9),
      0 15px 42px rgba(185, 0, 0, 0.68);
    filter:
      drop-shadow(0 7px 10px rgba(255, 15, 8, 0.82))
      drop-shadow(0 14px 22px rgba(135, 0, 0, 0.55));
  }
  74% {
    text-shadow:
      0 0 10px rgba(153, 69, 255, 0.2),
      0 4px 13px rgba(255, 56, 24, 0.52),
      0 9px 25px rgba(180, 0, 0, 0.28);
    filter: drop-shadow(0 6px 9px rgba(255, 30, 16, 0.34));
  }
}

@keyframes titleLaserCopyReflection {
  0%, 100% {
    text-shadow: 0 2px 0 rgba(0, 0, 0, 0.7), 0 0 13px rgba(255, 255, 255, 0.2);
    filter: drop-shadow(0 0 0 rgba(255, 0, 0, 0));
  }
  24% {
    text-shadow:
      0 2px 0 rgba(0, 0, 0, 0.68),
      0 0 13px rgba(255, 255, 255, 0.18),
      0 4px 13px rgba(255, 30, 18, 0.68),
      0 9px 23px rgba(255, 0, 0, 0.42);
    filter: drop-shadow(0 7px 9px rgba(255, 0, 0, 0.48));
  }
  48% {
    text-shadow:
      0 2px 0 rgba(0, 0, 0, 0.64),
      0 0 12px rgba(255, 255, 255, 0.16),
      0 0 5px rgba(255, 210, 205, 0.72),
      0 5px 16px rgba(255, 35, 22, 0.94),
      0 10px 29px rgba(255, 0, 0, 0.82),
      0 17px 44px rgba(145, 0, 0, 0.58);
    filter:
      drop-shadow(0 8px 11px rgba(255, 10, 5, 0.75))
      drop-shadow(0 15px 23px rgba(125, 0, 0, 0.48));
  }
  74% {
    text-shadow:
      0 2px 0 rgba(0, 0, 0, 0.68),
      0 0 13px rgba(255, 255, 255, 0.18),
      0 4px 14px rgba(255, 62, 28, 0.48),
      0 9px 24px rgba(180, 0, 0, 0.25);
    filter: drop-shadow(0 6px 9px rgba(255, 35, 18, 0.3));
  }
}

@keyframes titleLaserMoltenMark {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(0.3); filter: brightness(2); }
  12% { opacity: 1; transform: translate(-50%, -50%) scale(1.2); filter: brightness(1.8); }
  46% { opacity: 0.94; transform: translate(-50%, -50%) scale(0.92); filter: brightness(1.25); }
  78% { opacity: 0.52; transform: translate(-50%, -50%) scale(0.72); filter: brightness(0.72); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(0.45); filter: brightness(0.3); }
}

@keyframes titleLaserMoltenDrip {
  0%, 12% { opacity: 0; transform: translateX(-50%) scaleY(0.15); }
  34% { opacity: 1; transform: translateX(-50%) scaleY(1); }
  72% { opacity: 0.7; transform: translate(-50%, 5px) scaleY(1.18); }
  100% { opacity: 0; transform: translate(-50%, 10px) scaleY(0.85); }
}

@keyframes titleLaserMoltenScar {
  0%, 48% { opacity: 1; filter: brightness(1.8) saturate(1.3); }
  70% { opacity: 0.78; filter: brightness(0.68) saturate(0.82); }
  88% { opacity: 0.62; filter: brightness(0.38) saturate(0.35); }
  96% { opacity: 0.48; filter: brightness(0.22) saturate(0.12); }
  100% { opacity: 0; filter: brightness(0.15) saturate(0); }
}

@keyframes titleLaserGlowCool {
  0%, 32% { stroke: rgba(255, 42, 10, 0.78); }
  62% { stroke: rgba(145, 27, 13, 0.7); }
  82% { stroke: rgba(46, 14, 11, 0.82); }
  100% { stroke: rgba(5, 5, 5, 0.92); }
}

@keyframes titleLaserCoreCool {
  0%, 24% { stroke: #fff0a0; }
  50% { stroke: #ff671f; }
  72% { stroke: #721d12; }
  88% { stroke: #23100e; }
  100% { stroke: #050505; }
}

@keyframes titleLaserCharredTrail {
  0% {
    opacity: 0;
    stroke-dashoffset: 1;
  }
  14% {
    opacity: 0.025;
    stroke-dashoffset: 0.91;
  }
  48% {
    opacity: 0.12;
    stroke-dashoffset: 0.54;
  }
  78% {
    opacity: 0.27;
    stroke-dashoffset: 0.16;
  }
  100% {
    opacity: 0.42;
    stroke-dashoffset: 0;
  }
}

@keyframes titleLaserScarDraw {
  from { stroke-dashoffset: 1; }
  to { stroke-dashoffset: 0; }
}

@keyframes titleLaserHotDrip {
  0% { opacity: 0; stroke-dashoffset: 1; filter: brightness(2); }
  14% { opacity: 1; stroke-dashoffset: 0.55; filter: brightness(1.8); }
  34% { opacity: 0.96; stroke-dashoffset: 0; filter: brightness(1.35); }
  68% { opacity: 0.7; stroke-dashoffset: 0; stroke: #ff5417; filter: brightness(0.82); }
  88% { opacity: 0.34; stroke-dashoffset: 0; stroke: #8f1b10; filter: brightness(0.48); }
  100% { opacity: 0; stroke-dashoffset: 0; stroke: #42100d; filter: brightness(0.25); }
}

@keyframes titleLaserWeldingSpark {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) rotate(var(--spark-angle)) skewX(var(--spark-skew)) scaleX(0.25);
    filter: brightness(2);
  }
  10% {
    opacity: 1;
    transform: translate(-50%, -50%) rotate(var(--spark-angle)) skewX(var(--spark-skew)) scaleX(1);
    filter: brightness(1.8);
  }
  20% {
    opacity: 0.96;
    transform: translate(calc(-50% + var(--spark-arc-x1)), calc(-50% + var(--spark-arc-y1))) rotate(var(--spark-angle)) skewX(var(--spark-skew-reverse)) scaleX(0.96);
    filter: brightness(1.45);
  }
  42% {
    opacity: 0.88;
    transform: translate(calc(-50% + var(--spark-x)), calc(-50% + var(--spark-y))) rotate(var(--spark-angle)) skewX(var(--spark-skew-reverse)) scaleX(0.92);
    filter: brightness(1.15);
  }
  72% {
    opacity: 0.62;
    transform: translate(calc(-50% + var(--spark-arc-x3)), calc(-50% + var(--spark-arc-y3))) rotate(calc(var(--spark-angle) + 38deg)) skewX(var(--spark-skew)) scaleX(0.58);
    filter: brightness(0.82);
  }
  100% {
    opacity: 0;
    transform: translate(calc(-50% + var(--spark-end-x)), calc(-50% + var(--spark-fall))) rotate(calc(var(--spark-angle) + 70deg)) skewX(var(--spark-skew)) scaleX(0.18);
    filter: brightness(0.45);
  }
}

.title-laser-welding-spark.is-aura-bounce {
  animation-name: titleLaserWeldingSparkAuraBounce;
}

@keyframes titleLaserWeldingSparkAuraBounce {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) rotate(var(--spark-angle)) scaleX(0.25);
    filter: brightness(2);
  }
  10% {
    opacity: 1;
    transform: translate(-50%, -50%) rotate(var(--spark-angle)) scaleX(1);
    filter: brightness(1.8);
  }
  39% {
    opacity: 0.96;
    transform: translate(calc(-50% + var(--spark-bounce-x)), calc(-50% + var(--spark-bounce-y))) rotate(var(--spark-angle)) scaleX(0.95);
    filter: brightness(1.45);
  }
  43% {
    opacity: 1;
    transform: translate(calc(-50% + var(--spark-bounce-x)), calc(-50% + var(--spark-bounce-y))) rotate(var(--spark-bounce-angle)) scaleX(1.62) scaleY(1.28);
    filter: brightness(3.2);
  }
  54% {
    opacity: 0.96;
    transform: translate(calc(-50% + var(--spark-bounce-out-x)), calc(-50% + var(--spark-bounce-out-y))) rotate(var(--spark-bounce-angle)) scaleX(0.88);
    filter: brightness(1.6);
  }
  100% {
    opacity: 0;
    transform: translate(calc(-50% + var(--spark-bounce-end-x)), calc(-50% + var(--spark-bounce-end-y))) rotate(calc(var(--spark-bounce-angle) + 46deg)) scaleX(0.14);
    filter: brightness(0.45);
  }
}

@media (max-width: 480px) {
  .firstblock .box-visual {
    filter:
      drop-shadow(0 0 8px rgba(20, 241, 149, 0.95))
      drop-shadow(0 0 18px rgba(20, 241, 149, 0.36))
      drop-shadow(0 14px 22px rgba(0, 0, 0, 0.42));
  }

  .firstblock .box-visual::before,
  .firstblock .box-visual::after {
    display: block;
  }

  .firstblock .box-visual.is-laser-hit {
    animation: titleLaserBoxHit 5200ms ease-in-out both;
  }

  .title-ship-laser__beam {
    width: 2px;
  }

  .title-laser-welding-spark {
    height: var(--spark-thickness, 2px);
    background: linear-gradient(90deg, #ffffff 0 20%, #fff3a0 42%, #ffae24 76%, rgba(255, 95, 12, 0.12) 100%);
    box-shadow:
      0 0 3px #ffffff,
      0 0 6px #fff3a0,
      0 0 10px rgba(255, 126, 18, 0.92);
    filter: none !important;
    mix-blend-mode: normal;
    backface-visibility: hidden;
    will-change: transform, opacity;
    animation-name: titleLaserWeldingSparkMobile;
  }

  .title-laser-welding-spark.is-aura-bounce {
    animation-name: titleLaserWeldingSparkAuraBounce;
  }

}

@keyframes titleLaserWeldingSparkMobile {
  0% {
    opacity: 0;
    transform: translate3d(-50%, -50%, 0) rotate(var(--spark-angle)) skewX(var(--spark-skew)) scaleX(0.25);
  }
  10% {
    opacity: 1;
    transform: translate3d(-50%, -50%, 0) rotate(var(--spark-angle)) skewX(var(--spark-skew)) scaleX(1);
  }
  20% {
    opacity: 0.98;
    transform: translate3d(calc(-50% + var(--spark-arc-x1)), calc(-50% + var(--spark-arc-y1)), 0) rotate(var(--spark-angle)) skewX(var(--spark-skew-reverse)) scaleX(0.96);
  }
  42% {
    opacity: 0.92;
    transform: translate3d(calc(-50% + var(--spark-x)), calc(-50% + var(--spark-y)), 0) rotate(var(--spark-angle)) skewX(var(--spark-skew-reverse)) scaleX(0.88);
  }
  72% {
    opacity: 0.58;
    transform: translate3d(calc(-50% + var(--spark-arc-x3)), calc(-50% + var(--spark-arc-y3)), 0) rotate(calc(var(--spark-angle) + 38deg)) skewX(var(--spark-skew)) scaleX(0.54);
  }
  100% {
    opacity: 0;
    transform: translate3d(calc(-50% + var(--spark-end-x)), calc(-50% + var(--spark-fall)), 0) rotate(calc(var(--spark-angle) + 70deg)) skewX(var(--spark-skew)) scaleX(0.12);
  }
}

@media (prefers-reduced-motion: reduce) {
  .title-ship-laser {
    display: none;
  }
}