/* ==========================================================
   Loading screen + page transitions ("veil")
   html.av-first  → first page of the visit: logo draws, wordmark rises, bar fills, curtain lifts
   html.av-arrive → arriving from another page: veil starts covering, then lifts
   .is-cover      → leaving: veil slides up from the bottom to cover the page
   ========================================================== */
.av-veil {
  position: fixed; inset: 0; z-index: 2147483100;
  display: none; place-items: center;
  background: var(--accent);
  color: #fff;
  will-change: transform;
}
html.av-first .av-veil, html.av-arrive .av-veil, .av-veil.is-cover { display: grid; }
html.av-first, html.av-arrive { overflow: hidden; }

.av-veil__inner { display: flex; flex-direction: column; align-items: center; gap: 20px; transition: transform .7s var(--ease-out), opacity .5s var(--ease); }
.av-veil__mark { width: 60px; height: 60px; }
.av-veil__mark path { fill: none; stroke: currentColor; stroke-width: 1.1; stroke-linejoin: round; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.av-veil__word { display: flex; flex-direction: column; align-items: center; font-size: 30px; font-weight: 500; letter-spacing: -.04em; line-height: 1; }
.av-veil__word small { margin-top: 7px; font-size: 12px; font-weight: 400; letter-spacing: .02em; opacity: .7; }
.av-veil__bar { position: absolute; left: 50%; bottom: clamp(40px, 8vh, 72px); width: 160px; height: 1px; margin-left: -80px; background: rgba(255,255,255,.22); overflow: hidden; }
.av-veil__bar i { display: block; height: 100%; background: #fff; transform: scaleX(var(--p, 0)); transform-origin: left; transition: transform .5s var(--ease); }

/* first visit: draw the mark, raise the wordmark */
html.av-first .av-veil__mark path { stroke-dashoffset: 1; animation: av-draw 1.4s var(--ease-out) .15s forwards; }
html.av-first .av-veil__word { opacity: 0; transform: translateY(10px); animation: av-rise .9s var(--ease-out) .55s forwards; }
@keyframes av-draw { to { stroke-dashoffset: 0; } }
@keyframes av-rise { to { opacity: 1; transform: none; } }

/* page-to-page: mark only */
html.av-arrive .av-veil__word, html.av-arrive .av-veil__bar,
.av-veil.is-cover .av-veil__word, .av-veil.is-cover .av-veil__bar { display: none; }
.av-veil.is-cover .av-veil__mark, html.av-arrive .av-veil__mark { width: 44px; height: 44px; }

/* lift away (curtain) */
.av-veil.is-leaving { transform: translateY(-100%); border-radius: 0 0 48px 48px; transition: transform .9s cubic-bezier(.76, 0, .24, 1), border-radius .9s cubic-bezier(.76, 0, .24, 1); }
.av-veil.is-leaving .av-veil__inner { transform: translateY(-48px); opacity: 0; }

/* cover (leaving a page) */
.av-veil.is-cover { transform: translateY(100%); border-radius: 48px 48px 0 0; }
.av-veil.is-cover.is-in { transform: none; border-radius: 0; transition: transform .6s cubic-bezier(.76, 0, .24, 1), border-radius .6s cubic-bezier(.76, 0, .24, 1); }
.av-veil.is-cover .av-veil__inner { opacity: 0; transform: translateY(24px); }
.av-veil.is-cover.is-in .av-veil__inner { opacity: 1; transform: none; transition-delay: .2s; }

@media print { .av-veil { display: none !important; } }