.portfolio-hero{--hero-paper: #f6f0e6;position:relative;background:#171a17;color:var(--hero-paper)}.portfolio-grid{display:grid;gap:2.5rem;max-width:72rem;margin:auto;padding:3.5rem 1.25rem}.portfolio-intro{align-self:center;min-width:0}.portfolio-kicker{font-size:.875rem;font-weight:500;color:#b8d68c}.portfolio-title{margin-top:1.25rem;font-size:clamp(3rem,5vw,4.5rem);font-weight:500;line-height:1.04;letter-spacing:-.045em}.portfolio-title em{color:#b8d68c}.portfolio-lede{max-width:29rem;margin-top:1.5rem;font-size:1.125rem;line-height:1.65;color:#dedbd4}.portfolio-actions{display:flex;flex-wrap:wrap;align-items:center;gap:1.25rem;margin-top:1.75rem}.portfolio-primary{display:inline-flex;align-items:center;justify-content:center;gap:.65rem;border-radius:999px;background:var(--hero-paper);color:#171a17;padding:.95rem 1.35rem;font-weight:600;transition:background-color .18s ease}.portfolio-primary:hover{background:#b8d68c}.portfolio-primary svg{width:1rem;height:1rem;flex:none}.portfolio-hint{color:#dedbd4;font-size:.875rem}.portfolio-showcase{min-width:0;align-self:center}.stage-viewport{border:1px solid rgba(246,240,230,.2);border-radius:.35rem .35rem 0 0;background:#232720;overflow:hidden;box-shadow:0 1.5rem 4rem #00000030}.project-panel{display:grid;background:linear-gradient(145deg,color-mix(in srgb,var(--project-tint) 78%,#171a17 22%),#171a17 76%)}.project-panel[hidden]{display:none}.stage-topline{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.5rem 1rem;color:#f6f0e6;font-size:.75rem}.stage-topline a{display:inline-flex;align-items:center;min-height:2.75rem;gap:.3rem}.stage-topline a:hover{text-decoration:underline;text-underline-offset:.25rem}.project-frame{display:flex;align-items:center;justify-content:center;aspect-ratio:16 / 10;margin:0 1rem;overflow:hidden;background:#171a17}.project-frame img{display:block;width:100%;height:100%;object-fit:contain}.project-frame--tall img{width:auto;max-width:100%;border:.35rem solid #171a17;border-radius:1rem}.project-copy{display:grid;gap:.45rem;min-height:10rem;padding:1rem;color:#fff}.project-copy strong{font-family:var(--font-heading-stack);font-size:1.125rem;font-weight:600}.project-copy p{font-size:.75rem;line-height:1.5;color:#e3ddd9}.project-copy h2{margin-top:.2rem;font-size:clamp(1.4rem,2vw,1.75rem);font-weight:500;line-height:1.15}.project-copy>span{font-size:.875rem;line-height:1.5;color:#e3ddd9}.project-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid rgba(246,240,230,.2);border-top:0}.project-tabs button{display:flex;align-items:center;justify-content:center;min-width:0;min-height:3rem;padding:.6rem .3rem;border-right:1px solid rgba(246,240,230,.2);color:#dedbd4;font-size:.75rem;cursor:pointer}.project-tabs button:last-child{border-right:0}.project-tabs button:hover{background:#ffffff0d}.project-tabs button[aria-selected=true]{background:#b8d68c1f;color:#c5e69a}.project-tabs button span,.portfolio-seam-card{display:none}.portfolio-hero :focus-visible{outline:2px solid #c5e69a;outline-offset:3px}.project-panel.is-entering{animation:project-enter .25s ease-out}@keyframes project-enter{0%{opacity:.5}}@media(min-width:48rem){.portfolio-grid{padding:3.5rem 2rem}.project-copy{min-height:9rem}.project-tabs button{gap:.5rem;font-size:.875rem}.project-tabs button span{display:inline;font-family:var(--font-heading-stack)}}@media(min-width:64rem){.portfolio-grid{grid-template-columns:minmax(0,.95fr) minmax(0,1.35fr);gap:3rem;padding-block:2rem}.portfolio-title{font-size:clamp(3rem,5vw,4rem);white-space:nowrap}.portfolio-lede{font-size:1.0625rem}.portfolio-hint{display:none}.project-copy{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);align-content:center;column-gap:1rem;min-height:8rem}.project-copy strong{grid-column:1;grid-row:1}.project-copy p{grid-column:1;grid-row:2}.project-copy h2{grid-column:2;grid-row:1}.project-copy>span{grid-column:2;grid-row:2}}@media(max-width:30rem){.portfolio-title{font-size:clamp(2.8rem,12vw,3.5rem)}.portfolio-primary{width:100%;font-size:.875rem}.portfolio-hint{display:none}}@media(prefers-reduced-motion:reduce){.project-panel.is-entering{animation:none}.portfolio-primary{transition:none}}