/* A small arrival notice at the foot of the workshop, with a full-width track. */
.vera-arrival { position: relative; overflow: hidden; background: #f8f7f3; border-bottom: 1px solid #cac7c6; }
.vera-arrival-inner { display: grid; grid-template-columns: minmax(320px,.9fr) minmax(0,1.1fr); gap: 34px; align-items: center; min-height: 180px; }
.vera-arrival-copy { position: relative; z-index: 2; padding: var(--space-6) 0 var(--space-20); }
.vera-arrival-kicker { display: flex; align-items: center; gap: 8px; margin: 0 0 var(--space-3); font: var(--text-meta)/1.5 var(--mono); letter-spacing: .08em; }
.vera-arrival-kicker > span { width: 7px; height: 7px; background: #c8ef45; border: 1px solid var(--ink); }
.vera-arrival h2 { margin: 0; font: 500 var(--text-subheading)/var(--leading-heading) var(--display); letter-spacing: var(--tracking-heading); }
.vera-arrival-description { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-2); margin: var(--space-3) 0 0; font-size: var(--text-small); line-height: var(--leading-body); color: #50504b; }
.vera-arrival-description a { color: var(--ink); white-space: nowrap; }
.vera-arrival-stage { position: relative; align-self: stretch; min-width: 0; }
.vera-arrival-art { position: absolute; z-index: 1; bottom: 27px; right: 0; width: min(100%,640px); }
.vera-arrival-art svg { display: block; width: 100%; height: auto; overflow: visible; stroke: #1d1d1b; stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; }
.vera-arrival-art text { stroke: none; font-family: var(--mono); }
.vera-arrival-art .vera-word { font-family: var(--sans); font-weight: 600; letter-spacing: -.6px; }
.vera-arrival-motion { position: absolute; z-index: 3; bottom: 3px; right: 0; padding: 2px 0 2px 8px; border: 0; background: transparent; color: #66665e; cursor: pointer; font: var(--text-fine)/1.5 var(--mono); }
.vera-arrival-motion:hover { color: var(--ink); }
.vera-arrival-steam-toggle { position: absolute; z-index: 3; bottom: 3px; right: 132px; padding: 2px 0; border: 0; background: transparent; color: #66665e; cursor: pointer; font: var(--text-fine)/1.5 var(--mono); }
.vera-arrival-steam-toggle:hover { color: var(--ink); }
.vera-arrival-puff { opacity: 0; animation: vera-steam 3.6s linear infinite; animation-play-state: paused; }
.vera-arrival.is-steaming .vera-arrival-puff { animation-play-state: running; }
@keyframes vera-steam {
  0% { opacity: 0; transform: translate(0,0) scale(.5); }
  15% { opacity: .65; }
  65% { opacity: .35; }
  100% { opacity: 0; transform: translate(18px,-46px) scale(1.8); }
}
.vera-arrival :focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; }
@media (max-width: 980px) {
  .vera-arrival-inner { grid-template-columns: minmax(260px,.8fr) minmax(0,1.2fr); gap: 22px; min-height: 160px; }
  .vera-arrival-description { max-width: 250px; }
}
@media (max-width: 760px) {
  .vera-arrival-inner { grid-template-columns: 1fr; gap: var(--space-6); padding-top: var(--space-6); }
  .vera-arrival-copy { padding: 0; }
  .vera-arrival-description { max-width: none; }
  .vera-arrival-stage { height: clamp(110px,24vw,174px); }
  .vera-arrival-art { width: min(100%,570px); }
}