/* Blood on steel. Opted-in navigation controls; forms retain native behaviour. */
.rq-ashes .rq-blood-link {
  position: relative;
  isolation: isolate;
  -webkit-tap-highlight-color: transparent;
}
.rq-ashes .rq-blood-link::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -5px -8px -8px;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  pointer-events: none;
  background: url("../images/blood-smear.svg") center / 100% 100% no-repeat;
  opacity: 0;
  transform: translateX(-5px) scale(.72, .85) rotate(-1deg);
  transform-origin: 28% 52%;
  clip-path: inset(0 100% 0 0);
  transition: opacity .16s ease, transform .3s cubic-bezier(.18, .75, .2, 1), clip-path .28s cubic-bezier(.16, .8, .2, 1);
}
.rq-ashes .rq-blood-link:is(:hover, :focus-visible) {
  color: #fff2e8;
  text-shadow: 0 1px 3px #000, 0 0 9px #080304b3;
}
.rq-ashes .rq-blood-link:is(:hover, :focus-visible)::before {
  opacity: .96;
  transform: translateX(0) scale(1, 1) rotate(-1deg);
  clip-path: inset(0 -3% -8% -3%);
}
.rq-ashes .rq-blood-link:focus-visible {
  outline: 2px solid #d9a49a;
  outline-offset: 4px;
}
.rq-ashes .rq-blood-link:active::before,
.rq-ashes .rq-blood-link.rq-blood-hit::before {
  opacity: 1;
  transform: translateX(1px) scale(1.035, 1.12) rotate(-.5deg);
  clip-path: inset(0 -3% -8% -3%);
  transition-duration: .055s;
}
.rq-ashes .rq-primary.rq-blood-link::before { inset: -10px -2px -13px; }
.rq-ashes .rq-primary.rq-blood-link:is(:hover, :focus-visible) {
  background-color: #8f1d23;
  border-color: #d16a60;
  box-shadow: inset 0 1px #e1926f1f, 0 6px 20px #24030755;
}
.rq-ashes .dropdown-item.rq-blood-link::before { inset: -4px 2px -8px; }
.rq-ashes .rq-race-tab.rq-blood-link::before { inset: 0 1px -6px; }
.rq-ashes .rq-blood-impact {
  position: absolute;
  z-index: -1;
  left: var(--rq-hit-x, 50%);
  top: var(--rq-hit-y, 50%);
  width: 104px;
  height: 76px;
  pointer-events: none;
  background: url("../images/blood-smear.svg") center / 100% 100% no-repeat;
  opacity: 0;
  transform: translate(-50%, -50%) scale(.3) rotate(-17deg);
}
.rq-ashes .rq-blood-impact::before {
  content: "";
  position: absolute;
  inset: -12px;
  pointer-events: none;
  background:
    radial-gradient(ellipse 2px 1px at 8% 34%, #8a1922 80%, transparent),
    radial-gradient(ellipse 1px 3px at 22% 80%, #640b15 80%, transparent),
    radial-gradient(ellipse 3px 1px at 87% 22%, #961c23 80%, transparent),
    radial-gradient(ellipse 1px 2px at 78% 84%, #5c0b13 80%, transparent),
    radial-gradient(ellipse 2px 1px at 94% 62%, #78131d 80%, transparent);
}
.rq-ashes .rq-blood-hit .rq-blood-impact { animation: rq-blood-strike .6s cubic-bezier(.16, .7, .25, 1) both; }
@keyframes rq-blood-strike {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(.28) rotate(-17deg); }
  14% { opacity: .95; transform: translate(-50%, -50%) scale(.95) rotate(-9deg); }
  48% { opacity: .64; }
  100% { opacity: 0; transform: translate(-48%, -43%) scale(1.16) rotate(-6deg); }
}

/* Original art: finite eclipse; JavaScript schedules the quiet intervals. */
.rq-ashes .rq-hero { isolation: isolate; --rq-art-opacity: .95; }
.rq-ashes .rq-hero-filter-defs { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }
.rq-ashes .rq-hero-scene {
  position: absolute;
  z-index: 0;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
.rq-ashes .rq-hero::after { z-index: 0; }
.rq-ashes .rq-hero-base { opacity: var(--rq-art-opacity); }
.rq-ashes .rq-hero-contours {
  opacity: 0;
  mix-blend-mode: screen;
  filter: url("#rq-silhouette-contours");
}
.rq-ashes .rq-hero.rq-eclipse-active .rq-hero-base {
  animation: rq-silhouette-darken 10s linear 1 both;
  animation-play-state: paused;
}
.rq-ashes .rq-hero.rq-eclipse-active .rq-hero-contours {
  animation: rq-silhouette-reveal 10s linear 1 both;
  animation-play-state: paused;
}
.rq-ashes .rq-hero.rq-eclipse-active.rq-motion-running :is(.rq-hero-base, .rq-hero-contours) { animation-play-state: running; }
@keyframes rq-silhouette-darken {
  0% { opacity: var(--rq-art-opacity); animation-timing-function: cubic-bezier(.4, 0, .6, 1); }
  72%, 83.2% { opacity: .065; animation-timing-function: cubic-bezier(.18, .6, .25, 1); }
  100% { opacity: var(--rq-art-opacity); }
}
@keyframes rq-silhouette-reveal {
  0% { opacity: 0; animation-timing-function: cubic-bezier(.4, 0, .6, 1); }
  72%, 83.2% { opacity: .96; animation-timing-function: cubic-bezier(.18, .6, .25, 1); }
  100% { opacity: 0; }
}
@media (max-width: 1100px) { .rq-ashes .rq-hero { --rq-art-opacity: .85; } }
@media (max-width: 620px) {
  .rq-ashes .rq-hero { --rq-art-opacity: 1; }
  .rq-ashes .rq-blood-link::before { inset-inline: -4px; }
  .rq-ashes .rq-blood-impact { width: 88px; height: 64px; }
}
@media (prefers-reduced-motion: reduce) {
  .rq-ashes .rq-blood-link,
  .rq-ashes .rq-blood-link::before,
  .rq-ashes :is(.rq-hero-scene, .rq-hero-base, .rq-hero-contours) {
    animation: none !important;
    transition: none !important;
  }
  .rq-ashes .rq-blood-link::before { display: block; transform: none; }
  .rq-ashes .rq-blood-link:is(:hover, :focus-visible, .rq-blood-hit)::before { transform: none; opacity: .96; }
  .rq-ashes .rq-blood-link:active { transform: none; }
  .rq-ashes .rq-blood-impact { display: none; }
  .rq-ashes .rq-hero-scene { transform: none !important; }
  .rq-ashes .rq-hero-base { opacity: var(--rq-art-opacity); }
  .rq-ashes .rq-hero-contours { display: none; }
}
