/* ---------- base ---------- */
html { -webkit-font-smoothing: antialiased; }
[x-cloak] { display: none !important; }
a { transition: color .15s ease; }

/* visible keyboard focus everywhere */
a:focus-visible,
button:focus-visible,
[tabindex]:focus-visible,
input:focus-visible {
  outline: 2px solid #c9a45c;
  outline-offset: 2px;
  border-radius: 2px;
}

/* respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

/* ---------- scrollbars ---------- */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #0b0a09; }
::-webkit-scrollbar-thumb { background: #2a251c; border-radius: 5px; }

.thin-scroll::-webkit-scrollbar { width: 6px; }
.thin-scroll::-webkit-scrollbar-thumb { background: #2a251c; border-radius: 5px; }

/* ---------- gradient text (silver crest / raised numbers) ---------- */
.text-silver-grad {
  background: linear-gradient(180deg, #eef0f3, #a8adb5 48%, #d5d8dd 52%, #8f949c);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.text-gold-grad {
  background: linear-gradient(180deg, #eef0f3, #c9a45c 60%, #8f6a33);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* silver "badge" background used on pills / date chips */
.bg-silver-grad {
  background: linear-gradient(180deg, #eef0f3, #a8adb5 48%, #d5d8dd 52%, #8f949c);
}
.bg-gold-grad {
  background: linear-gradient(180deg, #e8cd8d, #c9a45c);
}

/* ---------- film grain overlay ---------- */
.grain-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .4;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}

/* ---------- diagonal hazard/placeholder texture (stand-in for real photography) ---------- */
.texture-diagonal {
  background-image: repeating-linear-gradient(45deg, #15120e, #15120e 8px, #1b1710 8px, #1b1710 16px);
}
.texture-diagonal-dark {
  background-image: repeating-linear-gradient(45deg, #141210, #141210 8px, #1a1712 8px, #1a1712 16px);
}

/* ridge silhouette shapes used behind hero copy */
.ridge-far {
  clip-path: polygon(0 55%, 14% 40%, 30% 62%, 47% 34%, 63% 55%, 78% 26%, 92% 48%, 100% 36%, 100% 100%, 0 100%);
}
.ridge-near {
  clip-path: polygon(0 62%, 12% 50%, 26% 68%, 41% 42%, 55% 60%, 68% 32%, 82% 54%, 100% 40%, 100% 100%, 0 100%);
}
.ridge-simple {
  clip-path: polygon(0 60%, 15% 46%, 32% 66%, 48% 38%, 64% 58%, 79% 30%, 100% 50%, 100% 100%, 0 100%);
}

/* the lone walking figure silhouette, built from stacked divs (kept from the original design) */
.figure { position: absolute; }
.figure .head { position: absolute; border-radius: 9999px; background: #050504; }
.figure .body { position: absolute; background: #050504; }
