:root{color-scheme:dark;--bg:#171918;--fg:#efefea;--muted:#a3a6a1;--line:#3c3f3b;--accent:#f39b6c}
*{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}
a:focus-visible{outline:2px solid var(--accent);outline-offset:7px}
.skip{position:fixed;left:20px;top:-70px;padding:12px;background:var(--fg);color:var(--bg);z-index:10}
.skip:focus{top:16px}
.page{min-height:100svh;max-width:1800px;margin:auto;padding:0 64px;display:flex;flex-direction:column}
header{display:flex;justify-content:space-between;align-items:center;padding:36px 0}
.identity{display:flex;align-items:center;gap:13px;font-size:16px;letter-spacing:-.5px}
.identity svg{width:32px;height:32px;fill:var(--accent)}
.header-contact{font-size:14px;padding:10px 0}
.header-contact span{margin-left:18px;color:var(--accent)}
.header-contact:hover{color:var(--accent)}
main{flex:1;display:flex;flex-direction:column;justify-content:center;padding:56px 0 78px}
.title-row{display:flex;align-items:start;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:48px;gap:30px}
h1{font-size:clamp(90px,13.3vw,205px);font-weight:500;letter-spacing:-.085em;line-height:.94;margin:0 0 0 -8px;white-space:nowrap}
.period{color:var(--accent)}
.corner{font-size:60px;line-height:1;margin-top:3px;color:var(--accent)}
.main-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:90px;padding-top:58px}
.short-rule{height:3px;width:36px;background:var(--accent);margin-bottom:26px}
h2{font-size:clamp(26px,2.7vw,42px);font-weight:400;letter-spacing:-1.5px;line-height:1.22;margin:0}
h2 span{color:var(--muted)}
.destinations{padding-top:4px}
.destination{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:22px 0;border-bottom:1px solid var(--line);position:relative}
.destination:first-child{padding-top:0}
.destination div{display:flex;flex-direction:column;gap:10px}
.link-title{font-size:21px;letter-spacing:-.5px}
.link-detail{font-size:13px;color:var(--muted)}
.link-arrow{display:flex;align-items:center;justify-content:center;width:43px;height:43px;border:1px solid var(--line);border-radius:50%;font-size:22px;transition:background .18s,color .18s,transform .18s}
.destination:hover .link-arrow,.destination:focus-visible .link-arrow{background:var(--accent);border-color:var(--accent);color:var(--bg);transform:rotate(45deg)}
.destination:hover .link-title,.destination:focus-visible .link-title{color:var(--accent)}
footer{border-top:1px solid var(--line);padding:25px 0 28px;display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:12px}
.footer-accent{color:var(--fg)}
footer a:hover{color:var(--accent)}
@media(min-width:1600px){main{padding-top:90px;padding-bottom:120px}
}
@media(max-width:1050px){.page{padding:0 36px}
.corner{font-size:42px}
.main-grid{gap:45px}
h1{margin-left:-5px}
.link-title{font-size:18px}
}
@media(max-width:650px){.page{padding:0 24px}
header{padding:25px 0}
.identity{font-size:14px}
.identity svg{width:27px;height:27px}
.header-contact{font-size:12px}
.header-contact span{margin-left:9px}
main{padding:58px 0 62px;justify-content:start}
.title-row{padding-bottom:36px;gap:0;position:relative}
h1{font-size:clamp(65px,14.2vw,92px);letter-spacing:-.085em;margin-left:-4px}
.corner{display:none}
.main-grid{grid-template-columns:1fr;gap:46px;padding-top:36px}
h2{font-size:29px;letter-spacing:-1px}
.short-rule{margin-bottom:23px;width:28px}
.link-title{font-size:20px}
.destination{padding:24px 0}
.destination div{gap:8px}
.link-detail{font-size:12px}
footer{font-size:11px;padding:23px 0;flex-wrap:wrap}
footer>a{display:none}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*::before,*::after{transition:none!important;animation:none!important}
}

.header-nav{display:flex;align-items:center;gap:32px;font-size:14px}
.header-nav>a:hover{color:var(--accent)}
.resume{display:grid;grid-template-columns:1.1fr 1fr;gap:90px;border-top:1px solid var(--line);padding:35px 0 44px;scroll-margin-top:25px}
.resume h2{font-size:25px;letter-spacing:-.7px}
.resume-links{display:grid;gap:22px}
.resume-links a{display:flex;justify-content:space-between;gap:20px;font-size:15px}
.resume-links a:hover{color:var(--accent)}
.pdf{font-size:11px;color:var(--muted);white-space:nowrap}
.pdf span{color:var(--accent);margin-left:14px}
@media(max-width:650px){.header-nav{gap:18px;font-size:12px}
.resume{grid-template-columns:1fr;gap:27px;padding:30px 0 38px}
.resume-links a{font-size:14px}
main{padding-bottom:48px}
}

