/* MHDSR layout overrides: wider content column, more breathing room, larger readable type */

/* Quarto/Bootstrap defines a more specific body.fullcontent .page-columns rule
   that otherwise wins over a plain .page-columns override, so match its
   selector (and add !important as a safety net) to actually take effect.
   IMPORTANT: must keep every named line Quarto's own CSS references
   (page-start/page-end in particular: .column-page{grid-column:page-start/
   page-end} matches our <main class="content column-page">, so dropping
   those lines makes that rule unresolvable and breaks the whole layout,
   which is what happened on the first attempt at a simplified 3-line grid). */
body.fullcontent:not(.floating):not(.docked) .page-columns,
.page-columns {
  grid-template-columns:
    [screen-start] 1fr
    [page-start page-start-inset body-start-outset body-start body-content-start]
    clamp(320px, 92%, 1700px)
    [body-content-end body-end body-end-outset page-end-inset page-end]
    1fr [screen-end] !important;
}

body {
  font-size: 1.18rem;
  line-height: 1.7;
}

p {
  margin-bottom: 1.15em;
}

h2 {
  margin-top: 2.6rem;
  margin-bottom: 1rem;
}

h3 {
  margin-top: 1.6rem;
  margin-bottom: 0.6rem;
}

.course-grid,
.grid {
  row-gap: 2rem;
}

table {
  margin-top: 1rem;
  margin-bottom: 1.5rem;
}

.fiche {
  width: 96%;
  max-width: 1600px;
  font-size: 1.05rem !important;
  line-height: 1.55 !important;
}

.fiche-meta,
.fiche-info,
.fiche-schedule,
.fiche-footer {
  font-size: 0.98rem !important;
}

/* Give the logo its own explicit display area; navbar links retain their
   normal typography and spacing. */
.navbar-logo {
  width: 160px;
  height: 160px;
  max-height: 160px !important;
  min-height: 160px !important;
  object-fit: contain;
  margin-right: 0.8rem;
}

/* Cohort details need to be scannable, not buried in a long sentence. */
.course-facts {
  display: grid;
  grid-template-columns: 1fr 1.8fr 1fr 1.4fr;
  gap: 0;
  margin: 1.5rem 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--bs-border-color, #dee2e6);
  border-top: 3px solid var(--bs-secondary, #C2410C);
  border-radius: 10px;
  background: rgba(194, 65, 12, 0.035);
}

.course-facts > div {
  min-width: 0;
  padding: 1rem 1.15rem;
}

.course-facts > div + div {
  border-left: 1px solid var(--bs-border-color, #dee2e6);
}

.course-fact-label {
  display: block;
  margin-bottom: 0.4rem;
  color: var(--bs-secondary, #C2410C);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
}

.course-fact-value {
  display: block;
  font-size: 1rem;
  line-height: 1.5;
}

.course-facts small {
  color: var(--bs-secondary-color, #6c757d);
  font-size: 0.88em;
}

@media (max-width: 900px) {
  .course-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .course-facts > div:nth-child(odd) {
    border-left: 0;
  }

  .course-facts > div:nth-child(n + 3) {
    border-top: 1px solid var(--bs-border-color, #dee2e6);
  }
}

@media (max-width: 575px) {
  .navbar-logo {
    width: 124px;
    height: 124px;
    max-height: 124px !important;
    min-height: 124px !important;
    margin-right: 0.55rem;
  }

  .course-facts {
    grid-template-columns: 1fr;
  }

  .course-facts > div + div {
    border-top: 1px solid var(--bs-border-color, #dee2e6);
    border-left: 0;
  }
}

/* Enrollment announcement: a quiet bordered/tinted callout, no button,
   just enough visual weight that a visitor skimming the page won't miss it. */
.announcement {
  border: 1px solid var(--bs-secondary, #C2410C);
  background: rgba(194, 65, 12, 0.06);
  border-radius: 8px;
  padding: 1rem 1.25rem;
  margin: 1.25rem 0 1.5rem;
}

.announcement p {
  margin-bottom: 0;
}
