/* Real product screenshots, with an accessible full-resolution image viewer. */
#platform .nexus-tour { margin-top: 48px; }
#platform .nexus-tour [hidden] { display: none !important; }
#platform [data-tour-announcement] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
#platform .nexus-tour-intro { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-bottom: 24px; }
#platform .nexus-tour-intro p { color: var(--nexus-text-gold); font-size: 12px; margin-bottom: 7px; }
#platform .nexus-tour-intro h3 { font-size: 26px; font-weight: 500; line-height: 1.5; letter-spacing: -.025em; }
#platform .nexus-tour-modules { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin-bottom: 24px; }
#platform .nexus-tour-modules button { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 12px 8px; border: 1px solid var(--nexus-line); border-radius: 12px; color: var(--nexus-text); background: #fff; font-size: 14px; transition: background .2s, border-color .2s; }
#platform .nexus-tour-modules button > span { color: var(--nexus-muted); font-size: 12px; }
#platform .nexus-tour-modules button:hover { background: var(--nexus-hover); }
#platform .nexus-tour-modules button[aria-pressed="true"] { background: var(--nexus-champagne); border-color: var(--nexus-antique); color: var(--nexus-text-gold); }
#platform .nexus-tour-modules button[aria-pressed="true"] > span { color: inherit; }
#platform .nexus-tour-product { margin: 0; overflow: hidden; border: 1px solid var(--nexus-line); border-radius: 20px; background: #fff; box-shadow: 0 18px 60px #1824330b; }
#platform .nexus-tour-caption { display: flex; justify-content: space-between; align-items: center; gap: 20px; min-height: 60px; padding: 8px 24px; background: var(--nexus-navy); color: #f5e3bd; font-size: 12px; }
#platform .nexus-tour-caption a { display: flex; align-items: center; min-height: 44px; color: var(--nexus-gold); text-decoration: underline; text-underline-offset: 4px; }
#platform .nexus-tour-caption a:focus-visible { outline-color: var(--nexus-gold); }
#platform .nexus-tour-viewport { position: relative; overflow: hidden; aspect-ratio: 2932 / 1598; background: #f7f6f2; }
#platform .nexus-tour-image-link { display: block; width: 100%; height: 100%; cursor: zoom-in; }
#platform .nexus-tour-image { display: block; width: 100%; height: 100%; max-width: none; object-fit: contain; }
#platform .nexus-tour-image-link:focus-visible { outline: 3px solid var(--nexus-text-gold); outline-offset: -4px; }
#platform .nexus-tour[data-image-state="loading"] .nexus-tour-image,
#platform .nexus-tour[data-image-state="error"] .nexus-tour-image { visibility: hidden; }
#platform .nexus-tour-image-state { position: absolute; inset: 0; display: grid; place-items: center; padding: 24px; text-align: center; color: var(--nexus-muted); font-size: 14px; line-height: 1.8; pointer-events: none; }
#platform .nexus-tour-image-note { padding: 12px 24px; color: var(--nexus-muted); font-size: 12px; line-height: 1.8; border-top: 1px solid var(--nexus-rule); }
#platform .nexus-tour-source-links { display: flex; flex-wrap: wrap; gap: 4px 20px; margin-top: 16px; }
#platform .nexus-tour-source-links a { min-height: 44px; display: flex; align-items: center; color: var(--nexus-text-gold); font-size: 13px; text-decoration: underline; text-underline-offset: 4px; }
#platform .nexus-tour-description { display: grid; grid-template-columns: .8fr 1.45fr; gap: 48px; align-items: start; align-content: start; padding: 32px 8px 24px; min-height: 184px; }
#platform .nexus-tour-description-title > span { display: block; font-size: 12px; color: var(--nexus-text-gold); margin-bottom: 10px; }
#platform .nexus-tour-description h4 { font-size: 25px; font-weight: 500; line-height: 1.55; letter-spacing: -.02em; }
#platform .nexus-tour-description-copy > p { font-size: 15px; line-height: 1.9; color: var(--nexus-text); }
#platform .nexus-tour-next { display: flex; gap: 12px; margin-top: 16px; }
#platform .nexus-tour-next > span { flex-shrink: 0; color: var(--nexus-text-gold); font-size: 12px; line-height: 2.2; }
#platform .nexus-tour-next strong { font-size: 13px; font-weight: 400; color: var(--nexus-muted); }
#platform .nexus-tour-footnote { display: flex; justify-content: space-between; gap: 28px; padding: 16px 8px 0; border-top: 1px solid var(--nexus-line); color: var(--nexus-muted); font-size: 12px; line-height: 1.9; }

