:root{--sand:#EADFC8;--paper:#F5EEDF;--forest:#2F4A3A;--rust:#C2562B;--rustt:#A3441F;--ink:#2A2420;--mut:#6B5D4F;--sea:#2E5560;--m:clamp(14px,5vw,80px)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--sand);color:var(--ink);font:17px/1.6 "DM Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--forest)}.skip{position:absolute;left:-999px}.skip:focus{left:10px;top:10px;z-index:99;background:var(--ink);color:#fff;padding:8px}
.mono{font:400 12px/1.4 "DM Mono",monospace;letter-spacing:.05em;text-transform:uppercase}.muted{color:var(--mut)}.small{font-size:11px}
.bg{position:fixed;inset:0;overflow:hidden;z-index:0;background:var(--sand)}.strip{position:absolute;left:0;top:0;width:100%;background:url(/img/topo-desktop.webp) top center/100% auto no-repeat;will-change:transform}
.route{position:absolute;left:0;top:0;width:100%;z-index:1;pointer-events:none;overflow:visible}.route circle{fill:var(--paper);stroke:var(--rust);stroke-width:3}
.alt{position:fixed;left:18px;bottom:16px;z-index:5;background:var(--paper);border:1px solid #d6c8ab;border-radius:99px;padding:7px 13px;display:flex;gap:10px;color:var(--ink)}.alt b{color:var(--rustt);font-weight:400}
main{position:relative;z-index:2}
.nav{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:14px var(--m)}
.brand{font:400 20px "Young Serif",serif;color:var(--forest);text-decoration:none;background:var(--paper);padding:6px 14px;border-radius:99px}
.nav ul{display:flex;gap:6px;list-style:none;margin:0;padding:6px;background:var(--paper);border-radius:99px;border:1px solid #d6c8ab}.nav ul a{display:block;text-decoration:none;font-weight:600;font-size:14px;color:var(--ink);padding:7px 13px;border-radius:99px;transition:background .3s}.nav ul a:hover,.nav ul a.on{background:var(--sand)}.nav .pill{background:var(--forest);color:var(--paper)}.nav .pill:hover{background:var(--ink)}
.burger{display:none;width:46px;height:46px;border-radius:50%;border:0;background:var(--forest);position:relative;cursor:pointer;z-index:3}.burger i{position:absolute;left:14px;right:14px;height:2px;background:var(--paper);transition:transform .45s cubic-bezier(.16,1,.3,1)}.burger i:first-child{top:19px}.burger i:last-child{top:26px}.burger[aria-expanded=true] i:first-child{transform:translateY(3.5px) rotate(45deg)}.burger[aria-expanded=true] i:last-child{transform:translateY(-3.5px) rotate(-45deg)}
.hero{min-height:100svh;display:flex;align-items:flex-end;padding:110px var(--m) 8vh}
.panel{background:var(--paper);border-radius:28px;padding:clamp(26px,4.5vw,64px);box-shadow:0 2px 0 #d4c6a8,0 30px 60px -40px rgba(42,36,32,.35);max-width:1280px;margin:0 auto;position:relative}
.hero-p{max-width:900px;margin:0}.sec{padding:0 var(--m)}.gap{height:clamp(160px,32vh,380px)}.gap.end{height:60vh}
.coord{font:600 12px/1.4 "DM Sans";letter-spacing:.12em;color:var(--rustt);margin:0 0 12px}.tag{display:inline-block;background:var(--forest);color:var(--paper);border-radius:99px;padding:6px 13px;font-size:13px;font-weight:600}
h1{font:400 clamp(58px,10vw,164px)/.9 "Young Serif",serif;color:var(--forest);margin:16px 0;letter-spacing:-.02em}h1 span,h2 span{color:var(--rust)}
h2{font:400 clamp(40px,5vw,64px)/1 "Young Serif",serif;color:var(--forest);margin:0 0 28px}.sub{font:400 28px "Young Serif";color:var(--forest);margin:40px 0 8px}h3{font:400 22px "Young Serif";color:var(--forest);margin:0 0 6px}
.lede{font-size:clamp(18px,1.8vw,22px);max-width:660px}.big{font-size:21px}
.btn{display:inline-block;background:var(--forest);color:var(--paper);text-decoration:none;font-weight:600;padding:12px 20px;border-radius:99px;border:2px solid var(--forest);margin:0 10px 10px 0;cursor:pointer;font:600 15px "DM Sans";transition:transform .3s}.btn:hover{transform:translateY(-2px)}.btn.ghost{background:transparent;color:var(--forest)}
.two{display:grid;grid-template-columns:1fr 1.2fr;gap:40px;align-items:start}.three{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
.vid{margin:0;border-radius:18px;overflow:hidden;position:relative;background:var(--sand)}.vid video{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}.vid figcaption{position:absolute;left:10px;bottom:10px;background:var(--paper);color:var(--ink);padding:5px 9px;border-radius:99px}
.tags{list-style:none;padding:0;margin:10px 0 0;display:flex;flex-wrap:wrap;gap:7px}.tags li{border:1.5px solid var(--forest);color:var(--forest);border-radius:99px;padding:5px 11px;font-size:14px;font-weight:600}
.work{display:grid;grid-template-columns:repeat(2,1fr);gap:26px}.wk{text-decoration:none;color:var(--ink)}.wk .v{border-radius:18px;overflow:hidden;background:var(--sand)}.wk video{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;transition:transform .8s}.wk:hover video{transform:scale(1.03)}.wk h3{margin-top:12px}
.stops{list-style:none;margin:0;padding:0 0 0 34px;border-left:3px dashed var(--rust)}.stop{position:relative;margin:0 0 26px;cursor:pointer}.stop:before{content:"";position:absolute;left:-46px;top:6px;width:16px;height:16px;border-radius:50%;background:var(--rust);border:4px solid var(--paper);box-shadow:0 0 0 2px var(--rust)}
.stop .yr{color:var(--rustt)}.stop h3{font-size:clamp(20px,2.2vw,26px)}.stop .org{color:var(--ink)}.stop ul{margin:6px 0 0;padding-left:18px;max-height:0;overflow:hidden;transition:max-height .6s ease}.stop.open ul{max-height:700px}.stop .more{color:var(--mut);margin:4px 0 0}
.ph{color:var(--rustt);border:1.5px dashed var(--rustt);border-radius:6px;padding:1px 7px;font:600 12px "DM Mono";text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.skills{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-bottom:30px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.cards article{background:var(--sand);border-radius:18px;padding:22px}
.dark{background:var(--forest);color:var(--paper)}.dark h2,.dark a{color:var(--paper)}.dark .coord{color:#F2C9A8}.dark .btn{background:var(--paper);color:var(--forest);border-color:var(--paper)}
.cform{display:grid;gap:14px;max-width:620px;margin-bottom:24px}.cform label{display:grid;gap:4px;font:600 12px "DM Sans";letter-spacing:.1em;text-transform:uppercase}.cform input,.cform textarea{font:17px "DM Sans";background:var(--paper);color:var(--ink);border:0;border-radius:12px;padding:12px 14px}.cform .btn{justify-self:start}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s,transform .9s cubic-bezier(.16,1,.3,1)}.reveal.in{opacity:1;transform:none}
@media(max-width:700px){.strip{background-image:url(/img/topo-mobile.webp)}.burger{display:block}.nav ul{position:fixed;inset:0;border-radius:0;border:0;flex-direction:column;justify-content:center;padding:0 28px;gap:4px;background:var(--paper);clip-path:circle(0 at calc(100% - 37px) 37px);transition:clip-path .7s cubic-bezier(.16,1,.3,1)}.nav.open ul{clip-path:circle(150% at calc(100% - 37px) 37px)}
.nav ul a{font:400 40px "Young Serif";color:var(--forest);padding:6px 0;background:none!important}.nav .pill{color:var(--rustt)}.nav ul li{opacity:0;transform:translateY(18px);transition:.5s}.nav.open ul li{opacity:1;transform:none}
.nav.open ul li:nth-child(1){transition-delay:.15s}.nav.open ul li:nth-child(2){transition-delay:.2s}.nav.open ul li:nth-child(3){transition-delay:.25s}.nav.open ul li:nth-child(4){transition-delay:.3s}.nav.open ul li:nth-child(5){transition-delay:.35s}.nav.open ul li:nth-child(6){transition-delay:.4s}
.two,.three,.work,.skills,.cards{grid-template-columns:1fr}.panel{border-radius:22px}.alt{left:10px;bottom:10px;font-size:10px}.hero{padding-bottom:12vh}.route{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}
.life-g{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:28px}.lf{margin:0;position:relative;border-radius:14px;overflow:hidden;background:#d9ccb0;border:1px solid #d6c8ab}.lf.wide{grid-column:span 2}.lf video,.lf img{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}.lf.tall img{aspect-ratio:auto}.life-g{grid-auto-rows:minmax(0,auto)}.lf.wide video,.lf.wide img{aspect-ratio:16/10}.lf.tall{grid-row:span 1}.lf.tall img{aspect-ratio:8/10}
.lf figcaption{position:absolute;left:10px;bottom:10px;background:var(--paper);color:var(--ink);font-size:11px;letter-spacing:.04em;padding:5px 10px;border-radius:99px;border:1px solid #d6c8ab}
@media(min-width:701px){.life-g{grid-template-columns:2fr 1fr 1fr}.lf.wide{grid-column:span 1}.lf.wide:last-child{grid-column:1/-1}.lf.wide:last-child img{aspect-ratio:21/8}.lf.tall img,.lf.wide:first-child video{aspect-ratio:auto;height:100%;min-height:340px}}
@media(max-width:700px){.life-g{grid-template-columns:1fr 1fr;gap:10px}.lf.wide{grid-column:1/-1}.lf figcaption{font-size:10px;left:7px;bottom:7px;padding:4px 8px}}
.lf.wide:last-child img{object-position:50% 72%}

.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}.cform .st{min-height:1.2em;margin:8px 0 0}.cform .st.done{font-size:15px}
