:root{color-scheme:dark;--bg:#101112;--fg:#f1f1eb;--muted:#a6a8a3;--line:#353735;--accent:#d5f28a}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.5}
body.overlay-open{overflow:hidden}
a{color:inherit;text-decoration:none}
a:hover{color:var(--accent)}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:7px}
.wrap{width:min(1120px,calc(100% - 96px));margin-inline:auto}
header{display:flex;align-items:center;justify-content:space-between;padding:30px 0;border-bottom:1px solid var(--line)}
.wordmark{font-size:23px;font-weight:bold;letter-spacing:-1px}
.wordmark span{color:var(--accent)}
nav{display:flex;align-items:center;gap:30px;font-size:14px}
.nav-bio{appearance:none;border:0;background:none;color:inherit;font:inherit;padding:0;cursor:pointer}
.nav-bio:hover{color:var(--accent)}
.intro{padding:48px 0 0}
.eyebrow{margin:16px 0 0;color:#bfc1be;font-size:16px;letter-spacing:.025em;text-transform:none}
h1{font-size:clamp(36px,5.8vw,72px);line-height:1.08;letter-spacing:-.045em;font-weight:500;margin:0}
.contact-details{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:24px;color:#c4c6c2;font-size:16px}
.contact-details a:hover,.more-about a:hover{color:white;text-decoration:underline}
.selection-label{font-size:14px;letter-spacing:.12em;text-transform:uppercase;margin:48px 0 20px;color:#dddeda;font-weight:400}
.collection{margin-top:0;padding:24px 0 28px;border-top:1px solid var(--line)}
.media-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.media-card{aspect-ratio:1;background:#000;position:relative;min-width:0;border:1px solid #272929;overflow:hidden}
.tile-button{border:0;border-radius:0;width:100%;height:100%;padding:34px;background:#000;color:var(--fg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;cursor:pointer;font:inherit;text-align:center}
.tile-button:hover{background:#080a08}
.tile-button:focus-visible{outline:2px solid var(--accent);outline-offset:-4px}
.tile-type{font-size:12px;letter-spacing:.15em;color:var(--muted)}
.tile-title{font-size:clamp(25px,3.2vw,42px);line-height:1.12;letter-spacing:-.035em;overflow-wrap:anywhere}
.tile-play{font-size:22px;color:var(--accent)}
.tile-credit{font-size:14px;color:var(--muted)}
footer{margin-top:58px!important;padding:27px 0 35px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:14px;color:var(--muted);align-items:center;flex-wrap:wrap}
.more-about{margin:0;font-size:14px}
.more-about a{text-decoration:underline;text-underline-offset:4px}
.skip{position:absolute;top:-100px;background:var(--accent);color:#101112;padding:10px;z-index:10001}
.skip:focus{top:10px}
[hidden]{display:none!important}

/* Fullscreen overlays */
.fullscreen-overlay{position:fixed;inset:0;z-index:10000;background:#000;color:var(--fg)}
.overlay-close{position:fixed;right:26px;top:24px;width:46px;height:46px;border:1px solid #666;border-radius:50%;background:rgba(16,17,18,.88);color:#fff;font-size:30px;font-weight:300;line-height:1;cursor:pointer;z-index:10003;display:flex;align-items:center;justify-content:center}
.overlay-close:hover{border-color:var(--accent);color:var(--accent)}
.overlay-close:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.media-overlay{display:flex;align-items:center;justify-content:center}
.overlay-player{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.fullscreen-film{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}
.overlay-meta{position:absolute;left:30px;bottom:25px;z-index:2;pointer-events:none;text-shadow:0 1px 12px #000}
.overlay-type{display:block;font-size:11px;letter-spacing:.16em;color:var(--accent);margin-bottom:5px}
.overlay-title{font-size:18px;font-weight:400;line-height:1.2;margin:0}
.overlay-credit{font-size:12px;color:#bbb;margin:5px 0 0}
.fullscreen-audio{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 8vw}
.fullscreen-audio .overlay-meta{position:static;text-align:center;text-shadow:none;margin-bottom:38px}
.fullscreen-audio .overlay-title{font-size:clamp(36px,6vw,80px);letter-spacing:-.045em}
.fullscreen-audio .overlay-type{margin-bottom:18px}
.fullscreen-audio .overlay-credit{font-size:14px;margin-top:14px;color:var(--muted)}
.fullscreen-audio-player{width:min(620px,90vw);height:48px}

/* Biography */
.bio-overlay{overflow:auto;background:var(--bg)}
.bio-shell{width:min(1120px,calc(100% - 96px));margin:0 auto;padding:78px 0 90px}
.bio-kicker{font-size:11px;letter-spacing:.18em;color:var(--accent);margin:0 0 20px}
.bio-shell>h2{font-size:clamp(48px,8vw,104px);line-height:.95;letter-spacing:-.055em;font-weight:500;margin:0}
.bio-role{font-size:18px;color:#bfc1be;margin:20px 0 70px}
.bio-columns{display:grid;grid-template-columns:1fr 1fr;gap:clamp(50px,8vw,110px);padding-top:34px;border-top:1px solid var(--line)}
.bio-language{font-size:11px!important;letter-spacing:.18em;color:var(--accent)!important;margin:0 0 28px!important}
.bio-columns p{font-size:clamp(17px,1.5vw,20px);line-height:1.62;color:#e3e4df;margin:0 0 25px}
.bio-columns em{font-style:italic}

@media(max-width:650px){
  .wrap{width:calc(100% - 40px)}
  header{padding:22px 0}
  nav{gap:18px}
  .intro{padding-top:34px}
  h1{font-size:clamp(45px,12vw,78px)}
  .contact-details{flex-direction:column;gap:8px}
  .selection-label{margin-top:36px}
  .media-grid{grid-template-columns:1fr;gap:16px}
  .tile-title{font-size:34px}
  .tile-button{gap:22px}
  footer{flex-direction:column;align-items:flex-start;gap:14px}
  .overlay-close{right:15px;top:15px;width:42px;height:42px;font-size:27px}
  .overlay-meta{left:18px;bottom:18px}
  .bio-shell{width:calc(100% - 40px);padding:70px 0 60px}
  .bio-shell>h2{font-size:clamp(46px,15vw,72px)}
  .bio-role{margin-bottom:45px}
  .bio-columns{grid-template-columns:1fr;gap:45px}
  .bio-columns p{font-size:17px}
}
@media(min-width:651px){.media-card{min-height:300px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}


/* --- Header / section hierarchy refinement --- */
.site-header{
  min-height:92px;
  justify-content:flex-end;
}
.bio-nav{
  margin-left:auto;
}
.nav-bio{
  font-size:clamp(22px,2.2vw,30px);
  line-height:1;
  letter-spacing:-.025em;
  font-weight:400;
  text-transform:none;
}
.selection-label{
  width:max-content;
  margin:52px 7% 22px auto;
  font-size:clamp(16px,1.55vw,21px);
  letter-spacing:.14em;
  color:var(--fg);
  font-weight:500;
}
@media(max-width:650px){
  .site-header{min-height:72px}
  .nav-bio{font-size:22px}
  .selection-label{
    margin:40px 3% 18px auto;
    font-size:16px;
  }
}

/* Final portfolio refinements */
footer{justify-content:space-between}
