/* Flow AI — content pages (about, session replay, integrations, MCP docs, comparisons, legal). Same dark look as the landing. */
.nav .wm{display:flex;align-items:center;gap:8px;font:700 18px Inter,system-ui,sans-serif;letter-spacing:-.4px}.nav .wm img{height:16px}
.page{max-width:780px;margin:0 auto;padding:56px 20px 20px}
.crumb{font-size:13px;color:var(--dim);margin:0 0 18px}.crumb a{color:var(--mute)}.crumb a:hover{color:var(--text)}
.page h1{font-size:44px;line-height:1.08;letter-spacing:-1.6px;margin:0 0 16px;font-weight:800}
.page .lead{font-size:18.5px;line-height:1.6;color:var(--mute);margin:0 0 30px}
.page h2{font-size:26px;letter-spacing:-.7px;margin:46px 0 12px;line-height:1.2}
.page h3{font-size:18px;letter-spacing:-.3px;margin:26px 0 8px}
.page p,.page li{font-size:16px;line-height:1.72;color:#cfcfcf}
.page ul,.page ol{padding-left:22px}.page li{margin:6px 0}
.page a.link,.page p a,.page li a,.page td a{color:var(--text);text-decoration:underline;text-underline-offset:3px;text-decoration-color:#666}
.page strong,.page b{color:var(--text)}
.page code{font:500 14px 'JetBrains Mono',ui-monospace,monospace;background:var(--panel2);border:1px solid var(--line);border-radius:6px;padding:2px 6px;color:var(--text)}
.page pre{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 18px;overflow:auto;font:500 13.5px/1.6 'JetBrains Mono',ui-monospace,monospace;color:#e5e5e5}
.page pre code{background:none;border:0;padding:0}
.page table{width:100%;border-collapse:collapse;margin:16px 0;font-size:14.5px}
.page th,.page td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.page th{color:var(--mute);font-weight:600;font-size:13px}.page td{color:#d4d4d4}
.page .tw{overflow-x:auto;border:1px solid var(--line);border-radius:14px;padding:0 6px;margin:18px 0}
.page img.shot{width:100%;height:auto;border:1px solid var(--line);border-radius:16px;margin:18px 0;display:block}
.page .note{border:1px solid var(--line2);background:var(--panel);border-radius:14px;padding:14px 18px;color:var(--mute);font-size:14.5px}
.page .faq h3{margin-top:22px}
.cta-box{margin:48px 0 10px;padding:28px;border:1px solid var(--line2);border-radius:22px;background:linear-gradient(180deg,#151515,#0e0e0e);text-align:center}
.cta-box h2{margin:0 0 8px}.cta-box p{margin:0 0 18px;color:var(--mute)}
.cta-box .btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
footer.site-foot{padding:40px 0 60px;color:var(--dim);font-size:13px;border-top:1px solid var(--line);margin-top:70px}
footer.site-foot .container{display:flex;flex-direction:column;gap:14px}
footer.site-foot .links{display:flex;flex-wrap:wrap;gap:8px 18px}footer.site-foot .links a{color:var(--mute)}footer.site-foot .links a:hover{color:var(--text)}
footer.site-foot .wm{display:flex;align-items:center;gap:8px;font:700 17px Inter,system-ui,sans-serif;color:var(--text)}footer.site-foot .wm img{height:14px}
@media (max-width:700px){.page{padding-top:36px}.page h1{font-size:34px}.page .lead{font-size:17px}.nav-links{display:none}}

/* Kwop wordmark (header / footer) and the wordmark above the plans */
.wm img.kwm{height:15px!important;width:auto!important}
.kmark{margin:0 auto 18px;display:flex;justify-content:center}.kmark img{height:24px}