/* ==== 00-base.css ==== */
/* The Resiliency Solution - base tokens, reset, type, buttons.
   Values measured from the live WordPress/Thrive site (Sept 2026). */

:root {
  --slate: #556177;        /* body text + dark headings */
  --orange: #f3a326;       /* primary buttons, accent headings */
  --orange-dark: #db8f17;
  --blue: #7faec8;         /* secondary buttons, card headings, pills */
  --blue-dark: #6a9ab5;
  --blue-pale: #eff7fb;    /* light section background */
  --blue-line: #d2e1eb;    /* number-badge ring */
  --peach: #fbdfb3;        /* orange @ 35% on white */
  --ink: #000;
  --line: #e6e6e6;
  --shadow: 0 0 12px rgba(0, 0, 0, .09);
  --radius: 14px;
  --font: "Open Sans", Arial, Helvetica, sans-serif;
  --w: 1080px;             /* standard content width */
  --w-mid: 1120px;
  --w-wide: 1360px;
  --gutter: 20px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: #fff;
  color: var(--slate);
  font-family: var(--font);
  font-size: 18px;
  line-height: 1.49;
  letter-spacing: 1px;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
[hidden] { display: none !important; }
li { letter-spacing: normal; line-height: 1.4; }   /* Thrive list elements: normal tracking, 1.4 leading */
a { color: var(--blue); }
a:hover { color: var(--blue-dark); }
h1, h2, h3, h4, h5, h6, p, ul, ol, blockquote, figure { margin: 0; }
h1, h2, h3, h4, h5, h6 { line-height: 1.35; }
button, input, textarea, select { font: inherit; letter-spacing: inherit; }

.skip-link { position: absolute; left: -9999px; top: 0; z-index: 1000; background: #fff; padding: 8px 12px; }
.skip-link:focus { left: 8px; top: 8px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- layout ---------- */
.wrap { width: 100%; max-width: calc(var(--w) + 2 * var(--gutter)); margin: 0 auto; padding: 0 var(--gutter); }
.wrap--mid { max-width: calc(var(--w-mid) + 2 * var(--gutter)); }
.wrap--wide { max-width: calc(var(--w-wide) + 2 * var(--gutter)); }
.wrap--narrow { max-width: calc(860px + 2 * var(--gutter)); }

.section { padding: 45px 0; }
.section--pale { background: var(--blue-pale); }
.section--peach { background: var(--peach); padding: 58px 0 80px; }
.section--white { background: #fff; }
.center { text-align: center; }
.stack > * + * { margin-top: 20px; }
.stack-sm > * + * { margin-top: 10px; }

/* ---------- type ---------- */
.display {                 /* the big 38px capitalised headings */
  font-size: 38px;
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: capitalize;
  color: var(--slate);
}
.display--orange { color: var(--orange); }
.display--blue { color: var(--blue); }
.display--sm { font-size: 38px; }  /* same on desktop; steps down further on phones */
.lead-q {                  /* 24px bold statement lines */
  font-size: 24px;
  line-height: 1.49;
  font-weight: 700;
  letter-spacing: 1px;
}
.accent { color: var(--orange); }
.subhead {                 /* 21px orange "Here's how to get started" */
  font-size: 21px;
  line-height: 1.49;
  font-weight: 700;
  color: var(--orange);
  letter-spacing: 1px;
}
.card-title {              /* 24px blue card headings */
  font-size: 24px;
  line-height: 1.4;
  font-weight: 700;
  letter-spacing: normal;
  color: var(--blue);
}
.prose > * + * { margin-top: 26px; }
.prose ul, .prose ol { padding-left: 1.3em; }
.prose li + li { margin-top: 6px; }
.prose h2 { font-size: 28px; color: var(--slate); }
.prose h3 { font-size: 24px; color: var(--blue); }
.prose a { text-decoration: underline; }
.prose strong { font-weight: 700; }

/* ---------- buttons ---------- */
.btn {
  display: inline-block;
  background: var(--orange);
  color: #fff;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 400;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  padding: 17px 21px;
  border: 0;
  border-radius: var(--radius);
  cursor: pointer;
  transition: background-color .2s ease;
  max-width: 100%;
  overflow-wrap: anywhere;
}
.btn:hover, .btn:focus-visible { background: var(--orange-dark); color: #fff; }
.btn--blue { background: var(--blue); }
.btn--blue:hover, .btn--blue:focus-visible { background: var(--blue-dark); }
.btn--sm { font-size: 14px; padding: 14px 21px; }
.btn--lg { font-size: 21px; }
.btn-row { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.btn-col { display: flex; flex-direction: column; align-items: center; gap: 14px; }

.pill {                    /* "PERFORM AT YOUR HIGHEST LEVEL" */
  display: inline-block;
  background: var(--blue);
  color: #fff;
  font-size: 18px;
  line-height: 1.2;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 7px;
  border-radius: var(--radius);
}

.rounded { border-radius: var(--radius); }

@media (max-width: 767px) {
  .display { font-size: 36px; }
  .display--sm { font-size: 28px; }
  .lead-q { font-size: 22px; }
  .section { padding: 36px 0; }
  .pill { font-size: 13px; }
  .btn { padding: 17px 18px; }
}

/* ==== 10-header-footer.css ==== */
/* ---------- header ---------- */
.site-header { background: #fff; position: relative; z-index: 50; }
.site-header__inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 7px 49px;
  min-height: 103px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.site-logo img { width: 295px; height: auto; }

.nav__list { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; }
.nav__list > li { position: relative; }
.nav__list a { text-decoration: none; }
.nav .nav__list > li > a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 13px;
  color: #000;
  font-size: 14px;
  line-height: 28px;
  letter-spacing: normal;
  text-transform: uppercase;
  white-space: nowrap;
}
.nav .nav__list > li > a > span.txt { border-bottom: 1px solid transparent; }
.nav .nav__list > li > a:hover,
.nav .nav__list > li > a[aria-current="page"] { text-decoration: underline; text-underline-offset: 6px; }
.caret { width: 10px; height: 14px; fill: currentColor; flex: none; }

.nav__cta { margin-left: 8px; }
.nav .nav__cta > a {
  border: 2px solid #d2e1eb;
  border-radius: 12px;
  padding: 8px 6px;
  letter-spacing: 1px;
}
.nav .nav__cta > a:hover { text-decoration: none; border-color: var(--blue); }

/* dropdowns (desktop) */
.sub-menu {
  list-style: none;
  margin: 0;
  padding: 8px 0;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 260px;
  background: #f5fbfd;
  border: 1px solid #d2e1eb;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .04);
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition: opacity .15s ease, transform .15s ease, visibility .15s;
}
.has-sub:hover > .sub-menu,
.has-sub:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.sub-menu a {
  display: block;
  padding: 12px 14px;
  color: #222;
  font-size: 13px;
  line-height: 1.4;
  letter-spacing: normal;
  text-transform: uppercase;
  white-space: nowrap;
}
.sub-menu a:hover { color: var(--blue-dark); background: #eaf4f9; }
.sub-toggle { display: none; }

/* hamburger */
.nav-toggle {
  display: none;
  width: 44px; height: 44px;
  padding: 10px 8px;
  border: 0; background: none; cursor: pointer;
  flex-direction: column; justify-content: space-between;
}
.nav-toggle span { display: block; height: 3px; border-radius: 2px; background: var(--slate); transition: transform .2s ease, opacity .2s ease; }
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(10.5px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-10.5px) rotate(-45deg); }

@media (max-width: 1279px) {
  .site-header__inner { padding: 7px 24px; }
  .nav .nav__list > li > a { padding: 5px 8px; }
}
@media (max-width: 1179px) {
  .site-header__inner { min-height: 84px; flex-wrap: wrap; padding: 8px 20px; }
  .site-logo img { width: 230px; }
  .nav-toggle { display: flex; }
  .nav {
    display: none;
    flex-basis: 100%;
    border-top: 1px solid var(--line);
    padding: 6px 0 14px;
  }
  .nav.is-open { display: block; }
  .nav .nav__list { flex-direction: column; align-items: stretch; }
  .nav .nav__list > li { display: flex; flex-wrap: wrap; align-items: center; border-bottom: 1px solid #f1f1f1; }
  .nav .nav__list > li > a { flex: 1; padding: 10px 4px; font-size: 15px; }
  .nav .nav__list > li > a .caret { display: none; }
  .nav .sub-toggle {
    display: flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; border: 0; background: none; cursor: pointer; color: var(--slate);
  }
  .nav .sub-toggle .caret { width: 12px; height: 16px; transition: transform .2s ease; }
  .nav .sub-toggle[aria-expanded="true"] .caret { transform: rotate(180deg); }
  .nav .sub-menu {
    position: static; flex-basis: 100%;
    opacity: 1; visibility: visible; transform: none;
    display: none; box-shadow: none; border: 0; background: var(--blue-pale);
    padding: 4px 0; margin-bottom: 8px; min-width: 0;
  }
  .nav .sub-menu.is-open { display: block; }
  .nav .sub-menu a { white-space: normal; padding: 10px 16px; }
  .nav__cta { margin: 12px 0 0; border-bottom: 0 !important; }
  .nav .nav__cta > a { justify-content: center; padding: 10px; }
}
@media (max-width: 480px) {
  .site-logo img { width: 250px; }
}

/* ---------- footer ---------- */
.site-footer { background: #fff; padding: 56px 0 24px; text-align: center; }
.site-footer__inner { max-width: 1120px; margin: 0 auto; padding: 0 var(--gutter); }
.site-footer__logo { display: inline-block; }
.site-footer__logo img { width: 280px; margin: 0 auto; }

.footer-nav { margin: 22px 0 16px; }
.footer-nav .nav__list { justify-content: center; flex-wrap: wrap; }
.footer-nav .nav__list > li > a {
  display: flex; align-items: center; gap: 8px;
  padding: 5px 25px;
  color: var(--slate);
  font-size: 15px;
  font-weight: 300;
  line-height: 26px;
  letter-spacing: normal;
  text-transform: uppercase;
}
.footer-nav .nav__list > li > a:hover { text-decoration: underline; }
.footer-nav .sub-menu { text-align: left; }

.site-footer__buttons { display: flex; flex-direction: column; align-items: center; gap: 13px; margin-bottom: 16px; }
.site-footer__meta { font-size: 16px; line-height: 1.7; letter-spacing: 2px; margin-top: 12px; }
.site-footer__meta a { color: var(--slate); text-decoration: none; }
.site-footer__meta a:hover { text-decoration: underline; }
.site-footer__meta .sep { margin: 0 6px; }

.social { list-style: none; padding: 0; margin: 22px 0 16px; display: flex; justify-content: center; gap: 8px; }
.social a {
  display: flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 50%;
  background: linear-gradient(to right bottom, rgba(126, 175, 200, .5) 50%, rgba(126, 175, 200, .7) 50%);
  color: #fff;
}
.social a:hover { background: linear-gradient(rgba(255, 255, 255, .2), rgba(255, 255, 255, .2)), linear-gradient(to right bottom, rgba(126, 175, 200, .5) 50%, rgba(126, 175, 200, .7) 50%); }
.social svg { width: 21px; height: 21px; fill: currentColor; }

.legal-nav { list-style: none; padding: 0; margin: 0 0 18px; display: flex; flex-wrap: wrap; justify-content: center; }
.legal-nav a {
  display: block; padding: 2px 14px;
  color: var(--slate); font-size: 13px; font-weight: 300; line-height: 26px;
  letter-spacing: normal; text-transform: uppercase; text-decoration: none;
}
.legal-nav a:hover { text-decoration: underline; }

.site-footer__copy { font-size: 11px; line-height: 1.7; letter-spacing: 2px; color: #000; }
.site-footer__copy span { display: block; }
.site-footer__copy span + span { margin-top: 18px; }
.site-footer__copy a { color: #000; text-decoration: none; }
.site-footer__copy a:hover { text-decoration: underline; }

@media (max-width: 1179px) {
  .footer-nav .caret { display: none; }
  .footer-nav .sub-menu { display: none !important; }
}
@media (max-width: 767px) {
  .site-footer__logo img { width: 230px; }
  .footer-nav .nav__list { flex-direction: column; }
  .footer-nav .nav__list > li > a { padding: 4px 10px; justify-content: center; }
  .site-footer__meta { font-size: 14px; letter-spacing: 1px; }
  .legal-nav { flex-direction: column; }
}

/* ==== 20-components.css ==== */
/* Reusable page sections. Class names describe the pattern, not the page. */

/* ---------- two-column split (text + media) ---------- */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 45px; align-items: center; }
.split--text-wide { grid-template-columns: 1.05fr 1fr; }
.split--media-left > :first-child { order: 2; }
.split__text > * + * { margin-top: 10px; }
.split__text .btn { margin-top: 18px; }

/* ---------- home hero ---------- */
.hero { background: var(--blue-pale); padding: 48px 0; }
.hero .split { grid-template-columns: 670px 1fr; gap: 14px; }
.hero__title { margin-top: 12px; }
.hero .split__text { max-width: 640px; }
.hero__text { margin-top: 8px; }
.hero__text p + p { margin-top: 26px; }
.hero .btn { margin-top: 18px; }
.collage { display: grid; grid-template-columns: 413fr 14fr 21fr 195fr; grid-template-rows: auto auto; gap: 15px 0; }
.collage img { border-radius: var(--radius); width: 100%; }
.collage__a { grid-column: 1 / 2; grid-row: 1; }
.collage__b { grid-column: 3 / 5; grid-row: 1; align-self: end; }
.collage__c { grid-column: 1 / 5; grid-row: 2; width: 70% !important; justify-self: end; }

/* ---------- icon strip (5 benefits) ---------- */
.icon-strip { border-top: 1px solid #f1f1f1; border-bottom: 1px solid #f1f1f1; padding: 13px 0; background: #fff; }
.icon-strip__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); }
.icon-strip__list li { text-align: center; padding: 7px 3px; border-left: 1px solid #9fc3d7; }
.icon-strip__list li:first-child { border-left: 0; }
.icon-strip svg { width: 35px; height: 35px; fill: var(--blue); margin: 0 auto 12px; display: block; }
.icon-strip p { color: var(--orange); font-size: 16px; font-weight: 700; line-height: 1.49; letter-spacing: normal; text-transform: capitalize; }

/* ---------- white cards with a rule down the left ---------- */
.card-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.card { background: #fff; box-shadow: var(--shadow); padding: 40px; }
.card__inner { border-left: 1px solid var(--line); padding-left: 30px; height: 100%; }
.card__inner > * + * { margin-top: 10px; }
.card__inner .btn { margin-top: 16px; }

/* ---------- partner logo carousel ---------- */
.logo-carousel { position: relative; padding: 0 30px; }
.logo-carousel__track {
  display: flex; gap: 10px; overflow-x: auto; scroll-behavior: smooth;
  scrollbar-width: none; -ms-overflow-style: none;
  scroll-snap-type: x mandatory;
}
.logo-carousel__track::-webkit-scrollbar { display: none; }
.logo-carousel__track img { flex: none; width: 127px; height: 57px; object-fit: contain; scroll-snap-align: start; }
.logo-carousel__btn {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 28px; height: 40px; border: 0; background: none; cursor: pointer; color: #94a3b0; padding: 0;
}
.logo-carousel__btn svg { width: 20px; height: 20px; fill: currentColor; }
.logo-carousel__btn:hover { color: var(--slate); }
.logo-carousel__btn--prev { left: 0; }
.logo-carousel__btn--next { right: 0; }

/* ---------- testimonial ---------- */
.testimonial {
  display: grid; grid-template-columns: 280px 1fr; column-gap: 64px; align-items: center;
  grid-template-areas: "photo head" "photo quote";
}
.testimonial__photo { grid-area: photo; width: 280px; border-radius: var(--radius); }
.testimonial__head { grid-area: head; align-self: end; }
.testimonial__quote { grid-area: quote; align-self: start; }
.testimonial__name { font-size: 34px; font-weight: 400; line-height: 1.4; letter-spacing: normal; color: var(--blue); }
.testimonial__role { font-weight: 700; margin-top: 8px; }
.testimonial__quote { font-style: italic; margin-top: 26px; }

/* ---------- numbered steps ---------- */
.steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 71px; padding-top: 42px; }
.step {
  position: relative; background: #fff; border-radius: 35px;
  padding: 62px 30px 46px; text-align: center;
}
.step__num {
  position: absolute; left: 50%; top: -42px; transform: translateX(-50%);
  width: 80px; height: 84px; display: flex; align-items: center; justify-content: center;
  background: var(--blue); color: #fff; font-size: 50px; line-height: 1; letter-spacing: normal;
  border: 5px solid var(--blue-line); border-radius: 21px;
}
.step__title { font-size: 28px; font-weight: 700; line-height: 1.35; letter-spacing: 1px; text-transform: capitalize; color: var(--blue); }
.step p { color: #000; margin-top: 10px; }

/* ---------- responsive ---------- */
@media (max-width: 1279px) {
  .hero .split { grid-template-columns: 1.1fr 1fr; }
}
@media (max-width: 1023px) {
  .card-grid { grid-template-columns: 1fr; }
  .testimonial { gap: 36px; grid-template-columns: 220px 1fr; }
  .testimonial__photo { width: 220px; }
}
@media (max-width: 900px) {
  .split, .split--text-wide, .hero .split { grid-template-columns: 1fr; }
  .split--media-left > :first-child { order: 0; }
}
@media (max-width: 767px) {
  .hero { padding: 40px 0; text-align: center; }
  .collage { display: block; }
  .collage__a, .collage__b { display: none; }
  .collage__c { width: 100% !important; }
  .hero .split { gap: 18px; }
  /* phone order on the live site: pill, title, photo, text, button */
  .hero .split__text { display: contents; }
  .hero__media { order: 3; }
  .hero__text, .hero .split__text > .btn { order: 4; }
  .hero .split__text > .btn { justify-self: center; margin-top: 0; }
  .hero__pill { justify-self: center; }
  .icon-strip { padding: 30px 0; }
  .icon-strip__list { grid-template-columns: 1fr; gap: 14px; }
  .icon-strip__list li { border-left: 0; padding: 0; }
  .icon-strip svg { margin-bottom: 6px; }
  .card { padding: 21px 14px; }
  .card__inner { padding-left: 20px; }
  .card-title { font-size: 22px; }
  /* phone order on the live site: name + role, photo, quote */
  .testimonial { grid-template-columns: 1fr; grid-template-areas: "head" "photo" "quote"; text-align: center; row-gap: 16px; }
  .testimonial__quote { margin-top: 0; }
  .icon-strip p br { display: none; }
  .split__text { text-align: center; }
  .hero__title { font-size: 24px; }
  .testimonial__photo { margin: 0 auto; }
  .testimonial__name { font-size: 24px; }
  .step { padding: 64px 22px 30px; }
  .step__title { font-size: 24px; }
  .steps { gap: 40px; }
}

/* ---------- home: partners band ---------- */
.partners-band { padding: 72px 0 40px; }
.partners-band .wrap { max-width: none; padding: 0; }
.partners-band .display, .partners-band__sub { padding: 0 var(--gutter); }
.partners-band__sub { font-size: 19px; font-weight: 700; margin-top: 10px; }
.partners-band .logo-carousel { margin-top: 56px; }

/* ==== 30-forms.css ==== */
/* ---------- forms ---------- */
.form { display: grid; gap: 16px; text-align: left; }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form label, .form .form__label { display: block; font-size: 15px; font-weight: 600; letter-spacing: .5px; margin-bottom: 6px; color: var(--slate); }
.form .req { color: #b4432a; }
.form input[type="text"], .form input[type="email"], .form input[type="tel"], .form input[type="url"],
.form select, .form textarea {
  width: 100%;
  padding: 12px 14px;
  font-size: 16px;
  letter-spacing: normal;
  color: #333;
  background: #fff;
  border: 1px solid #c9d6df;
  border-radius: 8px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.form textarea { min-height: 140px; resize: vertical; }
.form input:focus, .form select:focus, .form textarea:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(127, 174, 200, .25); }
.form .btn { justify-self: start; }
.form--center .btn { justify-self: center; }
.form__hp { position: absolute; left: -5000px; }
.form__note { font-size: 14px; letter-spacing: .3px; }
.form__status { font-size: 15px; letter-spacing: .3px; min-height: 0; }
.form__status.is-ok { color: #2e7d4f; font-weight: 600; }
.form__status.is-error { color: #b4432a; font-weight: 600; }
.form__choices { display: grid; gap: 6px; }
.form__choices label { font-weight: 400; display: flex; gap: 8px; align-items: center; margin: 0; }

@media (max-width: 600px) {
  .form__row { grid-template-columns: 1fr; }
  .form .btn { justify-self: stretch; }
}

/* ==== 40-about-team.css ==== */
/* About / Our Team / bio pages — shared "pagehead" hero pattern, team cards,
   and bio-page components. Prefixed .pagehead-, .bio- (pattern, not page). */

/* ---------- pagehead: pill + big title + intro (+ optional contact list) + photo ---------- */
.pagehead { padding: 48px 0; }
.pagehead .split { grid-template-columns: 1fr 398px; gap: 24px; align-items: center; }
.pagehead__text { max-width: 640px; }
.pagehead__title { font-size: 42px; line-height: 1.35; font-weight: 700; letter-spacing: 1px; text-transform: capitalize; color: var(--slate); margin-top: 12px; }
.pagehead__intro { margin-top: 8px; }
.pagehead__intro p + p { margin-top: 18px; }
.pagehead__media img { width: 100%; border-radius: 0; }

.bio-caption { font-size: 12px; line-height: 1.49; letter-spacing: normal; margin-top: 14px; }
.bio-caption a { text-decoration: underline; }

.pagehead__contact { list-style: none; margin: 20px 0 0; padding: 0; }
.pagehead__contact li { display: flex; align-items: center; gap: 12px; }
.pagehead__contact li + li { margin-top: 16px; }
.pagehead__contact svg { width: 28px; height: 28px; fill: var(--orange); flex: none; }
.pagehead__contact a { color: var(--slate); text-decoration: none; }
.pagehead__contact a:hover { text-decoration: underline; }
.pagehead__contact--strong a { font-weight: 700; }

@media (max-width: 1279px) {
  .pagehead .split { grid-template-columns: 1fr 340px; }
}
@media (max-width: 900px) {
  .pagehead .split { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .pagehead { padding: 40px 0; text-align: center; }
  .pagehead .split { gap: 18px; }
  .pagehead__text { display: contents; }
  .pagehead__media { order: 3; max-width: 345px; margin: 0 auto; }
  .pagehead__intro { order: 4; }
  .pagehead__contact { order: 5; margin-top: 22px; }
  .pagehead__contact li { justify-content: center; }
  .pagehead__title { font-size: 28px; margin-top: 10px; }
  .bio-caption { text-align: center; }
}

/* ---------- team member / learn-more cards (built on shared .card-grid/.card/.card__inner) ---------- */
.team-card__photo { display: block; margin: 0 auto; border-radius: 0; }

/* ---------- "Meet X" intro section (white) ---------- */
.bio-meet__title { font-size: 35px; line-height: 1.35; font-weight: 700; letter-spacing: 1px; text-transform: capitalize; color: var(--orange); }
.bio-meet__text { margin-top: 20px; }
.bio-meet__photo { display: block; width: 100%; border-radius: 0; margin-top: 42px; }

.bio-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; margin-top: 42px; }
.bio-gallery--2 { grid-template-columns: repeat(2, 1fr); }
.bio-gallery img { width: 100%; border-radius: 0; display: block; }

@media (max-width: 767px) {
  .bio-meet__title { font-size: 22px; }
  .bio-gallery, .bio-gallery--2 { grid-template-columns: 1fr; }
}

/* ---------- "Speaker Bio" section (pale) ---------- */
.bio-speaker__title { }
.bio-speaker__intro { margin-top: 20px; }
.bio-speaker__split { grid-template-columns: 454px 1fr; gap: 45px; align-items: start; margin-top: 42px; }
.bio-speaker__media img {
  width: 100%; display: block; border-radius: 21px;
  aspect-ratio: 3 / 4; object-fit: cover;
}
.bio-speaker__media--tall img { aspect-ratio: 2 / 3; }
.bio-speaker__text > * + * { margin-top: 26px; }
.bio-speaker__extra { margin-top: 26px; }

@media (max-width: 900px) {
  .bio-speaker__split { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .bio-speaker__title { text-align: center; }
  .bio-speaker__split { gap: 18px; }
}

/* ---------- bio sub-heading (bold inline label, e.g. "Medical Students, Interns, and Fellows") ---------- */
.bio-subhead { font-weight: 700; }

/* ---------- checkmark list (Willie's credentials, Kathleen's role lists) ---------- */
.prose .bio-list { list-style: none; padding-left: 0; }
.prose .bio-list li { position: relative; padding-left: 28px; }
.prose .bio-list li::before {
  content: "\2713"; position: absolute; left: 0; top: 0;
  color: var(--slate); font-weight: 700;
}

/* ==== 41-services.css ==== */
/* Services + sub-pages: services, the-resilient-leadership-academy, team-training,
   organizational-consulting, leadership-coaching. Prefixed by pattern, not by page. */

/* ---------- sub-page hero (pill + h1 + copy + button(s) + square photo) ---------- */
.subhero { background: var(--blue-pale); padding: 48px 0; }
.subhero .split { grid-template-columns: 1.7fr 1fr; gap: 14px 45px; align-items: center; }
.subhero__pill { margin-bottom: 12px; }
.subhero h1 { margin-top: 0; }
.subhero__text > * + * { margin-top: 10px; }
.subhero .btn-col, .subhero .btn-row { align-items: flex-start; justify-content: flex-start; margin-top: 18px; }
.subhero .btn-col .btn, .subhero .btn-row .btn { margin-top: 0; }
.subhero__media img { width: 100%; }

/* ---------- heading sizes used in body copy ("kickers") ---------- */
.h24, .h28, .h31 {
  font-weight: 700; letter-spacing: 1px; text-transform: capitalize; line-height: 1.35;
}
.h24 { font-size: 24px; }
.h28 { font-size: 28px; }
.h31 { font-size: 31px; }

/* ---------- long-form copy blocks (reuses .prose spacing) ---------- */
.copy > * + * { margin-top: 26px; }
.copy a, .faq-list a { text-decoration: underline; }

/* ---------- checkmark list ---------- */
.svc-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.svc-checklist li { display: flex; align-items: flex-start; gap: 14px; }
.svc-checklist svg { flex: none; width: 18px; height: 18px; margin-top: 5px; fill: var(--slate); }
.svc-checklist p, .svc-checklist span.svc-checklist__text { display: block; }
.svc-checklist strong { color: var(--slate); }

/* two svc-checklists side by side (team-training topic columns) */
.check-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 40px 60px; }
.check-cols h3 { font-size: 21px; font-weight: 700; letter-spacing: 1px; text-transform: capitalize; color: var(--slate); text-align: center; margin-bottom: 18px; }

/* ---------- pull quote (orange bordered box) ---------- */
.pull-quote { border: 1px solid var(--orange); padding: 24px 30px; text-align: center; }
.pull-quote p { margin: 0; }
.pull-quote__quote { font-style: italic; }
.pull-quote__cite { margin-top: 16px !important; font-style: normal; font-weight: 700; }

/* ---------- responsive video embed ---------- */
.video-embed { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; border-radius: var(--radius); background: #000; }
.video-embed iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }

/* ---------- vertical icon flow (org consulting problem list) ---------- */
.icon-flow { display: grid; justify-items: center; gap: 30px; margin: 0 auto 40px; max-width: 500px; }
.icon-flow__item { display: grid; justify-items: center; gap: 14px; }
.icon-flow svg { width: 44px; height: 44px; fill: var(--orange); }
.icon-flow p { font-weight: 700; letter-spacing: 1px; color: var(--slate); text-align: center; }

/* ---------- FAQ ---------- */
.faq-list { display: grid; gap: 26px; }
.faq-list p { margin: 0; }

/* ---------- responsive ---------- */
.subhero__arrow { display: none; }

/* mobile card grid without the card box (image-led service cards) */
.card-grid--flush .card__inner img { border-radius: var(--radius); }
.card-grid--flush { max-width: 990px; margin-left: auto; margin-right: auto; }

@media (max-width: 900px) {
  .subhero .split { grid-template-columns: 1fr; text-align: center; }
  .subhero .split__text { display: contents; }
  .subhero__pill { order: 1; }
  .subhero h1 { order: 2; }
  .subhero__media { order: 3; }
  .subhero__media img { max-width: 345px; margin: 0 auto; }
  .subhero__text > p { order: 4; }
  .subhero__arrow { order: 5; display: block; margin: 6px auto 0; width: 42px; height: 42px; fill: var(--orange); }
  .subhero .btn-col, .subhero .btn-row { order: 6; align-items: center; justify-content: center; }
  .check-cols { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 767px) {
  .h24 { font-size: 22px; }
  .h28 { font-size: 24px; }
  .h31 { font-size: 26px; }
  .icon-flow { margin-bottom: 30px; }
  .card-grid--flush .card { background: none; box-shadow: none; padding: 0; }
  .card-grid--flush .card__inner { border-left: 0; padding-left: 0; text-align: center; }
  .card-grid--flush img { margin: 0 auto; }
}

/* ==== 42-articles.css ==== */
/* News & Insights index + article template.
   Class names describe the pattern (article-*), reused by all 5 articles + the index. */

/* ---------- article hero (pale band: pill, title, lead, arrow + square photo) ---------- */
/* markup: .article-hero > .wrap > .split > (.split__text, .article-hero__media) */
.article-hero { background: var(--blue-pale); padding: 56px 0 60px; }
.article-hero .split { column-gap: 45px; row-gap: 14px; align-items: start; }
.article-hero .split__text { max-width: 640px; }
.article-hero__pill { display: inline-block; }
.article-hero__title {
  margin-top: 14px;
  font-size: 42px;
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: capitalize;
  color: var(--slate);
}
.article-hero__lead { margin-top: 8px; }
.article-hero__arrow { margin-top: 26px; }
.article-hero__arrow svg { width: 35px; height: 35px; fill: var(--orange); display: block; }
.article-hero__media img { width: 100%; }

/* Above the phone/tablet stack breakpoint: fixed-width columns so the photo renders at the
   same size as the live page, centered as a group inside the wide wrap. */
@media (min-width: 901px) {
  .article-hero .split { grid-template-columns: 688px 398px; max-width: 1131px; margin: 0 auto; }
  .article-hero .split--lg-media { grid-template-columns: 610px 420px; max-width: 1075px; }
  .article-hero__media img { width: 398px; }
  .split--lg-media .article-hero__media img { width: 420px; }
}

/* ---------- share row ---------- */
.article-share { display: flex; justify-content: center; flex-wrap: wrap; gap: 15px; margin: 44px 0 40px; }
.article-share__btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 13px 22px;
  border: 1px solid currentColor;
  border-radius: 6px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none;
}
.article-share__btn svg { width: 18px; height: 18px; fill: currentColor; flex: none; }
.article-share__btn--fb { color: #3569b4; }
.article-share__btn--x { color: #333333; }
.article-share__btn--in { color: #0177b5; }

/* ---------- article body (long-form text) ---------- */
/* tighter than the default .prose rhythm (26px) - matches the live article copy blocks */
.article-body.prose > * + * { margin-top: 16px; }
.article-body.prose > h2 { margin-top: 38px; }
.article-body h2 { color: var(--orange); text-transform: capitalize; }
.article-body ul { list-style: none; padding-left: 0; }
.article-body ul li { position: relative; padding-left: 30px; }
.article-body ul li::before {
  content: "\2714";
  position: absolute;
  left: 0;
  top: 2px;
  color: var(--slate);
  font-size: 14px;
  font-weight: 900;
}
.article-body .btn { margin-top: 10px; }
.article-body.prose a.btn { text-decoration: none; }

/* Apple Podcasts embed */
.article-podcast { margin-top: 26px; }
.article-podcast iframe {
  width: 100%;
  max-width: 660px;
  height: 175px;
  border: 0;
  border-radius: 10px;
  display: block;
}

/* ---------- responsive ---------- */
@media (max-width: 767px) {
  .article-hero { padding: 40px 0; text-align: center; }
  .article-hero .split__text { max-width: none; }
  /* phone order on the live site: pill, title, photo, lead text, arrow */
  .article-hero .split__text { display: contents; }
  .article-hero__pill { order: 1; margin: 0 auto; }
  .article-hero__title { order: 2; font-size: 28px; }
  .article-hero__media { order: 3; margin-top: 10px; }
  .article-hero__lead { order: 4; margin-top: 10px; }
  .article-hero__arrow { order: 5; margin-top: 20px; justify-self: center; }

  .article-share { margin: 30px 0 28px; gap: 10px; }
  .article-share__btn { padding: 10px 14px; font-size: 13px; gap: 6px; }
  .article-share__btn svg { width: 14px; height: 14px; }
}

/* ==== 43-utility.css ==== */
/* Utility page styles: Our Partners, Contact Us, Schedule a Call, long-form legal pages. */

/* ---------- pill-badge intro split (our-partners, schedule-call-thank-you) ---------- */
.pill-split { align-items: center; }
.pill-split .pill { text-align: center; }
.pill-split__desc { margin-top: 10px; }
.pill-split__media { text-align: center; }
.pill-split__media img { margin: 0 auto; }

/* ---------- our-partners: logo grid ---------- */
/* Rows are hand-set like the live page: 5, 4 or 3 equal columns; each logo keeps the
   size the live page gives it (width/height attributes). */
.partner-grid { margin-top: 44px; margin-bottom: 72px; }
.partner-row {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  gap: 15px;
  align-items: center;
  justify-items: center;
}
.partner-row + .partner-row { margin-top: 22px; }
.partner-grid img { max-width: 100%; height: auto; }
.partner-testimonial { margin-bottom: 60px; }
.partner-testimonial:last-of-type { margin-bottom: 0; }

/* ---------- schedule-call: hero arrow + form box ---------- */
.schedule-hero__arrow { width: 35px; height: 35px; fill: var(--orange); margin-top: 26px; }

.schedule-box {
  background: var(--blue-pale);
  border: 1px solid var(--slate);
  padding: 40px;
  text-align: center;
}
.schedule-box__intro { max-width: 700px; margin: 0 auto; }
.check-list {
  list-style: none;
  margin: 22px auto 0;
  padding: 0;
  max-width: 560px;
  text-align: left;
}
.check-list li { position: relative; padding-left: 30px; }
.check-list li + li { margin-top: 8px; }
.check-list li::before { content: "\2714"; position: absolute; left: 0; top: 0; color: var(--orange); }

.schedule-box .form__note { margin-top: 34px; text-align: left; }
.schedule-box .form { margin-top: 12px; text-align: left; }

/* ---------- long-form legal / prose pages ---------- */
.legal-page__title { font-size: 35px; margin-bottom: 30px; }
.legal-page { padding-top: 6px; padding-bottom: 60px; }
.legal-page h2, .legal-page h3 { font-size: 18px; font-weight: 700; color: var(--slate); text-transform: none; }
.legal-page ul ul { margin-top: 10px; }
.legal-page__updated { font-style: italic; }

@media (max-width: 767px) {
  .legal-page__title { font-size: 28px; }
}

@media (max-width: 900px) {
  .pill-split .split__text { display: contents; }
  .pill-split .pill { order: 1; }
  .pill-split h1 { order: 2; }
  .pill-split__media { order: 3; }
  .pill-split__desc { order: 4; margin-top: 20px; }
  .schedule-hero__arrow { order: 5; margin: 20px auto 0; }
}

@media (max-width: 767px) {
  .partner-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 16px; align-items: center; justify-items: center; margin-top: 24px; margin-bottom: 44px; }
  .partner-row { display: contents; }
  .partner-grid img { max-height: 110px; width: auto; }
  .schedule-box { padding: 24px; }
}

/* ==== 50-courses.css ==== */
/* ---------- free courses + free video library ---------- */

/* Page hero used by course pages, the courses hub and the video pages:
   pill, 42px title, intro text, CTA, square photo on the right. */
.page-hero { background: var(--blue-pale); padding: 59px 0 66px; }
.page-hero .split { grid-template-columns: 1fr 398px; gap: 14px 49px; }
.page-hero__title { font-size: 42px; line-height: 1.35; font-weight: 700; letter-spacing: 1px; text-transform: capitalize; color: var(--slate); margin-top: 14px; }
.page-hero .split__text > p { margin-top: 6px; }
.page-hero .btn { margin-top: 26px; }
.page-hero__img { width: 398px; border-radius: var(--radius); }
.page-hero__sub { font-size: 14px; letter-spacing: normal; font-weight: 700; margin-top: 8px !important; }
.page-hero__sub a { color: var(--orange); font-weight: 400; }
/* video collage: row 1 = big + small (bottom-aligned), row 2 = small + big */
.collage--videos { grid-template-columns: 182fr 7fr 152fr 14fr 177fr; }
.collage--videos .collage__a { grid-column: 1 / 4; grid-row: 1; }
.collage--videos .collage__b { grid-column: 5; grid-row: 1; align-self: end; }
.collage--videos .collage__d { grid-column: 1; grid-row: 2; align-self: start; }
.collage--videos .collage__c { grid-column: 3 / 6; grid-row: 2; width: 100% !important; justify-self: stretch; }

/* Opt-in box (pale panel with a thin border) */
.optin {
  max-width: 910px; margin: 0 auto; text-align: center;
  background: var(--blue-pale); border: 1px solid var(--slate); border-radius: 21px;
  padding: 23px 36px 22px;
}
.optin__title { font-size: 21px; font-weight: 700; line-height: 1.35; letter-spacing: 1px; text-transform: uppercase; color: var(--orange); }
.optin__text { margin-top: 10px; letter-spacing: 1px; }
.optin__text p + p { margin-top: 26px; }
.optin .form { max-width: 598px; margin: 32px auto 0; gap: 10px; }
.optin .form input[type="text"], .optin .form input[type="email"] {
  border: 0; border-radius: 0; height: 55px; padding: 0 14px; font-size: 14px;
}
.optin .form input::placeholder { color: #333; text-transform: uppercase; opacity: 1; }
.optin .form .btn {
  justify-self: stretch; margin-top: 11px; background: var(--blue);
  font-size: 18px; font-weight: 700; padding: 11px 17px; border-radius: var(--radius);
}
.optin .form .btn:hover { background: var(--blue-dark); }
.optin__privacy { font-size: 12px; line-height: 1.49; letter-spacing: 1px; margin-top: 2px; }
.optin__done { display: none; }
.optin.has-access .form, .optin.has-access .optin__privacy { display: none; }
.optin.has-access .optin__done { display: block; margin-top: 24px; }

/* Course page body */
.course-desc { max-width: 1000px; margin: 0 auto; text-align: center; }
.page-hero .pill { font-size: 14px; }
.course-desc p { max-width: 1000px; }
.course-desc p + p { margin-top: 26px; }
.course-note { margin-top: 26px; font-weight: 600; }
.share { list-style: none; padding: 0; margin: 40px 0 0; display: flex; justify-content: center; gap: 14px; }
.share a {
  display: inline-flex; align-items: center; gap: 10px; height: 48px; padding: 0 18px;
  border: 1px solid currentColor; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; text-decoration: none;
}
.share svg { width: 18px; height: 18px; fill: currentColor; }
.share__fb { color: #3569b4; } .share__x { color: #333; } .share__in { color: #0177b5; }
.share a:hover { background: currentColor; }
.share a:hover span, .share a:hover svg { color: #fff; fill: #fff; }

.instructor .split { grid-template-columns: 454px 1fr; gap: 14px 35px; align-items: start; }
.instructor__photo { width: 420px; margin: 14px auto 0; border-radius: var(--radius); }
.instructor__name { font-size: 21px; font-weight: 700; letter-spacing: 1px; text-align: center; margin-top: 6px; }
.instructor .split__text p + p { margin-top: 26px; }
.instructor .split__text { max-width: 597px; }

.curriculum { list-style: none; margin: 30px 0 0; padding: 0; text-align: center; }
.curriculum li { letter-spacing: 1px; line-height: 1.49; }
.curriculum li + li { margin-top: 20px; }
.curriculum__unit { display: block; font-weight: 700; }
.curriculum__title { text-transform: capitalize; }
.cta-block { margin-top: 32px; text-align: center; }
.cta-block__sub { font-size: 14px; letter-spacing: normal; font-weight: 700; margin-top: 10px; }
.cta-block__sub a { color: var(--orange); font-weight: 400; }

.faq { max-width: 900px; margin: 18px auto 0; }
.faq dt { font-weight: 700; }
.faq dd { margin: 0 0 26px; }

/* Courses hub cards (image + text inside the ruled card) */
.course-card .card__inner img { width: 280px; margin: 20px 0 6px; border-radius: 0; }

/* Video library */
.video-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px 15px; }
.video-card { text-align: center; }
.video-card p { margin-top: 10px; }
.video-card .video { margin-top: 18px; }
.video { position: relative; aspect-ratio: 16 / 9; background: #000; overflow: hidden; }
.video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-list { list-style: none; padding: 0; margin: 28px auto 0; max-width: 910px; display: grid; gap: 8px; letter-spacing: normal; }
.video-list li { position: relative; padding-left: 26px; line-height: 1.49; }
.video-list li::before {
  content: ""; position: absolute; left: 2px; top: 7px; width: 13px; height: 13px; background: var(--slate);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 512 512%27%3E%3Cpath d=%27M173.9 439.4l-166.4-166.4c-10-10-10-26.2 0-36.2l36.2-36.2c10-10 26.2-10 36.2 0L192 312.7 432.1 72.6c10-10 26.2-10 36.2 0l36.2 36.2c10 10 10 26.2 0 36.2l-294.4 294.4c-10 10-26.2 10-36.2 0z%27/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 512 512%27%3E%3Cpath d=%27M173.9 439.4l-166.4-166.4c-10-10-10-26.2 0-36.2l36.2-36.2c10-10 26.2-10 36.2 0L192 312.7 432.1 72.6c10-10 26.2-10 36.2 0l36.2 36.2c10 10 10 26.2 0 36.2l-294.4 294.4c-10 10-26.2 10-36.2 0z%27/%3E%3C/svg%3E") center / contain no-repeat;
}
.page-hero .pill.pill--lg { font-size: 18px; }
.video-list strong { display: block; }

/* ---------- course area (after sign-up) ---------- */
.course-top { background: var(--blue-pale); padding: 40px 0; }
.course-top__inner { display: grid; grid-template-columns: 1fr 220px; gap: 30px; align-items: center; }
.course-top__eyebrow { font-size: 14px; letter-spacing: 2px; text-transform: uppercase; color: var(--blue-dark); font-weight: 600; }
.course-top__title { font-size: 34px; line-height: 1.3; font-weight: 700; letter-spacing: 1px; text-transform: capitalize; margin-top: 6px; }
.course-top__img { width: 220px; border-radius: var(--radius); }
.course-top .btn { margin-top: 20px; }
.progress { margin-top: 18px; max-width: 460px; }
.progress__bar { height: 10px; border-radius: 5px; background: #d9e8f0; overflow: hidden; }
.progress__fill { height: 100%; width: 0; background: var(--orange); transition: width .3s ease; }
.progress__label { font-size: 14px; letter-spacing: .5px; margin-top: 6px; }

.lesson-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.lesson-list a {
  display: grid; grid-template-columns: 44px 1fr auto; gap: 16px; align-items: center;
  padding: 16px 20px; background: #fff; box-shadow: var(--shadow); color: var(--slate); text-decoration: none;
  border-left: 4px solid transparent; transition: border-color .15s ease;
}
.lesson-list a:hover { border-left-color: var(--orange); }
.lesson-list__num {
  width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center;
  background: var(--blue); color: #fff; font-weight: 700; letter-spacing: normal;
}
.lesson-list__unit { display: block; font-size: 13px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--blue-dark); }
.lesson-list__title { display: block; font-weight: 600; text-transform: capitalize; letter-spacing: .5px; }
.lesson-list__status { font-size: 13px; letter-spacing: .5px; color: #8a96a8; white-space: nowrap; }
.lesson-list .is-done .lesson-list__num { background: #5aa06f; }
.lesson-list .is-done .lesson-list__status { color: #3f8a55; font-weight: 600; }

.resource-box { margin-top: 36px; padding: 24px 28px; border: 1px solid var(--blue-line); border-radius: var(--radius); background: #fff; }
.resource-box h2 { font-size: 21px; color: var(--slate); }
.resource-box ul { list-style: none; padding: 0; margin: 12px 0 0; display: grid; gap: 8px; }
.resource-box a { font-weight: 600; }

.placeholder {
  border: 2px dashed #c5d6e0; background: repeating-linear-gradient(45deg, #f7fbfd, #f7fbfd 10px, #fff 10px, #fff 20px);
  color: #6b7a90; padding: 18px 20px; font-size: 15px; letter-spacing: .3px; text-align: center; border-radius: 10px;
}
.video .placeholder { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 6px; border-radius: 0; }

/* lesson page */
.lesson { padding: 34px 0 60px; }
.lesson__grid { display: grid; grid-template-columns: 300px 1fr; gap: 40px; align-items: start; }
.lesson__side { position: sticky; top: 20px; background: var(--blue-pale); border-radius: var(--radius); padding: 20px; }
.lesson__side h2 { font-size: 16px; letter-spacing: 1px; text-transform: uppercase; }
.lesson__side h2 a { color: var(--slate); text-decoration: none; }
.lesson__side .progress { margin-top: 10px; }
.side-list { list-style: none; margin: 16px 0 0; padding: 0; font-size: 15px; letter-spacing: .3px; line-height: 1.4; }
.side-list li + li { margin-top: 4px; }
.side-list a { display: flex; gap: 10px; padding: 8px 10px; border-radius: 8px; color: var(--slate); text-decoration: none; }
.side-list a:hover { background: #fff; }
.side-list a[aria-current="page"] { background: #fff; font-weight: 700; box-shadow: var(--shadow); }
.side-list__check { flex: none; width: 18px; height: 18px; margin-top: 2px; border-radius: 50%; border: 2px solid #b9cfdc; }
.is-done .side-list__check { background: #5aa06f; border-color: #5aa06f; box-shadow: inset 0 0 0 3px #fff; }
.side-toggle { display: none; }
.lesson__crumb { font-size: 14px; letter-spacing: .5px; }
.lesson__crumb a { color: var(--blue-dark); text-decoration: none; }
.lesson__unit { margin-top: 14px; font-size: 14px; letter-spacing: 2px; text-transform: uppercase; font-weight: 600; color: var(--orange); }
.lesson__title { font-size: 32px; line-height: 1.3; letter-spacing: 1px; text-transform: capitalize; margin-top: 4px; }
.lesson .video { margin-top: 22px; border-radius: 10px; }
.lesson__body { margin-top: 28px; }
.lesson__nav { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--line); }
.lesson__nav .btn { font-size: 15px; padding: 14px 20px; }
.lesson__prev { color: var(--slate); font-size: 15px; letter-spacing: .5px; }

@media (max-width: 1023px) {
  .page-hero .split { grid-template-columns: 1fr 300px; }
  .page-hero__img { width: 300px; }
  .instructor .split { grid-template-columns: 340px 1fr; }
  .instructor__photo { width: 320px; }
  .lesson__grid { grid-template-columns: 1fr; }
  .lesson__side { position: static; order: 2; }
  .side-toggle { display: block; }
}
@media (max-width: 900px) {
  .page-hero .split, .instructor .split { grid-template-columns: 1fr; }
  .page-hero__img { margin: 0 auto; width: 100%; max-width: 398px; }
  .page-hero .split__text { text-align: center; }
  .instructor__photo { width: 100%; max-width: 420px; }
  .video-grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .page-hero { padding: 40px 0; }
  .page-hero__title { font-size: 30px; }
  .optin { padding: 22px 16px; }
  .optin__title { font-size: 18px; }
  .share { flex-wrap: wrap; }
  .course-top__inner { grid-template-columns: 1fr; }
  .course-top__img { display: none; }
  .course-top__title { font-size: 26px; }
  .lesson-list a { grid-template-columns: 38px 1fr; padding: 14px; }
  .lesson-list__num { width: 38px; height: 38px; }
  .lesson-list__status { grid-column: 2; }
  .lesson__title { font-size: 25px; }
  .course-card .card__inner img { width: 100%; max-width: 280px; }
}

.course-grid { max-width: 990px; margin-left: auto; margin-right: auto; }
.page-hero .split--videos { grid-template-columns: 1fr 532px; }
@media (max-width: 1023px) { .page-hero .split--videos { grid-template-columns: 1fr 1fr; } }
@media (max-width: 900px) { .page-hero .split--videos { grid-template-columns: 1fr; } }

/* phone stacking to match the live site */
@media (max-width: 767px) {
  /* hero: pill, title, photo, text, buttons */
  .page-hero .split__text { display: contents; }
  .page-hero .split > div:not(.split__text) { order: 3; }
  .page-hero .split__text > .pill { justify-self: center; }
  .page-hero .split__text > p, .page-hero .split__text > .btn { order: 4; }
  .page-hero .split__text > .btn { justify-self: center; margin-top: 8px; }
  .page-hero .split__text > * { text-align: center; }
  .page-hero .display { font-size: 24px; }
  .collage--videos { display: block; }
  .collage--videos .collage__b, .collage--videos .collage__c, .collage--videos .collage__d { display: none; }
  .collage--videos .collage__a { display: block; width: 100%; }
  /* instructor: heading, first paragraph, photo + name, rest */
  .instructor .split__text { display: contents; }
  .instructor .split > div:first-child { order: 3; }
  .instructor .split__text h2 { order: 1; text-align: center; }
  .instructor .split__text p:first-of-type { order: 2; text-align: center; }
  .instructor .split__text p:nth-of-type(2) { order: 4; text-align: center; margin-top: 12px; }
}

/* imported Teachable lesson content */
.lesson__body h2 { font-size: 22px; line-height: 1.35; color: var(--blue); letter-spacing: .5px; margin-top: 34px; }
.lesson__body h2:first-child { margin-top: 0; }
.lesson__body .video { margin: 26px 0; }
.lesson-file a {
  display: inline-flex; align-items: center; gap: 10px; padding: 12px 18px;
  background: var(--blue-pale); border: 1px solid var(--blue-line); border-radius: 10px;
  color: var(--slate); font-weight: 600; font-size: 16px; letter-spacing: .3px; text-decoration: none !important;
}
.lesson-file a::before {
  content: ""; width: 18px; height: 18px; flex: none; background: var(--orange);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27%3E%3Cpath d=%27M5 20h14v-2H5v2zm7-18l-.7.7L6 8l1.4 1.4L11 5.8V16h2V5.8l3.6 3.6L18 8l-5.3-5.3L12 2z%27 transform=%27rotate(180 12 11)%27/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27%3E%3Cpath d=%27M5 20h14v-2H5v2zm7-18l-.7.7L6 8l1.4 1.4L11 5.8V16h2V5.8l3.6 3.6L18 8l-5.3-5.3L12 2z%27 transform=%27rotate(180 12 11)%27/%3E%3C/svg%3E") center / contain no-repeat;
}
.lesson-file a:hover { border-color: var(--blue); background: #fff; }
.lesson-quote { margin: 34px 0 0; padding: 22px 26px; border-left: 4px solid var(--orange); background: var(--peach); font-size: 22px; font-style: italic; font-weight: 600; }
.lesson-quote__by { font-size: 16px; font-style: normal; font-weight: 400; margin-top: 8px !important; }
.course-intro { margin-bottom: 48px; }
.course-intro .video { margin-top: 18px; border-radius: 10px; }
.course-grid > .card:last-child:nth-child(odd) { grid-column: 1 / -1; justify-self: center; width: calc(50% - 15px); }
@media (max-width: 1023px) { .course-grid > .card:last-child:nth-child(odd) { width: 100%; } }

/* lesson knowledge check */
.quiz { margin-top: 40px; padding: 26px 28px; background: var(--blue-pale); border-radius: var(--radius); }
.quiz h2 { margin-top: 0 !important; }
.quiz__q { border: 0; margin: 22px 0 0; padding: 0; }
.quiz__q legend { font-weight: 700; padding: 0; margin-bottom: 8px; line-height: 1.4; }
.quiz__hint { font-weight: 400; font-size: 15px; }
.quiz__q label { display: flex; gap: 10px; align-items: flex-start; padding: 6px 10px; border-radius: 8px; letter-spacing: normal; line-height: 1.4; cursor: pointer; }
.quiz__q input { margin-top: 5px; flex: none; accent-color: var(--blue-dark); }
.quiz__q.is-wrong label.is-answer, .quiz__q.is-right label.is-answer { background: #dff0e3; }
.quiz__result { font-size: 15px; font-weight: 600; margin-top: 4px !important; min-height: 0; }
.is-right .quiz__result { color: #2e7d4f; }
.is-wrong .quiz__result { color: #b4432a; }
.quiz__actions { margin-top: 24px; display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.quiz__reset { background: none; border: 0; color: var(--blue-dark); text-decoration: underline; cursor: pointer; font-size: 15px; }
.quiz__score { font-weight: 700; margin-top: 12px !important; }
