:root { --rust:#97493F; --cream:#F5F0E6; --indigo:#3D418A; --mustard:#E3A24D; --ink:#2A1A16; }
* { box-sizing:border-box; margin:0; padding:0; }
body {
  background:var(--rust); color:var(--cream);
  font-family:"Inter", system-ui, sans-serif; font-size:16px; line-height:1.6;
  min-height:100vh; display:flex; flex-direction:column;
  -webkit-font-smoothing:antialiased;
}
.inner { max-width:1080px; margin:0 auto; padding:0 24px; width:100%; }
.serif { font-family:"Fraunces", Georgia, serif; }

header { border-bottom:1px solid rgba(245,240,230,.25); }
header .inner { display:flex; justify-content:space-between; align-items:center; height:72px; }
.logo { font-family:"Fraunces", Georgia, serif; font-size:20px; }
.btn {
  display:inline-block; background:var(--mustard); color:var(--ink);
  font-size:14px; font-weight:500; text-decoration:none;
  padding:10px 18px; border-radius:2px; transition:transform .2s, background .2s;
}
.btn:hover { background:#EDB25F; transform:translateY(-1px); }

.hero { padding:48px 0 56px; }
h1 {
  font-family:"Fraunces", Georgia, serif; font-weight:300;
  font-size:clamp(56px, 13vw, 168px); line-height:.92; letter-spacing:-.01em;
  text-transform:uppercase; text-align:center;
}
.intro { background:var(--cream); color:var(--ink); }
.intro .inner { display:flex; justify-content:space-between; align-items:center; gap:32px; padding-top:36px; padding-bottom:40px; }
.intro p { max-width:520px; font-size:18px; }

footer { flex:1; display:flex; flex-direction:column; background:var(--indigo); }
footer > .inner { flex:1; display:flex; flex-direction:column; justify-content:center; }
footer .inner { padding-top:56px; padding-bottom:28px; }
.cta { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap; margin-bottom:40px; }
.cta h2 { font-family:"Fraunces", Georgia, serif; font-weight:400; font-size:clamp(40px, 6vw, 64px); line-height:1; }
.mail {
  font-family:"Fraunces", Georgia, serif; font-style:italic; font-size:clamp(22px, 3vw, 30px);
  color:var(--cream); text-decoration:underline; text-underline-offset:6px; text-decoration-thickness:1px;
  transition:color .2s;
}
.mail:hover { color:var(--mustard); }
.meta { margin-top:auto; display:flex; justify-content:space-between; font-size:13px; opacity:.75; }

@media (max-width:640px) {
  .hero { padding:28px 0 32px; }
  .intro .inner { flex-direction:column; align-items:flex-start; padding-top:28px; padding-bottom:32px; }
  .intro p { font-size:17px; }
  footer .inner { padding-top:44px; padding-bottom:24px; }
  .cta { margin-bottom:32px; }
  .cta { flex-direction:column; align-items:flex-start; }
}
