.training-page { padding-block: 56px 90px; background: radial-gradient(ellipse at 90% 0%, #0a66712b, transparent 50%); }
.training-intro { max-width: 900px; margin-bottom: 40px; }
.training-intro h1 { margin-top: 18px; font-size: clamp(2.3rem, 5vw, 4.5rem); line-height: 1.12; letter-spacing: -.05em; }
.training-lead { margin-top: 22px; max-width: 780px; color: var(--muted); font-size: 1.0625rem; line-height: 1.85; }
.training-pills, .training-topics { display: flex; flex-wrap: wrap; gap: 10px; padding: 0; list-style: none; margin: 24px 0 0; }
.training-pills span, .training-topics li { padding: 5px 12px; border: 1px solid #34556a; border-radius: 30px; color: #bde3ed; font-size: .8125rem; background: #102c3c; }
.training-filters { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 32px; padding-block: 20px; border-block: 1px solid var(--line); }
.training-filters a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border: 1px solid #37536a; border-radius: 10px; color: #c5d9e8; font-size: .875rem; }
.training-filters a:hover { background: #123348; }
.training-filters a[aria-current] { background: var(--brand-cyan); border-color: var(--brand-cyan); color: #062c50; font-weight: 700; }
.training-catalogue { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 36px; align-items: start; }
.training-catalogue-multiple { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.training-catalogue-multiple .training-method { grid-column: 1 / -1; }
.training-course, .training-method, .training-empty { padding: clamp(24px, 4vw, 40px); border: 1px solid #34576e; border-radius: 20px; background: linear-gradient(145deg, #132d43, #0a1b2d); box-shadow: inset 0 1px #ffffff08; }
.training-course-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 32px; }
.training-code { color: var(--link); padding: 16px; border: 1px solid #3a6f87; border-radius: 12px; background: #10384b; font: 700 1.5rem ui-monospace, monospace; }
.training-level { color: #d4c2ff; background: #292344; border: 1px solid #65518a; border-radius: 24px; padding: 5px 12px; font-size: .8125rem; }
.training-course h2, .training-method h2, .training-empty h2 { font-size: clamp(1.65rem, 3vw, 2.1rem); line-height: 1.3; letter-spacing: -.035em; margin-top: 16px; }
.training-course > p:not(.eyebrow) { color: var(--muted); margin-top: 18px; }
.training-facts { display: flex; flex-wrap: wrap; gap: 18px 30px; border-block: 1px solid var(--line); padding-block: 22px; margin-block: 28px; }
.training-facts dt { color: var(--muted); font-size: .75rem; }
.training-facts dd { margin: 5px 0 0; font-size: .9375rem; font-weight: 650; }
.training-course .button { width: 100%; }
.training-method { background: #0a1c2d; border-color: var(--line); }
.training-method ol { list-style: decimal-leading-zero; padding-left: 28px; margin-block: 28px; }
.training-method li { padding-left: 10px; margin-top: 24px; }
.training-method li::marker { color: var(--link); font: 600 .875rem ui-monospace, monospace; }
.training-method li p { color: var(--muted); font-size: .9375rem; margin-top: 8px; }
.training-note { color: var(--muted); font-size: .8125rem; line-height: 1.7; margin-top: 18px; }
.training-link, .training-back { display: inline-flex; align-items: center; min-height: 44px; color: var(--link); font-size: .875rem; }
.training-back { margin-bottom: 24px; }
.training-link:hover, .training-back:hover { text-decoration: underline; text-underline-offset: 5px; }
.training-quiz-intro h1 { font-size: clamp(2.1rem, 4vw, 3.5rem); }
.training-workspace { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 28px; align-items: start; }
.training-quiz [hidden] { display: none !important; }
.quiz-sidebar .quiz-panel { position: sticky; top: 24px; padding: 22px; }
.quiz-panel { min-width: 0; padding: clamp(22px, 3vw, 36px); border: 1px solid #34536c; border-radius: 18px; background: #0c1e30; }
.quiz-sidebar h2 { font-size: 1.125rem; letter-spacing: -.025em; margin-bottom: 20px; }
.quiz-meta { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; color: var(--muted); font-size: .8125rem; }
.quiz-tag { color: var(--link); font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.training-quiz progress { display: block; width: 100%; height: 8px; margin-top: 12px; accent-color: var(--brand-cyan); }
.training-quiz button { cursor: pointer; min-height: 44px; padding: 9px 14px; border: 1px solid #55748d; border-radius: 9px; background: #142d43; color: var(--ink); font-size: .875rem; font-weight: 600; }
.training-quiz button:hover:not(:disabled) { border-color: var(--link); background: #1b3e56; }
.training-quiz button:disabled { opacity: .45; cursor: default; }
.training-quiz button.quiz-primary { background: var(--brand-cyan); border-color: var(--brand-cyan); color: #062c50; }
.training-quiz button.quiz-primary:hover { background: #7ce6fa; }
.quiz-wide { width: 100%; margin-top: 20px; }
.quiz-nav { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-top: 22px; }
.quiz-nav button { position: relative; min-height: 40px; padding: 5px 0; font-size: .8125rem; }
.quiz-nav .is-answered { background: #244969; border-color: #598bb1; }
.quiz-nav .is-current { outline: 2px solid var(--link); outline-offset: 2px; }
.quiz-nav .is-flagged::after { content: ''; position: absolute; top: 3px; right: 3px; width: 6px; height: 6px; border-radius: 50%; background: #ffc675; }
.quiz-nav .is-correct { background: #123d34; border-color: #68d2b4; }
.quiz-nav .is-incorrect { background: #422333; border-color: #ec9da9; }
.training-module-validation .quiz-nav { max-height: 272px; overflow-y: auto; padding: 4px; position: relative; }
.training-module-validation [data-quiz-part="title"], .training-module-validation .quiz-review h3 { white-space: pre-line; font-size: 1.15rem; }
.validation-jump { margin-top: 20px; }
.validation-jump label { display: block; font-size: .875rem; color: var(--muted); }
.validation-jump > div { display: flex; gap: 10px; margin-top: 8px; }
.validation-jump input { width: 90px; min-height: 44px; background: #05111f; color: var(--ink); border: 1px solid #55748d; border-radius: 8px; padding: 8px; }
.course-validation-card { border: 1px solid var(--line); border-radius: 12px; padding: 24px; margin-top: 24px; background: #102b3e; }
.course-local-contents { border-bottom: 1px solid var(--line); padding-bottom: 24px; margin-bottom: 30px; }
.course-local-contents a { color: var(--link); text-decoration: underline; text-underline-offset: 4px; }
.course-topic { margin-top: 36px; scroll-margin-top: 110px; }
.course-topic:target { outline: 2px solid var(--link); outline-offset: 12px; border-radius: 4px; }
.course-topic-code { white-space: pre-wrap; overflow-wrap: anywhere; background: #05111f; color: #d7edff; border: 1px solid #29455e; border-radius: 10px; padding: 18px; font: .875rem/1.8 ui-monospace, monospace; }
.course-lesson-links { display: grid; gap: 4px; }
.course-syllabus li.is-validated { border-color: #68d2b4; }
.quiz-content h2 { font-size: clamp(1.3rem, 2.4vw, 1.7rem); line-height: 1.5; letter-spacing: -.025em; margin-block: 18px 24px; }
.quiz-code-label { color: var(--muted); font-size: .8125rem; font-weight: 600; margin-top: 18px; }
.quiz-lesson-link { display: inline-flex; color: var(--link); min-height: 44px; align-items: center; text-decoration: underline; text-underline-offset: 4px; margin-top: 10px; }
.training-quiz pre { white-space: pre-wrap; overflow-wrap: anywhere; background: #05111f; color: #d7edff; border: 1px solid #29455e; border-radius: 10px; padding: 18px; font: .875rem/1.8 ui-monospace, SFMono-Regular, Consolas, monospace; }
.training-quiz fieldset { border: 0; padding: 0; margin: 24px 0; min-width: 0; }
.training-quiz legend { color: var(--muted); font-size: .8125rem; margin-bottom: 14px; }
.quiz-option { display: flex; align-items: flex-start; gap: 14px; border: 1px solid #42627b; border-radius: 11px; padding: 16px; margin-top: 12px; cursor: pointer; line-height: 1.7; }
.quiz-option:hover, .quiz-option:has(input:checked) { background: #13374d; border-color: var(--link); }
.quiz-option input { accent-color: var(--brand-cyan); flex-shrink: 0; width: 18px; height: 18px; margin: 4px 0 0; }
.quiz-option input:focus-visible { outline: 3px solid var(--link); outline-offset: 5px; }
.quiz-letter { color: var(--link); font-weight: 750; margin-right: 8px; }
.training-quiz summary { color: var(--link); cursor: pointer; font-size: .875rem; padding-block: 10px; }
.training-quiz summary:focus-visible { outline: 3px solid var(--link); outline-offset: 4px; }
.quiz-hint { color: var(--muted); border-left: 3px solid #e4b962; padding-left: 16px; margin-top: 12px; }
.quiz-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: space-between; margin-top: 24px; }
.quiz-paging { display: flex; flex-wrap: wrap; gap: 10px; }
.training-notice { background: #302b1d; color: #f2deb0; border: 1px solid #92713c; border-radius: 10px; padding: 20px; margin-top: 24px; }
.quiz-score { color: var(--link); font-size: 3.25rem; font-weight: 750; line-height: 1.2; letter-spacing: -.05em; margin-bottom: 20px; }
.quiz-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-block: 26px; }
.quiz-metric { padding: 18px; border-radius: 10px; background: #122c42; color: var(--muted); font-size: .875rem; }
.quiz-metric strong { display: block; color: var(--ink); font-size: 1.5rem; margin-top: 6px; }
.quiz-review { border-top: 1px solid var(--line); margin-top: 32px; padding-top: 28px; scroll-margin-top: 24px; }
.quiz-review h3 { font-size: 1.125rem; margin-block: 12px 18px; line-height: 1.65; }
.quiz-feedback { border-left: 3px solid #557087; background: #11283c; padding: 16px; margin-top: 12px; border-radius: 0 8px 8px 0; }
.quiz-feedback p { color: #bfd2e2; font-size: .9375rem; margin-top: 8px; }
.quiz-feedback.is-correct { border-color: #68d2b4; background: #10332f; }
.quiz-feedback.is-incorrect { border-color: #f09daa; background: #38202d; }
.quiz-feedback.is-correct strong { color: #a2efd3; }
.quiz-feedback.is-incorrect strong { color: #ffc2ca; }
.quiz-review a { display: inline-flex; align-items: center; min-height: 44px; color: var(--link); margin-top: 14px; text-decoration: underline; text-underline-offset: 4px; }
.training-disclaimer { color: var(--muted); font-size: .8125rem; margin-top: 32px; max-width: 950px; }
.course-catalogue { margin-bottom: 56px; }
.course-catalogue > h2, .course-catalogue-heading { margin-bottom: 28px; font-size: clamp(1.65rem, 3vw, 2.4rem); letter-spacing: -.035em; }
.course-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.course-cards .training-course { display: flex; flex-direction: column; align-items: start; height: 100%; }
.course-cards h3 { font-size: 1.6rem; line-height: 1.4; letter-spacing: -.03em; }
.course-cards .button { margin-top: 28px; }
.course-cards .training-pills { margin-top: auto; padding-top: 22px; }
.course-cards .training-course-heading { width: 100%; }
.course-overview { display: grid; grid-template-columns: 1.2fr 1fr; gap: 26px; margin-block: 30px; }
.course-page h2 { font-size: 1.5rem; line-height: 1.5; letter-spacing: -.025em; margin: 22px 0 16px; }
.course-page h2:first-child { margin-top: 0; }
.course-page li { margin-top: 10px; }
.course-page ul, .course-page ol { padding-left: 24px; }
.course-page p, .course-page li { color: #c2d5e7; }
.course-page .button { color: #062c50; margin-top: 24px; }
.course-progress { padding: 22px; border: 1px solid var(--line); border-radius: 12px; background: #0b2031; }
.course-progress progress { width: 100%; height: 10px; margin-top: 14px; accent-color: var(--brand-cyan); }
.course-progress .training-note { margin-top: 10px; }
.course-syllabus { margin-block: 40px; }
.course-syllabus > ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; list-style: none; padding: 0; }
.course-chapter { margin-top: 30px; }
.course-chapter > h3 { font-size: 1.25rem; color: var(--link); margin-bottom: 18px; }
.course-chapter > ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; list-style: none; padding: 0; }
.course-book-links { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; margin-top: 24px; }
.course-syllabus li { border: 1px solid var(--line); border-radius: 12px; background: #0d2133; margin: 0; }
.course-syllabus li > a { display: block; padding: 24px; height: 100%; }
.course-syllabus h3 { margin: 12px 0; font-size: 1.125rem; }
.course-syllabus p { font-size: .9375rem; }
.course-syllabus li.is-complete, .course-outline li.is-complete { border-left: 4px solid #68d2b4; }
.course-project, .course-exam-card { margin-top: 30px; }
.course-page summary { cursor: pointer; color: var(--link); padding-block: 14px; font-weight: 600; }
.course-page details p { padding: 18px; border-left: 3px solid var(--link); background: #102c40; }
.course-lesson-layout { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 28px; margin-top: 30px; align-items: start; }
.course-outline { position: sticky; top: 24px; max-height: calc(100vh - 48px); overflow-y: auto; }
.course-outline ol { padding-left: 22px; }
.course-outline a { display: block; padding: 8px; font-size: .875rem; }
.course-outline a[aria-current] { color: var(--link); font-weight: 700; }
.course-lesson section { margin-bottom: 32px; }
.course-lesson pre { white-space: pre-wrap; overflow-wrap: anywhere; background: #05111f; color: #d7edff; border: 1px solid #29455e; border-radius: 10px; padding: 20px; font: .875rem/1.8 ui-monospace, monospace; margin-block: 20px; }
.course-check { padding: 24px; border: 1px solid #3c657a; border-radius: 12px; background: #0d293b; }
.course-check fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.course-check legend { font-weight: 600; margin-bottom: 14px; }
.course-check input { width: 18px; height: 18px; margin-top: 4px; accent-color: var(--brand-cyan); }
.course-check [data-check-feedback] { margin-top: 18px; color: var(--link); }
.course-check [data-check-explanation] p { margin-top: 14px; }
.course-completion { padding-top: 24px; border-top: 1px solid var(--line); }
.course-page [hidden] { display: none !important; }
.course-exam-start h2 { font-size: 1.6rem; margin-bottom: 18px; }
.course-exam-start button { margin-top: 24px; }
.quiz-test-selection > h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); letter-spacing: -.035em; }
.quiz-test-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 30px; }
.quiz-test-card { min-width: 0; display: flex; align-items: flex-start; flex-direction: column; gap: 16px; padding: 26px; background: #0c1e30; border: 1px solid #34536c; border-radius: 16px; }
.quiz-test-card h3 { font-size: 1.25rem; line-height: 1.5; }
.quiz-test-card > p:not(.quiz-test-state) { color: var(--muted); font-size: .9375rem; }
.quiz-test-card .training-code { font-size: 1rem; }
.quiz-test-card .training-note { margin-top: 0; }
.quiz-test-state { font-size: .8125rem; color: var(--link); margin-top: auto; }
.quiz-test-card button { width: 100%; }
.quiz-sidebar [data-quiz-part="backTests"] { margin: 0 0 22px; }
.quiz-reasoning label { display: block; font-size: .875rem; margin-bottom: 10px; }
.quiz-reasoning textarea { width: 100%; min-height: 110px; padding: 14px; font: inherit; line-height: 1.7; color: var(--ink); background: #081625; border: 1px solid #55748d; border-radius: 10px; resize: vertical; }
.quiz-reasoning textarea::placeholder { color: var(--muted); }
.quiz-reasoning textarea:focus-visible { outline: 3px solid var(--link); outline-offset: 3px; }
.quiz-reasoning .training-note { margin: 8px 0 20px; }
.quiz-oral { border: 1px solid #416080; border-radius: 10px; padding: 20px; margin-top: 18px; background: #10283c; }
.quiz-oral strong { display: block; margin-top: 16px; }
.quiz-oral strong:first-child { margin-top: 0; }
.quiz-oral p { margin-top: 8px; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--muted); }
@media (max-width: 1000px) {
  .course-lesson-layout { grid-template-columns: 220px minmax(0, 1fr); gap: 18px; }
  .quiz-test-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .training-catalogue { grid-template-columns: 1fr 1fr; gap: 24px; }
  .training-workspace { grid-template-columns: 220px minmax(0, 1fr); gap: 20px; }
  .quiz-sidebar .quiz-panel { padding: 18px; }
  .quiz-nav { gap: 6px; }
}
@media (max-width: 760px) {
  .course-cards, .course-overview, .course-syllabus > ol, .course-lesson-layout { grid-template-columns: 1fr; }
  .course-outline { position: static; max-height: none; }
  .course-chapter > ol { grid-template-columns: 1fr; }
  .quiz-test-cards { grid-template-columns: 1fr; }
  .training-page { padding-block: 32px 60px; }
  .training-catalogue, .training-workspace { grid-template-columns: 1fr; }
  .training-intro { margin-bottom: 28px; }
  .quiz-sidebar .quiz-panel { position: static; }
  .quiz-nav { grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 8px; }
  .quiz-content h2 { margin-top: 16px; }
}
@media (max-width: 450px) {
  .quiz-nav { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .quiz-metrics { grid-template-columns: 1fr; }
  .quiz-actions, .quiz-paging { width: 100%; }
  .quiz-actions > button, .quiz-paging > button { flex: 1; }
  .training-facts { gap: 18px; }
}
@media print {
  body.public-site, .training-quiz, .training-quiz * { background: white !important; color: black !important; box-shadow: none !important; }
  body > .header, body > .footer, .skip-link, .training-back, .quiz-sidebar, .quiz-actions, .quiz-content button, .training-disclaimer { display: none !important; }
  .training-workspace { display: block; }
  .training-quiz .container { width: 100%; }
  .training-page, .quiz-panel { padding: 0; border: 0; }
  .quiz-review, .quiz-feedback { break-inside: avoid; }
}