﻿/* ── Domain View — shared layout + workspace nav re-use ────────────────────── */

:root {
  --font-serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --accent-teal: #5CC5A7;
}

.domain-page {
  min-height: 100vh;
  background: var(--color-bg, #0a0a0f);
  color: #fff;
  display: flex;
  flex-direction: column;
}

/* ── Navbar (reuses workspace nav conventions) ─────────────────────────────── */

.workspace-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 2rem;
  height: 64px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  background: rgba(10,10,15,0.9);
  backdrop-filter: blur(10px);
  position: sticky;
  top: 0;
  z-index: 100;
}

.workspace-nav__left {
  display: flex;
  align-items: center;
  gap: 1.25rem;
}

.workspace-nav__back {
  color: rgba(255,255,255,0.5);
  font-size: 0.85rem;
  text-decoration: none;
  transition: color 0.2s;
}
.workspace-nav__back:hover { color: #fff; }

.workspace-nav__logo {
  font-size: 1.1rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: #fff;
}
.workspace-nav__logo span { color: #5CC5A7; }

.workspace-nav__right {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.workspace-nav__domain-title {
  font-size: 0.85rem;
  color: #5CC5A7;
  font-weight: 600;
}

.workspace-nav__logout {
  background: transparent;
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 0.5rem;
  color: rgba(255,255,255,0.7);
  cursor: pointer;
  font-size: 0.82rem;
  padding: 0.35rem 0.85rem;
  transition: border-color 0.2s, color 0.2s;
}
.workspace-nav__logout:hover { border-color: #ff6b6b; color: #ff6b6b; }

.workspace-nav__link {
  color: rgba(255,255,255,0.6);
  font-size: 0.82rem;
  text-decoration: none;
  transition: color 0.2s;
}
.workspace-nav__link:hover { color: #5CC5A7; }

/* ── Loading ───────────────────────────────────────────────────────────────── */

.ws-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1;
  gap: 1rem;
  color: rgba(255,255,255,0.5);
}

.ws-spinner {
  width: 36px;
  height: 36px;
  border: 3px solid rgba(255,255,255,0.1);
  border-top-color: #5CC5A7;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

@keyframes spin { to { transform: rotate(360deg); } }

/* ── Main layout ───────────────────────────────────────────────────────────── */
/* Default: canvas + advisor (no sidebar) */

.domain-main {
  display: grid;
  grid-template-columns: 1fr 1fr;
  flex: 1;
  min-height: calc(100vh - 64px);
}

/* Sidebar hidden by default (blueprint view) */
.domain-sidebar { display: none; }

/* ── Shared panel styles ───────────────────────────────────────────────────── */
/* Sprint 18.2: unified scrolling — the page scrolls naturally; panels no
   longer have independent scrollbars. The advisor panel is sticky so editing
   context stays visible while the blueprint scrolls. */

.canvas-panel,
.chat-panel {
  padding: 2rem;
  display: flex;
  flex-direction: column;
}

.canvas-panel {
  border-right: 1px solid rgba(255,255,255,0.07);
}

.chat-panel {
  position: sticky;
  top: 64px; /* below the sticky workspace nav */
  align-self: start;
  height: calc(100vh - 64px);
  /* Conversation history is the scroll region; the panel itself only
     scrolls as a fallback on very short viewports. */
  overflow-y: auto;
  /* Sprint 18.3: subtle visual identity — the AI interaction surface
     reads slightly lighter than the blueprint canvas */
  background: rgba(255,255,255,0.02);
  border-left: 1px solid rgba(92,197,167,0.14);
  margin-left: -1px; /* sit over the canvas border */
}

.panel-heading {
  font-size: 1.05rem;
  font-weight: 700;
  color: #fff;
  margin: 0 0 0.3rem;
}

.panel-subheading {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.45);
  margin: 0 0 1.5rem;
  line-height: 1.5;
}

/* ── Canvas focus areas ────────────────────────────────────────────────────── */

.focus-areas-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.focus-area-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.75rem;
  padding: 1rem 1.1rem;
  transition: border-color 0.3s;
}

.focus-area-card.updated {
  border-color: rgba(92,197,167,0.6);
  animation: canvas-flash 1.5s ease-out forwards;
}

@keyframes canvas-flash {
  0%   { background: rgba(92,197,167,0.12); }
  100% { background: rgba(255,255,255,0.04); }
}

.focus-area-title {
  font-size: 0.85rem;
  font-weight: 700;
  color: rgba(255,255,255,0.8);
  margin: 0 0 0.4rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.focus-area-desc {
  font-size: 0.88rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.6;
  margin: 0;
  transition: color 0.3s;
}

/* ── Chat ──────────────────────────────────────────────────────────────────── */

/* Sprint 18.3: chip containers sit below the input */
.suggested-prompts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0.6rem 0 0;
}

.suggested-prompt-btn {
  background: rgba(92,197,167,0.08);
  border: 1px solid rgba(92,197,167,0.22);
  border-radius: 1.5rem;
  color: rgba(255,255,255,0.7);
  cursor: pointer;
  font-size: 0.8rem;
  padding: 0.4rem 0.85rem;
  text-align: left;
  transition: background 0.2s, color 0.2s;
  line-height: 1.4;
}
.suggested-prompt-btn:hover { background: rgba(92,197,167,0.18); color: #fff; }

.chat-messages {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  min-height: 120px;
  padding-right: 0.25rem;
  margin-bottom: 0.75rem;
}

.chat-msg {
  max-width: 88%;
  padding: 0.7rem 1rem;
  border-radius: 1rem;
  font-size: 0.9rem;
  line-height: 1.55;
  white-space: pre-wrap;
  word-break: break-word;
}

.chat-msg--user {
  align-self: flex-end;
  background: rgba(92,197,167,0.15);
  border: 1px solid rgba(92,197,167,0.22);
  color: #fff;
  border-bottom-right-radius: 0.2rem;
}

.chat-msg--assistant {
  align-self: flex-start;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.85);
  border-bottom-left-radius: 0.2rem;
}

.chat-msg--typing {
  color: rgba(255,255,255,0.4);
  font-style: italic;
}
.chat-msg--progress {
  color: rgba(255,255,255,0.5);
  font-style: italic;
  font-size: 0.82rem;
  padding: 2px 0;
}
.chat-msg--progress-done {
  color: rgba(74,222,128,0.8);
  font-style: normal;
}

/* ── Error banner ──────────────────────────────────────────────────────────── */

.chat-error {
  background: rgba(255,107,107,0.1);
  border: 1px solid rgba(255,107,107,0.3);
  border-radius: 0.6rem;
  color: #ff6b6b;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.88rem;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
  padding: 0.6rem 1rem;
}

.chat-retry-btn {
  background: rgba(255,107,107,0.15);
  border: 1px solid rgba(255,107,107,0.35);
  border-radius: 0.4rem;
  color: #ff6b6b;
  cursor: pointer;
  font-size: 0.8rem;
  padding: 0.25rem 0.65rem;
  transition: background 0.2s;
  white-space: nowrap;
}
.chat-retry-btn:hover { background: rgba(255,107,107,0.25); }

/* ── Input form ────────────────────────────────────────────────────────────── */

.chat-input-form {
  display: flex;
  gap: 0.6rem;
  align-items: flex-end;
}

/* Sprint 18.3: the input is the primary interaction surface — visually
   dominant: lighter background, clear border, generous height. */
.chat-input {
  flex: 1;
  background: rgba(255,255,255,0.09);
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 0.9rem;
  color: #fff;
  font-size: 0.92rem;
  line-height: 1.5;
  min-height: 64px;
  padding: 0.85rem 1.05rem;
  outline: none;
  resize: none;
  transition: border-color 0.2s, background 0.2s;
  font-family: inherit;
}
.chat-input::placeholder { color: rgba(255,255,255,0.38); }
.chat-input:focus {
  border-color: #5CC5A7;
  background: rgba(255,255,255,0.11);
  box-shadow: 0 0 0 2px rgba(92,197,167,0.15);
}

.chat-send-btn {
  background: #5CC5A7;
  border: none;
  border-radius: 0.75rem;
  color: #0a0a0f;
  cursor: pointer;
  font-size: 1.1rem;
  font-weight: 700;
  min-width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s, opacity 0.2s;
}
.chat-send-btn:hover:not(:disabled) { background: #4ab396; }
.chat-send-btn:disabled { opacity: 0.5; cursor: not-allowed; }

.chat-send-loader {
  width: 16px;
  height: 16px;
  border: 2px solid rgba(10,10,15,0.3);
  border-top-color: #0a0a0f;
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
}

/* ── Strategy Canvas: shared container ────────────────────────────────────── */

.canvas-content {
  display: flex;
  flex-direction: column;
  flex: 1;
}

/* ── Canvas loading / error states ────────────────────────────────────────── */

.canvas-loading {
  display: flex;
  justify-content: center;
  padding: 2rem 0;
}

.canvas-error {
  color: #ff6b6b;
  font-size: 0.85rem;
  padding: 0.5rem 0;
}

/* ── Capability list ───────────────────────────────────────────────────────── */

.capability-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.capability-card {
  width: 100%;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.75rem;
  padding: 0.95rem 1.1rem;
  cursor: pointer;
  text-align: left;
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  column-gap: 0.75rem;
  row-gap: 0.25rem;
  transition: border-color 0.2s, background 0.2s;
  color: inherit;
  font-family: inherit;
}

.capability-card:hover {
  background: rgba(92,197,167,0.07);
  border-color: rgba(92,197,167,0.35);
}

.capability-card:focus-visible {
  outline: 2px solid #5CC5A7;
  outline-offset: 2px;
}

.capability-card__name {
  grid-column: 1;
  grid-row: 1;
  font-size: 0.875rem;
  font-weight: 700;
  color: rgba(255,255,255,0.88);
  letter-spacing: 0.01em;
}

.capability-card__objective {
  grid-column: 1;
  grid-row: 2;
  font-size: 0.8rem;
  color: rgba(255,255,255,0.45);
  line-height: 1.4;
}

.capability-card__arrow {
  grid-column: 2;
  grid-row: 1 / 3;
  align-self: center;
  color: rgba(92,197,167,0.5);
  font-size: 1rem;
  transition: color 0.2s, transform 0.2s;
}

.capability-card:hover .capability-card__arrow {
  color: #5CC5A7;
  transform: translateX(3px);
}

/* ── Blueprint view ────────────────────────────────────────────────────────── */

.blueprint-view {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.blueprint-back-btn {
  background: transparent;
  border: none;
  color: rgba(255,255,255,0.45);
  cursor: pointer;
  font-size: 0.8rem;
  padding: 0;
  text-align: left;
  transition: color 0.2s;
  font-family: inherit;
}

.blueprint-back-btn:hover { color: #fff; }

.blueprint-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.blueprint-capability-name {
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  margin: 0;
}

.blueprint-industry-badge {
  font-size: 0.72rem;
  font-weight: 600;
  color: #5CC5A7;
  background: rgba(92,197,167,0.1);
  border: 1px solid rgba(92,197,167,0.25);
  border-radius: 0.35rem;
  padding: 0.2rem 0.55rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.blueprint-sections {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.blueprint-section {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.75rem;
  padding: 1rem 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.blueprint-section--enriched {
  border-color: rgba(92,197,167,0.18);
}

.blueprint-section__title {
  font-size: 0.82rem;
  font-weight: 700;
  color: #5CC5A7;
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.blueprint-section__definition {
  font-size: 0.875rem;
  color: rgba(255,255,255,0.75);
  line-height: 1.6;
  margin: 0;
}

.blueprint-section__principles {
  margin: 0;
  padding-left: 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.blueprint-section__principles li {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.5;
}

.blueprint-section__question {
  font-size: 0.82rem;
  font-style: italic;
  color: rgba(255,255,255,0.45);
  margin: 0;
  padding-top: 0.25rem;
  border-top: 1px solid rgba(255,255,255,0.06);
}

.blueprint-section__industry {
  background: rgba(92,197,167,0.05);
  border: 1px solid rgba(92,197,167,0.12);
  border-radius: 0.5rem;
  padding: 0.6rem 0.8rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.blueprint-section__industry-label {
  font-size: 0.7rem;
  font-weight: 700;
  color: #5CC5A7;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.blueprint-section__industry p {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.55;
  margin: 0;
}

/* ── Advisor panel header ──────────────────────────────────────────────────── */

.advisor-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 0.3rem;
}

.advisor-panel-header .panel-heading { margin: 0; }

.advisor-context-badge {
  font-size: 0.75rem;
  font-weight: 600;
  color: #5CC5A7;
  background: rgba(92,197,167,0.1);
  border: 1px solid rgba(92,197,167,0.25);
  border-radius: 0.4rem;
  padding: 0.2rem 0.6rem;
  white-space: nowrap;
  flex-shrink: 0;
}

/* ── Advisor response card ─────────────────────────────────────────────────── */

.advisor-response {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(92,197,167,0.2);
  border-radius: 0.85rem;
  padding: 1rem 1.15rem;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  align-self: flex-start;
  width: 100%;
}

.advisor-response__header {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding-bottom: 0.6rem;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  flex-wrap: wrap;
}

.advisor-response__capability {
  font-size: 0.8rem;
  font-weight: 700;
  color: rgba(255,255,255,0.75);
}

.advisor-response__industry-tag {
  font-size: 0.7rem;
  font-weight: 600;
  color: #5CC5A7;
  background: rgba(92,197,167,0.1);
  border: 1px solid rgba(92,197,167,0.2);
  border-radius: 0.3rem;
  padding: 0.15rem 0.45rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.advisor-response__section {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.advisor-response__section-title {
  font-size: 0.72rem;
  font-weight: 700;
  color: #5CC5A7;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0;
}

.advisor-response__section-body {
  font-size: 0.87rem;
  color: rgba(255,255,255,0.75);
  line-height: 1.6;
  margin: 0;
}

.advisor-response__list {
  margin: 0;
  padding-left: 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.advisor-response__list li {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.65);
  line-height: 1.5;
}

/* ═══════════════════════════════════════════════════════════════════════════
   Sprint 16 — Blueprint Collaboration
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Clickable / selectable blueprint sections ─────────────────────────────── */

.blueprint-section--selectable {
  cursor: pointer;
  transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
  position: relative;
}

.blueprint-section--selectable:hover {
  background: rgba(92,197,167,0.05);
  border-color: rgba(92,197,167,0.3);
}

.blueprint-section--selectable:focus-visible {
  outline: 2px solid #5CC5A7;
  outline-offset: 2px;
}

/* Active (selected) section in left panel */
.blueprint-section--active {
  border-color: #5CC5A7 !important;
  background: rgba(92,197,167,0.08) !important;
  box-shadow: 0 0 0 1px rgba(92,197,167,0.25);
  /* Sprint 18.2: accent bar links the selected section to the editing header */
  border-left: 3px solid #5CC5A7 !important;
}

/* Section with accepted company draft */
.blueprint-section--has-draft {
  border-color: rgba(92,197,167,0.35);
}

/* Flash animation when a draft is accepted */
.blueprint-section--flash {
  animation: section-flash 1.4s ease-out forwards;
}

@keyframes section-flash {
  0%   { background: rgba(92,197,167,0.2); }
  100% { background: rgba(255,255,255,0.03); }
}

/* Hover hint shown on non-active sections */
.blueprint-section__select-hint {
  display: none;
  font-size: 0.72rem;
  color: rgba(92,197,167,0.6);
  margin-top: 0.5rem;
  font-style: italic;
}

.blueprint-section--selectable:hover .blueprint-section__select-hint {
  display: block;
}

.blueprint-section--active .blueprint-section__select-hint {
  display: none;
}

/* ── Company draft area (left panel) ───────────────────────────────────────── */

.blueprint-section__draft {
  background: rgba(92,197,167,0.07);
  border: 1px solid rgba(92,197,167,0.25);
  border-radius: 0.5rem;
  padding: 0.65rem 0.85rem;
  margin-top: 0.35rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.blueprint-section__draft-label {
  font-size: 0.67rem;
  font-weight: 700;
  color: #5CC5A7;
  text-transform: uppercase;
  letter-spacing: 0.07em;
}

.blueprint-section__draft-text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.82);
  line-height: 1.6;
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
}

/* ── Section context panel (right panel) ───────────────────────────────────── */

/* Sprint 18.3: compact single-row context header — minimal vertical space,
   stays visible during conversation (panel is sticky). */
.section-context {
  background: rgba(92,197,167,0.07);
  border: 1px solid rgba(92,197,167,0.22);
  /* Sprint 18.2: accent bar mirrors the active section card on the canvas */
  border-left: 3px solid #5CC5A7;
  border-radius: 0.7rem;
  padding: 0.5rem 0.85rem;
  margin-bottom: 0.75rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.section-context__info {
  display: flex;
  align-items: baseline;
  gap: 0.55rem;
  flex-wrap: wrap;
  flex: 1;
  min-width: 0;
}

.section-context__label {
  font-size: 0.6rem;
  font-weight: 700;
  color: #5CC5A7;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  white-space: nowrap;
}

.section-context__title {
  font-size: 0.88rem;
  font-weight: 700;
  color: #fff;
}

.section-context__meta {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.5);
}

.section-context__badges {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  flex-wrap: wrap;
}
.section-context__badges:empty { display: none; }

.section-context__clear {
  background: transparent;
  border: 1px solid rgba(92,197,167,0.3);
  border-radius: 50%;
  color: rgba(92,197,167,0.7);
  cursor: pointer;
  font-size: 0.7rem;
  width: 22px;
  height: 22px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: border-color 0.2s, color 0.2s;
  flex-shrink: 0;
}
.section-context__clear:hover { border-color: #5CC5A7; color: #5CC5A7; }

/* ── Suggestion card ───────────────────────────────────────────────────────── */

.suggestion-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(92,197,167,0.28);
  border-radius: 0.85rem;
  padding: 1rem 1.15rem;
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  align-self: flex-start;
  width: 100%;
}

.suggestion-card--accepted {
  border-color: rgba(92,197,167,0.5);
  background: rgba(92,197,167,0.05);
}

.suggestion-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding-bottom: 0.65rem;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  flex-wrap: wrap;
}

.suggestion-card__section {
  font-size: 0.82rem;
  font-weight: 700;
  color: #5CC5A7;
}

.suggestion-card__label {
  font-size: 0.68rem;
  font-weight: 600;
  color: rgba(255,255,255,0.45);
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 0.3rem;
  padding: 0.15rem 0.45rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* ── Collapsible analysis (Sprint 18.2) ────────────────────────────────────── */

.suggestion-analysis {
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  border-top: 1px solid rgba(255,255,255,0.07);
  padding-top: 0.9rem;
}

.suggestion-analysis-toggle {
  align-self: flex-start;
  background: transparent;
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 0.4rem;
  color: rgba(255,255,255,0.55);
  cursor: pointer;
  font-size: 0.75rem;
  padding: 0.25rem 0.7rem;
  transition: border-color 0.2s, color 0.2s;
}
.suggestion-analysis-toggle:hover {
  border-color: rgba(92,197,167,0.5);
  color: #5CC5A7;
}

/* ── Suggestion analysis sections ──────────────────────────────────────────── */

.suggestion-section {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.suggestion-section__title {
  font-size: 0.7rem;
  font-weight: 700;
  color: rgba(255,255,255,0.5);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0;
}

.suggestion-section__body {
  font-size: 0.87rem;
  color: rgba(255,255,255,0.72);
  line-height: 1.6;
  margin: 0;
}

.suggestion-section__list {
  margin: 0;
  padding-left: 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.suggestion-section__list li {
  font-size: 0.84rem;
  color: rgba(255,255,255,0.62);
  line-height: 1.5;
}

/* ── Suggested revision block ──────────────────────────────────────────────── */

.suggestion-revision {
  background: rgba(92,197,167,0.06);
  border: 1px solid rgba(92,197,167,0.2);
  border-radius: 0.6rem;
  padding: 0.8rem 0.95rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.suggestion-revision .suggestion-section__title {
  color: #5CC5A7;
}

.suggestion-revision__text {
  font-size: 0.88rem;
  color: rgba(255,255,255,0.85);
  line-height: 1.65;
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
}

.suggestion-revision__edit {
  width: 100%;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(92,197,167,0.35);
  border-radius: 0.5rem;
  color: #fff;
  font-size: 0.88rem;
  font-family: inherit;
  line-height: 1.6;
  padding: 0.65rem 0.85rem;
  resize: vertical;
  outline: none;
  transition: border-color 0.2s;
  box-sizing: border-box;
}
.suggestion-revision__edit:focus { border-color: #5CC5A7; }

.suggestion-revision--editing {
  border-color: rgba(92,197,167,0.45);
}

/* ── Accept / Edit / Reject action buttons ─────────────────────────────────── */

.suggestion-actions {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  flex-wrap: wrap;
  padding-top: 0.25rem;
}

.suggestion-btn {
  border-radius: 0.5rem;
  cursor: pointer;
  font-size: 0.82rem;
  font-weight: 600;
  font-family: inherit;
  padding: 0.4rem 1rem;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
  white-space: nowrap;
}

.suggestion-btn--accept {
  background: #5CC5A7;
  border: 1px solid #5CC5A7;
  color: #0a0a0f;
}
.suggestion-btn--accept:hover {
  background: #4ab396;
  border-color: #4ab396;
}

.suggestion-btn--edit {
  background: transparent;
  border: 1px solid rgba(92,197,167,0.4);
  color: #5CC5A7;
}
.suggestion-btn--edit:hover {
  background: rgba(92,197,167,0.1);
  border-color: #5CC5A7;
}

.suggestion-btn--reject {
  background: transparent;
  border: 1px solid rgba(255,107,107,0.3);
  color: rgba(255,107,107,0.7);
}
.suggestion-btn--reject:hover {
  background: rgba(255,107,107,0.08);
  border-color: rgba(255,107,107,0.6);
  color: #ff6b6b;
}

/* Accepted state badge */
.suggestion-accepted-badge {
  font-size: 0.8rem;
  font-weight: 600;
  color: #5CC5A7;
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

/* ═══════════════════════════════════════════════════════════════════════════
   Sprint 17 — Blueprint Lifecycle Management
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Status badges ─────────────────────────────────────────────────────────── */

.blueprint-section__badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  margin-bottom: 0.5rem;
}

.status-badge {
  font-size: 0.63rem;
  font-weight: 700;
  padding: 0.15rem 0.5rem;
  border-radius: 0.3rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  white-space: nowrap;
}

.status-badge--template {
  color: rgba(255,255,255,0.38);
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
}

.status-badge--working-draft {
  color: #f0a832;
  background: rgba(240,168,50,0.1);
  border: 1px solid rgba(240,168,50,0.28);
}

.status-badge--approved {
  color: #5CC5A7;
  background: rgba(92,197,167,0.12);
  border: 1px solid rgba(92,197,167,0.32);
}

/* ── Source badges ─────────────────────────────────────────────────────────── */

.source-badge {
  font-size: 0.6rem;
  font-weight: 600;
  padding: 0.1rem 0.4rem;
  border-radius: 0.25rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.source-badge--core {
  color: rgba(140,175,220,0.9);
  background: rgba(100,140,210,0.1);
  border: 1px solid rgba(100,140,210,0.2);
}

.source-badge--industry {
  color: rgba(92,197,167,0.85);
  background: rgba(92,197,167,0.08);
  border: 1px solid rgba(92,197,167,0.18);
}

.source-badge--user-modified {
  color: #f0a832;
  background: rgba(240,168,50,0.08);
  border: 1px solid rgba(240,168,50,0.2);
}

/* ── Section status modifiers ──────────────────────────────────────────────── */

.blueprint-section--working-draft {
  border-color: rgba(240,168,50,0.25) !important;
}

.blueprint-section--approved {
  border-color: rgba(92,197,167,0.4) !important;
  background: rgba(92,197,167,0.04) !important;
}

/* ── Section action buttons (Approve / Reset) ──────────────────────────────── */

.blueprint-section__section-actions {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.5rem;
  flex-wrap: wrap;
}

.section-action-btn {
  border-radius: 0.45rem;
  cursor: pointer;
  font-size: 0.75rem;
  font-weight: 600;
  font-family: inherit;
  padding: 0.3rem 0.85rem;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
  white-space: nowrap;
}

.section-action-btn--approve {
  background: rgba(92,197,167,0.12);
  border: 1px solid rgba(92,197,167,0.35);
  color: #5CC5A7;
}
.section-action-btn--approve:hover {
  background: rgba(92,197,167,0.22);
  border-color: #5CC5A7;
}

.section-action-btn--reset {
  background: transparent;
  border: 1px solid rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.4);
}
.section-action-btn--reset:hover {
  border-color: rgba(255,107,107,0.4);
  color: rgba(255,107,107,0.75);
}

/* ── Progress bar (per-capability) ────────────────────────────────────────── */

.blueprint-progress {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.65rem;
  padding: 0.75rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  margin-bottom: 0.5rem;
}

.blueprint-progress__list {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.blueprint-progress__item {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}

.blueprint-progress__dot {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.3);
  width: 1rem;
  text-align: center;
  flex-shrink: 0;
}

.blueprint-progress__dot--approved {
  color: #5CC5A7;
}

.blueprint-progress__dot--draft {
  color: #f0a832;
}

.blueprint-progress__name {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.65);
  flex: 1;
}

.blueprint-progress__status {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.3);
  text-align: right;
}

.blueprint-progress__track {
  height: 4px;
  background: rgba(255,255,255,0.08);
  border-radius: 2px;
  overflow: hidden;
}

.blueprint-progress__bar {
  height: 100%;
  background: #5CC5A7;
  border-radius: 2px;
  transition: width 0.4s ease;
  min-width: 0;
}

.blueprint-progress__label {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.4);
  text-align: right;
}

/* ── Company Snapshot card ─────────────────────────────────────────────────── */

.snapshot-card {
  background: rgba(92,197,167,0.05);
  border: 1px solid rgba(92,197,167,0.18);
  border-radius: 0.65rem;
  padding: 0.8rem 1rem;
  margin-bottom: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.snapshot-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.snapshot-title {
  font-size: 0.65rem;
  font-weight: 700;
  color: #5CC5A7;
  text-transform: uppercase;
  letter-spacing: 0.07em;
}

.snapshot-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.5rem;
}

.snapshot-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.15rem;
}

.snapshot-stat__value {
  font-size: 1.15rem;
  font-weight: 700;
  color: #fff;
  line-height: 1;
}

.snapshot-stat__label {
  font-size: 0.62rem;
  color: rgba(255,255,255,0.4);
  text-align: center;
  white-space: nowrap;
}

.snapshot-bar-wrapper {
  height: 4px;
  background: rgba(255,255,255,0.08);
  border-radius: 2px;
  overflow: hidden;
}

.snapshot-bar {
  height: 100%;
  background: linear-gradient(90deg, #5CC5A7, #4ab396);
  border-radius: 2px;
  transition: width 0.5s ease;
  min-width: 0;
}

.snapshot-pct {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.45);
  text-align: right;
}

/* ═══════════════════════════════════════════════════════════════════════════
   Sprint 18.3 — AI Advisor Conversation UX
   ═══════════════════════════════════════════════════════════════════════════ */

/* Suggestion chips — small, optional, populate the input */

.suggestion-chip {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 1rem;
  color: rgba(255,255,255,0.6);
  cursor: pointer;
  font-size: 0.74rem;
  padding: 0.28rem 0.7rem;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
  line-height: 1.3;
}
.suggestion-chip:hover {
  background: rgba(92,197,167,0.12);
  border-color: rgba(92,197,167,0.4);
  color: #fff;
}

/* Welcome empty state */

.advisor-empty {
  background: rgba(255,255,255,0.03);
  border: 1px dashed rgba(92,197,167,0.25);
  border-radius: 0.85rem;
  padding: 1.5rem 1.4rem;
  margin-bottom: 0.85rem;
}

.advisor-empty__title {
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  margin: 0 0 0.35rem;
}

.advisor-empty__text {
  font-size: 0.88rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.55;
  margin: 0 0 0.85rem;
}

.advisor-empty__examples {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.advisor-empty__examples li {
  font-size: 0.84rem;
  color: rgba(92,197,167,0.85);
  font-style: italic;
}

/* Conversational lead in AI responses */

.advisor-response__lead {
  font-size: 0.9rem;
  color: rgba(255,255,255,0.85);
  line-height: 1.6;
  margin: 0;
}

/* Section-change divider in conversation history */

.chat-divider {
  align-self: center;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: rgba(92,197,167,0.7);
  background: rgba(92,197,167,0.07);
  border: 1px solid rgba(92,197,167,0.18);
  border-radius: 1rem;
  padding: 0.2rem 0.8rem;
  margin: 0.35rem 0;
}

/* ═══════════════════════════════════════════════════════════════════════════
   Sprint 19 — Simplified Conversational Workspace
   Minimal section cards, simple progress line, prominent input area.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Minimal section cards ─────────────────────────────────────────────────── */

.blueprint-section__row {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.blueprint-section__dot {
  font-size: 0.95rem;
  color: rgba(255,255,255,0.3);
  flex-shrink: 0;
  width: 1.1rem;
  text-align: center;
}
.blueprint-section__dot--done { color: #5CC5A7; }

/* Section title reads as a document heading, not a technical label */
.blueprint-section__title {
  flex: 1;
  font-size: 0.95rem;
  font-weight: 600;
  color: #fff;
  text-transform: none;
  letter-spacing: 0;
  margin: 0;
}

.blueprint-section__actions {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-shrink: 0;
}

.blueprint-section__action-btn {
  background: rgba(92,197,167,0.1);
  border: 1px solid rgba(92,197,167,0.3);
  border-radius: 0.45rem;
  color: #5CC5A7;
  cursor: pointer;
  font-size: 0.76rem;
  font-weight: 600;
  padding: 0.28rem 0.8rem;
  transition: background 0.2s, border-color 0.2s;
}
.blueprint-section__action-btn:hover {
  background: rgba(92,197,167,0.2);
  border-color: rgba(92,197,167,0.55);
}

.blueprint-section__approve-link {
  background: transparent;
  border: none;
  color: rgba(255,255,255,0.4);
  cursor: pointer;
  font-size: 0.74rem;
  padding: 0;
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color 0.2s;
}
.blueprint-section__approve-link:hover { color: #5CC5A7; }

.blueprint-section__start-hint {
  font-size: 0.83rem;
  color: rgba(255,255,255,0.35);
  font-style: italic;
  margin: 0;
  padding-left: 1.7rem;
}

/* Draft text sits under the title, indented past the dot */
.blueprint-section .blueprint-section__draft-text {
  padding-left: 1.7rem;
  color: rgba(255,255,255,0.7);
  font-size: 0.85rem;
}

/* ── Simple company progress indicator ─────────────────────────────────────── */

.snapshot-simple {
  gap: 0.35rem;
}

.snapshot-simple__title {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: #5CC5A7;
}

.snapshot-simple__line {
  font-size: 0.9rem;
  font-weight: 600;
  color: #fff;
}

.snapshot-simple__track {
  height: 5px;
  background: rgba(255,255,255,0.08);
  border-radius: 3px;
  overflow: hidden;
  margin-top: 0.2rem;
}

.snapshot-simple__bar {
  height: 100%;
  background: linear-gradient(90deg, #5CC5A7, #3DAFD3);
  border-radius: 3px;
  transition: width 0.4s ease;
}

.snapshot-simple__pct {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.5);
}

/* ── Prominent input area ──────────────────────────────────────────────────── */
/* A distinct background block so the one primary action — typing — is obvious */

.chat-input-form {
  background: rgba(92,197,167,0.06);
  border: 1px solid rgba(92,197,167,0.18);
  border-radius: 1rem;
  padding: 0.7rem;
}

/* ── Concise suggestion reasoning ──────────────────────────────────────────── */

.suggestion-why {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.suggestion-why__label {
  font-size: 0.78rem;
  font-weight: 700;
  color: #5CC5A7;
}

.suggestion-why__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.7);
  line-height: 1.6;
  margin: 0;
}

/* ── Responsive ────────────────────────────────────────────────────────────── */

@media (max-width: 1100px) {
  .domain-main--no-chat { grid-template-columns: 260px 1fr; }
}

@media (max-width: 900px) {
  .domain-main {
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
  }
  .domain-main--no-chat {
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
  }
  .domain-main--no-chat .domain-sidebar {
    flex-direction: row;
    flex-wrap: wrap;
    border-right: none;
    border-bottom: 1px solid rgba(255,255,255,0.07);
    padding: 1.25rem 1rem;
    gap: 1rem;
    align-items: center;
  }
  .dsb-donut-wrap { margin: 0; width: 80px; height: 80px; }
  .dsb-pct-text   { font-size: 1.1rem; }
  .canvas-panel  { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.07); }
  .chat-panel    { position: static; height: auto; overflow: visible; border-left: none; margin-left: 0; }
  .chat-messages { max-height: 35vh; }
}

@media (max-width: 640px) {
  .canvas-panel, .chat-panel { padding: 1.25rem 1rem; }
  .workspace-nav { padding: 0 1rem; }
  .workspace-nav__domain-title { display: none; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   Sprint 20 — Domain UX Refinements
   1. No advisor panel on the capability list (full-width canvas)
   2. Guided advisor empty state: section chips + tappable example prompts
   3. Reset link on sections with company content
   4. Minimise/expand toggle on grown sections
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 1. Capability list view: sidebar + canvas ─────────────────────────────── */

.domain-main--no-chat {
  grid-template-columns: 300px 1fr;
}
.domain-main--no-chat .domain-sidebar { display: flex; }
.domain-main--no-chat .chat-panel     { display: none; }
.domain-main--no-chat .canvas-panel   { border-right: none; }

/* ── 2. Advisor empty-state guidance ───────────────────────────────────────── */

.advisor-empty__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0 0 1rem;
}

.advisor-empty__chip {
  background: rgba(92,197,167,0.08);
  border: 1px solid rgba(92,197,167,0.3);
  border-radius: 1rem;
  color: #5CC5A7;
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 600;
  padding: 0.35rem 0.9rem;
  transition: background 0.2s, border-color 0.2s;
}
.advisor-empty__chip:hover {
  background: rgba(92,197,167,0.18);
  border-color: rgba(92,197,167,0.55);
}

.advisor-empty__hint {
  margin: 0;
  font-size: 0.8rem;
  color: rgba(255,255,255,0.4);
}

.advisor-empty__example-btn {
  background: none;
  border: none;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-style: italic;
  padding: 0;
  text-align: left;
  transition: color 0.2s;
}
.advisor-empty__example-btn:hover { color: #5CC5A7; }

/* ── 3. Reset link (inherits the quiet approve-link look) ──────────────────── */

.blueprint-section__reset-link:hover { color: #E07A6A; }

/* ── 4. Minimise/expand toggle ─────────────────────────────────────────────── */

.blueprint-section__collapse-btn {
  background: none;
  border: none;
  color: rgba(255,255,255,0.4);
  cursor: pointer;
  font-size: 0.85rem;
  line-height: 1;
  padding: 0.1rem 0.2rem;
  transition: color 0.2s;
}
.blueprint-section__collapse-btn:hover { color: #fff; }

.blueprint-section--collapsed { padding-bottom: 0.85rem; }

/* ═══════════════════════════════════════════════════════════════════════════
   Sprint 21 — Automotive Blueprint + Company Blueprint
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Per-section Automotive Blueprint sub-card (non-editable) ─────────────── */

.blueprint-section__automotive {
  background: rgba(92,197,167,0.04);
  border: 1px solid rgba(92,197,167,0.16);
  border-radius: 0.55rem;
  padding: 0.75rem 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-top: 0.25rem;
}

.blueprint-section__automotive-label {
  font-size: 0.6rem;
  font-weight: 700;
  color: #5CC5A7;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.blueprint-section__automotive-text {
  font-size: 0.83rem;
  color: rgba(255,255,255,0.62);
  line-height: 1.65;
  margin: 0;
}

/* ── Sprint 20.1 — Continuous conversation after blueprint actions ─────────── */

/* Follow-up guidance message after Accept: confirmation + suggested questions */
.advisor-followup {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  white-space: normal;
  max-width: 100%;
}

.advisor-followup__text {
  margin: 0;
  color: #5CC5A7;
  font-weight: 600;
  font-size: 0.88rem;
  line-height: 1.5;
}

.advisor-followup__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.advisor-followup__move-chip {
  background: rgba(92,197,167,0.18);
  border-color: rgba(92,197,167,0.55);
}

/* ── Company Context Modal (Sprint 23.1) ─────────────────────────────────── */

.cc-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.74);
  z-index: 900;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  animation: cc-fade-in 0.2s ease;
}

@keyframes cc-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.cc-modal {
  background: #0d1117;
  border: 1px solid rgba(92, 197, 167, 0.22);
  border-radius: 1rem;
  padding: 2rem;
  width: 100%;
  max-width: 660px;
  max-height: 88vh;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
}

.cc-modal__header { display: flex; flex-direction: column; gap: 0.4rem; }

.cc-modal__title {
  font-size: 1.1rem;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.95);
  margin: 0;
}

.cc-modal__subtitle {
  font-size: 0.82rem;
  color: rgba(255, 255, 255, 0.48);
  margin: 0;
  line-height: 1.55;
}

.cc-modal__label {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #5CC5A7;
}

.cc-modal__content {
  background: rgba(92, 197, 167, 0.04);
  border: 1px solid rgba(92, 197, 167, 0.13);
  border-radius: 0.55rem;
  padding: 0.9rem 1rem;
  font-size: 0.81rem;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.7;
  white-space: pre-wrap;
  font-family: inherit;
  min-height: 200px;
  max-height: 360px;
  overflow-y: auto;
  resize: vertical;
  width: 100%;
  box-sizing: border-box;
  cursor: default;
}

.cc-modal__content--editable {
  cursor: text;
  color: rgba(255, 255, 255, 0.88);
  border-color: rgba(92, 197, 167, 0.35);
  outline: none;
}

.cc-modal__content--editable:focus {
  border-color: rgba(92, 197, 167, 0.55);
}

.cc-modal__spinner {
  display: none;
  align-items: center;
  gap: 0.55rem;
  font-size: 0.81rem;
  color: rgba(255, 255, 255, 0.48);
  padding: 0.75rem 0;
}

.cc-modal__spinner::before {
  content: '';
  flex-shrink: 0;
  width: 15px;
  height: 15px;
  border: 2px solid rgba(92, 197, 167, 0.25);
  border-top-color: #5CC5A7;
  border-radius: 50%;
  animation: cc-spin 0.75s linear infinite;
}

@keyframes cc-spin { to { transform: rotate(360deg); } }

.cc-modal__actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.cc-modal__btn {
  padding: 0.48rem 1.05rem;
  border-radius: 0.4rem;
  border: none;
  font-size: 0.81rem;
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.15s;
  font-family: inherit;
}

.cc-modal__btn:disabled { opacity: 0.38; cursor: not-allowed; }

.cc-modal__btn--primary {
  background: #5CC5A7;
  color: #0a0e1a;
}

.cc-modal__btn--primary:hover:not(:disabled) { opacity: 0.86; }

.cc-modal__btn--secondary {
  background: rgba(255, 255, 255, 0.07);
  color: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(255, 255, 255, 0.11);
}

.cc-modal__btn--secondary:hover:not(:disabled) { background: rgba(255, 255, 255, 0.11); }

.cc-modal__skip {
  margin-left: auto;
  background: none;
  border: none;
  color: rgba(255, 255, 255, 0.3);
  font-size: 0.77rem;
  cursor: pointer;
  padding: 0.35rem 0.1rem;
  font-family: inherit;
}

.cc-modal__skip:hover { color: rgba(255, 255, 255, 0.5); }

.cc-modal__error {
  font-size: 0.79rem;
  color: #ff6b6b;
}

/* ═══════════════════════════════════════════════════════════════════════════
   Sidebar — Company AI Strategy progress panel (overview state)
   ═══════════════════════════════════════════════════════════════════════════ */

.domain-sidebar {
  flex-direction: column;
  gap: 1.4rem;
  padding: 2rem 1.5rem;
  background: rgba(255,255,255,0.015);
  border-right: 1px solid rgba(255,255,255,0.07);
  overflow-y: auto;
  min-height: calc(100vh - 64px);
}

/* ── Sidebar header ────────────────────────────────────────────────────────── */

.dsb-header {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.dsb-strategy-label {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #5CC5A7;
}

.dsb-caps-count {
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  margin: 0;
  line-height: 1.3;
}

/* ── Donut chart ───────────────────────────────────────────────────────────── */

.dsb-donut-wrap {
  position: relative;
  width: 168px;
  height: 168px;
  margin: 0 auto;
  flex-shrink: 0;
}

.dsb-donut {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}

.dsb-donut__bg {
  fill: none;
  stroke: rgba(255,255,255,0.08);
  stroke-width: 10;
}

.dsb-donut__arc {
  fill: none;
  stroke: #5CC5A7;
  stroke-width: 10;
  stroke-linecap: round;
  stroke-dasharray: 0 301.59;
  stroke-dashoffset: 0;
  transition: stroke-dasharray 0.7s ease;
}

.dsb-donut__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.15rem;
}

.dsb-pct-text {
  font-size: 2rem;
  font-weight: 800;
  color: #fff;
  line-height: 1;
}

.dsb-pct-label {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.45);
}

/* ── Progress bar ──────────────────────────────────────────────────────────── */

.dsb-progress-section {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.dsb-progress-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.dsb-progress-title {
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255,255,255,0.7);
}

.dsb-progress-pct {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.5);
}

.dsb-progress-track {
  height: 5px;
  background: rgba(255,255,255,0.08);
  border-radius: 3px;
  overflow: hidden;
}

.dsb-progress-bar {
  height: 100%;
  background: linear-gradient(90deg, #5CC5A7, #3DAFD3);
  border-radius: 3px;
  transition: width 0.6s ease;
  min-width: 0;
}

/* ── Stats list ────────────────────────────────────────────────────────────── */

.dsb-stats-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.dsb-stat-item {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.dsb-stat-item__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

.dsb-stat-item__count {
  font-size: 0.88rem;
  font-weight: 700;
  color: #fff;
  min-width: 1.2rem;
}

.dsb-stat-item__label {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.6);
}

/* ── Info card ─────────────────────────────────────────────────────────────── */

.dsb-info-card {
  background: rgba(92,197,167,0.06);
  border: 1px solid rgba(92,197,167,0.18);
  border-radius: 0.75rem;
  padding: 1rem 1rem 1rem 0.85rem;
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  margin-top: auto;
}

.dsb-info-card__icon {
  font-size: 1.2rem;
  flex-shrink: 0;
  line-height: 1.4;
}

.dsb-info-card__title {
  font-size: 0.82rem;
  font-weight: 700;
  color: #5CC5A7;
  margin: 0 0 0.3rem;
}

.dsb-info-card__body {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.5);
  line-height: 1.55;
  margin: 0;
}

/* ═══════════════════════════════════════════════════════════════════════════
   Capability cards — redesigned with icon, status, progress
   ═══════════════════════════════════════════════════════════════════════════ */

.capability-list {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.capability-card {
  width: 100%;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.85rem;
  padding: 1rem 1.1rem;
  cursor: pointer;
  text-align: left;
  display: grid;
  grid-template-columns: 52px 1fr auto 28px;
  align-items: center;
  gap: 0 1rem;
  transition: border-color 0.2s, background 0.2s;
  color: inherit;
  font-family: inherit;
}

.capability-card:hover {
  background: rgba(92,197,167,0.06);
  border-color: rgba(92,197,167,0.3);
}

.capability-card:focus-visible {
  outline: 2px solid #5CC5A7;
  outline-offset: 2px;
}

/* Icon circle */
.cap-icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.cap-icon svg {
  width: 22px;
  height: 22px;
}

/* Name + objective */
.cap-body {
  display: flex;
  flex-direction: column;
  gap: 0.18rem;
  min-width: 0;
}

.cap-name {
  font-size: 0.92rem;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cap-objective {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.48);
}

/* Status + percentage + progress bar */
.cap-meta {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 160px;
  text-align: right;
}

.cap-status-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.6rem;
}

.cap-status {
  font-size: 0.75rem;
  font-weight: 600;
}

.cap-status--in-progress { color: #5CC5A7; }
.cap-status--not-started { color: rgba(255,255,255,0.38); }
.cap-status--complete    { color: #5CC5A7; }

.cap-pct {
  font-size: 0.75rem;
  font-weight: 700;
  color: rgba(255,255,255,0.6);
  min-width: 2.5rem;
  text-align: right;
}

.cap-track {
  height: 4px;
  background: rgba(255,255,255,0.08);
  border-radius: 2px;
  overflow: hidden;
}

.cap-bar {
  height: 100%;
  background: rgba(255,255,255,0.12);
  border-radius: 2px;
  transition: width 0.4s ease;
  min-width: 0;
}

.cap-bar--active {
  background: linear-gradient(90deg, #5CC5A7, #3DAFD3);
}

/* Arrow */
.cap-arrow {
  color: rgba(92,197,167,0.45);
  font-size: 1.05rem;
  font-weight: 700;
  text-align: center;
  transition: color 0.2s, transform 0.2s;
  flex-shrink: 0;
}

.capability-card:hover .cap-arrow {
  color: #5CC5A7;
  transform: translateX(3px);
}

/* Coming-soon disabled state */
.capability-card--coming-soon {
  opacity: 0.42;
  cursor: not-allowed;
  filter: grayscale(0.55);
}

.capability-card--coming-soon:hover {
  background: rgba(255,255,255,0.03);
  border-color: rgba(255,255,255,0.07);
}

.cap-coming-soon {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 4px;
  padding: 0.22rem 0.55rem;
  white-space: nowrap;
}

/* ══════════════════════════════════════════════════════════════════════════════
   PI 26.3 Sprint 1 — Blueprint Generation Experience
   Screen 1: Generate Blueprint
   Screen 2: Generation Progress
   Screen 3: Company Blueprint Workspace
══════════════════════════════════════════════════════════════════════════════ */

/* ── Shared screen wrapper ─────────────────────────────────────────────────── */

.screen {
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* ── Navbar additions ──────────────────────────────────────────────────────── */

.btn-ai-assistant {
  background: rgba(92,197,167,0.12);
  border: 1px solid rgba(92,197,167,0.35);
  border-radius: 0.5rem;
  color: #5CC5A7;
  cursor: pointer;
  font-size: 0.82rem;
  font-weight: 600;
  padding: 0.35rem 0.9rem;
  transition: background 0.2s, border-color 0.2s;
  font-family: inherit;
}
.btn-ai-assistant:hover {
  background: rgba(92,197,167,0.22);
  border-color: #5CC5A7;
}
.btn-ai-assistant.is-open {
  background: rgba(92,197,167,0.25);
  border-color: #5CC5A7;
  color: #fff;
}

/* ══════════════════════════════════════════════════════════════════════════════
   SCREEN 1 — Generate Blueprint
══════════════════════════════════════════════════════════════════════════════ */

.screen--generate {
  align-items: center;
  justify-content: center;
  padding: 4rem 1.5rem;
  min-height: calc(100vh - 64px);
}

.gen-hero {
  text-align: center;
  margin-bottom: 2.5rem;
  max-width: 560px;
}

.gen-eyebrow {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #5CC5A7;
  margin: 0 0 0.75rem;
}

.gen-title {
  font-size: clamp(1.6rem, 4vw, 2.4rem);
  font-weight: 800;
  color: #fff;
  margin: 0 0 0.75rem;
  line-height: 1.15;
}

.gen-subtitle {
  font-size: 1rem;
  color: rgba(255,255,255,0.55);
  margin: 0;
  line-height: 1.6;
}

.gen-form {
  width: 100%;
  max-width: 640px;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.gen-input-wrap {
  position: relative;
}

.gen-objective {
  width: 100%;
  box-sizing: border-box;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 1rem;
  color: #fff;
  font-size: 1.05rem;
  line-height: 1.6;
  min-height: 110px;
  padding: 1.1rem 1.25rem;
  resize: none;
  outline: none;
  transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
  font-family: inherit;
}
.gen-objective::placeholder { color: rgba(255,255,255,0.35); }
.gen-objective:focus {
  border-color: #5CC5A7;
  background: rgba(255,255,255,0.09);
  box-shadow: 0 0 0 3px rgba(92,197,167,0.18);
}

.gen-examples {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.gen-examples__divider {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.gen-examples__divider::before,
.gen-examples__divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: rgba(255,255,255,0.15);
}

.gen-examples__label {
  font-size: 0.75rem;
  font-weight: 500;
  color: rgba(255,255,255,0.4);
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.gen-example-chip {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 0.5rem;
  color: rgba(255,255,255,0.6);
  cursor: pointer;
  font-size: 0.78rem;
  padding: 0.6rem 1rem;
  text-align: left;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
  font-family: inherit;
  line-height: 1.6;
  width: 100%;
}
.gen-example-chip:hover {
  background: rgba(92,197,167,0.1);
  border-color: rgba(92,197,167,0.3);
  color: #fff;
}

.gen-error {
  background: rgba(255,107,107,0.1);
  border: 1px solid rgba(255,107,107,0.3);
  border-radius: 0.6rem;
  color: #ff6b6b;
  font-size: 0.88rem;
  padding: 0.65rem 1rem;
}

.gen-objective-counter {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.4);
  text-align: right;
  margin: 0.4rem 0.1rem 0;
}
.gen-objective-counter--over { color: #ff6b6b; }

.gen-submit-btn {
  align-self: center;
  background: #5CC5A7;
  border: none;
  border-radius: 0.75rem;
  color: #0a0a0f;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 700;
  height: 52px;
  min-width: 220px;
  padding: 0 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  transition: background 0.2s, opacity 0.2s, transform 0.15s;
  font-family: inherit;
}
.gen-submit-btn:hover:not(:disabled) {
  background: #4ab396;
  transform: translateY(-1px);
}
.gen-submit-btn:disabled { opacity: 0.55; cursor: not-allowed; }

.gen-submit-loader {
  width: 18px;
  height: 18px;
  border: 2px solid rgba(10,10,15,0.3);
  border-top-color: #0a0a0f;
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
}

/* ══════════════════════════════════════════════════════════════════════════════
   SCREEN 2 — Blueprint Generation Progress
══════════════════════════════════════════════════════════════════════════════ */

.screen--progress {
  align-items: center;
  padding: 4rem 1.5rem;
  min-height: calc(100vh - 64px);
}

.prog-header {
  text-align: center;
  margin-bottom: 2.5rem;
  max-width: 540px;
}

.prog-title {
  font-size: clamp(1.4rem, 3.5vw, 2rem);
  font-weight: 800;
  color: #fff;
  margin: 0 0 0.6rem;
}

.prog-objective {
  font-size: 0.92rem;
  color: rgba(255,255,255,0.55);
  margin: 0;
  font-style: italic;
  line-height: 1.5;
}

.prog-capabilities {
  width: 100%;
  max-width: 540px;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

/* Domain-grouped progress layout */
.prog-domains {
  width: 100%;
  max-width: 720px;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.prog-domain {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.prog-domain__header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding-bottom: 0.35rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.prog-domain__name {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
  margin: 0;
}

.prog-domain__caps {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.prog-cap {
  display: flex;
  align-items: center;
  gap: 1rem;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.75rem;
  padding: 0.9rem 1.1rem;
  transition: border-color 0.3s, background 0.3s;
}

.prog-cap--in-progress {
  border-color: rgba(92,197,167,0.35);
  background: rgba(92,197,167,0.05);
}

.prog-cap--completed {
  border-color: rgba(92,197,167,0.2);
  background: rgba(92,197,167,0.04);
}

.prog-cap--error {
  border-color: rgba(255,107,107,0.3);
}

.prog-cap__icon {
  font-size: 1.1rem;
  width: 24px;
  text-align: center;
  flex-shrink: 0;
}

.prog-cap__icon--pending   { color: rgba(255,255,255,0.3); }
.prog-cap__icon--progress  { color: #5CC5A7; animation: prog-pulse 1.2s ease-in-out infinite; }
.prog-cap__icon--completed { color: #5CC5A7; }
.prog-cap__icon--error     { color: #ff6b6b; }

@keyframes prog-pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.4; }
}

.prog-cap__name {
  font-size: 0.88rem;
  font-weight: 600;
  color: rgba(255,255,255,0.85);
  flex: 1;
}

.prog-cap__status-label {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  flex-shrink: 0;
}

.prog-cap__status-label--pending   { color: rgba(255,255,255,0.3); }
.prog-cap__status-label--progress  { color: #5CC5A7; }
.prog-cap__status-label--completed { color: #5CC5A7; }
.prog-cap__status-label--error     { color: #ff6b6b; }

.prog-hint {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.35);
  text-align: center;
  margin-top: 1.5rem;
  font-style: italic;
  max-width: 400px;
}

/* ══════════════════════════════════════════════════════════════════════════════
   SCREEN 3 — Company Blueprint Workspace
══════════════════════════════════════════════════════════════════════════════ */

.screen--workspace {
  padding: 0;
  min-height: calc(100vh - 64px);
}

/* ── Workspace Header ──────────────────────────────────────────────────────── */

.ws-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 2rem;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  gap: 1rem;
  flex-wrap: wrap;
}

.ws-header__title {
  font-size: 1.15rem;
  font-weight: 800;
  color: #fff;
  margin: 0;
  letter-spacing: -0.01em;
}

.ws-header__right {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}

.btn-export-pdf {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  background: rgba(26, 86, 219, 0.18);
  border: 1px solid rgba(26, 86, 219, 0.45);
  border-radius: 0.5rem;
  color: #93C5FD;
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 600;
  padding: 0.35rem 0.9rem;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
  font-family: inherit;
  white-space: nowrap;
}
.btn-export-pdf:hover {
  background: rgba(26, 86, 219, 0.32);
  border-color: rgba(26, 86, 219, 0.7);
  color: #fff;
}
.btn-export-pdf:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.btn-export-pdf-loader {
  width: 12px;
  height: 12px;
  border: 1.5px solid rgba(147, 197, 253, 0.3);
  border-top-color: #93C5FD;
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
  display: inline-block;
}
@keyframes spin {
  to { transform: rotate(360deg); }
}

.btn-new-blueprint {
  background: transparent;
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 0.5rem;
  color: rgba(255,255,255,0.5);
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 600;
  padding: 0.35rem 0.85rem;
  transition: border-color 0.2s, color 0.2s;
  font-family: inherit;
  white-space: nowrap;
}
.btn-new-blueprint:hover {
  border-color: rgba(255,255,255,0.4);
  color: #fff;
}

.ws-completion-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  background: rgba(92,197,167,0.1);
  border: 1px solid rgba(92,197,167,0.25);
  border-radius: 2rem;
  color: #5CC5A7;
  font-size: 0.78rem;
  font-weight: 700;
  padding: 0.3rem 0.75rem;
}

/* ── Domain Sidebar (left navigation) ────────────────────────────────────── */

.ws-domain-sidebar {
  width: 220px;
  flex-shrink: 0;
  border-right: 1px solid rgba(255,255,255,0.07);
  background: rgba(255,255,255,0.01);
  padding: 1.25rem 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  overflow-y: auto;
  overflow-x: hidden;
  transition: width 0.25s ease, padding 0.25s ease;
  position: sticky;
  top: 64px;
  align-self: start;
  height: calc(100vh - 64px);
}

.ws-domain-sidebar--collapsed {
  width: 56px;
  padding: 1.25rem 0.4rem;
}

.ws-domain-sidebar__label {
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.25);
  margin: 0 0 0.6rem;
  padding: 0 0.4rem;
  white-space: nowrap;
  overflow: hidden;
  transition: opacity 0.2s;
}
.ws-domain-sidebar--collapsed .ws-domain-sidebar__label { opacity: 0; }

.ws-domain-item {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  width: 100%;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 0.55rem;
  color: rgba(255,255,255,0.5);
  cursor: pointer;
  font-family: inherit;
  font-size: 0.82rem;
  font-weight: 600;
  padding: 0.6rem 0.65rem;
  text-align: left;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  overflow: hidden;
  white-space: nowrap;
}
.ws-domain-item:hover {
  background: rgba(255,255,255,0.05);
  color: rgba(255,255,255,0.85);
}
.ws-domain-item.is-active {
  background: rgba(92,197,167,0.1);
  border-color: rgba(92,197,167,0.2);
  color: #5CC5A7;
}

.ws-domain-item__icon {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  font-size: 1.1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.ws-domain-item__icon svg { display: block; }

.ws-domain-item__name {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: opacity 0.2s;
}

.ws-domain-sidebar--collapsed .ws-domain-item {
  justify-content: center;
  padding: 0.6rem 0;
  gap: 0;
}
.ws-domain-sidebar--collapsed .ws-domain-item__name {
  opacity: 0;
  max-width: 0;
  flex: 0;
}

/* ── Domain sidebar: Generated / Not generated grouping ─────────────────── */

.ws-domain-item--locked {
  opacity: 0.4;
  cursor: not-allowed;
}

/* Queued while generating — dimmed but browsable */
.ws-domain-item--queued { opacity: 0.55; }

.ws-domain-group-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-top: 1.1rem;
}

.ws-domain-generate-all {
  padding: 0.25rem 0.7rem;
  font-size: 0.7rem;
  font-weight: 700;
  font-family: inherit;
  color: #fff;
  background: linear-gradient(135deg, #5CC5A7, #3DAFD3);
  border: none;
  border-radius: 20px;
  cursor: pointer;
  transition: opacity 0.15s;
  white-space: nowrap;
}
.ws-domain-generate-all:hover:not(:disabled) { opacity: 0.85; }
.ws-domain-generate-all:disabled {
  background: rgba(255,255,255,0.1);
  color: rgba(255,255,255,0.4);
  cursor: not-allowed;
}
.ws-domain-sidebar--collapsed .ws-domain-group-row { display: none; }

/* ── Guest login banner ───────────────────────────────────────────────────── */

.domain-guest-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.2rem;
  flex-wrap: wrap;
  background: rgba(92, 197, 167, 0.08);
  border-bottom: 1px solid rgba(92, 197, 167, 0.3);
  padding: 0.7rem 1.5rem;
}
.domain-guest-banner p {
  margin: 0;
  font-size: 0.82rem;
  color: rgba(255, 255, 255, 0.75);
}
.domain-guest-banner strong { color: #fff; }
.domain-guest-banner__btn {
  background: linear-gradient(135deg, #5CC5A7, #3DAFD3);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 0.8rem;
  font-weight: 700;
  font-family: inherit;
  padding: 0.45rem 1.1rem;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity 0.12s;
}
.domain-guest-banner__btn:hover { opacity: 0.88; }

/* ── Industry-fit notice ─────────────────────────────────────────────────── */

.domain-industryfit-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(245, 158, 11, 0.08);
  border-bottom: 1px solid rgba(245, 158, 11, 0.3);
  padding: 0.7rem 1.5rem;
}
.domain-industryfit-banner p {
  margin: 0;
  font-size: 0.82rem;
  color: rgba(255, 255, 255, 0.75);
  max-width: 900px;
  text-align: center;
}
.domain-industryfit-banner strong { color: #f59e0b; }

/* ── Not-grounded notice ──────────────────────────────────────────────────── */

.domain-grounding-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.2rem;
  flex-wrap: wrap;
  background: rgba(129, 140, 248, 0.08);
  border-bottom: 1px solid rgba(129, 140, 248, 0.3);
  padding: 0.7rem 1.5rem;
}
.domain-grounding-banner p {
  margin: 0;
  font-size: 0.82rem;
  color: rgba(255, 255, 255, 0.75);
}
.domain-grounding-banner__actions {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.domain-grounding-banner__btn {
  background: linear-gradient(135deg, #818cf8, #5CC5A7);
  color: #fff;
  border-radius: 8px;
  font-size: 0.8rem;
  font-weight: 700;
  font-family: inherit;
  padding: 0.45rem 1.1rem;
  text-decoration: none;
  white-space: nowrap;
  transition: opacity 0.12s;
}
.domain-grounding-banner__btn:hover { opacity: 0.88; }
.domain-grounding-banner__dismiss {
  background: transparent;
  border: none;
  color: rgba(255, 255, 255, 0.4);
  cursor: pointer;
  font-size: 0.9rem;
  line-height: 1;
  padding: 0.3rem;
  transition: color 0.12s;
}
.domain-grounding-banner__dismiss:hover { color: rgba(255, 255, 255, 0.8); }

/* ── Capability Navigation — step tab bar ────────────────────────────────── */

.cap-nav {
  padding: 0;
  border-bottom: none;
}

.cap-step-tabs {
  display: grid;
  grid-template-columns: repeat(var(--cap-step-count, 4), 1fr);
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.cap-step-tab {
  background: transparent;
  border: none;
  border-top: 2px solid rgba(255,255,255,0.08);
  border-right: 1px solid rgba(255,255,255,0.07);
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  padding: 0.85rem 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  transition: background 0.15s, border-color 0.2s;
}
.cap-step-tab:last-child { border-right: none; }
.cap-step-tab:hover { background: rgba(255,255,255,0.02); }

.cap-step-tab.is-active {
  border-top-color: var(--cap-accent, #5CC5A7);
  background: rgba(255,255,255,0.025);
}

.cap-step-tab__meta {
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.32);
}
.cap-step-tab.is-active .cap-step-tab__meta { color: var(--cap-accent, #5CC5A7); }

.cap-step-tab__name {
  font-size: 0.88rem;
  font-weight: 700;
  color: rgba(255,255,255,0.55);
  line-height: 1.3;
}
.cap-step-tab.is-active .cap-step-tab__name { color: rgba(255,255,255,0.92); }

.cap-step-tab__status {
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.28);
}
.cap-step-tab.is-active .cap-step-tab__status { color: var(--cap-accent, #5CC5A7); }

@media (max-width: 900px) {
  .cap-step-tabs { grid-template-columns: 1fr; }
  .cap-step-tab  { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.07); }
}

/* ── Workspace Body ────────────────────────────────────────────────────────── */

.ws-body {
  display: flex;
  flex: 1;
  min-height: 0;
}

/* ── Right panel (wraps cap-nav + content area) ─────────────────────────── */

.ws-right-panel {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

/* ── Content area (blueprint + AI panel side by side) ───────────────────── */

.ws-content-area {
  display: flex;
  flex: 1;
  min-height: 0;
}

/* ── Blueprint Content (full-width by default) ─────────────────────────────── */

.bp-content {
  flex: 1;
  padding: 2rem 2.5rem;
  overflow-y: auto;
}

/* When AI panel is open, content area shrinks naturally via flex — no extra rules needed */

/* Blueprint capability title area */
.bp-cap-header {
  margin-bottom: 1.75rem;
  padding: 1.5rem 0 1rem;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.bp-cap-title {
  font-family: var(--font-serif);
  font-size: 1.9rem;
  font-weight: 700;
  color: #fff;
  margin: 0;
  letter-spacing: -0.01em;
}

.bp-cap-actions {
  flex-shrink: 0;
  display: flex;
  gap: 0.6rem;
  margin-top: 0.3rem;
}

.bp-cap-refine-btn,
.bp-cap-regen-btn {
  padding: 0.5rem 1rem;
  border-radius: 6px;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.15s, border-color 0.15s;
  font-family: inherit;
  white-space: nowrap;
}

.bp-cap-refine-btn {
  background: transparent;
  border: 1px solid rgba(255,255,255,0.18);
  color: rgba(255,255,255,0.75);
}
.bp-cap-refine-btn:hover { border-color: rgba(255,255,255,0.35); color: #fff; }

.bp-cap-regen-btn {
  background: var(--cap-accent, #5CC5A7);
  border: 1px solid var(--cap-accent, #5CC5A7);
  color: #0d1117;
}
.bp-cap-regen-btn:hover:not(:disabled) { opacity: 0.85; }
.bp-cap-regen-btn:disabled { opacity: 0.35; cursor: not-allowed; }

.bp-cap-objective {
  font-size: 0.88rem;
  color: rgba(255,255,255,0.45);
  margin: 0;
  line-height: 1.5;
}

/* Blueprint sections */
.bp-sections {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.bp-section {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 0.9rem;
  padding: 1.5rem;
  transition: border-color 0.2s;
}

.bp-section:hover { border-color: rgba(255,255,255,0.14); }

.bp-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.75rem;
  gap: 0.75rem;
}

.bp-section__title {
  font-size: 0.95rem;
  font-weight: 700;
  color: rgba(255,255,255,0.9);
  margin: 0;
}

.bp-section__content {
  font-size: 0.9rem;
  color: rgba(255,255,255,0.75);
  line-height: 1.75;
  white-space: pre-wrap;
  word-break: break-word;
}

.bp-section--updated {
  border-color: rgba(92,197,167,0.4);
  animation: bp-flash 1.5s ease-out forwards;
}

@keyframes bp-flash {
  0%   { background: rgba(92,197,167,0.1); }
  100% { background: rgba(255,255,255,0.03); }
}

/* Empty state when capability is pending/errored */
.bp-empty {
  text-align: center;
  padding: 4rem 2rem;
  color: rgba(255,255,255,0.35);
}

.bp-empty__icon { font-size: 2.5rem; margin-bottom: 0.75rem; }
.bp-empty__title { font-size: 1rem; font-weight: 600; color: rgba(255,255,255,0.55); margin: 0 0 0.4rem; }
.bp-empty__text  { font-size: 0.85rem; margin: 0 0 1.25rem; }

.bp-regen-btn {
  padding: 0.5rem 1.4rem;
  background: var(--brand, #6366f1);
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  transition: opacity 0.15s;
}
.bp-regen-btn:hover:not(:disabled) { opacity: 0.82; }
.bp-regen-btn:disabled { opacity: 0.45; cursor: not-allowed; }

/* ── Essay Block (Essay view) ──────────────────────────────────────────────── */

.essay-block {
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 0.65rem;
  padding: 1.25rem 1.4rem;
}

.essay-block__text {
  font-size: 0.9rem;
  color: rgba(255,255,255,0.78);
  line-height: 1.85;
  margin: 0;
  white-space: pre-wrap;
}

.essay-block__empty {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.3);
  margin: 0;
  font-style: italic;
}

/* ── Vision Layout (custom 4-block template) ───────────────────────────────── */

.vision-layout {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

/* Block shared base */
.vision-statement,
.vision-metrics,
.vision-timeline {
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.65rem;
  padding: 1.1rem 1.25rem;
}

/* 1. Vision Statement */
.vision-statement__text {
  font-size: 0.875rem;
  color: rgba(255,255,255,0.72);
  line-height: 1.65;
  margin: 0;
}

/* 2. Pillars — .pillars-grid styles below */

/* 3. KPI Highlights — large-number metric cards */
.kpi-highlights-wrap {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.kpi-highlights {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.65rem;
  overflow: hidden;
}

.kpi-item {
  text-align: center;
  padding: 1.6rem 1rem 1.4rem;
  border-right: 1px solid rgba(255,255,255,0.06);
}

.kpi-item:last-child { border-right: none; }

.kpi-item__value {
  font-size: 2.8rem;
  font-weight: 800;
  color: rgba(255,255,255,0.95);
  line-height: 1;
  margin: 0 0 0.5rem;
  letter-spacing: -0.02em;
}

.kpi-item__label {
  font-size: 0.88rem;
  font-weight: 700;
  color: rgba(255,255,255,0.82);
  margin: 0 0 0.3rem;
}

.kpi-item__description {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.4);
  margin: 0;
  line-height: 1.5;
}

/* 4. Horizontal Timeline */
.h-timeline {
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.65rem;
  padding: 1.1rem 1.4rem 1.3rem;
}

.h-timeline__track {
  display: flex;
  align-items: flex-start;
  position: relative;
  margin-top: 0.75rem;
}

/* Connecting line between circles */
.h-timeline__track::before {
  content: '';
  position: absolute;
  top: 0.875rem;
  left: calc(50% / var(--step-count, 4));
  right: calc(50% / var(--step-count, 4));
  height: 1px;
  background: rgba(99,102,241,0.3);
}

.h-timeline__step {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.6rem;
  position: relative;
}

.h-timeline__step-num {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  background: rgba(99,102,241,0.15);
  border: 1px solid rgba(99,102,241,0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.68rem;
  font-weight: 700;
  color: rgba(160,163,255,0.9);
  z-index: 1;
  flex-shrink: 0;
}

.h-timeline__step-label {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.68);
  text-align: center;
  line-height: 1.45;
  max-width: 8rem;
}

@media (max-width: 640px) {
  .kpi-highlights { grid-template-columns: 1fr; }
  .kpi-item { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.06); }
  .kpi-item:last-child { border-bottom: none; }
  .h-timeline__track { flex-direction: column; gap: 1rem; }
  .h-timeline__track::before { display: none; }
  .h-timeline__step { flex-direction: row; align-items: center; gap: 0.75rem; }
  .h-timeline__step-label { text-align: left; max-width: none; }
  .bp-content { padding: 1.25rem 1rem; }
}

/* ── Alignment Layout ──────────────────────────────────────────────────────── */

.alignment-layout {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.alignment-body {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 1.25rem;
  align-items: start;
}

/* Left column wrapper */
.alignment-left {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* Spoke wheel SVG */
.spoke-wheel {
  display: block;
  width: 100%;
  height: auto;
}

/* Left: stacked KPI metrics */
.kpi-stacked-wrap {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.kpi-stacked {
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.65rem;
  overflow: hidden;
}

.kpi-stacked__item {
  padding: 1.1rem 1.25rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.kpi-stacked__item:last-child { border-bottom: none; }

.kpi-stacked__value {
  font-size: 2.4rem;
  font-weight: 800;
  color: rgba(255,255,255,0.95);
  line-height: 1;
  margin: 0 0 0.35rem;
  letter-spacing: -0.02em;
}

.kpi-stacked__label {
  font-size: 0.82rem;
  font-weight: 600;
  color: rgba(255,255,255,0.58);
  margin: 0;
  line-height: 1.4;
}

/* Right: initiative cards */
.alignment-initiatives {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.initiative-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.85rem;
}

.initiative-card {
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.65rem;
  padding: 1rem 1.15rem;
}

.initiative-card--wide {
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.65rem;
  padding: 1rem 1.25rem;
}

.initiative-card__title {
  font-size: 0.92rem;
  font-weight: 700;
  color: rgba(255,255,255,0.9);
  margin: 0 0 0.5rem;
  line-height: 1.35;
}

.initiative-card__description {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.65;
  margin: 0;
}

@media (max-width: 768px) {
  .alignment-body { grid-template-columns: 1fr; }
  .initiative-grid { grid-template-columns: 1fr; }
}

/* ── Business-Led Roadmap CTO template ────────────────────────────────────── */

.business-roadmap-layout,
.strategic-roadmap-layout {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

/* Priority pills */
.roadmap-priorities-section { display: flex; flex-direction: column; gap: 0.5rem; }

.roadmap-priority-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.roadmap-priority-pill {
  background: rgba(99,102,241,0.1);
  border: 1px solid rgba(99,102,241,0.25);
  border-radius: 0.5rem;
  padding: 0.55rem 1rem;
  font-size: 0.86rem;
  font-weight: 500;
  color: rgba(255,255,255,0.82);
}

/* Funnel chart */
.roadmap-funnel-section { display: flex; flex-direction: column; gap: 0.5rem; }

.funnel-chart-wrap {
  display: flex;
  justify-content: center;
  padding: 0.5rem 0;
}

.funnel-chart {
  width: 100%;
  max-width: 420px;
  height: auto;
  display: block;
}

/* ── Strategic Roadmap Design CTO template ─────────────────────────────────── */

/* Prioritization Matrix */
.roadmap-matrix-section { display: flex; flex-direction: column; gap: 0.5rem; }

.priority-matrix {
  display: flex;
  gap: 0.5rem;
  align-items: stretch;
}

.matrix-y-axis {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 0.25rem 0;
  gap: 0.35rem;
}

.matrix-axis-label {
  font-size: 0.72rem;
  font-weight: 600;
  color: rgba(255,255,255,0.5);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  transform: rotate(180deg);
}

.matrix-axis-tick {
  font-size: 0.7rem;
  color: rgba(255,255,255,0.38);
}

.matrix-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.matrix-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.6rem;
}

.matrix-quadrant {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.09);
  border-radius: 0.55rem;
  padding: 0.9rem 1rem;
  min-height: 90px;
}

.matrix-quadrant__title {
  font-size: 0.9rem;
  font-weight: 600;
  color: rgba(255,255,255,0.88);
  margin: 0 0 0.35rem 0;
}

.matrix-quadrant__items {
  font-size: 0.79rem;
  color: rgba(255,255,255,0.52);
  margin: 0;
  line-height: 1.55;
}

.matrix-x-axis {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 0.25rem;
}

/* Quarterly Timeline */
.roadmap-quarterly-section { display: flex; flex-direction: column; gap: 0.5rem; }

.quarterly-timeline {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  position: relative;
}

.quarterly-timeline::before {
  content: '';
  position: absolute;
  top: 14px;
  left: calc(12.5% );
  right: calc(12.5%);
  height: 2px;
  background: rgba(99,102,241,0.35);
  z-index: 0;
}

.quarterly-timeline__step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.45rem;
  position: relative;
  z-index: 1;
}

.quarterly-timeline__num {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(99,102,241,0.85);
  color: rgba(255,255,255,0.95);
  font-size: 0.82rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.quarterly-timeline__quarter {
  font-size: 0.82rem;
  font-weight: 600;
  color: rgba(255,255,255,0.75);
}

.quarterly-timeline__initiatives {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
  text-align: center;
}

.quarterly-timeline__initiative {
  font-size: 0.76rem;
  color: rgba(255,255,255,0.52);
  margin: 0;
  line-height: 1.4;
}

/* ── Commitment section CTO template ──────────────────────────────────────── */

.commitment-layout {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.commitment-actions {
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.65rem;
  padding: 1.1rem 1.25rem;
}

.commitment-actions__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.commitment-actions__list li {
  font-size: 0.84rem;
  color: rgba(255,255,255,0.68);
  padding-left: 1.1rem;
  position: relative;
  line-height: 1.5;
}

.commitment-actions__list li::before {
  content: '→';
  position: absolute;
  left: 0;
  color: rgba(92,197,167,0.75);
  font-size: 0.75rem;
}

/* Executive Commitment Pillars */

.commitment-pillars-section {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.commitment-pillars {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.85rem;
}

.commitment-pillar-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.09);
  border-radius: 0.65rem;
  padding: 1.1rem 1.2rem;
}

.commitment-pillar-card__title {
  font-size: 0.92rem;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  margin: 0 0 0.65rem 0;
}

.commitment-pillar-card__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.commitment-pillar-card__list li {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.62);
  padding-left: 1rem;
  position: relative;
  line-height: 1.5;
}

.commitment-pillar-card__list li::before {
  content: '•';
  position: absolute;
  left: 0;
  color: rgba(99,102,241,0.7);
}

/* Governance Structure — temple layout */

.commitment-governance-section {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.commitment-governance-temple {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 2rem;
  align-items: center;
}

.commitment-governance-nodes {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  gap: 2rem;
  align-self: stretch;
}

.commitment-governance-node {
  padding-top: 0.65rem;
  border-top: 2px solid rgba(99,102,241,0.55);
}

.commitment-governance-node__title {
  font-size: 0.92rem;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  margin: 0 0 0.3rem 0;
}

.commitment-governance-node__desc {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.55);
  margin: 0;
  line-height: 1.5;
}

.commitment-governance-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.governance-temple {
  width: 190px;
  height: auto;
  display: block;
}

/* ── Strategic Pillars (Vision template) ───────────────────────────────────── */

.pillars-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.85rem;
  margin-bottom: 1rem;
}

.pillar-card {
  background: rgba(99,102,241,0.07);
  border: 1px solid rgba(99,102,241,0.18);
  border-radius: 0.65rem;
  padding: 1rem 1.1rem 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.pillar-card__title {
  font-size: 0.92rem;
  font-weight: 700;
  color: rgba(255,255,255,0.9);
  margin: 0;
  line-height: 1.35;
}

.pillar-card__description {
  font-size: 0.84rem;
  color: rgba(255,255,255,0.58);
  margin: 0;
  line-height: 1.6;
  flex: 1;
}

.pillar-card__tag {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 0.18rem 0.5rem;
  background: rgba(99,102,241,0.18);
  color: rgba(160,163,255,0.9);
  border-radius: 4px;
  margin-top: 0.2rem;
  align-self: flex-start;
}

@media (max-width: 640px) {
  .pillars-grid { grid-template-columns: 1fr; }
}

/* ── Strategy Brief Card ───────────────────────────────────────────────────── */

.brief-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 0.6rem;
  overflow: hidden;
  margin-top: 0.25rem;
}

.brief-cell {
  background: rgba(255,255,255,0.02);
  padding: 1rem 1.1rem;
}

.brief-cell--position {
  grid-column: 1 / -1;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.brief-cell--validation {
  grid-column: 1 / -1;
  border-top: 1px solid rgba(255,255,255,0.06);
  background: rgba(92,197,167,0.03);
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.brief-cell--actions { border-right: 1px solid rgba(255,255,255,0.06); }

.brief-label {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  margin: 0 0 0.55rem;
}

.brief-cell--validation .brief-label { color: rgba(92,197,167,0.55); }

.brief-position-text {
  font-size: 0.88rem;
  color: rgba(255,255,255,0.82);
  line-height: 1.65;
  margin: 0;
}

.brief-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.brief-list li {
  font-size: 0.83rem;
  color: rgba(255,255,255,0.75);
  line-height: 1.5;
  padding-left: 1rem;
  position: relative;
}

.brief-list li::before {
  content: '→';
  position: absolute;
  left: 0;
  color: #5CC5A7;
  font-size: 0.75rem;
}

/* Leadership Validation */
.brief-validation-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  border-radius: 2rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 0.25rem 0.65rem;
  white-space: nowrap;
  flex-shrink: 0;
  margin-top: 0.1rem;
}

.brief-validation-badge--approved {
  background: rgba(92,197,167,0.15);
  border: 1px solid rgba(92,197,167,0.35);
  color: #5CC5A7;
}

.brief-validation-badge--review {
  background: rgba(255,200,80,0.12);
  border: 1px solid rgba(255,200,80,0.3);
  color: #f0c040;
}

.brief-validation-badge--pending {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.4);
}

.brief-validation-context {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.5);
  line-height: 1.55;
  margin: 0;
}

/* Essay toggle (secondary) */
.bp-essay-toggle {
  background: transparent;
  border: none;
  color: rgba(255,255,255,0.28);
  cursor: pointer;
  font-size: 0.72rem;
  padding: 0.5rem 0 0;
  transition: color 0.2s;
  font-family: inherit;
  display: block;
}
.bp-essay-toggle:hover { color: rgba(255,255,255,0.55); }

.bp-essay-content {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.45);
  line-height: 1.75;
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(255,255,255,0.06);
  white-space: pre-wrap;
  display: none;
}
.bp-essay-content.is-visible { display: block; }

/* ── AI Assistant Panel ────────────────────────────────────────────────────── */

.ai-panel {
  width: 50%;
  border-left: 1px solid rgba(92,197,167,0.14);
  background: rgba(10,10,15,0.96);
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 64px;
  height: calc(100vh - 64px);
  overflow: hidden;
  flex-shrink: 0;
}

.ai-panel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.1rem 1.25rem 0.75rem;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  flex-shrink: 0;
}

.ai-panel__title {
  font-size: 0.95rem;
  font-weight: 700;
  color: #fff;
  margin: 0;
}

.ai-panel__close {
  background: transparent;
  border: none;
  color: rgba(255,255,255,0.4);
  cursor: pointer;
  font-size: 0.85rem;
  padding: 0.25rem 0.4rem;
  border-radius: 0.3rem;
  transition: color 0.2s, background 0.2s;
}
.ai-panel__close:hover { color: #fff; background: rgba(255,255,255,0.07); }

.ai-panel__context {
  padding: 0.6rem 1.25rem;
  font-size: 0.75rem;
  color: rgba(255,255,255,0.4);
  border-bottom: 1px solid rgba(255,255,255,0.05);
  flex-shrink: 0;
  line-height: 1.5;
}

.ai-panel__context strong {
  color: #5CC5A7;
  font-weight: 600;
}

/* Chat messages inside the AI panel */
.ai-panel .chat-messages {
  padding: 1rem 1.25rem 0.5rem;
  flex: 1;
  overflow-y: auto;
  min-height: 0;
}

.ai-panel .chat-input-form {
  padding: 0.75rem 1.25rem 1rem;
  flex-shrink: 0;
  border-top: 1px solid rgba(255,255,255,0.06);
}

.ai-panel .chat-error {
  margin: 0 1.25rem 0.5rem;
  flex-shrink: 0;
}

/* ── AI Suggestion Card ────────────────────────────────────────────────────── */

.ai-suggestion-card {
  margin: 0.75rem 0 0;
  background: rgba(92,197,167,0.07);
  border: 1px solid rgba(92,197,167,0.25);
  border-radius: 0.75rem;
  padding: 1rem;
}

.ai-suggestion-card__label {
  font-size: 0.7rem;
  font-weight: 700;
  color: #5CC5A7;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0 0 0.5rem;
}

.ai-suggestion-card__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.85);
  line-height: 1.65;
  margin: 0 0 0.5rem;
  white-space: pre-wrap;
  max-height: 180px;
  overflow-y: auto;
}

.ai-suggestion-card__rationale {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.45);
  font-style: italic;
  margin: 0 0 0.75rem;
  line-height: 1.5;
}

.ai-suggestion-card__actions {
  display: flex;
  gap: 0.5rem;
}

.ai-suggestion-btn {
  flex: 1;
  border: none;
  border-radius: 0.45rem;
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 600;
  height: 34px;
  transition: background 0.2s, opacity 0.2s;
  font-family: inherit;
}

.ai-suggestion-btn--accept  { background: #5CC5A7; color: #0a0a0f; }
.ai-suggestion-btn--accept:hover  { background: #4ab396; }
.ai-suggestion-btn--discard { background: rgba(255,255,255,0.07); color: rgba(255,255,255,0.6); }
.ai-suggestion-btn--discard:hover { background: rgba(255,255,255,0.12); color: #fff; }

/* ── Multi-section auto-update card ─────────────────────────────────────────── */
.ai-multi-update {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 10px;
  padding: 14px 16px;
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ai-multi-update--applied {
  border-color: rgba(74,222,128,0.25);
  background: rgba(74,222,128,0.05);
}
.ai-multi-update__summary {
  font-size: 0.88rem;
  color: rgba(255,255,255,0.9);
  line-height: 1.5;
  margin: 0;
}
.ai-multi-update__sections {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.55);
  margin: 0;
}
.ai-multi-update__other {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.45);
  font-style: italic;
  margin: 0;
}
.ai-multi-update__actions {
  display: flex;
  gap: 8px;
  margin-top: 6px;
}
.ai-multi-update-btn {
  padding: 5px 14px;
  border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.18);
  font-size: 0.80rem;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.ai-multi-update-btn--undo {
  background: rgba(255,255,255,0.07);
  color: rgba(255,255,255,0.75);
}
.ai-multi-update-btn--undo:hover {
  background: rgba(255,255,255,0.15);
  color: #fff;
}

/* AI panel open — content shrinks naturally via flex; no explicit rule needed */

/* ── AI Operating Model — Solution-Centric Organization ────────────────────── */

.solution-centric-layout {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.solution-portfolio-section {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

/* Single solution card */
.sol-main-card {
  background: rgba(99,102,241,0.07);
  border: 1px solid rgba(99,102,241,0.28);
  border-radius: 0.75rem;
  padding: 1.25rem 1.4rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.sol-main-card__name {
  font-size: 1.05rem;
  font-weight: 700;
  color: rgba(255,255,255,0.95);
  margin: 0;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid rgba(99,102,241,0.25);
}

.sol-main-card__meta {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.sol-meta-row {
  display: flex;
  align-items: baseline;
  gap: 1rem;
}

.sol-meta-row--chips {
  align-items: flex-start;
}

.sol-meta-label {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(129,140,248,0.85);
  min-width: 5.5rem;
  flex-shrink: 0;
}

.sol-meta-value {
  font-size: 0.875rem;
  color: rgba(255,255,255,0.75);
}

.sol-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.sol-team-chip {
  font-size: 0.75rem;
  font-weight: 500;
  color: rgba(255,255,255,0.82);
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 999px;
  padding: 0.2rem 0.65rem;
}

.sol-kpi-chip {
  font-size: 0.75rem;
  font-weight: 500;
  color: rgba(129,140,248,0.9);
  background: rgba(99,102,241,0.1);
  border: 1px solid rgba(99,102,241,0.25);
  border-radius: 999px;
  padding: 0.2rem 0.65rem;
}

/* Solution Components grid */
.sol-components-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.85rem;
}

.sol-component-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.09);
  border-radius: 0.65rem;
  padding: 1rem 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.sol-component-card__type {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: rgba(129,140,248,0.75);
}

.sol-component-card__name {
  font-size: 0.9rem;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  margin: 0 0 0.4rem;
}

.sol-component-card__purpose-label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
}

.sol-component-card__purpose {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.6);
  line-height: 1.55;
  margin: 0;
}

@media (max-width: 720px) {
  .sol-components-grid { grid-template-columns: 1fr; }
}

/* ── AI Operating Model — Cross-Functional Delivery Teams ───────────────────── */

.cross-functional-layout {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.team-structure-section {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.team-groups-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 0.75rem;
}

.team-group-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.09);
  border-top: 2px solid var(--cap-accent, rgba(99,102,241,0.7));
  border-radius: 0.6rem;
  padding: 0.85rem 1rem;
}

.team-group-card__label {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--cap-accent, rgba(129,140,248,0.85));
  margin: 0 0 0.6rem;
}

.team-group-card__roles {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.team-group-card__roles li {
  font-size: 0.83rem;
  color: rgba(255,255,255,0.78);
  line-height: 1.4;
}

@media (max-width: 600px) {
  .team-groups-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── AI Operating Model — End-to-End Ownership ──────────────────────────────── */

.end-to-end-layout {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.lifecycle-section {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.65rem;
  padding: 1.25rem 1.5rem;
}

.lifecycle-details-section {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.lifecycle-loop {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-bottom: 0.5rem;
}

.lifecycle-loop__node {
  background: rgba(99,102,241,0.15);
  border: 1px solid rgba(99,102,241,0.4);
  border-radius: 2rem;
  padding: 0.4rem 1rem;
  font-size: 0.82rem;
  font-weight: 600;
  color: rgba(255,255,255,0.88);
  white-space: nowrap;
}

.lifecycle-loop__arrow {
  width: 20px;
  height: 2px;
  background: rgba(99,102,241,0.45);
  position: relative;
  flex-shrink: 0;
}

.lifecycle-loop__arrow::after {
  content: '';
  position: absolute;
  right: -1px;
  top: 50%;
  transform: translateY(-50%);
  border-left: 6px solid rgba(99,102,241,0.55);
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
}

.lifecycle-details {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.7rem;
}

.lifecycle-detail-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 0.55rem;
  padding: 0.85rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.lifecycle-detail-card__stage {
  font-size: 0.88rem;
  font-weight: 700;
  color: rgba(160,163,255,0.9);
  margin: 0;
}

.lifecycle-detail-card__resp {
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255,255,255,0.6);
  margin: 0;
}

.lifecycle-detail-card__activities {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.45);
  margin: 0;
  line-height: 1.5;
}

@media (max-width: 720px) {
  .lifecycle-details { grid-template-columns: repeat(2, 1fr); }
  .lifecycle-loop { justify-content: center; }
}

/* ── AI ROI + AI Governance — shared CTO template components ─────────────────
   All new section templates use these shared building blocks so that the
   visual language stays consistent across every new capability. ──────────── */

/* Diagram panel — wraps SVG or pill-chain visuals */
.cto-diagram-section {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.cto-diagram-panel {
  background: rgba(255, 255, 255, 0.025);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 0.65rem;
  padding: 1.25rem 1rem;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow-x: auto;
}

/* Spoke-wheel panel — centers the spoke SVG and constrains its width */
.cto-spoke-panel {
  background: rgba(255, 255, 255, 0.025);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 0.65rem;
  padding: 1.25rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

.cto-spoke-panel .spoke-wheel {
  max-width: 280px;
}

/* Detail section — label + card list */
.cto-detail-section {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

/* ── Detail bullet cards ─────────────────────────────────────────────────────
   Used by: Customer Value, Data Privacy, Ethical AI, Model Validation,
            Regulatory Compliance, Trust & Adoption, Operational Excellence,
            Financial Performance ────────────────────────────────────────── */

.detail-bullet-list {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.detail-bullet-card {
  padding: 0.75rem 1rem 0.75rem 1.2rem;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-left: 3px solid rgba(99, 102, 241, 0.5);
  border-radius: 0 0.55rem 0.55rem 0;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.detail-bullet-card__title {
  font-size: 0.88rem;
  font-weight: 600;
  color: rgba(160, 163, 255, 0.92);
  margin: 0;
}

.detail-bullet-card__desc {
  font-size: 0.8rem;
  color: rgba(255, 255, 255, 0.52);
  margin: 0;
  line-height: 1.55;
}

.detail-bullet-card__list {
  list-style: disc;
  margin: 0;
  padding-left: 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.18rem;
}

.detail-bullet-card__list li {
  font-size: 0.79rem;
  color: rgba(255, 255, 255, 0.54);
  line-height: 1.5;
}

/* ── SDLC Pipeline ───────────────────────────────────────────────────────────
   Used by: Operational Excellence ──────────────────────────────────────── */

.sdlc-pipeline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
}

.sdlc-pipeline__stage {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
  background: rgba(99, 102, 241, 0.1);
  border: 1px solid rgba(99, 102, 241, 0.35);
  border-radius: 0.55rem;
  padding: 0.75rem 1.1rem;
  min-width: 88px;
}

.sdlc-pipeline__stage-name {
  font-size: 0.9rem;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.9);
  text-align: center;
}

.sdlc-pipeline__stage-tool {
  font-size: 0.7rem;
  color: rgba(129, 140, 248, 0.82);
  text-align: center;
  line-height: 1.35;
}

.sdlc-pipeline__arrow {
  font-size: 1.1rem;
  color: rgba(99, 102, 241, 0.5);
  flex-shrink: 0;
  line-height: 1;
}

/* ── Waterfall SVG ───────────────────────────────────────────────────────────
   Used by: Financial Performance ─────────────────────────────────────── */

.waterfall-svg {
  width: 100%;
  max-width: 480px;
  height: auto;
  display: block;
}

/* ── AI ROI — Financial Performance redesign ─────────────────────────────── */

.roi-section {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.roi-summary-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.625rem;
}

.roi-summary-card {
  background: rgba(99,102,241,0.1);
  border: 1px solid rgba(99,102,241,0.2);
  border-radius: 10px;
  padding: 1rem 0.875rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.roi-summary-card--proceed  { border-color: rgba(52,211,153,0.35); background: rgba(52,211,153,0.08); }
.roi-summary-card--pilot    { border-color: rgba(251,191,36,0.35);  background: rgba(251,191,36,0.08); }
.roi-summary-card--reassess { border-color: rgba(239,68,68,0.35);   background: rgba(239,68,68,0.08); }

.roi-summary-card__value {
  font-size: 1.1rem;
  font-weight: 700;
  color: rgba(255,255,255,0.95);
  margin: 0;
}
.roi-summary-card--proceed  .roi-summary-card__value { color: rgba(52,211,153,0.92); }
.roi-summary-card--pilot    .roi-summary-card__value { color: rgba(251,191,36,0.92); }
.roi-summary-card--reassess .roi-summary-card__value { color: rgba(239,68,68,0.92); }

.roi-summary-card__label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: rgba(255,255,255,0.42);
  margin: 0;
}

.roi-cost-value-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border: 1px solid rgba(99,102,241,0.18);
  border-radius: 10px;
  overflow: hidden;
}

.roi-cost-col,
.roi-value-col {
  padding: 1rem 1.125rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.roi-cost-col  { background: rgba(99,102,241,0.07); border-right: 1px solid rgba(99,102,241,0.18); }
.roi-value-col { background: rgba(52,211,153,0.04); }

.roi-col-header {
  font-size: 0.69rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(99,102,241,0.85);
  margin: 0 0 0.25rem;
}
.roi-value-col .roi-col-header { color: rgba(52,211,153,0.72); }

.roi-col-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.roi-col-list li {
  font-size: 0.83rem;
  color: rgba(255,255,255,0.78);
  padding-left: 0.9rem;
  position: relative;
}

.roi-col-list li::before {
  content: '·';
  position: absolute;
  left: 0;
  font-weight: 700;
  color: rgba(99,102,241,0.6);
}
.roi-value-col .roi-col-list li::before { color: rgba(52,211,153,0.6); }

.roi-timeline {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.3rem;
  padding: 0.875rem 1rem;
  background: rgba(99,102,241,0.07);
  border: 1px solid rgba(99,102,241,0.18);
  border-radius: 10px;
}

.roi-timeline__stage {
  background: rgba(99,102,241,0.16);
  border: 1px solid rgba(99,102,241,0.3);
  border-radius: 6px;
  padding: 0.3rem 0.7rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: rgba(255,255,255,0.88);
}

.roi-timeline__arrow {
  font-size: 0.85rem;
  color: rgba(99,102,241,0.55);
  padding: 0 0.1rem;
  user-select: none;
}

@media (max-width: 640px) {
  .roi-summary-row      { grid-template-columns: repeat(2, 1fr); }
  .roi-cost-value-grid  { grid-template-columns: 1fr; }
  .roi-cost-col         { border-right: none; border-bottom: 1px solid rgba(99,102,241,0.18); }
}

/* ── AI ROI — Operational Excellence redesign ────────────────────────────── */

.oe-transformation-table {
  border: 1px solid rgba(99,102,241,0.18);
  border-radius: 10px;
  overflow: hidden;
}

.oe-transform-header {
  display: grid;
  grid-template-columns: 1fr 2.5rem 1fr;
}

.oe-transform-header__current,
.oe-transform-header__future {
  padding: 0.6rem 1rem;
  font-size: 0.69rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border-bottom: 1px solid rgba(99,102,241,0.15);
}

.oe-transform-header__current {
  background: rgba(239,68,68,0.08);
  color: rgba(239,68,68,0.72);
}

.oe-transform-header__arrow {
  background: rgba(99,102,241,0.06);
  border-left: 1px solid rgba(99,102,241,0.12);
  border-right: 1px solid rgba(99,102,241,0.12);
  border-bottom: 1px solid rgba(99,102,241,0.15);
}

.oe-transform-header__future {
  background: rgba(52,211,153,0.07);
  color: rgba(52,211,153,0.72);
}

.oe-transform-row {
  display: grid;
  grid-template-columns: 1fr 2.5rem 1fr;
  border-bottom: 1px solid rgba(99,102,241,0.08);
}
.oe-transform-row:last-child { border-bottom: none; }

.oe-transform-row__current {
  padding: 0.55rem 1rem;
  font-size: 0.83rem;
  color: rgba(255,255,255,0.65);
  background: rgba(239,68,68,0.04);
}

.oe-transform-row__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.82rem;
  color: rgba(99,102,241,0.55);
  background: rgba(99,102,241,0.05);
  border-left: 1px solid rgba(99,102,241,0.1);
  border-right: 1px solid rgba(99,102,241,0.1);
}

.oe-transform-row__future {
  padding: 0.55rem 1rem;
  font-size: 0.83rem;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  background: rgba(52,211,153,0.04);
}

.oe-impact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(185px, 1fr));
  gap: 0.625rem;
}

.oe-impact-card {
  background: rgba(99,102,241,0.08);
  border: 1px solid rgba(99,102,241,0.18);
  border-top: 2px solid var(--cap-accent, rgba(99,102,241,0.7));
  border-radius: 8px;
  padding: 0.875rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.oe-impact-card__title {
  font-size: 0.74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--cap-accent, rgba(99,102,241,0.88));
  margin: 0;
}

.oe-impact-card__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.oe-impact-card__list li {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.75);
  padding-left: 0.85rem;
  position: relative;
}

.oe-impact-card__list li::before {
  content: '·';
  position: absolute;
  left: 0;
  font-weight: 700;
  color: var(--cap-accent, rgba(99,102,241,0.55));
}

.pm-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(195px, 1fr));
  gap: 0.625rem;
}

.pm-dashboard-card {
  background: rgba(15,15,35,0.55);
  border: 1px solid rgba(99,102,241,0.2);
  border-radius: 10px;
  padding: 0.875rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.pm-dashboard-card__area {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: rgba(129,140,248,0.92);
  margin: 0;
}

.pm-dashboard-card__question {
  font-size: 0.74rem;
  color: rgba(255,255,255,0.42);
  font-style: italic;
  margin: 0;
}

.pm-dashboard-card__divider {
  height: 1px;
  background: rgba(99,102,241,0.15);
  margin: 0.1rem 0;
}

.pm-dashboard-card__row {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
}

.pm-dashboard-card__row-label {
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  margin: 0;
}
.pm-dashboard-card__row-label--current { color: rgba(239,68,68,0.7); }
.pm-dashboard-card__row-label--ai      { color: rgba(129,140,248,0.7); }
.pm-dashboard-card__row-label--kpi     { color: rgba(52,211,153,0.7); }

.pm-dashboard-card__row-text {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.72);
  margin: 0;
  line-height: 1.45;
}

.pm-dashboard-card__kpi-value {
  font-size: 0.92rem;
  font-weight: 700;
  color: rgba(52,211,153,0.92);
  margin: 0;
}

/* ── AI ROI — Improvement Scorecard ─────────────────────────────────────── */

.oe-scorecard {
  border: 1px solid rgba(99,102,241,0.18);
  border-radius: 10px;
  overflow: hidden;
  font-size: 0.8125rem;
}

.oe-scorecard__row {
  display: grid;
  grid-template-columns: 1.4fr 1.3fr 1.3fr 2fr;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.oe-scorecard__row:last-child {
  border-bottom: none;
}

.oe-scorecard__row--header {
  background: rgba(99,102,241,0.08);
}

.oe-scorecard__row--header .oe-scorecard__cell {
  font-weight: 600;
  color: rgba(255,255,255,0.5);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.oe-scorecard__row:not(.oe-scorecard__row--header):hover {
  background: rgba(255,255,255,0.03);
}

.oe-scorecard__cell {
  padding: 0.7rem 1rem;
  border-right: 1px solid rgba(255,255,255,0.06);
  line-height: 1.4;
}

.oe-scorecard__cell:last-child {
  border-right: none;
}

.oe-scorecard__cell--area {
  font-weight: 600;
  color: rgba(255,255,255,0.9);
}

.oe-scorecard__cell--before {
  color: rgba(255,255,255,0.45);
}

.oe-scorecard__cell--after {
  color: rgba(129,140,248,0.95);
  font-weight: 500;
}

.oe-scorecard__cell--benefit {
  color: rgba(52,211,153,0.9);
  font-weight: 500;
}

/* ── AI ROI — Customer Value redesign ───────────────────────────────────── */

.cv-journey {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  padding: 1rem;
  background: rgba(99,102,241,0.06);
  border: 1px solid rgba(99,102,241,0.18);
  border-radius: 10px;
}

.cv-journey__stage {
  background: rgba(99,102,241,0.15);
  border: 1px solid rgba(99,102,241,0.3);
  border-radius: 8px;
  padding: 0.55rem 2rem;
  font-size: 0.88rem;
  font-weight: 600;
  color: rgba(255,255,255,0.92);
  text-align: center;
  min-width: 240px;
}

.cv-journey__arrow {
  font-size: 1.1rem;
  color: rgba(99,102,241,0.55);
  line-height: 1.6;
  user-select: none;
}

.cv-value-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(185px, 1fr));
  gap: 0.625rem;
}

.cv-value-card {
  background: rgba(52,211,153,0.05);
  border: 1px solid rgba(52,211,153,0.18);
  border-top: 2px solid rgba(52,211,153,0.55);
  border-radius: 8px;
  padding: 0.875rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.cv-value-card__title {
  font-size: 0.74rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: rgba(52,211,153,0.82);
  margin: 0;
}

.cv-value-card__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.cv-value-card__list li {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.75);
  padding-left: 0.85rem;
  position: relative;
}

.cv-value-card__list li::before {
  content: '·';
  position: absolute;
  left: 0;
  font-weight: 700;
  color: rgba(52,211,153,0.55);
}

.cv-kpi-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.625rem;
}

@media (max-width: 640px) {
  .cv-journey__stage { min-width: 180px; padding: 0.5rem 1rem; }
  .cv-kpi-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── Layout wrappers ─────────────────────────────────────────────────────────
   One wrapper per section type — all share the same column layout. ─────── */

.financial-performance-layout,
.operational-excellence-layout,
.customer-value-layout,
.data-privacy-layout,
.ethical-ai-layout,
.model-validation-layout,
.regulatory-compliance-layout,
.trust-adoption-layout {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* ── Responsive ────────────────────────────────────────────────────────────── */

@media (max-width: 768px) {
  .ws-header { padding: 1.25rem 1rem; }
  .cap-nav   { padding: 0 1rem; }
  .bp-content { padding: 1.25rem 1rem; }

  .ai-panel {
    position: fixed;
    top: 64px;
    right: 0;
    bottom: 0;
    width: 100%;
    z-index: 50;
  }
}

/* ── Feedback card ──────────────────────────────────────────────────────────── */
.feedback-card {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  z-index: 1000;
  width: 320px;
  background: #1a1d2e;
  border: 1px solid rgba(99,102,241,0.3);
  border-radius: 14px;
  padding: 1.5rem 1.5rem 1.25rem;
  box-shadow: 0 8px 40px rgba(0,0,0,0.5), 0 0 0 1px rgba(99,102,241,0.12);
  animation: fb-slide-in 0.3s cubic-bezier(0.34,1.56,0.64,1) both;
}
@keyframes fb-slide-in {
  from { opacity: 0; transform: translateY(16px) scale(0.97); }
  to   { opacity: 1; transform: translateY(0)    scale(1);    }
}
.feedback-dismiss {
  position: absolute;
  top: 0.75rem;
  right: 0.85rem;
  background: none;
  border: none;
  color: rgba(255,255,255,0.3);
  font-size: 0.9rem;
  cursor: pointer;
  line-height: 1;
  padding: 2px 4px;
  transition: color 0.15s;
}
.feedback-dismiss:hover { color: rgba(255,255,255,0.7); }
.feedback-label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(99,102,241,0.85);
  margin: 0 0 0.6rem;
}
.feedback-question {
  font-size: 0.95rem;
  font-weight: 600;
  color: rgba(255,255,255,0.92);
  margin: 0 0 1.1rem;
  line-height: 1.45;
}
.feedback-options {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.feedback-btn {
  display: block;
  width: 100%;
  text-align: left;
  padding: 0.6rem 1rem;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.82);
  font-size: 0.88rem;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.feedback-btn:hover {
  background: rgba(99,102,241,0.18);
  border-color: rgba(99,102,241,0.45);
  color: #fff;
}
.feedback-btn:active { background: rgba(99,102,241,0.28); }
.feedback-card--thankyou .feedback-options { display: none; }
.feedback-card--thankyou .feedback-question {
  color: rgba(255,255,255,0.6);
  font-size: 0.88rem;
  font-weight: 400;
  margin: 0;
}

/* ── Shared "exhibit report" components (used across all 4 AI Use Cases views) ── */

.aiuc-heading {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.7rem;
  margin: 2.5rem 0 1.1rem;
}
.opp-discovery > .opp-layer:first-child .aiuc-heading,
.bvd-view > div:first-child .aiuc-heading,
.pri-view > div:first-child .aiuc-heading {
  margin-top: 0;
}

.aiuc-heading__exhibit {
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  flex-shrink: 0;
}

.aiuc-heading__title {
  font-family: var(--font-serif);
  font-size: 1.15rem;
  font-weight: 700;
  color: #fff;
  margin: 0;
  flex-shrink: 0;
}

.aiuc-heading__subtitle {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.4);
}

.aiuc-callout {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 1.5rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  margin-bottom: 0.5rem;
}

.aiuc-callout__label-text {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent-teal, #5CC5A7);
  margin: 0 0 0.3rem;
}

.aiuc-callout__label-desc {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.4);
  line-height: 1.5;
  margin: 0;
}

.aiuc-callout__content {
  font-family: var(--font-serif);
  font-size: 1.05rem;
  color: rgba(255,255,255,0.88);
  line-height: 1.6;
  margin: 0;
  padding-left: 1.1rem;
  border-left: 2px solid var(--accent-teal, #5CC5A7);
}

@media (max-width: 700px) {
  .aiuc-callout { grid-template-columns: 1fr; gap: 0.6rem; }
}

/* ── AI Use Case Classification view ─────────────────────────────────────── */

.cls-view {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.cls-name--productivity { color: #F5A623; }
.cls-name--functional   { color: #5B8DEF; }
.cls-name--product      { color: #5CC5A7; }

.cls-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.75rem;
  padding-bottom: 0.75rem;
}

.cls-summary__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.55);
}

.cls-legend {
  display: flex;
  gap: 1.25rem;
  flex-wrap: wrap;
}

.cls-legend__item {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: rgba(255,255,255,0.55);
}

.cls-legend__dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
}

.cls-table {
  width: 100%;
  border-collapse: collapse;
}

.cls-table thead th {
  text-align: left;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.32);
  padding: 0.6rem 0.75rem;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}

.cls-table tbody td {
  padding: 1rem 0.75rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  vertical-align: top;
}

.cls-table__num {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.3);
  width: 2.5rem;
}

.cls-table__usecase {
  font-family: var(--font-serif);
  font-size: 0.95rem;
  font-weight: 700;
  color: rgba(255,255,255,0.92);
  line-height: 1.35;
  width: 22%;
}

.cls-table__rationale {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.55;
}

.cls-table__archetype {
  white-space: nowrap;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
}
.cls-table__archetype .cls-legend__dot { margin-right: 0.4rem; }

@media (max-width: 900px) {
  .cls-table thead { display: none; }
  .cls-table, .cls-table tbody, .cls-table tr, .cls-table td { display: block; width: 100%; }
  .cls-table tr { padding: 0.75rem 0; border-bottom: 1px solid rgba(255,255,255,0.08); }
  .cls-table td { padding: 0.2rem 0; border: none; }
}

/* ── Business Value Definition view ──────────────────────────────────────── */

.bvd-view {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.bvd-lever-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1.25rem;
}

.bvd-lever-card {
  position: relative;
  padding-top: 0.85rem;
  border-top: 2px solid rgba(92,197,167,0.35);
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.bvd-lever-card__dot {
  position: absolute;
  top: -4px;
  left: 0;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--accent-teal, #5CC5A7);
}

.bvd-lever-card__area {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent-teal, #5CC5A7);
  margin: 0;
}

.bvd-lever-card__title {
  font-family: var(--font-serif);
  font-size: 0.95rem;
  font-weight: 700;
  color: rgba(255,255,255,0.9);
  line-height: 1.35;
  margin: 0;
}

.bvd-lever-card__outcomes {
  list-style: none;
  padding: 0;
  margin: 0.2rem 0 0;
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
}

.bvd-lever-card__outcomes li {
  font-size: 0.79rem;
  color: rgba(255,255,255,0.5);
  position: relative;
  padding-left: 0.85rem;
  line-height: 1.45;
}

.bvd-lever-card__outcomes li::before {
  content: '·';
  position: absolute;
  left: 0;
  color: rgba(255,255,255,0.3);
}

/* KPI grid */
.bvd-kpi-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.9rem 1.5rem;
}

.bvd-kpi-item {
  display: flex;
  align-items: baseline;
  gap: 0.55rem;
  padding-bottom: 0.6rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.bvd-kpi-item__num {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.3);
  flex-shrink: 0;
}

.bvd-kpi-item__label {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.75);
}

@media (max-width: 900px) {
  .bvd-lever-grid { grid-template-columns: 1fr; }
  .bvd-kpi-grid   { grid-template-columns: 1fr; }
}

/* ── AI Use Case Prioritization view ─────────────────────────────────────── */

.pri-view {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.pri-matrix-wrap {
  display: flex;
  align-items: stretch;
  gap: 0.75rem;
}

.pri-y-axis {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  flex-shrink: 0;
  font-size: 0.62rem;
  font-weight: 700;
  color: rgba(255,255,255,0.32);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  transform: rotate(180deg);
}

.pri-matrix-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.pri-matrix-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  overflow: hidden;
}

.pri-quadrant {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 1rem 1.1rem;
  border-right: 1px solid rgba(255,255,255,0.08);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  min-height: 90px;
}
.pri-quadrant:nth-child(2n) { border-right: none; }
.pri-quadrant:nth-last-child(-n+2) { border-bottom: none; }

.pri-quadrant--recommended {
  background: rgba(92,197,167,0.06);
}

.pri-quadrant__label {
  font-size: 0.66rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: rgba(255,255,255,0.4);
  margin: 0;
}

.pri-quadrant--recommended .pri-quadrant__label { color: var(--accent-teal, #5CC5A7); }

.pri-quadrant__items {
  font-family: var(--font-serif);
  font-size: 0.92rem;
  font-weight: 700;
  color: rgba(255,255,255,0.85);
  line-height: 1.4;
  margin: 0;
}

.pri-x-axis {
  text-align: center;
  font-size: 0.62rem;
  font-weight: 700;
  color: rgba(255,255,255,0.32);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.pri-dim-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25rem;
}

.pri-dim-card {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding-top: 0.85rem;
  border-top: 1px solid rgba(255,255,255,0.08);
}

.pri-dim-card__title {
  font-size: 0.65rem;
  font-weight: 700;
  color: rgba(255,255,255,0.55);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0;
}

.pri-dim-card__bullets {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.pri-dim-card__bullets li {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.55);
  position: relative;
  padding-left: 0.85rem;
  line-height: 1.45;
}

.pri-dim-card__bullets li::before {
  content: '–';
  position: absolute;
  left: 0;
  color: rgba(255,255,255,0.28);
}

.pri-roadmap-track {
  display: flex;
  align-items: stretch;
  gap: 0.9rem;
  flex-wrap: wrap;
}

.pri-roadmap-phase {
  position: relative;
  flex: 1 1 200px;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding-top: 0.85rem;
  border-top: 2px solid rgba(92,197,167,0.35);
}

.pri-roadmap-phase__dot {
  position: absolute;
  top: -4px;
  left: 0;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--accent-teal, #5CC5A7);
}

.pri-roadmap-phase__meta {
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: rgba(255,255,255,0.35);
  margin: 0;
}

.pri-roadmap-phase__name {
  font-family: var(--font-serif);
  font-size: 0.92rem;
  font-weight: 700;
  color: rgba(255,255,255,0.9);
  line-height: 1.35;
  margin: 0;
}

.pri-roadmap-phase__rationale {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.5);
  line-height: 1.5;
  margin: 0;
}

.pri-roadmap-arrow {
  align-self: center;
  font-size: 1rem;
  color: rgba(255,255,255,0.2);
  flex-shrink: 0;
}

@media (max-width: 700px) {
  .pri-roadmap-track { flex-direction: column; }
  .pri-roadmap-arrow { transform: rotate(90deg); align-self: flex-start; margin-left: 1rem; }
}

@media (max-width: 900px) {
  .pri-matrix-grid { grid-template-columns: 1fr; }
  .pri-dim-cards   { grid-template-columns: repeat(2, 1fr); }
}

/* ── AI Opportunity Discovery view ────────────────────────────────────────── */

.opp-discovery {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.opp-layer { display: flex; flex-direction: column; }

/* Business problem grid */
.opp-problem-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 1.25rem;
}

.opp-problem-card {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding-top: 0.85rem;
  border-top: 1px solid rgba(255,255,255,0.08);
}

.opp-problem-card__num {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.3);
}

.opp-problem-card__title {
  font-family: var(--font-serif);
  font-size: 0.92rem;
  font-weight: 700;
  color: rgba(255,255,255,0.88);
  line-height: 1.4;
  margin: 0;
}

.opp-empty-note {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.3);
  font-style: italic;
}

/* Workflow track */
.opp-workflow-track {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.opp-workflow-step {
  flex: 1 1 140px;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(255,255,255,0.08);
}

.opp-workflow-step__num {
  display: block;
  font-size: 0.68rem;
  color: rgba(255,255,255,0.3);
  margin-bottom: 0.3rem;
}

.opp-workflow-step__label {
  font-size: 0.85rem;
  font-weight: 600;
  color: rgba(255,255,255,0.85);
  margin: 0;
  line-height: 1.35;
}

.opp-workflow-step__flag {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  margin-top: 0.4rem;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #E07B5C;
}

.opp-workflow-arrow {
  align-self: center;
  margin-top: 1.4rem;
  font-size: 0.85rem;
  color: rgba(255,255,255,0.2);
  flex-shrink: 0;
}

/* AI opportunities grid */
.opp-ai-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1.25rem;
}

.opp-ai-grid-card {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding-top: 0.85rem;
  border-top: 1px solid rgba(255,255,255,0.08);
}

.opp-ai-grid-card__num {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.3);
}

.opp-ai-grid-card__name {
  font-family: var(--font-serif);
  font-size: 0.95rem;
  font-weight: 700;
  color: rgba(255,255,255,0.9);
  line-height: 1.35;
  margin: 0;
}

.opp-ai-grid-card__why {
  font-size: 0.79rem;
  color: rgba(255,255,255,0.5);
  line-height: 1.5;
  margin: 0;
}

/* ── Data Readiness — Critical Data Identification ─────────────────────────── */

.cdi-view {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.cdi-view__position {
  font-size: 0.9rem;
  color: rgba(255,255,255,0.65);
  line-height: 1.5;
  margin: 0;
}

.cdi-body {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 1.25rem;
}

/* LEFT — Dataset cards */

.cdi-left {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.cdi-dataset-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 0.7rem 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  transition: border-color 0.2s;
}
.cdi-dataset-card:hover {
  border-color: rgba(92,197,167,0.35);
}

.cdi-badge {
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  padding: 0.15rem 0.45rem;
  border-radius: 4px;
  text-transform: uppercase;
}
.cdi-badge--high   { background: rgba(239,68,68,0.2);  color: #f87171; border: 1px solid rgba(239,68,68,0.3); }
.cdi-badge--medium { background: rgba(234,179,8,0.18); color: #fbbf24; border: 1px solid rgba(234,179,8,0.3); }
.cdi-badge--low    { background: rgba(92,197,167,0.15);color: #5CC5A7; border: 1px solid rgba(92,197,167,0.3); }

.cdi-dataset-card__name {
  font-size: 0.83rem;
  font-weight: 700;
  color: #fff;
  margin: 0;
}

.cdi-dataset-card__info-row {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
}

.cdi-dataset-card__info-label {
  font-size: 0.68rem;
  font-weight: 600;
  color: rgba(255,255,255,0.38);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  flex-shrink: 0;
  min-width: 4.5rem;
}

.cdi-dataset-card__info-value {
  font-size: 0.76rem;
  color: rgba(255,255,255,0.65);
  line-height: 1.4;
  margin: 0;
}

.cdi-empty {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.4);
  font-style: italic;
  margin: 0;
}

/* RIGHT — Traceability, collection order, roadmap */

.cdi-right {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

/* Engineering Traceability chain */

.cdi-traceability {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
}

.cdi-traceability__node {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 6px;
  padding: 0.4rem 0.75rem;
  font-size: 0.75rem;
  color: rgba(255,255,255,0.75);
  font-weight: 500;
  width: 100%;
  box-sizing: border-box;
}

.cdi-traceability__node--start {
  background: rgba(92,197,167,0.12);
  border-color: rgba(92,197,167,0.35);
  color: #5CC5A7;
  font-weight: 700;
}

.cdi-traceability__node--end {
  background: rgba(96,165,250,0.1);
  border-color: rgba(96,165,250,0.3);
  color: #93c5fd;
  font-weight: 700;
}

.cdi-traceability__arrow {
  color: rgba(255,255,255,0.3);
  font-size: 0.85rem;
  padding: 0.1rem 0.75rem;
  line-height: 1;
}

/* Recommended Collection Order */

.cdi-collection-row {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  padding: 0.45rem 0;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
.cdi-collection-row:last-child { border-bottom: none; }

.cdi-collection-row__num {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: rgba(92,197,167,0.18);
  color: #5CC5A7;
  font-size: 0.7rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 0.05rem;
}

.cdi-collection-row__content {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}

.cdi-collection-row__name {
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255,255,255,0.85);
  margin: 0;
}

.cdi-collection-row__reason {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.48);
  margin: 0;
  line-height: 1.35;
}

/* Implementation Roadmap */

.cdi-roadmap {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.cdi-roadmap__step {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.4rem 0.6rem;
  border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.07);
}

.cdi-roadmap__step--ready {
  background: rgba(92,197,167,0.07);
  border-color: rgba(92,197,167,0.2);
}

.cdi-roadmap__step--pending {
  background: rgba(255,255,255,0.02);
}

.cdi-roadmap__icon {
  font-size: 0.85rem;
  font-weight: 700;
  width: 18px;
  text-align: center;
  flex-shrink: 0;
}

.cdi-roadmap__step--ready  .cdi-roadmap__icon { color: #5CC5A7; }
.cdi-roadmap__step--pending .cdi-roadmap__icon { color: rgba(255,255,255,0.3); }

.cdi-roadmap__label {
  font-size: 0.76rem;
  color: rgba(255,255,255,0.7);
  margin: 0;
  line-height: 1.35;
}

.cdi-roadmap__step--ready .cdi-roadmap__label { color: rgba(255,255,255,0.88); font-weight: 500; }

/* Relationship map (legacy) */

.cdi-relmap {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.cdi-relmap__grid {
  display: flex;
  align-items: stretch;
  gap: 0.3rem;
}

.cdi-relnode {
  flex: 1;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 0.6rem 0.7rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.cdi-relnode--data-source    { border-color: rgba(92,197,167,0.3); }
.cdi-relnode--dependent-data { border-color: rgba(96,165,250,0.3); }
.cdi-relnode--related-data   { border-color: rgba(167,139,250,0.3); }
.cdi-relnode--target-data    { border-color: rgba(249,115,22,0.3); }

.cdi-relnode__header {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.cdi-relnode__icon {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.5);
}

.cdi-relnode__label {
  font-size: 0.7rem;
  font-weight: 700;
  color: rgba(255,255,255,0.7);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.cdi-relnode__list {
  margin: 0;
  padding-left: 1rem;
  list-style: disc;
}
.cdi-relnode__list li {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.4;
}

.cdi-relmap__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,0.3);
  font-size: 1rem;
  flex-shrink: 0;
  padding: 0 0.1rem;
}

/* Recommendations */

.cdi-recs {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.cdi-rec-row {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 7px;
  padding: 0.55rem 0.75rem;
}

.cdi-rec-row__num {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(92,197,167,0.18);
  color: #5CC5A7;
  font-size: 0.72rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.cdi-rec-row__text {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.8);
  margin: 0;
  flex: 1;
  line-height: 1.4;
}

/* Coverage summary */

.cdi-coverage {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.cdi-coverage__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
}

.cdi-coverage__cell {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 0.65rem 0.5rem;
  text-align: center;
}

.cdi-coverage__value {
  font-size: 1.25rem;
  font-weight: 700;
  color: #5CC5A7;
  margin: 0 0 0.15rem;
  line-height: 1;
}

.cdi-coverage__label {
  font-size: 0.65rem;
  color: rgba(255,255,255,0.45);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0;
}

/* Leadership question */

.cdi-leadership {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  background: rgba(92,197,167,0.07);
  border: 1px solid rgba(92,197,167,0.2);
  border-radius: 8px;
  padding: 0.85rem 1rem;
}

.cdi-leadership__icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(92,197,167,0.2);
  color: #5CC5A7;
  font-size: 0.85rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.cdi-leadership__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.8);
  margin: 0;
  line-height: 1.5;
  font-style: italic;
}

/* Expected AI Output row — amber highlight */

.cdi-dataset-card__info-row--output {
  background: rgba(197,155,52,0.06);
  border: 1px solid rgba(197,155,52,0.15);
  border-radius: 5px;
  padding: 0.3rem 0.5rem;
  margin: 0.1rem 0;
}

.cdi-dataset-card__info-row--output .cdi-dataset-card__info-label {
  color: rgba(197,155,52,0.75);
}

.cdi-dataset-card__info-row--output .cdi-dataset-card__info-value {
  color: rgba(255,255,255,0.85);
  font-style: italic;
}

/* Consultant Guidance block */

.cdi-consultant-guidance {
  background: rgba(92,197,167,0.05);
  border: 1px solid rgba(92,197,167,0.2);
  border-left: 3px solid #5CC5A7;
  border-radius: 8px;
  padding: 0.9rem 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.cdi-consultant-guidance__header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.cdi-consultant-guidance__icon {
  font-size: 0.75rem;
  color: #5CC5A7;
  flex-shrink: 0;
}

.cdi-consultant-guidance__title {
  font-size: 0.68rem;
  font-weight: 800;
  color: #5CC5A7;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.cdi-consultant-guidance__text {
  font-size: 0.83rem;
  color: rgba(255,255,255,0.75);
  line-height: 1.6;
  margin: 0;
}

/* AI Recommendation block */

.cdi-ai-recommendation {
  background: rgba(197,155,52,0.05);
  border: 1px solid rgba(197,155,52,0.2);
  border-left: 3px solid #C59B34;
  border-radius: 8px;
  padding: 0.9rem 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.cdi-ai-recommendation__header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.cdi-ai-recommendation__icon {
  font-size: 0.9rem;
  color: #C59B34;
  flex-shrink: 0;
}

.cdi-ai-recommendation__title {
  font-size: 0.68rem;
  font-weight: 800;
  color: #C59B34;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.cdi-ai-recommendation__text {
  font-size: 0.83rem;
  color: rgba(255,255,255,0.75);
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 900px) {
  .cdi-body {
    grid-template-columns: 1fr;
  }
  .cdi-relmap__grid {
    flex-direction: column;
  }
  .cdi-relmap__arrow {
    transform: rotate(90deg);
  }
}

/* ── Data Readiness — AI Data Preparation ──────────────────────────────────── */

.adp-view {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  position: relative;
}

.adp-readiness-badge {
  position: absolute;
  top: 0;
  right: 0;
  background: rgba(197,155,52,0.2);
  border: 1px solid rgba(197,155,52,0.45);
  color: #C59B34;
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  padding: 0.2rem 0.6rem;
  border-radius: 20px;
  text-transform: uppercase;
}

.adp-view__position {
  font-size: 0.9rem;
  color: rgba(255,255,255,0.65);
  line-height: 1.5;
  margin: 0;
  max-width: 85%;
}

/* Three-column body */

.adp-body {
  display: grid;
  grid-template-columns: 2fr 0.85fr 1.5fr;
  gap: 1.25rem;
}

.adp-col {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.adp-empty {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.4);
  font-style: italic;
  margin: 0;
}

/* Preparation Work Package cards */

.adp-wp-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 0.75rem 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  transition: border-color 0.2s;
}
.adp-wp-card:hover {
  border-color: rgba(197,155,52,0.3);
}

.adp-wp-card__name {
  font-size: 0.84rem;
  font-weight: 700;
  color: #fff;
  margin: 0;
}

.adp-wp-card__field-label {
  font-size: 0.67rem;
  font-weight: 600;
  color: rgba(255,255,255,0.35);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  display: block;
  margin-bottom: 0.15rem;
}

.adp-wp-card__work-list {
  margin: 0;
  padding-left: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.adp-wp-card__work-item {
  font-size: 0.76rem;
  color: rgba(255,255,255,0.72);
  line-height: 1.4;
}

.adp-wp-card__row {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
}

.adp-wp-card__value {
  font-size: 0.76rem;
  color: rgba(255,255,255,0.62);
  line-height: 1.35;
}

.adp-wp-card__why-row { display: flex; flex-direction: column; gap: 0.1rem; }

.adp-wp-card__why {
  font-size: 0.76rem;
  color: rgba(255,255,255,0.55);
  line-height: 1.4;
  margin: 0;
  font-style: italic;
}

.adp-wp-card__deliverable {
  font-size: 0.76rem;
  color: #C59B34;
  font-weight: 600;
}

.adp-wp-card__meta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 0.1rem;
}

/* Legacy activity card */
.adp-activity-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 0.7rem 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.38rem;
  transition: border-color 0.2s;
}
.adp-activity-card:hover { border-color: rgba(197,155,52,0.3); }
.adp-activity-card__name  { font-size: 0.83rem; font-weight: 700; color: #fff; margin: 0; }
.adp-activity-card__row   { display: flex; align-items: baseline; gap: 0.5rem; }
.adp-activity-card__label { font-size: 0.68rem; font-weight: 600; color: rgba(255,255,255,0.38); text-transform: uppercase; letter-spacing: 0.05em; flex-shrink: 0; min-width: 5.5rem; }
.adp-activity-card__value { font-size: 0.76rem; color: rgba(255,255,255,0.65); line-height: 1.35; margin: 0; }

/* Input Dataset cards (legacy) */

.adp-dataset-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 0.7rem 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  transition: border-color 0.2s;
}
.adp-dataset-card:hover { border-color: rgba(197,155,52,0.3); }

.adp-dataset-card__icon { font-size: 1.3rem; color: #C59B34; line-height: 1; }
.adp-dataset-card__name { font-size: 0.82rem; font-weight: 600; color: #fff; margin: 0; }

.adp-status {
  font-size: 0.62rem; font-weight: 700; letter-spacing: 0.07em;
  text-transform: uppercase; padding: 0.15rem 0.5rem; border-radius: 4px; align-self: flex-start;
}
.adp-status--available { background: rgba(92,197,167,0.15);  color: #5CC5A7; }
.adp-status--missing   { background: rgba(239,68,68,0.15);   color: #f87171; }
.adp-status--progress  { background: rgba(197,155,52,0.18);  color: #C59B34; }

/* Preparation Roadmap (center column) */

.adp-roadmap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.adp-roadmap__node {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 6px;
  padding: 0.4rem 0.7rem;
  width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}

.adp-roadmap__node--start {
  background: rgba(197,155,52,0.12);
  border-color: rgba(197,155,52,0.35);
}
.adp-roadmap__node--start .adp-roadmap__stage { color: #C59B34; font-weight: 700; }
.adp-roadmap__node--start .adp-roadmap__outcome { color: rgba(197,155,52,0.65); }

.adp-roadmap__node--end {
  background: rgba(92,197,167,0.1);
  border-color: rgba(92,197,167,0.3);
}
.adp-roadmap__node--end .adp-roadmap__stage { color: #5CC5A7; font-weight: 700; }
.adp-roadmap__node--end .adp-roadmap__outcome { color: rgba(92,197,167,0.6); }

.adp-roadmap__stage {
  font-size: 0.76rem;
  font-weight: 600;
  color: rgba(255,255,255,0.82);
  line-height: 1;
}

.adp-roadmap__outcome {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.4);
  line-height: 1.3;
}

.adp-roadmap__arrow {
  color: rgba(255,255,255,0.28);
  font-size: 0.85rem;
  padding: 0.08rem 0.7rem;
  line-height: 1;
}

/* Implementation Guidance — first steps */

.adp-step-row {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  padding: 0.5rem 0;
}

.adp-step-row__num {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(197,155,52,0.18);
  color: #C59B34;
  font-size: 0.72rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 0.05rem;
}

.adp-step-row__content {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  flex: 1;
}

.adp-step-row__action {
  font-size: 0.8rem;
  font-weight: 600;
  color: rgba(255,255,255,0.88);
  margin: 0;
  line-height: 1.35;
}

.adp-step-row__why {
  font-size: 0.73rem;
  color: rgba(255,255,255,0.48);
  margin: 0;
  line-height: 1.35;
  font-style: italic;
}

.adp-step-row__meta-row {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.adp-step-row__owner-wrap {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.adp-step-row__owner-label {
  font-size: 0.67rem;
  font-weight: 600;
  color: rgba(255,255,255,0.35);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.adp-step-row__owner {
  font-size: 0.73rem;
  color: rgba(255,255,255,0.55);
}

.adp-step-row__output {
  font-size: 0.73rem;
  color: #C59B34;
  font-weight: 500;
}

.adp-step-divider {
  height: 1px;
  background: rgba(255,255,255,0.07);
  margin: 0 0 0 2rem;
}

/* Ready to Proceed card */

.adp-ready-card {
  background: rgba(197,155,52,0.06);
  border: 1px solid rgba(197,155,52,0.2);
  border-radius: 10px;
  padding: 0.85rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.adp-ready-card__body {
  display: flex;
  gap: 2rem;
}

.adp-ready-card__row {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  flex: 1;
}

.adp-ready-card__meta-label {
  font-size: 0.67rem;
  font-weight: 600;
  color: rgba(255,255,255,0.35);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.adp-ready-card__next {
  font-size: 0.9rem;
  font-weight: 700;
  color: #C59B34;
  margin: 0;
}

.adp-ready-card__goal {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.6);
  margin: 0;
  line-height: 1.5;
}

/* AI Recommendations (legacy) */

.adp-rec-card {
  display: flex; align-items: flex-start; gap: 0.6rem;
  padding: 0.6rem 0.75rem; background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07); border-radius: 7px;
}
.adp-rec-card__bullet { width: 8px; height: 8px; border-radius: 50%; background: #C59B34; flex-shrink: 0; margin-top: 0.35rem; }
.adp-rec-card__body   { display: flex; flex-direction: column; gap: 0.3rem; flex: 1; }
.adp-rec-card__text   { font-size: 0.8rem; font-weight: 600; color: #fff; margin: 0; line-height: 1.4; }
.adp-rec-card__meta   { display: flex; flex-wrap: wrap; gap: 0.5rem; font-size: 0.7rem; color: rgba(255,255,255,0.5); }
.adp-rec-card__meta strong { color: rgba(255,255,255,0.8); }
.adp-rec-card__meta em    { color: rgba(197,155,52,0.9); font-style: normal; }

/* Preparation Blueprint summary strip */

.adp-prep-summary {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  border-top: 1px solid rgba(255,255,255,0.08);
  padding-top: 1rem;
}

.adp-prep-summary .brief-label {
  margin: 0;
}

.adp-prep-summary__cells {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.6rem;
}

.adp-prep-summary__cell {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 0.75rem 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.adp-prep-summary__value {
  font-size: 1.5rem;
  font-weight: 800;
  color: #C59B34;
  margin: 0;
  line-height: 1;
}

.adp-prep-summary__value--text {
  font-size: 1rem;
  font-weight: 700;
  color: #C59B34;
}

.adp-prep-summary__label {
  font-size: 0.67rem;
  color: rgba(255,255,255,0.45);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0;
}

/* Readiness Summary (legacy) */

.adp-readiness {
  border-top: 1px solid rgba(255,255,255,0.08);
  padding-top: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.adp-readiness__label {
  font-size: 0.7rem; font-weight: 700; color: rgba(255,255,255,0.5);
  text-transform: uppercase; letter-spacing: 0.07em; text-align: center; margin: 0;
}

.adp-readiness-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }

.adp-readiness-cell {
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px; padding: 1rem 1.25rem;
  display: flex; align-items: center; justify-content: space-between;
}

.adp-readiness-cell__label { font-size: 0.8rem; color: rgba(255,255,255,0.6); margin: 0; font-weight: 500; }
.adp-readiness-cell__value { font-size: 1.65rem; font-weight: 800; color: #C59B34; margin: 0; line-height: 1; }

/* Leadership question footer */

.adp-leadership {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  background: rgba(197,155,52,0.07);
  border: 1px solid rgba(197,155,52,0.22);
  border-radius: 8px;
  padding: 0.85rem 1.1rem;
}

.adp-leadership__icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(197,155,52,0.2);
  color: #C59B34;
  font-size: 0.85rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.adp-leadership__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.8);
  font-style: italic;
  margin: 0;
  line-height: 1.5;
}

@media (max-width: 900px) {
  .adp-body {
    grid-template-columns: 1fr;
  }
  .adp-prep-summary__cells {
    grid-template-columns: 1fr 1fr;
  }
}

/* ── Data Readiness — Data Architecture Enablement ──────────────────────────── */

.dae-view {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.dae-empty {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.4);
  font-style: italic;
  margin: 0;
}

/* ── Upper: Blueprint (left 2fr) | Flow (right 1fr) */

.dae-upper {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 1.25rem;
  align-items: start;
}

/* Architecture Blueprint column */

.dae-blueprint-col {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.dae-layer-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.65rem;
}

/* Layer colour accents: 0=teal, 1=amber, 2=blue, 3=purple */
.dae-layer-card--0 { --layer-accent: #5CC5A7; --layer-accent-bg: rgba(92,197,167,0.09); }
.dae-layer-card--1 { --layer-accent: #C59B34; --layer-accent-bg: rgba(197,155,52,0.09); }
.dae-layer-card--2 { --layer-accent: #60A5FA; --layer-accent-bg: rgba(96,165,250,0.09); }
.dae-layer-card--3 { --layer-accent: #A78BFA; --layer-accent-bg: rgba(167,139,250,0.09); }

.dae-layer-card {
  background: var(--layer-accent-bg, rgba(255,255,255,0.04));
  border: 1px solid rgba(255,255,255,0.08);
  border-top: 3px solid var(--layer-accent, rgba(255,255,255,0.2));
  border-radius: 8px;
  padding: 0.85rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.dae-layer-card__name {
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--layer-accent, #fff);
  margin: 0;
}

.dae-layer-card__field-label {
  font-size: 0.62rem;
  font-weight: 700;
  color: rgba(255,255,255,0.4);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  display: block;
  margin-top: 0.25rem;
}

.dae-layer-card__purpose,
.dae-layer-card__why {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.7);
  margin: 0;
  line-height: 1.4;
}

.dae-layer-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
}

.dae-layer-card__tag {
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 4px;
  padding: 0.15rem 0.45rem;
  font-size: 0.68rem;
  color: rgba(255,255,255,0.75);
  white-space: nowrap;
}

/* Architecture Flow column */

.dae-flow-col {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.dae-flow {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
}

.dae-flow__node {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  padding: 0.7rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.dae-flow__node--0 { border-color: rgba(92,197,167,0.35);  background: rgba(92,197,167,0.07); }
.dae-flow__node--1 { border-color: rgba(197,155,52,0.35);  background: rgba(197,155,52,0.07); }
.dae-flow__node--2 { border-color: rgba(96,165,250,0.35);  background: rgba(96,165,250,0.07); }
.dae-flow__node--3 { border-color: rgba(167,139,250,0.35); background: rgba(167,139,250,0.07); }

.dae-flow__node-name {
  font-size: 0.82rem;
  font-weight: 700;
  color: #fff;
  margin: 0;
}

.dae-flow__node-subs {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.45);
  margin: 0;
}

.dae-flow__arrow {
  text-align: center;
  font-size: 1rem;
  color: rgba(255,255,255,0.25);
  padding: 0.2rem 0;
  line-height: 1;
}

/* ── Middle: Decisions (left 1.3fr) | Tech Stack (right 1fr) */

.dae-middle {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 1.25rem;
  align-items: start;
}

/* Architecture Decisions */

.dae-decisions-col {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.dae-decision-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 0.75rem 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  position: relative;
}

.dae-decision-card__field-label {
  font-size: 0.6rem;
  font-weight: 700;
  color: rgba(255,255,255,0.35);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  display: block;
}

.dae-decision-card__decision {
  font-size: 0.82rem;
  font-weight: 600;
  color: #fff;
  margin: 0 0 0.35rem;
  line-height: 1.35;
}

.dae-decision-card__benefit {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.6);
  margin: 0;
  line-height: 1.4;
}

/* Priority pip — reuse adp pattern */
.dae-pip {
  display: inline-block;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.15rem 0.5rem;
  border-radius: 20px;
  margin-top: 0.35rem;
  align-self: flex-start;
}
.dae-pip--high   { background: rgba(248,113,113,0.12); border: 1px solid rgba(248,113,113,0.3); color: #f87171; }
.dae-pip--medium { background: rgba(251,191,36,0.12);  border: 1px solid rgba(251,191,36,0.3);  color: #fbbf24; }
.dae-pip--low    { background: rgba(92,197,167,0.12);  border: 1px solid rgba(92,197,167,0.3);  color: #5CC5A7; }

/* Legacy: Recommendations grid */
.dae-rec-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.dae-rec-card { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: 7px; padding: 0.65rem 0.8rem; display: flex; flex-direction: column; gap: 0.35rem; }
.dae-rec-card__title { font-size: 0.8rem; font-weight: 600; color: #fff; margin: 0; line-height: 1.3; }
.dae-rec-card__meta { display: flex; flex-direction: column; gap: 0.1rem; }
.dae-rec-meta-row { font-size: 0.7rem; color: rgba(255,255,255,0.5); display: block; }
.dae-rec-meta-row strong { color: rgba(255,255,255,0.8); }
.dae-impact--high { color: #f87171 !important; } .dae-impact--medium { color: #fbbf24 !important; } .dae-impact--low { color: #5CC5A7 !important; }

/* AI Technology table */

.dae-tech-col {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.dae-tech-table {
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  overflow: hidden;
}

.dae-tech-table__row {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 0;
}

.dae-tech-table__row--header {
  background: rgba(197,155,52,0.1);
  border-bottom: 1px solid rgba(255,255,255,0.1);
}

.dae-tech-table__row:not(.dae-tech-table__row--header) {
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.dae-tech-table__row:last-child { border-bottom: none; }

.dae-tech-table__cell {
  padding: 0.5rem 0.75rem;
  font-size: 0.75rem;
}

.dae-tech-table__row--header .dae-tech-table__cell {
  font-size: 0.65rem;
  font-weight: 700;
  color: rgba(255,255,255,0.5);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.dae-tech-table__cell--layer {
  color: rgba(255,255,255,0.55);
  border-right: 1px solid rgba(255,255,255,0.06);
}

.dae-tech-table__cell--rec {
  color: rgba(255,255,255,0.85);
  font-weight: 500;
}

/* ── Implementation Sequence ── */

.dae-impl-section {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.dae-impl-row {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: nowrap;
  overflow-x: auto;
  padding: 0.25rem 0;
}

.dae-impl-step {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  padding: 0.55rem 0.85rem;
  flex-shrink: 0;
  min-width: 130px;
}

.dae-impl-step__num {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(197,155,52,0.18);
  border: 1px solid rgba(197,155,52,0.4);
  color: #C59B34;
  font-size: 0.7rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.dae-impl-step__label {
  font-size: 0.72rem;
  font-weight: 600;
  color: rgba(255,255,255,0.8);
  margin: 0;
  line-height: 1.3;
}

.dae-impl-row__arrow {
  font-size: 0.9rem;
  color: rgba(255,255,255,0.2);
  flex-shrink: 0;
  padding: 0 0.1rem;
}

/* ── Architecture Summary strip ── */

.dae-arch-summary {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  border-top: 1px solid rgba(255,255,255,0.08);
  padding-top: 1rem;
}

.dae-arch-summary .brief-label {
  margin: 0;
}

.dae-arch-summary__cells {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  overflow: hidden;
}

.dae-arch-summary__cell {
  padding: 0.85rem 1rem;
  border-right: 1px solid rgba(255,255,255,0.08);
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.dae-arch-summary__cell:last-child { border-right: none; }

.dae-arch-summary__value {
  font-size: 1.6rem;
  font-weight: 800;
  color: #C59B34;
  margin: 0;
  line-height: 1;
}

.dae-arch-summary__value--text {
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.2;
}

.dae-arch-summary__label {
  font-size: 0.62rem;
  color: rgba(255,255,255,0.4);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0;
}

/* Legacy stats bar */
.dae-stats-bar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.75rem; border-top: 1px solid rgba(255,255,255,0.08); border-bottom: 1px solid rgba(255,255,255,0.08); padding: 1rem 0; }
.dae-stat-cell { text-align: center; display: flex; flex-direction: column; gap: 0.25rem; }
.dae-stat-cell__value { font-size: 1.6rem; font-weight: 800; color: #C59B34; margin: 0; line-height: 1; }
.dae-stat-cell__label { font-size: 0.65rem; color: rgba(255,255,255,0.45); text-transform: uppercase; letter-spacing: 0.05em; margin: 0; }

/* Legacy: connection colours used by sys-card fallback */
.dae-conn--connected    { --dae-conn-color: #5CC5A7; }
.dae-conn--partial      { --dae-conn-color: #C59B34; }
.dae-conn--disconnected { --dae-conn-color: #f87171; }
.dae-sys-card { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-left: 3px solid var(--dae-conn-color, rgba(255,255,255,0.2)); border-radius: 7px; padding: 0.65rem 0.85rem; display: flex; flex-direction: column; gap: 0.2rem; }
.dae-sys-card__name { font-size: 0.82rem; font-weight: 600; color: #fff; margin: 0; }
.dae-sys-card__conn { font-size: 0.7rem; color: var(--dae-conn-color, rgba(255,255,255,0.4)); margin: 0; }

/* Leadership question footer */

.dae-leadership {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  background: rgba(197,155,52,0.06);
  border: 1px solid rgba(197,155,52,0.2);
  border-radius: 8px;
  padding: 0.85rem 1.1rem;
}

.dae-leadership__icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(197,155,52,0.18);
  color: #C59B34;
  font-size: 0.85rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.dae-leadership__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.8);
  font-style: italic;
  margin: 0;
  line-height: 1.5;
}

/* Architecture Decisions table */

.dae-dec-table {
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  overflow: hidden;
}

.dae-dec-table__row {
  display: grid;
  grid-template-columns: 1fr 1.6fr 1.4fr;
}

.dae-dec-table__row--header {
  background: rgba(197,155,52,0.1);
  border-bottom: 1px solid rgba(255,255,255,0.1);
}

.dae-dec-table__row:not(.dae-dec-table__row--header) {
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.dae-dec-table__row:last-child { border-bottom: none; }

.dae-dec-table__cell {
  padding: 0.55rem 0.75rem;
  font-size: 0.75rem;
  border-right: 1px solid rgba(255,255,255,0.06);
}
.dae-dec-table__cell:last-child { border-right: none; }

.dae-dec-table__row--header .dae-dec-table__cell {
  font-size: 0.62rem;
  font-weight: 700;
  color: rgba(255,255,255,0.45);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.dae-dec-table__cell--area {
  color: rgba(255,255,255,0.55);
  font-weight: 600;
}

.dae-dec-table__cell--rec {
  color: rgba(255,255,255,0.9);
  font-weight: 500;
}

.dae-dec-table__cell--why {
  color: rgba(255,255,255,0.5);
  font-style: italic;
}

/* Architecture Pattern */

.dae-pattern-section {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.dae-pattern-row {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  max-width: 320px;
}

.dae-pattern-node {
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 8px;
  padding: 0.55rem 1.1rem;
  width: 100%;
  box-sizing: border-box;
}

.dae-pattern-node--0 { background: rgba(92,197,167,0.09);  border-color: rgba(92,197,167,0.3); }
.dae-pattern-node--1 { background: rgba(197,155,52,0.09);  border-color: rgba(197,155,52,0.3); }
.dae-pattern-node--2 { background: rgba(96,165,250,0.09);  border-color: rgba(96,165,250,0.3); }
.dae-pattern-node--3 { background: rgba(167,139,250,0.09); border-color: rgba(167,139,250,0.3); }
.dae-pattern-node--4 { background: rgba(251,191,36,0.09);  border-color: rgba(251,191,36,0.3); }
.dae-pattern-node--5 { background: rgba(248,113,113,0.09); border-color: rgba(248,113,113,0.3); }

.dae-pattern-node__label {
  font-size: 0.8rem;
  font-weight: 600;
  color: rgba(255,255,255,0.85);
  margin: 0;
}

.dae-pattern-row__arrow {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.2);
  padding: 0.2rem 1.1rem;
  line-height: 1;
}

/* Consultant Guidance block */

.dae-consultant-guidance {
  background: rgba(92,197,167,0.05);
  border: 1px solid rgba(92,197,167,0.2);
  border-left: 3px solid #5CC5A7;
  border-radius: 8px;
  padding: 0.9rem 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.dae-consultant-guidance__header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.dae-consultant-guidance__icon {
  font-size: 0.75rem;
  color: #5CC5A7;
}

.dae-consultant-guidance__title {
  font-size: 0.68rem;
  font-weight: 800;
  color: #5CC5A7;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.dae-consultant-guidance__text {
  font-size: 0.83rem;
  color: rgba(255,255,255,0.75);
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 1000px) {
  .dae-upper  { grid-template-columns: 1fr; }
  .dae-middle { grid-template-columns: 1fr; }
  .dae-layer-grid { grid-template-columns: 1fr; }
  .dae-arch-summary__cells { grid-template-columns: repeat(2, 1fr); }
  .dae-impl-row { overflow-x: auto; }
  .dae-dec-table__row { grid-template-columns: 1fr; }
  .dae-pattern-row { max-width: 100%; }
}

/* ── Technology Infrastructure — AI Compute & Deployment Strategy ────────── */

.cds-view {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  position: relative;
}

/* Deployment readiness badge — top-right */
.cds-readiness-badge {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #C59B34;
  background: rgba(197,155,52,0.1);
  border: 1px solid rgba(197,155,52,0.25);
  border-radius: 20px;
  padding: 0.25rem 0.7rem;
}

.cds-view__position {
  font-size: 0.92rem;
  color: rgba(255,255,255,0.8);
  line-height: 1.6;
  max-width: 860px;
  margin: 0 0 0.25rem;
  padding-right: 14rem; /* don't overlap badge */
}

/* Two-column body */
.cds-body {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 1.25rem;
  align-items: start;
}

/* LEFT: Workload Profile */
.cds-workload-col {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.cds-workload-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 10px;
  padding: 0.75rem 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  transition: border-color 0.2s;
}
.cds-workload-card:hover {
  border-color: rgba(99,102,241,0.35);
}

.cds-workload-card__name {
  font-size: 0.82rem;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  margin: 0 0 0.2rem;
}

.cds-workload-card__spec {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.5);
  margin: 0;
  line-height: 1.4;
}

.cds-workload-card__spec-label {
  color: rgba(255,255,255,0.35);
}

/* Priority badges */
.cds-priority {
  display: inline-block;
  margin-top: 0.4rem;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  padding: 0.2rem 0.5rem;
  border-radius: 4px;
  align-self: flex-start;
}
.cds-priority--critical { background: rgba(239,68,68,0.18);   color: #f87171; border: 1px solid rgba(239,68,68,0.3); }
.cds-priority--high     { background: rgba(234,179,8,0.18);   color: #fbbf24; border: 1px solid rgba(234,179,8,0.3); }
.cds-priority--medium   { background: rgba(99,102,241,0.18);  color: #818cf8; border: 1px solid rgba(99,102,241,0.3); }
.cds-priority--low      { background: rgba(92,197,167,0.15);  color: #5CC5A7; border: 1px solid rgba(92,197,167,0.3); }

/* RIGHT column */
.cds-right-col {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* Canvas section */
.cds-canvas-section {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.cds-canvas-panel {
  background: rgba(99,102,241,0.05);
  border: 1px solid rgba(99,102,241,0.15);
  border-radius: 12px;
  padding: 0.5rem;
}

.cds-canvas-svg {
  width: 100%;
  height: auto;
  display: block;
}

/* Recommendations */
.cds-recs-section {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.cds-recs-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.6rem;
}

.cds-recs-grid > :last-child:nth-child(odd) {
  grid-column: 1 / -1;
}

.cds-rec-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 8px;
  padding: 0.7rem 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  transition: border-color 0.2s;
}
.cds-rec-card:hover {
  border-color: rgba(99,102,241,0.3);
}

.cds-rec-card__text {
  font-size: 0.82rem;
  font-weight: 500;
  color: rgba(255,255,255,0.88);
  margin: 0;
  line-height: 1.4;
}

.cds-rec-card__impact-row {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.4);
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.cds-impact {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 0.1rem 0.45rem;
  border-radius: 4px;
}
.cds-impact--high   { background: rgba(239,68,68,0.15);  color: #f87171; }
.cds-impact--medium { background: rgba(234,179,8,0.15);  color: #fbbf24; }
.cds-impact--low    { background: rgba(92,197,167,0.12); color: #5CC5A7; }

.cds-rec-card__reason {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.4);
  font-style: italic;
  margin: 0;
  line-height: 1.4;
}

/* Deployment scores bar */
.cds-scores-bar {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 10px;
  overflow: hidden;
}

.cds-score-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1rem 0.5rem;
  text-align: center;
  background: rgba(255,255,255,0.02);
}
.cds-score-cell:not(:last-child) {
  border-right: 1px solid rgba(255,255,255,0.07);
}

.cds-score-cell__value {
  font-size: 1.65rem;
  font-weight: 800;
  color: rgba(255,255,255,0.9);
  letter-spacing: -0.01em;
  margin: 0;
  line-height: 1.1;
}

.cds-score-cell__label {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.4);
  margin: 0.3rem 0 0;
  letter-spacing: 0.02em;
}

/* Deployment KPI bar */
.cds-kpi-section {
  border-top: 1px solid rgba(255,255,255,0.07);
  padding-top: 0.85rem;
}

.cds-kpi-section__label {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  margin: 0 0 0.65rem;
  text-align: center;
}

.cds-kpi-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 10px;
  overflow: hidden;
}

.cds-kpi-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0.75rem 1rem;
  background: rgba(255,255,255,0.02);
}
.cds-kpi-item:not(:last-child) {
  border-right: 1px solid rgba(255,255,255,0.07);
}

.cds-kpi-item__label {
  font-size: 0.7rem;
  color: rgba(255,255,255,0.35);
  margin: 0 0 0.25rem;
  letter-spacing: 0.03em;
}

.cds-kpi-item__value {
  font-size: 0.88rem;
  font-weight: 700;
  color: rgba(255,255,255,0.88);
  margin: 0;
}

/* Leadership question footer */
.cds-leadership {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  background: rgba(197,155,52,0.06);
  border: 1px solid rgba(197,155,52,0.2);
  border-radius: 8px;
  padding: 0.85rem 1.1rem;
}

.cds-leadership__icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(197,155,52,0.18);
  color: #C59B34;
  font-size: 0.85rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.cds-leadership__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.8);
  font-style: italic;
  margin: 0;
  line-height: 1.5;
}

.cds-empty {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.3);
  font-style: italic;
  padding: 0.5rem 0;
}

@media (max-width: 900px) {
  .cds-body {
    grid-template-columns: 1fr;
  }
  .cds-recs-grid {
    grid-template-columns: 1fr;
  }
  .cds-scores-bar {
    grid-template-columns: repeat(3, 1fr);
  }
  .cds-kpi-bar {
    grid-template-columns: repeat(2, 1fr);
  }
  .cds-view__position {
    padding-right: 0;
  }
}

/* ── CDS New Format: Recommended Deployment Architecture ──────────────────────── */

.cds-arch-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.75rem;
}

.cds-arch-block {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 10px;
  padding: 0.85rem 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.cds-arch-block__type {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0;
}

.cds-arch-block__field-label {
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  margin: 0.35rem 0 0.1rem;
}

.cds-arch-block__name {
  font-size: 0.85rem;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  margin: 0;
  line-height: 1.35;
}

.cds-arch-block__why {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.45);
  margin: 0;
  line-height: 1.45;
}

/* ── CDS Mid Row: Deployment Flow + Tech Recommendations ───────────────────────── */

.cds-mid-row {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 1.25rem;
  align-items: start;
}

.cds-flow-col {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.cds-flow-chain {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
}

.cds-flow-node {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  padding: 0.5rem 0.85rem;
  font-size: 0.8rem;
  font-weight: 500;
  color: rgba(255,255,255,0.85);
  text-align: center;
}

.cds-flow-node--0 { border-color: rgba(92,197,167,0.4);  color: #5CC5A7; }
.cds-flow-node--1 { border-color: rgba(99,102,241,0.35); color: #818cf8; }
.cds-flow-node--2 { border-color: rgba(234,179,8,0.35);  color: #fbbf24; }
.cds-flow-node--3 { border-color: rgba(239,68,68,0.3);   color: #f87171; }
.cds-flow-node--4 { border-color: rgba(16,185,129,0.35); color: #34d399; }
.cds-flow-node--5 { border-color: rgba(168,85,247,0.35); color: #c084fc; }

.cds-flow-arrow {
  font-size: 0.9rem;
  color: rgba(255,255,255,0.2);
  text-align: center;
  padding: 0.1rem 0;
  line-height: 1;
}

.cds-tech-col {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.cds-tech-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
}

.cds-tech-table th {
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.4);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 0.5rem 0.75rem;
  text-align: left;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.cds-tech-table td {
  padding: 0.5rem 0.75rem;
  color: rgba(255,255,255,0.78);
  border-bottom: 1px solid rgba(255,255,255,0.05);
  vertical-align: top;
  line-height: 1.45;
}

.cds-tech-table td:first-child {
  color: rgba(255,255,255,0.45);
  font-size: 0.73rem;
  white-space: nowrap;
  font-weight: 500;
}

.cds-tech-table td:last-child {
  color: rgba(255,255,255,0.45);
  font-size: 0.73rem;
}

.cds-tech-table tr:last-child td {
  border-bottom: none;
}

/* ── CDS Deployment Decisions ─────────────────────────────────────────────────── */

.cds-dec-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));
  gap: 0.65rem;
}

.cds-dec-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 9px;
  padding: 0.75rem 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  transition: border-color 0.2s;
}

.cds-dec-card:hover {
  border-color: rgba(99,102,241,0.3);
}

.cds-dec-card__type {
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  margin: 0;
}

.cds-dec-card__choice {
  font-size: 0.85rem;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  margin: 0;
  line-height: 1.3;
}

.cds-dec-card__reason {
  font-size: 0.73rem;
  color: rgba(255,255,255,0.45);
  margin: 0;
  line-height: 1.45;
  font-style: italic;
}

/* ── CDS Implementation Sequence ──────────────────────────────────────────────── */

.cds-impl-seq {
  display: flex;
  flex-direction: row;
  gap: 0;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 10px;
  overflow: hidden;
}

.cds-impl-step {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 0.85rem 0.5rem;
  background: rgba(255,255,255,0.02);
  border-right: 1px solid rgba(255,255,255,0.07);
  gap: 0.4rem;
}

.cds-impl-step:last-child {
  border-right: none;
}

.cds-impl-step__num {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(92,197,167,0.15);
  color: #5CC5A7;
  font-size: 0.72rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.cds-impl-step__label {
  font-size: 0.73rem;
  color: rgba(255,255,255,0.75);
  line-height: 1.4;
}

/* ── CDS Expected Infrastructure ──────────────────────────────────────────────── */

.cds-infra-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
}

.cds-infra-table th {
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.4);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 0.5rem 0.75rem;
  text-align: left;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.cds-infra-table td {
  padding: 0.5rem 0.75rem;
  color: rgba(255,255,255,0.78);
  border-bottom: 1px solid rgba(255,255,255,0.05);
  vertical-align: top;
  line-height: 1.45;
}

.cds-infra-table td:first-child {
  color: rgba(255,255,255,0.45);
  font-size: 0.73rem;
  white-space: nowrap;
  font-weight: 500;
  width: 35%;
}

.cds-infra-table tr:last-child td {
  border-bottom: none;
}

/* ── CDS Why this Architecture? ──────────────────────────────────────────────── */

.cds-arch-rationale {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.cds-arch-rationale__item {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  font-size: 0.83rem;
  color: rgba(255,255,255,0.78);
  line-height: 1.5;
}

.cds-arch-rationale__item::before {
  content: '→';
  color: #5CC5A7;
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 0.05rem;
}

/* ── CDS Estimated Investment ─────────────────────────────────────────────────── */

.cds-investment-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
  max-width: 480px;
}

.cds-investment-table th {
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.4);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 0.5rem 0.75rem;
  text-align: left;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.cds-investment-table td {
  padding: 0.45rem 0.75rem;
  color: rgba(255,255,255,0.78);
  border-bottom: 1px solid rgba(255,255,255,0.05);
  vertical-align: middle;
}

.cds-investment-table td:first-child {
  color: rgba(255,255,255,0.5);
  font-size: 0.75rem;
  font-weight: 500;
}

.cds-investment-table tr:last-child td {
  border-bottom: none;
}

.cds-invest-badge {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  padding: 0.2rem 0.55rem;
  border-radius: 4px;
}

.cds-invest--high   { background: rgba(239,68,68,0.15);  color: #f87171; border: 1px solid rgba(239,68,68,0.25); }
.cds-invest--medium { background: rgba(234,179,8,0.15);  color: #fbbf24; border: 1px solid rgba(234,179,8,0.25); }
.cds-invest--low    { background: rgba(92,197,167,0.12); color: #5CC5A7; border: 1px solid rgba(92,197,167,0.25); }

/* ── CDS Consultant Guidance ──────────────────────────────────────────────────── */

.cds-consultant-guidance {
  border-left: 3px solid #5CC5A7;
  background: rgba(92,197,167,0.05);
  border-radius: 0 8px 8px 0;
  padding: 0.85rem 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.cds-consultant-guidance__title {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #5CC5A7;
  margin: 0;
}

.cds-consultant-guidance__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.78);
  line-height: 1.6;
  margin: 0;
}

/* ── CDS AI Recommendation ────────────────────────────────────────────────────── */

.cds-ai-recommendation {
  border-left: 3px solid #C59B34;
  background: rgba(197,155,52,0.05);
  border-radius: 0 8px 8px 0;
  padding: 0.85rem 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.cds-ai-recommendation__title {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #C59B34;
  margin: 0;
}

.cds-ai-recommendation__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.78);
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 900px) {
  .cds-arch-grid { grid-template-columns: repeat(2, 1fr); }
  .cds-mid-row   { grid-template-columns: 1fr; }
  .cds-impl-seq  { flex-wrap: wrap; }
  .cds-impl-step { flex: 0 0 calc(33% - 1px); }
}

/* ── Technology Infrastructure — AI Platform Readiness (New Format) ──────────── */

.apr-main-body {
  display: grid;
  grid-template-columns: 65% 35%;
  gap: 1.25rem;
  align-items: start;
}

/* LEFT: capability cards list */
.apr-cap-list-col { display: flex; flex-direction: column; gap: 0; }

.apr-cap-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.apr-cap2-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  padding: 0.9rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.apr-cap2-card__name {
  font-size: 0.85rem;
  font-weight: 700;
  color: #5CC5A7;
  margin: 0 0 0.25rem;
}

.apr-cap2-card__field-label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
  margin: 0.3rem 0 0.1rem;
}

.apr-cap2-card__purpose,
.apr-cap2-card__value {
  font-size: 0.83rem;
  color: rgba(255,255,255,0.78);
  line-height: 1.5;
  margin: 0;
}

.apr-cap2-card__caps {
  margin: 0;
  padding-left: 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.apr-cap2-card__caps li {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.65);
  line-height: 1.4;
}

/* RIGHT: AI Platform Blueprint chain */
.apr-blueprint-col { display: flex; flex-direction: column; gap: 0; }

.apr-blueprint-chain {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.apr-blueprint-node {
  padding: 0.7rem 0.9rem;
  background: rgba(255,255,255,0.04);
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  margin-bottom: 0;
}

.apr-blueprint-node__layer {
  font-size: 0.78rem;
  font-weight: 700;
  color: rgba(255,255,255,0.9);
  margin: 0;
}

.apr-blueprint-node__rec {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.6);
  line-height: 1.45;
  margin: 0;
}

.apr-blueprint-arrow {
  text-align: center;
  color: rgba(255,255,255,0.25);
  font-size: 0.85rem;
  line-height: 1.2;
  padding: 0.05rem 0;
}

/* Recommendations grid */
.apr-recs2-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 0.85rem;
}

.apr-rec2-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  padding: 0.9rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.apr-rec2-card__title {
  font-size: 0.85rem;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  margin: 0;
  line-height: 1.4;
}

.apr-rec2-card__field-label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
  margin: 0.2rem 0 0.1rem;
}

.apr-rec2-card__why {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.65);
  line-height: 1.5;
  margin: 0;
  flex: 1;
}

.apr-rec2-card__footer {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.4rem;
  flex-wrap: wrap;
}

.apr-rec2-priority {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  border: 1px solid;
  border-radius: 4px;
  padding: 0.1rem 0.45rem;
}

.apr-rec2-phase {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.55);
  background: rgba(255,255,255,0.06);
  border-radius: 4px;
  padding: 0.1rem 0.5rem;
}

/* Implementation sequence (shared style with CDS) */
.apr-impl-seq {
  display: flex;
  align-items: flex-start;
  gap: 0;
  overflow-x: auto;
}

.apr-impl-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  flex: 1;
  position: relative;
  padding: 0.6rem 0.5rem;
  text-align: center;
}

.apr-impl-step + .apr-impl-step::before {
  content: '';
  position: absolute;
  left: 0;
  top: 1.1rem;
  width: 1px;
  height: 1.4rem;
  background: rgba(255,255,255,0.15);
}

.apr-impl-step__num {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: rgba(92,197,167,0.15);
  border: 1px solid rgba(92,197,167,0.4);
  color: #5CC5A7;
  font-size: 0.72rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.apr-impl-step__label {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.72);
  line-height: 1.35;
}

/* AI Stack table */
.apr-stack2-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.83rem;
}

.apr-stack2-table th {
  text-align: left;
  padding: 0.45rem 0.75rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.45);
  border-bottom: 1px solid rgba(255,255,255,0.1);
}

.apr-stack2-table td {
  padding: 0.55rem 0.75rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.75);
  vertical-align: top;
}

.apr-stack2-table td:first-child {
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  white-space: nowrap;
  width: 30%;
}

/* Consultant Guidance */
.apr-consultant-guidance {
  border-left: 3px solid #5CC5A7;
  background: rgba(92,197,167,0.05);
  border-radius: 0 8px 8px 0;
  padding: 0.85rem 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.apr-consultant-guidance__title {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #5CC5A7;
  margin: 0;
}

.apr-consultant-guidance__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.78);
  line-height: 1.6;
  margin: 0;
}

/* AI Recommendation */
.apr-ai-recommendation {
  border-left: 3px solid #C59B34;
  background: rgba(197,155,52,0.05);
  border-radius: 0 8px 8px 0;
  padding: 0.85rem 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.apr-ai-recommendation__title {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #C59B34;
  margin: 0;
}

.apr-ai-recommendation__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.78);
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 900px) {
  .apr-main-body { grid-template-columns: 1fr; }
  .apr-recs2-grid { grid-template-columns: 1fr; }
  .apr-impl-seq   { flex-wrap: wrap; }
  .apr-impl-step  { flex: 0 0 calc(33% - 1px); }
}

/* ── Technology Infrastructure — System Integration & Architecture ───────────── */

.sia-view {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  position: relative;
}

/* Integration readiness badge — top-right */
.sia-readiness-badge {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #C59B34;
  background: rgba(197,155,52,0.1);
  border: 1px solid rgba(197,155,52,0.25);
  border-radius: 20px;
  padding: 0.25rem 0.7rem;
}

.sia-view__position {
  font-size: 0.92rem;
  color: rgba(255,255,255,0.8);
  line-height: 1.6;
  max-width: 860px;
  margin: 0 0 0.25rem;
  padding-right: 16rem;
}

/* Two-column body */
.sia-body {
  display: grid;
  grid-template-columns: 380px 1fr;
  gap: 1.5rem;
  align-items: start;
}

/* LEFT: Connected Systems */
.sia-systems-col {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.sia-sys-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.6rem;
}

.sia-sys-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-left: 3px solid;
  border-radius: 8px;
  padding: 0.75rem 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  transition: border-color 0.2s;
}
.sia-sys-card--connected { border-left-color: #5CC5A7; }
.sia-sys-card--partial   { border-left-color: #fbbf24; }
.sia-sys-card--missing   { border-left-color: #f87171; }

.sia-sys-card__name {
  font-size: 0.82rem;
  font-weight: 600;
  color: rgba(255,255,255,0.88);
  margin: 0;
  line-height: 1.3;
}

.sia-sys-card__method {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.4);
  margin: 0.1rem 0 0.2rem;
}

/* Shared status badges */
.sia-status {
  display: inline-block;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 0.18rem 0.5rem;
  border-radius: 4px;
  align-self: flex-start;
}
.sia-status--connected { background: rgba(92,197,167,0.15);  color: #5CC5A7; border: 1px solid rgba(92,197,167,0.3); }
.sia-status--partial   { background: rgba(234,179,8,0.15);   color: #fbbf24; border: 1px solid rgba(234,179,8,0.3); }
.sia-status--missing   { background: rgba(239,68,68,0.15);   color: #f87171; border: 1px solid rgba(239,68,68,0.3); }

/* RIGHT: AI Integration Architecture */
.sia-arch-col {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.sia-arch-panel {
  background: rgba(99,102,241,0.04);
  border: 1px solid rgba(99,102,241,0.15);
  border-radius: 12px;
  padding: 0.5rem;
}

.sia-arch-svg {
  width: 100%;
  height: auto;
  display: block;
}

/* Bottom 2×2 summary grid */
.sia-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 10px;
  overflow: hidden;
}

.sia-summary-cell {
  padding: 0.85rem 1.1rem;
  background: rgba(255,255,255,0.02);
}
.sia-summary-cell:nth-child(1),
.sia-summary-cell:nth-child(2) {
  border-bottom: 1px solid rgba(255,255,255,0.07);
}
.sia-summary-cell:nth-child(odd) {
  border-right: 1px solid rgba(255,255,255,0.07);
}

.sia-summary-cell__label {
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255,255,255,0.55);
  margin: 0 0 0.2rem;
}

.sia-summary-cell__value {
  font-size: 0.82rem;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  margin: 0;
}

/* Leadership question footer */
.sia-leadership {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  background: rgba(197,155,52,0.06);
  border: 1px solid rgba(197,155,52,0.2);
  border-radius: 8px;
  padding: 0.85rem 1.1rem;
}

.sia-leadership__icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(197,155,52,0.18);
  color: #C59B34;
  font-size: 0.85rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.sia-leadership__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.8);
  font-style: italic;
  margin: 0;
  line-height: 1.5;
}

.sia-empty {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.3);
  font-style: italic;
  padding: 0.5rem 0;
}

@media (max-width: 1024px) {
  .sia-body {
    grid-template-columns: 300px 1fr;
  }
}

@media (max-width: 900px) {
  .sia-body {
    grid-template-columns: 1fr;
  }
  .sia-view__position {
    padding-right: 0;
  }
}

/* ── SIA new-format layout ───────────────────────────────────────────────────── */

.sia-main-body {
  display: grid;
  grid-template-columns: 65% 35%;
  gap: 1.5rem;
  align-items: start;
}

/* LEFT: Engineering Integration Blueprint */
.sia-blueprint-col {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.sia-blueprint-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 0.75rem;
}

.sia-system-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 0.85rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.sia-system-card__name {
  font-size: 0.85rem;
  font-weight: 700;
  color: #5CC5A7;
  margin: 0 0 0.35rem;
  line-height: 1.3;
}

.sia-system-card__field-label {
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.38);
  margin: 0.3rem 0 0;
}

.sia-system-card__value {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.78);
  margin: 0;
  line-height: 1.5;
}

/* RIGHT: AI Workflow Integration */
.sia-right-col {
  display: flex;
  flex-direction: column;
}

.sia-workflow-chain {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
}

.sia-workflow-node {
  background: rgba(92,197,167,0.08);
  border: 1px solid rgba(92,197,167,0.25);
  border-radius: 6px;
  padding: 0.5rem 1rem;
  font-size: 0.8rem;
  color: rgba(255,255,255,0.85);
  width: 100%;
}

.sia-workflow-arrow {
  font-size: 0.85rem;
  color: rgba(92,197,167,0.5);
  padding: 0.1rem 1rem;
}

/* Integration Priorities */
.sia-priorities {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.sia-priority-item {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 7px;
  padding: 0.65rem 0.85rem;
}

.sia-priority-item__header {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: 0.3rem;
}

.sia-priority-item__num {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: rgba(92,197,167,0.15);
  color: #5CC5A7;
  font-size: 0.72rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.sia-priority-item__name {
  font-size: 0.82rem;
  font-weight: 600;
  color: rgba(255,255,255,0.88);
  flex: 1;
}

.sia-priority-badge {
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  padding: 0.15rem 0.45rem;
  border: 1px solid;
  border-radius: 4px;
}

.sia-priority-item__benefit {
  font-size: 0.77rem;
  color: rgba(255,255,255,0.55);
  margin: 0;
  line-height: 1.5;
}

/* Integration Architecture Blueprint */
.sia-arch-chain {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.sia-arch-layer {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 8px;
  padding: 0.85rem 1.1rem;
}

.sia-arch-layer__name {
  font-size: 0.82rem;
  font-weight: 700;
  margin: 0 0 0.5rem;
}

.sia-arch-techs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.sia-tech-pill {
  font-size: 0.72rem;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 20px;
  padding: 0.2rem 0.65rem;
  color: rgba(255,255,255,0.72);
}

.sia-arch-arrow {
  font-size: 1rem;
  color: rgba(255,255,255,0.2);
  text-align: center;
  padding: 0.25rem 0;
}

/* Integration Principles */
.sia-principles {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 0.6rem;
}

.sia-principle-item {
  background: rgba(92,197,167,0.05);
  border: 1px solid rgba(92,197,167,0.15);
  border-left: 3px solid rgba(92,197,167,0.5);
  border-radius: 0 6px 6px 0;
  padding: 0.6rem 0.9rem;
  font-size: 0.82rem;
  color: rgba(255,255,255,0.75);
  line-height: 1.5;
}

/* Implementation Sequence */
.sia-impl-seq {
  display: flex;
  align-items: flex-start;
  gap: 0;
}

.sia-impl-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  flex: 1;
  position: relative;
  padding: 0 0.5rem;
}

.sia-impl-step:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 13px;
  right: -1px;
  width: 50%;
  height: 1px;
  background: rgba(92,197,167,0.3);
}

.sia-impl-step:not(:first-child)::before {
  content: '';
  position: absolute;
  top: 13px;
  left: -1px;
  width: 50%;
  height: 1px;
  background: rgba(92,197,167,0.3);
}

.sia-impl-step__num {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: rgba(92,197,167,0.15);
  border: 1px solid rgba(92,197,167,0.4);
  color: #5CC5A7;
  font-size: 0.75rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.5rem;
  position: relative;
  z-index: 1;
}

.sia-impl-step__label {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.65);
  line-height: 1.4;
}

/* Consultant Guidance */
.sia-consultant-guidance {
  border-left: 3px solid #5CC5A7;
  background: rgba(92,197,167,0.05);
  border-radius: 0 8px 8px 0;
  padding: 0.85rem 1.1rem;
}

.sia-consultant-guidance__title {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #5CC5A7;
  margin: 0 0 0.4rem;
}

.sia-consultant-guidance__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.78);
  line-height: 1.6;
  margin: 0;
}

/* AI Recommendation */
.sia-ai-recommendation {
  border-left: 3px solid #C59B34;
  background: rgba(197,155,52,0.05);
  border-radius: 0 8px 8px 0;
  padding: 0.85rem 1.1rem;
}

.sia-ai-recommendation__title {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #C59B34;
  margin: 0 0 0.4rem;
}

.sia-ai-recommendation__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.78);
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 1024px) {
  .sia-main-body { grid-template-columns: 60% 40%; }
}

@media (max-width: 900px) {
  .sia-main-body        { grid-template-columns: 1fr; }
  .sia-impl-seq         { flex-wrap: wrap; }
  .sia-impl-step        { flex: 0 0 calc(33% - 1rem); }
  .sia-blueprint-grid   { grid-template-columns: 1fr; }
}

/* ── Technology Infrastructure — AI Platform Readiness ──────────────────────── */

.apr-view {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  position: relative;
}

/* Platform readiness badge — top-right */
.apr-readiness-badge {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #C59B34;
  background: rgba(197,155,52,0.1);
  border: 1px solid rgba(197,155,52,0.25);
  border-radius: 20px;
  padding: 0.25rem 0.7rem;
}

.apr-view__position {
  font-size: 0.92rem;
  color: rgba(255,255,255,0.8);
  line-height: 1.6;
  max-width: 860px;
  margin: 0 0 0.25rem;
  padding-right: 14rem;
}

/* Three-column body */
.apr-body {
  display: grid;
  grid-template-columns: 240px 1fr 220px;
  gap: 1.25rem;
  align-items: start;
}

/* LEFT: Capability Assessment cards */
.apr-capability-col {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.apr-cap-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-left: 3px solid;
  border-radius: 8px;
  padding: 0.75rem 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.apr-cap-card--ready   { border-left-color: #5CC5A7; }
.apr-cap-card--partial { border-left-color: #fbbf24; }
.apr-cap-card--missing { border-left-color: #f87171; }

.apr-cap-card__name {
  font-size: 0.8rem;
  font-weight: 600;
  color: rgba(255,255,255,0.85);
  margin: 0;
  line-height: 1.3;
}

.apr-cap-card__score {
  font-size: 1.2rem;
  font-weight: 800;
  color: rgba(255,255,255,0.9);
  margin: 0.15rem 0 0.3rem;
  letter-spacing: -0.01em;
}

/* Shared status badges */
.apr-status {
  display: inline-block;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 0.18rem 0.5rem;
  border-radius: 4px;
  align-self: flex-start;
}
.apr-status--ready   { background: rgba(92,197,167,0.15);  color: #5CC5A7; border: 1px solid rgba(92,197,167,0.3); }
.apr-status--partial { background: rgba(234,179,8,0.15);   color: #fbbf24; border: 1px solid rgba(234,179,8,0.3); }
.apr-status--missing { background: rgba(239,68,68,0.15);   color: #f87171; border: 1px solid rgba(239,68,68,0.3); }

/* CENTER: AI Platform Stack */
.apr-stack-col {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.apr-stack-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 10px;
  overflow: hidden;
}

.apr-stack-row {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.65rem 0.9rem;
  background: rgba(255,255,255,0.02);
  border-bottom: 1px solid rgba(255,255,255,0.05);
  border-left: 3px solid transparent;
  transition: background 0.2s;
}
.apr-stack-row:last-child { border-bottom: none; }
.apr-stack-row:hover      { background: rgba(255,255,255,0.04); }
.apr-stack-row--ready     { border-left-color: #5CC5A7; }
.apr-stack-row--partial   { border-left-color: #fbbf24; }
.apr-stack-row--missing   { border-left-color: #f87171; }

.apr-stack-row__icon {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  color: rgba(255,255,255,0.45);
  background: rgba(255,255,255,0.05);
  border-radius: 8px;
  flex-shrink: 0;
}

.apr-stack-row__info {
  flex: 1;
  min-width: 0;
}

.apr-stack-row__name {
  font-size: 0.8rem;
  font-weight: 500;
  color: rgba(255,255,255,0.85);
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.apr-stack-row__score {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.4);
  margin: 0.1rem 0 0;
}

/* RIGHT: Recommendations */
.apr-recs-col {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.apr-recs-list {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.apr-rec-item {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 8px;
  padding: 0.7rem 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  border-left: 3px solid rgba(197,155,52,0.4);
  transition: border-color 0.2s;
}
.apr-rec-item:hover {
  border-left-color: rgba(197,155,52,0.7);
}

.apr-rec-item__text {
  font-size: 0.8rem;
  font-weight: 500;
  color: rgba(255,255,255,0.88);
  margin: 0;
  line-height: 1.4;
}

.apr-rec-item__meta {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.4);
  margin: 0;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.apr-priority {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 0.1rem 0.4rem;
  border-radius: 4px;
}
.apr-priority--high   { background: rgba(239,68,68,0.15);  color: #f87171; }
.apr-priority--medium { background: rgba(234,179,8,0.15);  color: #fbbf24; }
.apr-priority--low    { background: rgba(92,197,167,0.12); color: #5CC5A7; }

.apr-rec-item__benefit {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.35);
  font-style: italic;
  margin: 0;
  line-height: 1.4;
}

/* Bottom 2×2 summary grid */
.apr-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 10px;
  overflow: hidden;
}

.apr-summary-cell {
  padding: 0.85rem 1.1rem;
  background: rgba(255,255,255,0.02);
}
.apr-summary-cell:nth-child(1),
.apr-summary-cell:nth-child(2) {
  border-bottom: 1px solid rgba(255,255,255,0.07);
}
.apr-summary-cell:nth-child(odd) {
  border-right: 1px solid rgba(255,255,255,0.07);
}

.apr-summary-cell__label {
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255,255,255,0.55);
  margin: 0 0 0.25rem;
}

.apr-summary-cell__value {
  font-size: 0.82rem;
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  margin: 0;
}

/* Leadership question footer */
.apr-leadership {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  background: rgba(197,155,52,0.06);
  border: 1px solid rgba(197,155,52,0.2);
  border-radius: 8px;
  padding: 0.85rem 1.1rem;
}

.apr-leadership__icon {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(197,155,52,0.18);
  color: #C59B34;
  font-size: 0.85rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.apr-leadership__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.8);
  font-style: italic;
  margin: 0;
  line-height: 1.5;
}

.apr-empty {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.3);
  font-style: italic;
  padding: 0.5rem 0;
}

@media (max-width: 1024px) {
  .apr-body {
    grid-template-columns: 200px 1fr 200px;
  }
}

@media (max-width: 900px) {
  .apr-body {
    grid-template-columns: 1fr;
  }
  .apr-summary-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .apr-view__position {
    padding-right: 0;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════════
   SKILLS & WORKFORCE — AI SKILLS ASSESSMENT  (asa-*)
   ═══════════════════════════════════════════════════════════════════════════════ */

.asa-view {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.asa-readiness-badge {
  position: absolute;
  top: 0;
  right: 0;
  background: rgba(251,191,36,0.15);
  border: 1px solid rgba(251,191,36,0.4);
  color: #fbbf24;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  padding: 0.3rem 0.75rem;
  border-radius: 2rem;
}

.asa-view__position {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.55);
  margin: 0;
  padding-right: 12rem;
  line-height: 1.5;
}

.asa-body {
  display: grid;
  grid-template-columns: 220px 1fr 220px;
  gap: 1.25rem;
  align-items: start;
}

/* LEFT: Skill cards */
.asa-skills-col {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.asa-skill-card {
  background: rgba(255,255,255,0.025);
  border-left: 3px solid transparent;
  border-radius: 0.5rem;
  padding: 0.6rem 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.asa-skill-card--available { border-left-color: #5CC5A7; }
.asa-skill-card--partial   { border-left-color: #fbbf24; }
.asa-skill-card--missing   { border-left-color: #f87171; }

.asa-skill-card__name {
  font-size: 0.8rem;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  margin: 0;
}

.asa-skill-card__meta {
  font-size: 0.7rem;
  color: rgba(255,255,255,0.45);
  margin: 0;
}

/* CENTER: Skills Matrix */
.asa-matrix-col {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.asa-matrix-wrap {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.75rem;
  padding: 1rem;
}

.asa-matrix-row {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.asa-matrix-row__cat {
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255,255,255,0.75);
  margin: 0;
}

.asa-matrix-bar-track {
  height: 6px;
  background: rgba(255,255,255,0.1);
  border-radius: 3px;
  overflow: hidden;
}

.asa-matrix-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #5CC5A7, #3ba88e);
  border-radius: 3px;
  transition: width 0.4s ease;
}

.asa-matrix-row__counts {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.35);
  margin: 0;
}

/* RIGHT: Recs + Stats */
.asa-recs-col {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.asa-recs-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.asa-rec-item {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.5rem;
  padding: 0.6rem 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.asa-rec-item__title {
  font-size: 0.8rem;
  font-weight: 600;
  color: rgba(255,255,255,0.88);
  margin: 0;
}

.asa-rec-item__meta {
  font-size: 0.7rem;
  color: rgba(255,255,255,0.4);
  margin: 0;
}

.asa-rec-item__benefit {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.5);
  margin: 0;
  font-style: italic;
}

.asa-stats-block {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 0.5rem;
  padding: 0.6rem 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.asa-stat-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.asa-stat-row__label {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.4);
}

.asa-stat-row__value {
  font-size: 0.78rem;
  font-weight: 700;
  color: rgba(255,255,255,0.85);
}

/* Priority badges */
.asa-priority {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 0.15rem 0.45rem;
  border-radius: 0.25rem;
}

.asa-priority--high   { background: rgba(248,113,113,0.18); color: #f87171; }
.asa-priority--medium { background: rgba(251,191,36,0.15);  color: #fbbf24; }
.asa-priority--low    { background: rgba(92,197,167,0.15);  color: #5CC5A7; }

/* Bottom: Category Summary grid */
.asa-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 0.75rem;
  overflow: hidden;
}

.asa-summary-cell {
  padding: 0.9rem 1rem;
  border-right: 1px solid rgba(255,255,255,0.07);
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.asa-summary-cell:last-child { border-right: none; }

.asa-summary-cell__label {
  font-size: 0.7rem;
  color: rgba(255,255,255,0.4);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0;
}

.asa-summary-cell__value {
  font-size: 0.85rem;
  font-weight: 600;
  margin: 0;
}

.asa-cat--ready   .asa-summary-cell__value { color: #5CC5A7; }
.asa-cat--strong  .asa-summary-cell__value { color: #34d399; }
.asa-cat--partial .asa-summary-cell__value { color: #fbbf24; }
.asa-cat--needs   .asa-summary-cell__value { color: #f87171; }

/* Leadership footer */
.asa-leadership {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.5rem;
  padding: 0.85rem 1rem;
}

.asa-leadership__icon {
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  background: rgba(251,191,36,0.15);
  color: #fbbf24;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
  font-weight: 700;
}

.asa-leadership__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.8);
  font-style: italic;
  margin: 0;
  line-height: 1.5;
}

.asa-empty {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.3);
  font-style: italic;
  padding: 0.5rem 0;
}

@media (max-width: 1024px) {
  .asa-body {
    grid-template-columns: 200px 1fr 200px;
  }
}

@media (max-width: 900px) {
  .asa-body { grid-template-columns: 1fr; }
  .asa-summary-grid { grid-template-columns: repeat(2, 1fr); }
  .asa-summary-cell:nth-child(1),
  .asa-summary-cell:nth-child(2) { border-bottom: 1px solid rgba(255,255,255,0.07); }
  .asa-summary-cell:nth-child(odd) { border-right: 1px solid rgba(255,255,255,0.07); }
  .asa-view__position { padding-right: 0; }
}

/* ═══════════════════════════════════════════════════════════════════════════════
   SKILLS & WORKFORCE — AI ROLES & CAPABILITY PLANNING  (arcp-*)
   ═══════════════════════════════════════════════════════════════════════════════ */

.arcp-view {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.arcp-view__position {
  font-size: 0.82rem;
  color: rgba(255,255,255,0.72);
  line-height: 1.55;
  padding-right: 1.5rem;
}

/* 3-column body: 45% | 25% | 30% */
.arcp-body {
  display: grid;
  grid-template-columns: 45fr 25fr 30fr;
  gap: 1.25rem;
  align-items: start;
}

/* ── Left: Role Cards ────────────────────────────────────────────────────── */

.arcp-roles-col {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.arcp-role-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-left: 3px solid #5CC5A7;
  border-radius: 0.45rem;
  padding: 0.65rem 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.arcp-role-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.arcp-role-card__name {
  font-size: 0.82rem;
  font-weight: 600;
  color: #5CC5A7;
  margin: 0;
  line-height: 1.3;
}

.arcp-pri-badge {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 0.15rem 0.45rem;
  border-radius: 0.25rem;
  white-space: nowrap;
  flex-shrink: 0;
}
.arcp-pri--high   { background: rgba(248,113,113,0.15); color: #f87171; border: 1px solid rgba(248,113,113,0.3); }
.arcp-pri--medium { background: rgba(251,191,36,0.12);  color: #fbbf24; border: 1px solid rgba(251,191,36,0.3); }
.arcp-pri--low    { background: rgba(92,197,167,0.12);  color: #5CC5A7; border: 1px solid rgba(92,197,167,0.3); }

.arcp-role-card__field-label {
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  margin: 0.2rem 0 0.1rem;
}

.arcp-role-card__field-value {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.72);
  margin: 0;
  line-height: 1.4;
}

.arcp-role-card__caps {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-top: 0.1rem;
}

.arcp-cap-pill {
  font-size: 0.62rem;
  color: rgba(255,255,255,0.6);
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 0.25rem;
  padding: 0.1rem 0.4rem;
}

/* ── Center: Responsibility Journey ─────────────────────────────────────── */

.arcp-journey-col {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.arcp-journey-chain {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}

.arcp-journey-node {
  width: 100%;
  background: rgba(92,197,167,0.07);
  border: 1px solid rgba(92,197,167,0.25);
  border-radius: 0.4rem;
  padding: 0.4rem 0.6rem;
  font-size: 0.72rem;
  font-weight: 500;
  color: rgba(255,255,255,0.8);
  text-align: center;
  line-height: 1.3;
}

.arcp-journey-arrow {
  font-size: 0.75rem;
  color: rgba(92,197,167,0.5);
  line-height: 1.4;
  text-align: center;
  padding: 0.1rem 0;
}

/* ── Right: Capability Development Priorities ────────────────────────────── */

.arcp-priorities-col {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.arcp-pri-list {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.arcp-pri-item {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.4rem;
  padding: 0.55rem 0.65rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.arcp-pri-item__header {
  display: flex;
  align-items: baseline;
  gap: 0.4rem;
  flex-wrap: wrap;
}

.arcp-pri-item__num {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #5CC5A7;
  white-space: nowrap;
}

.arcp-pri-item__row {
  display: flex;
  flex-direction: column;
  gap: 0.08rem;
  margin-top: 0.25rem;
}

.arcp-pri-item__field-label {
  font-size: 0.57rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
}

.arcp-pri-item__role {
  font-size: 0.75rem;
  font-weight: 600;
  color: rgba(255,255,255,0.85);
}

.arcp-pri-item__capability {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.65);
  margin: 0;
  line-height: 1.35;
}

.arcp-pri-item__outcome {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.5);
  margin: 0;
  line-height: 1.4;
}

/* ── Stats strip ─────────────────────────────────────────────────────────── */

.arcp-stats-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.5rem;
  overflow: hidden;
}

.arcp-stat-cell {
  padding: 0.7rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.15rem;
  border-right: 1px solid rgba(255,255,255,0.07);
}
.arcp-stat-cell:last-child { border-right: none; }

.arcp-stat-cell__value {
  font-size: 1.15rem;
  font-weight: 700;
  color: #5CC5A7;
  margin: 0;
}

.arcp-stat-cell__label {
  font-size: 0.62rem;
  color: rgba(255,255,255,0.4);
  text-align: center;
  margin: 0;
  line-height: 1.3;
}

/* ── Consultant Guidance (teal) ──────────────────────────────────────────── */

.arcp-consultant-guidance {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  background: rgba(92,197,167,0.06);
  border: 1px solid rgba(92,197,167,0.2);
  border-left: 3px solid #5CC5A7;
  border-radius: 0.5rem;
  padding: 0.85rem 1rem;
}

.arcp-guidance__icon {
  font-size: 0.85rem;
  color: #5CC5A7;
  flex-shrink: 0;
  margin-top: 0.1rem;
}

.arcp-guidance__text {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.72);
  line-height: 1.6;
  margin: 0;
}

/* ── AI Recommendation (amber) ───────────────────────────────────────────── */

.arcp-ai-recommendation {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  background: rgba(251,191,36,0.05);
  border: 1px solid rgba(251,191,36,0.18);
  border-left: 3px solid #fbbf24;
  border-radius: 0.5rem;
  padding: 0.85rem 1rem;
}

.arcp-rec__icon {
  font-size: 0.85rem;
  color: #fbbf24;
  flex-shrink: 0;
  margin-top: 0.1rem;
}

.arcp-rec__text {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.72);
  line-height: 1.6;
  margin: 0;
}

/* ── Next Capability footer ──────────────────────────────────────────────── */

.arcp-next-capability {
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.5rem;
  padding: 0.75rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.arcp-next__label {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  margin: 0;
}

.arcp-next__name {
  font-size: 0.82rem;
  font-weight: 600;
  color: #5CC5A7;
  margin: 0;
}

.arcp-next__goal {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.45);
  margin: 0;
  line-height: 1.4;
}

/* ── Responsive ──────────────────────────────────────────────────────────── */

@media (max-width: 1024px) {
  .arcp-body { grid-template-columns: 45fr 25fr 30fr; }
  .arcp-stats-strip { grid-template-columns: repeat(2, 1fr); }
  .arcp-stat-cell:nth-child(2) { border-right: none; }
  .arcp-stat-cell:nth-child(1),
  .arcp-stat-cell:nth-child(2) { border-bottom: 1px solid rgba(255,255,255,0.07); }
}

@media (max-width: 900px) {
  .arcp-body { grid-template-columns: 1fr; }
  .arcp-stats-strip { grid-template-columns: repeat(2, 1fr); }
}

/* ═══════════════════════════════════════════════════════════════════════════════
   SKILLS & WORKFORCE — AI LEARNING & ADOPTION  (ala-*)
   ═══════════════════════════════════════════════════════════════════════════════ */

.ala-view {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.ala-readiness-badge {
  position: absolute;
  top: 0;
  right: 0;
  background: rgba(139,92,246,0.18);
  border: 1px solid rgba(139,92,246,0.45);
  color: #a78bfa;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  padding: 0.3rem 0.75rem;
  border-radius: 2rem;
}

.ala-view__position {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.55);
  margin: 0;
  padding-right: 12rem;
  line-height: 1.5;
}

.ala-body {
  display: grid;
  grid-template-columns: 220px 1fr 220px;
  gap: 1.25rem;
  align-items: start;
}

/* LEFT: Learning Pillars */
.ala-pillars-col {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.ala-pillar-card {
  background: rgba(255,255,255,0.025);
  border-left: 3px solid transparent;
  border-radius: 0.5rem;
  padding: 0.6rem 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.ala-pillar--ready       { border-left-color: #5CC5A7; }
.ala-pillar--progress    { border-left-color: #fbbf24; }
.ala-pillar--notstarted  { border-left-color: rgba(255,255,255,0.2); }

.ala-pillar-card__name {
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  margin: 0;
}

.ala-pillar-card__desc {
  font-size: 0.7rem;
  color: rgba(255,255,255,0.45);
  margin: 0;
}

.ala-pillar-card__status {
  font-size: 0.65rem;
  font-weight: 700;
  margin-top: 0.1rem;
  color: rgba(255,255,255,0.35);
  letter-spacing: 0.04em;
}

.ala-pillar--ready .ala-pillar-card__status    { color: #5CC5A7; }
.ala-pillar--progress .ala-pillar-card__status { color: #fbbf24; }

/* CENTER: Adoption Lifecycle */
.ala-lifecycle-col {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 0; /* allow grid cell to shrink so overflow-x on wrap triggers */
}

.ala-lifecycle-wrap {
  min-width: 0;
}

.ala-lifecycle {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.5rem;
  min-width: 0;
}

.ala-lifecycle__arrow {
  display: none;
}

.ala-lifecycle__stage {
  flex: 1 1 calc(33% - 0.5rem);
  min-width: 140px;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.5rem;
  padding: 0.65rem 0.6rem;
}

.ala-lifecycle__arrow {
  flex-shrink: 0;
  width: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,0.2);
  font-size: 1.1rem;
  padding-top: 0.6rem;
}

.ala-lifecycle__stage-header {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.ala-lifecycle__num {
  flex-shrink: 0;
  width: 1.2rem;
  height: 1.2rem;
  background: rgba(167,139,250,0.2);
  color: #a78bfa;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.65rem;
  font-weight: 700;
}

.ala-lifecycle__stage-name {
  font-size: 0.72rem;
  font-weight: 700;
  color: rgba(255,255,255,0.85);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ala-lifecycle__stage-status {
  font-size: 0.68rem;
  color: rgba(255,255,255,0.4);
  margin: 0;
}

.ala-lifecycle__bar-wrap {
  height: 4px;
  background: rgba(255,255,255,0.1);
  border-radius: 2px;
  overflow: hidden;
}

.ala-lifecycle__bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #a78bfa, #7c3aed);
  border-radius: 2px;
  transition: width 0.4s ease;
}

.ala-lifecycle__bar-pct {
  font-size: 0.65rem;
  color: rgba(255,255,255,0.35);
}

.ala-lifecycle__activities {
  list-style: none;
  margin: 0.1rem 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.ala-lifecycle__activities li {
  font-size: 0.65rem;
  color: rgba(255,255,255,0.4);
  padding-left: 0.6rem;
  position: relative;
}

.ala-lifecycle__activities li::before {
  content: '·';
  position: absolute;
  left: 0;
  color: rgba(167,139,250,0.6);
}

/* RIGHT: Recs + Stats */
.ala-recs-col {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.ala-recs-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.ala-rec-item {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.5rem;
  padding: 0.6rem 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.ala-rec-item__title {
  font-size: 0.8rem;
  font-weight: 600;
  color: rgba(255,255,255,0.88);
  margin: 0;
}

.ala-rec-item__meta {
  font-size: 0.7rem;
  color: rgba(255,255,255,0.4);
  margin: 0;
}

.ala-rec-item__outcome {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.5);
  margin: 0;
  font-style: italic;
}

.ala-stats-block {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 0.5rem;
  padding: 0.6rem 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.ala-stat-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ala-stat-row__label {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.4);
}

.ala-stat-row__value {
  font-size: 0.78rem;
  font-weight: 700;
  color: rgba(255,255,255,0.85);
}

.ala-priority {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 0.15rem 0.45rem;
  border-radius: 0.25rem;
}

.ala-priority--high   { background: rgba(248,113,113,0.18); color: #f87171; }
.ala-priority--medium { background: rgba(251,191,36,0.15);  color: #fbbf24; }
.ala-priority--low    { background: rgba(92,197,167,0.15);  color: #5CC5A7; }

/* Bottom: Adoption Readiness Summary grid */
.ala-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 0.75rem;
  overflow: hidden;
}

.ala-summary-cell {
  padding: 0.9rem 1rem;
  border-right: 1px solid rgba(255,255,255,0.07);
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.ala-summary-cell:last-child { border-right: none; }

.ala-summary-cell__label {
  font-size: 0.7rem;
  color: rgba(255,255,255,0.4);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0;
}

.ala-summary-cell__value {
  font-size: 0.85rem;
  font-weight: 600;
  margin: 0;
}

.ala-sum--ready      .ala-summary-cell__value { color: #5CC5A7; }
.ala-sum--progress   .ala-summary-cell__value { color: #fbbf24; }
.ala-sum--emerging   .ala-summary-cell__value { color: #a78bfa; }
.ala-sum--developing .ala-summary-cell__value { color: rgba(255,255,255,0.5); }

/* Leadership footer */
.ala-leadership {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.5rem;
  padding: 0.85rem 1rem;
}

.ala-leadership__icon {
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  background: rgba(167,139,250,0.15);
  color: #a78bfa;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
  font-weight: 700;
}

.ala-leadership__text {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.8);
  font-style: italic;
  margin: 0;
  line-height: 1.5;
}

.ala-empty {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.3);
  font-style: italic;
  padding: 0.5rem 0;
}

@media (max-width: 1024px) {
  .ala-body { grid-template-columns: 200px 1fr 200px; }
}

@media (max-width: 900px) {
  .ala-body { grid-template-columns: 1fr; }
  .ala-lifecycle { flex-direction: column; }
  .ala-lifecycle__arrow { transform: rotate(90deg); align-self: center; }
  .ala-summary-grid { grid-template-columns: repeat(2, 1fr); }
  .ala-summary-cell:nth-child(1),
  .ala-summary-cell:nth-child(2) { border-bottom: 1px solid rgba(255,255,255,0.07); }
  .ala-summary-cell:nth-child(odd) { border-right: 1px solid rgba(255,255,255,0.07); }
  .ala-view__position { padding-right: 0; }
}

/* ═══════════════════════════════════════════════════════════════════════════════
   SKILLS & WORKFORCE — AI LEARNING & ADOPTION (new format)  (alan-*)
   ═══════════════════════════════════════════════════════════════════════════════ */

.alan-view {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.alan-badge {
  position: absolute;
  top: 0;
  right: 0;
  background: rgba(139,92,246,0.18);
  border: 1px solid rgba(139,92,246,0.45);
  color: #a78bfa;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  padding: 0.3rem 0.75rem;
  border-radius: 2rem;
}

.alan-position {
  font-size: 0.85rem;
  color: rgba(255,255,255,0.55);
  margin: 0;
  padding-right: 12rem;
}

/* ── 3-column body ── */
.alan-body {
  display: grid;
  grid-template-columns: 45fr 20fr 35fr;
  gap: 1.25rem;
  align-items: start;
}

/* ── LEFT: Role-Based Learning Journey ── */
.alan-roles-col {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.alan-role-card {
  background: rgba(255,255,255,0.035);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.6rem;
  padding: 0.85rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.alan-role-card__name {
  font-size: 0.82rem;
  font-weight: 700;
  color: #5eead4;
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.alan-role-card__path-label,
.alan-role-card__outcome-label {
  font-size: 0.68rem;
  font-weight: 700;
  color: rgba(255,255,255,0.35);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0.25rem 0 0;
}

.alan-role-card__pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.alan-role-card__pill {
  background: rgba(94,234,212,0.12);
  border: 1px solid rgba(94,234,212,0.25);
  color: #5eead4;
  font-size: 0.7rem;
  font-weight: 600;
  padding: 0.2rem 0.55rem;
  border-radius: 2rem;
}

.alan-role-card__outcome {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.65);
  margin: 0;
  font-style: italic;
}

/* ── CENTER: AI Adoption Roadmap ── */
.alan-roadmap-col {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.alan-roadmap-stage {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 0.5rem;
  padding: 0.65rem 0.8rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.alan-roadmap-stage__name {
  font-size: 0.75rem;
  font-weight: 700;
  color: rgba(255,255,255,0.88);
  margin: 0;
}

.alan-roadmap-stage__row {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}

.alan-roadmap-stage__field-label {
  font-size: 0.63rem;
  font-weight: 700;
  color: rgba(255,255,255,0.3);
  text-transform: uppercase;
  letter-spacing: 0.07em;
}

.alan-roadmap-stage__value {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.6);
}

.alan-roadmap-arrow {
  text-align: center;
  font-size: 0.85rem;
  color: rgba(255,255,255,0.2);
  padding: 0.15rem 0;
  line-height: 1;
}

/* ── RIGHT: AI Enablement Actions ── */
.alan-actions-col {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.alan-action-card {
  background: rgba(255,255,255,0.035);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.6rem;
  padding: 0.85rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.alan-action-card__action {
  font-size: 0.82rem;
  font-weight: 700;
  color: rgba(255,255,255,0.88);
  margin: 0;
}

.alan-action-card__row {
  display: flex;
  align-items: baseline;
  gap: 0.4rem;
}

.alan-action-card__field-label {
  font-size: 0.68rem;
  font-weight: 700;
  color: rgba(255,255,255,0.3);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  white-space: nowrap;
}

.alan-action-card__value {
  font-size: 0.76rem;
  color: rgba(255,255,255,0.65);
}

.alan-impact--high  { color: #f87171; font-weight: 700; }
.alan-impact--medium { color: #fbbf24; font-weight: 700; }
.alan-impact--low   { color: #4ade80; font-weight: 700; }

/* ── Bottom strip: Capability Development Summary ── */
.alan-summary-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 0.6rem;
  overflow: hidden;
}

.alan-summary-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  padding: 0.9rem 0.5rem;
  border-right: 1px solid rgba(255,255,255,0.07);
  text-align: center;
}

.alan-summary-cell:last-child { border-right: none; }

.alan-summary-cell__value {
  font-size: 1.4rem;
  font-weight: 700;
  color: rgba(255,255,255,0.88);
  margin: 0;
  line-height: 1;
}

.alan-summary-cell__label {
  font-size: 0.65rem;
  color: rgba(255,255,255,0.38);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  margin: 0;
}

/* ── Learning Resources ── */
.alan-resources {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.alan-resource-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 0.5rem;
  padding: 0.55rem 0.85rem;
  gap: 0.75rem;
}

.alan-resource-item__name {
  font-size: 0.79rem;
  font-weight: 600;
  color: rgba(255,255,255,0.8);
  margin: 0;
  flex: 1;
}

.alan-resource-item__meta {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-shrink: 0;
}

.alan-resource-item__audience {
  font-size: 0.7rem;
  color: rgba(255,255,255,0.38);
}

.alan-resource-item__priority {
  font-size: 0.68rem;
  font-weight: 700;
  padding: 0.15rem 0.5rem;
  border-radius: 2rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.alan-pri--high   { background: rgba(248,113,113,0.15); color: #f87171; }
.alan-pri--medium { background: rgba(251,191,36,0.15);  color: #fbbf24; }
.alan-pri--low    { background: rgba(74,222,128,0.15);  color: #4ade80; }

/* ── Consultant Guidance ── */
.alan-consultant-guidance {
  display: flex;
  gap: 0.85rem;
  background: rgba(20,184,166,0.08);
  border: 1px solid rgba(20,184,166,0.22);
  border-radius: 0.6rem;
  padding: 1rem 1.1rem;
  align-items: flex-start;
}

.alan-cg__icon {
  color: #14b8a6;
  font-size: 0.9rem;
  flex-shrink: 0;
  margin-top: 0.1rem;
}

.alan-cg__text {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.65);
  margin: 0;
  line-height: 1.55;
}

/* ── AI Recommendation ── */
.alan-ai-recommendation {
  display: flex;
  gap: 0.85rem;
  background: rgba(251,191,36,0.08);
  border: 1px solid rgba(251,191,36,0.22);
  border-radius: 0.6rem;
  padding: 1rem 1.1rem;
  align-items: flex-start;
}

.alan-ar__icon {
  color: #fbbf24;
  font-size: 0.9rem;
  flex-shrink: 0;
  margin-top: 0.1rem;
}

.alan-ar__text {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.65);
  margin: 0;
  line-height: 1.55;
}

@media (max-width: 900px) {
  .alan-body { grid-template-columns: 1fr; }
  .alan-summary-strip { grid-template-columns: repeat(2, 1fr); }
  .alan-summary-cell:nth-child(2) { border-right: none; }
  .alan-summary-cell:nth-child(1),
  .alan-summary-cell:nth-child(2) { border-bottom: 1px solid rgba(255,255,255,0.07); }
  .alan-position { padding-right: 0; }
}

/* ══════════════════════════════════════════════════════════════════════════════
   Blueprint Design System — McKinsey-Style Typography Normalization
   One consistent type scale shared across ALL domain capability views.
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── Section card: stronger title, cleaner border ── */

.bp-section {
  border-color: rgba(255,255,255,0.09);
  border-radius: 1rem;
}

.bp-section__header {
  margin-bottom: 1.1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid rgba(255,255,255,0.07);
}

.bp-section__title {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #fff;
}

/* ── Sub-section column headings (brief-label) ──
   Used as headings for every panel/column inside a capability view.
   Upgraded from near-invisible 0.3 opacity to clearly readable labels
   with a teal accent mark that ties back to the brand colour. */

.brief-label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.52);
  margin: 0 0 0.65rem;
}

/* ── Intro / strategic-position paragraphs ──
   Every domain view starts with a one-paragraph context sentence.
   All previously ranged from 0.85 rem–0.92 rem at 0.55–0.80 opacity. */

.cdi-view__position,
.adp-view__position,
.dae-view__position,
.cds-view__position,
.sia-view__position,
.apr-view__position,
.aee-view__position,
.asa-view__position,
.atr-view__position,
.ala-view__position {
  font-size: 0.875rem;
  color: rgba(255,255,255,0.72);
  line-height: 1.65;
  margin: 0;
}

/* ── Card primary titles / names ──
   Item names on dataset cards, role cards, skill cards, rec cards, etc.
   Unified to one weight/size so every card reads the same across domains. */

.cdi-dataset-card__name,
.adp-dataset-card__name,
.dae-sys-card__name,
.dae-rec-card__title,
.sia-sys-card__name,
.cds-workload-card__name,
.cds-rec-card__text,
.aee-cap-card__name,
.asa-skill-card__name,
.asa-rec-item__title,
.atr-role-card__name,
.atr-rec-item__title,
.ala-pillar-card__name,
.ala-rec-item__title,
.apr-rec-item__text {
  font-size: 0.84rem;
  font-weight: 600;
  color: rgba(255,255,255,0.92);
  margin: 0;
}

/* ── Card secondary descriptions / purposes ──
   Supporting text below card titles. */

.cdi-dataset-card__purpose,
.cds-workload-card__spec,
.ala-pillar-card__desc,
.atr-role-card__resp {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.64);
  line-height: 1.52;
  margin: 0;
}

/* ── Meta / tertiary text ──
   Smallest tier: category tags, scores, meta rows, benefit italics. */

.cdi-dataset-card__category,
.aee-cap-card__score,
.asa-skill-card__meta,
.asa-rec-item__meta,
.asa-rec-item__benefit,
.atr-rec-item__meta,
.atr-rec-item__impact,
.ala-rec-item__meta,
.ala-rec-item__outcome,
.apr-rec-item__meta,
.apr-rec-item__benefit,
.cds-rec-card__impact-row,
.cds-rec-card__reason,
.dae-rec-meta-row,
.sia-sys-card__method,
.adp-rec-card__meta {
  font-size: 0.71rem;
  color: rgba(255,255,255,0.44);
  line-height: 1.42;
}

/* ── Matrix row category labels ──
   Row headers in the Skills Assessment matrix. */

.asa-matrix-row__cat {
  font-size: 0.8rem;
  font-weight: 600;
  color: rgba(255,255,255,0.8);
}

/* ── Recommendation benefit italics: keep italic style, just normalise size ── */
.asa-rec-item__benefit,
.atr-rec-item__impact,
.ala-rec-item__outcome,
.apr-rec-item__benefit,
.cds-rec-card__reason {
  font-style: italic;
}

/* ── AI Strategy domain — card primary titles ──
   Older layouts used 0.88 rem–0.95 rem / weight 700 for item card headings.
   Normalised to match the new-domain card title tier. */

.initiative-card__title,
.commitment-pillar-card__title,
.pillar-card__title,
.sol-component-card__name,
.team-group-card__roles li,
.matrix-quadrant__title,
.detail-bullet-card__title {
  font-size: 0.84rem;
  font-weight: 600;
  color: rgba(255,255,255,0.92);
  margin: 0;
}

/* ── AI Strategy domain — card secondary / body text ──
   Older layouts ranged from 0.79 rem–0.84 rem at 0.52–0.68 opacity. */

.initiative-card__description,
.pillar-card__description,
.commitment-pillar-card__list li,
.sol-component-card__purpose,
.detail-bullet-card__desc,
.detail-bullet-card__list li,
.matrix-quadrant__items {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.64);
  line-height: 1.55;
}

/* ── AI Use Cases domain — body text ── */

.cls-card__purpose,
.cls-banner__desc {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.64);
  line-height: 1.5;
}

/* ── AI Use Cases domain — sub-section labels (near-invisible at 0.25–0.28) ── */

.cls-banner__label,
.cls-card__section-label {
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.52);
}

/* ══════════════════════════════════════════════════════════════════════════════
   Capability accent colour system
   --cap-accent is set on .ws-right-panel by JS when a capability tab is selected.
   Each of the 4 tab slots has a distinct colour; the variable flows down into
   the tab underline, step badge, brief-label, cap-header accent bar, and dot.
   ══════════════════════════════════════════════════════════════════════════════ */

.ws-right-panel { --cap-accent: #5CC5A7; }

/* ── Brief section labels inherit accent ── */

.brief-label {
  color: var(--cap-accent);
  opacity: 0.75;
  transition: color 0.25s;
}
