/* Landing-only motion; all content is visible without JavaScript. */
.landing-body { background-image: none; isolation: isolate; }
.landing-backdrop {
  position: fixed;
  inset: -18px 0;
  z-index: -2;
  pointer-events: none;
  background:
    radial-gradient(circle at 78% 22%, rgba(200, 148, 10, .18), transparent 34%),
    linear-gradient(90deg, rgba(2, 11, 26, .94), rgba(2, 11, 26, .68), rgba(2, 11, 26, .92)),
    url('/images/inn.jpg') center / cover;
  transform: translateY(var(--watermark-offset, 0px));
}
.landing-body::before { inset: -18px 0; }
.boot-word { display: inline-block; max-width: 100%; overflow-wrap: anywhere; }
.landing-body :is(a, button) {
  transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease;
}
.landing-body :is(a, button, [role="button"]):focus-visible {
  outline: 2px solid var(--gold-light);
  outline-offset: 4px;
}
.hero-actions .btn-primary { position: relative; }
.hero-actions .btn-primary::after,
.about-photo-card::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  box-shadow: inset 0 0 18px rgba(240, 180, 41, .22);
  border: 1px solid var(--gold-light);
  opacity: 0;
  transition: opacity 200ms ease;
}
.hero-actions .btn-primary::after { box-shadow: 0 0 24px rgba(240, 180, 41, .4); }
.hero-actions .btn-primary:is(:hover, :focus-visible)::after,
.about-photo-card:is(:hover, :focus-visible)::after { opacity: 1; }
#announcementGrid[aria-busy="true"] .card-date::after {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-left: 10px;
  border-radius: 50%;
  background: var(--gold-light);
  box-shadow: 10px 0 0 rgba(240, 180, 41, .5), 20px 0 0 rgba(240, 180, 41, .25);
}
@keyframes landing-boot {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes landing-grid { from { transform: translateY(-12px); } to { transform: translateY(0); } }
@keyframes landing-pulse { 50% { opacity: .35; } }
@keyframes landing-page-in { from { opacity: .6; } to { opacity: 1; } }
@media (prefers-reduced-motion: no-preference) {
  .landing-body main { animation: landing-page-in 180ms ease-out; }
  .boot-word { animation: landing-boot 480ms both; }
  .boot-word:nth-child(2) { animation-delay: 120ms; }
  .boot-word:nth-child(3) { animation-delay: 240ms; }
  .landing-body::before { animation: landing-grid 4s ease-out both; }
  .motion-pending { opacity: 0; transform: translateY(18px); }
  .motion-revealed { animation: landing-boot 500ms var(--reveal-delay, 0ms) both; }
  .motion-pending:focus-within { opacity: 1; transform: none; }
  .about-photo-card.motion-tilt {
    transform: perspective(900px) rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg));
    transition: transform 180ms ease, border-color 180ms ease, background 180ms ease;
  }
  #announcementGrid[aria-busy="true"] .card-date::after { animation: landing-pulse 1s ease-in-out 5; }
  .announcement-modal:not([hidden]) .modal-card { animation: landing-boot 200ms ease-out; }
  @view-transition { navigation: auto; }
  ::view-transition-old(root), ::view-transition-new(root) { animation-duration: 180ms; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .landing-body *, .landing-body::before, .landing-body *::after {
    animation: none !important;
    transition: none !important;
  }
  .landing-backdrop, .landing-body .about-photo-card, .landing-body .announcement-clickable,
  .motion-pending { transform: none !important; opacity: 1; }
  ::view-transition-old(root), ::view-transition-new(root) { animation: none !important; }
}