/* Homepage: a native-scroll cinematic entrance and the original modular, brick-like grammar.
   The approved About photo/text proportions remain in site.css. */
[hidden]{display:none!important}
:root{--motion-out:cubic-bezier(.16,1,.3,1)}
.skip-link{position:fixed;top:1rem;left:1rem;z-index:100;padding:.8rem 1rem;color:var(--ink);background:var(--cyan-light);transform:translateY(-180%)}
.skip-link:focus{transform:none}
summary:focus-visible{outline:3px solid var(--focus);outline-offset:5px}
.opening{position:relative;height:100svh;min-height:26rem;display:grid;place-items:center;overflow:clip;background:var(--night);color:var(--night-ink)}
.brick-name{margin:0;display:flex;align-items:center;gap:clamp(1rem,3vw,2.5rem);--brick-gap:clamp(.15rem,.6vw,.4rem);--letter-width:clamp(1rem,6vw,4rem)}
.brick-word{display:flex;justify-content:center;gap:var(--brick-gap)}
.brick-word:last-child{color:var(--coral)}
.brick-letter{position:relative;display:block;flex:0 0 var(--letter-width);width:var(--letter-width)}
.brick-letter svg{display:block;width:100%;height:auto;overflow:visible}
.brick-face{fill:currentColor;stroke:color-mix(in srgb,currentColor 72%,var(--night));stroke-width:.35}
.brick-stud{fill:color-mix(in srgb,currentColor 88%,white);stroke:color-mix(in srgb,currentColor 65%,var(--night));stroke-width:.5}
.is-typing .brick-letter{animation:brick-type .12s var(--motion-out) both;animation-delay:calc(.16s + var(--letter) * .15s)}
.is-typing .brick-letter::after{content:"";position:absolute;bottom:0;right:calc(-1 * var(--brick-gap));width:calc(var(--brick-gap) * .7);height:12%;background:var(--cyan-light);opacity:0;animation:brick-caret .15s steps(1,end);animation-delay:calc(.16s + var(--letter) * .15s)}
@keyframes brick-type{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes brick-caret{0%{opacity:1}100%{opacity:0}}
.enter-arrow{position:absolute;z-index:2;bottom:2rem;left:calc(50% - 1.8rem);display:grid;place-items:center;width:3.6rem;height:3.6rem;border:1px solid var(--ink);border-radius:50%;background:var(--cyan-light);color:var(--ink);transition:opacity .5s var(--motion-out),transform .5s var(--motion-out),background .2s}
.enter-arrow:hover{background:var(--coral);transform:translateY(3px)}
.enter-arrow svg,.slogan-next svg,.projects-controls svg{width:1.4rem;height:1.4rem;fill:none;stroke:currentColor;stroke-width:1.6}
.home-nav{position:fixed;inset:0 0 auto;z-index:30;transition:transform .4s var(--motion-out);border-bottom:1px solid var(--line)}
.home-nav:not(.is-visible){transform:translateY(-100%)}
.home-nav:focus-within{transform:none}
.nav-inner{width:min(100% - 3rem,var(--max))}
.nav-links a{border:0;padding-inline:1rem;position:relative}
.nav-links a::after{content:"";position:absolute;bottom:.9rem;left:1rem;right:1rem;height:2px;background:var(--coral);transform:scaleX(0);transform-origin:left;transition:transform .2s var(--motion-out)}
.nav-links a:hover{background:transparent;color:var(--cyan-light)}
.nav-links a:hover::after,.nav-links a[aria-current="location"]::after{transform:scaleX(1)}
.page-content,body>footer{position:relative;z-index:2}
.slogan{height:160svh;min-height:100svh;display:block;background:var(--night);color:var(--night-ink);scroll-margin-top:0;overflow:clip}
.slogan-inner{position:sticky;top:0;width:min(100% - 3rem,var(--max));height:100svh;margin:auto;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:5rem 0}
.slogan h2{width:100%;margin:0;font:750 clamp(2.6rem,9vw,7.5rem)/1.15 var(--font-display);letter-spacing:-.04em;text-align:center}
.slogan h2:focus{outline:none}
.slogan-line{display:block;white-space:nowrap}
.slogan-line--left{transform:translate3d(calc(-1 * var(--split-distance,0px)),0,0)}
.slogan-line--right{margin-top:.12em;color:var(--coral);transform:translate3d(var(--split-distance,0px),0,0)}
.slogan-next{opacity:var(--slogan-arrow-opacity,1);display:grid;place-items:center;margin-top:3rem;border:1px solid var(--cyan-light);width:3.3rem;height:3.3rem;border-radius:50%;color:var(--cyan-light);transition:background .2s,color .2s}
.slogan-next:hover{color:var(--night);background:var(--cyan-light)}
.section-shell{width:min(100% - 3rem,var(--max));padding-block:clamp(4.5rem,8vw,7rem)}
.section-head{flex-direction:row;align-items:center;gap:2rem;border-top:0;padding:0;margin-bottom:3rem}
.section-head::after{content:"";height:1px;flex:1;background:currentColor;opacity:.45}
.section-head h2{font-size:clamp(3.2rem,6vw,5.5rem);line-height:1;letter-spacing:-.04em}
#about .section-shell{padding-block:clamp(5rem,8vw,7rem)}
/* A compact award wall: the NEC occupies one large block; writing and debate stack alongside it. */
.recognition-board{display:grid;grid-template-columns:1.1fr 1fr;gap:1.25rem}
.recognition{border:var(--border);padding:1.75rem 2rem;display:flex;align-items:flex-start;justify-content:space-between;gap:2rem;background:var(--paper);color:var(--ink)}
.recognition h3{margin:0;max-width:17ch;font:700 clamp(1.4rem,2.2vw,1.9rem)/1.12 var(--font-display);letter-spacing:-.03em}
.recognition h3 span{display:block;margin-top:.75rem;font:400 .8rem/1.5 var(--font-body);color:var(--muted);letter-spacing:0}
.recognition p{margin:0;color:var(--muted);font-size:.92rem}
.recognition .award-result{margin:0 0 .6rem;color:var(--ink);font:700 clamp(1.35rem,2.1vw,1.75rem)/1.1 var(--font-display);letter-spacing:-.03em}
.recognition--nec{grid-row:span 2;flex-direction:column;min-height:26rem;background:var(--berry);color:var(--night-ink)}
.recognition--nec p,.recognition--nec h3 span{color:var(--night-ink)}
.recognition--nec h3{font-size:clamp(2rem,3.5vw,3.25rem);max-width:15ch}
.recognition--nec .award-result{font-size:clamp(2.6rem,4.4vw,4rem);color:var(--cyan-light)}
.recognition--locke{background:color-mix(in oklch,var(--paper) 85%,var(--cyan-light));flex-direction:column;gap:1.5rem}
.recognition--locke h3{max-width:none}
.recognition--locke>div{width:100%}
.recognition--debate{background:color-mix(in oklch,var(--paper) 92%,var(--coral));flex-direction:column;gap:1.5rem}
.recognition--debate h3{max-width:none}
.recognition--debate p,.recognition--debate h3 span{color:var(--ink)}
.text-link{display:inline-flex;gap:.5rem;align-items:center;margin-top:.7rem;min-height:32px;text-underline-offset:.3em;font-size:.9rem}
.projects-controls{display:flex;justify-content:flex-end;gap:.5rem;margin:-1.5rem 0 1.25rem}
.projects-controls button{display:grid;place-items:center;min-width:44px;min-height:44px;padding:.65rem;color:var(--night-ink);background:transparent;border:1px solid var(--line);font:500 .8rem/1 var(--font-body);cursor:pointer}
.projects-controls button:hover{background:var(--cyan-light);color:var(--night)}
.projects-rail{display:grid;grid-auto-flow:column;grid-auto-columns:88%;gap:1.5rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:4px 0 1rem;overflow-anchor:none}
.projects-rail::-webkit-scrollbar{display:none}
.projects-rail.is-repositioning{scroll-snap-type:none}
.project-cover{display:block;width:100%;height:100%;min-height:20rem;max-height:32rem;object-fit:cover;margin:0;border:1px solid var(--ink);align-self:center}
.project-body{display:flex;flex-direction:column;min-width:0}
article.project-link{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2rem}
.project-cover.project-cover--aura{height:auto;min-height:0;max-height:none;aspect-ratio:auto;object-fit:contain;background:transparent;border:0}
.project-cover--rebuildr{object-position:center 65%}
.project-link{display:flex;flex-direction:column;min-width:0;padding:2rem 1.6rem;color:var(--ink);background:var(--paper);text-decoration:none;scroll-snap-align:start;border:2px solid var(--ink);transition:background .2s}
.project-link--aura{background:var(--coral)}
.project-link a{color:inherit}
.project-site{display:flex;align-items:center;min-height:44px;margin-bottom:1rem;font-size:.9rem;text-underline-offset:.3em}
.project-link--rebuildr{background:var(--cyan-light)}
.project-link--research{background:var(--paper)}
.project-link h3{margin:0 0 1.5rem;font:750 clamp(1.9rem,3.3vw,2.8rem)/1.06 var(--font-display);letter-spacing:-.035em;min-height:2.15em;overflow-wrap:anywhere}
.project-link h3 span{display:block;font-size:1.25rem;font-weight:400;margin-top:.6rem}
.project-link p{margin:0 0 1rem;font-size:.96rem;line-height:1.6}
.project-link .project-question{font-weight:600;font-size:1.16rem;line-height:1.3}
.project-evidence{margin:1rem 0 2rem;padding-top:1rem;border-top:1px solid currentColor;font-size:.84rem;line-height:1.7}
.project-open{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:auto;padding-top:1rem;border-top:1px solid currentColor;font-size:.85rem;font-weight:600;text-decoration:underline;text-underline-offset:.3em}
.project-open svg{width:1.3rem;height:1.3rem;fill:none;stroke:currentColor;stroke-width:1.5;flex-shrink:0;transition:transform .2s var(--motion-out)}
.project-link:hover .project-open svg{transform:translate(3px,-3px)}
.project-link:focus-visible{outline-offset:-7px;outline-color:var(--ink)}
/* Five readable summaries, with the original detail available on demand. */
.experience-layout{grid-template-columns:minmax(0,1.4fr) minmax(16rem,.7fr);gap:clamp(2.5rem,7vw,7rem);align-items:start}
.experience-entry{border-top:1px solid var(--line)}
.certifications{display:flex;flex-wrap:wrap;align-items:baseline;gap:1rem 3rem;margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--line)}
.certifications h3{margin:0;font:600 1rem/1.5 var(--font-display)}
.certifications a{display:inline-block;padding:.5rem 0;color:var(--cyan-light);font-weight:500;text-underline-offset:.25em}
.certifications a:hover{color:var(--night-ink)}
.certifications p{margin:.25rem 0 0;color:var(--text-on-dark-secondary);font-size:.875rem;line-height:1.6}
.experience-entry:last-child{border-bottom:1px solid var(--line)}
.experience-entry summary{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;list-style:none;cursor:pointer;min-height:6.25rem;padding:1.25rem 0}
.experience-entry summary::-webkit-details-marker{display:none}
.experience-entry summary strong{display:block;font:700 clamp(1.25rem,2vw,1.7rem)/1.2 var(--font-display);letter-spacing:-.025em}
.experience-entry summary span span{display:block;margin-top:.5rem;color:var(--text-on-dark-secondary);font-size:.87rem}
.experience-entry summary svg{width:1.5rem;height:1.5rem;flex-shrink:0;fill:none;stroke:var(--cyan-light);stroke-width:1.5;transition:transform .25s var(--motion-out)}
.experience-entry[open] summary svg{transform:rotate(45deg)}
.experience-entry summary:hover strong{color:var(--cyan-light)}
.experience-detail p{margin:0;padding:0 2.5rem 1.5rem 0;color:var(--text-on-dark-secondary);max-width:66ch;font-size:.98rem;line-height:1.7}
.skills-panel{padding:2rem;transform:rotate(1deg);border:2px solid var(--ink);background:var(--cyan-light)}
.skills-panel h3{font-size:2.6rem;line-height:1;letter-spacing:-.04em;margin-bottom:1.5rem}
.skill-group{padding:1rem 0}
.skill-group:last-child{padding-bottom:0}
.skill-group h4{font-family:var(--font-body);letter-spacing:0;text-transform:none;font-size:1rem;line-height:1.4}
.skill-group p{line-height:1.7;font-size:.92rem}
/* A photographic cover and two smaller objects, instead of three identical text previews. */
.interests-cabinet{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:1.5rem;align-items:stretch}
.interest-story{text-decoration:none;min-width:0;display:flex;flex-direction:column;border:var(--border);background:var(--paper);overflow:hidden}
.photography-story{grid-row:auto}
.story-photo{position:relative;overflow:hidden;isolation:isolate}
.story-photo>img:first-child{width:100%;height:100%;object-fit:cover}
.photography-story .story-photo{min-height:29rem;flex:1}
.photography-story .story-photo>img:first-child{position:absolute;inset:0;object-position:47% center}
.story-photo .story-inset{position:absolute;bottom:1.5rem;right:1.25rem;width:35%;height:auto;max-height:65%;object-fit:cover;border:5px solid var(--paper);transform:rotate(4deg)}
.film-story .story-photo{height:14rem}
.film-story .story-photo>img:first-child{object-position:center 48%}
.film-story .story-inset{width:21%;max-height:80%;border-width:4px;transform:rotate(-5deg)}
.story-copy{padding:1.5rem;display:flex;flex-direction:column;align-items:flex-start;flex:1}
.photography-story .story-copy{flex:0}
.story-copy h3,.philosophy-title h3{margin:0;font:750 2rem/1.1 var(--font-display);letter-spacing:-.03em}
.story-copy p{margin:.7rem 0 1rem;max-width:64ch;line-height:1.6;color:var(--muted);font-size:.95rem}
.story-cta{display:block;padding-top:.6rem;margin-top:auto;font-size:.9rem;font-weight:600;text-decoration:underline;text-underline-offset:.3em}
.story-cta span{margin-left:.4rem}
.interest-story:hover .story-cta{color:var(--berry)}
.philosophy-story{background:var(--cyan-light);padding:1.75rem;justify-content:space-between}
.philosophy-title>p{margin:1.5rem 0 0;font:650 clamp(1.9rem,3vw,2.65rem)/1.1 var(--font-display);letter-spacing:-.03em;color:var(--ink)}
.philosophy-story .story-copy{padding:0;flex:0}
.philosophy-story .story-copy p{margin-top:1.25rem}
.contact h2{font-size:clamp(3.5rem,8vw,6rem);line-height:1;letter-spacing:-.04em}
.contact .kicker{font-family:var(--font-body);text-transform:none;letter-spacing:0;font-weight:500;font-size:1.125rem}
@media(max-width:62rem){
  .nav-links a{padding-inline:.75rem}
  .projects-rail{grid-auto-columns:94%}
  .experience-layout{gap:2.5rem}
  .recognition{padding:1.5rem}
}
@media(max-width:50rem){
  
  .nav-links a::after{display:none}
  .nav-inner,.section-shell,.slogan-inner{width:calc(100% - 2rem)}
  .nav-toggle{min-height:44px}
  .slogan-inner{padding-block:6rem 4rem}
  .slogan h2{font-size:clamp(1.65rem,8.4vw,4.5rem)}
  .section-head{gap:1rem;margin-bottom:2rem}
  .section-head h2{font-size:clamp(2.7rem,8.5vw,4rem)}
  .recognition-board{gap:1rem;grid-template-columns:1fr 1fr}
  .recognition--nec{grid-column:1/-1;grid-row:auto;min-height:16rem}
  .recognition--nec h3{max-width:none}
  .recognition h3{font-size:1.35rem}
  .recognition--nec h3{font-size:2.2rem}
  .projects-rail{grid-auto-columns:96%}
  article.project-link{gap:1rem;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);padding:1.25rem}
  .project-cover{min-height:12rem;max-height:24rem}
  .projects-controls{margin-top:0}
  .project-link{min-height:30rem}
  .experience-layout{grid-template-columns:1fr}
  .skills-panel{transform:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;padding:1.5rem}
  .skills-panel h3{grid-column:1/-1;margin-bottom:.5rem}
  .skill-group{padding-bottom:0}
  .interests-cabinet{grid-template-columns:1fr}
  .photography-story{grid-row:auto}
  .photography-story .story-photo{min-height:0;aspect-ratio:4/3;flex:none}
  .film-story .story-photo{height:auto;aspect-ratio:16/9}
  .philosophy-story{padding:1.5rem}
}
@media(max-width:34rem){
  .recognition-board{grid-template-columns:1fr}
  .recognition--nec{grid-column:auto}
  .recognition--locke,.recognition--debate{gap:1.25rem}
  .skills-panel{grid-template-columns:1fr}
  .skill-group{padding-top:1rem}
}
@media(prefers-reduced-motion:reduce){
  .is-typing .brick-letter{animation:none}
  .is-typing .brick-letter::after{display:none}
  .slogan{height:100svh}
  .slogan-line{transform:none}
  .slogan-next{opacity:1}
  .slogan-inner,.enter-arrow,.home-nav,.project-open svg{transition:none;transform:none}
  .home-nav:not(.is-visible){transform:translateY(-100%)}
  .experience-entry summary svg{transition:none}
}