/* Quiet discoveries anchored to the header's forest artwork. */
.hero-bottom-row { display: flex; align-items: center; gap: 16px; margin-top: 14px; }
.hero-bottom-row .hero-socials { margin-top: 0; }
.hero-relic-art { position: absolute; z-index: -1; inset: 0; overflow: hidden; pointer-events: none; }
.hero-jake { position: absolute; max-width: none; height: auto; transform: translate(-50%,-100%); image-rendering: pixelated; }
.hero-jake[hidden],.hero-relic[hidden] { display: none; }
.jake-conversation { --scene-unit: 1px; position: absolute; z-index: 2; width: 0; height: 0; pointer-events: none; }
.jake-conversation[hidden],.jake-bubble[hidden] { display: none; }
.jake-trigger { position: absolute; left: 0; top: 0; width: max(44px,calc(68 * var(--scene-unit))); height: max(44px,calc(46 * var(--scene-unit))); padding: 0; border: 0; border-radius: 5px; background: transparent; transform: translate(-50%,-50%); cursor: pointer; pointer-events: auto; }
.jake-trigger:focus-visible { outline: 3px solid #f1c35b; outline-offset: 3px; }
.jake-bubble { position: absolute; bottom: 38px; margin: 0; padding: 15px 17px; border: 2px solid #263c2b; border-radius: 14px; background: #fff; color: #171b17; box-shadow: 0 5px 0 #071b1440; font: 500 16px/1.5 'Space Grotesk',sans-serif; pointer-events: auto; }
.jake-bubble p { margin: 0; }
.jake-bubble::before,.jake-bubble::after { content: ''; position: absolute; left: var(--tail-left,50%); width: 0; height: 0; transform: translateX(-50%); }
.jake-bubble::before { bottom: -12px; border-left: 11px solid transparent; border-right: 11px solid transparent; border-top: 12px solid #263c2b; }
.jake-bubble::after { bottom: -9px; border-left: 9px solid transparent; border-right: 9px solid transparent; border-top: 10px solid #fff; }
.jake-bubble[data-placement='below'] { bottom: auto; top: 38px; }
.jake-bubble[data-placement='below']::before { bottom: auto; top: -12px; border-top: 0; border-bottom: 12px solid #263c2b; }
.jake-bubble[data-placement='below']::after { bottom: auto; top: -9px; border-top: 0; border-bottom: 10px solid #fff; }
.hero-relic { --scene-unit: 1px; position: absolute; z-index: 3; width: max(44px,calc(64 * var(--scene-unit))); height: calc(180 * var(--scene-unit)); transform: translate(-50%,-100%); pointer-events: none; }
.hero-secret { position: absolute; inset: auto 0 0; width: 100%; height: max(44px,calc(88 * var(--scene-unit))); padding: 0; border: 0; background: transparent; color: var(--paper); cursor: pointer; pointer-events: auto; }
.hero-secret__mask { position: absolute; inset: auto 0 0; height: calc(180 * var(--scene-unit)); overflow: hidden; pointer-events: none; }
.hero-secret__mask img { position: absolute; left: 50%; bottom: 0; width: calc(64 * var(--scene-unit)); height: calc(128 * var(--scene-unit)); max-width: none; transform: translate(-50%,calc(50 * var(--scene-unit))); image-rendering: pixelated; filter: drop-shadow(1px 2px 0 #10251c); }
.hero-secret::before { content: ''; position: absolute; z-index: 2; bottom: -1px; left: 50%; width: calc(12 * var(--scene-unit)); height: 3px; transform: translateX(-50%); background: #10271b; border-radius: 50%; pointer-events: none; }
.hero-secret__glint { position: absolute; left: 56%; bottom: calc(63 * var(--scene-unit)); width: 7px; height: 7px; background: #ecf2d4; clip-path: polygon(50% 0,62% 37%,100% 50%,62% 62%,50% 100%,37% 62%,0 50%,37% 37%); filter: drop-shadow(0 0 5px #d3e8b5); animation: sanctuary-glint 6s ease-in-out infinite; pointer-events: none; }
.hero-secret__hint { position: absolute; left: 50%; bottom: calc(84 * var(--scene-unit)); padding: 7px 10px; border: 1px solid var(--line-subtle); background: #11291ff5; color: var(--paper); font: 12px/1.4 'DM Mono',monospace; white-space: nowrap; opacity: 0; transform: translate(-50%,4px); transition: opacity .2s,transform .2s; pointer-events: none; }
.hero-secret:hover .hero-secret__hint,.hero-secret:focus-visible .hero-secret__hint { opacity: 1; transform: translate(-50%,0); }
.hero-relic__message { position: absolute; z-index: 3; width: max-content; max-width: 220px; margin: 0; padding: 9px 12px; border: 1px solid #6b8062; background: #10291ff5; color: #e1e5d4; font: 13px/1.5 'DM Mono',monospace; text-align: center; transform: translateX(-50%); pointer-events: none; }
.hero-relic__message:empty { display: none; }
.hero-relic__runes { position: absolute; left: 50%; bottom: -7px; width: calc(90 * var(--scene-unit)); height: calc(22 * var(--scene-unit)); border: 1px dashed #c6d8a9; border-radius: 50%; transform: translateX(-50%); opacity: 0; box-shadow: 0 0 14px #c2d7a233; transition: opacity .6s; }
.hero-relic[data-state='tugging'] .hero-secret__mask img { animation: sanctuary-tug .65s ease-in-out both; }
.hero-relic[data-state='drawing'] .hero-secret__mask img { animation: sanctuary-draw 1.4s cubic-bezier(.3,0,.2,1) both; }
.hero-relic[data-state='drawing'] .hero-secret__hint,.hero-relic[data-state='tugging'] .hero-secret__hint { opacity: 0; }
.hero-relic[data-state='revealed'] .hero-secret__mask img { transform: translate(-50%,calc(-12 * var(--scene-unit))); filter: drop-shadow(0 0 8px #cfe5b4aa); }
.hero-relic[data-state='revealed'] .hero-secret { height: calc(160 * var(--scene-unit)); }
.hero-relic[data-state='revealed'] .hero-relic__runes { opacity: .7; }
.hero-relic[data-state='revealed'] .hero-secret__glint { bottom: calc(125 * var(--scene-unit)); }
.hero-relic[data-state='revealed'] .hero-secret__hint { bottom: calc(146 * var(--scene-unit)); }
@keyframes sanctuary-glint { 0%,40%,65%,100% { opacity: .2; transform: scale(.6); } 52% { opacity: 1; transform: scale(1); } }
@keyframes sanctuary-tug { 0%,100% { transform: translate(-50%,calc(50 * var(--scene-unit))); } 25%,65% { transform: translate(calc(-50% - 2px),calc(47 * var(--scene-unit))); } 45%,80% { transform: translate(calc(-50% + 2px),calc(48 * var(--scene-unit))); } }
@keyframes sanctuary-draw { 0%,12% { transform: translate(-50%,calc(50 * var(--scene-unit))); } 20% { transform: translate(calc(-50% - 1px),calc(48 * var(--scene-unit))); } 30% { transform: translate(calc(-50% + 1px),calc(47 * var(--scene-unit))); } 42% { transform: translate(-50%,calc(44 * var(--scene-unit))); } 90%,100% { transform: translate(-50%,calc(-12 * var(--scene-unit))); } }
@media (max-width: 850px) {
  .hero-relic, .hero-relic__message { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-secret__glint,.hero-secret__mask img { animation: none !important; }
  .hero-secret__hint,.hero-relic__runes { transition: none; }
}
