.training-guide__trigger {
  min-height: 44px;
  padding: 9px 14px;
  border: 1px solid currentColor;
  border-radius: 8px;
  background: #fff;
  color: #861329;
  font: inherit;
  font-weight: 650;
  line-height: 1.25;
  white-space: nowrap;
  cursor: pointer;
}

.training-guide__trigger:hover { background: #f5f5f5; }
.training-guide__trigger:focus-visible,
.training-guide__close:focus-visible { outline: 3px solid #c41230; outline-offset: 2px; }

.training-guide__dialog {
  box-sizing: border-box;
  width: min(640px, calc(100vw - 24px));
  max-width: calc(100vw - 24px);
  max-height: min(86vh, 720px);
  max-height: min(86dvh, 720px);
  margin: auto;
  padding: 0;
  overflow: hidden;
  border: 1px solid #d8dadd;
  border-radius: 14px;
  background: #fff;
  color: #202124;
  box-shadow: 0 16px 48px rgb(20 24 32 / 24%);
  font: inherit;
}

.training-guide__dialog[open] { display: flex; flex-direction: column; }
.training-guide__dialog::backdrop { background: rgb(17 24 39 / 55%); }

.training-guide__header {
  display: flex;
  flex: 0 0 auto;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 22px 14px;
  border-bottom: 1px solid #e5e7eb;
}

.training-guide__eyebrow {
  margin: 0 0 5px;
  color: #69707a;
  font-size: 0.8125rem;
  font-weight: 650;
}

.training-guide__header h2 { margin: 0; font-size: 1.35rem; line-height: 1.3; }
.training-guide__header #training-guide-intro { margin: 6px 0 0; color: #555d68; line-height: 1.55; }

.training-guide__close {
  flex: 0 0 auto;
  min-width: 64px;
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid #9ba1aa;
  border-radius: 8px;
  background: #fff;
  color: #282c33;
  font: inherit;
  cursor: pointer;
}

.training-guide__content {
  min-height: 0;
  padding: 6px 22px 20px;
  overflow: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.training-guide__content section { padding: 14px 0 12px; border-bottom: 1px solid #eceef0; }
.training-guide__content section:last-child { border-bottom: 0; }
.training-guide__content h3 { margin: 0 0 7px; font-size: 1rem; line-height: 1.45; }
.training-guide__content p { margin: 0; color: #414750; line-height: 1.7; overflow-wrap: anywhere; }

@media (max-width: 600px) {
  .training-guide__trigger { min-height: 44px; padding: 8px 10px; font-size: 0.9rem; }
  .training-guide__dialog { max-height: min(88vh, 720px); max-height: min(88dvh, 720px); border-radius: 12px; }
  .training-guide__header { gap: 10px; padding: 16px 16px 12px; }
  .training-guide__header h2 { font-size: 1.2rem; }
  .training-guide__close { min-width: 56px; padding: 8px; }
  .training-guide__content { padding: 4px 16px 16px; }
}


.training-guide__content .training-guide__destinations { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.training-guide__destinations a { display: inline-flex; align-items: center; min-height: 44px; padding: 6px 8px; color: #9b1730; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.training-guide__destinations a:focus-visible { outline: 2px solid #9b1730; outline-offset: 2px; }

/* Keep utility controls intrinsic; qa23 credential styles are loaded globally. */
.training-guide__trigger,
.training-guide__close { width: auto; }
.training-guide__header > div { flex: 1 1 auto; min-width: 0; }