:root {
  --bg: #F5F3EF;
  --ink: #111111;
  --muted: #6B6760;
  --card: #FFFFFF;
  --line: #E4E0D8;
  --radius: 16px;
  --accent: #FF4D1C;
  --font-head: 'Space Grotesk', sans-serif;
  --font-body: 'Inter', sans-serif;
}

body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
}

.dt-wrap { max-width: 1120px; margin: 0 auto; padding: 0 20px; }

.dt-h1, .dt-h2, .dt-h3 { font-family: var(--font-head); font-weight: 700; letter-spacing: -0.02em; margin: 0; }
.dt-h1 { font-size: clamp(36px, 7vw, 72px); line-height: 1.02; }
.dt-h2 { font-size: clamp(24px, 4vw, 36px); line-height: 1.1; }
.dt-h3 { font-size: 20px; line-height: 1.2; }

.dt-muted { color: var(--muted); }

.dt-badge {
  display: inline-block; padding: 5px 10px; border-radius: 999px;
  font: 600 12px/1 var(--font-body); letter-spacing: .04em; text-transform: uppercase;
  background: var(--ink); color: #fff;
}
.dt-badge--free { background: var(--accent); }

.dt-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 14px 22px; border-radius: 999px; border: 0; cursor: pointer;
  background: var(--ink); color: #fff; text-decoration: none;
  font: 600 15px/1 var(--font-body);
}
.dt-btn--accent { background: var(--accent); }

.dt-card {
  background: var(--card); border-radius: var(--radius);
  overflow: hidden; border: 1px solid var(--line);
}