@font-face{font-family:Metropolis;src:url("assets/metropolis-regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Metropolis;src:url("assets/metropolis-semibold.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"PT Serif";src:url("assets/pt-serif-regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"PT Serif";src:url("assets/pt-serif-bold.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Piazzolla;src:url("assets/piazzolla-latin.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:Piazzolla;src:url("assets/piazzolla-ext.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0100-024F}
*{box-sizing:border-box}
html{scroll-padding-top:85px}
body{margin:0;color:#666;background:#fff;font:20px/1.6 Metropolis,sans-serif;letter-spacing:-.3px}
a{color:#ebbd00;text-underline-offset:2px}
a:hover{text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid #393939;outline-offset:5px}
header{position:fixed;inset:0 0 auto;z-index:10;height:112px;max-width:95rem;margin-inline:auto;padding:0 clamp(20px,4.1vw,64px);display:flex;align-items:center;justify-content:space-between;background:#fff}
header.compact{height:60px;border-bottom:1px solid #e8e8e8}
.brand{font:700 28px/1.5 Piazzolla,serif;color:#393939;text-decoration:none}
nav{display:flex;gap:32px}
nav a{color:#666;font-size:14px;font-weight:600;letter-spacing:.32px;text-decoration:none}
nav a:first-child,nav a:hover{color:#393939}
.menu-toggle{display:none}
main{padding-top:173px;max-width:960px;margin:auto;scroll-margin-top:0}
.intro{display:grid;grid-template-columns:41.133% 49.036%;gap:9.831%}
.portrait{width:calc(100% - 40px);height:auto;margin:20px;display:block}
.bio{padding:12px 20px;font-size:18px;line-height:1.6}
h1,h2{font-family:"PT Serif",serif;color:#393939}
h1{margin:0;font-size:57.6px;line-height:1.3;letter-spacing:-.32px}
.details{margin-top:76.35px}
.details p{margin:0 0 15px}
small{font-size:90%}
strong{font-weight:600}
.resume{--divider-outset:60px;max-width:800px;margin:40px auto 0}
.resume>section{position:relative;margin-top:20px;padding-top:21px}
.resume>section::before{content:"";position:absolute;top:0;left:calc(-1 * var(--divider-outset));right:0;border-top:1px solid #e8e8e8}
h2{margin:0 0 20px;font-size:40px;font-weight:400;line-height:1.6;letter-spacing:-.4px}
.resume p{margin:0 0 28px}
ul{list-style:none;margin:0 0 0 20px;padding:0}
li{position:relative;padding-left:40px}
li:not(:last-child){padding-bottom:5px}
li::before{content:"";position:absolute;left:0;top:.57em;width:7px;height:7px;border-right:1.5px solid currentColor;border-top:1.5px solid currentColor;transform:rotate(45deg)}
.video{display:block;width:69.84%;aspect-ratio:16/9;border:0;margin:32px auto;background:#000}
.other ul+ul{margin-top:28px}
.contact{min-height:calc(100vh - 150px);padding-bottom:100px;scroll-margin-top:0}
address{font-style:normal}
.contact-row::before{content:none}
.contact-row img{position:absolute;right:calc(100% - 8.45px);top:6px;width:20px;height:20px;object-fit:contain}
.contact-row a{color:inherit;text-decoration:none;overflow-wrap:anywhere}
.contact-row a:hover{text-decoration:underline}
.contact-row p{margin:0}
footer{text-align:center;font-size:14px;padding:28px 20px 40px}
@media(max-width:1000px){main{max-width:calc(100% - 80px)}.resume{--divider-outset:20px;max-width:calc(100% - 80px)}h1{font-size:48px}.details{margin-top:60px}}
@media(max-width:600px){
 html{scroll-padding-top:75px}
 body{font-size:16px}
 header,header.compact{height:70px;padding:0 20px}
 .brand{font-size:24px}
 .menu-toggle{display:grid;gap:5px;padding:10px;background:none;border:0;cursor:pointer}
 .menu-toggle span{display:block;background:#393939;width:23px;height:2px}
 nav{display:none;position:absolute;top:70px;left:0;right:0;background:#fff;padding:20px;gap:24px;border-bottom:1px solid #eee}
 nav.open{display:flex}
 main{padding-top:105px;max-width:calc(100% - 40px)}
 .intro{display:flex;flex-direction:column;gap:20px}
 .portrait{width:100%;margin:0}
 .bio{padding:0;font-size:16px}
 h1{font-size:43.2px}
 .details{margin-top:42px}
 .resume{max-width:100%;margin-top:40px}
 h2{font-size:28px}
 .resume p{margin-bottom:20px}
 ul{margin-left:10px}
 li{padding-left:24px}
 .video{width:100%;margin:24px auto}
 .contact{padding-bottom:45px}
 .contact-row img{top:3px}
}