/* Local v18 review; the approved public version remains unchanged. */
.personal-intro{align-items:start}
.personal-intro-copy{padding-top:145px}
.intro-portrait{height:clamp(430px,32vw,500px);overflow:hidden;--portrait-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 700' preserveAspectRatio='none'%3E%3Cdefs%3E%3Cfilter id='s'%3E%3CfeGaussianBlur stdDeviation='24'/%3E%3C/filter%3E%3C/defs%3E%3Cpath fill='white' filter='url(%23s)' d='M-80-80H680V530C610 550 590 640 505 608S390 668 310 620 205 660 145 602 40 648-80 565Z'/%3E%3C/svg%3E");mask-image:var(--portrait-mask);-webkit-mask-image:var(--portrait-mask);mask-size:100% 100%;-webkit-mask-size:100% 100%}
.intro-portrait img{position:absolute;top:-5%;left:0;width:100%;height:125%;object-fit:contain;object-position:50% 0%;filter:none}
.intro-portrait:before{inset:4% -8% 0;background:radial-gradient(ellipse at 50% 48%,#c4ff0020,transparent 65%);opacity:.7}

/* Image and description travel together. The header stays out of their path. */
.journey-heading{max-width:280px}
.journey-heading h2{font-size:clamp(28px,2.3vw,38px);line-height:1.18;margin:20px 0 24px}
.journey-heading .button{font-size:11px;min-height:43px;padding:12px 18px;gap:28px}
.journey-card{grid-template-columns:minmax(0,1fr) 150px;gap:24px}
.journey-caption{padding-top:25px;gap:20px}
.journey-caption h3{font-size:clamp(25px,2vw,34px)}
.journey-caption p{margin:22px 0 0;line-height:1.65}
.journey-caption b{margin-top:6px}
.showcase-ready .journey-stage{padding:100px 4% 30px;min-height:650px}
.showcase-ready .journey-heading{max-width:280px;z-index:20;pointer-events:auto;width:max-content}
.showcase-ready .journey-card{--image-width:min(25vw,40svh);width:calc(var(--image-width) + 174px);grid-template-columns:var(--image-width) 150px;transform-origin:50% 50%}
.journey-visual,.showcase-ready .journey-card .journey-visual{aspect-ratio:2/3}
.journey-footer{font-size:10px}
.work-journey:not(.showcase-ready) .journey-caption{opacity:1!important}
.work-journey:not(.showcase-ready) .journey-card{pointer-events:auto!important}

/* A static fallback appears only if WebGL fails, never during a normal entry. */
.gallery-fallback{opacity:0;visibility:hidden}
.gallery-failed .gallery-fallback{opacity:1;visibility:visible}

/* Full-viewport light reaches the edge; artwork retains its own outer margins. */
.case-hero.wrap{width:100%;max-width:none;padding-inline:max(56px,calc((100% - 1600px)/2))}
.case-hero:before{inset:-145px 0 -50px;background:radial-gradient(ellipse at 100% 0%,#bded0026,transparent 65%)}
.case-cover{clip-path:inset(0 6% round 16px)}
.closing-link em:after{color:var(--lime)}

/* Independent float layers preserve the card reveal and hover interactions. */
.tools-label{grid-column:1/-1;margin-bottom:3px;color:var(--mute)}
.capability-cards{gap:32px;align-items:start}
.capability-float{min-width:0;translate:0 var(--card-drift,0px);animation:capability-drift 8s ease-in-out infinite alternate}
.capability-float:nth-child(even){animation-duration:10.5s;animation-delay:-4s}
.capability-cards .capability-float article{height:100%;transform:none;min-height:285px}
.capability-cards article>span img{width:26px;height:26px}
@keyframes capability-drift{from{transform:translateY(-4px)}to{transform:translateY(5px)}}

@media(max-width:1000px){
 .case-hero.wrap{padding-inline:36px}
 .showcase-ready .journey-card{--image-width:min(25vw,40svh);grid-template-columns:var(--image-width) 140px;width:calc(var(--image-width) + 164px)}
}
@media(max-width:760px){
 .personal-intro-copy{padding-top:0}
 .intro-portrait{height:420px;max-width:330px}
 .intro-portrait img{position:absolute;top:-5%;height:125%;object-fit:contain;object-position:50% 0%}
 .journey-stage{padding:75px 20px}
 .journey-heading h2,.showcase-ready .journey-heading h2{font-size:29px;line-height:1.17;margin:14px 0 18px}
 .journey-heading .button{min-height:44px;font-size:11px}
 .journey-card{grid-template-columns:1fr}
 .journey-caption{gap:5px;padding-top:14px}
 .journey-caption h3{font-size:26px;line-height:1.15}
 .journey-caption p{margin:0;font-size:12px;line-height:1.5}
 .journey-caption b{top:30px}
 .showcase-ready .journey-stage{padding:90px 20px 25px;min-height:650px}
 .showcase-ready .journey-card{width:min(62vw,280px,calc((100svh - 360px)*.666667));grid-template-columns:1fr}
 .showcase-ready .journey-footer{bottom:18px}
 .case-hero.wrap{padding-inline:20px}
 .case-cover{clip-path:inset(0 6% round 10px)}
 .capability-cards{gap:26px}
 .capability-cards .capability-float article{min-height:0}
}
@media(max-width:360px){.case-hero.wrap{padding-inline:16px}.showcase-ready .journey-heading h2{font-size:27px}}
@media(prefers-reduced-motion:reduce){.capability-float{animation:none;translate:none}}
.no-motion .capability-float{animation:none;translate:none}
@media print{.capability-float{animation:none;translate:none;transform:none!important}.case-hero.wrap{padding:0}}

/* v19: requested portrait, longer homepage captions, and screenshot reveals. */
.intro-portrait img{filter:grayscale(1) brightness(1.25);object-fit:cover}
.journey-card{grid-template-columns:minmax(0,1fr) 180px}
.showcase-ready .journey-card{width:calc(var(--image-width) + 204px);grid-template-columns:var(--image-width) 180px}
.case-detail-image img{will-change:clip-path}
@media(max-width:1000px){
 .showcase-ready .journey-card{width:calc(var(--image-width) + 184px);grid-template-columns:var(--image-width) 160px}
}
@media(max-width:760px){
 .journey-card{grid-template-columns:1fr}
 .showcase-ready .journey-card{width:min(78vw,320px);grid-template-columns:1fr}
 .showcase-ready .journey-visual{width:min(60vw,270px,calc((100svh - 500px)*.666667));margin-inline:auto}
 .showcase-ready .journey-caption{width:100%}
 .journey-caption p{font-size:12px;line-height:1.5}
}
@media(prefers-reduced-motion:reduce){.case-detail-image img{clip-path:none!important;will-change:auto}}
.no-motion .case-detail-image img{clip-path:none!important;will-change:auto}
@media print{.case-detail-image img{clip-path:none!important}}

/* A clear availability signal at the top of the résumé. */
.cv-hero>.section-label{align-items:center;flex-wrap:wrap;row-gap:14px}
.cv-availability{font-size:11px;line-height:1.5;text-transform:none;letter-spacing:.01em;gap:12px}
.cv-availability i{flex-shrink:0}
@media print{.cv-availability i{display:none}}

/* v21 mobile: larger project artwork and a single, useful line of context. */
.journey-copy-mobile{display:none}
@media screen and (max-width:760px){
 .journey-copy-full{display:none}
 .journey-copy-mobile{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .showcase-ready .journey-card{width:min(88vw,420px)}
 .showcase-ready .journey-card .journey-visual{width:100%;aspect-ratio:4/5;max-height:calc(100svh - 410px)}
 .journey-caption p{font-size:13px;line-height:1.5}
 /* Keep the glass appearance without repeatedly blurring a moving WebGL layer. */
 body[data-page=cv] .tech-stack>span,body[data-page=cv] .capability-cards article{backdrop-filter:none;-webkit-backdrop-filter:none;background:linear-gradient(135deg,#ffffff12,#ffffff05)}
 body[data-page=cv] .capability-float{animation:none;translate:none;transform:none}
}
@media screen and (max-width:760px) and (hover:none){
 .capability-cards article:hover{box-shadow:none}
}

/* v22: clear experience-card surfaces reveal the sculpture behind the timeline. */
body[data-page=cv] .career-card,body[data-page=cv] .career-active .career-card{background:linear-gradient(135deg,#ffffff0e,#ffffff04);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);box-shadow:inset 0 1px 0 #ffffff18,0 16px 36px #17171905}
body[data-page=cv].surface-dark .career-card{background:linear-gradient(135deg,#ffffff09,#ffffff02);box-shadow:inset 0 1px 0 #ffffff12,0 16px 36px #00000008}
@media screen and (max-width:760px){
 body[data-page=cv] .career-card,body[data-page=cv] .career-active .career-card{backdrop-filter:none;-webkit-backdrop-filter:none}
}
@media print{body[data-page=cv] .career-card{background:white!important;backdrop-filter:none;-webkit-backdrop-filter:none}}