/* WRAPPER */
.zxqv91_mlHeroWrap {
  position: relative;
  width: 100%;
  min-height: 92vh;
  overflow: hidden;
  background: radial-gradient(circle at 20% 20%, #1a1408, #000000 70%);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* OVERLAY GLOW */
.zxqv91_mlOverlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background: linear-gradient(120deg, rgba(255,170,0,0.08), transparent);
  z-index: 1;
}

/* CONTENT */
.zxqv91_mlContainer {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 1100px;
  padding: 20px;
}

/* HEADING */
.zxqv91_mlHeading {
  font-size: 3.5rem;
  font-weight: 700;
  color: #ffb347;
  line-height: 1.2;
  letter-spacing: 1px;
}

/* STATIC TEXT */
.zxqv91_staticTxt {
  color: #f5f5f5;
}

/* DYNAMIC TEXT */
.zxqv91_dynamicTxt {
  color: #ff9900;
  text-shadow: 0 0 10px rgba(255,153,0,0.6);
}

/* CURSOR */
.zxqv91_cursor {
  display: inline-block;
  margin-left: 5px;
  animation: zxqv91_blink 1s infinite;
}

@keyframes zxqv91_blink {
  0%, 50%, 100% { opacity: 1; }
  25%, 75% { opacity: 0; }
}

/* SUBTEXT */
.zxqv91_mlSubText {
  margin-top: 20px;
  font-size: 1.2rem;
  color: #cccccc;
  line-height: 1.6;
}

/* BUTTONS */
.zxqv91_mlButtons {
  margin-top: 30px;
  display: flex;
  gap: 15px;
  justify-content: center;
  flex-wrap: wrap;
}

.zxqv91_btnPrimary {
  padding: 12px 26px;
  background: linear-gradient(45deg, #ff9900, #ffcc66);
  color: #000;
  border-radius: 30px;
  font-weight: 600;
  text-decoration: none;
  transition: 0.3s;
}

.zxqv91_btnPrimary:hover {
  transform: scale(1.05);
  box-shadow: 0 0 15px rgba(255,153,0,0.6);
}

.zxqv91_btnSecondary {
  padding: 12px 26px;
  border: 1px solid #ff9900;
  color: #ff9900;
  border-radius: 30px;
  text-decoration: none;
  transition: 0.3s;
}

.zxqv91_btnSecondary:hover {
  background: #ff9900;
  color: #000;
}

/* CANVAS */
#zxqv91_canvasBg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .zxqv91_mlHeading {
    font-size: 2.3rem;
  }

  .zxqv91_mlSubText {
    font-size: 1rem;
  }
}

/* MAIN WRAP */
.zxqv91_aiCoreWrap {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* CENTER CORE */
.zxqv91_coreCenter {
  position: absolute;
  width: 120px;
  height: 120px;
  border: 1px solid rgba(255,153,0,0.4);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* PULSE */
.zxqv91_corePulse {
  width: 20px;
  height: 20px;
  background: #ff9900;
  border-radius: 50%;
  box-shadow: 0 0 20px #ff9900;
  animation: zxqv91_pulse 2s infinite;
}

@keyframes zxqv91_pulse {
  0% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.8); opacity: 0.4; }
  100% { transform: scale(1); opacity: 1; }
}

/* RINGS */
.zxqv91_coreRingOne,
.zxqv91_coreRingTwo {
  position: absolute;
  width: 400px;
  height: 400px;
  fill: none;
  stroke: rgba(255,153,0,0.2);
  stroke-width: 1;
}

.zxqv91_coreRingOne {
  animation: zxqv91_rotate 18s linear infinite;
}

.zxqv91_coreRingTwo {
  animation: zxqv91_rotateRev 12s linear infinite;
}

/* ROTATION */
@keyframes zxqv91_rotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes zxqv91_rotateRev {
  from { transform: rotate(360deg); }
  to { transform: rotate(0deg); }
}

/* SIDE BARS */
.zxqv91_sideBar {
  position: absolute;
  width: 2px;
  height: 120px;
  background: linear-gradient(to bottom, transparent, #ff9900, transparent);
  opacity: 0.4;
}

.zxqv91_leftBar {
  left: 15%;
  animation: zxqv91_barMove 4s infinite;
}

.zxqv91_rightBar {
  right: 15%;
  animation: zxqv91_barMove 4s infinite reverse;
}

@keyframes zxqv91_barMove {
  0% { transform: translateY(-20px); opacity: 0; }
  50% { opacity: 1; }
  100% { transform: translateY(20px); opacity: 0; }
}

/* WRAP */
.zxqv91_ultraWrap {
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 0;
}

/* ================= DNA HELIX ================= */
.zxqv91_dnaWrap {
  position: absolute;
  left: 10%;
  top: 20%;
  height: 300px;
  width: 80px;
}

.zxqv91_dnaWrap span {
  position: absolute;
  width: 8px;
  height: 8px;
  background: #ff9900;
  border-radius: 50%;
  left: 0;
  animation: zxqv91_dnaMove 3s linear infinite;
}

.zxqv91_dnaWrap span:nth-child(odd) {
  left: 40px;
  animation-delay: 1.5s;
}

@keyframes zxqv91_dnaMove {
  0% { transform: translateY(0) scale(1); opacity: 0.3; }
  50% { transform: translateY(150px) scale(1.4); opacity: 1; }
  100% { transform: translateY(300px) scale(1); opacity: 0.3; }
}

/* ================= AI CORE ================= */
.zxqv91_aiCore {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 140px;
  height: 140px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,153,0,0.8), transparent 60%);
  transform: translate(-50%, -50%);
  box-shadow: 0 0 60px rgba(255,153,0,0.6);
  transition: transform 0.1s linear;
}

