/* Dedicated course and project pages, within the black/yellow campaign identity. */
.detail-page {
  --page-line: #33434c;
  --page-muted: #9bafbb;
  --page-text: #c5d2da;
  --page-cyan: #75d8d2;
  --page-yellow: #ffdd00;
  width: min(1120px, calc(100% - 48px));
  min-width: 0;
  margin-inline: auto;
  padding: 31px 0 68px;
  color: var(--page-text);
}
.detail-page > .container { width: 100%; max-width: none; }
.detail-page [hidden] { display: none !important; }
.detail-page :focus-visible, .course-center-links :focus-visible {
  outline: 3px solid #ffdd00;
  outline-offset: 5px;
}
.page-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px 10px;
  margin: 0 0 33px;
  color: #7f98a8;
  font-size: 12px;
  line-height: 1.8;
  overflow-wrap: anywhere;
}
.page-breadcrumb a { display: inline-flex; align-items: center; min-height: 44px; color: #b7cbd6; text-decoration: underline; text-decoration-color: #4d6b7b; text-underline-offset: 4px; }
.page-breadcrumb a:hover { color: var(--page-yellow); }
.page-hero { min-width: 0; padding-bottom: 38px; border-bottom: 1px solid var(--page-line); margin-bottom: 39px; }
.page-kicker { margin: 0 0 15px; color: var(--page-yellow); font-size: 11px; line-height: 1.7; font-weight: 650; letter-spacing: .09em; }
.page-hero h1 {
  max-width: 930px;
  margin: 0 0 22px;
  color: #f1f5f7;
  font-size: clamp(34px, 4.2vw, 53px);
  font-weight: 750;
  line-height: 1.23;
  letter-spacing: -.035em;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
.page-intro { max-width: 800px; margin: 0; color: #afc0cc; font-size: 17px; line-height: 1.9; overflow-wrap: anywhere; }
.page-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0; max-width: 930px; margin: 30px 0 0; border-block: 1px solid #354752; }
.page-fact { min-width: 0; padding: 19px 22px; background: #121c22; }
.page-fact:first-child { padding-left: 20px; }
.page-fact + .page-fact { border-left: 1px solid #354752; }
.page-fact > span, .page-fact dt { display: block; margin: 0 0 7px; color: #8da7b8; font-size: 11px; line-height: 1.7; }
.page-fact > strong, .page-fact > b, .page-fact dd { display: block; margin: 0; color: #e5edf1; font-size: 19px; font-weight: 650; line-height: 1.5; overflow-wrap: anywhere; }
.page-fact > p { margin: 6px 0 0; color: #a2b9c7; font-size: 12px; line-height: 1.8; overflow-wrap: anywhere; }
.page-fact small { font-size: 12px; font-weight: 450; color: #93b6bd; }
.page-layout { display: grid; grid-template-columns: minmax(0,1fr) 235px; gap: 49px; align-items: start; }
.page-content { min-width: 0; max-width: 850px; }
.page-section { min-width: 0; scroll-margin-top: 115px; }
.page-section + .page-section { border-top: 1px solid var(--page-line); margin-top: 36px; padding-top: 35px; }
.page-section h2, .page-related > h2 {
  margin: 0 0 19px;
  color: #f0f4f6;
  font-size: clamp(24px, 2.4vw, 30px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -.025em;
  overflow-wrap: anywhere;
}
.page-section h3 { margin: 24px 0 12px; color: #e2edf2; font-size: 19px; font-weight: 650; line-height: 1.55; overflow-wrap: anywhere; }
.page-section h4 { margin: 21px 0 10px; color: #c9e1e5; font-size: 15px; line-height: 1.7; }
.page-section p { margin: 0 0 17px; color: #b1c4d0; font-size: 15px; line-height: 1.95; overflow-wrap: anywhere; }
.page-section p:last-child { margin-bottom: 0; }
.page-section ul, .page-section ol { margin: 15px 0 21px; padding-left: 22px; color: #b7cbd7; font-size: 14px; line-height: 1.95; }
.page-section li { padding-left: 3px; margin-block: 8px; overflow-wrap: anywhere; }
.page-section li::marker { color: #79b5c2; }
.page-section strong { color: #e8f1f4; font-weight: 650; }
.page-content a:not(.simple-primary):not(.simple-secondary):not(.cta):not(.small-cta) {
  color: #9edbdc;
  text-decoration: underline;
  text-decoration-color: #4c7785;
  text-underline-offset: 4px;
}
.page-content a:hover { color: var(--page-yellow); }
.page-content code:not(pre code) { padding: 2px 5px; background: #1d2d36; color: #c4e8e5; font-size: .88em; overflow-wrap: anywhere; }
.page-sidebar { position: sticky; top: 108px; min-width: 0; padding: 21px 19px; border: 1px solid #3c505c; border-radius: 7px; background: #121c22; }
.page-sidebar > h2, .page-sidebar > h3 { margin: 0 0 16px; color: #b6cbd8; font-size: 12px; line-height: 1.7; font-weight: 650; }
.page-sidebar > p { margin: 15px 0 0; color: #8fa9bb; font-size: 12px; line-height: 1.9; overflow-wrap: anywhere; }
.page-toc { display: flex; flex-direction: column; align-items: stretch; gap: 3px; min-width: 0; margin: 0; }
.page-toc a { display: flex; align-items: center; min-height: 39px; padding: 8px 0 8px 12px; border-left: 1px solid #3a535f; color: #a8c0d0; font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
.page-toc a:hover, .page-toc a[aria-current='location'], .page-toc a[aria-current='true'], .page-toc a.active { color: var(--page-yellow); border-left-color: var(--page-yellow); background: #ffdd0007; }
.page-sidebar > .page-actions { display: flex; flex-direction: column; align-items: stretch; margin-top: 22px; }
.page-sidebar .page-actions > a, .page-sidebar .page-actions > button { width: 100%; }
.page-module-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; margin: 23px 0; }
.page-module { min-width: 0; padding: 22px 23px; border: 1px solid #344c59; border-radius: 6px; background: #121e25; }
.page-module h3 { margin: 0 0 12px; font-size: 19px; line-height: 1.5; }
.page-module p { margin: 0 0 13px; color: #9db6c6; font-size: 13px; line-height: 1.95; }
.page-module > span, .page-module > small { display: block; margin-bottom: 11px; color: var(--page-cyan); font-size: 11px; line-height: 1.7; }
.page-module ul { margin-bottom: 0; font-size: 13px; }
.page-deliverable { margin: 23px 0; padding: 18px 20px; border-left: 2px solid #7fcfc9; background: #142829; }
.page-deliverable h3 { margin: 0 0 11px; color: #cee9e4; font-size: 17px; }
.page-deliverable p { color: #afcdcc; font-size: 14px; }
.page-deliverable ul { margin-block: 10px 0; color: #b3d5d2; font-size: 14px; }
.page-practice { min-width: 0; margin: 24px 0; padding: 25px 26px; border: 1px solid #52583e; border-radius: 7px; background: #1b231d; }
.page-practice h3 { margin-top: 0; color: #e2e8c0; }
.page-practice p { color: #b0c2ae; font-size: 14px; }
.page-practice ul, .page-practice ol { color: #afc5ae; }
pre.page-prompt {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 22px 0 15px;
  padding: 21px 23px;
  border: 1px solid #455f6c;
  border-left: 3px solid #c5bc72;
  border-radius: 5px;
  background: #0e1a22;
  color: #c0d7df;
  font-family: ui-monospace, 'Cascadia Code', Consolas, monospace;
  font-size: 13px;
  line-height: 1.9;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  tab-size: 2;
}
.page-prompt > code { white-space: inherit; color: inherit; font: inherit; overflow-wrap: inherit; }
.page-section .page-checklist { list-style: none; margin: 20px 0; padding: 0; }
.page-checklist > li { position: relative; margin: 0; padding: 11px 0 11px 27px; border-bottom: 1px solid #2f4752; font-size: 14px; line-height: 1.85; }
.page-checklist > li:first-child { border-top: 1px solid #2f4752; }
.page-checklist > li::before { content: '□'; position: absolute; left: 1px; top: 12px; color: var(--page-cyan); font-size: 16px; line-height: 1.6; }
.page-application-groups { min-width: 0; margin-top: 21px; border-top: 1px solid #3d5661; }
.page-application-groups details { margin: 0; padding: 0; border: 0; border-bottom: 1px solid #3a505c; background: transparent; }
.page-application-groups summary { position: relative; display: block; list-style: none; padding: 19px 34px 19px 0; color: #d5e5ed; font-size: 16px; font-weight: 600; line-height: 1.75; cursor: pointer; overflow-wrap: anywhere; }
.page-application-groups summary::-webkit-details-marker { display: none; }
.page-application-groups summary::after { content: '+'; position: absolute; right: 1px; top: 19px; color: var(--page-yellow); font-size: 22px; line-height: 1.3; font-weight: 400; }
.page-application-groups details[open] > summary { color: #f0e6a7; }
.page-application-groups details[open] > summary::after { content: '−'; }
.page-section .page-application-list, .page-application-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; list-style: none; margin: 0; padding: 0 0 20px; }
.page-application-list > * { min-width: 0; margin: 0; padding: 11px 13px; border: 1px solid #2d4552; background: #13222b; color: #acc6d7; font-size: 13px; line-height: 1.85; overflow-wrap: anywhere; }
.page-media { min-width: 0; max-width: 100%; margin: 25px 0 20px; border: 1px solid #3d5360; border-radius: 7px; background: #142129; overflow: hidden; }
.page-media img { display: block; width: 100%; max-width: 100%; height: auto; max-height: 640px; object-fit: contain; background: #e7ebea; }
.page-caption, .page-media figcaption { display: block; margin: 0; padding: 11px 15px 13px; color: #8faabd; font-size: 11px; line-height: 1.85; }
.page-section > .page-caption { padding: 0; margin-block: -7px 20px; }
.page-callout { margin: 23px 0; padding: 15px 18px; border-left: 2px solid #e2d161; background: #272b1d; color: #c8cda5; font-size: 13px; line-height: 1.9; overflow-wrap: anywhere; }
.page-callout p { color: #c2cda9; font-size: 13px; }
.page-callout strong { color: #ede6b1; }
.page-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 11px; margin-top: 24px; }
.page-actions > a, .page-actions > button {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; max-width: 100%;
  margin: 0; padding: 11px 18px; border: 1px solid #4b6473; border-radius: 5px; background: #192b34;
  color: #d0e0e8; font-size: 13px; font-weight: 600; line-height: 1.6; text-align: center; text-decoration: none !important;
  overflow-wrap: anywhere; cursor: pointer;
}
.page-actions > a:hover, .page-actions > button:hover { color: #f0edb9; border-color: #c5be78; background: #25382f; }
.page-actions > .simple-primary, .page-actions > .cta, .page-actions > .small-cta,
.page-actions > [data-consult] { background: #ffdd00; color: #15190d; border-color: #ffdd00; }
.page-actions > .simple-primary:hover, .page-actions > .cta:hover, .page-actions > .small-cta:hover,
.page-actions > [data-consult]:hover { background: #ffea65; border-color: #ffea65; color: #15190d; }
.page-actions > .simple-secondary { background: transparent; color: #c2d6e2; }
.page-actions > :disabled { cursor: wait; opacity: .6; }
.page-related { margin-top: 51px; padding-top: 35px; border-top: 1px solid #3b4b55; }
.page-related > p { margin: 0 0 21px; color: #8faabc; font-size: 14px; line-height: 1.9; }
.page-related-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; }
.page-related-card { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding: 22px; border: 1px solid #3a5261; border-radius: 7px; background: #14212a; }
.page-related-card h3 { margin: 0 0 11px; color: #e4eff4; font-size: 18px; font-weight: 650; line-height: 1.6; }
.page-related-card p { margin: 0 0 18px; color: #96b2c5; font-size: 13px; line-height: 1.9; overflow-wrap: anywhere; }
.page-related-card > a { display: inline-flex; align-items: center; min-height: 44px; margin-top: auto; padding-block: 8px; color: #a0d7db; font-size: 12px; line-height: 1.65; text-decoration: underline; text-decoration-color: #557e8f; text-underline-offset: 4px; }
.page-related-card:hover { border-color: #6e98a4; }
.course-center-links { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 9px; padding: 20px 0; border-block: 1px solid #2b4447; background: #101c1f; }
.course-center-links > .container { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; min-width: 0; }
.course-center-links h2, .course-center-links strong { margin: 0 15px 0 0; color: #a1b9c2; font-size: 12px; font-weight: 550; line-height: 1.7; }
.course-center-links a { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; max-width: 100%; padding: 9px 14px; border: 1px solid #3c5a63; border-radius: 5px; color: #bdcfd6; font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.course-center-links a:hover, .course-center-links a[aria-current='page'] { border-color: #aeb975; color: #f1e38f; background: #263120; }
@media (max-width: 1050px) {
  .page-layout { grid-template-columns: minmax(0,1fr) 210px; gap: 31px; }
  .page-sidebar { padding: 19px 16px; }
  .page-related-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 900px) {
  .page-layout { grid-template-columns: minmax(0,1fr); gap: 34px; }
  .page-content { max-width: none; }
  .page-sidebar { position: static; top: auto; padding: 21px; }
  .page-toc { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 16px; }
  .page-toc a { min-height: 44px; font-size: 13px; }
  .page-sidebar > .page-actions { flex-direction: row; }
  .page-sidebar .page-actions > a, .page-sidebar .page-actions > button { width: auto; }
}
@media (max-width: 650px) {
  .detail-page { width: calc(100% - 32px); padding-block: 24px 43px; }
  .page-breadcrumb { font-size: 11px; margin-bottom: 25px; gap: 5px 8px; }
  .page-hero { padding-bottom: 28px; margin-bottom: 29px; }
  .page-kicker { font-size: 10px; line-height: 1.8; letter-spacing: .06em; margin-bottom: 13px; }
  .page-hero h1 { font-size: 33px; line-height: 1.32; margin-bottom: 18px; letter-spacing: -.03em; }
  .page-intro { font-size: 15px; line-height: 1.95; }
  .page-facts { margin-top: 24px; }
  .page-fact, .page-fact:first-child { padding: 14px 11px; }
  .page-fact > span, .page-fact dt { margin-bottom: 6px; font-size: 10px; }
  .page-fact > strong, .page-fact > b, .page-fact dd { font-size: 15px; line-height: 1.6; }
  .page-fact > p, .page-fact small { font-size: 10px; line-height: 1.8; }
  .page-section { scroll-margin-top: 100px; }
  .page-section + .page-section { margin-top: 29px; padding-top: 28px; }
  .page-section h2, .page-related > h2 { font-size: 25px; line-height: 1.45; margin-bottom: 16px; }
  .page-section h3 { font-size: 19px; margin-top: 21px; }
  .page-section p { font-size: 14px; line-height: 1.95; }
  .page-section ul, .page-section ol { padding-left: 20px; font-size: 14px; }
  .page-sidebar { padding: 19px 17px; }
  .page-toc { grid-template-columns: minmax(0,1fr); }
  .page-module-grid { grid-template-columns: minmax(0,1fr); gap: 13px; margin-block: 20px; }
  .page-module { padding: 21px; }
  .page-module h3 { margin-top: 0; font-size: 19px; }
  .page-module p, .page-module ul { font-size: 13px; }
  .page-deliverable { padding: 16px 17px; }
  .page-deliverable h3 { margin-top: 0; font-size: 17px; }
  .page-practice { padding: 21px; }
  .page-practice h3 { margin-top: 0; }
  pre.page-prompt { padding: 18px 16px; font-size: 12px; }
  .page-checklist > li { font-size: 14px; padding-left: 25px; }
  .page-application-groups summary { padding-block: 17px; font-size: 15px; }
  .page-application-groups summary::after { top: 17px; }
  .page-section .page-application-list, .page-application-list { grid-template-columns: minmax(0,1fr); }
  .page-application-list > * { padding: 10px 12px; font-size: 13px; }
  .page-media { margin-block: 21px 18px; }
  .page-caption, .page-media figcaption { padding: 10px 12px 12px; font-size: 10px; }
  .page-callout { padding: 14px 16px; }
  .page-callout p { font-size: 13px; }
  .page-actions { margin-top: 21px; gap: 10px; }
  .page-actions > a, .page-actions > button { font-size: 12px; min-height: 46px; padding-inline: 15px; }
  .page-related { margin-top: 36px; padding-top: 28px; }
  .page-related > p { font-size: 13px; }
  .page-related-grid { grid-template-columns: minmax(0,1fr); gap: 13px; }
  .page-related-card { padding: 21px; }
  .page-related-card h3 { font-size: 18px; }
  .course-center-links { padding-block: 17px; gap: 8px; }
  .course-center-links > .container { gap: 8px; }
  .course-center-links h2, .course-center-links strong { width: 100%; margin: 0 0 4px; font-size: 11px; }
  .course-center-links a { font-size: 12px; padding: 9px 12px; }
}
@media (max-width: 360px) {
  .page-hero h1 { font-size: 30px; }
  .page-fact, .page-fact:first-child { padding-inline: 9px; }
  .page-fact > strong, .page-fact > b, .page-fact dd { font-size: 14px; }
  .page-module, .page-practice, .page-related-card { padding: 18px; }
  .page-actions > a, .page-actions > button { width: 100%; }
  .page-sidebar .page-actions > a, .page-sidebar .page-actions > button { width: 100%; }
  pre.page-prompt { padding-inline: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .detail-page *, .course-center-links * { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
@media print {
  html, body { background: #fff !important; color: #111 !important; }
  .nav, .top-banner, .simple-company-bar, #site-navigation-panel, .site-menu-toggle,
  .consultation-launch, .sticky-action, .course-center-links, body > footer, dialog,
  .page-sidebar, .page-actions { display: none !important; }
  .detail-page { width: 100%; max-width: none; margin: 0; padding: 0; }
  .detail-page, .detail-page * { background: transparent !important; color: #111 !important; border-color: #ccc !important; box-shadow: none !important; text-shadow: none !important; }
  .page-breadcrumb { margin-bottom: 20px; font-size: 9pt; }
  .page-hero { padding-bottom: 22px; margin-bottom: 25px; }
  .page-hero h1 { max-width: none; font-size: 25pt; }
  .page-intro { max-width: none; font-size: 11pt; }
  .page-layout { display: block; }
  .page-content { max-width: none; }
  .page-section { break-inside: auto; scroll-margin: 0; }
  .page-section h2 { font-size: 18pt; break-after: avoid; }
  .page-section h3 { font-size: 13pt; break-after: avoid; }
  .page-section p, .page-section ul, .page-section ol { font-size: 10pt; line-height: 1.75; }
  .page-facts { max-width: none; }
  .page-fact, .page-module, .page-practice, .page-related-card, .page-media { break-inside: avoid; }
  .page-module-grid, .page-related-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  .page-media img { max-height: 420px; }
  .page-caption, .page-media figcaption { font-size: 8pt; }
  pre.page-prompt { overflow: visible; font-size: 9pt; line-height: 1.7; }
  .page-related { margin-top: 30px; padding-top: 23px; }
}