/* Typography — Montserrat is the primary UI typeface.
   Megabyte is reserved for the app logo wordmark only. */

/* Apply Montserrat to body by default */
body {
  font-family: 'Montserrat', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Headings — Montserrat with tight tracking (Margette feel) */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Montserrat', sans-serif;
}

h1, h2 {
  font-weight: 800;
  letter-spacing: -0.03em;
}

h3, h4 {
  font-weight: 700;
  letter-spacing: -0.01em;
}

h5, h6 {
  font-weight: 600;
  letter-spacing: -0.01em;
}

/* Buttons use Montserrat semibold — no uppercase for a calm, modern UI */
button,
[type="button"],
[type="submit"],
[type="reset"],
.btn,
a.button,
input[type="submit"],
input[type="button"],
a[class*="inline-flex"][class*="bg-"],
a[class*="button"],
a[class*="rounded"] {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 600;
  text-transform: none;
  letter-spacing: normal;
}

/* Inline edit elements should use body font and normal casing */
[data-controller="inline-edit"] button,
[data-controller="inline-edit"] select,
[data-controller="inline-edit"] input[type="text"] {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 400;
  text-transform: none;
  letter-spacing: normal;
}

/* Utility classes for explicit Megabyte usage (logo wordmark) */
.font-megabyte {
  font-family: 'Megabyte', sans-serif;
}

.megabyte-light {
  font-family: 'Megabyte', sans-serif;
  font-weight: 300;
}

.megabyte-regular {
  font-family: 'Megabyte', sans-serif;
  font-weight: 400;
}

.megabyte-medium {
  font-family: 'Megabyte', sans-serif;
  font-weight: 500;
}

.megabyte-bold {
  font-family: 'Megabyte', sans-serif;
  font-weight: 700;
}

.megabyte-black {
  font-family: 'Megabyte', sans-serif;
  font-weight: 900;
}

/* Legacy alias — keeps existing `font-barlow` markup on the UI typeface
   (now Montserrat) instead of falling back inconsistently. */
.font-barlow {
  font-family: 'Montserrat', sans-serif;
}

/* Allema brand modal — Sen for body, Megan Unique Display for wordmark/mission.
   Scoped overrides defeat the !important rules on buttons/links above. */
[data-about-modal-target="modal"] {
  font-family: 'Sen', sans-serif;
}

[data-about-modal-target="modal"] button,
[data-about-modal-target="modal"] [type="button"],
[data-about-modal-target="modal"] a {
  font-family: 'Sen', sans-serif !important;
  text-transform: none;
  letter-spacing: normal;
}

[data-about-modal-target="modal"] .font-megan,
.font-megan {
  font-family: 'Megan Unique Display', sans-serif !important;
  text-transform: none;
  letter-spacing: normal;
}