/* ================= ENERGY BEAM ================= */
.zxqv91_energyBeam {
  position: absolute;
  bottom: 25%;
  left: 20%;
  width: 60%;
  height: 2px;
  background: linear-gradient(90deg, transparent, #ff9900, transparent);
  animation: zxqv91_energyFlow 2s linear infinite;
}

@keyframes zxqv91_energyFlow {
  0% { opacity: 0; transform: scaleX(0.5); }
  50% { opacity: 1; transform: scaleX(1); }
  100% { opacity: 0; transform: scaleX(0.5); }
}

/*Hero Section CSS by Rishabh Ends*/

/*Bulb Section CSS by Rishabh Starts*/
/* ============================================================
   MACHINE LEARNING — NEURAL NEXUS SECTION
   CSS — ml-section.css
   Font: Orbitron (display) + Share Tech Mono (mono)
   Import in <head>:
   <link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=Share+Tech+Mono&display=swap" rel="stylesheet">
============================================================ */

/* ── TOKENS ── */
:root {
  --nxs-bg:       #020810;
  --nxs-cyan:     #00f5ff;
  --nxs-blue:     #0066ff;
  --nxs-orange:   #ff6600;
  --nxs-pink:     #ff0077;
  --nxs-white:    #e8f4ff;
  --nxs-muted:    #4a6a8a;
  --nxs-glass:    rgba(0, 245, 255, 0.04);
  --nxs-border:   rgba(0, 245, 255, 0.18);
  --nxs-font-d:   'Orbitron', monospace;
  --nxs-font-m:   'Share Tech Mono', monospace;
}

/* ── SHELL ── */
.nxs_shell {
  position: relative;
  background: var(--nxs-bg);
  min-height: 100vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  padding: 80px 5vw;
  box-sizing: border-box;
  font-family: var(--nxs-font-m);
}

/* ── CIRCUIT GRID BG ── */
.nxs_gridCanvas {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
.nxs_circuitSvg {
  width: 100%;
  height: 100%;
}

.nxs_rail {
  stroke: rgba(0, 245, 255, 0.07);
  stroke-width: 1;
  fill: none;
}
.nxs_rH1 { animation: nxs_railH 8s  linear infinite; }
.nxs_rH2 { animation: nxs_railH 12s linear infinite reverse; }
.nxs_rH3 { animation: nxs_railH 10s linear infinite; }
.nxs_rH4 { animation: nxs_railH 7s  linear infinite reverse; }
.nxs_rV1 { animation: nxs_railV 9s  linear infinite; }
.nxs_rV2 { animation: nxs_railV 11s linear infinite reverse; }
.nxs_rV3 { animation: nxs_railV 8s  linear infinite; }
.nxs_rV4 { animation: nxs_railV 13s linear infinite reverse; }

@keyframes nxs_railH {
  0%   { stroke-opacity: 0.04; }
  50%  { stroke-opacity: 0.14; }
  100% { stroke-opacity: 0.04; }
}
@keyframes nxs_railV {
  0%   { stroke-opacity: 0.04; }
  50%  { stroke-opacity: 0.12; }
  100% { stroke-opacity: 0.04; }
}

.nxs_node {
  fill: var(--nxs-cyan);
  opacity: 0.25;
  animation: nxs_nodeFlick 3s ease-in-out infinite;
}
.nxs_node:nth-child(odd) { animation-delay: -1.5s; }

@keyframes nxs_nodeFlick {
  0%,100% { opacity: 0.15; r: 4; }
  50%      { opacity: 0.55; r: 7; }
}

/* Background pulse travelers */
.nxs_pulse {
  fill: var(--nxs-cyan);
  filter: drop-shadow(0 0 6px var(--nxs-cyan));
}
.nxs_pA {
  animation: nxs_travelH1 6s linear infinite;
}
.nxs_pB {
  animation: nxs_travelH2 9s linear infinite;
  animation-delay: -3s;
}
.nxs_pC {
  animation: nxs_travelV1 7s linear infinite;
  animation-delay: -2s;
  fill: var(--nxs-orange);
  filter: drop-shadow(0 0 6px var(--nxs-orange));
}

@keyframes nxs_travelH1 {
  0%   { cx: 0;    cy: 120; }
  100% { cx: 1440; cy: 120; }
}
@keyframes nxs_travelH2 {
  0%   { cx: 1440; cy: 600; }
  100% { cx: 0;    cy: 600; }
}
@keyframes nxs_travelV1 {
  0%   { cx: 960; cy: 0;   }
  100% { cx: 960; cy: 900; }
}

/* ── SCANLINE ── */
.nxs_scanLine {
  position: absolute;
  left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(0,245,255,0.15), transparent);
  animation: nxs_scan 6s linear infinite;
  pointer-events: none;
  z-index: 1;
}
@keyframes nxs_scan {
  0%   { top: -2px;   opacity: 0; }
  5%   { opacity: 1; }
  95%  { opacity: 1; }
  100% { top: 100%;   opacity: 0; }
}

/* ── CORNER BRACKETS ── */
.nxs_brk {
  position: absolute;
  width: 40px;
  height: 40px;
  z-index: 2;
}
.nxs_brkTL { top: 20px;  left: 20px;  border-top: 2px solid var(--nxs-cyan); border-left: 2px solid var(--nxs-cyan); }
.nxs_brkTR { top: 20px;  right: 20px; border-top: 2px solid var(--nxs-cyan); border-right: 2px solid var(--nxs-cyan); }
.nxs_brkBL { bottom: 20px; left: 20px;  border-bottom: 2px solid var(--nxs-cyan); border-left: 2px solid var(--nxs-cyan); }
.nxs_brkBR { bottom: 20px; right: 20px; border-bottom: 2px solid var(--nxs-cyan); border-right: 2px solid var(--nxs-cyan); }

/* ── INNER LAYOUT ── */
.nxs_inner {
  position: relative;
  z-index: 10;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}

/* ── LEFT PANEL ── */
.nxs_leftPanel {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* System label */
.nxs_sysLabel {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--nxs-font-m);
  font-size: 11px;
  letter-spacing: 3px;
  color: var(--nxs-cyan);
  text-transform: uppercase;
}
.nxs_dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--nxs-cyan);
  box-shadow: 0 0 10px var(--nxs-cyan);
  animation: nxs_blink 1.2s ease-in-out infinite;
}
@keyframes nxs_blink {
  0%,100% { opacity: 1; }
  50%      { opacity: 0.2; }
}

/* Card */
.nxs_card {
  position: relative;
  background: var(--nxs-glass);
  border: 1px solid var(--nxs-border);
  border-radius: 4px;
  padding: 48px 44px;
  overflow: hidden;
  backdrop-filter: blur(12px);
}
.nxs_card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--nxs-cyan), transparent);
}

.nxs_cardGlow {
  position: absolute;
  top: -80px; left: -80px;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(0,245,255,0.08), transparent 70%);
  pointer-events: none;
  animation: nxs_glowDrift 8s ease-in-out infinite alternate;
}
@keyframes nxs_glowDrift {
  0%   { transform: translate(0,0); }
  100% { transform: translate(60px, 40px); }
}

/* Step badge */
.nxs_stepBadge {
  font-family: var(--nxs-font-d);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 4px;
  color: var(--nxs-orange);
  border: 1px solid rgba(255,102,0,0.4);
  display: inline-block;
  padding: 4px 14px;
  margin-bottom: 20px;
  position: relative;
  transition: content 0.3s;
}
.nxs_stepBadge::before {
  content: 'PROTOCOL ';
}

/* Heading */
.nxs_heading {
  font-family: var(--nxs-font-d);
  font-size: clamp(26px, 3.5vw, 46px);
  font-weight: 900;
  color: var(--nxs-white);
  line-height: 1.15;
  margin: 0 0 20px;
  text-shadow: 0 0 40px rgba(0,245,255,0.3);
  transition: opacity 0.3s ease;
  letter-spacing: -1px;
}

