/* Marie Larson — portfolio */
body{margin:0;background:#FAF7F2;color:#1a1a1a;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:#1a1a1a}
a:hover{color:#8a6f4d}
.shell{min-height:100vh;display:flex;flex-direction:column}
main{flex:1;width:100%;box-sizing:border-box}
.site-header{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:12px;max-width:1040px;width:100%;margin:0 auto;padding:28px 24px;box-sizing:border-box}
.wordmark{text-decoration:none;font-size:13px;letter-spacing:0.02em}
.site-nav{display:flex;gap:22px;font-size:13px;flex-wrap:wrap}
.site-nav a{text-decoration:none;color:rgba(26,26,26,0.55)}
.site-nav a:hover{color:#8a6f4d}
.site-nav a[aria-current="page"]{color:#1a1a1a;border-bottom:1px solid #1a1a1a;padding-bottom:1px}
.nav-toggle{display:none;background:none;border:0;padding:6px 0 6px 16px;margin:0;cursor:pointer;color:#1a1a1a;align-self:center}
.nav-toggle svg{display:block}
@media (max-width:620px){
.js .nav-toggle{display:block}
.js .site-nav{display:none;width:100%;flex-direction:column;gap:0;margin-top:10px;border-top:1px solid rgba(26,26,26,0.25)}
.js .site-nav.open{display:flex}
.js .site-nav a{padding:14px 0;font-size:15px;border-bottom:1px solid rgba(26,26,26,0.12)}
.js .site-nav a[aria-current="page"]{border-bottom:1px solid #1a1a1a}
}
.mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;letter-spacing:0.06em;color:rgba(26,26,26,0.45)}
.intro{max-width:640px;margin:0 auto;padding:9vh 24px 0;box-sizing:border-box}
.intro .kicker{margin:0}
.intro h1{font-size:26px;font-weight:400;margin:10px 0 0;letter-spacing:-0.01em}
.intro .lede{font-size:15px;line-height:1.55;color:rgba(26,26,26,0.75);margin:22px 0 0;max-width:44ch}
.packages{max-width:760px;margin:0 auto;padding:72px 24px 0;box-sizing:border-box;display:flex;flex-direction:column;gap:80px}
.package{text-decoration:none;display:block}
.package img{width:100%;height:auto;display:block;border:1px solid rgba(26,26,26,0.12)}
.package .t{display:block;font-size:15px;margin-top:12px}
.package .m{display:block;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:10.5px;letter-spacing:0.05em;color:rgba(26,26,26,0.5);margin-top:4px}
.package.narrow{max-width:520px}
.package.banner{display:grid;grid-template-columns:minmax(180px,290px) 1fr;gap:28px;align-items:end}
.package.banner .label{padding-bottom:2px}
.package.banner .m{line-height:1.7}
.next-nav{max-width:640px;margin:0 auto;padding:88px 24px 0;box-sizing:border-box}
.rowlink{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:18px 0;border-top:1px solid rgba(26,26,26,0.25);border-bottom:1px solid rgba(26,26,26,0.25);text-decoration:none}
.rowlink .t{font-size:16px}
.rowlink .m{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;color:rgba(26,26,26,0.45);white-space:nowrap}
.site-footer{max-width:1040px;width:100%;margin:0 auto;padding:56px 24px 24px;box-sizing:border-box;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:12px;color:rgba(26,26,26,0.5)}
.site-footer a{color:rgba(26,26,26,0.5);text-decoration:none}

/* Home */
.home-main{flex:1;width:100%;max-width:620px;margin:0 auto;padding:11vh 24px 80px;box-sizing:border-box}
.home-main h1{font-size:13px;font-weight:400;margin:0;letter-spacing:0.02em}
.home-main .sub{font-size:13px;color:rgba(26,26,26,0.5);margin:2px 0 0}
.home-main .lede{font-size:16px;line-height:1.55;margin:44px 0 56px;max-width:34ch}
.entries{border-top:1px solid rgba(26,26,26,0.25)}
.entries a{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:18px 0;border-bottom:1px solid rgba(26,26,26,0.25);text-decoration:none}
.entries .t{font-size:17px}
.entries .m{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;color:rgba(26,26,26,0.45);white-space:nowrap}
.home-footer{padding:24px}

/* Viewer */
.viewer{flex:1;width:100%;max-width:1040px;margin:0 auto;padding:16px 24px 48px;box-sizing:border-box}
.viewer .back{font-size:13px;text-decoration:none;color:rgba(26,26,26,0.55);display:inline-block;margin:0 0 22px}
.viewer-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;padding-bottom:14px;border-bottom:1px solid rgba(26,26,26,0.25)}
.viewer-head h1{font-size:17px;font-weight:400;margin:0}
.viewer-head .ctx{font-size:12.5px;color:rgba(26,26,26,0.5);margin:3px 0 0}
.viewer-head .counter{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;letter-spacing:0.06em;color:rgba(26,26,26,0.45);margin:0;white-space:nowrap}
.viewer-stage{padding:32px 0 0;display:flex;justify-content:center}
.viewer-stage img{max-width:100%;max-height:74vh;display:block;border:1px solid rgba(26,26,26,0.12)}
.viewer-stage img.tall{max-height:none}
.viewer-stage img.can-advance{cursor:pointer}
.viewer-controls{display:flex;justify-content:center;gap:14px;padding-top:26px}
.viewer-controls button{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;letter-spacing:0.06em;padding:8px 14px;background:none;border:1px solid rgba(26,26,26,0.25);color:#1a1a1a;cursor:pointer}
.viewer-controls button:hover{color:#8a6f4d;border-color:rgba(26,26,26,0.45)}
.viewer-controls button:disabled{color:rgba(26,26,26,0.25);cursor:default;border-color:rgba(26,26,26,0.25)}

/* About */
.cv{flex:1;width:100%;max-width:640px;margin:0 auto;padding:9vh 24px 40px;box-sizing:border-box}
.cv h1{font-size:26px;font-weight:400;margin:0;letter-spacing:-0.01em}
.cv .lede{font-size:15px;line-height:1.55;color:rgba(26,26,26,0.75);margin:22px 0 0;max-width:46ch}
.cv .download{margin:36px 0 0}
.cv .download a{font-size:14px;text-decoration:underline;text-underline-offset:3px}
.cv h2{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;font-weight:400;letter-spacing:0.06em;color:rgba(26,26,26,0.45);margin:72px 0 0}
.cv .rule{border-top:1px solid rgba(26,26,26,0.25);margin-top:12px}
.cv section{padding:22px 0;border-bottom:1px solid rgba(26,26,26,0.25)}
.cv .role-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap}
.cv h3{font-size:16px;font-weight:400;margin:0}
.cv .dates{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;color:rgba(26,26,26,0.45)}
.cv .role-sub{font-size:13px;color:rgba(26,26,26,0.5);margin:4px 0 0}
.cv ul{font-size:14px;line-height:1.6;color:rgba(26,26,26,0.75);margin:14px 0 0;padding-left:18px}
.cv li + li{margin-top:6px}
.cv .skills{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0 32px}
.cv .skills h3{font-size:13px;color:rgba(26,26,26,0.5)}
.cv .skills p{font-size:14px;line-height:1.7;margin:10px 0 0}
.cv .contact p{margin:0}
.cv .contact .email{font-size:15px}
.cv .contact .email a{text-decoration:underline;text-underline-offset:3px}
.cv .contact .loc{font-size:14px;color:rgba(26,26,26,0.5);margin-top:6px}
