@font-face {
  font-family: Jost;
  src: url("fonts/jost-variable.ttf") format("truetype");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
:root { color-scheme: light; background: #f6f2e9; color: #302e29; font-family: Jost, sans-serif; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; display: grid; place-items: center; padding: 48px 24px; background: radial-gradient(ellipse at 50% 40%, #fffdf8 0%, #f6f2e9 65%); }
main { width: 100%; max-width: 860px; text-align: center; }
.brand { display: flex; flex-direction: column; align-items: center; }
.brand-name { font-family: Georgia, serif; font-size: clamp(52px, 8vw, 76px); line-height: 1.15; letter-spacing: .015em; }
.brand-detail { margin-top: 10px; font-size: 14px; text-transform: uppercase; letter-spacing: .4em; padding-left: .4em; }
.divider { height: 1px; width: 58px; background: #9c8252; margin: 42px auto; }
.eyebrow { color: #79623e; font-size: 13px; letter-spacing: .25em; text-transform: uppercase; margin: 0 0 22px; }
h1 { font-family: Georgia, serif; font-size: clamp(34px, 5.7vw, 58px); line-height: 1.18; font-weight: 400; letter-spacing: -.025em; margin: 0; }
.message { font-size: 18px; font-weight: 400; line-height: 1.65; margin: 26px 0 0; color: #635d52; }
.closing { display: block; margin-top: 52px; font-size: 12px; color: #79623e; letter-spacing: .25em; }
@media (max-width: 420px) {
  body { padding: 40px 20px; }
  .divider { margin: 32px auto; }
  .message { font-size: 16px; }
  .closing { margin-top: 38px; }
}