/* Silver glass and suspended navy lettering, over the continuous gray. */
:root {
  --name-depth: 0 -1px 0 rgba(232, 240, 252, .5), 0 5px 9px rgba(18, 45, 80, .2), 0 14px 26px rgba(18, 45, 80, .14);
  --title-depth: 0 -1px 0 rgba(232, 240, 252, .45), 0 5px 12px rgba(18, 45, 80, .14);
  --value-depth: 0 3px 8px rgba(18, 45, 80, .16);
  --glass-reflection: linear-gradient(180deg, rgba(247, 250, 255, .5), rgba(238, 244, 252, .12) 49%, rgba(170, 188, 211, .12) 51%, rgba(225, 235, 248, .24));
}

.hero h1, .closing .closing-name { text-shadow: var(--name-depth); }
h2 { text-shadow: var(--title-depth); }
.countdown [data-countdown], .schedule-time, .event-date,
.price-list dd, .total-row output, .payment-alias { text-shadow: var(--value-depth); }

.hero-content { animation: aero-suspension 8s ease-in-out .8s infinite; }
.closing .closing-name { animation: aero-suspension 7s ease-in-out infinite; }
@keyframes aero-suspension {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

/* The focus resolves only on headings; practical text stays crisp. */
.reveal-ready .reveal h2 { filter: blur(0); transition: filter .7s var(--ease); }
.reveal-ready .reveal:not(.is-visible) h2 { filter: blur(4px); }

@supports ((backdrop-filter: blur(14px)) or (-webkit-backdrop-filter: blur(14px))) {
  .site-header {
    background: rgba(201, 201, 200, .86);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    box-shadow: inset 0 1px 0 rgba(243, 248, 255, .5);
  }
}

.button, .nav-confirm, .choices span, .dietary-options label {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background-image: var(--glass-reflection);
  box-shadow: inset 0 1px 0 rgba(246, 250, 255, .6);
}
.button::after, .nav-confirm::before,
.choices span::after, .dietary-options label::after {
  content: '';
  position: absolute;
  top: -50%;
  bottom: -50%;
  left: -55%;
  width: 45%;
  background: linear-gradient(90deg, transparent, rgba(246, 250, 255, .5), transparent);
  transform: translateX(0) skewX(-20deg);
  pointer-events: none;
}
.button:hover::after, .button:focus-visible::after, .button:active::after,
.nav-confirm:hover::before, .nav-confirm:focus-visible::before,
.choices label:has(input:focus-visible) span::after,
.choices label:active span::after,
.dietary-options label:has(input:focus-visible)::after,
.dietary-options label:active::after {
  transform: translateX(380%) skewX(-20deg);
  transition: transform .65s var(--ease);
}
.choices input:checked + span, .dietary-options label:has(input:checked) {
  background-image: var(--glass-reflection);
}
.motion-paused .hero-content, .motion-paused .closing-name,
.tab-hidden .hero-content, .tab-hidden .closing-name { animation-play-state: paused; }

@media (max-width:700px) {
  :root {
    --name-depth: 0 -1px 0 rgba(232, 240, 252, .5), 0 4px 7px rgba(18, 45, 80, .2), 0 9px 18px rgba(18, 45, 80, .13);
    --title-depth: 0 -1px 0 rgba(232, 240, 252, .4), 0 3px 8px rgba(18, 45, 80, .14);
  }
}
@media (prefers-reduced-motion:reduce) {
  .hero-content, .closing .closing-name { animation: none; }
  .reveal-ready .reveal h2 { filter: none; transition: none; }
  .button::after, .nav-confirm::before, .choices span::after,
  .dietary-options label::after { display: none; }
}