/* ===== PULSE PAGE-SPECIFIC STYLES ===== *//* Imports shared design system */@import url('../assets/styles/tokens.css?v=8');@import url('../assets/styles/base.css?v=8');@import url('../assets/styles/components.css?v=8');@import url('../assets/styles/theme-space.css?v=8');/* === STICKY NAV (Pulse-specific) === */.nav {  position: sticky;  top: calc(env(safe-area-inset-top) + 0px);  backdrop-filter: blur(var(--blur));  background: rgba(5,7,13,0.7);  z-index: 1000;  margin: 0 calc(var(--wrap-pad-inline) * -1);  padding-left: calc(var(--wrap-pad-inline) + env(safe-area-inset-left));  padding-right: calc(var(--wrap-pad-inline) + env(safe-area-inset-right));}/* === RADAR SECTION === */.radar {  text-align: center;}.radar-grid {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));  gap: var(--space-md);}/* === RADAR PREVIEW === */.radar-preview .section-title {  margin-bottom: var(--space-md);}.preview-layout {  display: grid;  grid-template-columns: 1.1fr 0.9fr;  gap: var(--space-lg);  align-items: stretch;}.preview-terminal {  border: 1px solid rgba(124,92,255,0.25);  border-radius: var(--radius-xl);  background: linear-gradient(135deg, rgba(15,20,37,0.85), rgba(10,14,26,0.75));  box-shadow: var(--shadow-md);  display: grid;  grid-template-rows: auto 1fr;  overflow: hidden;}.preview-head {  display: flex;  justify-content: space-between;  align-items: center;  padding: var(--space-md);  border-bottom: 1px solid rgba(124,92,255,0.2);}.stream-title {  font-size: var(--text-lg);  font-weight: 800;}.badge-live {  background: rgba(0,255,136,0.1);  border: 1px solid rgba(0,255,136,0.4);  color: var(--good);}.preview-stream {  padding: var(--space-md);  display: grid;  gap: 0.5rem;  background: radial-gradient(120% 100% at 20% 0%, rgba(124,92,255,0.08), transparent);  min-height: 260px;}.stream-row {  display: grid;  grid-template-columns: 70px 1fr auto;  gap: 0.75rem;  align-items: center;  padding: 0.65rem 0.75rem;  border-radius: var(--radius-md);  border: 1px solid rgba(124,92,255,0.2);  background: rgba(15,20,37,0.75);}.stream-line {  font-size: var(--text-sm);  color: var(--text);  letter-spacing: 0.01em;}.stream-row .sev {  width: 10px;  height: 10px;  border-radius: 50%;  background: var(--good);  box-shadow: 0 0 0 6px rgba(0,255,136,0.12);}.stream-row .sev.warn { background: #ffb800; box-shadow: 0 0 0 6px rgba(255,184,0,0.15); }.stream-row .sev.danger { background: #ff4757; box-shadow: 0 0 0 6px rgba(255,71,87,0.18); }.stream-meta {  display: flex;  gap: 0.5rem;  align-items: center;  font-size: var(--text-xs);  color: var(--text-muted);}.rule-panel {  border: 1px solid rgba(124,92,255,0.3);  border-radius: var(--radius-xl);  background: rgba(10,14,26,0.8);  box-shadow: var(--shadow-md);  padding: var(--space-lg);  display: grid;  gap: var(--space-md);  min-height: 100%;}.rule-head {  display: grid;  gap: 0.4rem;}.rule-pill {  display: inline-flex;  align-items: center;  gap: 0.5rem;  padding: 0.5rem 0.75rem;  border-radius: var(--radius-full);  background: rgba(124,92,255,0.14);  border: 1px solid rgba(124,92,255,0.35);  font-weight: 700;  font-size: var(--text-sm);}.rule-steps {  display: grid;  gap: 0.5rem;}.rule-step {  padding: 0.6rem 0.75rem;  border-radius: var(--radius-md);  border: 1px solid rgba(255,255,255,0.08);  background: rgba(15,20,37,0.7);  font-size: var(--text-sm);  color: var(--text);}.rule-step.active {  border-color: rgba(0,255,136,0.4);  box-shadow: 0 10px 30px rgba(0,255,136,0.18);}.rule-matrix {  display: grid;  grid-template-columns: repeat(2, 1fr);  gap: 0.5rem;}.rule-matrix div {  padding: 0.75rem;  border-radius: var(--radius-md);  border: 1px solid rgba(255,255,255,0.06);  background: rgba(5,7,13,0.7);  display: grid;  gap: 4px;}.rule-matrix span {  font-size: var(--text-2xs);  letter-spacing: 0.08em;  color: var(--text-muted);  text-transform: uppercase;}.rule-matrix strong {  font-size: var(--text-base);}.radar-card {  padding: 2rem 1.5rem;  border-radius: var(--radius-xl);  background: linear-gradient(135deg, rgba(15,20,37,0.8), rgba(10,14,26,0.6));  border: 1px solid rgba(255,255,255,0.08);  backdrop-filter: blur(var(--blur));  box-shadow: var(--shadow-md);  transition: all var(--transition);}.radar-card:hover {  transform: translateY(-4px);  border-color: rgba(124,92,255,0.3);  box-shadow: 0 20px 50px rgba(124,92,255,0.2);}.radar-icon {  font-size: 2.5rem;  margin-bottom: 1rem;}.radar-card h3 {  font-size: var(--text-lg);  font-weight: 800;  margin-bottom: 0.5rem;}.radar-card p {  font-size: var(--text-sm);  color: var(--text-muted);  line-height: var(--leading-relaxed);}/* === USE CASES === */.use-grid {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));  gap: 1rem;}.use-card {  padding: 1.5rem;  border-radius: var(--radius-lg);  background: rgba(15,20,37,0.6);  border: 1px solid rgba(255,255,255,0.06);  backdrop-filter: blur(8px);  transition: all var(--transition);}.use-card:hover {  transform: translateY(-3px);  background: rgba(15,20,37,0.8);  border-color: rgba(124,92,255,0.2);}.use-card h3 {  font-size: var(--text-lg);  font-weight: 800;  margin-bottom: 0.75rem;}.use-card p {  font-size: var(--text-sm);  color: var(--text-muted);  margin-bottom: 1rem;  line-height: var(--leading-relaxed);}.use-examples {  font-size: var(--text-xs);  color: var(--brand-glow);  font-weight: 600;  opacity: 0.9;}.use-badge {  display: inline-block;  padding: 0.375rem 0.75rem;  border-radius: var(--radius-md);  background: rgba(124,92,255,0.15);  color: var(--brand);  font-size: var(--text-xs);  font-weight: 800;  margin-bottom: 0.75rem;}/* === HOW IT WORKS === */.steps-grid {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));  gap: var(--space-lg);}.step-card {  padding: 2rem 1.5rem;  border-radius: var(--radius-lg);  background: linear-gradient(135deg, rgba(124,92,255,0.08), rgba(34,211,238,0.05));  border: 1px solid rgba(124,92,255,0.2);  transition: all var(--transition);}.step-card:hover {  transform: translateY(-4px);  border-color: rgba(124,92,255,0.4);  box-shadow: 0 16px 40px rgba(124,92,255,0.15);}.step-num {  display: inline-flex;  align-items: center;  justify-content: center;  width: 40px;  height: 40px;  border-radius: 50%;  background: linear-gradient(135deg, var(--brand), var(--brand-glow));  font-size: var(--text-lg);  font-weight: 900;  margin-bottom: 1rem;}.step-card h3 {  font-size: var(--text-xl);  font-weight: 800;  margin-bottom: 0.5rem;}.step-card p {  font-size: var(--text-sm);  color: var(--text-muted);  margin-bottom: 0;}/* === CODE EXAMPLES === */.code-card {  max-width: 800px;  margin: 0 auto;}.example-sub {  font-size: var(--text-sm);  color: var(--text-muted);  margin-bottom: var(--space-md);}.code-block {  padding: var(--space-lg);  border-radius: var(--radius-lg);  background: rgba(0,0,0,0.5);  border: 1px solid rgba(255,255,255,0.1);  font-family: "SF Mono", "Monaco", "Inconsolata", "Fira Code", monospace;  font-size: var(--text-sm);  line-height: 1.7;  overflow-x: auto;  white-space: pre;  color: #A8B3CF;}.btn-copy {  margin-top: 1rem;  background: rgba(124,92,255,0.15);  border-color: rgba(124,92,255,0.3);}/* === PROOF === */.proof-grid {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));  gap: var(--space-md);  margin-bottom: var(--space-lg);}.proof-card {  padding: var(--space-lg);  border-radius: var(--radius-lg);  background: rgba(15,20,37,0.6);  border: 1px solid rgba(255,255,255,0.06);  text-align: center;}.proof-icon {  font-size: 2rem;  margin-bottom: 0.75rem;}.proof-card h4 {  font-size: var(--text-base);  font-weight: 800;  margin-bottom: 0.5rem;}.proof-card p {  font-size: var(--text-sm);  color: var(--text-muted);  margin-bottom: 0;}.proof-footer {  text-align: center;  padding: 1rem;  border-radius: var(--radius-md);  background: rgba(124,92,255,0.08);  border: 1px solid rgba(124,92,255,0.15);  color: var(--text-muted);  font-size: var(--text-sm);  font-weight: 700;}/* === PRICING (Pulse-specific: billing toggle, tiers) === */.pricing-section {  padding: 3.75rem 0;}.pricing-header {  display: flex;  align-items: flex-start;  justify-content: space-between;  gap: var(--space-md);  margin-bottom: var(--space-xl);  flex-wrap: wrap;}.pricing-left {  flex: 1;}.pricing-sub {  font-size: var(--text-base);  color: var(--text-muted);  margin-top: 0.75rem;}.billing-toggle {  display: flex;  gap: 0.5rem;  padding: 0.375rem;  border-radius: var(--radius-full);  background: rgba(255,255,255,0.05);  border: 1px solid rgba(255,255,255,0.1);}.pill-btn {  padding: 0.625rem 1.25rem;  border-radius: var(--radius-full);  font-size: var(--text-sm);  font-weight: 800;  color: var(--text-muted);  background: transparent;  border: 1px solid transparent;  cursor: pointer;  transition: all var(--transition);}.pill-btn.on {  color: var(--text);  background: rgba(124,92,255,0.2);  border-color: rgba(124,92,255,0.3);}.pill-btn:hover {  color: var(--text);}.pricing-grid {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));  gap: var(--space-lg);}.price-card {  padding: 2rem 1.75rem;  border-radius: var(--radius-xl);  background: linear-gradient(135deg, rgba(15,20,37,0.9), rgba(10,14,26,0.7));  border: 1px solid rgba(255,255,255,0.08);  backdrop-filter: blur(var(--blur));  box-shadow: var(--shadow-md);  transition: all var(--transition);  position: relative;}.price-card:hover {  transform: translateY(-6px);  border-color: rgba(124,92,255,0.3);  box-shadow: 0 24px 60px rgba(124,92,255,0.25);}.price-card.featured {  border-color: rgba(124,92,255,0.4);  box-shadow: 0 20px 55px rgba(124,92,255,0.3);}.price-badge {  position: absolute;  top: 1.25rem;  right: 1.25rem;  padding: 0.375rem 0.75rem;  border-radius: var(--radius-full);  background: rgba(124,92,255,0.2);  border: 1px solid rgba(124,92,255,0.4);  font-size: 0.6875rem;  font-weight: 900;  text-transform: uppercase;  letter-spacing: 0.05em;  color: var(--brand);}.price-tier {  font-size: var(--text-2xl);  font-weight: 900;  margin-bottom: 0.5rem;}.price-desc {  font-size: var(--text-sm);  color: var(--text-muted);  margin-bottom: var(--space-md);}.price-features {  list-style: none;  margin-bottom: var(--space-lg);  font-size: var(--text-sm);  color: var(--text-muted);}.price-features li {  padding: 0.5rem 0;  border-bottom: 1px solid rgba(255,255,255,0.05);}.price-features li:last-child {  border-bottom: none;}.pricing-compare {  margin-top: var(--space-lg);  border: 1px solid rgba(255,255,255,0.08);  border-radius: var(--radius-lg);  overflow: hidden;  background: rgba(5,7,13,0.7);}.compare-row {  display: flex;  justify-content: space-between;  padding: 0.9rem 1.1rem;  border-bottom: 1px solid rgba(255,255,255,0.05);  font-size: var(--text-sm);  color: var(--text-muted);}.compare-row:last-child { border-bottom: none; }.compare-row span:first-child { letter-spacing: 0.08em; text-transform: uppercase; font-size: var(--text-2xs); color: var(--text-muted); }.compare-row span:last-child { color: var(--text); font-weight: 700; }/* === FAQ === */.faq-grid {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));  gap: var(--space-lg);}.faq-item {  padding: var(--space-lg);  border-radius: var(--radius-lg);  background: rgba(15,20,37,0.5);  border: 1px solid rgba(255,255,255,0.06);}.faq-item h4 {  font-size: var(--text-base);  font-weight: 800;  margin-bottom: 0.625rem;}.faq-item p {  font-size: var(--text-sm);  color: var(--text-muted);  line-height: var(--leading-normal);  margin-bottom: 0;}/* === PIPELINE === */.pipeline {  text-align: center;}.pipeline-flow {  display: flex;  justify-content: center;  align-items: center;  gap: var(--space-md);  margin-bottom: var(--space-lg);  flex-wrap: wrap;}.pipeline-step {  padding: var(--space-lg);  border-radius: var(--radius-lg);  border: 1px solid rgba(255,255,255,0.08);  background: rgba(15,20,37,0.7);  transition: all var(--transition);  cursor: pointer;  min-width: 140px;  display: grid;  gap: 0.5rem;  text-align: center;}.pipeline-step:hover,.pipeline-step:focus-visible {  border-color: rgba(124,92,255,0.5);  box-shadow: 0 10px 40px rgba(124,92,255,0.25);  transform: translateY(-4px);}.pipeline-step.active {  border-color: rgba(0,255,136,0.6);  box-shadow: 0 15px 50px rgba(0,255,136,0.3);}.step-icon {  font-size: 2rem;  line-height: 1;}.step-label {  font-size: var(--text-base);  font-weight: 800;  color: var(--text-bright);}.step-desc {  font-size: var(--text-xs);  color: var(--text-muted);}.pipeline-arrow {  font-size: 1.5rem;  color: var(--text-muted);}.pipeline-example {  max-width: 600px;  margin: 0 auto;  padding: var(--space-lg);  border-radius: var(--radius-lg);  border: 1px solid rgba(255,255,255,0.08);  background: rgba(10,14,26,0.8);}.code-label {  font-size: var(--text-xs);  text-transform: uppercase;  letter-spacing: 0.08em;  color: var(--text-muted);  margin-bottom: 0.75rem;}.example-code pre {  font-family: 'Courier New', monospace;  font-size: var(--text-sm);  line-height: var(--leading-relaxed);  color: var(--text);  text-align: left;  margin: 0;  white-space: pre-wrap;}#examplePayload {  transition: opacity 0.15s ease;}/* === SAMPLES === */.samples {  text-align: center;}.samples-grid {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));  gap: var(--space-lg);}.sample-card {  border-radius: var(--radius-lg);  border: 1px solid rgba(255,255,255,0.08);  background: rgba(15,20,37,0.7);  overflow: hidden;}.sample-head {  padding: var(--space-md);  border-bottom: 1px solid rgba(255,255,255,0.08);  font-weight: 800;  font-size: var(--text-sm);  text-align: center;}.sample-body {  padding: var(--space-lg);}.sample-code {  font-family: 'Courier New', monospace;  font-size: var(--text-xs);  line-height: var(--leading-relaxed);  color: var(--text);  text-align: left;  margin: 0;}.severity {  width: 10px;  height: 10px;  border-radius: 50%;  margin-bottom: 0.5rem;}.severity.good {  background: var(--good);  box-shadow: 0 0 0 6px rgba(0,255,136,0.12);}.signal-head {  display: flex;  justify-content: space-between;  align-items: center;  margin-bottom: 0.5rem;}.signal-sym {  font-weight: 800;  font-size: var(--text-lg);}.signal-time {  font-size: var(--text-xs);  color: var(--text-muted);}.signal-reason {  font-size: var(--text-sm);  color: var(--text);  margin-bottom: 0.75rem;}.signal-actions {  display: flex;  gap: 0.5rem;  font-size: var(--text-xs);  color: var(--text-muted);}.signal-actions span {  cursor: pointer;  transition: color var(--transition);}.signal-actions span:hover {  color: var(--text-bright);}.audit-row {  display: grid;  gap: 0.5rem;}.audit-row > div {  display: flex;  justify-content: space-between;  padding: 0.5rem;  border-radius: var(--radius-sm);  background: rgba(10,14,26,0.6);}.audit-row span {  font-size: var(--text-xs);  color: var(--text-muted);}.audit-row strong {  font-size: var(--text-sm);  font-weight: 700;  color: var(--text);}/* === RESPONSIVE === */@media (max-width: 768px) {  .nav {    flex-direction: column;    gap: 1rem;    padding: 1.25rem 1rem;  }    .preview-layout {    grid-template-columns: 1fr;  }    .pricing-header {    flex-direction: column;  }    .billing-toggle {    align-self: flex-start;  }    .pipeline-flow {    flex-direction: column;    align-items: stretch;  }    .pipeline-arrow {    transform: rotate(90deg);  }}