@font-face{font-family:Caveat;src:url('../base/fonts/Caveat-Variable.ttf') format('truetype');font-weight:400 700;font-display:swap}
.arrival{position:fixed;inset:0;z-index:9000;background:var(--paper);color:var(--ink);display:flex;flex-direction:column;justify-content:center;padding:clamp(24px,8vw,120px);transition:opacity .55s ease,visibility .55s;overflow:auto}
.arrival.leaving{opacity:0;visibility:hidden;pointer-events:none}
.arrival-label{font:10px var(--font-mono);letter-spacing:.16em;text-transform:uppercase;position:absolute;top:7vh;left:8vw;color:var(--soft)}
.arrival-quote{font:400 clamp(30px,4.2vw,66px)/1.24 Caveat,cursive;max-width:1000px;margin:80px auto;letter-spacing:-.015em}
.arrival-quote span{display:inline-block;clip-path:inset(0 100% 0 0);padding-right:.045em;margin-right:-.045em}
.writing .arrival-quote span{animation:ink-reveal var(--duration) linear var(--delay) both}
@keyframes ink-reveal{to{clip-path:inset(0 -3% 0 0)}}
.arrival-bottom{display:flex;justify-content:space-between;align-items:end;width:100%;font:11px/1.8 var(--font-mono);color:var(--soft)}
.arrival-bottom button{font:inherit;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--rule);padding:10px 0;cursor:pointer}
.arrival-bottom button:focus-visible{outline:2px solid var(--ink);outline-offset:6px}
/* Keep the underlying logo geometry and its directional arrow tracks. */
.hero #mark .m-g-hnd,.hero #mark .m-g-pt{opacity:.28}
.hero #mark .m-g-line{opacity:.8}
@media(prefers-reduced-motion:reduce){.arrival{transition:none}.arrival-quote span{clip-path:none!important;animation:none!important}}
