:root{
  --bg:#F4F6F2;
  --ink:#13211A;
  --muted:#5E6E64;
  --line:#DBE1D7;
  --accent:#1C7A4C;
  --sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --mono:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

*{ box-sizing:border-box; }

html,body{ margin:0; }

body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:clamp(24px, 5vw, 56px);
  line-height:1.55;
}

a{ color:inherit; }

main{
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
  max-width:680px;
}

.brand{
  font-family:var(--mono);
  font-weight:600;
  font-size:.85rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--accent);
  margin:0 0 clamp(20px,4vh,32px);
}

h1{
  font-weight:600;
  font-size:clamp(1.7rem, 4.4vw, 2.7rem);
  line-height:1.18;
  letter-spacing:-.015em;
  margin:0 0 clamp(18px,3vh,26px);
  max-width:18ch;
}

.lede{
  font-size:clamp(1.02rem, 2vw, 1.2rem);
  color:var(--muted);
  margin:0 0 clamp(28px,5vh,40px);
  max-width:52ch;
}

.contact a{
  font-family:var(--mono);
  font-size:.95rem;
  color:var(--accent);
  text-decoration:none;
  border-bottom:1px solid var(--line);
  padding-bottom:2px;
  transition:border-color .2s ease;
}
.contact a:hover{ border-color:var(--accent); }
.contact a:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:4px;
  border-radius:2px;
}

footer{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding-top:18px;
  border-top:1px solid var(--line);
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--muted);
}