/* learn.css — owned by the LEARN lane. The academy (LED art + solid people + glow) and its street furniture. */
.academy { position: absolute; display: block; text-decoration: none; isolation: isolate; }
.academy > * { position: absolute; display: block; }
.academy canvas { display: block; }
.academy-glow { pointer-events: none; mix-blend-mode: screen; image-rendering: auto; z-index: 5; }
.academy-plate { display: flex; align-items: center; justify-content: center; padding: 0 calc(var(--p) * 1); overflow: hidden; z-index: 4; }
.academy-plate img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 0 calc(var(--p) * 1.2) rgba(255, 236, 190, .35)); }
.academy-plate.paper { background: var(--paper); border: 2px solid #c8a24a; }
.academy-plate.paper img { filter: none; }
.academy-name { font: 600 calc(var(--p) * 5)/1 var(--f-pixel); color: #f6f0dc; letter-spacing: .04em; text-align: center; }
.academy:hover .academy-plate, .academy:focus-visible .academy-plate { outline: 2px solid var(--green); outline-offset: 2px; }
.learn-prop, .learn-aframe-art { display: block; }
.learn-halo { pointer-events: none; border-radius: 50%; background: radial-gradient(closest-side, rgba(255, 214, 120, .5), rgba(255, 207, 110, .16) 55%, rgba(255, 207, 110, 0)); }
.learn-aframe { position: absolute; display: block; }
.learn-note { position: absolute; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .15em; color: #f6f0dc; font: 500 calc(var(--p) * 2.8)/1.05 var(--f-pixel); text-align: center; text-shadow: 0 0 calc(var(--p) * 1) rgba(246, 240, 220, .35); white-space: nowrap; }

/* Standalone introduction, matching the community and partners title treatment.
   Counter the scene lift so the title stays beneath the HUD as the panel enters. */
.three-ways-heading { top: calc(104px + (var(--scene-lift) - (80vh - 104px) * (1 - var(--scene-scale))) / var(--scene-scale)); color: var(--paper); pointer-events: none; text-shadow: 0 2px 2px #080e0b, 0 0 8px #080e0b; }
.three-ways-kicker { margin: 0 0 8px; font: 600 13px/1.3 var(--f-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--mint); }
.three-ways-heading h2 { margin: 0; font: 700 clamp(40px, 4.8vw, 78px)/1.02 var(--f-pixel); color: #dbf3df; }
.three-ways-copy { max-width: 65ch; margin: 10px 0 0; color: #b7c6ba; font: 500 clamp(15px, 1.5vw, 23px)/1.4 var(--f-pixel); }
.three-ways-copy strong { color: var(--paper); font-weight: 600; }
@media (max-width: 767px) {
  .three-ways-heading h2 { font-size: 32px; }
  .three-ways-copy { font-size: 15px; }
}
@media (max-height: 600px) {
  .three-ways-heading h2 { font-size: 24px; }
  .three-ways-kicker, .three-ways-copy { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
}