/* Target Valthor Labs layout layer: research portal, analytics and system-profile presentation. */

:root {
  --vl-blue:#1688ff;
  --vl-blue-soft:rgba(22,136,255,.14);
  --vl-violet:#7c5cff;
  --vl-violet-soft:rgba(124,92,255,.16);
  --vl-cyan:#53d7ff;
  --vl-panel-strong:rgba(12,17,26,.92);
}

.hero--target {
  position: relative;
  overflow: hidden;
  min-height: 620px;
}

.hero--target::before {
  content: "";
  position: absolute;
  inset: 34px -12vw auto 38%;
  height: 460px;
  pointer-events: none;
  opacity: .56;
  background:
    linear-gradient(115deg, transparent 0 10%, rgba(22,136,255,.22) 10% 11%, transparent 11% 22%, rgba(124,92,255,.18) 22% 23%, transparent 23%),
    radial-gradient(circle at 80% 30%, rgba(83,215,255,.20), transparent 310px),
    linear-gradient(180deg, rgba(255,255,255,.06), transparent 60%);
  filter: blur(.2px);
}

.hero--target::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 72px 0 48px 44%;
  pointer-events: none;
  opacity: .28;
  background-image:
    linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(90deg, transparent, #000 26%, rgba(0,0,0,.3));
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 26px;
}

.btn--ghost {
  color: var(--text);
  background: rgba(255,255,255,.025);
}

.btn--ghost:hover,
.text-link:hover {
  border-color: rgba(22,136,255,.46);
  color: var(--vl-cyan);
}

.text-link {
  display: inline-flex;
  width: fit-content;
  margin-top: 18px;
  color: var(--gold2);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.text-link--muted {
  color: var(--muted);
}

.hero-terminal,
.research-matrix article,
.validation-track article,
.analytics-grid article,
.research-feed--target a,
.profile-hero-card,
.profile-section-card,
.analytics-hero-card,
.analytics-module,
.docs-card {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background:
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.018)),
    var(--vl-panel-strong);
  box-shadow: var(--shadow);
}

.hero-terminal {
  position: relative;
  z-index: 1;
  padding: 24px;
  min-width: 0;
  overflow: hidden;
}

.terminal-focus {
  position: relative;
  margin-top: 18px;
  padding: 14px 16px;
  border: 1px solid rgba(226,183,76,.26);
  border-radius: 12px;
  background: linear-gradient(105deg, rgba(226,183,76,.12), rgba(22,136,255,.055));
}

.terminal-focus span,
.terminal-pipeline > span {
  display: block;
  color: var(--dim);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.terminal-focus strong {
  display: block;
  margin-top: 5px;
  color: var(--text);
  font-size: 15px;
}

.terminal-focus p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.terminal-head,
.matrix-top,
.analytics-module__head,
.profile-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.terminal-head span,
.matrix-top span,
.analytics-grid span,
.analytics-module span,
.profile-card-top span,
.docs-card span {
  color: var(--dim);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.terminal-head strong,
.matrix-top strong,
.analytics-module strong,
.profile-card-top strong {
  display: block;
  margin-top: 5px;
  font-size: 20px;
}

.terminal-head em,
.matrix-top em {
  padding: 6px 9px;
  border: 1px solid rgba(22,136,255,.36);
  border-radius: 999px;
  color: var(--vl-cyan);
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  letter-spacing: .14em;
}

.terminal-table {
  display: grid;
  gap: 4px;
  margin: 20px 0;
  min-width: 0;
}

.terminal-row {
  display: grid;
  grid-template-columns: minmax(58px, .72fr) minmax(86px, 1.18fr) minmax(62px, .86fr) minmax(62px, .82fr);
  gap: 10px;
  align-items: center;
  min-height: 42px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,.07);
  color: var(--muted);
  font-size: 12px;
  min-width: 0;
}

.terminal-row strong,
.terminal-row b {
  min-width: 0;
  color: var(--text);
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.terminal-row span {
  min-width: 0;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.terminal-row .progress {
  min-width: 48px;
}

.terminal-row--head {
  min-height: auto;
  color: var(--dim);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .10em;
  text-transform: uppercase;
}

.progress {
  display: block;
  height: 8px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--vl-blue) 0 var(--p), rgba(255,255,255,.10) var(--p) 100%);
}

.progress--high { --p:76%; }
.progress--mid { --p:54%; }
.progress--low { --p:18%; }

.terminal-pipeline {
  margin: 18px 0 20px;
  padding-top: 2px;
}

.terminal-pipeline ol {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
}

.terminal-pipeline li {
  position: relative;
  min-width: 0;
  padding: 10px 8px 9px 11px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 9px;
  background: rgba(255,255,255,.025);
}

.terminal-pipeline li::before {
  content: "";
  position: absolute;
  top: 12px;
  left: -5px;
  width: 8px;
  height: 8px;
  border: 2px solid rgba(255,255,255,.22);
  border-radius: 50%;
  background: var(--vl-panel-strong);
}

.terminal-pipeline li.is-complete::before {
  border-color: var(--vl-cyan);
  background: var(--vl-cyan);
}

.terminal-pipeline li.is-current {
  border-color: rgba(226,183,76,.38);
  background: rgba(226,183,76,.075);
}

.terminal-pipeline li.is-current::before {
  border-color: var(--gold2);
  background: var(--gold2);
  box-shadow: 0 0 0 4px rgba(226,183,76,.12);
}

.terminal-pipeline b,
.terminal-pipeline small {
  display: block;
  overflow-wrap: anywhere;
}

.terminal-pipeline b {
  color: var(--text);
  font-size: 10px;
  line-height: 1.25;
}

.terminal-pipeline small {
  margin-top: 4px;
  color: var(--dim);
  font-size: 9px;
  line-height: 1.25;
}

.terminal-metrics,
.analytics-grid,
.research-matrix,
.tooling-grid--target,
.research-feed--target,
.profile-card-grid,
.analytics-module-grid,
.docs-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
}

