/* Shared internal-page system: editorial bands, readable type, and open lists. */
.page-main { background: #fff; min-width: 0; width: 100%; }
.page-hero { align-items: stretch; display: grid; grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); min-height: 520px; width: 100%; }
.page-hero-copy { align-self: center; min-width: 0; padding: clamp(55px, 8vw, 112px) clamp(24px, 7vw, 108px); }
.page-hero-copy h1 { font-size: clamp(48px, 5.5vw, 78px); max-width: 720px; }
.page-hero-copy > p:not(.eyebrow) { color: var(--muted); font-size: clamp(18px, 1.8vw, 23px); line-height: 1.4; margin: 26px 0 31px; max-width: 640px; }
.page-hero-copy .eyebrow { color: var(--red); }
.page-hero-media { min-height: 520px; min-width: 0; overflow: hidden; position: relative; }
.page-hero-media img { height: 100%; object-fit: cover; width: 100%; }
.page-hero-media .media-caption { background: var(--yellow); bottom: 28px; color: var(--ink); font-size: 13px; font-weight: 850; left: 28px; letter-spacing: .11em; padding: 10px 14px; position: absolute; text-transform: uppercase; }
.page-hero-teal { background: #e8f3f2; }
.page-hero-blue { background: #eef4fb; }
.page-hero-yellow { background: #fff5d9; }
.page-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 22px; }
.page-actions .text-link { color: var(--ink); }
.page-actions .text-link:hover { color: var(--red); }
.page-meta { color: var(--muted); display: flex; flex-wrap: wrap; font-size: 13px; font-weight: 750; gap: 16px; margin-top: 22px; }
.page-meta span + span::before { color: var(--red); content: '•'; margin-right: 16px; }

.page-section { padding: clamp(60px, 8vw, 112px) clamp(24px, 7vw, 108px); width: 100%; }
.page-section-muted { background: #f1f5f8; }
.page-section-teal { background: #176b76; color: #fff; }
.page-section-blue { background: #eef4fb; }
.page-section-yellow { background: #fff5d9; }
.page-section-heading { max-width: 790px; }
.page-section-heading h2 { font-size: clamp(38px, 4.5vw, 63px); }
.page-section-heading > p:last-child { color: var(--muted); font-size: 18px; margin: 22px 0 0; max-width: 700px; }
.page-section-teal .page-section-heading > p:last-child { color: rgba(255, 255, 255, .86); }
.section-kicker-link { color: var(--red); font-size: 13px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }

.library-toolbar { align-items: end; display: flex; flex-wrap: wrap; gap: 22px; justify-content: space-between; margin-top: 46px; }
.filter-row { display: flex; flex-wrap: wrap; gap: 8px; }
.filter-button { background: #fff; border: 1px solid #b8c5cc; color: var(--ink); cursor: pointer; font-size: 14px; font-weight: 750; min-height: 43px; padding: 9px 15px; }
.filter-button:hover, .filter-button.is-active { background: var(--red); border-color: var(--red); color: #fff; }
.search-field { border: 1px solid #b8c5cc; color: var(--ink); min-height: 43px; padding: 9px 13px; width: min(100%, 280px); }
.search-field:focus-visible { outline: 3px solid var(--yellow); outline-offset: 2px; }
.library-grid { display: grid; gap: 2px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 34px; }
.library-item { background: #fff; display: grid; grid-template-columns: 35% minmax(0, 1fr); min-height: 260px; }
.library-item[hidden] { display: none; }
.library-item img { height: 100%; object-fit: cover; width: 100%; }
.library-item-copy { align-self: center; padding: 27px clamp(20px, 3vw, 36px); }
.library-item-copy .item-label { color: var(--red); font-size: 12px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.library-item-copy h3 { font-size: clamp(25px, 2.4vw, 38px); margin: 15px 0 12px; }
.library-item-copy p { color: var(--muted); font-size: 15px; margin: 0 0 21px; }
.library-item-copy .item-link { color: var(--red); font-size: 14px; font-weight: 850; }
.library-empty { color: var(--muted); font-size: 18px; grid-column: 1 / -1; padding: 28px 0; }

.split-section { align-items: center; display: grid; gap: clamp(34px, 8vw, 140px); grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.split-section.reverse > :first-child { order: 2; }
.split-section.reverse > :last-child { order: 1; }
.split-image { overflow: hidden; }
.split-image img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
.split-copy { max-width: 600px; }
.split-copy h2 { font-size: clamp(36px, 4.3vw, 60px); }
.split-copy > p:not(.eyebrow) { color: var(--muted); font-size: 18px; margin: 22px 0 28px; }

.numbered-list { margin-top: 48px; }
.numbered-row { align-items: start; display: grid; gap: 24px; grid-template-columns: 72px minmax(0, 1fr); padding: 27px 0; }
.numbered-row + .numbered-row { border-top: 1px solid rgba(24, 24, 24, .16); }
.numbered-row-number { color: var(--red); font-family: 'Source Serif 4', Georgia, serif; font-size: 38px; font-weight: 700; line-height: 1; }
.numbered-row h3 { font-size: 30px; margin: 0 0 9px; }
.numbered-row p { color: var(--muted); font-size: 16px; margin: 0; max-width: 680px; }
.page-section-teal .numbered-row + .numbered-row { border-color: rgba(255, 255, 255, .24); }
.page-section-teal .numbered-row p { color: rgba(255, 255, 255, .84); }
.page-section-teal .numbered-row-number { color: var(--yellow); }

.feature-video-frame { background: #0c263e; margin-top: 44px; }
.feature-video-frame video { display: block; max-height: 650px; width: 100%; }
.video-caption-row { align-items: center; background: #102f50; color: #fff; display: flex; flex-wrap: wrap; gap: 15px; justify-content: space-between; padding: 16px 20px; }
.video-caption-row strong { font-size: 18px; }
.video-caption-row span { color: rgba(255, 255, 255, .75); font-size: 14px; }
.video-library-grid { display: grid; gap: 2px; grid-template-columns: repeat(3, 1fr); margin-top: 40px; }
.video-card { background: #fff; display: flex; flex-direction: column; }
.video-card[hidden] { display: none; }
.video-card img { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; }
.video-card-copy { display: flex; flex: 1; flex-direction: column; padding: 20px 22px 24px; }
.video-card-copy .item-label { color: var(--red); font-size: 12px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.video-card-copy h3 { font-size: 26px; margin: 13px 0 10px; }
.video-card-copy p { color: var(--muted); font-size: 15px; margin: 0 0 20px; }
.video-card-copy .item-link { color: var(--red); font-size: 14px; font-weight: 850; margin-top: auto; }
.video-filter-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 38px; }

.comparison-list { margin-top: 45px; }
.comparison-row { align-items: center; background: #fff; display: grid; gap: 20px; grid-template-columns: minmax(0, 1fr) 1fr 1fr; padding: 18px 22px; }
.comparison-row + .comparison-row { margin-top: 2px; }
.comparison-row strong { font-family: 'Source Serif 4', Georgia, serif; font-size: 23px; }
.comparison-row span { color: var(--muted); font-size: 15px; }
.comparison-row span::before { color: var(--teal); content: '✓'; font-weight: 850; margin-right: 8px; }
.comparison-row-heading { background: transparent; color: var(--muted); font-size: 12px; font-weight: 850; letter-spacing: .12em; padding-bottom: 8px; text-transform: uppercase; }
.comparison-row-heading span::before { content: ''; margin: 0; }

.faq-list { margin-top: 44px; max-width: 900px; }
.faq-item { border-top: 1px solid rgba(24, 24, 24, .2); }
.faq-item:last-child { border-bottom: 1px solid rgba(24, 24, 24, .2); }
.faq-question { align-items: center; background: transparent; border: 0; color: var(--ink); cursor: pointer; display: flex; font-family: 'Source Serif 4', Georgia, serif; font-size: 24px; justify-content: space-between; padding: 21px 0; text-align: left; width: 100%; }
.faq-question span:last-child { color: var(--red); font-family: Arial, sans-serif; font-size: 25px; font-weight: 400; }
.faq-answer { color: var(--muted); font-size: 16px; max-width: 740px; padding: 0 40px 22px 0; }
.faq-answer[hidden] { display: none; }

.about-principles { display: grid; gap: 2px; grid-template-columns: repeat(3, 1fr); margin-top: 48px; }
.about-principle { min-height: 260px; padding: 29px clamp(22px, 3.5vw, 45px); }
.about-principle:nth-child(1) { background: #e8f3f2; color: #175b60; }
.about-principle:nth-child(2) { background: #eef4fb; color: #205797; }
.about-principle:nth-child(3) { background: #f4c13d; color: var(--ink); }
.about-principle span { font-family: 'Source Serif 4', Georgia, serif; font-size: 44px; font-weight: 700; }
.about-principle h3 { font-size: 30px; margin: 31px 0 11px; }
.about-principle p { font-size: 16px; margin: 0; max-width: 310px; }
.quote-band { background: #102f50; color: #fff; padding: clamp(60px, 8vw, 108px) clamp(24px, 12vw, 190px); }
.quote-band blockquote { font-family: 'Source Serif 4', Georgia, serif; font-size: clamp(32px, 4.2vw, 59px); letter-spacing: -.04em; line-height: 1.05; margin: 0; max-width: 980px; }
.quote-band cite { color: var(--yellow); display: block; font-size: 14px; font-style: normal; font-weight: 850; letter-spacing: .1em; margin-top: 25px; text-transform: uppercase; }
.roadmap-list { margin-top: 44px; }
.roadmap-row { align-items: start; display: grid; gap: 24px; grid-template-columns: 150px minmax(0, 1fr); padding: 25px 0; }
.roadmap-row + .roadmap-row { border-top: 1px solid #ccd7dd; }
.roadmap-row strong { color: var(--red); font-size: 13px; letter-spacing: .1em; text-transform: uppercase; }
.roadmap-row h3 { font-size: 28px; margin: 0 0 7px; }
.roadmap-row p { color: var(--muted); font-size: 16px; margin: 0; max-width: 720px; }

.breadcrumbs { color: var(--muted); font-size: 13px; margin: 0 0 28px; }
.breadcrumbs a { color: var(--red); font-weight: 750; }
.seo-copy { color: var(--muted); font-size: 17px; max-width: 780px; }
.seo-copy h2 { color: var(--ink); font-size: 36px; margin-bottom: 15px; }
.seo-copy p { margin: 0 0 18px; }
.page-cta { align-items: center; background: #e8f3f2; display: flex; flex-wrap: wrap; gap: 24px; justify-content: space-between; padding: 32px clamp(24px, 4vw, 54px); }
.page-cta h2 { font-size: clamp(30px, 3.2vw, 45px); }
.page-cta p { color: var(--muted); font-size: 16px; margin: 8px 0 0; }

@media (max-width: 900px) {
  .page-hero, .split-section { grid-template-columns: 1fr; }
  .page-hero-copy { order: 2; }
  .page-hero-media { min-height: 390px; order: 1; }
  .split-section.reverse > :first-child, .split-section.reverse > :last-child { order: initial; }
  .library-grid { grid-template-columns: 1fr; }
  .video-library-grid { grid-template-columns: repeat(2, 1fr); }
  .about-principles { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .page-hero-copy { padding: 50px 24px 58px; }
  .page-hero-media { min-height: 300px; }
  .page-meta { display: block; line-height: 1.9; }
  .page-meta span + span::before { margin: 0 9px; }
  .numbered-row { grid-template-columns: 48px minmax(0, 1fr); gap: 14px; }
  .numbered-row h3 { font-size: 26px; }
  .video-library-grid { grid-template-columns: 1fr; }
  .comparison-row { grid-template-columns: 1fr; gap: 7px; padding: 17px 18px; }
  .comparison-row-heading { display: none; }
  .roadmap-row { grid-template-columns: 1fr; gap: 10px; }
  .faq-question { font-size: 21px; }
}
