/* Developers: Enterprise ile aynı düzen mantığı, kendi koyu dünyası */
html[data-sn="dev"] { --sn-bg:#0a0c0f; --sn-line:#1b2027; --sn-text:#c8ced8; --sn-strong:#fff; --sn-hover:rgba(255,255,255,.1); --sn-cta:#fff; --sn-cta-text:#0a0a0a; --d-max:1320px; }
html[data-sn="dev"] .top { background:#0a0c0f; }
html[data-sn="dev"] nav:has(.nav-inner) { background:#0a0c0f; }
html[data-sn="dev"] .nav-logo img { filter:brightness(0) invert(1); }
html[data-sn="dev"] .nav-panel, html[data-sn="dev"] .vp-dd-inner { background:#fff; border-color:#e8e8e8; }
html[data-sn="dev"] .vp-dd-panel a { color:#0a0a0a; }
html[data-sn="dev"] .vp-dd-panel a:hover { color:#1c2bff; }
html[data-sn="dev"] .vp-dd-label { color:#6b6b6b; }
html[data-sn="dev"] .nav-mobile { background:#fff; }
html[data-sn="dev"] .nav-mobile a { color:#0a0a0a; border-color:#e8e8e8; }
html[data-sn="dev"] .nav-hamburger span { background:#fff; }
html[data-sn="dev"] .wrap { padding:0 48px; }
html[data-sn="dev"] .top .subbar { padding-left:max(48px, calc((100vw - 1320px) / 2 + 48px)); }
html[data-sn="dev"] h1 { font-size:clamp(38px,4.2vw,60px); font-weight:800; letter-spacing:-1.3px; line-height:1.08; }
html[data-sn="dev"] h2 { font-size:clamp(28px,2.8vw,40px); font-weight:800; letter-spacing:-.7px; line-height:1.15; margin-bottom:0; }
html[data-sn="dev"] h3 { font-size:19px; font-weight:800; letter-spacing:-.2px; }
html[data-sn="dev"] p { max-width:none; font-size:16.5px; line-height:1.65; }
html[data-sn="dev"] section { padding:84px 0; border-bottom:0; }
html[data-sn="dev"] section:nth-of-type(even) { background:#0f1216; }
html[data-sn="dev"] .btn { font-family:var(--d-text); font-size:14px; font-weight:600; letter-spacing:-.01em; padding:11px 22px; border-radius:4px; }
html[data-sn="dev"] .btn-primary { background:#1c2bff; }
html[data-sn="dev"] .btn-primary:hover { background:#1c2bff; opacity:.86; }
html[data-sn="dev"] .btn-ghost { border-color:#3a4150; color:#fff; }
html[data-sn="dev"] .hero { padding:88px 0 92px; border-bottom:0; }
html[data-sn="dev"] .hero .wrap { display:grid; grid-template-columns:1fr 1fr; column-gap:64px; align-items:start; }
html[data-sn="dev"] .hero .wrap > * { grid-column:1; }
html[data-sn="dev"] .hero-code { grid-column:2 !important; grid-row:1 / span 6; align-self:center; min-width:0; }
html[data-sn="dev"] .hero-code pre { margin:0; }
html[data-sn="dev"] .hero .lede { font-size:18px; line-height:1.6; }
html[data-sn="dev"] .d-split .wrap { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.7fr); column-gap:64px; }
html[data-sn="dev"] .d-split .wrap > * { grid-column:2; min-width:0; }
html[data-sn="dev"] .d-split .wrap > h2 { grid-column:1; grid-row:1 / span 30; position:sticky; top:150px; align-self:start; }
html[data-sn="dev"] .d-center .wrap { text-align:center; }
html[data-sn="dev"] .d-center h2 { margin-bottom:18px; }
html[data-sn="dev"] .d-center .wrap > p { max-width:880px; margin:0 auto 44px; font-size:18px; }
html[data-sn="dev"] .figure { text-align:start; margin:0; }
html[data-sn="dev"] .figure figcaption { text-align:center; margin-top:14px; }
html[data-sn="dev"] .flow { max-width:1120px; margin:0 auto; }
html[data-sn="dev"] .card { background:#14181e; border:1px solid #232833; border-radius:16px; padding:24px; }
html[data-sn="dev"] .card p { font-size:15.5px; margin-bottom:0; }
html[data-sn="dev"] .grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
html[data-sn="dev"] table { width:100%; }
html[data-sn="dev"] .d-access { background:#000 !important; }
html[data-sn="dev"] .d-access .wrap { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.7fr); column-gap:64px; }
html[data-sn="dev"] .d-access .wrap > * { grid-column:2; }
html[data-sn="dev"] .d-access .wrap > h2 { grid-column:1; grid-row:1 / span 8; }
html[data-sn="dev"] footer { border-top:1px solid #1a1a1a; }

/* Akış animasyonu: 8 saniyelik döngü, çizim yerinde kalır */
.flow > path[fill="none"][stroke] { opacity:.32; }
.flow-live .fp { fill:none; stroke-width:4; stroke-linecap:round; stroke-dasharray:16 200; stroke-dashoffset:16; filter:drop-shadow(0 0 5px currentColor); }
.fp-r { stroke:#ff8a78; color:#ff8a78; animation:fp-r 8s linear infinite; }
.fp-g { stroke:#5ff0b0; color:#5ff0b0; animation:fp-g 8s linear infinite; }
.fp-b { stroke:#5ff0b0; color:#5ff0b0; animation:fp-b 8s linear infinite; }
@keyframes fp-r { 0%,4% { stroke-dashoffset:16; } 26%,100% { stroke-dashoffset:-104; } }
@keyframes fp-g { 0%,42% { stroke-dashoffset:16; } 60%,100% { stroke-dashoffset:-104; } }
@keyframes fp-b { 0%,60% { stroke-dashoffset:16; } 80%,100% { stroke-dashoffset:-104; } }
.flow rect[x="176"][y="221"] { animation:f-draft 8s ease-in-out infinite; }
@keyframes f-draft { 0%,8% { opacity:1; } 30%,88% { opacity:.45; } 100% { opacity:1; } }
.flow rect[x="226"][y="448"] { animation:f-in 8s ease-in-out infinite; }
@keyframes f-in { 0%,24% { opacity:.4; } 30%,36% { opacity:1; } 44%,100% { opacity:.4; } }
.flow rect[x="324"][y="448"], .flow path[d="M398,453 l4,4 l8,-9"] { animation:f-out 8s ease-in-out infinite; }
@keyframes f-out { 0%,34% { opacity:.4; } 42%,50% { opacity:1; } 62%,100% { opacity:.4; } }
.flow .cust rect[fill="var(--d-green)"], .flow .cust path[stroke="var(--d-green)"] { animation:f-cust 8s ease-in-out infinite; }
@keyframes f-cust { 0%,76% { opacity:.4; } 84%,94% { opacity:1; } 100% { opacity:.4; } }
@media (prefers-reduced-motion: reduce) { .flow-live { display:none; } .flow > path[fill="none"][stroke] { opacity:1; } .flow * { animation:none !important; } }
@media (max-width:960px) {
  html[data-sn="dev"] .wrap { padding:0 24px; }
  html[data-sn="dev"] .hero .wrap, html[data-sn="dev"] .d-split .wrap, html[data-sn="dev"] .d-access .wrap { grid-template-columns:minmax(0,1fr); }
  html[data-sn="dev"] .hero-code, html[data-sn="dev"] .d-split .wrap > *, html[data-sn="dev"] .d-access .wrap > * { grid-column:1 !important; grid-row:auto !important; }
  html[data-sn="dev"] .d-split .wrap > h2 { position:static; margin-bottom:18px; }
  html[data-sn="dev"] .hero-code { margin-top:28px; }
  html[data-sn="dev"] .grid.three { grid-template-columns:minmax(0,1fr); }
  html[data-sn="dev"] section { padding:56px 0; }
}

/* Tam akış, 10 saniye: müşteri soruyor, sistem yazıyor, VerbaPulse kontrol ediyor, müşteri yanıt alıyor */
.fp-in { stroke:#8fb0ff; color:#8fb0ff; animation:fp-in 10s linear infinite; }
.fp-r { animation:fp-r 10s linear infinite; }
.fp-g { animation:fp-g 10s linear infinite; }
.fp-b { animation:fp-b 10s linear infinite; }
@keyframes fp-in { 0%,2% { stroke-dashoffset:-104; } 15%,100% { stroke-dashoffset:16; } }
@keyframes fp-r { 0%,32% { stroke-dashoffset:16; } 46%,100% { stroke-dashoffset:-104; } }
@keyframes fp-g { 0%,58% { stroke-dashoffset:16; } 71%,100% { stroke-dashoffset:-104; } }
@keyframes fp-b { 0%,73% { stroke-dashoffset:16; } 88%,100% { stroke-dashoffset:-104; } }
.flow .cust circle[r="24"] { animation:f-ask 10s ease-in-out infinite; }
@keyframes f-ask { 0%,4% { stroke:#8fb0ff; } 12%,86% { stroke:var(--d-line); } 92%,100% { stroke:#5ff0b0; } }
.flow g[transform="translate(134,128)"], .flow g[transform="translate(300,128)"], .flow g[transform="translate(466,128)"] { animation:f-src 10s ease-in-out infinite; }
.flow g[transform="translate(300,128)"] { animation-delay:.35s; }
.flow g[transform="translate(466,128)"] { animation-delay:.7s; }
@keyframes f-src { 0%,13% { opacity:.45; } 17%,23% { opacity:1; filter:drop-shadow(0 0 7px #4d7cff); } 29%,100% { opacity:.45; filter:none; } }
.flow rect[x="72"][y="221"] { animation:f-b1 10s ease-in-out infinite; }
.flow rect[x="176"][y="221"]:not(.f-clean) { animation:f-b2 10s ease-in-out infinite; }
.flow rect[x="316"][y="221"] { animation:f-b3 10s ease-in-out infinite; }
@keyframes f-b1 { 0%,17% { opacity:.25; } 21%,100% { opacity:.75; } }
@keyframes f-b2 { 0%,21% { opacity:.25; } 26%,100% { opacity:1; } }
@keyframes f-b3 { 0%,26% { opacity:.2; } 30%,100% { opacity:.75; } }
.f-clean { fill:var(--d-green); opacity:0; animation:f-clean 10s ease-in-out infinite; }
@keyframes f-clean { 0%,69% { opacity:0; } 73%,96% { opacity:1; } 100% { opacity:0; } }
.flow rect[x="226"][y="448"] { animation:f-in 10s ease-in-out infinite; }
@keyframes f-in { 0%,44% { opacity:.4; } 47%,52% { opacity:1; } 57%,100% { opacity:.4; } }
.flow rect[x="324"][y="448"], .flow path[d="M398,453 l4,4 l8,-9"], .flow path[d="M298,453 h14"] { animation:f-out 10s ease-in-out infinite; }
@keyframes f-out { 0%,50% { opacity:.4; } 56%,62% { opacity:1; } 70%,100% { opacity:.4; } }
.flow .cust rect[fill="var(--d-green)"], .flow .cust path[stroke="var(--d-green)"] { animation:f-cust 10s ease-in-out infinite; }
.flow .cust rect[fill="var(--d-ink-dim)"] { animation:f-custg 10s ease-in-out infinite; }
@keyframes f-cust { 0%,86% { opacity:.25; } 91%,97% { opacity:1; } 100% { opacity:.25; } }
@keyframes f-custg { 0%,3% { opacity:.9; } 12%,86% { opacity:.3; } 92%,97% { opacity:.7; } 100% { opacity:.9; } }
@media (prefers-reduced-motion: reduce) { .f-clean { display:none; } }
.flow rect.f-clean[x="176"][y="221"] { animation:f-clean 10s ease-in-out infinite; }
html[data-sn="dev"] .figure figcaption { text-align:start; max-width:1120px; margin:14px auto 0; }
