*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{background:#1d2420;color:#f7f2e8;font-family:"Manrope",system-ui,sans-serif;font-weight:300;-webkit-font-smoothing:antialiased}
.hero{position:relative;min-height:100vh;min-height:100svh;overflow:hidden;display:flex;justify-content:center;align-items:flex-start;text-align:center;padding:clamp(36px,6vh,72px) 20px}
.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 100%;z-index:-2}
.shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(to bottom,rgba(16,24,26,.66) 0%,rgba(16,24,26,.5) 34%,rgba(16,24,26,.18) 54%,rgba(16,24,26,0) 62%),linear-gradient(to top,rgba(12,17,14,.25),rgba(12,17,14,0) 25%)}
.content{text-shadow:0 2px 22px rgba(0,0,0,.3)}
.brand{font-size:12px;letter-spacing:.34em;text-transform:uppercase;font-weight:400;opacity:.85;margin-bottom:clamp(48px,9vh,96px)}
.eyebrow{font-size:15px;letter-spacing:.28em;text-transform:uppercase;font-weight:400;margin-bottom:clamp(14px,2vh,22px)}
h1{font-family:"Fraunces",serif;font-weight:400;line-height:1.05;text-wrap:balance;font-weight:300;font-variation-settings:"SOFT" 100,"WONK" 1;font-size:clamp(24px,7.8vw,76px);letter-spacing:-.015em}h1 span+span{font-style:italic}
h1 span{display:block;white-space:nowrap}
@media (max-width:600px){.hero{padding-top:44px}.bg{object-position:46% 60%}}
.accent{font-style:italic;color:#DCC48E}