/* Clear security symbols and connectors on the dark security sections. */
body[data-page="security"] .security-flow-icon { width: 32px; height: 32px; stroke-width: 1.7; }
body[data-page="security"] .layer-item .icon-circle,
body[data-page="security"] .workflow-card .icon-circle {
  background: #09243a;
  border-color: #287caa;
  box-shadow: 0 0 20px rgba(27, 168, 224, .1);
}
body[data-page="security"] .layer-grid::before { display: none; }
body[data-page="security"] .layer-item:not(:last-child)::after {
  content: '';
  position: absolute;
  left: 76px;
  top: 29px;
  width: calc(100% - 70px);
  height: 2px;
  background: linear-gradient(90deg, #2378bc, #22c9d5);
  opacity: .65;
}
body[data-page="security"] .workflow-row .connector {
  height: 2px;
  width: 100%;
  border: 0;
  background: linear-gradient(90deg, #2388e7, #24d8df);
  box-shadow: 0 0 10px rgba(36, 216, 223, .15);
}
body[data-page="security"] .workflow-row .connector::after {
  content: '';
  width: 9px;
  height: 9px;
  border-top: 2px solid #24d8df;
  border-right: 2px solid #24d8df;
  right: 0;
  top: 50%;
  bottom: auto;
  transform: translateY(-50%) rotate(45deg);
}
@media (max-width: 800px) {
  body[data-page="security"] .workflow-row .connector { width: 2px; height: 32px; margin: 10px auto; background: linear-gradient(#2388e7, #24d8df); }
  body[data-page="security"] .workflow-row .connector::after { top: auto; bottom: 0; right: 50%; transform: translateX(50%) rotate(135deg); }
}
@media (max-width: 800px) {
  body[data-page="security"] .layer-item:not(:last-child)::after { left: 29px; top: 72px; width: 2px; height: calc(100% - 62px); background: linear-gradient(#2378bc, #22c9d5); }
}