#platform .nexus-task-example { margin-top: 36px; border-block: 1px solid var(--nexus-line); }
#platform .nexus-task-example > summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px 8px; cursor: pointer; list-style: none; font-size: 16px; line-height: 1.6; color: var(--nexus-navy); }
#platform .nexus-task-example > summary::-webkit-details-marker { display: none; }
#platform .nexus-task-example > summary small { display: block; margin-top: 5px; font-size: 12px; color: var(--nexus-muted); }
#platform .nexus-task-example > summary > .icon { flex-shrink: 0; transition: rotate .2s; }
#platform .nexus-task-example[open] > summary > .icon { rotate: 180deg; }
#platform .nexus-task-example > summary:focus-visible { outline: 2px solid var(--nexus-text-gold); outline-offset: 4px; }
#platform .nexus-task-example .capability-tabs { margin-top: 16px; margin-bottom: 28px; }
#platform .nexus-task-example .capability-tab-list { scroll-margin-top: 104px; }

#platform .nexus-tour-dialog { position: fixed; inset: 0; width: min(1440px, calc(100vw - 40px)); max-width: none; height: min(1050px, calc(100dvh - 40px)); max-height: none; margin: auto; padding: 0; border: 1px solid var(--nexus-line); border-radius: 20px; background: #fff; color: var(--nexus-navy); box-shadow: 0 24px 100px #18243340; }
#platform .nexus-tour-dialog[open] { display: flex; flex-direction: column; }
#platform .nexus-tour-dialog::backdrop { background: #182433b3; }
#platform .nexus-tour-dialog-top { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 18px 24px 10px; }
#platform .nexus-tour-dialog-top h3 { font-size: 18px; font-weight: 500; }
#platform .nexus-tour-dialog-top p { margin-top: 5px; color: var(--nexus-muted); font-size: 12px; }
#platform .nexus-tour-dialog-top button { display: grid; place-items: center; width: 44px; height: 44px; flex-shrink: 0; border-radius: 10px; background: var(--nexus-hover); color: var(--nexus-navy); }
#platform .nexus-tour-dialog-top { flex-shrink: 0; }
#platform .nexus-tour-dialog-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 0 24px 14px; flex-shrink: 0; }
#platform .nexus-tour-dialog-tools button,
#platform .nexus-tour-dialog-tools > a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 9px 15px; border-radius: 10px; background: #fff; color: var(--nexus-text); font-size: 13px; white-space: nowrap; }
#platform .nexus-tour-dialog-tools button[aria-pressed="true"] { background: var(--nexus-champagne); color: var(--nexus-text-gold); }
#platform .nexus-tour-dialog-tools button:hover:not(:disabled) { background: var(--nexus-hover); }
#platform .nexus-tour-dialog-tools button:disabled { opacity: .4; cursor: default; }
#platform .nexus-tour-dialog-tools > a { margin-left: auto; color: var(--nexus-text-gold); text-decoration: underline; text-underline-offset: 4px; }
#platform .nexus-tour-zoom-controls { display: inline-flex; align-items: center; border: 1px solid var(--nexus-line); border-radius: 11px; }
#platform .nexus-tour-zoom-controls button { width: 44px; padding: 10px; }
#platform .nexus-tour-zoom-controls output { min-width: 58px; text-align: center; color: var(--nexus-text); font-size: 13px; font-variant-numeric: tabular-nums; }
#platform .nexus-tour-dialog button:focus-visible,
#platform .nexus-tour-dialog a:focus-visible { outline: 2px solid var(--nexus-text-gold); outline-offset: 2px; }
#platform .nexus-tour-dialog-viewport { position: relative; flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable both-edges; background: #f1f0ec; border-top: 1px solid var(--nexus-line); touch-action: auto; }
#platform .nexus-tour-zoom-stage { position: relative; min-width: 100%; min-height: 100%; }
#platform .nexus-tour-zoom-stage img { position: absolute; display: block; max-width: none; user-select: none; -webkit-user-drag: none; }
#platform .nexus-tour-dialog[data-image-state="loading"] .nexus-tour-zoom-stage,
#platform .nexus-tour-dialog[data-image-state="error"] .nexus-tour-zoom-stage { visibility: hidden; }
#platform .nexus-tour-dialog-viewport.is-zoomed { cursor: grab; }
#platform .nexus-tour-dialog-viewport.is-dragging { cursor: grabbing; user-select: none; }
#platform .nexus-tour-dialog-status { position: absolute; inset: 0; display: grid; place-items: center; padding: 32px 24px; color: var(--nexus-muted); text-align: center; font-size: 14px; line-height: 1.8; }
#platform .nexus-tour-dialog-viewport:focus-visible { outline: 2px solid var(--nexus-text-gold); outline-offset: -4px; }

