/* Home: room tour → arched doorway → career road (room-career.js).
   The road and cards use the About page's layout and styles from career.css (.career-stops grid,
   .stop-card, alternating sides, .road-ready reveal, .is-narrow single column), so Home and
   About match. This file only adds the doorway exit, the road box and the fixed walker. */
.tour,.home-career{--road-ahead:#d7e1f6;--road-done:#eeb3c0;--road-line:#fff}
:root[data-theme="dark"] .tour,:root[data-theme="dark"] .home-career{--road-ahead:#283152;--road-done:#9d6a92;--road-line:#141a30}

/* Inside the pinned stage */
.leave-wash{position:absolute;inset:0;z-index:1;background:var(--surface);opacity:0;pointer-events:none}
.leave-road{position:absolute;left:0;top:0;z-index:1;overflow:visible;pointer-events:none;opacity:0}
.leave-intro{position:absolute;z-index:3;opacity:0;pointer-events:none;will-change:opacity,transform}
.leave-intro.is-on{pointer-events:auto}
.leave-intro h2{font-size:clamp(2.2rem,4vw,3.6rem);letter-spacing:-.025em;line-height:1.05;margin:0 0 14px;text-wrap:balance}
.leave-intro p:last-child{max-width:44ch;font-size:17px;margin:0}
.road-ahead,.road-done{fill:none;stroke-linecap:round;stroke-linejoin:round}
.road-ahead{stroke:var(--road-ahead)}
.road-done{stroke:var(--road-done);stroke-dasharray:0 99999}
.road-dash{fill:none;stroke:var(--road-line);stroke-width:2;stroke-dasharray:9 11;stroke-linecap:round}
/* While leaving, the room is a picture in a doorway, not a set of controls. */
.is-leaving .tour-cards{opacity:0;pointer-events:none}
.is-leaving .tour-rail:not(:focus-within){opacity:0;pointer-events:none}
.is-leaving .room .room-spots,.is-leaving .room .motion-toggle,.is-leaving .room .room-hint,.is-leaving .room .skip-anim{opacity:0;pointer-events:none;transition:opacity .25s ease}

/* The road in normal flow. It starts at the section's top edge, where the stage's road ends. */
.home-career{position:relative;background:var(--surface);padding:0 24px 140px;border-bottom:1px solid var(--line)}
.home-road{position:relative;max-width:1060px;margin:0 auto;padding-top:90px}
.home-road-svg{position:absolute;left:0;top:0;overflow:visible;pointer-events:none}
.home-road-svg .road-stop{fill:var(--surface);stroke:var(--plum);stroke-width:3;transition:fill .3s ease,stroke .3s ease}
.home-road-svg .road-stop.reached{fill:var(--cherry);stroke:var(--cherry)}
/* Narrow road: the road on the left, one column of cards (career.css .is-narrow), a bit tighter. */
.home-road.is-narrow{padding-top:70px}
.home-road.is-narrow .career-stops{padding-left:62px}
.home-career .career-stop:focus-within{opacity:1;transform:none}

/* Reduced motion and short screens: the same road, fully drawn, every role visible */
.home-career.is-static{padding:64px 24px 80px}
.home-career-intro{max-width:620px;margin:0 auto;text-align:center}
.home-career-intro h2{font-size:clamp(2.2rem,4vw,3.6rem);letter-spacing:-.025em;margin:0 0 14px}
.home-career-intro p:last-child{margin:0}
.home-career.is-static .home-road{padding-top:60px}

/* One walker for the whole journey */
.road-walker{position:fixed;left:0;top:0;z-index:7;width:70px;height:142px;pointer-events:none;opacity:0;will-change:transform,opacity}
.road-walker.is-small{width:50px;height:101px}
.road-walker-body{position:absolute;inset:0;display:block;transform-origin:50% 100%}
.road-walker-body img{width:100%;height:100%;display:block}
.road-walker.is-flipped .road-walker-body img{transform:scaleX(-1)}
.road-walker.is-walking .road-walker-body{animation:road-bob .42s ease-in-out infinite}
@keyframes road-bob{50%{transform:translateY(-4px) rotate(1.5deg)}}
.road-walker-shadow{position:absolute;left:12%;right:12%;bottom:-5px;height:9px;border-radius:50%;background:rgba(39,41,74,.18)}
/* Under her feet: the road ends there, so the bubble never covers a card. */
.road-bubble{position:absolute;left:50%;top:calc(100% + 12px);width:max-content;max-width:80px;text-align:center;line-height:1.25;background:var(--surface);color:var(--ink);border:1.5px solid var(--plum);border-radius:12px;padding:5px 10px;font-size:13px;font-weight:600;opacity:0;transform:translate(-50%,6px) scale(.9);transition:opacity .3s ease,transform .3s cubic-bezier(.2,.8,.2,1)}
.road-walker.is-home .road-bubble{opacity:1;transform:translate(-50%,0)}
.road-walker.is-small .road-bubble{left:0;max-width:56px;padding:4px 7px;font-size:11px;transform:translateY(6px) scale(.9)}
.road-walker.is-small.is-home .road-bubble{transform:none}

@media (max-width:760px){
  .leave-intro h2{font-size:clamp(2rem,9vw,2.6rem)}
  .leave-intro p:last-child{font-size:16px}
  .home-career{padding:0 16px 100px}
  .home-career.is-static{padding:48px 16px 56px}
  .home-career-intro{text-align:left}
}
@media (prefers-reduced-motion:reduce){
  .road-walker{display:none}
}