main{display:block;padding-top:70px}
.main-grid{padding-bottom:85px}
.work{border-top:1px solid var(--line);padding-top:35px;scroll-margin-top:30px}
.work-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px}
.work-heading h2{font-size:30px;letter-spacing:-1px}
.work-heading>span{font-size:12px;color:var(--muted)}
.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px}
.project-visual{display:block;aspect-ratio:1.55;overflow:hidden;position:relative}
.inspect-visual{background:#b7b3d6;padding:30px 30px 0}
.inspect-visual img{width:100%;height:auto;display:block;box-shadow:0 12px 35px #2223;transition:transform .25s}
.inspect-visual:hover img,.inspect-visual:focus-visible img{transform:translateY(-8px)}
.image-caption{position:absolute;bottom:0;left:0;right:0;background:#252330;color:#efedf6;padding:13px 20px;font-size:11px;display:flex;justify-content:space-between}
.project-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin-top:25px}
.project h3{font-size:25px;letter-spacing:-.8px;font-weight:400;margin:12px 0}
.project p{font-size:14px;color:var(--muted);line-height:1.7;max-width:490px;margin:0}
.project-link{display:inline-flex;gap:30px;border-bottom:1px solid var(--line);padding-bottom:8px;margin-top:22px;font-size:13px}
.project-link:hover{color:var(--accent)}
.project-link span{color:var(--accent)}
@media(max-width:650px){main{padding-top:50px}
.main-grid{padding-bottom:55px}
.project-grid{grid-template-columns:1fr;gap:45px}
.work-heading{margin-bottom:25px}
.work-heading h2{font-size:27px}
.work-heading>span{display:none}
.inspect-visual{padding:22px 22px 0}
.project-meta{margin-top:20px}
.header-nav{gap:13px}
.identity{gap:7px}
.header-contact{font-size:11px}
.header-contact span{margin-left:3px}
}

.skip:not(:focus){clip-path:inset(50%);width:1px;height:1px;padding:0;overflow:hidden;white-space:nowrap}

.tupelo-visual{background:#e3dbcb;padding:30px 30px 0}
.tupelo-visual img{display:block;width:100%;height:auto;transition:transform .25s}
.tupelo-visual:hover img,.tupelo-visual:focus-visible img{transform:translateY(-8px)}
.tupelo-visual .image-caption{background:#363b30}
@media(max-width:650px){.tupelo-visual{padding:22px 22px 0}
}


/* Gate 2: resilient layout and keyboard/touch interaction. */
.arrow-icon{width:1em;height:1em;display:inline-block;vertical-align:-.12em;flex-shrink:0;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

.header-contact{white-space:nowrap}

.identity,.header-nav>a{min-height:44px;display:inline-flex;align-items:center}

.header-nav>a{justify-content:center}

.header-contact span{display:inline-flex}

.link-arrow{flex-shrink:0}

.project{display:flex;flex-direction:column;min-width:0}

.project-link{align-self:flex-start;align-items:center;min-height:44px;margin-top:auto;padding-top:14px}

.project p{margin-bottom:8px}

.resume{margin-top:70px;padding-bottom:0}

.resume-links a{min-height:44px;align-items:center}

.pdf{display:inline-flex;align-items:center}

footer{align-items:center}

footer a{min-height:44px;min-width:44px;display:inline-flex;align-items:center;gap:8px}

a:focus-visible{border-radius:2px}

main:focus,section[tabindex]:focus{outline:none}

@media(max-width:1050px){.resume{gap:45px}
}

@media(max-width:650px){.resume{gap:20px;margin-top:48px}
.project-grid{gap:40px}
footer>a{display:inline-flex}
h1{font-size:clamp(52px,14.2vw,92px)}
}

@media(max-width:420px){header{flex-wrap:wrap;gap:12px;padding-bottom:8px}
.header-nav{width:100%;justify-content:space-between;gap:12px;font-size:13px}
.header-contact{font-size:13px}
main{padding-top:40px}
.work-heading h2{font-size:26px}
}


.header-nav>a{min-width:44px}

/* Keep the approved teaser content; add routes into each case study. */
.project-actions{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;margin-top:auto;padding-top:6px}
.project-actions .project-link{margin-top:0}
.case-study-link{color:var(--fg)}
.project-actions .project-link:not(.case-study-link){color:var(--muted)}
.project-actions .project-link:hover{color:var(--accent)}