/* Incremental fixes on the original layout, entrance and real QR code. */
.elders-wrap { margin-inline: 0; }
.intro-pending, .qr-open { overflow: hidden; }
.intro__enter small { display: block; margin-top: 14px; font: 11px var(--han); letter-spacing: .08em; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

#join .qr-live { display: block; width: min(280px,100%); height: auto; aspect-ratio: 1; padding: 12px; background: #fff; text-decoration: none; }
.qr-live::before { display: none; }
.qr-art { position: relative; display: block; width: 100%; aspect-ratio: 1; overflow: hidden; background: #fff; }
.qr-art img { position: absolute; width: 141.4815%; max-width: none; height: auto; left: -20.7407%; top: -72.0988%; }
.qr-help { color: #696154; font-size: 12px; line-height: 1.9; text-align: center; }
.qr-save { display: inline-block; padding: 10px 2px; border-bottom: 1px solid currentColor; color: var(--accent); font-size: 13px; text-decoration: none; }
.qr-expiry { color: #75634b; font-size: 11px; line-height: 1.8; text-align: center; }
.qr-expiry.expired { color: #a83f2c; }
.qr-dialog { width: min(430px,calc(100vw - 28px)); max-height: calc(100dvh - 28px); margin: auto; padding: 30px; border: 1px solid var(--line); background: var(--paper); color: var(--ink); overflow: auto; }
.qr-dialog::backdrop { background: #161412b8; backdrop-filter: blur(8px); }
.qr-close { position: absolute; top: 8px; right: 8px; width: 40px; height: 40px; border: 0; background: none; color: var(--ink); font-size: 26px; cursor: pointer; }
.qr-eyebrow { margin: 0 20px 18px 0; color: #696154; font: 9px var(--mono); letter-spacing: .1em; }
.qr-dialog h2 { font: 400 27px/1.5 var(--han); }
.qr-dialog h2 em { color: var(--accent); font-style: normal; }
.qr-dialog .qr-art { margin: 18px auto; }
.qr-dialog .qr-help { margin-top: 10px; }
.qr-dialog .qr-save { display: block; margin-top: 18px; padding: 13px; background: var(--ink); color: var(--paper); border: 0; text-align: center; }
.qr-original { display: block; margin: 16px 0; color: #696154; text-align: center; font-size: 12px; text-underline-offset: 4px; }
.qr-live:focus-visible, .qr-save:focus-visible, .qr-original:focus-visible, .qr-close:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.qr-open .cursor, .qr-open .cursor__dot { visibility: hidden; }
html.cursor-on .qr-dialog, html.cursor-on .qr-dialog a, html.cursor-on .qr-dialog button { cursor: auto; }
@media (max-width:640px) {
  .intro__enter { bottom: 27%; }
  .intro__enter small { font-size: 10px; letter-spacing: .03em; }
  .qr-dialog { padding: 26px 22px; }
  .qr-dialog h2 { font-size: 24px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .rise, .fade, .reveal { opacity: 1; transform: none; }
  .intro.ready .intro__enter { opacity: 1; }
}

@media (max-width:480px) {
  .elders-wrap { margin-inline: 0; padding-inline: 18px; }
}

/* Motion follows native scrolling, without wheel interception or easing the page. */
.voice-seal { position: absolute; right: 6%; top: 30%; width: clamp(108px,13vw,168px); aspect-ratio: 1; z-index: 2; color: var(--accent); text-decoration: none; display: grid; place-items: center; }
.voice-seal svg { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: .65; animation: seal-turn 24s linear infinite; }
.voice-seal text { fill: currentColor; stroke: none; font: 10px var(--mono); letter-spacing: 1px; }
.voice-seal > span { text-align: center; font: 14px/1.9 var(--han); }
.voice-seal em { display: block; font-size: 12px; font-style: normal; }
.voice-seal:hover { color: var(--ink); }
.voice-seal:hover svg { animation-duration: 8s; }
.voice-seal:focus-visible { outline: 2px solid var(--accent); outline-offset: 6px; border-radius: 50%; }
@keyframes seal-turn { to { transform: rotate(360deg); } }
.voice-ribbon { overflow: hidden; padding: 30px 0; background: var(--accent); color: var(--paper); }
.ribbon-track { display: flex; width: max-content; animation: ribbon-move 30s linear infinite; font: 400 clamp(30px,4.5vw,64px)/1.35 var(--serif); letter-spacing: -.025em; }
.ribbon-track > span { flex: none; padding-right: .6em; }
.ribbon-track i { display: inline-block; padding: 0 .4em; font-style: normal; }
.ribbon-outline { animation-direction: reverse; color: transparent; -webkit-text-stroke: 1px var(--paper); }
@keyframes ribbon-move { to { transform: translateX(-50%); } }
.story-ready > span { color: #716a60; transition: color .18s linear; }
.story-ready > span.is-lit { color: var(--ink); }
.story-ready > .story-accent.is-lit { color: var(--accent); }
.click-bloom { position: fixed; width: 18px; height: 18px; border: 1px solid var(--accent); border-radius: 50%; z-index: 9999; pointer-events: none; animation: click-bloom .65s ease-out forwards; }
@keyframes click-bloom { from { transform: translate(-50%,-50%) scale(.3); opacity: .85; } to { transform: translate(-50%,-50%) scale(5); opacity: 0; } }
@media (max-width:980px) {
  .voice-seal { top: 90px; right: 24px; width: 104px; }
  .voice-seal > span { font-size: 11px; }
  .voice-seal em { font-size: 10px; }
}
@media (max-width:600px) {
  .voice-seal { position: relative; top: auto; right: auto; width: 104px; margin: 8px 0 26px auto; }
  .voice-ribbon { padding: 22px 0; }
}
@media (prefers-reduced-motion:reduce) {
  .voice-seal svg, .ribbon-track { animation: none; }
  .click-bloom { display: none; }
}
.travel-head { overflow: clip; }

/* A compact recruitment invitation before the main headline. */
.hero-welcome{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:center;margin-bottom:34px}
.hero-welcome .questions{margin-bottom:0}
.hero-recruit{display:flex;align-items:center;gap:18px;padding:16px;border:1px solid var(--line);background:var(--paper);position:relative;z-index:2}
.hero-recruit .qr-live{display:block;flex:0 0 132px;width:132px;padding:8px;background:#fff}
.hero-recruit-year{font:9px var(--mono);letter-spacing:.12em;color:var(--accent)}
.hero-recruit h2{font:400 20px/1.5 var(--han);margin:7px 0}
.hero-recruit p{font-size:11px;line-height:1.7;color:var(--grey)}
.hero-recruit .qr-save{font-size:12px;padding:10px 0;min-height:44px;box-sizing:border-box}
@media(max-width:1100px){.hero-welcome{grid-template-columns:1fr}.hero-recruit{justify-self:start}}
@media(max-width:600px){.hero-welcome{gap:22px;margin-bottom:28px}.hero-recruit{width:100%;box-sizing:border-box;gap:12px;padding:12px}.hero-recruit .qr-live{flex-basis:112px;width:112px;padding:7px;box-sizing:border-box}.hero-recruit-copy{min-width:0}.hero-recruit h2{font-size:18px}.hero-recruit p{font-size:10px}.hero-recruit-year{font-size:8px}}
.hero{overflow:clip}
