:root{color-scheme:light;--bg:#fff;--fg:#111;--muted:#666;--line:#d7d7d7;--soft:#f5f5f5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}button:focus-visible,a:focus-visible{outline:2px solid #111;outline-offset:5px}.topbar{position:relative;z-index:5;display:flex;align-items:center;gap:3rem;padding:29px 4.3%;border-bottom:1px solid #ddd}.wordmark{font-size:30px;font-weight:800;letter-spacing:-.075em}.topbar nav{display:flex;gap:25px;margin-left:auto}.topbar nav a,.portfolio{font-size:12px;text-transform:lowercase}.scale-link{display:inline-block;transform-origin:left center;transition:transform .22s ease}.scale-link:hover{transform:scale(1.09)}.hero{min-height:78vh;padding:6vh 4.3% 5vh;display:flex;flex-direction:column;justify-content:space-between}.hero-meta,.hero-bottom{display:flex;justify-content:space-between;gap:20px;color:#666;font-size:11px;letter-spacing:.1em}.hero h1{font-size:clamp(5rem,13.7vw,14rem);font-weight:700;letter-spacing:-.092em;line-height:.83;margin:10vh 0;max-width:1100px}.hero .break{display:block}.hero-bottom p{margin:0}.section{border-top:1px solid var(--line);padding:92px 4.3% 110px}.two-col{display:grid;grid-template-columns:30% minmax(0,1fr);gap:4%}.eyebrow{font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:lowercase;margin:0}.section-body{max-width:790px}.prose{font-size:clamp(19px,2.2vw,29px);line-height:1.45;letter-spacing:-.025em}.prose p{margin:0 0 1.25em}.prose p:last-child{margin-bottom:0}.experience-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:48px}.experience-tags span{border:1px solid #ccc;border-radius:50px;padding:10px 15px;font-size:12px;color:#666}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:30px}.section-heading p,.source-note{font-size:12px;color:var(--muted)}.filter-row{display:flex;flex-wrap:wrap;gap:12px;margin:48px 0 20px}.filter{border:1px solid #bbb;border-radius:30px;padding:10px 17px;background:none;color:#666;cursor:pointer;font-size:12px;transition:background .2s,color .2s}.filter:hover,.filter.active{background:var(--fg);color:var(--bg)}.project{position:relative;border-top:1px solid #d7d7d7}.project:last-child{border-bottom:1px solid #d7d7d7}.project-main{display:grid;grid-template-columns:80px minmax(0,1fr) 160px 26px;align-items:center;gap:14px;width:100%;padding:26px 0;border:0;color:var(--fg);background:none;text-align:left;cursor:pointer}.project-year,.project-category,.project-count{color:#666;font-size:12px}.project-title{font-size:clamp(24px,3.4vw,48px);font-weight:600;line-height:1.1;letter-spacing:-.055em;display:inline-block;transform-origin:left center;transition:transform .25s ease}.project-main:hover .project-title,.project-main:focus-visible .project-title{transform:scale(1.045)}.project-plus{font-size:25px;font-weight:300;text-align:right;transition:transform .25s}.project.open .project-plus{transform:rotate(45deg)}.project-detail{display:none;padding:0 0 30px 94px}.project.open .project-detail{display:block}.project-detail h4{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#666;margin:8px 0 18px}.award-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 32px}.award-list li{border-top:1px solid #ddd;padding:12px 0;font-size:14px;line-height:1.5}.award-list strong{display:block;font-weight:500}.award-list span{color:#666}.credentials>div{padding:0 0 30px;margin-bottom:32px;border-bottom:1px solid #ddd}.credentials h3{font-size:clamp(22px,2.8vw,36px);letter-spacing:-.04em;margin:10px 0}.credentials p,.micro{color:#666;font-size:13px}.contact h2{font-size:clamp(80px,15vw,200px);line-height:.9;letter-spacing:-.09em;margin:70px 0}.contact-links{display:flex;gap:45px;font-size:19px}.footer-note{margin:140px 0 0;color:#777;font-size:11px}.source-note{margin-top:28px;max-width:650px;line-height:1.6}@media(max-width:750px){.topbar{gap:14px;padding:22px 5%;flex-wrap:wrap}.topbar nav{order:3;width:100%;justify-content:space-between;margin:0;gap:10px}.portfolio{margin-left:auto}.hero{padding:45px 5% 50px;min-height:62vh}.hero h1{font-size:clamp(62px,14vw,115px);margin:75px 0}.hero-meta{font-size:9px}.hero-bottom{font-size:10px}.section{padding:60px 5% 75px}.two-col{display:block}.two-col .eyebrow{margin-bottom:34px}.section-heading{display:block}.section-heading p{margin-top:20px}.project-main{grid-template-columns:48px minmax(0,1fr) 20px;gap:9px;padding:21px 0}.project-category{display:none}.project-title{font-size:clamp(23px,6vw,38px)}.project-detail{padding-left:0}.award-list{grid-template-columns:1fr}.contact h2{margin:60px 0}.contact-links{gap:28px}.footer-note{margin-top:100px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Scale only interactive elements; static copy stays still. */
@media (hover:hover) and (pointer:fine) {
  .project-main:hover .project-title, .project-main:focus-visible .project-title {transform:scale(1.025)}
  .technical-group summary:hover .technical-name, .technical-group summary:focus-visible .technical-name {transform:scale(1.025)}
  .filter:hover {transform:scale(1.025)}
}
.hero-name{font-weight:400!important;letter-spacing:-.078em!important;overflow-wrap:normal}
.hero-name strong{font-weight:900;letter-spacing:-.09em}
.technical{margin-top:75px;border-top:1px solid var(--line)}
.technical-heading{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:26px 0 30px}
.technical-heading h3{font-size:clamp(25px,3.3vw,44px);letter-spacing:-.055em;font-weight:600;margin:0}
.technical-heading p{font-size:12px;color:var(--muted);max-width:230px;line-height:1.5;margin:0}
.technical-group{border-top:1px solid var(--line)}
.technical-group:last-of-type{border-bottom:1px solid var(--line)}
.technical-group summary{list-style:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 24px;align-items:center;gap:20px;cursor:pointer;padding:25px 0}
.technical-group summary::-webkit-details-marker{display:none}
.technical-name{font-size:clamp(20px,2.5vw,32px);font-weight:600;letter-spacing:-.045em;line-height:1.1}
.technical-preview{font-size:12px;color:var(--muted);line-height:1.6}
.technical-icon{text-align:right;font-size:25px;font-weight:300;transition:transform .22s ease}
.technical-group[open] .technical-icon{transform:rotate(45deg)}
.technical-content{padding:5px 0 45px}
.technical-intro{max-width:580px;color:#555;font-size:15px;line-height:1.6;margin:0 0 32px}
.technical-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 35px}
.technical-items article{border-top:1px solid #ddd;padding-top:16px}
.technical-items h4{font-size:19px;letter-spacing:-.03em;margin:0 0 12px}
.technical-items p{font-size:14px;line-height:1.65;color:#555;margin:0 0 10px}
.technical-items strong{font-weight:600;color:var(--fg)}
.technical-heading h3:hover,.technical-heading p:hover,.technical-name:hover,.technical-preview:hover,.technical-intro:hover,.technical-items h4:hover,.technical-items p:hover{transform:scale(1.018)}.technical-group summary:hover .technical-name{transform:scale(1.025)}}
@media(max-width:750px){.technical{margin-top:50px}.technical-heading{display:block}.technical-heading p{margin-top:12px}.technical-group summary{grid-template-columns:minmax(0,1fr) 24px;gap:12px}.technical-preview{grid-column:1;grid-row:2}.technical-icon{grid-column:2;grid-row:1}.technical-items{grid-template-columns:1fr;gap:20px}}

@media (hover:hover) and (pointer:fine){.scale-link:hover{transform:scale(1.045)}}

/* Draft 05 — gentle text movement and soft liquid press on interactive elements */
.hero-name{font-weight:300!important}
.hero-name strong{font-weight:750;letter-spacing:-.075em;text-transform:none}
/* Text-only hover is restrained and never implies clickability. */
@media (hover:hover) and (pointer:fine){
  .prose p,.hero-meta span,.hero-bottom p,.eyebrow,.technical-heading h3,.technical-heading p,
  .technical-intro,.technical-items h4,.technical-items p,.experience-tags span,
  .credentials h3,.credentials p,.contact h2,.footer-note,.source-note,
  .project-detail h4,.award-list li,.section-heading p,.hero-name {
    transition:transform 300ms cubic-bezier(.2,.75,.2,1);
    transform-origin:left center;
  }
  .prose p:hover,.hero-meta span:hover,.hero-bottom p:hover,.eyebrow:hover,
  .technical-heading h3:hover,.technical-heading p:hover,.technical-intro:hover,
  .technical-items h4:hover,.technical-items p:hover,.experience-tags span:hover,
  .credentials h3:hover,.credentials p:hover,.contact h2:hover,.footer-note:hover,
  .source-note:hover,.project-detail h4:hover,.award-list li:hover,.section-heading p:hover,
  .hero-name:hover{transform:scale(1.012)}
}
/* Interactive elements use an elastic, liquid-like ease that stretches then settles. */
@keyframes liquidSettle {
  0%{transform:scale(1)}
  35%{transform:scale(1.052,.977)}
  65%{transform:scale(1.026,1.014)}
  100%{transform:scale(1.035)}
}
@media (hover:hover) and (pointer:fine){
  .scale-link:hover,.project-main:hover .project-title,
  .technical-group summary:hover .technical-name,.filter:hover{
    animation:liquidSettle 470ms cubic-bezier(.22,.8,.22,1) both;
  }
  .scale-link,.project-title,.technical-name,.filter{transform-origin:left center}
  .project-main:hover .project-title,.technical-group summary:hover .technical-name{
    transform:scale(1.035);
  }
}
/* A soft, rounded surface response reinforces which rows can be opened. */
.project-main,.technical-group summary{border-radius:12px;transition:background-color 260ms ease}
@media (hover:hover) and (pointer:fine){
  .project-main:hover,.technical-group summary:hover{background-color:rgba(0,0,0,.027)}
}
.project-main:focus-visible,.technical-group summary:focus-visible{outline:2px solid #111;outline-offset:3px}
@media(prefers-reduced-motion:reduce){
  .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{animation:none!important;transform:none!important}
}

:root{color-scheme:light;--bg:#fff;--fg:#111;--muted:#666;--line:#d7d7d7;--soft:#f5f5f5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}button:focus-visible,a:focus-visible{outline:2px solid #111;outline-offset:5px}.topbar{position:relative;z-index:5;display:flex;align-items:center;gap:3rem;padding:29px 4.3%;border-bottom:1px solid #ddd}.wordmark{font-size:30px;font-weight:800;letter-spacing:-.075em}.topbar nav{display:flex;gap:25px;margin-left:auto}.topbar nav a,.portfolio{font-size:12px;text-transform:lowercase}.scale-link{display:inline-block;transform-origin:left center;transition:transform .22s ease}.scale-link:hover{transform:scale(1.09)}.hero{min-height:78vh;padding:6vh 4.3% 5vh;display:flex;flex-direction:column;justify-content:space-between}.hero-meta,.hero-bottom{display:flex;justify-content:space-between;gap:20px;color:#666;font-size:11px;letter-spacing:.1em}.hero h1{font-size:clamp(5rem,13.7vw,14rem);font-weight:700;letter-spacing:-.092em;line-height:.83;margin:10vh 0;max-width:1100px}.hero .break{display:block}.hero-bottom p{margin:0}.section{border-top:1px solid var(--line);padding:92px 4.3% 110px}.two-col{display:grid;grid-template-columns:30% minmax(0,1fr);gap:4%}.eyebrow{font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:lowercase;margin:0}.section-body{max-width:790px}.prose{font-size:clamp(19px,2.2vw,29px);line-height:1.45;letter-spacing:-.025em}.prose p{margin:0 0 1.25em}.prose p:last-child{margin-bottom:0}.experience-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:48px}.experience-tags span{border:1px solid #ccc;border-radius:50px;padding:10px 15px;font-size:12px;color:#666}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:30px}.section-heading p,.source-note{font-size:12px;color:var(--muted)}.filter-row{display:flex;flex-wrap:wrap;gap:12px;margin:48px 0 20px}.filter{border:1px solid #bbb;border-radius:30px;padding:10px 17px;background:none;color:#666;cursor:pointer;font-size:12px;transition:background .2s,color .2s}.filter:hover,.filter.active{background:var(--fg);color:var(--bg)}.project{position:relative;border-top:1px solid #d7d7d7}.project:last-child{border-bottom:1px solid #d7d7d7}.project-main{display:grid;grid-template-columns:80px minmax(0,1fr) 160px 26px;align-items:center;gap:14px;width:100%;padding:26px 0;border:0;color:var(--fg);background:none;text-align:left;cursor:pointer}.project-year,.project-category,.project-count{color:#666;font-size:12px}.project-title{font-size:clamp(24px,3.4vw,48px);font-weight:600;line-height:1.1;letter-spacing:-.055em;display:inline-block;transform-origin:left center;transition:transform .25s ease}.project-main:hover .project-title,.project-main:focus-visible .project-title{transform:scale(1.045)}.project-plus{font-size:25px;font-weight:300;text-align:right;transition:transform .25s}.project.open .project-plus{transform:rotate(45deg)}.project-detail{display:none;padding:0 0 30px 94px}.project.open .project-detail{display:block}.project-detail h4{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#666;margin:8px 0 18px}.award-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 32px}.award-list li{border-top:1px solid #ddd;padding:12px 0;font-size:14px;line-height:1.5}.award-list strong{display:block;font-weight:500}.award-list span{color:#666}.credentials>div{padding:0 0 30px;margin-bottom:32px;border-bottom:1px solid #ddd}.credentials h3{font-size:clamp(22px,2.8vw,36px);letter-spacing:-.04em;margin:10px 0}.credentials p,.micro{color:#666;font-size:13px}.contact h2{font-size:clamp(80px,15vw,200px);line-height:.9;letter-spacing:-.09em;margin:70px 0}.contact-links{display:flex;gap:45px;font-size:19px}.footer-note{margin:140px 0 0;color:#777;font-size:11px}.source-note{margin-top:28px;max-width:650px;line-height:1.6}@media(max-width:750px){.topbar{gap:14px;padding:22px 5%;flex-wrap:wrap}.topbar nav{order:3;width:100%;justify-content:space-between;margin:0;gap:10px}.portfolio{margin-left:auto}.hero{padding:45px 5% 50px;min-height:62vh}.hero h1{font-size:clamp(62px,14vw,115px);margin:75px 0}.hero-meta{font-size:9px}.hero-bottom{font-size:10px}.section{padding:60px 5% 75px}.two-col{display:block}.two-col .eyebrow{margin-bottom:34px}.section-heading{display:block}.section-heading p{margin-top:20px}.project-main{grid-template-columns:48px minmax(0,1fr) 20px;gap:9px;padding:21px 0}.project-category{display:none}.project-title{font-size:clamp(23px,6vw,38px)}.project-detail{padding-left:0}.award-list{grid-template-columns:1fr}.contact h2{margin:60px 0}.contact-links{gap:28px}.footer-note{margin-top:100px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Scale only interactive elements; static copy stays still. */
@media (hover:hover) and (pointer:fine) {
  .project-main:hover .project-title, .project-main:focus-visible .project-title {transform:scale(1.025)}
  .technical-group summary:hover .technical-name, .technical-group summary:focus-visible .technical-name {transform:scale(1.025)}
  .filter:hover {transform:scale(1.025)}
}
.hero-name{font-weight:400!important;letter-spacing:-.078em!important;overflow-wrap:normal}
.hero-name strong{font-weight:900;letter-spacing:-.09em}
.technical{margin-top:75px;border-top:1px solid var(--line)}
.technical-heading{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:26px 0 30px}
.technical-heading h3{font-size:clamp(25px,3.3vw,44px);letter-spacing:-.055em;font-weight:600;margin:0}
.technical-heading p{font-size:12px;color:var(--muted);max-width:230px;line-height:1.5;margin:0}
.technical-group{border-top:1px solid var(--line)}
.technical-group:last-of-type{border-bottom:1px solid var(--line)}
.technical-group summary{list-style:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 24px;align-items:center;gap:20px;cursor:pointer;padding:25px 0}
.technical-group summary::-webkit-details-marker{display:none}
.technical-name{font-size:clamp(20px,2.5vw,32px);font-weight:600;letter-spacing:-.045em;line-height:1.1}
.technical-preview{font-size:12px;color:var(--muted);line-height:1.6}
.technical-icon{text-align:right;font-size:25px;font-weight:300;transition:transform .22s ease}
.technical-group[open] .technical-icon{transform:rotate(45deg)}
.technical-content{padding:5px 0 45px}
.technical-intro{max-width:580px;color:#555;font-size:15px;line-height:1.6;margin:0 0 32px}
.technical-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 35px}
.technical-items article{border-top:1px solid #ddd;padding-top:16px}
.technical-items h4{font-size:19px;letter-spacing:-.03em;margin:0 0 12px}
.technical-items p{font-size:14px;line-height:1.65;color:#555;margin:0 0 10px}
.technical-items strong{font-weight:600;color:var(--fg)}
.technical-heading h3:hover,.technical-heading p:hover,.technical-name:hover,.technical-preview:hover,.technical-intro:hover,.technical-items h4:hover,.technical-items p:hover{transform:scale(1.018)}.technical-group summary:hover .technical-name{transform:scale(1.025)}}
@media(max-width:750px){.technical{margin-top:50px}.technical-heading{display:block}.technical-heading p{margin-top:12px}.technical-group summary{grid-template-columns:minmax(0,1fr) 24px;gap:12px}.technical-preview{grid-column:1;grid-row:2}.technical-icon{grid-column:2;grid-row:1}.technical-items{grid-template-columns:1fr;gap:20px}}

@media (hover:hover) and (pointer:fine){.scale-link:hover{transform:scale(1.045)}}

/* Draft 05 — gentle text movement and soft liquid press on interactive elements */
.hero-name{font-weight:300!important}
.hero-name strong{font-weight:750;letter-spacing:-.075em;text-transform:none}
/* Text-only hover is restrained and never implies clickability. */
@media (hover:hover) and (pointer:fine){
  .prose p,.hero-meta span,.hero-bottom p,.eyebrow,.technical-heading h3,.technical-heading p,
  .technical-intro,.technical-items h4,.technical-items p,.experience-tags span,
  .credentials h3,.credentials p,.contact h2,.footer-note,.source-note,
  .project-detail h4,.award-list li,.section-heading p,.hero-name {
    transition:transform 300ms cubic-bezier(.2,.75,.2,1);
    transform-origin:left center;
  }
  .prose p:hover,.hero-meta span:hover,.hero-bottom p:hover,.eyebrow:hover,
  .technical-heading h3:hover,.technical-heading p:hover,.technical-intro:hover,
  .technical-items h4:hover,.technical-items p:hover,.experience-tags span:hover,
  .credentials h3:hover,.credentials p:hover,.contact h2:hover,.footer-note:hover,
  .source-note:hover,.project-detail h4:hover,.award-list li:hover,.section-heading p:hover,
  .hero-name:hover{transform:scale(1.012)}
}
/* Interactive elements use an elastic, liquid-like ease that stretches then settles. */
@keyframes liquidSettle {
  0%{transform:scale(1)}
  35%{transform:scale(1.052,.977)}
  65%{transform:scale(1.026,1.014)}
  100%{transform:scale(1.035)}
}
@media (hover:hover) and (pointer:fine){
  .scale-link:hover,.project-main:hover .project-title,
  .technical-group summary:hover .technical-name,.filter:hover{
    animation:liquidSettle 470ms cubic-bezier(.22,.8,.22,1) both;
  }
  .scale-link,.project-title,.technical-name,.filter{transform-origin:left center}
  .project-main:hover .project-title,.technical-group summary:hover .technical-name{
    transform:scale(1.035);
  }
}
/* A soft, rounded surface response reinforces which rows can be opened. */
.project-main,.technical-group summary{border-radius:12px;transition:background-color 260ms ease}
@media (hover:hover) and (pointer:fine){
  .project-main:hover,.technical-group summary:hover{background-color:rgba(0,0,0,.027)}
}
.project-main:focus-visible,.technical-group summary:focus-visible{outline:2px solid #111;outline-offset:3px}
@media(prefers-reduced-motion:reduce){
  .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{animation:none!important;transform:none!important}
}

/* Draft 06: restrained title, clear award names and iridescent hover. */
.hero h1.hero-name{font-size:clamp(54px,10vw,140px);line-height:.92;margin:65px 0;letter-spacing:-.065em!important}
.award-list li strong{color:#171717;font-weight:600}
.award-list li span{color:#444}
@keyframes rainbowShimmer{
  0%,100%{color:inherit}
  15%{color:#92345d}
  30%{color:#895122}
  45%{color:#657020}
  60%{color:#207065}
  75%{color:#355ca0}
  90%{color:#75449a}
}
@media (hover:hover) and (pointer:fine){
 .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{
  animation:liquidSettle 470ms cubic-bezier(.22,.8,.22,1) both, rainbowShimmer 1600ms ease-in-out 1;
 }
 .project-main:hover,.technical-group summary:hover{
  background-image:linear-gradient(110deg,rgba(215,93,155,.055),rgba(225,182,85,.055),rgba(79,185,163,.055),rgba(100,129,215,.07),rgba(167,103,209,.055));
 }
 .filter:hover{background:#f5f5f5;color:#171717}
}
@media(prefers-reduced-motion:reduce){
 .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{animation:none!important}
}

:root{color-scheme:light;--bg:#fff;--fg:#111;--muted:#666;--line:#d7d7d7;--soft:#f5f5f5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}button:focus-visible,a:focus-visible{outline:2px solid #111;outline-offset:5px}.topbar{position:relative;z-index:5;display:flex;align-items:center;gap:3rem;padding:29px 4.3%;border-bottom:1px solid #ddd}.wordmark{font-size:30px;font-weight:800;letter-spacing:-.075em}.topbar nav{display:flex;gap:25px;margin-left:auto}.topbar nav a,.portfolio{font-size:12px;text-transform:lowercase}.scale-link{display:inline-block;transform-origin:left center;transition:transform .22s ease}.scale-link:hover{transform:scale(1.09)}.hero{min-height:78vh;padding:6vh 4.3% 5vh;display:flex;flex-direction:column;justify-content:space-between}.hero-meta,.hero-bottom{display:flex;justify-content:space-between;gap:20px;color:#666;font-size:11px;letter-spacing:.1em}.hero h1{font-size:clamp(5rem,13.7vw,14rem);font-weight:700;letter-spacing:-.092em;line-height:.83;margin:10vh 0;max-width:1100px}.hero .break{display:block}.hero-bottom p{margin:0}.section{border-top:1px solid var(--line);padding:92px 4.3% 110px}.two-col{display:grid;grid-template-columns:30% minmax(0,1fr);gap:4%}.eyebrow{font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:lowercase;margin:0}.section-body{max-width:790px}.prose{font-size:clamp(19px,2.2vw,29px);line-height:1.45;letter-spacing:-.025em}.prose p{margin:0 0 1.25em}.prose p:last-child{margin-bottom:0}.experience-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:48px}.experience-tags span{border:1px solid #ccc;border-radius:50px;padding:10px 15px;font-size:12px;color:#666}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:30px}.section-heading p,.source-note{font-size:12px;color:var(--muted)}.filter-row{display:flex;flex-wrap:wrap;gap:12px;margin:48px 0 20px}.filter{border:1px solid #bbb;border-radius:30px;padding:10px 17px;background:none;color:#666;cursor:pointer;font-size:12px;transition:background .2s,color .2s}.filter:hover,.filter.active{background:var(--fg);color:var(--bg)}.project{position:relative;border-top:1px solid #d7d7d7}.project:last-child{border-bottom:1px solid #d7d7d7}.project-main{display:grid;grid-template-columns:80px minmax(0,1fr) 160px 26px;align-items:center;gap:14px;width:100%;padding:26px 0;border:0;color:var(--fg);background:none;text-align:left;cursor:pointer}.project-year,.project-category,.project-count{color:#666;font-size:12px}.project-title{font-size:clamp(24px,3.4vw,48px);font-weight:600;line-height:1.1;letter-spacing:-.055em;display:inline-block;transform-origin:left center;transition:transform .25s ease}.project-main:hover .project-title,.project-main:focus-visible .project-title{transform:scale(1.045)}.project-plus{font-size:25px;font-weight:300;text-align:right;transition:transform .25s}.project.open .project-plus{transform:rotate(45deg)}.project-detail{display:none;padding:0 0 30px 94px}.project.open .project-detail{display:block}.project-detail h4{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#666;margin:8px 0 18px}.award-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 32px}.award-list li{border-top:1px solid #ddd;padding:12px 0;font-size:14px;line-height:1.5}.award-list strong{display:block;font-weight:500}.award-list span{color:#666}.credentials>div{padding:0 0 30px;margin-bottom:32px;border-bottom:1px solid #ddd}.credentials h3{font-size:clamp(22px,2.8vw,36px);letter-spacing:-.04em;margin:10px 0}.credentials p,.micro{color:#666;font-size:13px}.contact h2{font-size:clamp(80px,15vw,200px);line-height:.9;letter-spacing:-.09em;margin:70px 0}.contact-links{display:flex;gap:45px;font-size:19px}.footer-note{margin:140px 0 0;color:#777;font-size:11px}.source-note{margin-top:28px;max-width:650px;line-height:1.6}@media(max-width:750px){.topbar{gap:14px;padding:22px 5%;flex-wrap:wrap}.topbar nav{order:3;width:100%;justify-content:space-between;margin:0;gap:10px}.portfolio{margin-left:auto}.hero{padding:45px 5% 50px;min-height:62vh}.hero h1{font-size:clamp(62px,14vw,115px);margin:75px 0}.hero-meta{font-size:9px}.hero-bottom{font-size:10px}.section{padding:60px 5% 75px}.two-col{display:block}.two-col .eyebrow{margin-bottom:34px}.section-heading{display:block}.section-heading p{margin-top:20px}.project-main{grid-template-columns:48px minmax(0,1fr) 20px;gap:9px;padding:21px 0}.project-category{display:none}.project-title{font-size:clamp(23px,6vw,38px)}.project-detail{padding-left:0}.award-list{grid-template-columns:1fr}.contact h2{margin:60px 0}.contact-links{gap:28px}.footer-note{margin-top:100px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Scale only interactive elements; static copy stays still. */
@media (hover:hover) and (pointer:fine) {
  .project-main:hover .project-title, .project-main:focus-visible .project-title {transform:scale(1.025)}
  .technical-group summary:hover .technical-name, .technical-group summary:focus-visible .technical-name {transform:scale(1.025)}
  .filter:hover {transform:scale(1.025)}
}
.hero-name{font-weight:400!important;letter-spacing:-.078em!important;overflow-wrap:normal}
.hero-name strong{font-weight:900;letter-spacing:-.09em}
.technical{margin-top:75px;border-top:1px solid var(--line)}
.technical-heading{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:26px 0 30px}
.technical-heading h3{font-size:clamp(25px,3.3vw,44px);letter-spacing:-.055em;font-weight:600;margin:0}
.technical-heading p{font-size:12px;color:var(--muted);max-width:230px;line-height:1.5;margin:0}
.technical-group{border-top:1px solid var(--line)}
.technical-group:last-of-type{border-bottom:1px solid var(--line)}
.technical-group summary{list-style:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 24px;align-items:center;gap:20px;cursor:pointer;padding:25px 0}
.technical-group summary::-webkit-details-marker{display:none}
.technical-name{font-size:clamp(20px,2.5vw,32px);font-weight:600;letter-spacing:-.045em;line-height:1.1}
.technical-preview{font-size:12px;color:var(--muted);line-height:1.6}
.technical-icon{text-align:right;font-size:25px;font-weight:300;transition:transform .22s ease}
.technical-group[open] .technical-icon{transform:rotate(45deg)}
.technical-content{padding:5px 0 45px}
.technical-intro{max-width:580px;color:#555;font-size:15px;line-height:1.6;margin:0 0 32px}
.technical-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 35px}
.technical-items article{border-top:1px solid #ddd;padding-top:16px}
.technical-items h4{font-size:19px;letter-spacing:-.03em;margin:0 0 12px}
.technical-items p{font-size:14px;line-height:1.65;color:#555;margin:0 0 10px}
.technical-items strong{font-weight:600;color:var(--fg)}
.technical-heading h3:hover,.technical-heading p:hover,.technical-name:hover,.technical-preview:hover,.technical-intro:hover,.technical-items h4:hover,.technical-items p:hover{transform:scale(1.018)}.technical-group summary:hover .technical-name{transform:scale(1.025)}}
@media(max-width:750px){.technical{margin-top:50px}.technical-heading{display:block}.technical-heading p{margin-top:12px}.technical-group summary{grid-template-columns:minmax(0,1fr) 24px;gap:12px}.technical-preview{grid-column:1;grid-row:2}.technical-icon{grid-column:2;grid-row:1}.technical-items{grid-template-columns:1fr;gap:20px}}

@media (hover:hover) and (pointer:fine){.scale-link:hover{transform:scale(1.045)}}

/* Draft 05 — gentle text movement and soft liquid press on interactive elements */
.hero-name{font-weight:300!important}
.hero-name strong{font-weight:750;letter-spacing:-.075em;text-transform:none}
/* Text-only hover is restrained and never implies clickability. */
@media (hover:hover) and (pointer:fine){
  .prose p,.hero-meta span,.hero-bottom p,.eyebrow,.technical-heading h3,.technical-heading p,
  .technical-intro,.technical-items h4,.technical-items p,.experience-tags span,
  .credentials h3,.credentials p,.contact h2,.footer-note,.source-note,
  .project-detail h4,.award-list li,.section-heading p,.hero-name {
    transition:transform 300ms cubic-bezier(.2,.75,.2,1);
    transform-origin:left center;
  }
  .prose p:hover,.hero-meta span:hover,.hero-bottom p:hover,.eyebrow:hover,
  .technical-heading h3:hover,.technical-heading p:hover,.technical-intro:hover,
  .technical-items h4:hover,.technical-items p:hover,.experience-tags span:hover,
  .credentials h3:hover,.credentials p:hover,.contact h2:hover,.footer-note:hover,
  .source-note:hover,.project-detail h4:hover,.award-list li:hover,.section-heading p:hover,
  .hero-name:hover{transform:scale(1.012)}
}
/* Interactive elements use an elastic, liquid-like ease that stretches then settles. */
@keyframes liquidSettle {
  0%{transform:scale(1)}
  35%{transform:scale(1.052,.977)}
  65%{transform:scale(1.026,1.014)}
  100%{transform:scale(1.035)}
}
@media (hover:hover) and (pointer:fine){
  .scale-link:hover,.project-main:hover .project-title,
  .technical-group summary:hover .technical-name,.filter:hover{
    animation:liquidSettle 470ms cubic-bezier(.22,.8,.22,1) both;
  }
  .scale-link,.project-title,.technical-name,.filter{transform-origin:left center}
  .project-main:hover .project-title,.technical-group summary:hover .technical-name{
    transform:scale(1.035);
  }
}
/* A soft, rounded surface response reinforces which rows can be opened. */
.project-main,.technical-group summary{border-radius:12px;transition:background-color 260ms ease}
@media (hover:hover) and (pointer:fine){
  .project-main:hover,.technical-group summary:hover{background-color:rgba(0,0,0,.027)}
}
.project-main:focus-visible,.technical-group summary:focus-visible{outline:2px solid #111;outline-offset:3px}
@media(prefers-reduced-motion:reduce){
  .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{animation:none!important;transform:none!important}
}

/* Draft 07 */
.project-category,.project-detail h4{font-variant-caps:all-small-caps;letter-spacing:.045em}
@keyframes liquidCycle{
  0%,100%{transform:scale(1)}
  22%{transform:scale(1.052,.977)}
  45%{transform:scale(1.026,1.014)}
  65%{transform:scale(1.035)}
}
@media (hover:hover) and (pointer:fine){
 .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{
  animation:liquidCycle 1800ms cubic-bezier(.22,.8,.22,1) infinite,rainbowShimmer 3200ms linear infinite;
 }
 .scale-link.hover-clicked:hover,.project-main.hover-clicked:hover .project-title,.technical-group summary.hover-clicked:hover .technical-name,.filter.hover-clicked:hover{animation:none;transform:scale(1)}
}

:root{color-scheme:light;--bg:#fff;--fg:#111;--muted:#666;--line:#d7d7d7;--soft:#f5f5f5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}button:focus-visible,a:focus-visible{outline:2px solid #111;outline-offset:5px}.topbar{position:relative;z-index:5;display:flex;align-items:center;gap:3rem;padding:29px 4.3%;border-bottom:1px solid #ddd}.wordmark{font-size:30px;font-weight:800;letter-spacing:-.075em}.topbar nav{display:flex;gap:25px;margin-left:auto}.topbar nav a,.portfolio{font-size:12px;text-transform:lowercase}.scale-link{display:inline-block;transform-origin:left center;transition:transform .22s ease}.scale-link:hover{transform:scale(1.09)}.hero{min-height:78vh;padding:6vh 4.3% 5vh;display:flex;flex-direction:column;justify-content:space-between}.hero-meta,.hero-bottom{display:flex;justify-content:space-between;gap:20px;color:#666;font-size:11px;letter-spacing:.1em}.hero h1{font-size:clamp(5rem,13.7vw,14rem);font-weight:700;letter-spacing:-.092em;line-height:.83;margin:10vh 0;max-width:1100px}.hero .break{display:block}.hero-bottom p{margin:0}.section{border-top:1px solid var(--line);padding:92px 4.3% 110px}.two-col{display:grid;grid-template-columns:30% minmax(0,1fr);gap:4%}.eyebrow{font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:lowercase;margin:0}.section-body{max-width:790px}.prose{font-size:clamp(19px,2.2vw,29px);line-height:1.45;letter-spacing:-.025em}.prose p{margin:0 0 1.25em}.prose p:last-child{margin-bottom:0}.experience-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:48px}.experience-tags span{border:1px solid #ccc;border-radius:50px;padding:10px 15px;font-size:12px;color:#666}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:30px}.section-heading p,.source-note{font-size:12px;color:var(--muted)}.filter-row{display:flex;flex-wrap:wrap;gap:12px;margin:48px 0 20px}.filter{border:1px solid #bbb;border-radius:30px;padding:10px 17px;background:none;color:#666;cursor:pointer;font-size:12px;transition:background .2s,color .2s}.filter:hover,.filter.active{background:var(--fg);color:var(--bg)}.project{position:relative;border-top:1px solid #d7d7d7}.project:last-child{border-bottom:1px solid #d7d7d7}.project-main{display:grid;grid-template-columns:80px minmax(0,1fr) 160px 26px;align-items:center;gap:14px;width:100%;padding:26px 0;border:0;color:var(--fg);background:none;text-align:left;cursor:pointer}.project-year,.project-category,.project-count{color:#666;font-size:12px}.project-title{font-size:clamp(24px,3.4vw,48px);font-weight:600;line-height:1.1;letter-spacing:-.055em;display:inline-block;transform-origin:left center;transition:transform .25s ease}.project-main:hover .project-title,.project-main:focus-visible .project-title{transform:scale(1.045)}.project-plus{font-size:25px;font-weight:300;text-align:right;transition:transform .25s}.project.open .project-plus{transform:rotate(45deg)}.project-detail{display:none;padding:0 0 30px 94px}.project.open .project-detail{display:block}.project-detail h4{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#666;margin:8px 0 18px}.award-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 32px}.award-list li{border-top:1px solid #ddd;padding:12px 0;font-size:14px;line-height:1.5}.award-list strong{display:block;font-weight:500}.award-list span{color:#666}.credentials>div{padding:0 0 30px;margin-bottom:32px;border-bottom:1px solid #ddd}.credentials h3{font-size:clamp(22px,2.8vw,36px);letter-spacing:-.04em;margin:10px 0}.credentials p,.micro{color:#666;font-size:13px}.contact h2{font-size:clamp(80px,15vw,200px);line-height:.9;letter-spacing:-.09em;margin:70px 0}.contact-links{display:flex;gap:45px;font-size:19px}.footer-note{margin:140px 0 0;color:#777;font-size:11px}.source-note{margin-top:28px;max-width:650px;line-height:1.6}@media(max-width:750px){.topbar{gap:14px;padding:22px 5%;flex-wrap:wrap}.topbar nav{order:3;width:100%;justify-content:space-between;margin:0;gap:10px}.portfolio{margin-left:auto}.hero{padding:45px 5% 50px;min-height:62vh}.hero h1{font-size:clamp(62px,14vw,115px);margin:75px 0}.hero-meta{font-size:9px}.hero-bottom{font-size:10px}.section{padding:60px 5% 75px}.two-col{display:block}.two-col .eyebrow{margin-bottom:34px}.section-heading{display:block}.section-heading p{margin-top:20px}.project-main{grid-template-columns:48px minmax(0,1fr) 20px;gap:9px;padding:21px 0}.project-category{display:none}.project-title{font-size:clamp(23px,6vw,38px)}.project-detail{padding-left:0}.award-list{grid-template-columns:1fr}.contact h2{margin:60px 0}.contact-links{gap:28px}.footer-note{margin-top:100px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Scale only interactive elements; static copy stays still. */
@media (hover:hover) and (pointer:fine) {
  .project-main:hover .project-title, .project-main:focus-visible .project-title {transform:scale(1.025)}
  .technical-group summary:hover .technical-name, .technical-group summary:focus-visible .technical-name {transform:scale(1.025)}
  .filter:hover {transform:scale(1.025)}
}
.hero-name{font-weight:400!important;letter-spacing:-.078em!important;overflow-wrap:normal}
.hero-name strong{font-weight:900;letter-spacing:-.09em}
.technical{margin-top:75px;border-top:1px solid var(--line)}
.technical-heading{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:26px 0 30px}
.technical-heading h3{font-size:clamp(25px,3.3vw,44px);letter-spacing:-.055em;font-weight:600;margin:0}
.technical-heading p{font-size:12px;color:var(--muted);max-width:230px;line-height:1.5;margin:0}
.technical-group{border-top:1px solid var(--line)}
.technical-group:last-of-type{border-bottom:1px solid var(--line)}
.technical-group summary{list-style:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 24px;align-items:center;gap:20px;cursor:pointer;padding:25px 0}
.technical-group summary::-webkit-details-marker{display:none}
.technical-name{font-size:clamp(20px,2.5vw,32px);font-weight:600;letter-spacing:-.045em;line-height:1.1}
.technical-preview{font-size:12px;color:var(--muted);line-height:1.6}
.technical-icon{text-align:right;font-size:25px;font-weight:300;transition:transform .22s ease}
.technical-group[open] .technical-icon{transform:rotate(45deg)}
.technical-content{padding:5px 0 45px}
.technical-intro{max-width:580px;color:#555;font-size:15px;line-height:1.6;margin:0 0 32px}
.technical-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 35px}
.technical-items article{border-top:1px solid #ddd;padding-top:16px}
.technical-items h4{font-size:19px;letter-spacing:-.03em;margin:0 0 12px}
.technical-items p{font-size:14px;line-height:1.65;color:#555;margin:0 0 10px}
.technical-items strong{font-weight:600;color:var(--fg)}
.technical-heading h3:hover,.technical-heading p:hover,.technical-name:hover,.technical-preview:hover,.technical-intro:hover,.technical-items h4:hover,.technical-items p:hover{transform:scale(1.018)}.technical-group summary:hover .technical-name{transform:scale(1.025)}}
@media(max-width:750px){.technical{margin-top:50px}.technical-heading{display:block}.technical-heading p{margin-top:12px}.technical-group summary{grid-template-columns:minmax(0,1fr) 24px;gap:12px}.technical-preview{grid-column:1;grid-row:2}.technical-icon{grid-column:2;grid-row:1}.technical-items{grid-template-columns:1fr;gap:20px}}

@media (hover:hover) and (pointer:fine){.scale-link:hover{transform:scale(1.045)}}

/* Draft 05 — gentle text movement and soft liquid press on interactive elements */
.hero-name{font-weight:300!important}
.hero-name strong{font-weight:750;letter-spacing:-.075em;text-transform:none}
/* Text-only hover is restrained and never implies clickability. */
@media (hover:hover) and (pointer:fine){
  .prose p,.hero-meta span,.hero-bottom p,.eyebrow,.technical-heading h3,.technical-heading p,
  .technical-intro,.technical-items h4,.technical-items p,.experience-tags span,
  .credentials h3,.credentials p,.contact h2,.footer-note,.source-note,
  .project-detail h4,.award-list li,.section-heading p,.hero-name {
    transition:transform 300ms cubic-bezier(.2,.75,.2,1);
    transform-origin:left center;
  }
  .prose p:hover,.hero-meta span:hover,.hero-bottom p:hover,.eyebrow:hover,
  .technical-heading h3:hover,.technical-heading p:hover,.technical-intro:hover,
  .technical-items h4:hover,.technical-items p:hover,.experience-tags span:hover,
  .credentials h3:hover,.credentials p:hover,.contact h2:hover,.footer-note:hover,
  .source-note:hover,.project-detail h4:hover,.award-list li:hover,.section-heading p:hover,
  .hero-name:hover{transform:scale(1.012)}
}
/* Interactive elements use an elastic, liquid-like ease that stretches then settles. */
@keyframes liquidSettle {
  0%{transform:scale(1)}
  35%{transform:scale(1.052,.977)}
  65%{transform:scale(1.026,1.014)}
  100%{transform:scale(1.035)}
}
@media (hover:hover) and (pointer:fine){
  .scale-link:hover,.project-main:hover .project-title,
  .technical-group summary:hover .technical-name,.filter:hover{
    animation:liquidSettle 470ms cubic-bezier(.22,.8,.22,1) both;
  }
  .scale-link,.project-title,.technical-name,.filter{transform-origin:left center}
  .project-main:hover .project-title,.technical-group summary:hover .technical-name{
    transform:scale(1.035);
  }
}
/* A soft, rounded surface response reinforces which rows can be opened. */
.project-main,.technical-group summary{border-radius:12px;transition:background-color 260ms ease}
@media (hover:hover) and (pointer:fine){
  .project-main:hover,.technical-group summary:hover{background-color:rgba(0,0,0,.027)}
}
.project-main:focus-visible,.technical-group summary:focus-visible{outline:2px solid #111;outline-offset:3px}
@media(prefers-reduced-motion:reduce){
  .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{animation:none!important;transform:none!important}
}

/* Draft 08: explicit title contrast and persistent hover colour. */
.hero-name,.project-title,.technical-name,.technical-heading h3,.contact h2,.credentials h3{color:#202020}
@keyframes rainbowShimmer{
  0%,100%{color:#983650}
  17%{color:#925321}
  33%{color:#707023}
  50%{color:#19746a}
  67%{color:#355faa}
  83%{color:#79449f}
}
@media (hover:hover) and (pointer:fine){
 .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{
  animation:liquidCycle 1800ms cubic-bezier(.22,.8,.22,1) infinite,rainbowShimmer 3200ms linear infinite!important;
 }
 .scale-link.hover-clicked:hover,.project-main.hover-clicked:hover .project-title,.technical-group summary.hover-clicked:hover .technical-name,.filter.hover-clicked:hover{animation:none!important;color:#202020;transform:scale(1)}
}
@media(prefers-reduced-motion:reduce){
 .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{animation:none!important}
}

:root{color-scheme:light;--bg:#fff;--fg:#111;--muted:#666;--line:#d7d7d7;--soft:#f5f5f5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}button:focus-visible,a:focus-visible{outline:2px solid #111;outline-offset:5px}.topbar{position:relative;z-index:5;display:flex;align-items:center;gap:3rem;padding:29px 4.3%;border-bottom:1px solid #ddd}.wordmark{font-size:30px;font-weight:800;letter-spacing:-.075em}.topbar nav{display:flex;gap:25px;margin-left:auto}.topbar nav a,.portfolio{font-size:12px;text-transform:lowercase}.scale-link{display:inline-block;transform-origin:left center;transition:transform .22s ease}.scale-link:hover{transform:scale(1.09)}.hero{min-height:78vh;padding:6vh 4.3% 5vh;display:flex;flex-direction:column;justify-content:space-between}.hero-meta,.hero-bottom{display:flex;justify-content:space-between;gap:20px;color:#666;font-size:11px;letter-spacing:.1em}.hero h1{font-size:clamp(5rem,13.7vw,14rem);font-weight:700;letter-spacing:-.092em;line-height:.83;margin:10vh 0;max-width:1100px}.hero .break{display:block}.hero-bottom p{margin:0}.section{border-top:1px solid var(--line);padding:92px 4.3% 110px}.two-col{display:grid;grid-template-columns:30% minmax(0,1fr);gap:4%}.eyebrow{font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:lowercase;margin:0}.section-body{max-width:790px}.prose{font-size:clamp(19px,2.2vw,29px);line-height:1.45;letter-spacing:-.025em}.prose p{margin:0 0 1.25em}.prose p:last-child{margin-bottom:0}.experience-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:48px}.experience-tags span{border:1px solid #ccc;border-radius:50px;padding:10px 15px;font-size:12px;color:#666}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:30px}.section-heading p,.source-note{font-size:12px;color:var(--muted)}.filter-row{display:flex;flex-wrap:wrap;gap:12px;margin:48px 0 20px}.filter{border:1px solid #bbb;border-radius:30px;padding:10px 17px;background:none;color:#666;cursor:pointer;font-size:12px;transition:background .2s,color .2s}.filter:hover,.filter.active{background:var(--fg);color:var(--bg)}.project{position:relative;border-top:1px solid #d7d7d7}.project:last-child{border-bottom:1px solid #d7d7d7}.project-main{display:grid;grid-template-columns:80px minmax(0,1fr) 160px 26px;align-items:center;gap:14px;width:100%;padding:26px 0;border:0;color:var(--fg);background:none;text-align:left;cursor:pointer}.project-year,.project-category,.project-count{color:#666;font-size:12px}.project-title{font-size:clamp(24px,3.4vw,48px);font-weight:600;line-height:1.1;letter-spacing:-.055em;display:inline-block;transform-origin:left center;transition:transform .25s ease}.project-main:hover .project-title,.project-main:focus-visible .project-title{transform:scale(1.045)}.project-plus{font-size:25px;font-weight:300;text-align:right;transition:transform .25s}.project.open .project-plus{transform:rotate(45deg)}.project-detail{display:none;padding:0 0 30px 94px}.project.open .project-detail{display:block}.project-detail h4{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#666;margin:8px 0 18px}.award-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 32px}.award-list li{border-top:1px solid #ddd;padding:12px 0;font-size:14px;line-height:1.5}.award-list strong{display:block;font-weight:500}.award-list span{color:#666}.credentials>div{padding:0 0 30px;margin-bottom:32px;border-bottom:1px solid #ddd}.credentials h3{font-size:clamp(22px,2.8vw,36px);letter-spacing:-.04em;margin:10px 0}.credentials p,.micro{color:#666;font-size:13px}.contact h2{font-size:clamp(80px,15vw,200px);line-height:.9;letter-spacing:-.09em;margin:70px 0}.contact-links{display:flex;gap:45px;font-size:19px}.footer-note{margin:140px 0 0;color:#777;font-size:11px}.source-note{margin-top:28px;max-width:650px;line-height:1.6}@media(max-width:750px){.topbar{gap:14px;padding:22px 5%;flex-wrap:wrap}.topbar nav{order:3;width:100%;justify-content:space-between;margin:0;gap:10px}.portfolio{margin-left:auto}.hero{padding:45px 5% 50px;min-height:62vh}.hero h1{font-size:clamp(62px,14vw,115px);margin:75px 0}.hero-meta{font-size:9px}.hero-bottom{font-size:10px}.section{padding:60px 5% 75px}.two-col{display:block}.two-col .eyebrow{margin-bottom:34px}.section-heading{display:block}.section-heading p{margin-top:20px}.project-main{grid-template-columns:48px minmax(0,1fr) 20px;gap:9px;padding:21px 0}.project-category{display:none}.project-title{font-size:clamp(23px,6vw,38px)}.project-detail{padding-left:0}.award-list{grid-template-columns:1fr}.contact h2{margin:60px 0}.contact-links{gap:28px}.footer-note{margin-top:100px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Scale only interactive elements; static copy stays still. */
@media (hover:hover) and (pointer:fine) {
  .project-main:hover .project-title, .project-main:focus-visible .project-title {transform:scale(1.025)}
  .technical-group summary:hover .technical-name, .technical-group summary:focus-visible .technical-name {transform:scale(1.025)}
  .filter:hover {transform:scale(1.025)}
}
.hero-name{font-weight:400!important;letter-spacing:-.078em!important;overflow-wrap:normal}
.hero-name strong{font-weight:900;letter-spacing:-.09em}
.technical{margin-top:75px;border-top:1px solid var(--line)}
.technical-heading{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:26px 0 30px}
.technical-heading h3{font-size:clamp(25px,3.3vw,44px);letter-spacing:-.055em;font-weight:600;margin:0}
.technical-heading p{font-size:12px;color:var(--muted);max-width:230px;line-height:1.5;margin:0}
.technical-group{border-top:1px solid var(--line)}
.technical-group:last-of-type{border-bottom:1px solid var(--line)}
.technical-group summary{list-style:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 24px;align-items:center;gap:20px;cursor:pointer;padding:25px 0}
.technical-group summary::-webkit-details-marker{display:none}
.technical-name{font-size:clamp(20px,2.5vw,32px);font-weight:600;letter-spacing:-.045em;line-height:1.1}
.technical-preview{font-size:12px;color:var(--muted);line-height:1.6}
.technical-icon{text-align:right;font-size:25px;font-weight:300;transition:transform .22s ease}
.technical-group[open] .technical-icon{transform:rotate(45deg)}
.technical-content{padding:5px 0 45px}
.technical-intro{max-width:580px;color:#555;font-size:15px;line-height:1.6;margin:0 0 32px}
.technical-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 35px}
.technical-items article{border-top:1px solid #ddd;padding-top:16px}
.technical-items h4{font-size:19px;letter-spacing:-.03em;margin:0 0 12px}
.technical-items p{font-size:14px;line-height:1.65;color:#555;margin:0 0 10px}
.technical-items strong{font-weight:600;color:var(--fg)}
.technical-heading h3:hover,.technical-heading p:hover,.technical-name:hover,.technical-preview:hover,.technical-intro:hover,.technical-items h4:hover,.technical-items p:hover{transform:scale(1.018)}.technical-group summary:hover .technical-name{transform:scale(1.025)}}
@media(max-width:750px){.technical{margin-top:50px}.technical-heading{display:block}.technical-heading p{margin-top:12px}.technical-group summary{grid-template-columns:minmax(0,1fr) 24px;gap:12px}.technical-preview{grid-column:1;grid-row:2}.technical-icon{grid-column:2;grid-row:1}.technical-items{grid-template-columns:1fr;gap:20px}}

@media (hover:hover) and (pointer:fine){.scale-link:hover{transform:scale(1.045)}}

/* Draft 05 — gentle text movement and soft liquid press on interactive elements */
.hero-name{font-weight:300!important}
.hero-name strong{font-weight:750;letter-spacing:-.075em;text-transform:none}
/* Text-only hover is restrained and never implies clickability. */
@media (hover:hover) and (pointer:fine){
  .prose p,.hero-meta span,.hero-bottom p,.eyebrow,.technical-heading h3,.technical-heading p,
  .technical-intro,.technical-items h4,.technical-items p,.experience-tags span,
  .credentials h3,.credentials p,.contact h2,.footer-note,.source-note,
  .project-detail h4,.award-list li,.section-heading p,.hero-name {
    transition:transform 300ms cubic-bezier(.2,.75,.2,1);
    transform-origin:left center;
  }
  .prose p:hover,.hero-meta span:hover,.hero-bottom p:hover,.eyebrow:hover,
  .technical-heading h3:hover,.technical-heading p:hover,.technical-intro:hover,
  .technical-items h4:hover,.technical-items p:hover,.experience-tags span:hover,
  .credentials h3:hover,.credentials p:hover,.contact h2:hover,.footer-note:hover,
  .source-note:hover,.project-detail h4:hover,.award-list li:hover,.section-heading p:hover,
  .hero-name:hover{transform:scale(1.012)}
}
/* Interactive elements use an elastic, liquid-like ease that stretches then settles. */
@keyframes liquidSettle {
  0%{transform:scale(1)}
  35%{transform:scale(1.052,.977)}
  65%{transform:scale(1.026,1.014)}
  100%{transform:scale(1.035)}
}
@media (hover:hover) and (pointer:fine){
  .scale-link:hover,.project-main:hover .project-title,
  .technical-group summary:hover .technical-name,.filter:hover{
    animation:liquidSettle 470ms cubic-bezier(.22,.8,.22,1) both;
  }
  .scale-link,.project-title,.technical-name,.filter{transform-origin:left center}
  .project-main:hover .project-title,.technical-group summary:hover .technical-name{
    transform:scale(1.035);
  }
}
/* A soft, rounded surface response reinforces which rows can be opened. */
.project-main,.technical-group summary{border-radius:12px;transition:background-color 260ms ease}
@media (hover:hover) and (pointer:fine){
  .project-main:hover,.technical-group summary:hover{background-color:rgba(0,0,0,.027)}
}
.project-main:focus-visible,.technical-group summary:focus-visible{outline:2px solid #111;outline-offset:3px}
@media(prefers-reduced-motion:reduce){
  .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{animation:none!important;transform:none!important}
}

/* Draft 09: visible elastic scaling alongside the rainbow cycle. */
@keyframes pickScaleLoop{
  0%,100%{transform:scale(1)}
  25%{transform:scale(1.055,.985)}
  50%{transform:scale(1.035,1.025)}
  75%{transform:scale(1.045)}
}
@media (hover:hover) and (pointer:fine){
 .scale-link,.project-title,.technical-name,.filter{display:inline-block;transform-origin:left center}
 .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{
  animation:pickScaleLoop 1800ms ease-in-out infinite,rainbowShimmer 3200ms linear infinite!important;
 }
 .scale-link.hover-clicked:hover,.project-main.hover-clicked:hover .project-title,.technical-group summary.hover-clicked:hover .technical-name,.filter.hover-clicked:hover{animation:none!important;transform:scale(1)}
}
@media(prefers-reduced-motion:reduce){
 .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{animation:none!important}
}

:root{color-scheme:light;--bg:#fff;--fg:#111;--muted:#666;--line:#d7d7d7;--soft:#f5f5f5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}button:focus-visible,a:focus-visible{outline:2px solid #111;outline-offset:5px}.topbar{position:relative;z-index:5;display:flex;align-items:center;gap:3rem;padding:29px 4.3%;border-bottom:1px solid #ddd}.wordmark{font-size:30px;font-weight:800;letter-spacing:-.075em}.topbar nav{display:flex;gap:25px;margin-left:auto}.topbar nav a,.portfolio{font-size:12px;text-transform:lowercase}.scale-link{display:inline-block;transform-origin:left center;transition:transform .22s ease}.scale-link:hover{transform:scale(1.09)}.hero{min-height:78vh;padding:6vh 4.3% 5vh;display:flex;flex-direction:column;justify-content:space-between}.hero-meta,.hero-bottom{display:flex;justify-content:space-between;gap:20px;color:#666;font-size:11px;letter-spacing:.1em}.hero h1{font-size:clamp(5rem,13.7vw,14rem);font-weight:700;letter-spacing:-.092em;line-height:.83;margin:10vh 0;max-width:1100px}.hero .break{display:block}.hero-bottom p{margin:0}.section{border-top:1px solid var(--line);padding:92px 4.3% 110px}.two-col{display:grid;grid-template-columns:30% minmax(0,1fr);gap:4%}.eyebrow{font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:lowercase;margin:0}.section-body{max-width:790px}.prose{font-size:clamp(19px,2.2vw,29px);line-height:1.45;letter-spacing:-.025em}.prose p{margin:0 0 1.25em}.prose p:last-child{margin-bottom:0}.experience-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:48px}.experience-tags span{border:1px solid #ccc;border-radius:50px;padding:10px 15px;font-size:12px;color:#666}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:30px}.section-heading p,.source-note{font-size:12px;color:var(--muted)}.filter-row{display:flex;flex-wrap:wrap;gap:12px;margin:48px 0 20px}.filter{border:1px solid #bbb;border-radius:30px;padding:10px 17px;background:none;color:#666;cursor:pointer;font-size:12px;transition:background .2s,color .2s}.filter:hover,.filter.active{background:var(--fg);color:var(--bg)}.project{position:relative;border-top:1px solid #d7d7d7}.project:last-child{border-bottom:1px solid #d7d7d7}.project-main{display:grid;grid-template-columns:80px minmax(0,1fr) 160px 26px;align-items:center;gap:14px;width:100%;padding:26px 0;border:0;color:var(--fg);background:none;text-align:left;cursor:pointer}.project-year,.project-category,.project-count{color:#666;font-size:12px}.project-title{font-size:clamp(24px,3.4vw,48px);font-weight:600;line-height:1.1;letter-spacing:-.055em;display:inline-block;transform-origin:left center;transition:transform .25s ease}.project-main:hover .project-title,.project-main:focus-visible .project-title{transform:scale(1.045)}.project-plus{font-size:25px;font-weight:300;text-align:right;transition:transform .25s}.project.open .project-plus{transform:rotate(45deg)}.project-detail{display:none;padding:0 0 30px 94px}.project.open .project-detail{display:block}.project-detail h4{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#666;margin:8px 0 18px}.award-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 32px}.award-list li{border-top:1px solid #ddd;padding:12px 0;font-size:14px;line-height:1.5}.award-list strong{display:block;font-weight:500}.award-list span{color:#666}.credentials>div{padding:0 0 30px;margin-bottom:32px;border-bottom:1px solid #ddd}.credentials h3{font-size:clamp(22px,2.8vw,36px);letter-spacing:-.04em;margin:10px 0}.credentials p,.micro{color:#666;font-size:13px}.contact h2{font-size:clamp(80px,15vw,200px);line-height:.9;letter-spacing:-.09em;margin:70px 0}.contact-links{display:flex;gap:45px;font-size:19px}.footer-note{margin:140px 0 0;color:#777;font-size:11px}.source-note{margin-top:28px;max-width:650px;line-height:1.6}@media(max-width:750px){.topbar{gap:14px;padding:22px 5%;flex-wrap:wrap}.topbar nav{order:3;width:100%;justify-content:space-between;margin:0;gap:10px}.portfolio{margin-left:auto}.hero{padding:45px 5% 50px;min-height:62vh}.hero h1{font-size:clamp(62px,14vw,115px);margin:75px 0}.hero-meta{font-size:9px}.hero-bottom{font-size:10px}.section{padding:60px 5% 75px}.two-col{display:block}.two-col .eyebrow{margin-bottom:34px}.section-heading{display:block}.section-heading p{margin-top:20px}.project-main{grid-template-columns:48px minmax(0,1fr) 20px;gap:9px;padding:21px 0}.project-category{display:none}.project-title{font-size:clamp(23px,6vw,38px)}.project-detail{padding-left:0}.award-list{grid-template-columns:1fr}.contact h2{margin:60px 0}.contact-links{gap:28px}.footer-note{margin-top:100px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Scale only interactive elements; static copy stays still. */
@media (hover:hover) and (pointer:fine) {
  .project-main:hover .project-title, .project-main:focus-visible .project-title {transform:scale(1.025)}
  .technical-group summary:hover .technical-name, .technical-group summary:focus-visible .technical-name {transform:scale(1.025)}
  .filter:hover {transform:scale(1.025)}
}
.hero-name{font-weight:400!important;letter-spacing:-.078em!important;overflow-wrap:normal}
.hero-name strong{font-weight:900;letter-spacing:-.09em}
.technical{margin-top:75px;border-top:1px solid var(--line)}
.technical-heading{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:26px 0 30px}
.technical-heading h3{font-size:clamp(25px,3.3vw,44px);letter-spacing:-.055em;font-weight:600;margin:0}
.technical-heading p{font-size:12px;color:var(--muted);max-width:230px;line-height:1.5;margin:0}
.technical-group{border-top:1px solid var(--line)}
.technical-group:last-of-type{border-bottom:1px solid var(--line)}
.technical-group summary{list-style:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 24px;align-items:center;gap:20px;cursor:pointer;padding:25px 0}
.technical-group summary::-webkit-details-marker{display:none}
.technical-name{font-size:clamp(20px,2.5vw,32px);font-weight:600;letter-spacing:-.045em;line-height:1.1}
.technical-preview{font-size:12px;color:var(--muted);line-height:1.6}
.technical-icon{text-align:right;font-size:25px;font-weight:300;transition:transform .22s ease}
.technical-group[open] .technical-icon{transform:rotate(45deg)}
.technical-content{padding:5px 0 45px}
.technical-intro{max-width:580px;color:#555;font-size:15px;line-height:1.6;margin:0 0 32px}
.technical-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 35px}
.technical-items article{border-top:1px solid #ddd;padding-top:16px}
.technical-items h4{font-size:19px;letter-spacing:-.03em;margin:0 0 12px}
.technical-items p{font-size:14px;line-height:1.65;color:#555;margin:0 0 10px}
.technical-items strong{font-weight:600;color:var(--fg)}
.technical-heading h3:hover,.technical-heading p:hover,.technical-name:hover,.technical-preview:hover,.technical-intro:hover,.technical-items h4:hover,.technical-items p:hover{transform:scale(1.018)}.technical-group summary:hover .technical-name{transform:scale(1.025)}}
@media(max-width:750px){.technical{margin-top:50px}.technical-heading{display:block}.technical-heading p{margin-top:12px}.technical-group summary{grid-template-columns:minmax(0,1fr) 24px;gap:12px}.technical-preview{grid-column:1;grid-row:2}.technical-icon{grid-column:2;grid-row:1}.technical-items{grid-template-columns:1fr;gap:20px}}

@media (hover:hover) and (pointer:fine){.scale-link:hover{transform:scale(1.045)}}

/* Draft 05 — gentle text movement and soft liquid press on interactive elements */
.hero-name{font-weight:300!important}
.hero-name strong{font-weight:750;letter-spacing:-.075em;text-transform:none}
/* Text-only hover is restrained and never implies clickability. */
@media (hover:hover) and (pointer:fine){
  .prose p,.hero-meta span,.hero-bottom p,.eyebrow,.technical-heading h3,.technical-heading p,
  .technical-intro,.technical-items h4,.technical-items p,.experience-tags span,
  .credentials h3,.credentials p,.contact h2,.footer-note,.source-note,
  .project-detail h4,.award-list li,.section-heading p,.hero-name {
    transition:transform 300ms cubic-bezier(.2,.75,.2,1);
    transform-origin:left center;
  }
  .prose p:hover,.hero-meta span:hover,.hero-bottom p:hover,.eyebrow:hover,
  .technical-heading h3:hover,.technical-heading p:hover,.technical-intro:hover,
  .technical-items h4:hover,.technical-items p:hover,.experience-tags span:hover,
  .credentials h3:hover,.credentials p:hover,.contact h2:hover,.footer-note:hover,
  .source-note:hover,.project-detail h4:hover,.award-list li:hover,.section-heading p:hover,
  .hero-name:hover{transform:scale(1.012)}
}
/* Interactive elements use an elastic, liquid-like ease that stretches then settles. */
@keyframes liquidSettle {
  0%{transform:scale(1)}
  35%{transform:scale(1.052,.977)}
  65%{transform:scale(1.026,1.014)}
  100%{transform:scale(1.035)}
}
@media (hover:hover) and (pointer:fine){
  .scale-link:hover,.project-main:hover .project-title,
  .technical-group summary:hover .technical-name,.filter:hover{
    animation:liquidSettle 470ms cubic-bezier(.22,.8,.22,1) both;
  }
  .scale-link,.project-title,.technical-name,.filter{transform-origin:left center}
  .project-main:hover .project-title,.technical-group summary:hover .technical-name{
    transform:scale(1.035);
  }
}
/* A soft, rounded surface response reinforces which rows can be opened. */
.project-main,.technical-group summary{border-radius:12px;transition:background-color 260ms ease}
@media (hover:hover) and (pointer:fine){
  .project-main:hover,.technical-group summary:hover{background-color:rgba(0,0,0,.027)}
}
.project-main:focus-visible,.technical-group summary:focus-visible{outline:2px solid #111;outline-offset:3px}
@media(prefers-reduced-motion:reduce){
  .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{animation:none!important;transform:none!important}
}

/* A passing glass ripple when a disclosure opens. */
.project,.technical-group{position:relative;isolation:isolate}
.section-ripple{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:12px;z-index:-1}
.section-ripple::after{content:"";position:absolute;left:0;right:0;top:0;height:65px;background:linear-gradient(180deg,transparent,rgba(112,146,197,.09) 40%,rgba(151,109,186,.08) 65%,transparent);animation:sectionRipple 850ms cubic-bezier(.2,.65,.3,1) forwards}
@keyframes sectionRipple{from{transform:translateY(-100%);opacity:0}15%{opacity:1}to{transform:translateY(var(--ripple-distance));opacity:0}}
@media(prefers-reduced-motion:reduce){.section-ripple{display:none}}

:root{color-scheme:light;--bg:#fff;--fg:#111;--muted:#666;--line:#d7d7d7;--soft:#f5f5f5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}button:focus-visible,a:focus-visible{outline:2px solid #111;outline-offset:5px}.topbar{position:relative;z-index:5;display:flex;align-items:center;gap:3rem;padding:29px 4.3%;border-bottom:1px solid #ddd}.wordmark{font-size:30px;font-weight:800;letter-spacing:-.075em}.topbar nav{display:flex;gap:25px;margin-left:auto}.topbar nav a,.portfolio{font-size:12px;text-transform:lowercase}.scale-link{display:inline-block;transform-origin:left center;transition:transform .22s ease}.scale-link:hover{transform:scale(1.09)}.hero{min-height:78vh;padding:6vh 4.3% 5vh;display:flex;flex-direction:column;justify-content:space-between}.hero-meta,.hero-bottom{display:flex;justify-content:space-between;gap:20px;color:#666;font-size:11px;letter-spacing:.1em}.hero h1{font-size:clamp(5rem,13.7vw,14rem);font-weight:700;letter-spacing:-.092em;line-height:.83;margin:10vh 0;max-width:1100px}.hero .break{display:block}.hero-bottom p{margin:0}.section{border-top:1px solid var(--line);padding:92px 4.3% 110px}.two-col{display:grid;grid-template-columns:30% minmax(0,1fr);gap:4%}.eyebrow{font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:lowercase;margin:0}.section-body{max-width:790px}.prose{font-size:clamp(19px,2.2vw,29px);line-height:1.45;letter-spacing:-.025em}.prose p{margin:0 0 1.25em}.prose p:last-child{margin-bottom:0}.experience-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:48px}.experience-tags span{border:1px solid #ccc;border-radius:50px;padding:10px 15px;font-size:12px;color:#666}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:30px}.section-heading p,.source-note{font-size:12px;color:var(--muted)}.filter-row{display:flex;flex-wrap:wrap;gap:12px;margin:48px 0 20px}.filter{border:1px solid #bbb;border-radius:30px;padding:10px 17px;background:none;color:#666;cursor:pointer;font-size:12px;transition:background .2s,color .2s}.filter:hover,.filter.active{background:var(--fg);color:var(--bg)}.project{position:relative;border-top:1px solid #d7d7d7}.project:last-child{border-bottom:1px solid #d7d7d7}.project-main{display:grid;grid-template-columns:80px minmax(0,1fr) 160px 26px;align-items:center;gap:14px;width:100%;padding:26px 0;border:0;color:var(--fg);background:none;text-align:left;cursor:pointer}.project-year,.project-category,.project-count{color:#666;font-size:12px}.project-title{font-size:clamp(24px,3.4vw,48px);font-weight:600;line-height:1.1;letter-spacing:-.055em;display:inline-block;transform-origin:left center;transition:transform .25s ease}.project-main:hover .project-title,.project-main:focus-visible .project-title{transform:scale(1.045)}.project-plus{font-size:25px;font-weight:300;text-align:right;transition:transform .25s}.project.open .project-plus{transform:rotate(45deg)}.project-detail{display:none;padding:0 0 30px 94px}.project.open .project-detail{display:block}.project-detail h4{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#666;margin:8px 0 18px}.award-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 32px}.award-list li{border-top:1px solid #ddd;padding:12px 0;font-size:14px;line-height:1.5}.award-list strong{display:block;font-weight:500}.award-list span{color:#666}.credentials>div{padding:0 0 30px;margin-bottom:32px;border-bottom:1px solid #ddd}.credentials h3{font-size:clamp(22px,2.8vw,36px);letter-spacing:-.04em;margin:10px 0}.credentials p,.micro{color:#666;font-size:13px}.contact h2{font-size:clamp(80px,15vw,200px);line-height:.9;letter-spacing:-.09em;margin:70px 0}.contact-links{display:flex;gap:45px;font-size:19px}.footer-note{margin:140px 0 0;color:#777;font-size:11px}.source-note{margin-top:28px;max-width:650px;line-height:1.6}@media(max-width:750px){.topbar{gap:14px;padding:22px 5%;flex-wrap:wrap}.topbar nav{order:3;width:100%;justify-content:space-between;margin:0;gap:10px}.portfolio{margin-left:auto}.hero{padding:45px 5% 50px;min-height:62vh}.hero h1{font-size:clamp(62px,14vw,115px);margin:75px 0}.hero-meta{font-size:9px}.hero-bottom{font-size:10px}.section{padding:60px 5% 75px}.two-col{display:block}.two-col .eyebrow{margin-bottom:34px}.section-heading{display:block}.section-heading p{margin-top:20px}.project-main{grid-template-columns:48px minmax(0,1fr) 20px;gap:9px;padding:21px 0}.project-category{display:none}.project-title{font-size:clamp(23px,6vw,38px)}.project-detail{padding-left:0}.award-list{grid-template-columns:1fr}.contact h2{margin:60px 0}.contact-links{gap:28px}.footer-note{margin-top:100px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Scale only interactive elements; static copy stays still. */
@media (hover:hover) and (pointer:fine) {
  .project-main:hover .project-title, .project-main:focus-visible .project-title {transform:scale(1.025)}
  .technical-group summary:hover .technical-name, .technical-group summary:focus-visible .technical-name {transform:scale(1.025)}
  .filter:hover {transform:scale(1.025)}
}
.hero-name{font-weight:400!important;letter-spacing:-.078em!important;overflow-wrap:normal}
.hero-name strong{font-weight:900;letter-spacing:-.09em}
.technical{margin-top:75px;border-top:1px solid var(--line)}
.technical-heading{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:26px 0 30px}
.technical-heading h3{font-size:clamp(25px,3.3vw,44px);letter-spacing:-.055em;font-weight:600;margin:0}
.technical-heading p{font-size:12px;color:var(--muted);max-width:230px;line-height:1.5;margin:0}
.technical-group{border-top:1px solid var(--line)}
.technical-group:last-of-type{border-bottom:1px solid var(--line)}
.technical-group summary{list-style:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 24px;align-items:center;gap:20px;cursor:pointer;padding:25px 0}
.technical-group summary::-webkit-details-marker{display:none}
.technical-name{font-size:clamp(20px,2.5vw,32px);font-weight:600;letter-spacing:-.045em;line-height:1.1}
.technical-preview{font-size:12px;color:var(--muted);line-height:1.6}
.technical-icon{text-align:right;font-size:25px;font-weight:300;transition:transform .22s ease}
.technical-group[open] .technical-icon{transform:rotate(45deg)}
.technical-content{padding:5px 0 45px}
.technical-intro{max-width:580px;color:#555;font-size:15px;line-height:1.6;margin:0 0 32px}
.technical-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 35px}
.technical-items article{border-top:1px solid #ddd;padding-top:16px}
.technical-items h4{font-size:19px;letter-spacing:-.03em;margin:0 0 12px}
.technical-items p{font-size:14px;line-height:1.65;color:#555;margin:0 0 10px}
.technical-items strong{font-weight:600;color:var(--fg)}
.technical-heading h3:hover,.technical-heading p:hover,.technical-name:hover,.technical-preview:hover,.technical-intro:hover,.technical-items h4:hover,.technical-items p:hover{transform:scale(1.018)}.technical-group summary:hover .technical-name{transform:scale(1.025)}}
@media(max-width:750px){.technical{margin-top:50px}.technical-heading{display:block}.technical-heading p{margin-top:12px}.technical-group summary{grid-template-columns:minmax(0,1fr) 24px;gap:12px}.technical-preview{grid-column:1;grid-row:2}.technical-icon{grid-column:2;grid-row:1}.technical-items{grid-template-columns:1fr;gap:20px}}

@media (hover:hover) and (pointer:fine){.scale-link:hover{transform:scale(1.045)}}

/* Draft 05 — gentle text movement and soft liquid press on interactive elements */
.hero-name{font-weight:300!important}
.hero-name strong{font-weight:750;letter-spacing:-.075em;text-transform:none}
/* Text-only hover is restrained and never implies clickability. */
@media (hover:hover) and (pointer:fine){
  .prose p,.hero-meta span,.hero-bottom p,.eyebrow,.technical-heading h3,.technical-heading p,
  .technical-intro,.technical-items h4,.technical-items p,.experience-tags span,
  .credentials h3,.credentials p,.contact h2,.footer-note,.source-note,
  .project-detail h4,.award-list li,.section-heading p,.hero-name {
    transition:transform 300ms cubic-bezier(.2,.75,.2,1);
    transform-origin:left center;
  }
  .prose p:hover,.hero-meta span:hover,.hero-bottom p:hover,.eyebrow:hover,
  .technical-heading h3:hover,.technical-heading p:hover,.technical-intro:hover,
  .technical-items h4:hover,.technical-items p:hover,.experience-tags span:hover,
  .credentials h3:hover,.credentials p:hover,.contact h2:hover,.footer-note:hover,
  .source-note:hover,.project-detail h4:hover,.award-list li:hover,.section-heading p:hover,
  .hero-name:hover{transform:scale(1.012)}
}
/* Interactive elements use an elastic, liquid-like ease that stretches then settles. */
@keyframes liquidSettle {
  0%{transform:scale(1)}
  35%{transform:scale(1.052,.977)}
  65%{transform:scale(1.026,1.014)}
  100%{transform:scale(1.035)}
}
@media (hover:hover) and (pointer:fine){
  .scale-link:hover,.project-main:hover .project-title,
  .technical-group summary:hover .technical-name,.filter:hover{
    animation:liquidSettle 470ms cubic-bezier(.22,.8,.22,1) both;
  }
  .scale-link,.project-title,.technical-name,.filter{transform-origin:left center}
  .project-main:hover .project-title,.technical-group summary:hover .technical-name{
    transform:scale(1.035);
  }
}
/* A soft, rounded surface response reinforces which rows can be opened. */
.project-main,.technical-group summary{border-radius:12px;transition:background-color 260ms ease}
@media (hover:hover) and (pointer:fine){
  .project-main:hover,.technical-group summary:hover{background-color:rgba(0,0,0,.027)}
}
.project-main:focus-visible,.technical-group summary:focus-visible{outline:2px solid #111;outline-offset:3px}
@media(prefers-reduced-motion:reduce){
  .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{animation:none!important;transform:none!important}
}

/* Draft 11: clear section hierarchy and stronger award labels. */
.award-list li strong{color:#202020!important;font-weight:600!important;opacity:1!important}
.eyebrow{font-size:clamp(20px,2.5vw,30px)!important;line-height:1.2;font-weight:600;color:#202020!important;letter-spacing:-.025em}

#about .prose,#experience .prose{display:block!important;visibility:visible!important;opacity:1!important;color:#202020!important} .prose p{display:block!important;visibility:visible!important;opacity:1!important;color:#202020!important} .section-body{min-width:0} .two-col{align-items:start}

/* Clickable items: colour cycle only. */
.scale-link,.project-main,.project-title,.technical-group summary,.technical-name,.filter{transform:none!important}
@media (hover:hover) and (pointer:fine){
 .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{animation:rainbowShimmer 3200ms linear infinite!important;transform:none!important}
 .scale-link.hover-clicked:hover,.project-main.hover-clicked:hover .project-title,.technical-group summary.hover-clicked:hover .technical-name,.filter.hover-clicked:hover{animation:none!important}
}
@media(prefers-reduced-motion:reduce){
 .scale-link:hover,.project-main:hover .project-title,.technical-group summary:hover .technical-name,.filter:hover{animation:none!important}
}

/* Portfolio stills behind the opening title. */
.hero{position:relative;isolation:isolate;overflow:hidden;background:#fff;min-height:82vh}
.hero-slideshow{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:var(--hero-visibility,1);background:#fff}
.hero-slideshow::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.74),rgba(255,255,255,.44) 65%,rgba(255,255,255,.28)),linear-gradient(0deg,#fff 0%,rgba(255,255,255,.06) 45%)}
.hero-frame{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;opacity:0;transition:opacity 1600ms ease}
.hero-frame.is-current{opacity:1}
.hero .hero-name{position:relative;z-index:1}
.hero .hero-meta,.hero .hero-bottom{position:relative;color:#303030}
.slideshow-toggle{position:absolute;right:4.3%;bottom:70px;border:0;border-radius:20px;background:rgba(255,255,255,.7);padding:10px 14px;color:#303030;font:11px Arial,sans-serif;cursor:pointer;z-index:2}
.slideshow-toggle:focus-visible{outline:2px solid #202020;outline-offset:3px}
@media(max-width:750px){.hero{min-height:70vh}.slideshow-toggle{bottom:85px}.hero-slideshow::after{background:linear-gradient(90deg,rgba(255,255,255,.75),rgba(255,255,255,.45)),linear-gradient(0deg,#fff,transparent 65%)}}
@media(prefers-reduced-motion:reduce){.hero-frame{transition:none}}

/* Full-colour stills with image-aware title contrast. */
.hero-slideshow::after{background:none!important}
.hero-frame{transition:opacity 800ms ease}
.hero{--hero-ink:#fff}
.hero[data-ink="dark"]{--hero-ink:#111}
.hero .hero-name,.hero .hero-name strong,.hero .hero-name .break{color:var(--hero-ink)!important;transition:color 350ms ease;text-shadow:0 1px 15px rgba(0,0,0,.14)}
.hero .hero-meta,.hero .hero-bottom{color:var(--hero-ink);text-shadow:0 1px 8px rgba(0,0,0,.3)}
.hero .hero-bottom a{color:inherit}
@media(prefers-reduced-motion:reduce){.hero-frame,.hero .hero-name,.hero .hero-name strong,.hero .hero-name .break{transition:none}}

/* Compact monochrome software marks. */
.technical-items .brand-heading{display:flex;align-items:center;gap:12px}
.brand-logo{display:block;width:27px;height:27px;object-fit:contain;flex:0 0 27px;filter:brightness(0);opacity:1}
.brand-logo[src$="avid.svg"]{width:43px;flex-basis:43px}
.brand-logo-td{position:relative;overflow:hidden;width:72px;height:18px;flex-basis:72px;filter:none}
.brand-logo-td img{position:absolute;width:230px;height:30px;max-width:none;left:-28px;top:-10px;filter:grayscale(1) contrast(2)}
@media(max-width:750px){.technical-items .brand-heading{gap:10px}.brand-logo{width:24px;height:24px;flex-basis:24px}.brand-logo-td{width:72px;height:18px;flex-basis:72px}}

.hero-identity{display:flex;align-items:center;justify-content:space-between;gap:40px;position:relative;z-index:1}
.hero-identity .hero-name{flex:1;min-width:0}
.resume-label{font-size:clamp(38px,5vw,76px);letter-spacing:-.065em;font-weight:400;color:var(--hero-ink);transition:color 350ms ease;padding-right:2vw}
.camera-brand{width:48px!important;flex-basis:48px!important;height:28px;filter:grayscale(1) brightness(0)}
.brand-logo[src$="preston.png"]{filter:grayscale(1);mix-blend-mode:multiply}
.disclosure-animating{overflow:hidden;will-change:height}
@media(max-width:750px){.hero-identity{flex-wrap:wrap;gap:0}.hero-identity .hero-name{flex-basis:100%;margin-bottom:20px}.resume-label{padding-bottom:30px;font-size:38px}}

.resume-label{font-size:clamp(54px,10vw,140px);font-weight:750;letter-spacing:-.075em;line-height:.92;padding-right:0;display:inline-block;transform-origin:center;transition:transform 350ms cubic-bezier(.2,.75,.2,1),color 350ms ease}
.awards-intro{max-width:480px;line-height:1.65;font-size:14px!important;color:#444}
.awards-intro a{color:#202020;text-decoration:underline;text-underline-offset:3px}
@media(hover:hover) and (pointer:fine){.resume-label:hover{transform:scale(1.035)}}
@media(max-width:750px){.hero-identity .hero-name{margin-top:40px}.resume-label{font-size:clamp(54px,10vw,140px);padding-bottom:40px}}
@media(prefers-reduced-motion:reduce){.resume-label{transition:none}.resume-label:hover{transform:none}}

/* Résumé typography and readable supporting copy. */
.hero-identity{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:24px;margin:50px 0}
.hero-identity .resume-label{padding:0;transform-origin:left center}
.hero h1.hero-name{margin:0;font-weight:300!important}
.hero-name strong{font-weight:600!important}
.hero-meta,.hero-bottom{font-size:22px;letter-spacing:.04em;line-height:1.4}
#awards .section-heading{display:grid;grid-template-columns:30% minmax(0,1fr);gap:4%;align-items:start}
#awards .awards-intro{max-width:790px;margin:0;font-size:clamp(19px,2.2vw,29px)!important;line-height:1.45;letter-spacing:-.025em;color:#202020}
.technical-heading p,.technical-preview,.experience-tags span,.filter,.project-year,.project-category,.project-count,.project-detail h4{font-size:24px}
.technical-heading p{max-width:420px}
.technical-intro{font-size:30px;max-width:100%}
.technical-items p,.award-list li{font-size:28px}
.technical-items h4{font-size:38px}
.credentials p,.micro{font-size:26px}
.footer-note{font-size:22px}
.contact-links{font-size:38px}
.project-main{grid-template-columns:100px minmax(0,1fr) 270px 26px}
.project-detail{padding-left:114px}
.technical-heading{flex-wrap:wrap;gap:20px}
.technical-items article{min-width:0}
.brand-heading{flex-wrap:wrap}
@media(max-width:1100px){.award-list{grid-template-columns:1fr}.technical-items{grid-template-columns:1fr}.technical-group summary{grid-template-columns:minmax(0,1fr) 24px}.technical-preview{grid-column:1;grid-row:2}.technical-icon{grid-column:2;grid-row:1}}
@media(max-width:750px){
 .hero-identity{gap:20px;margin:35px 0}.hero-identity .hero-name{flex-basis:auto;margin:0}.hero-meta{font-size:18px;flex-wrap:wrap}.hero-bottom{font-size:20px;flex-wrap:wrap}
 #awards .section-heading{display:block}#awards .eyebrow{margin-bottom:30px}
 .project-main{grid-template-columns:65px minmax(0,1fr) 24px}.project-category{display:none}.project-detail{padding-left:0}
 .technical-items h4{font-size:32px}.contact-links{flex-wrap:wrap;gap:24px}
}

/* Plain text award filters; bold indicates selection. */
.filter-row{gap:20px 30px}
.filter,.filter:hover,.filter.active{border:0;border-radius:0;background:none!important;box-shadow:none;padding:8px 0;color:#666;font-weight:400}
.filter.active,.filter[aria-pressed="true"]{font-weight:700;color:#202020}

/* A small, repeating cursor cue for interactive elements. */
.click-cursor-cue{position:fixed;left:0;top:0;width:0;height:0;z-index:9999;pointer-events:none;display:none;mix-blend-mode:difference}
.click-cursor-cue::before{content:"";position:absolute;left:-11px;top:-11px;width:22px;height:22px;border:1.5px solid #fff;border-radius:50%;opacity:0}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .click-cursor-cue.is-visible{display:block}
 .click-cursor-cue.is-visible::before{animation:clickCursorPulse 1300ms ease-out infinite}
}
@keyframes clickCursorPulse{0%{transform:scale(.45);opacity:.85}80%,100%{transform:scale(1.45);opacity:0}}

/* One-line name and a vertically centred title group. */
.hero{display:grid;grid-template-rows:auto minmax(0,1fr) auto;min-height:82svh}
.hero-identity{align-self:center;justify-self:start;margin:0!important;gap:clamp(28px,5vh,64px);padding:45px 0}
.hero h1.hero-name{font-size:clamp(18px,6.5vw,88px);white-space:nowrap;line-height:1.08;margin:0!important;max-width:none;letter-spacing:-.065em!important}
.hero-name .break{display:inline}
.prose,.technical-intro,.technical-items p,.award-list li,.credentials p{font-size:clamp(19px,2vw,26px);line-height:1.5}
#awards .awards-intro{font-size:clamp(19px,2vw,26px)!important;line-height:1.5}
.technical-items h4{font-size:26px;line-height:1.25}
@media(max-width:750px){.hero{min-height:75svh}.hero-identity{gap:30px;padding:40px 0}.hero-identity .hero-name{flex-basis:auto}.hero-name .break{display:inline}.hero-identity .resume-label{padding:0}.technical-items h4{font-size:24px}}
.hero{grid-template-columns:minmax(0,1fr);justify-content:stretch}
.hero-meta,.hero-bottom{width:100%}

/* Light / dark appearance, preserving the slideshow's adaptive ink. */
:root{--page-secondary:#666;--page-border:#d7d7d7}
html[data-theme="dark"]{color-scheme:dark;--bg:#111;--fg:#f2f2f2;--muted:#b3b3b3;--line:#393939;--soft:#1d1d1d;--page-secondary:#b3b3b3;--page-border:#393939}
body{background:var(--bg);color:var(--fg)}
.hero,.hero-slideshow{background:var(--bg)}
.hero-meta{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:20px}
.hero-meta>span:last-child{text-align:right}
.theme-toggle{display:flex;align-items:center;gap:9px;border:0;background:rgba(255,255,255,.88);color:#202020;border-radius:30px;padding:9px 13px;font:16px Arial,Helvetica,sans-serif;letter-spacing:0;cursor:pointer;white-space:nowrap;text-shadow:none}
.theme-track{width:38px;height:22px;background:#b6b6b6;border-radius:20px;position:relative}
.theme-knob{position:absolute;width:16px;height:16px;left:3px;top:3px;background:#fff;border-radius:50%;transition:transform 240ms ease}
.theme-toggle[aria-checked="true"] .theme-knob{transform:translateX(16px)}
.theme-toggle[aria-checked="true"] .theme-track{background:#777}
.theme-toggle[aria-checked="true"]{background:rgba(25,25,25,.9);color:#f2f2f2}
.theme-toggle:focus-visible{outline:2px solid currentColor;outline-offset:4px}
html[data-theme="dark"] :is(.eyebrow,.technical-heading h3,.credentials h3,.contact h2,.technical-items h4,.technical-items strong,.award-list li strong,.filter.active,.filter[aria-pressed="true"],.awards-intro a){color:var(--fg)!important}
html[data-theme="dark"] :is(#about .prose,#experience .prose,.prose p,#awards .awards-intro){color:var(--fg)!important}
html[data-theme="dark"] :is(.technical-intro,.technical-items p,.technical-heading p,.technical-preview,.project-year,.project-category,.project-count,.project-detail h4,.award-list li span,.credentials p,.micro,.footer-note,.experience-tags span,.filter){color:var(--page-secondary)}
html[data-theme="dark"] :is(.section,.project,.award-list li,.technical,.technical-group,.technical-items article,.credentials>div,.experience-tags span){border-color:var(--page-border)}
html[data-theme="dark"] :is(.project-main,.technical-group summary){color:var(--fg)}
html[data-theme="dark"] :is(.project-main:hover,.technical-group summary:hover){background-color:rgba(255,255,255,.045)}
html[data-theme="dark"] :is(a:focus-visible,button:focus-visible,.project-main:focus-visible,.technical-group summary:focus-visible){outline-color:var(--fg)}
html[data-theme="dark"] .brand-logo{filter:brightness(0) invert(1)}
html[data-theme="dark"] .brand-logo[src$="preston.png"]{filter:grayscale(1) invert(1);mix-blend-mode:screen}
html[data-theme="dark"] .brand-logo-td{filter:none}
html[data-theme="dark"] .brand-logo-td img{filter:grayscale(1) contrast(2) invert(1)}
@media(max-width:900px){.hero-meta{font-size:16px;gap:12px}.theme-toggle{font-size:14px;gap:6px;padding:8px}}
@media(max-width:550px){.hero-meta{font-size:12px;letter-spacing:0;gap:8px}.theme-toggle{font-size:12px;gap:5px;padding:8px 6px}.theme-track{width:30px;height:20px}.theme-knob{width:14px;height:14px}.theme-toggle[aria-checked="true"] .theme-knob{transform:translateX(10px)}}
@media(prefers-reduced-motion:reduce){.theme-knob{transition:none}}

html[data-theme="dark"] :is(.project-title,.technical-name){color:var(--fg)}

/* Manual slideshow navigation and a liquid theme reveal. */
.hero-bottom{align-items:center;flex-wrap:wrap;gap:18px}
.hero-bottom p{order:0}.slideshow-arrows{order:1;display:flex;align-items:center;gap:14px}.hero-bottom>a{order:2}
.slide-arrow{border:0;background:transparent;color:inherit;font:32px/1 Arial,sans-serif;min-width:44px;min-height:44px;padding:4px;cursor:pointer}
.slide-arrow:focus-visible{outline:2px solid currentColor;outline-offset:3px;border-radius:50%}
.slide-announcement{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-old(root){z-index:1}::view-transition-new(root){z-index:2;transform-origin:top center}
.theme-liquid-sweep{position:fixed;inset:0 0 auto;height:35vh;z-index:10000;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(151,157,191,.16),rgba(194,170,208,.12),transparent);backdrop-filter:blur(5px);border-radius:40%}
@media(max-width:750px){.hero-bottom p{flex-basis:100%}.slideshow-arrows{margin-right:auto}.slide-arrow{font-size:28px}}

/* Icon-only theme control; the track is its only background. */
.theme-slot{display:flex;justify-content:center;min-height:34px}
.theme-toggle,.theme-toggle[aria-checked="true"]{background:transparent;padding:0;gap:10px;color:var(--fg);border-radius:0;transition:opacity 800ms ease,translate 800ms ease}
.theme-symbol{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle .theme-track{width:42px;height:26px;background:#777;box-shadow:0 0 0 1px rgba(255,255,255,.35)}
.theme-toggle .theme-knob{width:20px;height:20px;top:3px;left:3px}
.theme-toggle[aria-checked="true"] .theme-knob{transform:translateX(16px)}
.theme-toggle.is-floating{position:fixed;top:24px;left:50%;margin-left:-52px;z-index:1000;filter:drop-shadow(0 1px 3px var(--bg))}
.theme-toggle.is-hidden{opacity:0;translate:0 -12px;pointer-events:none}
.theme-toggle:focus-visible{opacity:1;translate:0 0;pointer-events:auto}
.credits-intro{font-size:clamp(19px,2vw,26px);line-height:1.5;max-width:850px;color:var(--page-secondary)}
.credits-layers{margin:40px calc(-1 * var(--pad,0px)) 0;overflow:hidden;padding:8px 0}
.credits-lane{overflow:hidden;border-top:1px solid var(--page-border)}
.credits-lane:last-child{border-bottom:1px solid var(--page-border)}
.credits-track{display:flex;width:max-content;animation:creditsDrift 155s linear infinite}
.credits-lane:nth-child(2) .credits-track{animation-duration:190s}
.credits-lane:nth-child(3) .credits-track{animation-duration:175s}
.credits-group{display:flex;flex-shrink:0}
.credit-card{position:relative;flex-shrink:0;width:clamp(320px,42vw,640px);min-height:220px;padding:32px 30px;text-align:left;border:0;border-right:1px solid var(--page-border);background:transparent;color:var(--fg);cursor:pointer;display:flex;align-content:center;align-items:baseline;flex-wrap:wrap;gap:12px;overflow:hidden}
.credit-name{font-size:clamp(27px,3.2vw,46px);line-height:1.08;letter-spacing:-.045em;font-weight:500;transition:transform 500ms ease}
.credit-year{font-size:16px;color:var(--page-secondary)}
.credit-info{display:flex;flex-direction:column;gap:6px;width:100%;font-size:clamp(19px,2vw,26px);line-height:1.35;opacity:0;transform:translateX(-24px);max-height:0;transition:opacity 450ms ease,transform 500ms ease,max-height 500ms ease}
.credit-info strong{font-weight:600}.credit-info>span{color:var(--page-secondary)}
.credit-card:is(:hover,:focus-visible,.is-selected) .credit-info{opacity:1;transform:translateX(0);max-height:150px}
.credit-card:is(:hover,:focus-visible,.is-selected){background:var(--soft)}
.credit-card:focus-visible{outline:2px solid var(--fg);outline-offset:-3px}
.credits-layers:is(:hover,:focus-within,.has-selection) .credits-track{animation-play-state:paused}
@keyframes creditsDrift{from{transform:translateX(-50%)}to{transform:translateX(0)}}
@media(prefers-reduced-motion:reduce){.credits-track{animation:none;width:auto;display:block}.credits-group{flex-wrap:wrap}.credits-group[aria-hidden]{display:none}.credit-card{width:50%}.credit-info{opacity:1;max-height:none;transform:none}.theme-toggle{transition:none}}
@media(max-width:600px){.credit-card{min-height:210px;padding:24px;width:82vw}.theme-toggle.is-floating{top:16px}.credits-layers{margin-top:28px}}
#project-experience .section-heading{display:grid;grid-template-columns:30% minmax(0,1fr);gap:4%;align-items:start}
#project-experience .credits-intro{font-size:clamp(19px,2vw,26px);line-height:1.5;margin:0;color:var(--page-secondary)}
.theme-toggle{color:inherit}.theme-toggle.is-floating{color:var(--fg)}
@media(max-width:750px){#project-experience .section-heading{display:block}#project-experience .eyebrow{margin-bottom:30px}}
/* Each credit layer moves and responds independently. */
.credits-lane,.credits-lane:last-child,.credit-card{border:0}
.credits-track{animation:none!important;will-change:transform}
.credits-lane{touch-action:pan-y;cursor:grab;user-select:none}
.credit-card{cursor:grab}
.credits-lane.is-dragging,.credits-lane.is-dragging .credit-card{cursor:grabbing}
.credit-card:is(:hover,:focus-visible,.is-selected) .credit-name{animation:rainbowShimmer 3200ms linear infinite}
@media(prefers-reduced-motion:reduce){.credits-track{transform:none!important}.credit-card:is(:hover,:focus-visible,.is-selected) .credit-name{animation:none}}
.credit-filter{border:0;border-radius:0;padding:6px 0;background:none;color:var(--page-secondary);font:inherit;font-size:24px;cursor:pointer;font-weight:400}
.credit-filter.active{font-weight:700;color:var(--fg)}
.credit-filter:hover{animation:rainbowShimmer 3200ms linear infinite}
.credits-filters{gap:clamp(20px,3vw,42px);margin-bottom:0}
.credits-lane[hidden]{display:none}
@media(max-width:750px){.credit-filter{font-size:20px}}
.credits-layers.is-filtering .credits-lane{pointer-events:none}
.credits-layers.is-filtering .credits-track{will-change:transform,opacity,translate,scale}
/* A soft glass backing keeps the floating appearance control legible. */
.theme-toggle.is-floating{isolation:isolate;filter:none}
.theme-toggle.is-floating::before{content:"";position:absolute;inset:-10px -14px;z-index:-1;border-radius:40px;background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(16px) saturate(135%);backdrop-filter:blur(16px) saturate(135%);border:1px solid rgba(128,128,128,.14);box-shadow:0 3px 18px rgba(0,0,0,.08);pointer-events:none}
html[data-theme="dark"] .theme-toggle.is-floating::before{background:rgba(25,25,25,.74);border-color:rgba(255,255,255,.12);box-shadow:0 3px 18px rgba(0,0,0,.18)}
.hero.theme-photo-reveal .hero-frame{transition:none!important}
/* Let the project streams run to both viewport edges without side borders. */
#project-experience .credits-layers{width:100vw;max-width:none;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);border:0;border-radius:0}
#project-experience :is(.credits-lane,.credits-track,.credits-group,.credit-card){border:0;box-shadow:none}
/* Fixed-height cards; only their inner contents scale to fit on reveal. */
#project-experience .credit-card{display:block;height:220px;min-height:220px;padding:0}
.credit-inner{position:absolute;left:30px;right:30px;top:28px;display:flex;flex-wrap:wrap;align-items:baseline;gap:12px;transform-origin:top left;transition:transform 480ms cubic-bezier(.22,.8,.22,1)}
#project-experience .credit-name{font-size:clamp(27px,3.2vw,46px);white-space:normal;letter-spacing:-.045em;line-height:1.08}
#project-experience .credit-info{height:auto;max-height:none;opacity:0;transform:translateX(-16px)}
#project-experience .credit-card:is(:hover,:focus-visible,.is-selected) .credit-inner{transform:scale(var(--credit-content-scale,1))}
#project-experience .credit-card:is(:hover,:focus-visible,.is-selected) .credit-info{opacity:1;transform:translateX(0)}
@media(max-width:600px){.credit-inner{left:24px;right:24px}}
/* Symmetric columns centre the arrow pair beneath the theme switch. */
.hero-bottom{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:18px}
.hero-bottom p{grid-column:1;grid-row:1;justify-self:start}
.hero-bottom .slideshow-arrows{grid-column:2;grid-row:1;justify-self:center;margin:0}
.hero-bottom>a{grid-column:3;grid-row:1;justify-self:end}
@media(max-width:750px){.hero-bottom p{grid-column:1/-1;grid-row:1}.hero-bottom .slideshow-arrows{grid-row:2}.hero-bottom>a{grid-row:2}}