:root {
  --bg: #15191B;
  --line: #2A3134;
  --text: #ECE7DF;
  --muted: #A2A9AB;
  --accent: #D9774B;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; color-scheme: dark; }
body {
  margin: 0;
  font: 18px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
  min-height: 100vh; display: flex; flex-direction: column;
}
main { flex: 1; width: 100%; }
header, footer { width: 100%; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
.wrap { max-width: 880px; margin: 0 auto; padding: 0 28px; }
header.wrap { display: flex; align-items: center; justify-content: space-between; padding-top: 28px; padding-bottom: 28px; }
header img { height: 48px; width: auto; display: block; }
header nav a { color: var(--muted); font-size: 15px; }
.hero { padding: 96px 0 88px; }
.hero h1 { font-size: clamp(38px, 6vw, 60px); line-height: 1.08; font-weight: 600; letter-spacing: -.02em; margin: 0 0 20px; }
.hero p { font-size: 21px; color: var(--muted); margin: 0; max-width: 560px; }
.hero .kicker { font-size: 15px; color: var(--accent); margin: 0 0 14px; letter-spacing: .02em; }
.blocks { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; padding: 48px 0; border-top: 1px solid var(--line); }
.blocks h2, .contact h2 { font-size: 18px; font-weight: 600; margin: 0 0 8px; }
.blocks p { margin: 0; color: var(--muted); }
.contact { padding: 48px 0 72px; border-top: 1px solid var(--line); }
.contact a { font-size: 26px; }
footer.wrap { padding-bottom: 40px; color: var(--muted); font-size: 14px; }
footer p { margin: 0; padding-top: 24px; border-top: 1px solid var(--line); }
@media (max-width: 640px) {
  .blocks { grid-template-columns: 1fr; gap: 28px; }
  .hero { padding: 56px 0 56px; }
  header img { height: 38px; }
}