/* 2026 refresh: site pages (content/pages/<slug>.json; markup src/lib/templates/page.js; docs/pages.md).
   Loaded after program.css, whose hero these pages reuse; the FAQ, quote, video and CTA band keep the program page's
   Webflow classes and refresh.css styles. Spacing on the 8px grid. */

/* Rhythm: 56px above and below each section (112px between two), 88px next to the hero and the closing email band */
.page-section { padding: 3.5rem 0; }
.page-hero + .page-section { padding-top: 5.5rem; }
.page-section:has(+ .section_learn-more) { padding-bottom: 5.5rem; }
.page-section_heading { margin: 0 0 1.5rem; text-wrap: balance; }

/* Hero: the program hero (program.css). A long heading steps down a size so it keeps to three or four lines. */
.page-hero_content > nav { margin-bottom: 2.5rem; }
.page-hero_eyebrow { margin: 0 0 1.5rem; color: var(--_style-guide-2-0---outset-dark-blue); }
.page-hero_heading { text-wrap: balance; }
.page-hero_heading.is-long { font-size: 3.5rem; line-height: 1; }
.page-hero_heading.is-longer { font-size: 3rem; line-height: 1.05; }
.page-hero_buttons { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2.5rem; }
.page-hero_buttons .button { display: inline-flex; width: auto; min-width: 13.5rem; } /* .button is display:flex and fills the panel */
/* Without a photo: the text on the page grid, the turquoise burst behind the right side (as the campus hero) */
.page-hero.is-no-image .program-hero_component { min-height: 0; }
.page-hero.is-no-image .program-hero_panel { position: relative; overflow: hidden; padding: 4.5rem 0 5.5rem; background: var(--_style-guide-2-0---outset-off-white); }
.page-hero.is-no-image .program-hero_panel::before {
  content: "";
  position: absolute;
  top: 0;
  right: -12rem;
  width: 55rem;
  height: 55rem;
  background: url(/refresh/burst-turquoise.svg) 50% / contain no-repeat;
  pointer-events: none;
}
.page-hero.is-no-image .program-hero_panel > .padding-global { position: relative; z-index: 1; width: 100%; }
.page-hero.is-no-image .program-hero_content { max-width: 50rem; }

/* Running text: the Markdown subset (src/lib/pages-markdown.js) */
.page-text_component { max-width: 45rem; }
.page-prose { max-width: 45rem; }
.page-prose p { margin: 0 0 1.25rem; }
.page-prose h3 { margin: 2.5rem 0 1rem; font-family: Marrsans Web, Arial, sans-serif; font-size: 1.5rem; font-weight: 600; line-height: 1.25; letter-spacing: -.03em; }
.page-prose h4 { margin: 2rem 0 .75rem; font-family: Caslonionic Web, Arial, sans-serif; font-size: 1.125rem; font-weight: 500; line-height: 1.3333; letter-spacing: -.02em; }
/* the snapshot sets ul to 13px below 480px and li to 1rem: lists take the text size of their section */
.page-prose ul,
.page-prose ol,
.page-prose li { font-size: inherit; line-height: inherit; }
.page-prose ul,
.page-prose ol { margin: 0 0 1.25rem; padding: 0; }
.page-prose ul { list-style: none; }
.page-prose ol { padding-left: 1.5rem; }
.page-prose li { margin: 0 0 .5rem; }
.page-prose ul > li { position: relative; padding-left: 1.25rem; }
.page-prose ul > li::before { content: ""; position: absolute; top: .7em; left: .3125rem; width: 4px; height: 4px; background-color: currentColor; }
.page-prose ol > li { padding-left: .25rem; }
.page-prose ol > li::marker { font-weight: 600; }
.page-prose a { color: var(--_style-guide-2-0---outset-mid-blue); text-decoration: underline; text-underline-offset: 2px; }
.page-prose strong { font-weight: 700; }
.page-prose > :first-child { margin-top: 0; }
.page-prose > :last-child { margin-bottom: 0; }

/* Image and text side by side; "right" puts the photo on the right */
.page-split_component { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: 4rem; align-items: center; }
.page-split.is-image-right .page-split_component { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); }
.page-split.is-image-right .page-split_image { order: 2; }
.page-split_image { aspect-ratio: 4 / 3; overflow: hidden; border-radius: .5rem; background-color: var(--_style-guide-2-0---outset-grey); }
.page-split_image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.page-split_content .page-prose { max-width: 36rem; }

