/* A small encounter inside a moving, illustrated crowd. */
.crowd-hero{display:block;min-height:0;background:var(--paper)}
.crowd-anchor{position:absolute;top:0;left:0;scroll-margin-top:96px}
.crowd-scene{position:relative;height:clamp(650px,calc(100svh - 96px),980px);isolation:isolate}
.crowd-hero.is-revealed .crowd-scene{min-height:calc(var(--hero-card-height,560px) + 64px)}
.crowd-visual{display:none}
.crowd-hero.is-ready .crowd-visual{display:block}
.crowd-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.crowd-intro{position:absolute;left:20px;right:20px;top:9%;z-index:0;text-align:center;pointer-events:none;will-change:transform}
.crowd-intro .eyebrow{display:block;font-size:9px;letter-spacing:2px;margin:0 0 19px;color:var(--muted)}
.crowd-intro-title{font-size:clamp(38px,4.4vw,64px);font-weight:500;letter-spacing:-2.7px;line-height:1.14;margin:0}
.crowd-guide{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;overflow:visible;opacity:1;transition:opacity .45s ease}
.crowd-guide-arrow{fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.crowd-guide-label{fill:var(--ink);stroke:none;font-family:var(--font);font-size:12px;font-weight:600;letter-spacing:.2px;text-anchor:middle}
.crowd-hero.is-discovering .crowd-guide{opacity:1}
.crowd-hero.is-revealed .crowd-guide{opacity:0}
.crowd-person{position:absolute;left:0;top:0;width:320px;height:480px;padding:0;border:0;background:transparent;z-index:5;cursor:pointer;isolation:isolate;transform-origin:50% 0;touch-action:manipulation}
.crowd-person:focus-visible{outline:2px solid var(--accent);outline-offset:9px;border-radius:40%}
.crowd-hero .hero-info{position:absolute;inset:0 max(7vw,calc((100vw - 1200px)/2)) 0 auto;z-index:6;display:flex;align-items:center;width:min(560px,47vw);pointer-events:none}
.hero-info-card{position:relative;width:100%;padding:36px 34px;background:var(--paper);border:1px solid var(--line);box-shadow:0 14px 44px -32px #18213a30;pointer-events:auto}
.crowd-hero .hero-info .eyebrow{font-size:9px;letter-spacing:1.8px;color:var(--muted);margin:0 0 24px}
.crowd-hero .hero-info h1{font-size:clamp(39px,4vw,57px);line-height:1.12;letter-spacing:-2.8px;margin:0 0 20px;font-weight:500;outline:none}
.crowd-hero .hero-info .hero-subtitle{font-size:18px;line-height:1.6;letter-spacing:-.4px;margin:0 0 22px;max-width:360px}
.crowd-hero .hero-info .hero-university{font-size:8px;letter-spacing:1.2px;line-height:1.9;margin-bottom:13px}
.crowd-hero .hero-info .hero-status{font-size:11px;line-height:1.8;align-items:baseline}
.crowd-hero .hero-info .hero-status>span{position:relative;top:-1px;width:5px;height:5px}
.crowd-hero .hero-info .hero-actions{margin-top:29px;gap:24px;flex-wrap:wrap}
.crowd-hero .hero-info .button{font-size:11px;padding:12px 17px;gap:24px}
.crowd-hero .hero-info .download-link{font-size:11px;gap:13px}
.hero-biography{font-size:14px;line-height:1.85;color:var(--muted)}
.hero-biography p{margin:0 0 13px}
.hero-biography p:last-child{margin-bottom:0}
.crowd-hero .hero-info .hero-actions{margin-top:22px}
.hero-info-card .profile-cv{margin-top:24px;padding-top:22px;grid-template-columns:30px 1fr;gap:15px}
.hero-info-card .profile-cv-icon{width:28px;height:36px}
.hero-info-card .profile-cv h2{font-size:19px;font-weight:500;line-height:1.4;letter-spacing:-.4px;margin:0 0 5px}
.hero-info-card .profile-cv .small-label{font-size:8px}
.hero-info-card .profile-cv p:not(.small-label){font-size:12px;margin-bottom:3px}
.crowd-reset{position:absolute;right:13px;top:13px;border:1px solid var(--line);background:transparent;width:30px;height:30px;padding:0;font-size:21px;line-height:1}
.crowd-reset:hover{color:var(--accent);border-color:var(--accent)}
.crowd-hero.is-ready:not(.is-revealed) .hero-info{visibility:hidden;opacity:0}
.crowd-hero:not(.is-ready) .hero-info{right:50%;width:min(650px,calc(100% - 48px));transform:translateX(50%)}
@media(min-width:761px) and (max-height:800px){
  .crowd-intro{top:5%}
  .crowd-intro-title{font-size:48px}
  .crowd-person{width:300px;height:450px}
}
@media(min-width:761px) and (max-width:1100px){
  .crowd-hero .hero-info{right:32px;width:47vw}
  .hero-info-card{padding:32px 25px}
  .crowd-hero .hero-info h1{font-size:44px}
  .crowd-hero .hero-info .hero-subtitle{font-size:16px}
  .crowd-hero .hero-info .hero-actions{gap:20px}
}
@media(max-width:760px){
  .crowd-scene{height:max(760px,calc(100svh - 78px))}
  .crowd-hero.is-revealed .crowd-scene{min-height:calc(265px + var(--hero-card-height,600px) + 32px)}
  .crowd-anchor{scroll-margin-top:78px}
  .crowd-intro{top:10%}
  .crowd-intro-title{font-size:42px;letter-spacing:-2px}
  .crowd-intro .eyebrow{font-size:8px;margin-bottom:20px}
  .crowd-person{width:260px;height:390px}
  .crowd-guide-label{font-size:11px}
  .crowd-hero .hero-info{inset:265px 20px auto;width:auto;display:block}
  .hero-info-card{padding:29px 23px 28px}
  .crowd-hero .hero-info .eyebrow{font-size:8px;margin-bottom:21px}
  .crowd-hero .hero-info h1{font-size:43px;letter-spacing:-2.3px;margin-bottom:19px}
  .crowd-hero .hero-info .hero-subtitle{font-size:17px;margin-bottom:19px}
  .crowd-hero .hero-info .hero-university{font-size:7px;letter-spacing:1px;max-width:none}
  .crowd-hero .hero-info .hero-status{font-size:10px;gap:7px}
  .crowd-hero .hero-info .hero-actions{gap:22px;margin-top:25px}
  .crowd-hero .hero-info .button{font-size:10px;gap:22px;padding:11px 15px}
  .crowd-hero .hero-info .download-link{font-size:10px;gap:10px}
  .hero-biography{font-size:14px;line-height:1.8}
  .crowd-hero:not(.is-ready) .hero-info{inset:90px 20px auto;width:auto;transform:none}
}
@media(max-width:360px){
  .crowd-hero .hero-info h1{font-size:38px}
  .hero-info-card{padding-inline:20px}
  .crowd-hero .hero-info .hero-actions{gap:17px}
  .crowd-intro-title{font-size:38px}
}