/* Version B only: real portrait, abstract lighting, no invented event setting. */
.hero-purple{background:radial-gradient(ellipse at 49% 37%,#795487 0%,#482c58 35%,#291833 72%)}
.hero-purple::before{content:"";position:absolute;inset:95px -10% 0;pointer-events:none;background:linear-gradient(118deg,transparent 35%,#ddc4eb0d 35.1%,transparent 63%);border-bottom:1px solid #ba98ce33}
.hero-purple .hero-photo{left:50%;top:125px;width:min(66vw,950px);height:auto;max-width:none;transform:translateX(-50%);object-fit:contain;object-position:center top;mask-image:linear-gradient(#000 75%,transparent 100%)}
.hero-purple .hero-shade{background:linear-gradient(90deg,#291833aa,transparent 35%,transparent 65%,#29183388),linear-gradient(0deg,#291833,transparent 25%);pointer-events:none}
.hero-purple .hero-layout{position:relative;z-index:1}
.hero-purple .hero-content{max-width:350px}
.hero-purple .hero-photo-credit a{text-decoration:underline;text-underline-offset:3px}
@media(min-width:901px) and (max-width:1100px){
 .hero-purple .hero-photo{top:150px;width:70vw}
}
@media(max-width:900px){
 .hero-purple .hero-photo{top:90px;width:720px;max-width:100%;height:auto}
 .hero-purple .hero-layout{padding-top:570px}
 .hero-purple .hero-shade{background:linear-gradient(180deg,transparent 380px,#291833 590px)}
 .hero-purple .hero-content{max-width:620px}
}
@media(max-width:600px){
 .hero-purple .hero-photo{top:90px;width:500px;max-width:none;height:auto}
 .hero-purple .hero-layout{padding-top:455px}
 .hero-purple .hero-shade{background:linear-gradient(180deg,transparent 350px,#291833 490px)}
}