/* Self-hosted Bebas Neue */
@font-face {
  font-family: 'Bebas Neue';
  src: url('../assets/brand/fonts/BebasNeue-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* ── Base */

html {
  font-family: var(--font-body);
  font-size: 16px;
}

body {
  font-size: var(--text-base);
  line-height: 1.6;
  color: var(--off-white);
  background-color: var(--black);
}

/* ── Display headings (Bebas Neue) */

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: 400;
  line-height: 1;
  text-transform: uppercase;
  color: var(--off-white);
}

.section-heading {
  font-family: var(--font-display);
  font-size: clamp(var(--text-2xl), 5vw, var(--text-3xl));
  letter-spacing: var(--tracking-wider);
  text-transform: uppercase;
  color: var(--off-white);
  margin-bottom: 2rem;
}

/* ── Body prose */

.prose {
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: 1.75;
  color: var(--off-white);
  max-width: var(--container-text);
}

.prose p + p {
  margin-top: 1.25em;
}

/* ── Utility classes */

.text-display {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-weight: 400;
}

.text-red  { color: var(--shock-red); }
.text-mid  { color: var(--mid-grey); }
.text-tiny {
  font-size: var(--text-xs);
  letter-spacing: var(--tracking-widest);
  text-transform: uppercase;
  font-family: var(--font-display);
  color: var(--mid-grey);
}