*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  font-family: var(--brand-font-body, 'DM Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif);
  color: var(--brand-text, #000000);
  background: var(--brand-surface, #ffffff);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--brand-font-heading, 'DM Serif Display', Georgia, serif);
}

a {
  color: var(--brand-link, #ff0055);
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
}

a:hover {
  color: var(--brand-link-hover, #cc0044);
}

.brand-cta,
.cta-button,
[data-cta="true"] {
  background: var(--brand-cta-bg, #ff0055);
  color: var(--brand-cta-text, #ffffff);
  border: 0;
  border-radius: var(--brand-cta-radius, 9999px);
  box-shadow: none;
  text-decoration: none;
  animation: none;
  transform: none;
  transition: none;
}

button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
  border-radius: var(--brand-cta-radius, 9999px);
}

.brand-cta:hover,
.cta-button:hover,
[data-cta="true"]:hover {
  background: var(--brand-cta-bg-hover, #cc0044);
  color: var(--brand-cta-text, #ffffff);
  animation: none;
  transform: none;
  transition: none;
}

input:not([type="checkbox"]):not([type="radio"]),
textarea,
select {
  border: var(--brand-input-border, 1px solid #d3dae3);
  border-radius: var(--brand-input-radius, 10px);
  background: var(--brand-input-bg, #fcfdff);
}

.brand-surface-muted {
  background: var(--brand-surface-muted, #f3f3f3);
}