@media (max-width: 1000px) {
  #platform .nexus-tour-modules { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #platform .nexus-tour-description { gap: 28px; }
  #platform .nexus-tour-description h4 { font-size: 22px; }
  #platform .nexus-tour-description-copy > p { font-size: 14px; }
}
@media (max-width: 640px) {
  #platform .nexus-tour { margin-top: 32px; }
  #platform .nexus-tour-intro { display: block; margin-bottom: 20px; }
  #platform .nexus-tour-intro h3 { font-size: 22px; }
  #platform .nexus-tour-modules { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 20px; }
  #platform .nexus-tour-modules button { min-height: 48px; padding: 10px 6px; gap: 9px; font-size: 13px; }
  #platform .nexus-tour-product { border-radius: 16px; }
  #platform .nexus-tour-caption { padding: 6px 16px; gap: 12px; min-height: 56px; }
  #platform .nexus-tour-image-note { padding: 10px 16px; }
  #platform .nexus-tour-description { grid-template-columns: 1fr; gap: 16px; padding: 24px 0 20px; min-height: 292px; }
  #platform .nexus-tour-description-title > span { margin-bottom: 8px; }
  #platform .nexus-tour-description h4 { font-size: 22px; }
  #platform .nexus-tour-next { display: block; margin-top: 12px; }
  #platform .nexus-tour-next > span { margin-right: 10px; }
  #platform .nexus-tour-description-copy > p { font-size: 14px; line-height: 1.9; }
  #platform .nexus-tour-footnote { display: block; padding: 14px 0 0; }

  #platform .nexus-task-example { margin-top: 28px; }
  #platform .nexus-task-example > summary { padding: 20px 0; gap: 16px; font-size: 14px; }
  #platform .nexus-task-example > summary small { line-height: 1.8; }
  #platform .nexus-tour-dialog { width: calc(100vw - 16px); height: calc(100dvh - 16px); border-radius: 16px; }
  #platform .nexus-tour-dialog-top { padding: 14px 16px 8px; gap: 12px; }
  #platform .nexus-tour-dialog-top h3 { font-size: 16px; }
  #platform .nexus-tour-dialog-top p { line-height: 1.7; }
  #platform .nexus-tour-dialog-tools { padding-inline: 16px; gap: 6px; }
  #platform .nexus-tour-dialog-tools button { padding-inline: 12px; }
  #platform .nexus-tour-zoom-controls button { padding: 10px; }
  #platform .nexus-tour-dialog-tools > a { margin-left: 0; padding-inline: 10px; }
}
@media (max-width: 365px) {
  #platform .nexus-tour-description { min-height: 320px; }
  #platform .nexus-tour-description h4 { font-size: 20px; }
  #platform .nexus-tour-intro h3 { font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  #platform .nexus-tour-modules button,
  #platform .nexus-task-example > summary > .icon { transition: none; }
}