/* Sandbox Africa V8-B production bridge. Loaded only by the V8 public layout. */
.sandbox-v8-public {
  min-width: 320px;
  overflow-x: clip;
}

.sandbox-v8-public main {
  min-height: 55vh;
}

.sandbox-v8-public .nav-link.active,
.sandbox-v8-public .mobile-panel a.active {
  color: var(--white, #fff);
}

.sandbox-v8-public .nav-link.active::after {
  transform: scaleX(1);
}

.sandbox-v8-public .mobile-panel a.active {
  background: rgba(255,255,255,.06);
}

.sandbox-v8-alerts {
  position: relative;
  z-index: 20;
  padding-top: 1rem;
}

.sandbox-v8-alert {
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 16px;
  padding: 1rem 1.1rem;
  background: rgba(6, 25, 28, .92);
  box-shadow: 0 18px 45px rgba(0, 0, 0, .2);
}

.sandbox-v8-alert + .sandbox-v8-alert { margin-top: .75rem; }
.sandbox-v8-alert-success { border-color: rgba(105, 211, 196, .42); }
.sandbox-v8-alert-error { border-color: rgba(246, 115, 115, .55); }
.sandbox-v8-alert ul { margin: .6rem 0 0 1.2rem; }

.sandbox-v8-empty-state {
  display: grid;
  place-items: center;
  text-align: center;
  gap: .75rem;
  min-height: 260px;
  padding: 2rem;
  border: 1px dashed rgba(255, 255, 255, .18);
  border-radius: 24px;
  background: rgba(255, 255, 255, .025);
}

.sandbox-v8-empty-state p {
  max-width: 600px;
  margin: 0;
}

.sandbox-v8-evidence-state,
.sandbox-v8-status {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .38rem .65rem;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 999px;
  font-size: .72rem;
  letter-spacing: .03em;
}

.sandbox-v8-evidence-state i {
  width: .45rem;
  height: .45rem;
  border-radius: 50%;
  background: #8d9a9b;
}

.sandbox-v8-evidence-state.is-positive i { background: #69d3c4; }
.sandbox-v8-evidence-state.is-warning i { background: #d9a056; }
.sandbox-v8-evidence-state.is-critical i { background: #f67373; }

.sandbox-v8-card-topline {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}

.sandbox-v8-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin: 1rem 0;
  color: var(--muted, #9db0b2);
  font-size: .82rem;
}

.sandbox-v8-card-meta span {
  padding: .3rem .55rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, .045);
}

.sandbox-v8-pagination { margin-top: 2rem; }
.sandbox-v8-pagination nav > div:first-child { display: none; }
.sandbox-v8-pagination nav > div:last-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.sandbox-v8-pagination nav span,
.sandbox-v8-pagination nav a { color: inherit; }
.sandbox-v8-pagination nav a,
.sandbox-v8-pagination nav span[aria-current="page"] span {
  border-color: rgba(255, 255, 255, .14) !important;
  background: rgba(255, 255, 255, .04) !important;
  color: inherit !important;
}
.sandbox-v8-pagination nav span[aria-current="page"] span {
  border-color: rgba(105, 211, 196, .55) !important;
  color: #69d3c4 !important;
}

.sandbox-v8-public .hero-compact {
  min-height: auto;
  padding-top: clamp(5rem, 8vw, 8rem);
  padding-bottom: clamp(3rem, 6vw, 5rem);
}

/* V8-B homepage dynamic data */
.sandbox-v8-home .platform-snapshot-note {
  display: flex;
  align-items: center;
  gap: .55rem;
  color: var(--muted, #9db0b2);
  font-size: .78rem;
}

.sandbox-v8-home .platform-snapshot-note i {
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
  background: #69d3c4;
  box-shadow: 0 0 18px rgba(105,211,196,.75);
}

.sandbox-v8-home .snapshot-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1.2rem;
}

.sandbox-v8-home .snapshot-card {
  min-height: 150px;
  padding: 1.2rem;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018));
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.sandbox-v8-home .snapshot-card span {
  color: var(--muted, #9db0b2);
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.sandbox-v8-home .snapshot-card strong {
  display: block;
  margin-top: .5rem;
  font-size: clamp(2rem, 4vw, 3.7rem);
  line-height: 1;
}

.sandbox-v8-home .snapshot-card small {
  color: rgba(255,255,255,.62);
}

.sandbox-v8-home .snapshot-flow {
  display: grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: .75rem;
  margin-top: 1rem;
}

.sandbox-v8-home .snapshot-stage {
  position: relative;
  padding: 1rem;
  border-radius: 16px;
  background: rgba(0,0,0,.14);
  border: 1px solid rgba(255,255,255,.08);
  overflow: hidden;
}

.sandbox-v8-home .snapshot-stage::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 3px;
  width: var(--snapshot-width, 0%);
  background: linear-gradient(90deg, #69d3c4, #d9a056);
}

.sandbox-v8-home .snapshot-stage b {
  display: block;
  font-size: 1.45rem;
}

.sandbox-v8-home .snapshot-stage span {
  display: block;
  margin-top: .25rem;
  color: var(--muted, #9db0b2);
  font-size: .76rem;
}

.sandbox-v8-home .dynamic-opportunity-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 1rem;
}

.sandbox-v8-home .dynamic-opportunity {
  padding: 1.25rem;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.03);
  display: flex;
  flex-direction: column;
  min-height: 270px;
}

.sandbox-v8-home .dynamic-opportunity .opportunity-kind {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: 1rem;
  color: #69d3c4;
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.sandbox-v8-home .dynamic-opportunity h3 { margin: 0 0 .65rem; }
.sandbox-v8-home .dynamic-opportunity p { color: var(--muted, #9db0b2); }
.sandbox-v8-home .dynamic-opportunity .card-link { margin-top: auto; }

.sandbox-v8-home .outcome-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 1rem;
}

.sandbox-v8-home .outcome-card {
  padding: 1.35rem;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.1);
  background: linear-gradient(145deg, rgba(105,211,196,.075), rgba(255,255,255,.018));
}

.sandbox-v8-home .outcome-card .outcome-type {
  color: #69d3c4;
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.sandbox-v8-home .outcome-card h3 { margin: .7rem 0; }
.sandbox-v8-home .outcome-card p { color: var(--muted, #9db0b2); }
.sandbox-v8-home .outcome-card footer {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(255,255,255,.08);
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  font-size: .75rem;
  color: rgba(255,255,255,.66);
}

.sandbox-v8-home .competition-card.is-empty {
  grid-template-columns: 1fr;
}

.sandbox-v8-home .solution-card .solution-provider {
  display: block;
  color: rgba(255,255,255,.55);
  font-size: .75rem;
  margin-top: .4rem;
}

.sandbox-v8-home .solution-card .readiness b { max-width: 180px; }

.sandbox-v8-home .studio-card .studio-sector {
  display: block;
  margin-bottom: .45rem;
  color: rgba(255,255,255,.55);
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.sandbox-v8-public.page-hidden .diagram-particles { opacity: .2; }

@media (max-width: 1050px) {
  .sandbox-v8-home .snapshot-grid,
  .sandbox-v8-home .dynamic-opportunity-grid,
  .sandbox-v8-home .outcome-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .sandbox-v8-home .snapshot-flow { grid-template-columns: repeat(3, minmax(0,1fr)); }
}

@media (max-width: 760px) {
  .sandbox-v8-card-topline { display: grid; }
  .sandbox-v8-pagination nav > div:last-child { display: block; }
  .sandbox-v8-home .snapshot-grid,
  .sandbox-v8-home .dynamic-opportunity-grid,
  .sandbox-v8-home .outcome-grid,
  .sandbox-v8-home .snapshot-flow { grid-template-columns: 1fr; }
  .sandbox-v8-home .snapshot-card { min-height: 125px; }
  .sandbox-v8-home .outcome-card footer { display: grid; }
}

.sandbox-v8-home .competition-open-state {
  display: grid;
  gap: .35rem;
  padding: 1.25rem 0;
}
.sandbox-v8-home .competition-open-state strong {
  font-size: clamp(1.7rem, 3vw, 2.8rem);
  color: #69d3c4;
}
.sandbox-v8-home .competition-open-state span { color: var(--muted, #9db0b2); }