/* River Reign — shared styles */

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Inter', sans-serif;
  background-color: #F6F1E6;
  color: #101815;
}

.font-display {
  font-family: 'Fraunces', serif;
}

/* Custom scrollbar, tuned to the palette */
::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-track {
  background: #F6F1E6;
}
::-webkit-scrollbar-thumb {
  background: #C08A3E;
  border-radius: 999px;
}

/* Visible keyboard focus everywhere */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 2px solid #C08A3E;
  outline-offset: 3px;
  border-radius: 2px;
}

/* Signature element: the current line — a slow-drifting gold river
   trace that runs behind hero content and reappears as a section
   divider throughout the site. */
.current-line {
  overflow: visible;
}
.current-line path {
  fill: none;
  stroke: url(#currentGradient);
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-dasharray: 12 12;
  animation: drift 34s linear infinite;
}
@keyframes drift {
  to { stroke-dashoffset: -1000; }
}

/* Cinematic hero image reveal */
.hero-reveal {
  animation: heroReveal 1.6s cubic-bezier(.16,.84,.44,1) both;
}
@keyframes heroReveal {
  from { opacity: 0; transform: scale(1.06); }
  to { opacity: 1; transform: scale(1); }
}
.rise {
  animation: rise 0.9s cubic-bezier(.16,.84,.44,1) both;
}
@keyframes rise {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Utility: letterspaced eyebrow labels used as mile-marker tags */
.mile-marker {
  font-family: 'Fraunces', serif;
  font-variant-numeric: oldstyle-nums;
}

/* Respect reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .current-line path { animation: none; }
  .hero-reveal, .rise { animation: none !important; opacity: 1 !important; transform: none !important; }
}

/* Lightbox backdrop blur helper (keeps Tailwind file lean) */
.backdrop-blur-reign {
  backdrop-filter: blur(6px);
}

/* Header shadow once scrolled, applied via Alpine :class */
.header-scrolled {
  box-shadow: 0 8px 30px -12px rgba(7, 26, 23, 0.55);
}
