/* 2026 refresh: All Campuses (spec 3.3 A1-A3). Markup: src/webflow/pages/all-campuses.html + src/lib/templates/all-campuses.js.
   The Learn More band, breadcrumb and type utilities are shared (refresh.css). */

/* A1 Hero band: Red Brown with the orange symbol at 66%, 320px under the bar */
.section_campuses-hero {
  position: relative;
  overflow: hidden;
  margin-top: var(--nav-h);
  background-color: var(--_style-guide-2-0---outset-red-brown);
  color: var(--_style-guide-2-0---outset-off-white);
}
.campuses-hero_pattern { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.campuses-hero_component {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
  min-height: 20rem;
  padding: 7rem 0 3rem;
  text-align: center;
}
.campuses-hero_heading { color: var(--_style-guide-2-0---white); text-wrap: balance; }
.campuses-hero_text { max-width: 29rem; margin: 0; font-size: 1.125rem; font-weight: 400; line-height: 1.5556; letter-spacing: -.01em; }

/* A2 Campus list on Orange 66% (the colour of today's orange campuses section, which has no token) */
.section_campus-list { padding: 8rem 0 7.5rem; background-color: #f59632a8; color: var(--_style-guide-2-0---outset-soft-black); }
.campus-list_container { max-width: 76rem; margin: 0 auto; }
.campus-list_container .breadcrumb_component { margin-bottom: 3.25rem; }
.campus-list_list { margin: 0; padding: 0; list-style: none; }
.campus-row {
  display: grid;
  grid-template-columns: minmax(0, 32rem) minmax(0, 1fr);
  column-gap: 6.625rem;
  margin: 0;
  padding: 0 0 3.5rem;
  border-bottom: 1px solid var(--_style-guide-2-0---outset-soft-black-tint);
}
.campus-row + .campus-row { padding-top: 3.5rem; }
.campus-row_image { display: block; aspect-ratio: 512 / 490; overflow: hidden; border-radius: 4px; background-color: var(--_style-guide-2-0---outset-sand); }
.campus-row_image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.campus-row_content { min-width: 0; }
.campus-row_name { color: var(--_style-guide-2-0---outset-soft-black); text-wrap: balance; }
.campus-row_text { max-width: 34.875rem; margin: 2.5rem 0 0; }
.campus-row_subheading {
  margin: 1.5rem 0 0;
  font-family: Marrsans Web, Arial, sans-serif;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: -.01em;
}
.campus-row_programs { display: flex; flex-direction: column; gap: .5rem; margin: .5rem 0 0; padding: 0; list-style: none; }
.campus-row_programs > li {
  position: relative;
  margin: 0;
  padding-left: 1.6875rem;
  font-family: Marrsans Web, Arial, sans-serif;
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.5556;
  letter-spacing: -.01em;
}
.campus-row_programs > li::before { content: ""; position: absolute; top: .75rem; left: .8125rem; width: 4px; height: 4px; background-color: currentColor; }
.campus-row_button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 19.875rem;
  max-width: 100%;
  min-height: 2.75rem;
  margin-top: 4rem;
  padding: .625rem 1.5rem;
  border: 2px solid var(--_style-guide-2-0---outset-soft-black);
  border-radius: 62px;
  color: var(--_style-guide-2-0---outset-soft-black);
  font-family: Marrsans Web, Arial, sans-serif;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -.02em;
  text-decoration: none;
  transition: background-color .2s, color .2s;
}
.campus-row_button:hover,
.campus-row_button:focus-visible { background-color: var(--_style-guide-2-0---outset-soft-black); color: var(--_style-guide-2-0---outset-off-white); }
.campus-row_button:focus-visible { outline: 2px solid var(--_style-guide-2-0---outset-soft-black); outline-offset: 2px; }

/* Laptop (992-1279px): photo and text share the row */
@media screen and (min-width: 992px) and (max-width: 1279px) {
  .campus-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 4rem; }
}
/* Tablet: two columns at half width */
@media screen and (max-width: 991px) {
  .campuses-hero_component { min-height: 16rem; padding: 4.5rem 0 3.5rem; gap: 1.5rem; }
  .section_campus-list { padding: 5rem 0; }
  .campus-list_container .breadcrumb_component { margin-bottom: 2.5rem; }
  .campus-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 2.5rem; }
  .campus-row_text { margin-top: 1.5rem; }
  .campus-row_button { margin-top: 2.5rem; }
}
/* Phone: photo above the text */
@media screen and (max-width: 767px) {
  .campuses-hero_component { min-height: 0; padding: 3.5rem 0; gap: 1rem; }
  .campuses-hero_text { font-size: 1rem; }
  .section_campus-list { padding: 3.5rem 0 4rem; }
  .campus-list_container .breadcrumb_component { margin-bottom: 2rem; }
  .campus-row { grid-template-columns: minmax(0, 1fr); row-gap: 1.5rem; padding-bottom: 2.5rem; }
  .campus-row + .campus-row { padding-top: 2.5rem; }
  .campus-row_image { aspect-ratio: 4 / 3; }
  .campus-row_text { margin-top: 1rem; font-size: 1rem; }
  .campus-row_subheading { margin-top: 1.25rem; font-size: 1.125rem; }
  .campus-row_programs > li { font-size: 1rem; }
  .campus-row_programs > li::before { top: .6875rem; }
  .campus-row_button { width: 100%; margin-top: 2rem; }
}
