/* ClientsFlow · Dark — signature kinetic: gradient-mesh navy→blue, glassy cards,
   Montserrat + Inter (brand), count-up stats, moving-references hero. MOTION 7. */
:root{
  --font-display:'Montserrat',system-ui,sans-serif; --font-body:'InterCF','Inter',system-ui,sans-serif; --display-weight:800;
  --canvas:#0a0f1f; --ink:#eaf0ff; --ink-muted:#9fb0d0;
  --surface-1:#111a30; --surface-2:#16203a; --hairline:#243150; --hairline-strong:#33457a;
  --accent:#3d9bff; --accent-soft:rgba(61,155,255,.14);
  --btn-bg:linear-gradient(135deg,#2540e0,#2a54ff); --btn-ink:#fff; --btn-radius:12px;
  --btn-shadow:0 18px 40px -16px rgba(6,218,255,.55); --card-radius:18px;
  --card-shadow:0 24px 60px -30px rgba(0,0,0,.7); --ok:#37d9a0;
}
body{background:
  radial-gradient(1000px 560px at 78% -8%, rgba(42,84,255,.30), transparent 58%),
  radial-gradient(760px 520px at 8% 8%, rgba(6,218,255,.16), transparent 55%),
  var(--canvas);}
.hero h1{font-size:clamp(2.5rem,6vw,4.4rem);letter-spacing:-.02em;
  background:linear-gradient(120deg,#fff 40%,#9fd4ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.eyebrow{color:var(--accent);text-transform:uppercase;letter-spacing:.14em;font-size:.72rem}
.nav{background:rgba(10,15,31,.7);backdrop-filter:blur(12px);border-bottom:1px solid var(--hairline)}
.hero-inner{grid-template-columns:1.05fr .95fr;align-items:center}
@media(max-width:860px){.hero-inner{grid-template-columns:1fr}}
.card{background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border:1px solid var(--hairline);backdrop-filter:blur(8px)}
.card:hover{transform:translateY(-6px);border-color:var(--accent);box-shadow:0 30px 70px -34px rgba(6,218,255,.5)}
.icon-badge{background:linear-gradient(135deg,#2A54FF,#06DAFF);color:#fff}
.stats-sec{background:var(--surface-1);border-block:1px solid var(--hairline)}
.stat b{background:linear-gradient(120deg,#2A54FF,#06DAFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.pipeline{list-style:none;display:grid;gap:.8rem}
.step{display:flex;gap:1.1rem;padding:1.2rem 1.4rem;border:1px solid var(--hairline);border-radius:14px;background:var(--surface-1)}
.step-n{flex:0 0 auto;width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(135deg,#2A54FF,#06DAFF);color:#fff;font-weight:800}
.browser,.ref{background:var(--surface-1)}
.btn-ghost{border-color:var(--hairline-strong)}
.refbento-sec,.pricing-sec{background:var(--surface-1);border-block:1px solid var(--hairline)}
.testi .metric{background:linear-gradient(120deg,#2A54FF,#06DAFF);-webkit-background-clip:text;background-clip:text;color:transparent}
.ctaband{background:linear-gradient(120deg,rgba(42,84,255,.2),rgba(6,218,255,.12))}
.pricing .price-tag{background:linear-gradient(120deg,#fff,#9fd4ff);-webkit-background-clip:text;background-clip:text;color:transparent}