/* Divider */
.nxs_divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 22px;
}
.nxs_divLine {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, var(--nxs-border), transparent);
}
.nxs_divLine:last-child {
  background: linear-gradient(270deg, var(--nxs-border), transparent);
}
.nxs_divIcon {
  font-size: 14px;
  color: var(--nxs-cyan);
  text-shadow: 0 0 10px var(--nxs-cyan);
}

/* Para */
.nxs_para {
  font-family: var(--nxs-font-m);
  font-size: 15px;
  color: rgba(232, 244, 255, 0.6);
  line-height: 1.8;
  margin: 0 0 30px;
  transition: opacity 0.3s ease;
}

/* Progress bar */
.nxs_progressWrap {
  height: 2px;
  background: rgba(0,245,255,0.1);
  border-radius: 2px;
  overflow: hidden;
  margin-bottom: 24px;
}
.nxs_progressBar {
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, var(--nxs-blue), var(--nxs-cyan));
  box-shadow: 0 0 10px var(--nxs-cyan);
  transition: width 4s linear;
}

/* Step dots */
.nxs_steps {
  display: flex;
  gap: 8px;
}
.nxs_step {
  width: 28px;
  height: 3px;
  background: var(--nxs-muted);
  border-radius: 2px;
  cursor: pointer;
  transition: background 0.3s, box-shadow 0.3s;
}
.nxs_stepActive {
  background: var(--nxs-cyan);
  box-shadow: 0 0 8px var(--nxs-cyan);
}

