/* Quiet surfaces and one camera moving through a field of real work. */
.portfolio-home{overflow-x:clip}
.portfolio-home .hero h1{animation:home-enter 1000ms cubic-bezier(.16,1,.3,1) both}
.portfolio-home.motion-ready .hero-role{animation:home-enter 1000ms cubic-bezier(.16,1,.3,1) 100ms both}
.portfolio-home.motion-ready .hero-bio{animation:home-enter 1000ms cubic-bezier(.16,1,.3,1) 180ms both}
.portfolio-home .personal-intro h1>span{color:#c5adf4;background:none;-webkit-text-fill-color:currentColor}
@keyframes home-enter{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.spatial-reel{height:220svh;position:relative;background:var(--canvas)}
.reel-stage{position:sticky;top:0;height:100svh;overflow:hidden;perspective:1100px;perspective-origin:50% 50%;isolation:isolate;background:var(--canvas)}
.reel-copy{position:absolute;left:50%;top:50%;width:56%;transform:translate(-50%,-50%) scale(var(--reel-copy-scale,1));opacity:var(--reel-copy-opacity,1);z-index:2;text-align:center;pointer-events:none}
.reel-eyebrow{font-size:0.75rem;line-height:1.4;color:#918b9d;margin-bottom:22px;letter-spacing:.03em}
.reel-copy h2{font-size:var(--type-step-32-60);line-height:1.14;font-weight:450;letter-spacing:-.05em}
.reel-copy h2 span{display:block;color:#e9e5ef}.reel-copy h2 span+span{color:#a59bab}
.reel-card{position:absolute;left:var(--plane-x);top:var(--plane-y);width:var(--plane-width);transform:translate(-50%,-50%) translateZ(var(--plane-z,0px));opacity:var(--plane-opacity,1);display:block;z-index:1;outline-offset:5px}
.reel-card img{width:100%;height:auto;aspect-ratio:1.65;object-fit:cover;display:block;border-radius:8px;border:1px solid #ffffff12;box-shadow:none}
.reel-card>span{display:none}.reel-detail{pointer-events:none}
.reel-one{--plane-x:16%;--plane-y:22%;--plane-width:21%}
.reel-two{--plane-x:76%;--plane-y:15%;--plane-width:19%}
.reel-three{--plane-x:17%;--plane-y:78%;--plane-width:23%}
.reel-four{--plane-x:81%;--plane-y:75%;--plane-width:21%}
.reel-five{--plane-x:41%;--plane-y:6%;--plane-width:13%}
.reel-six{--plane-x:52%;--plane-y:90%;--plane-width:13%}
.portfolio-home .work-section{padding-top:96px;position:relative;background:var(--canvas)}
.portfolio-home .section-heading{align-items:end;margin-bottom:32px}.portfolio-home .section-heading h2{font-size:var(--type-step-32-44);letter-spacing:-.045em;font-weight:500}
.portfolio-home .section-meta{font-size:0.75rem;letter-spacing:.06em;color:#8f869b}
.portfolio-home .featured .project-visual{border:1px solid #ffffff12;transform:translateY(calc(24px * (1 - var(--feature-progress,1)))) scale(calc(.98 + .02 * var(--feature-progress,1)));transition:none}
.portfolio-home .featured .results dd{font-size:var(--type-step-28-40)}
/* Project browsing uses a single surface and a single link per card. */
.portfolio-home{--work-surface:#18161c;--work-surface-hover:#1d1a22;--work-line:rgba(244,241,248,.085);--work-muted:#aaa2b5;--work-subtle:#81798d}
.portfolio-home .slider-shell{margin-top:104px;padding-top:40px;border-top:1px solid var(--work-line);scroll-margin-top:112px}
.portfolio-home .slider-heading{margin-bottom:28px}
.portfolio-home .slider-heading h2{font-size:1.75rem;letter-spacing:-.04em;font-weight:500}
.portfolio-home .slider-controls{gap:8px}
.portfolio-home .slide-status{font-size:0.75rem;color:var(--work-subtle);margin-right:16px;font-variant-numeric:tabular-nums}
.portfolio-home .slide-button{width:44px;height:44px;border-color:var(--work-line);background:transparent;font-size:1.25rem;transition:background 180ms ease,border-color 180ms ease,transform 180ms ease}
.portfolio-home .slide-button:hover:not(:disabled){background:#ffffff08;border-color:#ffffff20}
.portfolio-home .slide-button:active:not(:disabled){transform:scale(.96)}
.portfolio-home .project-slider{gap:20px;padding-top:4px;padding-bottom:8px;scroll-padding-left:0}
.portfolio-home .project-slider>.work-card{flex:0 0 min(45vw,500px);border:1px solid var(--work-line);border-radius:16px;background:var(--work-surface);overflow:hidden;transition:border-color 220ms ease,background 220ms ease}
.portfolio-home .project-slider>.work-card:hover,.portfolio-home .project-slider>.work-card:focus-within{border-color:#ffffff24;background:var(--work-surface-hover)}
.work-link{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none;outline-offset:-5px;border-radius:inherit}
.work-card .project-info{padding:28px 28px 24px;min-height:176px}
.work-meta{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px}
.work-card .project-type{font-size:0.75rem;line-height:1.5;color:var(--work-muted);margin:0;font-weight:450}
.case-index{color:var(--work-subtle);font-size:0.75rem;line-height:1.5;font-variant-numeric:tabular-nums}
.portfolio-home .work-card .project-info h3{font-size:1.75rem;line-height:1.18;letter-spacing:-.045em;font-weight:500;margin:0}
.portfolio-home .work-card .project-description{font-size:0.875rem;line-height:1.55;color:var(--work-muted);max-width:38ch;margin-top:12px;text-wrap:pretty}
.portfolio-home .project-slider .work-card .work-preview{aspect-ratio:16/9;margin:0 16px;width:calc(100% - 32px);border-radius:8px;overflow:hidden;isolation:isolate;background:#eeecf0}
.portfolio-home .work-preview>img{display:block;width:100%;height:100%;object-fit:contain;transform:none;transition:transform 650ms cubic-bezier(.22,1,.36,1)}
.work-card-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 28px;color:var(--work-muted);font-size:0.75rem;font-weight:450;line-height:1.4}
.work-link:hover .work-card-footer,.work-link:focus-visible .work-card-footer{color:var(--ink)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){html.motion .work-link:hover .work-preview>img{transform:scale(1.018)}}
.portfolio-home .about{padding-block:104px}.portfolio-home .about-lead{font-size:var(--type-step-32-48);line-height:1.2;letter-spacing:-.045em;max-width:16ch}
.portfolio-home .contact{padding-block:88px;border-top:1px solid #ffffff14}
.portfolio-home .contact h2{font-size:var(--type-step-44-80);font-weight:450;letter-spacing:-.06em;line-height:1.08;margin-top:20px;max-width:11ch}
.portfolio-home .contact .button{border-radius:999px;padding:18px 26px}.portfolio-home .contact-links{margin-top:40px}
@media(max-width:900px){.reel-copy h2{font-size:2.5rem}.portfolio-home .project-slider>.work-card{flex-basis:56vw}}
@media(max-width:600px){
 .spatial-reel{height:175svh}.reel-stage{perspective:900px}.reel-copy{width:84%}.reel-copy h2{font-size:2rem}.reel-eyebrow{font-size:0.75rem;margin-bottom:16px}
 .reel-one{--plane-x:22%;--plane-y:25%;--plane-width:40%}.reel-two{--plane-x:78%;--plane-y:18%;--plane-width:40%}.reel-three{--plane-x:22%;--plane-y:78%;--plane-width:40%}.reel-four{--plane-x:78%;--plane-y:74%;--plane-width:40%}
 .reel-five,.reel-six{display:none}
 .portfolio-home .work-section{padding-top:56px}.portfolio-home .section-heading h2{font-size:2rem}.portfolio-home .section-meta{font-size:0.75rem;max-width:12ch;text-align:right}
 .portfolio-home .slider-shell{margin-top:64px;padding-top:28px}.portfolio-home .slider-heading h2{font-size:1.5rem}.portfolio-home .project-slider>.work-card{flex-basis:82vw;border-radius:14px}
 .work-card .project-info{padding:24px 24px 20px;min-height:168px}.work-meta{margin-bottom:14px}.portfolio-home .work-card .project-info h3{font-size:1.5rem}.portfolio-home .work-card .project-description{font-size:0.875rem}.portfolio-home .project-slider .work-card .work-preview{margin:0 12px;width:calc(100% - 24px);border-radius:6px}.work-card-footer{padding:18px 24px}.portfolio-home .slider-heading{margin-bottom:24px}
 .portfolio-home .about{padding-block:64px}.portfolio-home .about-lead{font-size:2rem}.portfolio-home .contact{padding-block:60px}.portfolio-home .contact h2{font-size:3rem}
}
@media(prefers-reduced-motion:reduce){.spatial-reel{height:100svh}.reel-stage{position:relative}.portfolio-home .hero h1,.portfolio-home.motion-ready .hero-role,.portfolio-home.motion-ready .hero-bio{animation:none}.portfolio-home .featured .project-visual{transform:none}}
html.no-motion .spatial-reel{height:100svh}html.no-motion .reel-stage{position:relative}html.no-motion .hero h1,html.no-motion .hero-role,html.no-motion .hero-bio{animation:none}


.reel-snapshot{aspect-ratio:1.5;padding:12%;border-radius:6px;border:1px solid #e69a4226;background:#211b16;color:#eddfcf}
.reel-snapshot>span{font-size:var(--type-step-12-12);letter-spacing:.08em;color:#a78b70;display:block;white-space:nowrap}.reel-snapshot strong{display:block;font-size:var(--type-step-28-60);font-weight:450;letter-spacing:-.065em;line-height:1.1;margin-top:12%}.reel-snapshot p{font-size:var(--type-step-12-12);color:#baa58f;margin-top:5%}.reel-snapshot i{display:block;height:2px;background:linear-gradient(90deg,#e0a15f 70%,#e0a15f18 70%);margin-top:15%;border-radius:1px}.loyalty-snapshot{background:#181d1b;border-color:#9cc6af22}.loyalty-snapshot>span,.loyalty-snapshot p{color:#90aa9c}.loyalty-snapshot i{background:linear-gradient(90deg,#b5cfbf 40%,#b5cfbf18 40%)}

/* Clear professional identity over a full-viewport interactive lattice. */
.portfolio-home .hero{background:var(--canvas);height:100dvh;min-height:620px;align-items:center}
.portfolio-home .hero-atmosphere{background:var(--canvas)}
.portfolio-home .hero #hero-canvas{inset:0;width:100%;height:100%;opacity:1;transform:none!important}
.portfolio-home .hero .personal-intro{width:min(1120px,calc(100% - 128px));max-width:1120px;margin-inline:auto;padding:40px 0 0;text-align:left}
.hero-person{font-size:1.5rem;color:#ddd5e7;margin:0 0 28px;letter-spacing:-.025em}
.portfolio-home .hero .personal-intro h1{font-size:var(--type-step-44-76);line-height:1.05;font-weight:500;letter-spacing:-.055em;max-width:900px;margin:0;animation:none}
.portfolio-home .hero .personal-intro h1 span{color:#c3a6ef}
.hero-experience{font-size:1.25rem;line-height:1.5;color:#e1d5ef;margin:28px 0 14px;letter-spacing:-.01em}
.hero-subtitle{max-width:620px;font-size:1.25rem;line-height:1.65;color:#aaa1b6;margin:0;text-wrap:pretty}
.portfolio-home .personal-intro .hero-bottom{justify-content:flex-start;margin-top:32px}
.portfolio-home .personal-intro .text-link{font-size:0.875rem;color:#e5d9f2;padding-bottom:6px;border-bottom:1px solid #b69af560}
.portfolio-home .about-body .about-role{font-size:0.875rem;line-height:1.6;color:#c8b6df;margin-bottom:24px}
@media(max-width:600px){.portfolio-home .hero{min-height:620px}.portfolio-home .hero .personal-intro{width:calc(100% - 48px);padding-top:48px}.hero-person{font-size:1.25rem;margin-bottom:24px}.portfolio-home .hero .personal-intro h1{font-size:var(--type-step-36-48)}.hero-experience{font-size:1rem;margin-top:24px}.hero-subtitle{font-size:1rem;line-height:1.65}}

/* Resume-sourced outcomes; all six surfaces carry the same visual weight. */
.reel-metric{--plane-width:20%;pointer-events:none}
.reel-metric.reel-one{--plane-x:17%;--plane-y:23%}.reel-metric.reel-two{--plane-x:83%;--plane-y:23%}
.reel-metric.reel-three{--plane-x:17%;--plane-y:77%}.reel-metric.reel-four{--plane-x:83%;--plane-y:77%}
.reel-metric.reel-five{--plane-x:50%;--plane-y:12%}.reel-metric.reel-six{--plane-x:50%;--plane-y:89%}
.impact-snapshot{padding:12%;border:1px solid #c3a6ef24;border-radius:10px;background:linear-gradient(145deg,#221c2a,#18151d);color:#eee7f6;aspect-ratio:1.3;display:flex;flex-direction:column;justify-content:center}
.impact-snapshot>span{font-size:var(--type-step-12-12);letter-spacing:.07em;color:#b8a7cc;line-height:1.5}
.impact-snapshot strong{display:block;font-size:var(--type-step-32-60);font-weight:450;letter-spacing:-.065em;line-height:1.08;margin:12% 0 8%}
.impact-snapshot p{font-size:var(--type-step-12-16);line-height:1.4;color:#e0d5eb;margin:0}
.impact-snapshot small{font-size:var(--type-step-12-12);line-height:1.5;color:#9f91ae;margin-top:7%}
@media(max-width:700px){.reel-metric{--plane-width:29%}.impact-snapshot{padding:10%;border-radius:6px}.impact-snapshot strong{font-size:var(--type-step-24-36)}.impact-snapshot>span{font-size:0.75rem}.impact-snapshot p{font-size:0.75rem}.impact-snapshot small{display:none}}

.reel-photons{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,transparent 20%,#32213e12 65%,transparent 90%)}
@media(prefers-reduced-motion:reduce){.reel-photons{display:none}}
html.no-motion .reel-photons{display:none}

/* Outcome categories share a structure, with restrained mineral tones. */
.reel-metric{--impact-rgb:186,151,239}
.reel-one{--impact-rgb:137,174,255}.reel-two{--impact-rgb:175,155,250}.reel-three{--impact-rgb:124,193,246}
.reel-four{--impact-rgb:146,151,250}.reel-five{--impact-rgb:199,145,248}.reel-six{--impact-rgb:183,159,239}
.impact-snapshot{background:linear-gradient(140deg,rgba(var(--impact-rgb),.14),rgba(var(--impact-rgb),.035) 75%),#151319;border-color:rgba(var(--impact-rgb),.22);box-shadow:inset 0 1px 0 rgba(var(--impact-rgb),.09)}
.impact-snapshot>span{color:rgba(var(--impact-rgb),.75);letter-spacing:.11em}
.impact-snapshot strong{color:rgb(var(--impact-rgb))}
.impact-snapshot small{color:#aaa0b4}

/* A little more separation inside the same blue-to-violet arc. */
.reel-one{--impact-wash:.16}.reel-two{--impact-wash:.12}.reel-three{--impact-wash:.18}.reel-four{--impact-wash:.13}.reel-five{--impact-wash:.18}.reel-six{--impact-wash:.11}
.impact-snapshot{background:linear-gradient(140deg,rgba(var(--impact-rgb),var(--impact-wash,.14)),rgba(var(--impact-rgb),.035) 85%),#151319;border-color:rgba(var(--impact-rgb),.27)}
.impact-snapshot>span{color:rgba(var(--impact-rgb),.9)}

/* Quiet nebula light behind the fixed star field and scroll-driven photons. */
.reel-photons{background:radial-gradient(ellipse at 16% 32%,#4569ab13,transparent 48%),radial-gradient(ellipse at 82% 64%,#7d4aa51a,transparent 48%),radial-gradient(ellipse at 50% 90%,#454ca514,transparent 50%)}