/* Mayden mark — copy exactly. Do not redraw. */
:root {
  --mayden-ink: #0B1B2B;
  --mayden-paper: #FBFAF7;
  --mayden-bronze: #B07D3C;
  --mayden-bronze2: #D8B07A;
}

.mayden-mark {
  font-family: "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;
  font-weight: 500;
  font-size: 28px;
  letter-spacing: -1.5px;
  line-height: 1;
  color: #fff;
  display: inline-block;
}
.mayden-mark-dot { color: var(--mayden-bronze2, #D8B07A); }
.mayden-mark--ink { color: var(--mayden-ink, #0B1B2B); }

.mayden-mark--splash {
  font-size: clamp(140px, 32vw, 320px);
  letter-spacing: -0.04em;
  filter: drop-shadow(0 0 36px rgba(216, 176, 122, 0.38)) drop-shadow(0 0 90px rgba(176, 125, 60, 0.2));
}

.mayden-splash {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: grid;
  place-items: center;
  background: var(--mayden-ink, #0B1B2B);
  opacity: 1;
  pointer-events: none;
  transition: opacity 0.85s ease;
}
.mayden-splash[hidden] { display: none !important; }
.mayden-splash .mayden-mark--splash {
  opacity: 0;
  transition: opacity 0.9s ease;
}
.mayden-splash.is-veil .mayden-mark--splash { opacity: 0; }
.mayden-splash.is-on .mayden-mark--splash { opacity: 1; }
.mayden-splash.is-out { opacity: 0; }

.mayden-loader { display: inline-flex; align-items: center; justify-content: center; }
.mayden-loader .mayden-mark { font-size: 28px; }
.mayden-loader.is-pulse .mayden-mark {
  animation: mayden-mark-pulse 1.6s ease-in-out infinite;
}
@keyframes mayden-mark-pulse {
  0%, 100% { opacity: 0.55; }
  50% { opacity: 1; }
}

.mayden-mark--loader {
  font-size: clamp(88px, 14vw, 160px);
  letter-spacing: -0.04em;
  filter: drop-shadow(0 0 28px rgba(216, 176, 122, 0.4));
}
.mayden-page-loader {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: grid;
  place-items: center;
  background: rgba(11, 27, 43, 0.28);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.4s ease;
}
.mayden-page-loader.is-on {
  opacity: 1;
  pointer-events: auto;
}
.mayden-page-loader[hidden] { display: none !important; }
.mayden-page-loader .mayden-mark--loader { opacity: 0.35; }
.mayden-page-loader.is-on .mayden-mark--loader {
  animation: mayden-mark-breathe 1.6s ease-in-out infinite;
}
@keyframes mayden-mark-breathe {
  0%, 100% { opacity: 0.22; }
  50% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .mayden-splash,
  .mayden-splash .mayden-mark--splash,
  .mayden-loader .mayden-mark,
  .mayden-page-loader,
  .mayden-page-loader .mayden-mark--loader {
    transition: none !important;
    animation: none !important;
  }
  .mayden-page-loader.is-on .mayden-mark--loader { opacity: 1; }
}
