/* Personal introduction, career evidence, and a varied-size rendering collage. */
.personal-banner { position:relative; isolation:isolate; }
.personal-banner::after { content:""; position:absolute; z-index:1; inset:0; pointer-events:none; background:radial-gradient(ellipse at 12% 8%,rgba(4,10,19,.96),rgba(4,10,19,.78) 22%,transparent 54%); -webkit-mask:url('assets/banner-shade-mask.svg') 0 0 / 100% 100% no-repeat; mask:url('assets/banner-shade-mask.svg') 0 0 / 100% 100% no-repeat; }
.banner-intro { position:absolute; top:clamp(27px,3.2vw,70px); left:max(36px,4vw); width:32%; max-width:535px; z-index:2; }
.banner-intro .eyebrow { font-size:clamp(9px,.76vw,13px); color:var(--accent); margin-bottom:15px; letter-spacing:.15em; }
.banner-intro h1 { font-size:clamp(33px,3.15vw,66px); line-height:1.08; letter-spacing:-.045em; font-weight:550; color:var(--ink); }
.intro-statement { font-size:clamp(17px,1.45vw,28px); line-height:1.5; margin-top:18px; color:#f0f0eb; text-wrap:pretty; }
.strengths-bar { list-style:none; margin:0; padding:22px max(24px,3vw); display:flex; align-items:center; justify-content:space-between; gap:16px; }
.strengths-bar li { color:#dbc48f; font-size:clamp(9px,.8vw,13px); font-weight:600; line-height:1.6; letter-spacing:.07em; text-transform:uppercase; }
.strengths-bar li+li::before { content:"·"; color:#7e735b; margin-right:clamp(10px,1.3vw,30px); }
.career-highlights { background:#0c1625; border-bottom:1px solid var(--line); }
.career-highlights .metrics { padding-block:43px 36px; border-bottom:0; }
.career-highlights .metrics>div { padding-inline:36px; }
.career-highlights .metrics>div:first-child { padding-left:0; }
.career-highlights .metric-value { font-size:clamp(48px,4.65vw,82px); font-weight:600; letter-spacing:.025em; font-variant-numeric:lining-nums tabular-nums; color:var(--accent); line-height:1.06; }
.career-highlights .metric-value>span { letter-spacing:0; font-size:clamp(20px,1.8vw,29px); font-weight:400; margin-left:10px; }
.career-highlights .metrics p { margin-top:14px; color:var(--ink); font-size:clamp(18px,1.45vw,24px); line-height:1.4; }
.career-highlights .metrics p strong { display:block; font-weight:600; }
.career-highlights .metrics p>span { display:block; font-size:clamp(16px,1.13vw,19px); color:#c1cbd9; margin-top:3px; }
.career-highlights .pipeline-note { border-bottom:0; padding-block:21px; }
.career-highlights .pipeline-note p { font-size:15px; }
.career-highlights .pipeline-note strong { font-weight:600; color:var(--accent); }
.portfolio-gallery { padding-block:56px 32px; scroll-margin-top:22px; }
.gallery-heading { display:flex; justify-content:space-between; align-items:end; gap:36px; margin-bottom:30px; }
.gallery-heading .eyebrow { color:var(--accent); margin-bottom:12px; }
.gallery-heading h2 { font-size:clamp(35px,4.2vw,65px); font-weight:400; line-height:1.1; letter-spacing:-.05em; }
.gallery-heading h2 span { color:var(--accent); }
.gallery-heading>p { max-width:370px; font-size:13px; line-height:1.75; color:var(--muted); }
.portfolio-gallery .filter-bar { margin-bottom:22px; padding-bottom:14px; gap:20px; }
.portfolio-gallery .filters { flex-wrap:wrap; gap:4px; }
.portfolio-gallery .filters button { font-size:12px; padding:10px 13px; }
.portfolio-gallery #project-count { white-space:nowrap; font-size:11px; }
.render-collage { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); grid-auto-rows:clamp(120px,11.5vw,235px); grid-auto-flow:dense; gap:8px; margin-inline:16px; }
.render-tile { min-width:0; min-height:0; }
.render-tile.tile-large { grid-column:span 2; grid-row:span 2; }
.render-tile.tile-wide { grid-column:span 2; }
.render-tile.tile-tall { grid-row:span 2; }
.render-tile button { width:100%; height:100%; aspect-ratio:auto; border:0; }
.render-tile img { height:100%; width:100%; object-fit:cover; }
.render-tile button::after { opacity:0; transition:opacity .25s; }
.tile-caption { bottom:14px; left:14px; right:14px; align-items:center; gap:10px; opacity:0; transform:translateY(5px); transition:opacity .25s,transform .25s; }
.tile-caption strong { font-size:13px; font-weight:500; line-height:1.4; letter-spacing:0; text-shadow:0 1px 8px #000; }
.tile-arrow { flex-shrink:0; font-size:20px; }
.render-tile button:hover::after,.render-tile button:focus-visible::after { opacity:1; }
.render-tile button:hover .tile-caption,.render-tile button:focus-visible .tile-caption { opacity:1; transform:none; }
.render-tile button:focus-visible { outline-offset:-4px; }
.gallery-bottom { display:flex; align-items:center; justify-content:space-between; gap:24px; padding-top:24px; }
.gallery-bottom p { font-size:11px; line-height:1.5; color:var(--muted); }
.gallery-more { background:#18263a; border:1px solid #586076; color:var(--ink); padding:15px 20px; min-height:48px; font-size:12px; }
.gallery-more:hover { background:#27374e; border-color:var(--accent); }
.gallery-more>span { margin-left:22px; color:var(--accent); }
.gallery-more[hidden] { display:none; }
.hero-copy { display:block; }
.hero-statement { font-size:clamp(42px,5.65vw,91px); line-height:1.04; letter-spacing:-.065em; font-weight:500; }
.hero-statement span { color:var(--accent); }
dialog.image-viewer { width:min(1760px,calc(100% - 32px)); height:94dvh; max-height:94dvh; overflow:hidden; }
dialog.image-viewer[open] { display:grid; grid-template-rows:auto minmax(0,1fr) auto auto; }
dialog.image-viewer .dialog-top { position:relative; padding:12px 20px; }
dialog.image-viewer #dialog-media { position:relative; display:block; width:100%; height:100%; min-width:0; min-height:0; aspect-ratio:auto; overflow:hidden; }
dialog.image-viewer #dialog-media img { position:absolute; inset:0; display:block; width:100%; height:100%; min-width:0; min-height:0; max-width:100%; max-height:100%; object-fit:contain; object-position:center; }
dialog.image-viewer .viewer-controls { padding:9px 20px; }
dialog.image-viewer .dialog-copy { min-width:0; padding:12px 20px 15px; }
dialog.image-viewer .dialog-copy h2 { font-size:clamp(17px,1.7vw,25px); line-height:1.2; }
dialog.image-viewer .dialog-copy>p { display:none; }
dialog.image-viewer .dialog-copy>p.dialog-credit { display:block; margin-top:5px; font-size:11px; line-height:1.4; color:var(--muted); }
@media(min-width:1700px) { .banner-intro { left:max(56px,calc((100vw - 1850px)/2)); } }
@media(max-width:1150px) {
 .banner-intro { left:36px; width:34%; top:27px; }
 .banner-intro .eyebrow { font-size:9px; margin-bottom:12px; }
 .intro-statement { font-size:17px; line-height:1.4; margin-top:13px; }
 .strengths-bar { flex-wrap:wrap; justify-content:center; column-gap:20px; row-gap:8px; padding:18px 28px; }
 .strengths-bar li { font-size:10px; }
 .strengths-bar li+li::before { margin-right:20px; }
 .career-highlights .metrics>div { padding-inline:22px; }
 .gallery-heading>p { max-width:270px; }
 .portfolio-gallery .filters button { font-size:11px; padding-inline:10px; }
 .render-collage { grid-auto-rows:clamp(105px,12vw,138px); }
}
@media(max-width:800px) {
 .personal-banner { display:flex; flex-direction:column; }
 .personal-banner::after { display:none; }
 .banner-intro { position:relative; width:auto; max-width:630px; top:auto; left:auto; padding:28px 22px 25px; }
 .banner-intro h1 { font-size:40px; }
 .banner-intro .eyebrow { font-size:9px; }
 .intro-statement { font-size:19px; line-height:1.5; max-width:520px; }
 .personal-banner>img { width:100%; height:auto; }
 .strengths-bar { column-gap:15px; row-gap:8px; padding:18px 22px; }
 .strengths-bar li { font-size:9px; letter-spacing:.04em; }
 .strengths-bar li+li::before { display:none; }
 .career-highlights .metrics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 0; padding-block:32px; }
 .career-highlights .metrics>div { padding:0 22px; }
 .career-highlights .metrics>div:nth-child(odd) { padding-left:0; border-left:0; }
 .career-highlights .metric-value { font-size:54px; }
 .career-highlights .metric-value>span { font-size:21px; }
 .career-highlights .metrics p { margin-top:10px; font-size:19px; }
 .career-highlights .metrics p>span { font-size:16px; }
 .career-highlights .pipeline-note p { font-size:14px; }
 .portfolio-gallery { padding-top:36px; }
 .gallery-heading { display:block; margin-bottom:22px; }
 .gallery-heading>p { max-width:none; margin-top:15px; font-size:13px; }
 .portfolio-gallery .filter-bar { display:block; }
 .portfolio-gallery #project-count { display:block; margin-top:13px; }
 .render-collage { grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:clamp(86px,20vw,155px); gap:6px; margin-inline:8px; }
 .render-tile.tile-tall { grid-row:span 2; }
 .gallery-bottom { flex-wrap:wrap; justify-content:space-between; gap:16px; }
 .gallery-bottom p { width:100%; }
 .gallery-more { padding:13px 15px; font-size:11px; }
 .gallery-more>span { margin-left:12px; }
 .gallery-bottom .text-link { font-size:11px; gap:12px; }
 .hero-statement { font-size:clamp(39px,7.6vw,64px); }
 dialog.image-viewer { width:calc(100% - 12px); height:96dvh; max-height:96dvh; }
 dialog.image-viewer .dialog-top { padding:8px 12px; gap:12px; }
 dialog.image-viewer .dialog-top .eyebrow { font-size:9px; }
 dialog.image-viewer .viewer-controls { padding:8px 12px; }
 dialog.image-viewer .dialog-copy { padding:10px 12px 12px; }
}
@media(max-width:380px) {
 .banner-intro h1 { font-size:36px; }
 .intro-statement { font-size:17px; }
 .career-highlights .metric-value { font-size:45px; }
 .career-highlights .metric-value>span { font-size:18px; margin-left:6px; }
 .career-highlights .metrics>div { padding-right:0; }
 .career-highlights .metrics p { font-size:17px; }
 .career-highlights .metrics p>span { font-size:14px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.tile-caption,.render-tile button::after { transition:none; } }

/* Give the longer rendering count room without crowding adjacent callouts. */
.career-highlights .metric-value { white-space:nowrap; }
.career-highlights .metric-value.metric-total { font-size:clamp(32px,4.1vw,76px); }
@media(max-width:800px) { .career-highlights .metric-value.metric-total { font-size:clamp(34px,9.4vw,54px); } }