/* === Brand Mark Logo === */
.brand-mark {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: url("assets/img/LOGO-1.png") center/contain no-repeat;
    display: inline-block;
}

/* === Hero background === */
.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url("assets/img/PCBHeader-1024x527.png") center/cover no-repeat;
    filter: brightness(.45);
    z-index: -1;
}

/* === Portrait image === */
.portrait {
    width: min(360px, 80vw);
    aspect-ratio: 1/1;
    border-radius: 50%;
    background: url("assets/img/jamainphoto.png") center/cover no-repeat;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .55), 0 0 0 6px rgba(255, 255, 255, .06) inset;
}