.terminal-metrics article {
  padding: 14px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 16px;
  background: rgba(255,255,255,.03);
  min-width: 0;
}

.terminal-metrics span {
  display: block;
  margin-bottom: 7px;
  color: var(--dim);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.terminal-metrics strong {
  display: block;
  font-size: 13px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.tools-index-page .terminal-metrics {
  gap: 10px;
}

.tools-index-page .terminal-metrics article {
  padding: 12px;
}

.tools-index-page .terminal-metrics strong {
  font-size: 15px;
  line-height: 1.2;
}

.research-matrix article,
.validation-track article,
.analytics-grid article,
.research-feed--target a,
.profile-section-card,
.analytics-module,
.docs-card {
  padding: 22px;
}

.research-matrix h3,
.validation-track h3,
.analytics-grid strong,
.profile-section-card h3,
.analytics-module h3,
.docs-card h3 {
  margin-top: 18px;
}

.research-matrix p,
.validation-track p,
.analytics-grid p,
.research-feed--target p,
.profile-section-card p,
.analytics-module p,
.docs-card p {
  color: var(--muted);
  line-height: 1.6;
}

.gate-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 18px;
}

.gate {
  padding: 7px 9px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 999px;
  color: var(--dim);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.gate--done {
  border-color: rgba(74,212,128,.34);
  color: var(--green);
}

.gate--active {
  border-color: rgba(22,136,255,.42);
  color: var(--vl-cyan);
}

.validation-track {
  display: grid;
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 12px;
}

.validation-track article span {
  color: var(--gold);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .18em;
}

.tooling-grid--target a {
  min-height: 190px;
}

.analytics-section {
  background: linear-gradient(180deg, transparent, rgba(22,136,255,.035), transparent);
}

.analytics-grid {
  grid-template-columns: repeat(3, minmax(0,1fr));
}

.analytics-grid article {
  min-height: 210px;
  overflow: hidden;
}

.spark,
.histogram,
.mini-bars,
.evidence-dots {
  margin-top: 26px;
  height: 78px;
  border-radius: 14px;
  background:
    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(0deg, rgba(255,255,255,.06) 1px, transparent 1px),
    rgba(255,255,255,.025);
  background-size: 32px 32px;
}

.spark--up {
  clip-path: polygon(0 72%, 12% 61%, 25% 68%, 38% 42%, 53% 51%, 70% 24%, 85% 31%, 100% 8%, 100% 100%, 0 100%);
  background: linear-gradient(135deg, rgba(22,136,255,.18), rgba(83,215,255,.54));
}

.spark--dd {
  clip-path: polygon(0 8%, 10% 34%, 20% 28%, 32% 70%, 46% 45%, 58% 80%, 70% 50%, 84% 62%, 100% 36%, 100% 100%, 0 100%);
  background: linear-gradient(135deg, rgba(255,90,107,.18), rgba(255,90,107,.54));
}

.spark--cone {
  clip-path: polygon(0 55%, 18% 43%, 35% 38%, 54% 29%, 72% 18%, 100% 12%, 100% 88%, 72% 72%, 54% 65%, 35% 61%, 18% 58%);
  background: linear-gradient(135deg, rgba(124,92,255,.22), rgba(22,136,255,.45));
}

.histogram,
.mini-bars,
.evidence-dots {
  display: flex;
  align-items: end;
  justify-content: center;
  gap: 8px;
  padding: 12px;
}

.histogram i,
.mini-bars i {
  display: block;
  width: 16px;
  border-radius: 999px 999px 0 0;
  background: linear-gradient(180deg, var(--vl-cyan), var(--vl-blue));
}

.histogram i:nth-child(1) { height: 18%; }
.histogram i:nth-child(2) { height: 36%; }
.histogram i:nth-child(3) { height: 68%; }
.histogram i:nth-child(4) { height: 100%; }
.histogram i:nth-child(5) { height: 76%; }
.histogram i:nth-child(6) { height: 42%; }
.histogram i:nth-child(7) { height: 24%; }

.mini-bars i:nth-child(1) { height: 72%; }
.mini-bars i:nth-child(2) { height: 56%; }
.mini-bars i:nth-child(3) { height: 38%; }
.mini-bars i:nth-child(4) { height: 22%; }

.evidence-dots {
  align-items: center;
}

.evidence-dots i {
  display: block;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 2px solid var(--vl-cyan);
  background: rgba(83,215,255,.18);
}

.evidence-dots i:nth-child(5) {
  border-color: rgba(255,255,255,.22);
  background: rgba(255,255,255,.05);
}

.principles--target article,
.institutional-strip--target article,
.updates-panel--target,
.contact--target {
  background:
    linear-gradient(145deg, rgba(22,136,255,.065), rgba(255,255,255,.018)),
    var(--panel);
}

.profile-hero-card,
.analytics-hero-card {
  padding: 26px;
}

.profile-status-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 12px;
  margin-top: 22px;
}

.profile-status-grid div {
  padding: 14px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 16px;
  background: rgba(255,255,255,.03);
}

.profile-status-grid span {
  display: block;
  color: var(--dim);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.profile-status-grid strong {
  display: block;
  margin-top: 8px;
  font-size: 14px;
}

.analytics-module-grid {
  grid-template-columns: repeat(2, minmax(0,1fr));
}

.docs-grid {
  grid-template-columns: repeat(4, minmax(0,1fr));
}

@media (max-width: 1080px) {
  .validation-track,
  .docs-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }

  .research-matrix,
  .analytics-grid,
  .tooling-grid--target,
  .research-feed--target,
  .profile-card-grid,
  .profile-status-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}

@media (max-width: 720px) {
  .hero--target {
    min-height: auto;
  }

  .hero--target h1 {
    font-size: clamp(2rem, 10vw, 2.75rem) !important;
    line-height: 1.02 !important;
  }

  .hero--target .lead {
    font-size: 1rem !important;
    line-height: 1.62 !important;
  }

  .terminal-row {
    grid-template-columns: 1fr;
    gap: 7px;
    padding: 14px 0;
  }

  .terminal-row--head {
    display: none;
  }

  .terminal-metrics,
  .research-matrix,
  .validation-track,
  .analytics-grid,
  .tooling-grid--target,
  .research-feed--target,
  .profile-card-grid,
  .profile-status-grid,
  .analytics-module-grid,
  .docs-grid {
    grid-template-columns: 1fr;
  }

  .terminal-pipeline ol {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}

/* Desktop terminal fit hardening */
@media (min-width: 721px) and (max-width: 1380px) {
  .terminal-row {
    grid-template-columns: minmax(54px, .7fr) minmax(74px, 1.05fr) minmax(58px, .78fr) minmax(58px, .74fr);
    gap: 7px;
  }
  .terminal-row strong,
  .terminal-row b,
  .terminal-row span {
    min-width: 0;
    font-size: 11px;
    overflow-wrap: anywhere;
  }

  .terminal-row--head span {
    font-size: 8.5px;
    letter-spacing: .08em;
  }

  .terminal-metrics {
    gap: 10px;
  }

  .terminal-metrics article {
    padding: 12px;
  }
}
