:root{--background:#F7F6F2;--text:#171717;--accent:#8A2432}
*{box-sizing:border-box}
html,body{margin:0;background:var(--background);color:var(--text)}
body{min-width:320px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.page{min-height:100vh;min-height:100svh;display:grid;grid-template-rows:auto 1fr auto;padding:max(42px,env(safe-area-inset-top)) clamp(28px,4vw,72px) max(36px,env(safe-area-inset-bottom))}
.wordmark{display:inline-block;text-decoration:none;color:inherit;font-size:15px;font-weight:700;letter-spacing:.25em;line-height:1;white-space:nowrap}
.hero{align-self:center;width:min(760px,56vw);margin-left:clamp(30%,38vw,42%);transform:translateY(-1.5vh)}
.hero h1{margin:0;max-width:760px;font-size:clamp(42px,3.7vw,66px);font-weight:400;line-height:1.08;letter-spacing:-.035em}
.supporting{margin:28px 0 0;font-size:clamp(18px,1.4vw,24px);line-height:1.45}
.contact{margin-top:44px}
.eyebrow{margin:0 0 16px;font-size:12px;font-weight:700;letter-spacing:.26em;line-height:1}
.email{display:inline-block;position:relative;color:inherit;text-decoration:none;font-size:clamp(20px,1.5vw,27px);line-height:1.3}
.email::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;background:var(--accent);transform-origin:left center;transition:transform 180ms ease}
.email:hover::after,.email:focus-visible::after{transform:scaleX(.55)}
.email:focus-visible,.wordmark:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
.site-footer{display:flex;justify-content:space-between;gap:24px;font-size:14px;line-height:1.4}
@media(max-width:820px){
  .page{padding:max(42px,env(safe-area-inset-top)) 28px max(32px,env(safe-area-inset-bottom))}
  .wordmark{font-size:14px}
  .hero{width:100%;margin-left:0;transform:none;padding:7vh 0 5vh}
  .hero h1{max-width:620px;font-size:clamp(44px,11.4vw,58px);line-height:1.07;letter-spacing:-.04em}
  .desktop-break{display:none}
  .supporting{margin-top:30px;font-size:20px}
  .contact{margin-top:52px}
  .email{font-size:clamp(22px,6.1vw,30px)}
  .site-footer{flex-direction:column;gap:16px;font-size:15px}
}
@media(max-width:390px){
  .page{padding-left:22px;padding-right:22px}
  .hero h1{font-size:42px}
  .supporting{font-size:18px}
  .email{font-size:22px}
}
@media(prefers-reduced-motion:reduce){.email::after{transition:none}}