* { box-sizing: border-box; }
html { background:#000; color:#fff; font-size:1.44vh; }
body { margin:0; font-family:"Helvetica Neue",Helvetica,sans-serif; font-size:2.2rem; line-height:1.2; -webkit-font-smoothing:antialiased; -webkit-text-size-adjust:none; }
.portrait { position:fixed; inset:0 auto 0 0; width:50%; height:100vh; overflow:hidden; }
.portrait img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
main { margin-left:50%; min-height:100vh; display:flex; align-items:center; padding:4rem; overflow-wrap:break-word; }
.biography { width:100%; }
p { margin:0 0 1.2em; text-wrap:pretty; }
strong { font-weight:700; }
nav { line-height:1.2; }
nav a { display:inline-block; color:inherit; width:1em; height:1em; vertical-align:baseline; position:relative; }
nav a + a { margin-left:.2em; }
nav a:hover { opacity:1; }
/* Icon hover glow: same light as the seam, following the cursor. */
nav a::before { content:""; position:absolute; z-index:-1; left:var(--gx,50%); top:var(--gy,50%); width:100%; height:100%; transform:translate(-50%,-50%) scale(2.2); background:radial-gradient(circle,rgba(227,240,255,.5),rgba(105,163,255,.16) 42%,transparent 70%); opacity:0; transition:opacity .65s ease; pointer-events:none; }
nav a.glow-active::before { opacity:1; }
nav svg { width:100%; height:100%; }
a:hover { opacity:.7; }
a:focus-visible { outline:2px solid white; outline-offset:5px; }
@media(max-width:800px) {
 html { font-size:calc(8px + .64vw); }
 body { font-size:2rem; line-height:1.45; }
 .portrait { position:relative; width:100%; height:50vh; -webkit-mask-image:linear-gradient(to bottom,#000 80%,transparent); mask-image:linear-gradient(to bottom,#000 80%,transparent); }
 main { margin-left:0; min-height:0; padding:3rem 2.4rem; }
 p { margin-bottom:1.35em; }
 .brands-line { text-wrap:wrap; }
 nav a { width:1.45em; height:1.45em; }
 nav a + a { margin-left:.5em; }
}

/* A narrow light at the portrait edge; no layout or pointer interference. */
.seam-light { position:fixed; z-index:5; left:50%; top:0; width:1px; height:100vh; pointer-events:none; opacity:0; transition:opacity .65s ease; background:rgba(159,192,235,.12); }
.seam-light.active { opacity:1; }
.seam-light::before, .seam-light::after { content:""; position:absolute; top:0; left:50%; transform:translate(-50%, calc(var(--light-y, 50vh) - 50%)); }
.seam-light::before { width:64px; height:360px; background:radial-gradient(ellipse,rgba(105,163,255,.25),rgba(85,135,230,.07) 38%,transparent 70%); }
.seam-light::after { width:1px; height:300px; background:linear-gradient(transparent,rgba(136,183,248,.55) 28%,rgba(227,240,255,.95) 50%,rgba(136,183,248,.55) 72%,transparent); box-shadow:0 0 8px rgba(142,191,255,.3); }
@media(max-width:800px), (hover:none), (prefers-reduced-motion:reduce) { .seam-light { display:none; } nav a::before { display:none; } }