/* Status bar */
.nxs_statusBar {
  display: flex;
  gap: 24px;
  align-items: center;
  flex-wrap: wrap;
  font-size: 11px;
  letter-spacing: 2px;
  color: var(--nxs-muted);
  text-transform: uppercase;
}
.nxs_statItem {
  display: flex;
  align-items: center;
  gap: 6px;
}
.nxs_statDot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  animation: nxs_blink 1.2s ease-in-out infinite;
}
.nxs_statDot.nxs_green { background: #00ff88; box-shadow: 0 0 8px #00ff88; }
.nxs_statDot.nxs_cyan  { background: var(--nxs-cyan); box-shadow: 0 0 8px var(--nxs-cyan); animation-delay: -0.6s; }
#nxs_accuracy { color: var(--nxs-cyan); font-family: var(--nxs-font-d); font-size: 11px; }

/* ── RIGHT PANEL ── */
.nxs_rightPanel {
  display: flex;
  justify-content: center;
  align-items: center;
}

.nxs_neuralWrap {
  position: relative;
  width: 420px;
  height: 420px;
  max-width: 90vw;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Holographic rings */
.nxs_holoRing {
  position: absolute;
  border-radius: 50%;
  border: 1px solid;
  pointer-events: none;
}
.nxs_ring1 {
  width: 100%; height: 100%;
  border-color: rgba(0,245,255,0.12);
  animation: nxs_ringRotate 12s linear infinite;
  box-shadow: 0 0 30px rgba(0,245,255,0.05) inset;
}
.nxs_ring2 {
  width: 80%; height: 80%;
  border-color: rgba(0,102,255,0.15);
  animation: nxs_ringRotate 8s linear infinite reverse;
}
.nxs_ring3 {
  width: 60%; height: 60%;
  border-color: rgba(255,102,0,0.12);
  animation: nxs_ringRotate 5s linear infinite;
}
@keyframes nxs_ringRotate {
  to { transform: rotate(360deg); }
}

/* Neural SVG */
.nxs_netSvg {
  width: 100%;
  height: 100%;
  overflow: visible;
  filter: drop-shadow(0 0 20px rgba(0,245,255,0.2));
  transition: transform 0.2s ease;
}

/* Edges */
.nxs_edges line {
  stroke: rgba(0, 245, 255, 0.12);
  stroke-width: 1;
  fill: none;
  transition: stroke 0.5s;
}
.nxs_edges.nxs_edgeActive line {
  stroke: rgba(0, 245, 255, 0.4);
  animation: nxs_edgePulse 2s ease-in-out infinite;
}
@keyframes nxs_edgePulse {
  0%,100% { stroke-opacity: 0.12; }
  50%      { stroke-opacity: 0.5; }
}

/* Neurons */
.nxs_neuron {
  fill: url(#ngNodeGrad);
  stroke: var(--nxs-cyan);
  stroke-width: 1.5;
  animation: nxs_neuronPop 3s ease-in-out infinite;
}
.nxs_neuron:nth-child(2) { animation-delay: -0.5s; }
.nxs_neuron:nth-child(3) { animation-delay: -1s; }
.nxs_neuron:nth-child(4) { animation-delay: -1.5s; }

@keyframes nxs_neuronPop {
  0%,100% { opacity: 0.7; }
  50%      { opacity: 1; filter: drop-shadow(0 0 8px var(--nxs-cyan)); }
}

.nxs_layerIn  { fill: url(#ngNodeGrad); stroke: var(--nxs-cyan); }
.nxs_layerH1  { fill: url(#ngNodeGrad); stroke: var(--nxs-blue); }
.nxs_layerH2  { fill: url(#ngNodeGrad); stroke: var(--nxs-blue); }
.nxs_layerOut { fill: url(#ngCoreGrad); stroke: var(--nxs-orange); }

/* Core */
.nxs_core {
  fill: url(#ngCoreGrad);
  stroke: var(--nxs-orange);
  stroke-width: 2;
  animation: nxs_coreBreath 2.5s ease-in-out infinite;
}
.nxs_corePulse {
  fill: none;
  stroke: var(--nxs-orange);
  stroke-width: 1;
  opacity: 0;
  animation: nxs_coreRing 2.5s ease-out infinite;
}
@keyframes nxs_coreBreath {
  0%,100% { r: 22; opacity: 0.9; }
  50%      { r: 26; opacity: 1; }
}
@keyframes nxs_coreRing {
  0%   { r: 26; opacity: 0.6; stroke-width: 2; }
  100% { r: 60; opacity: 0;   stroke-width: 0.5; }
}

/* Signal dots */
.nxs_sigDot {
  fill: var(--nxs-cyan);
  filter: drop-shadow(0 0 5px var(--nxs-cyan));
  opacity: 0;
}

/* Layer labels */
.nxs_layerLabel {
  font-family: var(--nxs-font-m);
  font-size: 9px;
  fill: var(--nxs-muted);
  letter-spacing: 2px;
}

/* Readout overlay */
.nxs_readout {
  position: absolute;
  top: 16px;
  right: 0;
  background: rgba(2,8,16,0.85);
  border: 1px solid var(--nxs-border);
  border-radius: 3px;
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  backdrop-filter: blur(8px);
}
.nxs_rdRow {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
}
.nxs_rdKey {
  font-size: 9px;
  letter-spacing: 2px;
  color: var(--nxs-muted);
  text-transform: uppercase;
}
.nxs_rdVal {
  font-family: var(--nxs-font-d);
  font-size: 11px;
  color: var(--nxs-cyan);
  text-shadow: 0 0 8px var(--nxs-cyan);
  min-width: 50px;
  text-align: right;
}

/* ── RESPONSIVE ── */
@media (max-width: 900px) {
  .nxs_inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .nxs_rightPanel {
    order: -1;
  }
  .nxs_neuralWrap {
    width: 300px;
    height: 300px;
  }
  .nxs_card {
    padding: 32px 28px;
  }
}

@media (max-width: 480px) {
  .nxs_shell {
    padding: 60px 6vw;
  }
  .nxs_neuralWrap {
    width: 240px;
    height: 240px;
  }
  .nxs_heading {
    font-size: 24px;
  }
  .nxs_statusBar {
    gap: 14px;
  }
  .nxs_readout {
    top: 8px;
    right: -8px;
    padding: 8px 10px;
  }
}

/*Bulb Section CSS by Rishabh Ends*/

/* ============================================================
   MACHINE LEARNING — ROBOTIC INTELLIGENCE SECTION
   CSS — ml-robotic.css
   Google Fonts needed:
   <link href="https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@300;400;600;700;800;900&family=Barlow:wght@300;400;500&display=swap" rel="stylesheet">
============================================================ */

/* ── TOKENS (matching brand: dark purple-navy bg, gold accent) ── */
:root {
  --rxm-bg-deep:    #0b0814;
  --rxm-bg-mid:     #130d1e;
  --rxm-bg-panel:   rgba(255,255,255,0.03);
  --rxm-gold:       #c9a227;
  --rxm-gold-lt:    #e8c84a;
  --rxm-gold-dk:    #7a5f0e;
  --rxm-white:      #ffffff;
  --rxm-muted:      rgba(255,255,255,0.45);
  --rxm-border:     rgba(201,162,39,0.2);
  --rxm-cyan:       #4af0f0;
  --rxm-purple:     #9066ff;
  --rxm-font-head:  'Barlow Condensed', sans-serif;
  --rxm-font-body:  'Barlow', sans-serif;
}

/* ── SHELL ── */
.rxm_shell {
  position: relative;
  background: var(--rxm-bg-deep);
  min-height: 100vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* ── BACKGROUND LAYERS ── */
.rxm_bgBase {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 60% at 70% 50%, rgba(60,35,120,0.35), transparent 70%),
    radial-gradient(ellipse 50% 40% at 20% 80%, rgba(30,15,60,0.4), transparent),
    radial-gradient(ellipse 60% 50% at 80% 10%, rgba(40,20,80,0.3), transparent);
}

/* Subtle hexagon tile bg */
.rxm_bgHex {
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 39px,
      rgba(201,162,39,0.03) 39px,
      rgba(201,162,39,0.03) 40px
    ),
    repeating-linear-gradient(
      60deg,
      transparent,
      transparent 39px,
      rgba(201,162,39,0.03) 39px,
      rgba(201,162,39,0.03) 40px
    ),
    repeating-linear-gradient(
      120deg,
      transparent,
      transparent 39px,
      rgba(201,162,39,0.025) 39px,
      rgba(201,162,39,0.025) 40px
    );
  pointer-events: none;
}

.rxm_bgVignette {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, transparent 40%, rgba(5,3,12,0.8) 100%);
  pointer-events: none;
}

/* Scanline sweep */
.rxm_scanSweep {
  position: absolute;
  left: 0; right: 0;
  height: 120px;
  background: linear-gradient(to bottom, transparent, rgba(201,162,39,0.04), transparent);
  animation: rxm_sweep 8s linear infinite;
  pointer-events: none;
  z-index: 1;
}
@keyframes rxm_sweep {
  0%   { top: -120px; }
  100% { top: 100%;   }
}

/* Diagonal accent strip */
.rxm_diag {
  position: absolute;
  top: 0; bottom: 0;
  left: 48%;
  width: 2px;
  background: linear-gradient(to bottom, transparent, rgba(201,162,39,0.15) 30%, rgba(201,162,39,0.08) 70%, transparent);
  transform: skewX(-8deg);
  pointer-events: none;
  z-index: 1;
}
.rxm_diag::after {
  content: '';
  position: absolute;
  inset: 0;
  left: 60px;
  background: linear-gradient(to bottom, transparent, rgba(201,162,39,0.06) 40%, transparent);
}

/* ── DATA STREAMS ── */
.rxm_streams {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 1;
}
.rxm_stream {
  position: absolute;
  top: 0;
  width: 1px;
  height: 100%;
  background: repeating-linear-gradient(
    to bottom,
    transparent 0px,
    transparent 12px,
    rgba(201,162,39,0.18) 12px,
    rgba(201,162,39,0.18) 14px
  );
  animation: rxm_streamFall 4s linear infinite;
}
.rxm_sA { left: 12%; animation-duration: 5s; animation-delay: 0s; }
.rxm_sB { left: 88%; animation-duration: 3.5s; animation-delay: -1.5s; opacity: 0.5; }
.rxm_sC { left: 55%; animation-duration: 6s; animation-delay: -3s; opacity: 0.3; }

@keyframes rxm_streamFall {
  0%   { transform: translateY(-100%); }
  100% { transform: translateY(100%); }
}

/* ── INNER LAYOUT ── */
.rxm_inner {
  position: relative;
  z-index: 10;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  max-width: 1320px;
  width: 100%;
  margin: 0 auto;
  padding: 90px 60px;
  box-sizing: border-box;
  align-items: center;
  min-height: 90vh;
}

/* ════ LEFT COL ════ */
.rxm_leftCol {
  padding-right: 60px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

/* Eyebrow */
.rxm_eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--rxm-font-head);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 4px;
  color: var(--rxm-gold);
  text-transform: uppercase;
}

/* Hero headline — brand style: bold condensed */
.rxm_headline {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  line-height: 0.95;
}
.rxm_hLine {
  font-family: var(--rxm-font-head);
  font-weight: 800;
  font-size: clamp(52px, 6vw, 88px);
  letter-spacing: -1px;
  display: block;
  text-transform: uppercase;
}
.rxm_hWhite { color: var(--rxm-white); }
.rxm_hGold  {
  color: var(--rxm-gold);
  text-shadow: 0 0 60px rgba(201,162,39,0.35);
}

/* Subtitle */
.rxm_sub {
  font-family: var(--rxm-font-body);
  font-size: 16px;
  font-weight: 300;
  color: var(--rxm-muted);
  line-height: 1.75;
  max-width: 460px;
  margin: 0;
}

/* ── METRICS STRIP ── */
.rxm_metricsRow {
  display: flex;
  align-items: stretch;
  gap: 0;
  background: var(--rxm-bg-panel);
  border: 1px solid var(--rxm-border);
  border-radius: 4px;
  padding: 20px 24px;
  position: relative;
  overflow: hidden;
}
.rxm_metricsRow::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--rxm-gold), transparent);
}

.rxm_metric {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.rxm_metDivider {
  width: 1px;
  background: var(--rxm-border);
  margin: 0 24px;
  align-self: stretch;
}

.rxm_metTop {}
.rxm_metVal {
  font-family: var(--rxm-font-head);
  font-size: 28px;
  font-weight: 700;
  color: var(--rxm-white);
  letter-spacing: -0.5px;
}

.rxm_metBar {
  height: 2px;
  background: rgba(255,255,255,0.08);
  border-radius: 2px;
  overflow: hidden;
}
.rxm_metFill {
  height: 100%;
  width: var(--w, 0%);
  background: var(--rxm-gold);
  border-radius: 2px;
  box-shadow: 0 0 8px rgba(201,162,39,0.6);
  animation: rxm_barGrow 1.4s cubic-bezier(0.4,0,0.2,1) forwards;
}
.rxm_mfCyan   { background: var(--rxm-cyan);   box-shadow: 0 0 8px rgba(74,240,240,0.5); }
.rxm_mfPurple { background: var(--rxm-purple);  box-shadow: 0 0 8px rgba(144,102,255,0.5); }

@keyframes rxm_barGrow {
  from { width: 0; }
  to   { width: var(--w, 0%); }
}

.rxm_metLabel {
  font-family: var(--rxm-font-head);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 2.5px;
  color: var(--rxm-muted);
  text-transform: uppercase;
}

/* ── PILLS ── */
.rxm_pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.rxm_pill {
  font-family: var(--rxm-font-head);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 7px 16px;
  border-radius: 2px;
  border: 1px solid rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.5);
  background: rgba(255,255,255,0.03);
  transition: border-color 0.3s, color 0.3s, background 0.3s;
  cursor: default;
}
.rxm_pill:hover {
  border-color: var(--rxm-gold);
  color: var(--rxm-gold);
  background: rgba(201,162,39,0.07);
}
.rxm_pillGold {
  border-color: rgba(201,162,39,0.4);
  color: var(--rxm-gold);
  background: rgba(201,162,39,0.06);
}

/* ── CTA ── */
.rxm_ctaRow {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}
.rxm_ctaPrimary {
  font-family: var(--rxm-font-head);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  background: var(--rxm-gold);
  color: #0b0814;
  border: none;
  padding: 14px 32px;
  border-radius: 3px;
  cursor: pointer;
  transition: background 0.2s, transform 0.2s, box-shadow 0.2s;
  box-shadow: 0 4px 24px rgba(201,162,39,0.35);
}
.rxm_ctaPrimary:hover {
  background: var(--rxm-gold-lt);
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(201,162,39,0.5);
}
.rxm_ctaGhost {
  font-family: var(--rxm-font-head);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  background: transparent;
  color: var(--rxm-white);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 10px;
  opacity: 0.7;
  transition: opacity 0.2s;
}
.rxm_ctaGhost:hover { opacity: 1; }
.rxm_playIcon {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  padding-left: 2px;
}

/* ════ RIGHT COL ════ */
.rxm_rightCol {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 500px;
}

/* Orbital rings */
.rxm_orbits {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.rxm_orbit {
  position: absolute;
  border-radius: 50%;
  border: 1px solid;
}
.rxm_o1 {
  width: 480px; height: 480px;
  border-color: rgba(201,162,39,0.08);
  animation: rxm_orbitSpin 30s linear infinite;
}
.rxm_o2 {
  width: 380px; height: 380px;
  border-color: rgba(201,162,39,0.06);
  animation: rxm_orbitSpin 20s linear infinite reverse;
}
.rxm_o3 {
  width: 280px; height: 280px;
  border-color: rgba(201,162,39,0.05);
  animation: rxm_orbitSpin 12s linear infinite;
}
@keyframes rxm_orbitSpin { to { transform: rotate(360deg); } }

/* Orbit nodes */
.rxm_orbitNode {
  position: absolute;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--rxm-gold);
  box-shadow: 0 0 10px var(--rxm-gold);
}
.rxm_on1 {
  top: calc(50% - 240px); left: 50%;
  transform: translateX(-50%);
  animation: rxm_nodeOrbit1 30s linear infinite;
  transform-origin: 4px 240px;
}
.rxm_on2 {
  top: calc(50% - 190px); left: 50%;
  width: 6px; height: 6px;
  transform: translateX(-50%);
  animation: rxm_nodeOrbit1 20s linear infinite reverse;
  transform-origin: 3px 190px;
  background: #fff;
  box-shadow: 0 0 8px #fff;
}
.rxm_on3 {
  top: calc(50% - 140px); left: 50%;
  width: 5px; height: 5px;
  transform: translateX(-50%);
  animation: rxm_nodeOrbit1 12s linear infinite;
  transform-origin: 2.5px 140px;
}
@keyframes rxm_nodeOrbit1 { to { transform: translateX(-50%) rotate(360deg); } }

/* Brain SVG */
.rxm_brainSvg {
  position: relative;
  z-index: 3;
  width: 420px;
  max-width: 90vw;
  filter: drop-shadow(0 0 40px rgba(201,162,39,0.2));
}

/* SVG animations */
.rxm_sphere {
  animation: rxm_spherePulse 4s ease-in-out infinite;
}
@keyframes rxm_spherePulse {
  0%,100% { filter: brightness(1); }
  50%      { filter: brightness(1.12); }
}

.rxm_corePulseEl {
  animation: rxm_coreFade 2.5s ease-in-out infinite;
}
@keyframes rxm_coreFade {
  0%,100% { opacity: 0.6; }
  50%      { opacity: 1; }
}

/* Ring animations */
.rxm_ring1El { animation: rxm_ring1Rot 8s  linear infinite; transform-origin: 200px 190px; }
.rxm_ring2El { animation: rxm_ring2Rot 12s linear infinite; transform-origin: 200px 190px; }
.rxm_ring3El { animation: rxm_ring3Rot 6s  linear infinite; transform-origin: 200px 190px; }

@keyframes rxm_ring1Rot { to { transform: rotateX(70deg) rotateZ(360deg); } }
@keyframes rxm_ring2Rot { to { transform: rotate(55deg) rotateX(70deg) rotateZ(-360deg); } }
@keyframes rxm_ring3Rot { to { transform: rotate(-40deg) rotateX(70deg) rotateZ(360deg); } }

/* Floating labels pulse */
.rxm_floatLabel {
  animation: rxm_labelFloat 5s ease-in-out infinite;
}
.rxm_fl1 { animation-delay: 0s; }
.rxm_fl2 { animation-delay: -1.5s; }
.rxm_fl3 { animation-delay: -3s; }
.rxm_fl4 { animation-delay: -4.5s; }
@keyframes rxm_labelFloat {
  0%,100% { opacity: 0.7; transform: translateY(0); }
  50%      { opacity: 1;   transform: translateY(-4px); }
}

/* Ring dots (orbit travelers) */
.rxm_ringDot {
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.rxm_rd1 { animation: rxm_rd1Anim 5s  linear infinite; }
.rxm_rd2 { animation: rxm_rd2Anim 8s  linear infinite; animation-delay: -2s; }
.rxm_rd3 { animation: rxm_rd3Anim 4s  linear infinite; animation-delay: -1s; }
.rxm_rd4 { animation: rxm_rd4Anim 11s linear infinite; animation-delay: -5s; }

@keyframes rxm_rd1Anim {
  0%   { cx: 348; cy: 160; }
  25%  { cx: 200; cy: 220; }
  50%  { cx: 52;  cy: 160; }
  75%  { cx: 200; cy: 160; }
  100% { cx: 348; cy: 160; }
}
@keyframes rxm_rd2Anim {
  0%   { cx: 200; cy: 137; }
  50%  { cx: 200; cy: 243; }
  100% { cx: 200; cy: 137; }
}
@keyframes rxm_rd3Anim {
  0%   { cx: 52;  cy: 190; }
  25%  { cx: 200; cy: 218; }
  50%  { cx: 348; cy: 190; }
  75%  { cx: 200; cy: 162; }
  100% { cx: 52;  cy: 190; }
}
@keyframes rxm_rd4Anim {
  0%   { cx: 290; cy: 145; }
  33%  { cx: 110; cy: 190; }
  66%  { cx: 290; cy: 235; }
  100% { cx: 290; cy: 145; }
}

.rxm_activeDot {
  animation: rxm_blink 1s ease-in-out infinite;
}
@keyframes rxm_blink {
  0%,100% { opacity: 0.9; }
  50%      { opacity: 0.2; }
}

/* ── TICKER ── */
.rxm_tickerWrap {
  position: relative;
  z-index: 10;
  width: 100%;
  background: rgba(201,162,39,0.06);
  border-top: 1px solid rgba(201,162,39,0.15);
  overflow: hidden;
  padding: 12px 0;
}
.rxm_tickerTrack {
  display: flex;
  width: max-content;
  animation: rxm_ticker 28s linear infinite;
  gap: 0;
}
.rxm_tickerItem {
  font-family: var(--rxm-font-head);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 3px;
  color: var(--rxm-gold);
  text-transform: uppercase;
  white-space: nowrap;
  padding: 0 32px;
  opacity: 0.7;
}
.rxm_tickerItem:nth-child(even) { color: rgba(255,255,255,0.4); }

@keyframes rxm_ticker {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ── RESPONSIVE ── */
@media (max-width: 960px) {
  .rxm_inner {
    grid-template-columns: 1fr;
    padding: 70px 32px;
    gap: 50px;
    min-height: auto;
  }
  .rxm_leftCol {
    padding-right: 0;
    order: 2;
  }
  .rxm_rightCol {
    order: 1;
    min-height: 340px;
  }
  .rxm_brainSvg {
    width: 320px;
  }
  .rxm_o1 { width: 360px; height: 360px; }
  .rxm_o2 { width: 280px; height: 280px; }
  .rxm_o3 { width: 200px; height: 200px; }
  .rxm_metricsRow {
    flex-direction: column;
    gap: 20px;
  }
  .rxm_metDivider {
    width: 100%; height: 1px;
    margin: 0;
  }
  .rxm_diag { display: none; }
}

@media (max-width: 560px) {
  .rxm_inner {
    padding: 50px 20px;
  }
  .rxm_hLine {
    font-size: clamp(40px, 11vw, 56px);
  }
  .rxm_brainSvg {
    width: 260px;
  }
  .rxm_ctaRow {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .rxm_o1 { width: 280px; height: 280px; }
  .rxm_o2 { display: none; }
  .rxm_o3 { display: none; }
}

/*Second Section CSS By Rishabh Ends*/

/*Third Section CSS By Rishabh Starts*/
/* ============================================================
   ML COMMAND TERMINAL — MACHINE LEARNING SECTION
   CSS  →  ml-terminal.css
   Fonts (add to <head>):
   <link href="https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,300;0,400;0,700;0,800;0,900;1,700&family=Barlow:wght@300;400;500&family=Share+Tech+Mono&display=swap" rel="stylesheet">
============================================================ */

/* ── TOKENS ── */
:root {
  --zqt-bg:        #08060f;
  --zqt-bg2:       #0e0b1c;
  --zqt-gold:      #c9a227;
  --zqt-gold-lt:   #e8c84a;
  --zqt-white:     #ffffff;
  --zqt-muted:     rgba(255,255,255,0.42);
  --zqt-border:    rgba(201,162,39,0.18);
  --zqt-glass:     rgba(201,162,39,0.04);
  --zqt-cyan:      #4af0c8;
  --zqt-purple:    #a066ff;
  --zqt-panel:     rgba(14,11,28,0.9);
  --zqt-font-h:    'Barlow Condensed', sans-serif;
  --zqt-font-b:    'Barlow', sans-serif;
  --zqt-font-m:    'Share Tech Mono', monospace;
}

/* ── SHELL ── */
.zqt_shell {
  position: relative;
  background: var(--zqt-bg);
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* ── BG LAYERS ── */
.zqt_bgDeep {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 70% 55% at 65% 45%, rgba(50,25,110,0.38), transparent 70%),
    radial-gradient(ellipse 50% 40% at 10% 90%, rgba(25,12,55,0.45), transparent),
    radial-gradient(ellipse 40% 35% at 90% 5%,  rgba(40,20,80,0.3),  transparent);
  pointer-events: none;
}

/* Subtle grid mesh */
.zqt_bgMesh {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(201,162,39,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201,162,39,0.04) 1px, transparent 1px);
  background-size: 60px 60px;
  pointer-events: none;
}

/* Film grain noise */
.zqt_bgNoise {
  position: absolute;
  inset: 0;
  opacity: 0.03;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4'/%3E%3C/filter%3E%3Crect width='256' height='256' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 180px;
  pointer-events: none;
  animation: zqt_noiseShift 0.15s steps(1) infinite;
}
@keyframes zqt_noiseShift {
  0%  { background-position: 0    0; }
  25% { background-position: -20px -10px; }
  50% { background-position: 10px  20px; }
  75% { background-position: -10px  5px; }
}

/* Scanbeam */
.zqt_scanbeam {
  position: absolute;
  left: 0; right: 0;
  height: 160px;
  background: linear-gradient(to bottom,
    transparent,
    rgba(201,162,39,0.035),
    rgba(201,162,39,0.055),
    rgba(201,162,39,0.035),
    transparent
  );
  animation: zqt_scanMove 10s linear infinite;
  pointer-events: none;
  z-index: 1;
}
@keyframes zqt_scanMove {
  0%   { top: -160px; }
  100% { top: 110%;   }
}

/* Corner brackets */
.zqt_corner {
  position: absolute;
  width: 36px;
  height: 36px;
  z-index: 5;
}
.zqt_cTL { top: 18px;    left: 18px;  border-top: 2px solid var(--zqt-gold); border-left:  2px solid var(--zqt-gold); }
.zqt_cTR { top: 18px;    right: 18px; border-top: 2px solid var(--zqt-gold); border-right: 2px solid var(--zqt-gold); }
.zqt_cBL { bottom: 18px; left: 18px;  border-bottom: 2px solid var(--zqt-gold); border-left:  2px solid var(--zqt-gold); }
.zqt_cBR { bottom: 18px; right: 18px; border-bottom: 2px solid var(--zqt-gold); border-right: 2px solid var(--zqt-gold); }

/* ── WRAP ── */
.zqt_wrap {
  position: relative;
  z-index: 10;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 48px;
  max-width: 1320px;
  width: 100%;
  margin: 0 auto;
  padding: 80px 56px;
  box-sizing: border-box;
  flex: 1;
  align-items: start;
}

/* ════ LEFT ════ */
.zqt_leftCol {
  display: flex;
  flex-direction: column;
  gap: 28px;
}

/* Eyebrow */
.zqt_eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--zqt-font-m);
  font-size: 11px;
  letter-spacing: 3px;
  color: var(--zqt-gold);
  text-transform: uppercase;
}
.zqt_eyeDash {
  display: inline-block;
  width: 28px;
  height: 2px;
  background: var(--zqt-gold);
}
.zqt_eyeLed {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #00ff88;
  box-shadow: 0 0 8px #00ff88;
  animation: zqt_ledBlink 1.1s ease-in-out infinite;
}
@keyframes zqt_ledBlink {
  0%,100% { opacity: 1; }
  50%      { opacity: 0.2; }
}

/* Headline */
.zqt_headline {
  margin: 0;
  display: flex;
  flex-direction: column;
  line-height: 0.9;
}
.zqt_hl {
  font-family: var(--zqt-font-h);
  font-weight: 900;
  font-size: clamp(58px, 6.5vw, 96px);
  letter-spacing: -1.5px;
  text-transform: uppercase;
  display: block;
}
.zqt_hlW { color: var(--zqt-white); }
.zqt_hlG {
  color: var(--zqt-gold);
  text-shadow: 0 0 50px rgba(201,162,39,0.4);
}

/* Body */
.zqt_body {
  font-family: var(--zqt-font-b);
  font-weight: 300;
  font-size: 15.5px;
  color: var(--zqt-muted);
  line-height: 1.78;
  max-width: 480px;
  margin: 0;
}

/* ── GRAPH ── */
.zqt_graphWrap {
  background: var(--zqt-glass);
  border: 1px solid var(--zqt-border);
  border-radius: 3px;
  padding: 18px 20px 14px;
  position: relative;
  overflow: hidden;
}
.zqt_graphWrap::before {
  content:'';
  position:absolute;
  top:0; left:0; right:0;
  height:1px;
  background: linear-gradient(90deg, transparent, var(--zqt-gold) 50%, transparent);
}

.zqt_graphHeader {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.zqt_gTitle {
  font-family: var(--zqt-font-m);
  font-size: 10px;
  letter-spacing: 3px;
  color: var(--zqt-muted);
  text-transform: uppercase;
}
.zqt_gLive {
  font-family: var(--zqt-font-m);
  font-size: 10px;
  letter-spacing: 2px;
  color: #00ff88;
  display: flex;
  align-items: center;
  gap: 6px;
}
.zqt_liveDot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #00ff88;
  box-shadow: 0 0 6px #00ff88;
  animation: zqt_ledBlink 0.9s ease-in-out infinite;
}

.zqt_graphBody {
  display: flex;
  gap: 8px;
  align-items: stretch;
}
.zqt_yAxis {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  font-family: var(--zqt-font-m);
  font-size: 9px;
  color: rgba(201,162,39,0.4);
  padding-bottom: 2px;
  min-width: 28px;
  text-align: right;
}
.zqt_chartSvg {
  flex: 1;
  height: 120px;
  display: block;
  overflow: visible;
}

.zqt_xAxis {
  display: flex;
  justify-content: space-between;
  font-family: var(--zqt-font-m);
  font-size: 9px;
  color: rgba(201,162,39,0.4);
  margin-top: 6px;
  padding-left: 36px;
}

/* ── STATS ── */
.zqt_statRow {
  display: flex;
  align-items: stretch;
  background: var(--zqt-glass);
  border: 1px solid var(--zqt-border);
  border-radius: 3px;
  padding: 16px 20px;
  position: relative;
  overflow: hidden;
}
.zqt_statRow::before {
  content:'';
  position:absolute;
  top:0; left:0; right:0;
  height:1px;
  background: linear-gradient(90deg, transparent, var(--zqt-gold) 50%, transparent);
}
.zqt_stat {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.zqt_statDiv {
  width: 1px;
  background: var(--zqt-border);
  align-self: stretch;
  margin: 0 8px;
}
.zqt_statNum {
  font-family: var(--zqt-font-h);
  font-size: 26px;
  font-weight: 700;
  color: var(--zqt-white);
  line-height: 1;
}
.zqt_statNum small {
  font-size: 14px;
  color: var(--zqt-gold);
}
.zqt_statLbl {
  font-family: var(--zqt-font-m);
  font-size: 9px;
  letter-spacing: 2px;
  color: var(--zqt-muted);
  text-transform: uppercase;
  text-align: center;
}

/* ════ RIGHT ════ */
.zqt_rightCol {
  display: flex;
  flex-direction: column;
}

.zqt_hudWrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
  background: var(--zqt-panel);
  border: 1px solid var(--zqt-border);
  border-radius: 4px;
  padding: 18px;
  position: relative;
  overflow: hidden;
}
.zqt_hudWrap::before {
  content:'';
  position:absolute;
  top:0; left:0; right:0;
  height:1px;
  background: linear-gradient(90deg, transparent, var(--zqt-gold) 50%, transparent);
}

/* HUD top bar */
.zqt_hudBar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid var(--zqt-border);
  padding-bottom: 12px;
}
.zqt_hudBarL {
  font-family: var(--zqt-font-m);
  font-size: 10px;
  letter-spacing: 3px;
  color: var(--zqt-gold);
  text-transform: uppercase;
}
.zqt_hudBarR {
  font-family: var(--zqt-font-m);
  font-size: 12px;
  color: var(--zqt-white);
  letter-spacing: 2px;
}

/* ── RADAR ── */
.zqt_radarWrap {
  position: relative;
  display: flex;
  justify-content: center;
  padding: 10px 0;
}
.zqt_radarSvg {
  width: 220px;
  height: 220px;
  max-width: 100%;
  filter: drop-shadow(0 0 24px rgba(201,162,39,0.15));
}

/* Radar sweep arm rotation */
.zqt_sweepRotate {
  animation: zqt_sweepSpin 3s linear infinite;
  transform-origin: 150px 150px;
}
@keyframes zqt_sweepSpin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
.zqt_sweepFade {
  animation: zqt_sweepFadeIn 3s linear infinite;
}
@keyframes zqt_sweepFadeIn {
  0%  { opacity: 0.6; }
  80% { opacity: 0.15; }
  100%{ opacity: 0.6; }
}

/* Blips */
.zqt_blip {
  animation: zqt_blipPulse 2.2s ease-in-out infinite;
}
.zqt_blip:nth-child(2) { animation-delay: -0.7s; }
.zqt_blip:nth-child(3) { animation-delay: -1.4s; }
.zqt_blip:nth-child(4) { animation-delay: -0.3s; }
.zqt_blip:nth-child(5) { animation-delay: -1.9s; }
@keyframes zqt_blipPulse {
  0%,100% { opacity: 0.3; r: 3; }
  50%      { opacity: 1;   r: 5; }
}

/* Radar core */
.zqt_radarCore {
  animation: zqt_coreGlow 1.5s ease-in-out infinite;
}
@keyframes zqt_coreGlow {
  0%,100% { opacity: 0.8; }
  50%      { opacity: 1; filter: drop-shadow(0 0 8px #c9a227); }
}
.zqt_corePing {
  animation: zqt_ping 2s ease-out infinite;
}
@keyframes zqt_ping {
  0%   { r: 12; opacity: 0.6; stroke-width: 1.5; }
  100% { r: 40; opacity: 0;   stroke-width: 0.5; }
}

/* Radar corner brackets */
.zqt_rBrk {
  position: absolute;
  width: 14px;
  height: 14px;
}
.zqt_rTL { top: 6px;    left: calc(50% - 110px); border-top: 1.5px solid var(--zqt-gold); border-left:  1.5px solid var(--zqt-gold); }
.zqt_rTR { top: 6px;    right:calc(50% - 110px); border-top: 1.5px solid var(--zqt-gold); border-right: 1.5px solid var(--zqt-gold); }
.zqt_rBL { bottom: 6px; left: calc(50% - 110px); border-bottom: 1.5px solid var(--zqt-gold); border-left:  1.5px solid var(--zqt-gold); }
.zqt_rBR { bottom: 6px; right:calc(50% - 110px); border-bottom: 1.5px solid var(--zqt-gold); border-right: 1.5px solid var(--zqt-gold); }

/* ── TERMINAL LOG ── */
.zqt_termWrap {
  background: rgba(0,0,0,0.55);
  border: 1px solid rgba(201,162,39,0.14);
  border-radius: 3px;
  overflow: hidden;
  font-family: var(--zqt-font-m);
}
.zqt_termHeader {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  background: rgba(201,162,39,0.06);
  border-bottom: 1px solid rgba(201,162,39,0.12);
}
.zqt_termDot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
}
.zqt_tdRed { background: #ff5f57; }
.zqt_tdYel { background: #febc2e; }
.zqt_tdGrn { background: #28c840; }
.zqt_termTitle {
  margin-left: 6px;
  font-size: 10px;
  letter-spacing: 2px;
  color: var(--zqt-muted);
  text-transform: uppercase;
}

.zqt_termBody {
  padding: 10px 14px;
  min-height: 120px;
  max-height: 140px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 11px;
  line-height: 1.5;
}
/* Log line colors injected by JS via inline style */

.zqt_termInput {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-top: 1px solid rgba(201,162,39,0.1);
}
.zqt_termPrompt {
  font-size: 11px;
  color: var(--zqt-gold);
}
.zqt_termCursor {
  width: 7px;
  height: 13px;
  background: var(--zqt-gold);
  animation: zqt_cursorBlink 1s step-end infinite;
}
@keyframes zqt_cursorBlink {
  0%,100% { opacity: 1; }
  50%      { opacity: 0; }
}

/* ── DIALS ── */
.zqt_dialRow {
  display: flex;
  justify-content: space-around;
  align-items: center;
  border-top: 1px solid var(--zqt-border);
  padding-top: 14px;
  gap: 12px;
}
.zqt_dialUnit {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.zqt_dialSvg {
  width: 68px;
  height: 68px;
}
.zqt_dialArc {
  transition: stroke-dashoffset 1.5s cubic-bezier(0.4,0,0.2,1);
}
.zqt_dialLbl {
  font-family: var(--zqt-font-h);
  font-size: 13px;
  font-weight: 700;
  color: var(--zqt-white);
  letter-spacing: 1px;
}

/* ── TICKER ── */
.zqt_ticker {
  position: relative;
  z-index: 10;
  width: 100%;
  overflow: hidden;
  background: rgba(201,162,39,0.05);
  border-top: 1px solid rgba(201,162,39,0.14);
  padding: 11px 0;
}
.zqt_tickerTrack {
  display: flex;
  width: max-content;
  animation: zqt_tickMove 35s linear infinite;
}
.zqt_tickItem {
  font-family: var(--zqt-font-h);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  white-space: nowrap;
  padding: 0 30px;
  color: rgba(255,255,255,0.35);
}
.zqt_tiG {
  color: var(--zqt-gold);
  opacity: 0.75;
}
@keyframes zqt_tickMove {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ── RESPONSIVE ── */
@media (max-width: 1024px) {
  .zqt_wrap {
    grid-template-columns: 1fr;
    padding: 60px 36px;
    gap: 40px;
  }
  .zqt_rightCol { order: 2; }
  .zqt_leftCol  { order: 1; }
  .zqt_body { max-width: 100%; }
}

@media (max-width: 640px) {
  .zqt_wrap { padding: 48px 20px; gap: 32px; }
  .zqt_hl { font-size: clamp(46px, 12vw, 68px); letter-spacing: -1px; }
  .zqt_statRow { flex-wrap: wrap; gap: 12px; }
  .zqt_statDiv { display: none; }
  .zqt_stat { flex: 0 0 40%; }
  .zqt_radarSvg { width: 180px; height: 180px; }
  .zqt_dialSvg { width: 56px; height: 56px; }
  .zqt_corner { width: 24px; height: 24px; }
}

/*Third Section CSS By Rishabh Ends*/