@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400..900;1,9..144,400..900&family=Inter:wght@400;500;600;700;800;900&display=swap');

:root {
  --cream: #f5f3f0;
  --white: #ffffff;
  --dark: #0a0a0a;
  --charcoal: #1f1f1f;
  --red: #c8312b;
  --red-dark: #a4241f;
  --gray: #6b6b6b;
  --border: #dddbd8;
  --green: #22c55e;
  --serif: 'Fraunces', Georgia, 'Times New Roman', serif;
}

body {
  font-family: 'Inter', sans-serif !important;
  background: var(--cream) !important;
  color: var(--dark);
  line-height: 1.6;
}

h1, h2, h3 {
  font-family: var(--serif) !important;
  font-variation-settings: 'opsz' 144;
}

h1 em, h2 em { font-style: italic; color: var(--red); font-weight: 600; }

.btn-primary, .elementor-button.btn-primary {
  background: var(--red) !important;
  color: white !important;
  padding: 18px 44px !important;
  border-radius: 8px !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  transition: all 0.2s !important;
  box-shadow: 0 4px 16px rgba(200,49,43,0.3) !important;
  border: none !important;
}
.btn-primary:hover {
  background: var(--red-dark) !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(200,49,43,0.4) !important;
}

.btn-outline {
  background: transparent !important;
  color: var(--dark) !important;
  padding: 18px 44px !important;
  border-radius: 8px !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  border: 2px solid var(--border) !important;
  transition: all 0.2s !important;
}
.btn-outline:hover {
  border-color: var(--dark) !important;
  background: rgba(0,0,0,0.03) !important;
}