/* Internal Controls & Governance — page styles */
@import url("colors_and_type.css");

/* Hero — compliance dashboard */
.ic-board {
  background: linear-gradient(180deg, rgba(15,21,48,0.96), rgba(8,12,28,0.96));
  border: 1px solid rgba(155,124,255,0.28);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 24px 64px rgba(0,0,0,0.6), 0 0 80px rgba(155,124,255,0.14);
}
.ic-dot { background: #9b7cff !important; box-shadow: 0 0 0 3px rgba(155,124,255,0.25) !important; }

.ic-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: rgba(255,255,255,0.06); border-bottom: 1px solid rgba(255,255,255,0.06); }
.ic-sum { padding: 18px 16px 14px; background: rgba(15,21,48,0.4); }
.ic-sum-v { font-family: var(--font-display); font-size: 28px; font-weight: 600; letter-spacing: -0.02em; }
.ic-mint { color: var(--site-mint); }
.ic-amber { color: var(--site-amber); }
.ic-red { color: #FF5C7C; }
.ic-sum-l { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.16em; color: var(--site-text-3); text-transform: uppercase; margin: 4px 0 8px; }
.ic-sum-bar { height: 3px; background: rgba(255,255,255,0.08); border-radius: 99px; overflow: hidden; }
.ic-sum-bar span { display: block; height: 100%; border-radius: 99px; }

.ic-controls { padding: 14px 18px 8px; }
.ic-controls-h { display: flex; justify-content: space-between; font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.16em; color: var(--site-text-3); text-transform: uppercase; padding: 4px 4px 12px; }
.ic-controls-c { color: #9b7cff; }
.ic-ctrl { display: grid; grid-template-columns: 64px 1fr auto; align-items: center; gap: 10px; padding: 9px 12px; margin-bottom: 5px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.07); background: rgba(15,21,48,0.4); transition: all 0.3s ease; }
.ic-ctrl.is-live { transform: translateX(2px); border-color: rgba(155,124,255,0.35); }
.ic-ctrl-mint { border-left: 3px solid var(--site-mint); }
.ic-ctrl-amber { border-left: 3px solid var(--site-amber); }
.ic-ctrl-red { border-left: 3px solid #FF5C7C; }
.ic-ctrl-id { font-family: var(--font-mono); font-size: 10px; color: var(--site-text-3); letter-spacing: 0.08em; }
.ic-ctrl-n { font-family: var(--font-mono); font-size: 11px; color: var(--site-text); }
.ic-ctrl-s { font-family: var(--font-mono); font-size: 9.5px; font-weight: 600; padding: 3px 7px; border-radius: 4px; letter-spacing: 0.08em; }
.ic-s-mint { background: rgba(94,255,164,0.14); color: var(--site-mint); }
.ic-s-amber { background: rgba(255,176,32,0.14); color: var(--site-amber); }
.ic-s-red { background: rgba(255,92,124,0.14); color: #FF5C7C; }

.ic-foot { display: flex; justify-content: space-around; padding: 12px 18px; border-top: 1px solid rgba(255,255,255,0.06); font-family: var(--font-mono); font-size: 10.5px; color: var(--site-text-2); }

/* Capabilities panel */
.ic-caps-panel { margin-top: 48px; border: 1px solid rgba(155,124,255,0.22); background: linear-gradient(180deg, rgba(15,21,48,0.6), rgba(15,21,48,0.25)); border-radius: 16px; overflow: hidden; }
.ic-caps-bar { display: flex; align-items: center; gap: 10px; padding: 14px 22px; border-bottom: 1px solid rgba(255,255,255,0.06); font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.16em; color: var(--site-text); }
.ic-caps-l { font-weight: 600; }
.ic-caps-tag { margin-left: auto; padding: 3px 8px; border: 1px solid rgba(155,124,255,0.4); color: #9b7cff; border-radius: 4px; font-size: 9.5px; }
.ic-caps-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: rgba(255,255,255,0.06); }
.ic-cap { padding: 24px 22px; background: rgba(15,21,48,0.4); position: relative; }
.ic-cap-n { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.16em; color: #9b7cff; margin-bottom: 12px; font-weight: 600; }
.ic-cap-t { font-weight: 600; font-size: 14px; color: var(--site-text); margin-bottom: 6px; line-height: 1.3; }
.ic-cap-d { font-size: 11.5px; color: var(--site-text-3); line-height: 1.5; }

/* Delivery rail */
.ic-rail { display: flex; align-items: stretch; gap: 6px; margin-top: 48px; overflow-x: auto; padding-bottom: 8px; }
.ic-phase { flex: 1; min-width: 150px; padding: 22px 16px; background: rgba(15,21,48,0.4); border: 1px solid rgba(255,255,255,0.07); border-radius: 12px; border-top: 2px solid var(--site-mint); }
.ic-phase-n { font-family: var(--font-mono); font-size: 11px; color: var(--site-mint); margin-bottom: 10px; letter-spacing: 0.16em; font-weight: 600; }
.ic-phase-t { font-weight: 600; font-size: 14px; color: var(--site-text); margin-bottom: 6px; }
.ic-phase-d { font-size: 11.5px; color: var(--site-text-3); line-height: 1.5; }
.ic-arrow { display: flex; align-items: center; color: var(--site-mint); font-size: 18px; opacity: 0.6; flex-shrink: 0; }

@media (max-width: 1100px) {
  .cx-hero-visual { margin: 0 auto; }
  .ic-caps-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px) {
  .ic-caps-grid { grid-template-columns: 1fr; }
}