/* Cards: the inventory card's white panel (refresh.css D6); a card with a link is a link as a whole */
.page-cards_head { max-width: 45rem; margin-bottom: 2.5rem; }
.page-cards_head .page-section_heading { margin-bottom: 0; }
.page-cards_intro { margin: 1rem 0 0; }
.page-cards_list { display: grid; gap: 1.5rem; margin: 0; padding: 0; list-style: none; }
.page-cards_list.is-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.page-cards_list.is-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.page-cards_list.is-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.page-cards_item { display: flex; margin: 0; font-size: inherit; line-height: inherit; }
.page-card {
  display: flex;
  flex-direction: column;
  width: 100%;
  overflow: hidden;
  border: 1px solid rgba(230, 230, 230, .5);
  border-radius: 4px;
  background-color: var(--_style-guide-2-0---white);
  box-shadow: 0 0 12px rgba(18, 18, 22, .1);
  color: var(--_style-guide-2-0---outset-soft-black);
  text-decoration: none;
}
.page-card_image { padding: .5rem .5rem 0; }
.page-card_image img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: .5rem; }
.page-card_body { display: flex; flex-direction: column; gap: .75rem; padding: 1.5rem; }
.has-images .page-card_body { padding: 1.25rem 1rem 1.5rem; }
.page-card_title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin: 0;
  font-family: Marrsans Web, Arial, sans-serif;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.03em;
  transition: color .2s;
}
.page-card_arrow { display: flex; flex: none; align-items: center; justify-content: center; width: 2rem; height: 2rem; border-radius: 50%; background-color: var(--_style-guide-2-0---outset-mid-blue); color: var(--_style-guide-2-0---outset-off-white); transition: transform .2s; }
.page-card_arrow svg { width: 1rem; height: 1rem; }
.page-card_text { margin: 0; font-size: 1rem; font-weight: 500; line-height: 1.5; letter-spacing: -.01em; }
.page-card.is-link:hover .page-card_title,
.page-card.is-link:focus-visible .page-card_title { color: var(--_style-guide-2-0---outset-mid-blue); }
.page-card.is-link:hover .page-card_arrow { transform: translateX(.25rem); }
.page-card.is-link:focus-visible { outline: 2px solid var(--_style-guide-2-0---outset-mid-blue); outline-offset: 2px; }

/* FAQ: the program page's accordion; the question is a button */
.page-faq_heading { margin: 0 0 2.5rem; }
.page-faq button.faq-top { width: 100%; margin: 0; padding: 0; border: 0; background: none; color: inherit; text-align: left; cursor: pointer; }
.page-faq .faq-top:focus-visible { outline: 2px solid var(--_style-guide-2-0---outset-mid-blue); outline-offset: 4px; }
.page-faq .faq-answer .page-prose { max-width: 48rem; }

/* Quote: the program page's quote as a figure */
.page-quote_figure { margin: 0 auto; }
.page-quote_text { margin: 0; padding: 0; border: 0; font-size: inherit; font-style: normal; line-height: inherit; } /* Webflow styles blockquote */

/* Call to action: the "Apply For Summer" band */
.page-cta { padding: 5.5rem 0; }
.page-cta_component { gap: 1.5rem; }
.page-cta_text { max-width: 36rem; margin: 0; font-size: 1.125rem; font-weight: 500; line-height: 1.5556; letter-spacing: -.01em; }
.page-cta .summer_btn { margin-top: .5rem; }
.page-cta .button { display: inline-flex; width: auto; }

@media screen and (max-width: 991px) {
  .page-hero_heading.is-long { font-size: 3rem; }
  .page-hero_heading.is-longer { font-size: 2.5rem; }
  .page-hero.is-no-image .program-hero_panel { padding: 3.5rem 0 4.5rem; }
  .page-hero.is-no-image .program-hero_panel::before { right: -20rem; width: 40rem; height: 40rem; }
  .page-split_component,
  .page-split.is-image-right .page-split_component { grid-template-columns: minmax(0, 1fr); row-gap: 2.5rem; }
  .page-split.is-image-right .page-split_image { order: 0; }
  .page-split_image { max-width: 36rem; }
  .page-cards_list.is-cols-3,
  .page-cards_list.is-cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-card_title { font-size: 1.25rem; }
}
@media screen and (max-width: 767px) {
  .page-section { padding: 2.5rem 0; }
  .page-hero + .page-section { padding-top: 3.5rem; }
  .page-section:has(+ .section_learn-more) { padding-bottom: 3.5rem; }
  .page-hero_heading.is-long { font-size: 2.25rem; }
  .page-hero_heading.is-longer { font-size: 2rem; }
  .page-hero.is-no-image .program-hero_panel { padding: 2.5rem 0 3.5rem; }
  .page-hero.is-no-image .program-hero_panel::before { top: 4rem; right: -14rem; width: 28rem; height: 28rem; }
  .page-cards_list.is-cols-2,
  .page-cards_list.is-cols-3,
  .page-cards_list.is-cols-4 { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .page-faq_heading { margin-bottom: 2rem; }
  .page-cta { padding: 4rem 0; }
  .page-cta_text { font-size: 1rem; }
}
@media screen and (max-width: 479px) {
  .page-hero_heading.is-long { font-size: 2rem; }
  .page-hero_heading.is-longer { font-size: 1.75rem; }
  .page-hero_buttons .button { width: 100%; min-width: 0; }
}
