.vflow-region {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: var(--vflow-height, 520px);
  background: #050609;
  color: #f2f2f7;
}
.vflow-region[data-mode="white"] { background: #f7f7f9; color: #17192b; }
.vflow-region[data-mode="gray"] {
  background: radial-gradient(circle at 62% 45%, #f1f2f4 0%, #b9bbc2 52%, #777b86 100%);
  color: #17192b;
}
.vflow-image, .vflow-wash, .vflow-canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.vflow-image { background-size: cover; background-repeat: no-repeat; z-index: 0; }
.vflow-wash {
  z-index: 1;
  background: linear-gradient(90deg, rgb(0 0 0 / var(--vflow-overlay, 0)) 0%, transparent 82%);
}
.vflow-region[data-tone="dark"] .vflow-wash {
  background: linear-gradient(90deg, rgb(255 255 255 / var(--vflow-overlay, 0)) 0%, transparent 82%);
}
.vflow-canvas { z-index: 2; }
.vflow-content {
  position: relative;
  z-index: 3;
  min-height: var(--vflow-height, 520px);
  padding: clamp(24px, 4vw, 64px);
  box-sizing: border-box;
}
@media (max-width: 640px) {
  .vflow-wash {
    background: linear-gradient(180deg, rgb(0 0 0 / var(--vflow-overlay, 0)) 0%, transparent 72%);
  }
  .vflow-region[data-tone="dark"] .vflow-wash {
    background: linear-gradient(180deg, rgb(255 255 255 / var(--vflow-overlay, 0)) 0%, transparent 72%);
  }
}