:root {
  --pf2-rose: #e6a7b2;
  --pf2-rose-strong: #a95365;
  --pf2-rose-soft: #fbf0f2;
}

/* Hero */
.pf-fellowship .pf-hero-layout {
  align-items: stretch !important;
}

.pf-fellowship .pf-hero-kicker {
  grid-column: 1 / -1;
  width: 100%;
  max-width: none !important;
  margin: 0 0 28px !important;
  border-left: 3px solid var(--pf2-yellow) !important;
  padding: 2px 0 2px 16px !important;
  color: var(--pf2-muted) !important;
  font-size: clamp(13px, 1.18vw, 15px) !important;
  line-height: 1.45 !important;
  white-space: nowrap;
}

.pf-fellowship .pf-hero-kicker span { color: var(--pf2-yellow-txt) !important; }

.pf-fellowship .pf-hero-faculty img,
.pf-fellowship [data-pf-img="hero-faculty-group"] {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center bottom !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.pf-fellowship .pf-hero-faculty {
  box-sizing: border-box !important;
  isolation: isolate;
  display: flex !important;
  align-self: stretch !important;
  align-items: flex-end !important;
  justify-content: center !important;
  padding: 0 !important;
}

.pf-fellowship .pf-hero-faculty::before {
  content: "" !important;
  position: absolute !important;
  inset: 7% -12% -4% !important;
  z-index: -1 !important;
  background: radial-gradient(ellipse at 50% 64%, rgba(255, 197, 61, .28) 0%, rgba(230, 167, 178, .12) 38%, transparent 72%) !important;
  filter: blur(16px);
  pointer-events: none;
}

.pf-fellowship .pf-hero-faculty::after {
  content: none !important;
  display: none !important;
}

@media (min-width: 861px) {
  .pf-fellowship .pf-hero-faculty img,
  .pf-fellowship [data-pf-img="hero-faculty-group"] {
    transform: translateY(-17%) !important;
  }
}

/* "Become a Frontier AI Leader" is 12 characters longer than the label it
   replaced, which pushed "See the cohort calendar" onto a second line at every
   desktop width — the hero column is 581px and the untouched pair measures
   591px. The deficit is 10px, so it is bought back from the pills' own
   padding rather than from the type or from the faculty image's column. */
@media (min-width: 861px) {
  .pf-fellowship .pf-hero-details a.scp2 + a.scp3,
  .pf-fellowship .pf-hero-details a.scp2 { margin: 0 !important; }
  .pf-fellowship .pf-hero-details a.scp2 {
    gap: 9px !important;
    padding: 14px 13px 14px 20px !important;
  }
  .pf-fellowship .pf-hero-details a.scp3 { padding: 14px 18px !important; }
  .pf-fellowship .pf-hero-details a.scp2:first-child { margin-right: -2px !important; }
}

.pf-home-hero-price-row {
  display: flex !important;
  align-items: baseline !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

.pf-home-hero-price { color: var(--pf2-ink); font-size: 22px; font-weight: 850; }
.pf-home-hero-label { color: var(--pf2-muted); font-size: 13px; }
.pf-home-hero-note { margin-top: 8px; color: var(--pf2-muted); font-size: 13px; }

/* Proof and ledger stats: every content line stays intact */
.pf-fellowship section[data-screen-label="Proof bar"] > :first-child {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.pf-fellowship section[data-screen-label="Proof bar"] > :first-child > div,
.pf-fellowship section[data-screen-label="Ledger strip"] > :first-child > div {
  min-width: 0 !important;
}

/* The first ledger cell carries two caption lines where the other two carry
   one. Centring the content inside a stretched cell keeps the three readings
   on a shared optical axis while the divider strokes stay full height — which
   `align-self: center` on the cell itself would not. */
.pf-fellowship section[data-screen-label="Ledger strip"] > :first-child > div {
  display: flex !important;
  flex-direction: column;
  justify-content: center;
}

.pf-fellowship section[data-screen-label="Proof bar"] > :first-child > div > :first-child {
  font-size: clamp(21px, 2.2vw, 28px) !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

.pf-fellowship section[data-screen-label="Proof bar"] > :first-child > div > :nth-child(2) {
  font-size: clamp(10.5px, 1vw, 12.5px) !important;
  line-height: 1.45 !important;
  white-space: nowrap !important;
}

.pf-fellowship section[data-screen-label="Proof bar"] > :nth-child(2) > * {
  white-space: nowrap !important;
}

.pf-fellowship section[data-screen-label="Proof bar"] > :nth-child(2) > :last-child {
  font-size: clamp(10px, 3.35vw, 15px) !important;
}

.pf-fellowship section[data-screen-label="Ledger strip"] > :first-child {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.pf-fellowship section[data-screen-label="Ledger strip"] > :first-child > div > * {
  white-space: nowrap !important;
}

.pf-home-ledger-price { color: var(--pf2-ink); font-size: clamp(21px, 2.4vw, 26px); font-weight: 800; letter-spacing: -.01em; }
.pf-home-ledger-label { margin-top: 5px; color: var(--pf2-muted); font-size: 11px; font-weight: 700; letter-spacing: 1.8px; text-transform: uppercase; }

/* Four-step explainer cards */
.pf-fellowship .pf-how-grid { align-items: stretch !important; }
.pf-fellowship .pf-how-card {
  align-items: center !important;
  text-align: center !important;
}
.pf-fellowship .pf-how-card > :last-child {
  max-width: 235px;
  margin-inline: auto !important;
}

/* Course cards */
.pf-fellowship section[data-screen-label="Course tiles"] .pf-course-card {
  gap: 18px !important;
  padding: 26px !important;
}

.pf-course-card__metadata,
.pf-course-card__empty { display: none !important; }

/* Cohort dates. The 2x2 metadata block above stays hidden — it holds four
   facts and reads as a spec sheet. What a card actually has to answer is
   "when does this run", so that one fact is promoted to its own row, styled
   like the capstone footer beneath it rather than like a panel. */
/* The date row takes over the bottom anchor the price row used to hold, so
   dates, price and capstone footer travel together as one bottom-aligned
   block. Without this the date row floats on whatever the description and
   faculty credit happen to measure, and three cards in a row disagree by a
   line of text. */
.pf-course-card__dates { margin-top: auto !important; }
.pf-course-card__dates + .pf-course-card__price { margin-top: 0 !important; }

/* Eight tiles in a three-across grid leave the last row two-thirds full. A
   six-track grid at the width where three columns appear gives each card the
   identical span-2 width it already had, and lets the final pair start one
   track in — so the row closes symmetrically instead of trailing off to the
   right. Below this width the auto-fit grid resolves to two columns (four
   full rows) or one, and neither needs help. */
@media (min-width: 1110px) {
  .pf-fellowship .pf-course-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }
  .pf-fellowship .pf-course-grid > [role="button"] { grid-column: span 2; }
  .pf-fellowship .pf-course-grid > [role="button"]:nth-last-child(2) { grid-column: 2 / span 2; }
}

.pf-course-card__intro { min-height: 104px !important; }
.pf-course-card__faculty { min-height: 106px !important; align-items: center !important; }
.pf-course-card__faculty img { width: 72px !important; height: 72px !important; box-shadow: 0 8px 22px rgba(11,20,48,.14); }
.pf-course-card__faculty > div:first-child img + img { margin-left: -18px !important; }
.pf-course-card__price { margin-top: auto !important; }
.pf-course-card__footer { min-height: 56px; align-items: flex-start; }

/* Ten faculty in a three-across grid leave the tenth alone at the left of a
   fourth row. Same six-track trick the course tiles use: at the width where
   three columns appear, each card keeps the 360px it already had and the last
   one starts a track in, so it sits under the middle column rather than
   trailing off to the left. Below 1020px the grid resolves to two columns —
   five full rows — and to one below that, and neither needs help. */
@media (min-width: 1020px) {
  .pf-fellowship .pf-faculty-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }
  .pf-fellowship .pf-faculty-grid > .scp8 { grid-column: span 2; }
  .pf-fellowship .pf-faculty-grid > .scp8:last-child { grid-column: 3 / span 2; }
}

/* Problem: 70/30, vertically centered */
.pf-fellowship .pf-problem-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 7fr) minmax(260px, 3fr) !important;
  align-items: center !important;
  gap: clamp(34px, 5vw, 72px) !important;
}

.pf-problem-copy,
.pf-problem-list { min-width: 0 !important; padding-top: 0 !important; }

/* Instructor cards: shared vertical rhythm */
.pf-fellowship .pf-instructor-card {
  display: grid !important;
  grid-template-rows: auto auto minmax(42px, auto) minmax(48px, 1fr) auto;
  align-content: start;
  align-items: center;
  justify-items: center;
  height: 100%;
  gap: 8px !important;
  text-align: center !important;
}

.pf-instructor-card__photo { justify-self: stretch; width: 100%; margin-bottom: 8px !important; }
.pf-instructor-card__name { align-self: end; }
.pf-instructor-card__role { align-self: start; max-width: 290px; }
.pf-instructor-card__bio { align-self: start; max-width: 290px; }
.pf-instructor-card__next { align-self: end; width: 100%; margin-top: 8px !important; text-align: center !important; }

/* Journey content left, progression right, vertically aligned */
.pf-fellowship .pf-journey-columns {
  display: grid !important;
  grid-template-columns: minmax(0, 7fr) minmax(260px, 3fr) !important;
  align-items: stretch !important;
  gap: clamp(42px, 7vw, 96px) !important;
  margin-top: 0 !important;
}

.pf-journey-copy,
.pf-journey-flow { min-width: 0 !important; }

.pf-fellowship .pf-journey-copy { justify-content: flex-start !important; }
.pf-fellowship .pf-journey-heading {
  max-width: none !important;
  margin-bottom: clamp(48px, 6vw, 76px) !important;
}
.pf-fellowship .pf-journey-heading h2 { max-width: 620px; }
.pf-fellowship .pf-journey-flow {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  align-self: stretch !important;
  height: auto !important;
  margin-top: 0 !important;
}

/* Difference table */
.pf-comparison-grid { border: 0 !important; background: transparent !important; gap: 1px; }
.pf-fellowship .pf-comparison-cell { border-color: var(--pf2-line) !important; }
.pf-fellowship .pf-comparison-cell--fellowship-head { background: #fff0a8 !important; color: var(--pf2-ink) !important; box-shadow: inset 0 -3px 0 var(--pf2-yellow); }
.pf-fellowship .pf-comparison-cell--ondemand-head { background: #f8f9fc !important; color: var(--pf2-muted) !important; }
.pf-fellowship .pf-comparison-cell--fellowship { background: var(--pf2-card) !important; color: var(--pf2-ink) !important; }
.pf-fellowship .pf-comparison-cell--ondemand { background: #f8f9fc !important; color: var(--pf2-muted) !important; }

/* Reference content, normalized to the Beacon page scale */
.pf-standard-pricing__header { display: none !important; }
.pf-standard-pricing__cards { max-width: 640px !important; display: block !important; }
.pf-standard-pricing__reference { display: none !important; }
.pf-fellowship .pf-standard-pricing__card {
  width: 100%;
  min-width: 0 !important;
  padding: clamp(28px, 2.8vw, 32px) !important;
  border: 1px solid #d8dfeb !important;
  border-radius: 24px !important;
  background: var(--pf2-card) !important;
  color: var(--pf2-ink) !important;
  box-shadow: var(--pf2-sh2) !important;
}

.pf-price-card__pill {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 42px;
  padding: 9px 19px;
  border: 2px solid var(--pf2-yellow);
  border-radius: 999px;
  background: #fffaf0;
  color: var(--pf2-yellow-txt);
  font-size: clamp(12px, 1.1vw, 13px);
  font-weight: 850;
  letter-spacing: .14em;
  line-height: 1.1;
  text-transform: uppercase;
}

.pf-price-card__pricebox {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 20px;
}

.pf-price-card__price-current {
  color: var(--pf2-ink);
  font-size: clamp(56px, 5.4vw, 68px);
  font-weight: 900;
  letter-spacing: -.055em;
  line-height: .92;
}

.pf-price-card__price-original {
  color: #9aa5b8;
  font-size: clamp(21px, 2vw, 24px);
  font-weight: 650;
}

.pf-price-card__price-current--promo { color: #17795c; }
.pf-price-card__price-label {
  margin-top: 8px;
  color: var(--pf2-muted);
  font-size: clamp(15px, 1.35vw, 16px);
  line-height: 1.45;
}

.pf-price-card__applied {
  margin-top: 20px !important;
  padding: 13px 16px !important;
  border: 1px solid #b9dfd1 !important;
  border-radius: 12px !important;
  background: #edf8f4 !important;
  color: #176f57 !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  line-height: 1.5 !important;
}

.pf-price-card__headline {
  max-width: 850px;
  margin: clamp(24px, 2.8vw, 30px) 0 0;
  color: var(--pf2-ink);
  font-size: clamp(28px, 2.7vw, 32px);
  font-weight: 850;
  letter-spacing: -.035em;
  line-height: 1.12;
}

.pf-price-card__callout {
  margin-top: clamp(20px, 2.4vw, 24px);
  padding: clamp(18px, 2.2vw, 22px);
  border: 2px solid #e1b533;
  border-radius: 16px;
  background: #fffaf0;
  color: var(--pf2-ink);
  font-size: clamp(16px, 1.5vw, 17px);
  line-height: 1.45;
}

.pf-price-card__benefits { margin-top: 10px; }
.pf-price-card__benefit {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 13px;
  align-items: start;
  padding: 12px 4px;
  border-bottom: 1px solid var(--pf2-line);
}
.pf-price-card__check {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 2px solid var(--pf2-yellow-txt);
  border-radius: 50%;
  color: var(--pf2-yellow-txt);
  font-size: 14px;
  font-weight: 900;
  line-height: 1;
}
.pf-price-card__benefit strong {
  display: block;
  color: var(--pf2-ink);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.3;
}
.pf-price-card__benefit div > span {
  display: block;
  margin-top: 3px;
  color: var(--pf2-muted);
  font-size: clamp(14px, 1.4vw, 15px);
  line-height: 1.4;
}

.pf-fellowship .pf-price-card__cta {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 18px !important;
  width: 100% !important;
  min-height: 56px;
  margin-top: 20px !important;
  padding: 16px 22px !important;
  border-radius: 12px !important;
  background: var(--pf2-yellow) !important;
  color: var(--pf2-yellow-ink) !important;
  box-shadow: var(--pf2-glow) !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  letter-spacing: .13em !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-decoration: none !important;
}
.pf-price-card__cta > span { font-size: 1.45em; line-height: .8; text-decoration: none !important; }
.pf-price-card__refund,
.pf-price-card__proof {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: var(--pf2-muted);
  font-size: 14px;
  line-height: 1.45;
  text-align: center;
}
.pf-price-card__refund { margin-top: 20px; }
.pf-price-card__refund > span:first-child {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  border: 2px solid #1da66f;
  border-radius: 50%;
  color: #168457;
  font-weight: 900;
}
.pf-price-card__proof { margin-top: 12px; }
.pf-price-card__stars {
  flex: 0 0 auto;
  color: var(--pf2-yellow-txt);
  font-size: 17px;
  letter-spacing: 2px;
}
.pf-standard-pricing__card .pf-home-subscriber-benefits {
  margin-top: 14px;
  color: #176f57;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.7;
}
.pf-standard-pricing__card .pf-home-subscriber-deadline {
  margin-top: 6px;
  color: var(--pf2-rose-strong);
  font-size: 14px;
  font-weight: 700;
}
.pf-standard-pricing__table-row { background: var(--pf2-paper2) !important; border-color: var(--pf2-line) !important; }
.pf-standard-pricing__table-row > * { color: var(--pf2-ink) !important; }

/* Footer descriptor */
.footer-general .pf-footer-description {
  max-width: 330px;
  margin: -8px 0 0 !important;
  color: #aebce0 !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
}

@media (max-width: 860px) {
  .pf-fellowship .pf-hero-kicker {
    margin-bottom: 22px !important;
    padding-left: 13px !important;
    white-space: normal;
  }

  .pf-fellowship .pf-hero-layout { align-items: start !important; }
  .pf-fellowship .pf-hero-faculty { align-self: auto !important; margin-top: 24px !important; padding: 0 !important; }
  .pf-fellowship .pf-hero-faculty img,
  .pf-fellowship [data-pf-img="hero-faculty-group"] { height: auto !important; transform: none !important; }

  .pf-fellowship section[data-screen-label="Proof bar"] > :first-child,
  .pf-fellowship section[data-screen-label="Ledger strip"] > :first-child {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .pf-fellowship section[data-screen-label="Proof bar"] > :first-child > div:nth-child(3),
  .pf-fellowship section[data-screen-label="Ledger strip"] > :first-child > div:nth-child(3) {
    border-left: 0 !important;
  }

  .pf-fellowship .pf-problem-layout,
  .pf-fellowship .pf-journey-columns { grid-template-columns: minmax(0, 1fr) !important; }
  .pf-fellowship .pf-journey-columns { gap: 38px !important; }
  .pf-fellowship .pf-journey-heading { margin-bottom: 34px !important; }
  .pf-fellowship .pf-journey-flow { margin-top: 0 !important; }
  .pf-price-card__proof { flex-direction: column; gap: 5px; }
}

@media (max-width: 640px) {
  .pf-fellowship section[data-screen-label="Proof bar"] > :first-child,
  .pf-fellowship section[data-screen-label="Ledger strip"] > :first-child {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .pf-fellowship section[data-screen-label="Proof bar"] > :first-child > div,
  .pf-fellowship section[data-screen-label="Ledger strip"] > :first-child > div {
    border-left: 0 !important;
  }
  .pf-fellowship section[data-screen-label="Proof bar"] > :nth-child(2) {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    gap: 5px !important;
  }
  /* Everything below is a size, not a structure, so it scales rather than
     steps. Each clamp's maximum is the value the rule above 640 already
     produces, and 640 is where its vw term reaches that maximum — so the
     transition through the breakpoint is continuous and there is no width at
     which the card visibly snaps. The floors are what a 360 phone gets, and
     they exist to hand room back to the text: a course tile gains 18px of
     inner width at 390, which is most of a word. */
  .pf-fellowship section[data-screen-label="Course tiles"] .pf-course-card {
    padding: clamp(17px, 4.06vw, 26px) !important;
  }
  .pf-course-card__intro { min-height: 0 !important; }
  .pf-course-card__faculty { min-height: 0 !important; }
  .pf-course-card__footer { min-height: 0; }
  .pf-comparison-grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr) !important; }
  .pf-fellowship .pf-hero-faculty { padding: 0 !important; }

  .pf-fellowship .pf-standard-pricing__card {
    padding: clamp(18px, 4.375vw, 28px) !important;
    border-radius: clamp(16px, 2.81vw, 18px) !important;
  }
  .pf-price-card__pill {
    min-height: clamp(34px, 6.56vw, 42px);
    padding: clamp(6px, 1.4vw, 9px) clamp(12px, 2.97vw, 19px);
    font-size: clamp(10.5px, 1.88vw, 12px);
  }
  .pf-price-card__price-current { font-size: clamp(40px, 8.75vw, 56px); }
  .pf-price-card__price-label { font-size: clamp(13px, 2.34vw, 15px); }
  .pf-price-card__headline { font-size: clamp(22px, 4.38vw, 28px); }
  .pf-price-card__callout {
    padding: clamp(13px, 2.81vw, 18px);
    font-size: clamp(14.5px, 2.5vw, 16px);
  }
  .pf-price-card__benefit {
    grid-template-columns: clamp(26px, 5vw, 32px) minmax(0, 1fr);
    gap: clamp(10px, 2.03vw, 13px);
    padding: clamp(10px, 1.88vw, 12px) clamp(2px, .63vw, 4px);
  }
  .pf-price-card__check {
    width: clamp(22px, 4.06vw, 26px);
    height: clamp(22px, 4.06vw, 26px);
    font-size: clamp(12px, 2.19vw, 14px);
  }
  .pf-price-card__benefit strong { font-size: clamp(15px, 2.5vw, 16px); }
  .pf-price-card__benefit div > span { font-size: clamp(13.5px, 2.19vw, 14px); }
  .pf-fellowship .pf-price-card__cta {
    min-height: clamp(50px, 8.75vw, 56px);
    padding: clamp(13px, 2.5vw, 16px) clamp(14px, 3.44vw, 22px) !important;
    font-size: clamp(13px, 2.34vw, 15px) !important;
    letter-spacing: .08em !important;
  }
  .pf-price-card__refund,
  .pf-price-card__proof { font-size: clamp(13px, 2.19vw, 14px); }
}

/* ==========================================================================
   Fluid + mobile layer — homepage                         (added 2026-08-24)
   --------------------------------------------------------------------------
   Same two rules as theme.css: media queries only where the structure
   changes, clamp() for everything that is merely a size, and nothing that
   moves a pixel at >=861px. Every clamp below is tuned so its value at the
   query's own edge equals the fixed value it replaced.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Orphan control. Phone-only, so desktop line breaking is untouched.
   -------------------------------------------------------------------------- */
/* `balance`, not `pretty`, is what removes a one-word last line here — see the
   measurement noted in theme.css. `pretty` leaves two- and three-line labels
   exactly as `auto` did, and almost every label on this page is that short.
   Blocks, not spans: `text-wrap` is a property of the box that does the line
   breaking, so a bare <span> inside a div never picks it up. */
@media (max-width:860px){
  .pf-fellowship p,
  .pf-fellowship li,
  .pf-fellowship h1,.pf-fellowship h2,.pf-fellowship h3,.pf-fellowship h4,
  .pf-fellowship summary,
  .pf-course-card__intro p,
  .pf-course-card__title,
  .pf-instructor-card__bio,
  .pf-instructor-card__role,
  .pf-instructor-card__next,
  .pf-instructor-card__next > span,
  .pf-journey-copy div,
  .pf-journey-flow div,
  .pf-price-card__callout,
  .pf-price-card__proof,
  .pf-price-card__benefit div,
  .pf-comparison-cell,
  .pf-how-card > div{
    text-wrap:balance;
  }

  /* Much of this page's copy sits in unclassed divs emitted by the section
     scripts, so there is no hook to name. `text-wrap` only does anything on a
     box that actually lays out inline content, so a div wrapping other divs is
     unaffected — this reaches the text and nothing else. */
  .pf-fellowship div{text-wrap:balance;}

  /* FAQ answers run well past the line count `balance` will touch, so they
     take `pretty` instead. */
  .pf-fellowship section#faq p{text-wrap:pretty;}
}

/* --------------------------------------------------------------------------
   The price row of a course tile is a two-part statement: what it costs on
   its own, and whether it is enrolling. Both halves are meant to read as one
   line each. The status pill was being squeezed to 94px and breaking "Waitlist
   open" across two lines, which is the defect that reads worst on a phone.
   -------------------------------------------------------------------------- */
.pf-course-card__price > div{min-width:0;}
.pf-course-card__price > span,
.pf-course-card__price > a{white-space:nowrap;flex:0 0 auto;}

@media (max-width:640px){
  /* Wrapping is allowed but not forced. An earlier version pinned the left
     half to `flex:1 1 100%`, which pushed the status pill onto its own line at
     every phone width even though the pair fits side by side at 390. Letting
     the row wrap on its own keeps them on one line while there is room and
     only breaks when there genuinely is not. */
  .pf-course-card__price{
    flex-wrap:wrap!important;
    row-gap:10px!important;
  }
}

/* --------------------------------------------------------------------------
   Faculty strip. Two overlapping portraits plus a three-line credential left
   the text column at ~188px on a 390 phone. The portraits scale down with the
   viewport instead, and resolve to exactly the previous 64px at the 640 edge.
   -------------------------------------------------------------------------- */
@media (max-width:640px){
  .pf-course-card__faculty{min-height:0!important;gap:clamp(9px,2.6vw,12px)!important;}
  .pf-course-card__faculty img{
    width:clamp(50px,11.25vw,72px)!important;
    height:clamp(50px,11.25vw,72px)!important;
  }
  .pf-course-card__faculty > div:first-child img + img{
    margin-left:clamp(-16px,-3.6vw,-12px)!important;
  }
  .pf-course-card__faculty > div:last-child{min-width:0;text-wrap:pretty;}
}

/* --------------------------------------------------------------------------
   Calendar rail. The "Today - Jul 1, 2026" marker is a single label and must
   never break; the cohort rows keep their date and meta on one line each.
   -------------------------------------------------------------------------- */
@media (max-width:860px){
  #calList > div,
  .pf-fellowship #calendar [class*="pill"]{white-space:nowrap;}
}

/* --------------------------------------------------------------------------
   Comparison grid. Two columns is the point of the section, so it stays two
   columns at every width; only the padding and type scale.
   -------------------------------------------------------------------------- */
@media (max-width:640px){
  .pf-comparison-cell{
    padding:clamp(11px,2.81vw,18px) clamp(9px,3.44vw,22px)!important;
  }
  .pf-comparison-cell span{font-size:clamp(11.5px,3.2vw,12.5px);}
}

/* --------------------------------------------------------------------------
   Ledger rows under the pricing card. Course name flexes, amount never wraps.
   -------------------------------------------------------------------------- */
/* `:not([class])` is load-bearing. The ledger sits in an unclassed div, while
   its sibling `.pf-standard-pricing__cards` holds the price card. Without the
   guard this also caught the card's own refund and proof rows and pinned them
   to `nowrap`, which ran them straight off the right edge of the card. */
@media (max-width:860px){
  #pricing > div:not([class]) > div{align-items:baseline!important;}
  #pricing > div:not([class]) > div > span:first-child,
  #pricing .pf-standard-pricing__table-row > span:first-child{min-width:0;text-wrap:balance;}
  #pricing > div:not([class]) > div > span:last-child{white-space:nowrap;flex:0 0 auto;}
}

/* --------------------------------------------------------------------------
   Footer bottom row — mirrors the theme.css rule, because the homepage ships
   its own copy of the footer stylesheet inline rather than loading theme.css.
   -------------------------------------------------------------------------- */
@media (max-width:860px){
  .footer-general .text-block-260 a{padding:7px 0!important;}
}
@media (max-width:640px){
  .footer-general .div-block-475{
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:20px!important;
  }
  /* `balance`, not `pretty`: the line is a run of separate links, so there is
     no trailing word for `pretty` to pull down. Balancing splits it evenly
     instead of leaving "GDPR" stranded on a line of its own. */
  .footer-general .text-block-261{text-wrap:balance;line-height:1.85!important;}
  /* Links stay atomic so balancing cannot break inside "Privacy Policy". */
  .footer-general .text-block-261 a{white-space:nowrap!important;}
  .footer-general .div-block-538{margin-left:-8px!important;}
  .footer-general .footer-devider-line{margin:36px 0 18px!important;}
}

/* --------------------------------------------------------------------------
   Footer link columns. Two columns leaves each one 157px on a 390 phone, and
   "Product Strategy Playbook" needs about 175px — so it wraps, and no amount
   of balancing helps because there is no break that fits. Below 480 the pair
   becomes a single column and every label gets its own line back. Two columns
   survive from 480 up, where they do fit.
   -------------------------------------------------------------------------- */
@media (max-width:479px){
  .footer-general .div-block-469{grid-template-columns:minmax(0,1fr)!important;row-gap:34px!important;}
}