/* ==========================================================================
   xCRM For Business v2 — xcrm-page-for-buisness2.php
   Prefix: xcrm-b2- / xcrm-b2__  ·  Reuses hp__ header from xcrm-home.css
   Unique animated SVGs per section, gated by [data-reveal].is-visible.
   ========================================================================== */

/* ── Keyframes ── */
@keyframes b2-rise { from { opacity:0; transform:translateY(22px); } to { opacity:1; transform:translateY(0); } }
@keyframes b2-fade { from { opacity:0; } to { opacity:1; } }
@keyframes b2-draw { to { stroke-dashoffset:0; } }
@keyframes b2-bar-grow { from { transform:scaleY(0); } to { transform:scaleY(1); } }
@keyframes b2-dot-pop { 0% { opacity:0; transform:scale(0); } 70% { transform:scale(1.25); } 100% { opacity:1; transform:scale(1); } }
@keyframes b2-badge-pop { 0% { opacity:0; transform:scale(0.4); } 70% { transform:scale(1.08); } 100% { opacity:1; transform:scale(1); } }
@keyframes b2-chip-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-6px); } }
@keyframes b2-ring-pulse { 0%,100% { transform:scale(1); opacity:0.5; } 50% { transform:scale(1.08); opacity:0.2; } }
@keyframes b2-ping { 0% { transform:scale(0.5); opacity:0.9; } 100% { transform:scale(2.4); opacity:0; } }
@keyframes b2-orbit { 0%,100% { transform:translate(0,0); } 25% { transform:translate(8px,-12px); } 50% { transform:translate(-4px,-18px); } 75% { transform:translate(-10px,-6px); } }
@keyframes b2-float-soft { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-7px); } }
@keyframes b2-row-in { from { opacity:0; transform:translateX(-16px); } to { opacity:1; transform:translateX(0); } }
@keyframes b2-card-in { from { opacity:0; transform:translateY(16px) scale(0.97); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes b2-morph { 0%,100% { border-radius:42% 58% 70% 30%/45% 45% 55% 55%; transform:scale(1); } 33% { border-radius:60% 40% 30% 70%/60% 30% 70% 40%; transform:scale(1.05); } 66% { border-radius:30% 70% 55% 45%/40% 60% 40% 60%; transform:scale(0.96); } }
@keyframes b2-grad-shift { 0%,100% { background-position:0% 50%; } 50% { background-position:100% 50%; } }
@keyframes b2-wave-out { 0% { stroke-dashoffset:1; opacity:0.15; } 40% { opacity:1; } 100% { stroke-dashoffset:0; opacity:0.35; } }
@keyframes b2-bell-ring { 0%,100% { transform:rotate(0deg); } 20% { transform:rotate(12deg); } 40% { transform:rotate(-10deg); } 60% { transform:rotate(6deg); } 80% { transform:rotate(-4deg); } }
@keyframes b2-cluster-in { from { opacity:0; transform:scale(0.7); } to { opacity:1; transform:scale(1); } }
@keyframes b2-funnel-fill { from { transform:scaleX(0); } to { transform:scaleX(1); } }

/* ── Base ── */
.xcrm-b2 { font-family:var(--x-font-sans); background:var(--x-bg); color:var(--x-text); direction:rtl; min-height:100vh; overflow-x:hidden; transition:background-color 0.45s var(--x-ease-smooth), color 0.45s var(--x-ease-smooth); }
.xcrm-b2 *, .xcrm-b2 *::before, .xcrm-b2 *::after { box-sizing:border-box; }
.xcrm-b2__inner { max-width:1120px; margin:0 auto; padding-inline:clamp(20px,4vw,40px); }
.xcrm-b2__section { padding:clamp(72px,10vw,112px) 0; position:relative; }
.xcrm-b2__section--surface { background:var(--x-surface); transition:background-color 0.45s ease; }
.xcrm-b2-anim { opacity:0; animation:b2-rise 0.7s var(--x-ease-standard) forwards; }
.xcrm-b2-anim--1 { animation-delay:0.08s; } .xcrm-b2-anim--2 { animation-delay:0.18s; } .xcrm-b2-anim--3 { animation-delay:0.3s; } .xcrm-b2-anim--4 { animation-delay:0.42s; }

/* ── Typography ── */
.xcrm-b2__eyebrow { display:inline-flex; align-items:center; gap:8px; font-size:0.8rem; font-weight:700; color:var(--x-primary); padding:6px 14px; background:var(--x-soft-primary); border-radius:999px; margin:0 0 12px; width:fit-content; }
.dark .xcrm-b2__eyebrow { color:#a5b4fc; }
.xcrm-b2__h1 { font-size:clamp(1.85rem,4.6vw,3rem); font-weight:800; line-height:1.3; letter-spacing:-0.03em; color:var(--x-text); margin:0 0 18px; }
.xcrm-b2__h2 { font-size:clamp(1.4rem,3.2vw,2.15rem); font-weight:800; line-height:1.35; letter-spacing:-0.02em; color:var(--x-text); margin:0 0 14px; }
.xcrm-b2__lead { font-size:clamp(0.98rem,1.9vw,1.1rem); color:var(--x-text-highlight); line-height:1.9; margin:0 0 28px; max-width:540px; }
.xcrm-b2__lead strong { color:var(--x-text); font-weight:800; }
.xcrm-b2__desc { font-size:clamp(0.92rem,1.7vw,1.02rem); color:var(--x-text-highlight); line-height:1.85; margin:0; max-width:640px; }
.xcrm-b2__head { text-align:center; max-width:640px; margin:0 auto clamp(36px,5vw,56px); display:flex; flex-direction:column; align-items:center; }
.xcrm-b2__head .xcrm-b2__desc { margin-inline:auto; }
.xcrm-b2__note { font-size:0.75rem; color:var(--x-text-muted); text-align:center; margin:16px 0 0; }
.xcrm-b2__center-cta { text-align:center; margin-top:clamp(28px,4vw,40px); }

/* ── Buttons ── */
.xcrm-b2__btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:13px 26px; border-radius:11px; font-family:inherit; font-size:0.9rem; font-weight:700; text-decoration:none; cursor:pointer; border:1.5px solid transparent; white-space:nowrap; transition:background-color var(--x-dur-220) ease, border-color var(--x-dur-220) ease, color var(--x-dur-220) ease, transform var(--x-dur-220) var(--x-ease-standard), box-shadow var(--x-dur-220) ease; }
.xcrm-b2__btn:hover { transform:translateY(-2px); }
.xcrm-b2__btn--primary { background:var(--x-primary); color:#fff; box-shadow:var(--x-shadow-primary); }
.xcrm-b2__btn--primary:hover { background:var(--x-primary-hover); box-shadow:var(--x-shadow-primary-lg); }
.xcrm-b2__btn--secondary { background:var(--x-base); color:var(--x-text); border-color:var(--x-border); }
.xcrm-b2__btn--secondary:hover { border-color:var(--x-primary); color:var(--x-primary); }
.xcrm-b2__btn--on-dark { background:#fff; color:var(--x-primary); box-shadow:0 4px 20px rgba(0,0,0,0.15); }
.xcrm-b2__btn--on-dark:hover { background:rgba(255,255,255,0.92); }
.xcrm-b2__btn--ghost-light { background:transparent; color:#fff; border-color:rgba(255,255,255,0.45); }
.xcrm-b2__btn--ghost-light:hover { border-color:#fff; background:rgba(255,255,255,0.12); }
.xcrm-b2__text-link { display:inline-flex; align-items:center; gap:7px; margin-top:20px; font-size:0.88rem; font-weight:700; color:var(--x-primary); text-decoration:none; transition:gap var(--x-dur-220) ease; }
.xcrm-b2__text-link:hover { gap:12px; }
.xcrm-b2__text-link svg { transition:transform var(--x-dur-220) var(--x-ease-standard); }
.xcrm-b2__text-link:hover svg { transform:translateX(-4px); }

/* ── Checklist ── */
.xcrm-b2__checklist { list-style:none; margin:20px 0 0; padding:0; display:flex; flex-direction:column; gap:11px; }
.xcrm-b2__checklist li { position:relative; padding-right:28px; font-size:0.9rem; font-weight:600; color:var(--x-text); line-height:1.65; }
.xcrm-b2__checklist li::before { content:''; position:absolute; right:0; top:0.3em; width:17px; height:17px; border-radius:50%; background-color:var(--x-soft-primary); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236366F1' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E"); background-size:9px; background-repeat:no-repeat; background-position:center; }
.dark .xcrm-b2__checklist li::before { background-color:rgba(99,102,241,0.22); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A5B4FC' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E"); }

/* ── Grids / Split ── */
.xcrm-b2__grid-4 { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.xcrm-b2__split { display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,64px); align-items:center; }
.xcrm-b2__split--rev .xcrm-b2__split-copy { order:2; } .xcrm-b2__split--rev .xcrm-b2__split-visual { order:1; }

/* ── Cards ── */
.xcrm-b2__card { background:var(--x-base); border:1px solid var(--x-border-subtle); border-radius:var(--x-radius-lg); padding:24px 22px; position:relative; overflow:hidden; transition:border-color var(--x-dur-220) ease, box-shadow var(--x-dur-220) ease, transform var(--x-dur-220) var(--x-ease-standard), background-color 0.45s ease; opacity:0; }
[data-reveal].is-visible .xcrm-b2__card { animation:b2-card-in 0.6s var(--x-ease-standard) forwards; }
[data-reveal].is-visible .xcrm-b2__card:nth-child(1) { animation-delay:0.05s; } [data-reveal].is-visible .xcrm-b2__card:nth-child(2) { animation-delay:0.12s; } [data-reveal].is-visible .xcrm-b2__card:nth-child(3) { animation-delay:0.19s; } [data-reveal].is-visible .xcrm-b2__card:nth-child(4) { animation-delay:0.26s; }
.xcrm-b2__card:hover { border-color:rgba(99,102,241,0.32); box-shadow:var(--x-shadow-soft), var(--x-glow-primary-sm); transform:translateY(-3px); }
.xcrm-b2__card::after { content:''; position:absolute; top:0; right:0; left:0; height:3px; background:var(--x-gradient-primary); transform:scaleX(0); transform-origin:right; transition:transform 0.35s var(--x-ease-standard); }
.xcrm-b2__card:hover::after { transform:scaleX(1); }
.xcrm-b2__card-icon { width:44px; height:44px; border-radius:12px; background:var(--x-soft-primary); color:var(--x-primary); display:flex; align-items:center; justify-content:center; margin-bottom:16px; transition:transform 0.35s var(--x-ease-standard); }
.xcrm-b2__card:hover .xcrm-b2__card-icon { transform:scale(1.1) rotate(-6deg); }
.xcrm-b2__card-icon--warn { background:var(--x-soft-warn); color:var(--x-accent-warn); } .xcrm-b2__card-icon--info { background:var(--x-soft-info); color:var(--x-accent-info); } .xcrm-b2__card-icon--success { background:var(--x-soft-success); color:var(--x-accent-success); }
.xcrm-b2__card-title { font-size:0.98rem; font-weight:800; color:var(--x-text); margin:0 0 8px; line-height:1.45; }
.xcrm-b2__card-desc { font-size:0.85rem; color:var(--x-text-highlight); line-height:1.8; margin:0; }

/* ── Deco blobs ── */
.xcrm-b2__deco { position:absolute; width:300px; height:300px; border-radius:50%; filter:blur(80px); opacity:0.12; pointer-events:none; z-index:0; animation:b2-morph 16s ease-in-out infinite; }
.xcrm-b2__deco--indigo { background:radial-gradient(circle, var(--x-primary), transparent 70%); } .xcrm-b2__deco--cyan { background:radial-gradient(circle, var(--x-cyan), transparent 70%); } .xcrm-b2__deco--purple { background:radial-gradient(circle, var(--x-purple), transparent 70%); }
.xcrm-b2__section > .xcrm-b2__inner { position:relative; z-index:1; }

/* ══════════════════════════════════════════
   HERO
   ══════════════════════════════════════════ */
.xcrm-b2__hero { position:relative; padding:130px 0 80px; overflow:hidden; }
.xcrm-b2__hero-bg { position:absolute; inset:0; pointer-events:none; }
.xcrm-b2__grid { position:absolute; inset:0; opacity:0.7; mask-image:radial-gradient(ellipse at 60% 30%, black 10%, transparent 65%); -webkit-mask-image:radial-gradient(ellipse at 60% 30%, black 10%, transparent 65%); }
.xcrm-b2__ring { position:absolute; left:50%; top:45%; border:1px solid rgba(99,102,241,0.12); border-radius:50%; transform:translate(-50%,-50%); animation:b2-ring-pulse 9s ease-in-out infinite; }
.dark .xcrm-b2__ring { border-color:rgba(99,102,241,0.1); }
.xcrm-b2__ring--1 { width:420px; height:420px; } .xcrm-b2__ring--2 { width:620px; height:620px; animation-delay:1.5s; border-style:dashed; } .xcrm-b2__ring--3 { width:840px; height:840px; animation-delay:3s; opacity:0.5; }
.xcrm-b2__orb { position:absolute; width:10px; height:10px; border-radius:50%; background:var(--x-primary); opacity:0.4; animation:b2-orbit 8s ease-in-out infinite; }
.xcrm-b2__orb--1 { top:12%; right:8%; } .xcrm-b2__orb--2 { bottom:18%; left:6%; width:7px; height:7px; background:var(--x-cyan); animation-delay:-2s; } .xcrm-b2__orb--3 { top:40%; left:12%; width:6px; height:6px; background:var(--x-purple); animation-delay:-4s; } .xcrm-b2__orb--4 { bottom:25%; right:20%; width:5px; height:5px; background:var(--x-pink); animation-delay:-6s; }
.xcrm-b2__hero-inner { position:relative; display:grid; grid-template-columns:0.85fr 1.15fr; gap:clamp(32px,4vw,48px); align-items:center; max-width:1280px; margin:0 auto; padding-inline:clamp(20px,4vw,40px); }
.xcrm-b2__hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
.xcrm-b2__hero-visual { position:relative; width:100%; }

/* Hero flow SVG */
.xcrm-b2-flow { display:block; width:100%; height:auto; }

/* Orbital rings */
.b2f-orbit { fill:none; stroke:var(--x-primary); stroke-width:0.8; opacity:0; transform-origin:center; transform-box:fill-box; }
.b2f-orbit--1 { stroke-dasharray:8 10; }
.b2f-orbit--2 { stroke-dasharray:4 12; }
.b2f-orbit--3 { stroke-dasharray:2 14; }
.xcrm-b2-anim .b2f-orbit--1 { animation:b2-ring-pulse 8s ease-in-out 0.3s infinite; opacity:0.35; }
.xcrm-b2-anim .b2f-orbit--2 { animation:b2-ring-pulse 10s ease-in-out 1.2s infinite; opacity:0.22; }
.xcrm-b2-anim .b2f-orbit--3 { animation:b2-ring-pulse 12s ease-in-out 2.1s infinite; opacity:0.14; }

/* Hub core */
.b2f-hub-core { opacity:0; transform-origin:center; transform-box:fill-box; }
.xcrm-b2-anim .b2f-hub-core { animation:b2-badge-pop 0.6s ease 0.15s forwards; }
.b2f-hub-ring { fill:none; stroke:rgba(255,255,255,0.3); stroke-width:1.5; opacity:0; transform-origin:center; transform-box:fill-box; }
.b2f-hub-ring--2 { stroke-dasharray:4 6; }
.xcrm-b2-anim .b2f-hub-ring { animation:b2-ring-pulse 3s ease-in-out 0.5s infinite; }
.xcrm-b2-anim .b2f-hub-ring--2 { animation-delay:1s; }

/* Connection paths */
.b2f-link { stroke-dasharray:1; stroke-dashoffset:1; }
.xcrm-b2-anim .b2f-link { animation:b2-draw 1s var(--x-ease-standard) forwards; }
.xcrm-b2-anim .b2f-link--1 { animation-delay:0.3s; }
.xcrm-b2-anim .b2f-link--2 { animation-delay:0.45s; }
.xcrm-b2-anim .b2f-link--3 { animation-delay:0.6s; }
.xcrm-b2-anim .b2f-link--4 { animation-delay:0.75s; }
.xcrm-b2-anim .b2f-link--5 { animation-delay:0.9s; }
.xcrm-b2-anim .b2f-link--6 { animation-delay:1.05s; }

/* Particles (inbound + outbound) */
.b2f-particle { opacity:0; }
.xcrm-b2-anim .b2f-particle { animation:b2-fade 0.5s ease forwards; }
.xcrm-b2-anim .b2f-particle--1 { animation-delay:1.3s; }
.xcrm-b2-anim .b2f-particle--2 { animation-delay:1.6s; }
.xcrm-b2-anim .b2f-particle--3 { animation-delay:1.9s; }
.xcrm-b2-anim .b2f-particle--4 { animation-delay:2.2s; }
.xcrm-b2-anim .b2f-particle--5 { animation-delay:2.5s; }
.xcrm-b2-anim .b2f-particle--6 { animation-delay:2.8s; }

/* Node backgrounds */
.b2f-node-bg { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; opacity:0; }
.b2f-node-bg--panel { fill:var(--x-base); stroke:var(--x-primary); stroke-width:1.5; }
.b2f-node-bg--sale { stroke:var(--x-success); stroke-width:1.5; }
.xcrm-b2-anim .b2f-node--visitor .b2f-node-bg { animation:b2-badge-pop 0.5s ease 0.2s forwards; }
.xcrm-b2-anim .b2f-node--identify .b2f-node-bg { animation:b2-badge-pop 0.5s ease 0.4s forwards; }
.xcrm-b2-anim .b2f-node--profile .b2f-node-bg { animation:b2-badge-pop 0.5s ease 0.6s forwards; }
.xcrm-b2-anim .b2f-node--segment .b2f-node-bg { animation:b2-badge-pop 0.5s ease 0.8s forwards; }
.xcrm-b2-anim .b2f-node--auto .b2f-node-bg { animation:b2-badge-pop 0.5s ease 1s forwards; }
.xcrm-b2-anim .b2f-node--chan .b2f-node-bg { animation:b2-badge-pop 0.5s ease 1.2s forwards; }

/* Node outer rings */
.b2f-node-ring { fill:none; stroke:var(--x-primary); stroke-width:1; opacity:0; transform-origin:center; transform-box:fill-box; }
.b2f-node-ring--green { stroke:var(--x-success); }
.xcrm-b2-anim .b2f-node--visitor .b2f-node-ring { animation:b2-ring-pulse 4s ease-in-out 0.6s infinite; }
.xcrm-b2-anim .b2f-node--identify .b2f-node-ring { animation:b2-ring-pulse 4s ease-in-out 0.8s infinite; }
.xcrm-b2-anim .b2f-node--segment .b2f-node-ring { animation:b2-ring-pulse 4s ease-in-out 1s infinite; }
.xcrm-b2-anim .b2f-node--auto .b2f-node-ring { animation:b2-ring-pulse 4s ease-in-out 1.2s infinite; }

/* Panel header */
.b2f-panel-header { fill:var(--x-primary); opacity:0.12; }

/* Labels */
.b2f-label { fill:var(--x-text-muted); font-size:10px; font-weight:700; font-family:var(--x-font-sans); opacity:0; }
.xcrm-b2-anim .b2f-node--visitor .b2f-label { animation:b2-fade 0.4s ease 0.35s forwards; }
.xcrm-b2-anim .b2f-node--identify .b2f-label { animation:b2-fade 0.4s ease 0.55s forwards; }
.xcrm-b2-anim .b2f-node--profile .b2f-label { animation:b2-fade 0.4s ease 0.75s forwards; }
.xcrm-b2-anim .b2f-node--segment .b2f-label { animation:b2-fade 0.4s ease 0.95s forwards; }
.xcrm-b2-anim .b2f-node--auto .b2f-label { animation:b2-fade 0.4s ease 1.15s forwards; }
.xcrm-b2-anim .b2f-node--chan .b2f-label { animation:b2-fade 0.4s ease 1.35s forwards; }
.b2f-label--sale { fill:var(--x-accent-success); font-weight:800; }

/* Line sm */
.b2f-line-sm { fill:var(--x-text-muted); opacity:0.3; }
.b2f-line-sm--faint { opacity:0.15; }

/* Eye */
.b2f-eye { stroke-dasharray:1; stroke-dashoffset:1; }
.xcrm-b2-anim .b2f-eye { animation:b2-draw 0.5s ease 0.6s forwards; }

/* Seg ring */
.b2f-seg-ring { fill:none; stroke:var(--x-primary); stroke-width:1; opacity:0; transform-origin:center; transform-box:fill-box; }
.xcrm-b2-anim .b2f-seg-ring { animation:b2-ring-pulse 3s ease-in-out 1.1s infinite; }

/* Check */
.b2f-check { stroke-dasharray:1; stroke-dashoffset:1; }
.xcrm-b2-anim .b2f-check { animation:b2-draw 0.4s ease 1.6s forwards; }

/* Glow */
.b2f-glow { opacity:0; }
.xcrm-b2-anim .b2f-glow { animation:b2-fade 1.5s ease 0.2s forwards; }

/* Dots */
.b2f-dot { opacity:0; }
.xcrm-b2-anim .b2f-dot--1 { animation:b2-dot-pop 0.3s ease 0.5s forwards, b2-float-soft 3s ease-in-out 1s infinite; }
.xcrm-b2-anim .b2f-dot--2 { animation:b2-dot-pop 0.3s ease 0.8s forwards, b2-float-soft 3.5s ease-in-out 1.3s infinite; }
.xcrm-b2-anim .b2f-dot--3 { animation:b2-dot-pop 0.3s ease 1.1s forwards, b2-float-soft 4s ease-in-out 1.6s infinite; }
.xcrm-b2-anim .b2f-dot--4 { animation:b2-dot-pop 0.3s ease 1.4s forwards, b2-float-soft 3.5s ease-in-out 1.9s infinite; }
.xcrm-b2-anim .b2f-dot--5 { animation:b2-dot-pop 0.3s ease 1.7s forwards, b2-float-soft 4s ease-in-out 2.2s infinite; }
.xcrm-b2-anim .b2f-dot--6 { animation:b2-dot-pop 0.3s ease 2s forwards, b2-float-soft 3.5s ease-in-out 2.5s infinite; }
.xcrm-b2-anim .b2f-dot--7 { animation:b2-dot-pop 0.3s ease 2.3s forwards, b2-float-soft 4s ease-in-out 2.8s infinite; }

/* Plus decorations */
.b2f-plus { opacity:0; }
.xcrm-b2-anim .b2f-plus--1 { animation:b2-badge-pop 0.4s ease 1.8s forwards, b2-float-soft 4s ease-in-out 2.4s infinite; }
.xcrm-b2-anim .b2f-plus--2 { animation:b2-badge-pop 0.4s ease 2s forwards, b2-float-soft 4.5s ease-in-out 2.6s infinite; }
.xcrm-b2-anim .b2f-plus--3 { animation:b2-badge-pop 0.4s ease 2.2s forwards, b2-float-soft 5s ease-in-out 2.8s infinite; }
.xcrm-b2-anim .b2f-plus--4 { animation:b2-badge-pop 0.4s ease 2.4s forwards, b2-float-soft 4.2s ease-in-out 3s infinite; }
.b2f-label--sale { fill:var(--x-accent-success); font-weight:800; }
.b2f-line-sm { fill:var(--x-text-muted); opacity:0.3; }
.b2f-check { stroke-dasharray:1; stroke-dashoffset:1; }
.xcrm-b2-anim .b2f-check { animation:b2-draw 0.4s ease 2.3s forwards; }
.b2f-dot { opacity:0; }
.xcrm-b2-anim .b2f-dot--1 { animation:b2-dot-pop 0.3s ease 0.6s forwards, b2-float-soft 3s ease-in-out 1s infinite; }
.xcrm-b2-anim .b2f-dot--2 { animation:b2-dot-pop 0.3s ease 1s forwards, b2-float-soft 3.5s ease-in-out 1.4s infinite; }
.xcrm-b2-anim .b2f-dot--3 { animation:b2-dot-pop 0.3s ease 1.4s forwards, b2-float-soft 4s ease-in-out 1.8s infinite; }

/* ══════════════════════════════════════════
   SVG SHARED
   ══════════════════════════════════════════ */
.xcrm-b2-svg { display:block; width:100%; height:auto; }
.xcrm-b2__split-visual { border-radius:var(--x-radius-2xl); overflow:hidden; }
.xcrm-b2__seg-visual, .xcrm-b2__chart-wrap, .xcrm-b2__hub-visual { border-radius:var(--x-radius-2xl); overflow:hidden; max-width:900px; margin:0 auto; }

/* Profiles SVG */
.b2p-card { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; opacity:0; }
[data-reveal].is-visible .b2p-card { animation:b2-card-in 0.5s ease 0.1s forwards; }
.b2p-avatar { opacity:0; }
[data-reveal].is-visible .b2p-avatar { animation:b2-badge-pop 0.5s ease 0.25s forwards; }
.b2p-ring { fill:none; stroke:var(--x-primary); stroke-width:1.5; opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2p-ring { animation:b2-ring-pulse 3s ease-in-out 0.5s infinite; }
.b2p-line { fill:var(--x-text-muted); opacity:0; }
[data-reveal].is-visible .b2p-line--1 { animation:b2-row-in 0.4s ease 0.35s forwards; } [data-reveal].is-visible .b2p-line--2 { animation:b2-row-in 0.4s ease 0.42s forwards; }
[data-reveal].is-visible .b2p-line--3 { animation:b2-row-in 0.4s ease 0.5s forwards; } [data-reveal].is-visible .b2p-line--4 { animation:b2-row-in 0.4s ease 0.57s forwards; } [data-reveal].is-visible .b2p-line--5 { animation:b2-row-in 0.4s ease 0.64s forwards; }
.b2p-pill { opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2p-pill { animation:b2-badge-pop 0.35s ease 0.45s forwards; }
.b2p-tag { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2p-tag-bg { fill:var(--x-soft-primary); } .b2p-tag-t { fill:var(--x-primary); font-size:9px; font-weight:700; font-family:var(--x-font-sans); }
.dark .b2p-tag-t { fill:#a5b4fc; }
[data-reveal].is-visible .b2p-tag--1 { animation:b2-badge-pop 0.35s ease 0.75s forwards; } [data-reveal].is-visible .b2p-tag--2 { animation:b2-badge-pop 0.35s ease 0.88s forwards; } [data-reveal].is-visible .b2p-tag--3 { animation:b2-badge-pop 0.35s ease 1s forwards; }
.b2p-tl-dot { fill:var(--x-primary); opacity:0; }
[data-reveal].is-visible .b2p-tl-dot { animation:b2-badge-pop 0.3s ease 1.1s forwards; }
.b2p-tl-line { stroke:var(--x-border); stroke-width:2; stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2p-tl-line { animation:b2-draw 0.7s ease 1.2s forwards; }

/* Follow-ups SVG */
.b2fu-cal { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; opacity:0; }
[data-reveal].is-visible .b2fu-cal { animation:b2-card-in 0.5s ease 0.1s forwards; }
.b2fu-cal-head { fill:var(--x-primary); opacity:0.85; opacity:0; }
[data-reveal].is-visible .b2fu-cal-head { animation:b2-fade 0.4s ease 0.3s forwards; }
.b2fu-cal-dot { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2fu-cal-dot--active { fill:var(--x-primary); } .b2fu-cal-dot--1,.b2fu-cal-dot--2,.b2fu-cal-dot--3,.b2fu-cal-dot--4,.b2fu-cal-dot--5,.b2fu-cal-dot--6 { fill:var(--x-border); }
[data-reveal].is-visible .b2fu-cal-dot { animation:b2-dot-pop 0.3s ease forwards; }
[data-reveal].is-visible .b2fu-cal-dot--1 { animation-delay:0.5s; } [data-reveal].is-visible .b2fu-cal-dot--2 { animation-delay:0.55s; } [data-reveal].is-visible .b2fu-cal-dot--3 { animation-delay:0.6s; } [data-reveal].is-visible .b2fu-cal-dot--4 { animation-delay:0.65s; } [data-reveal].is-visible .b2fu-cal-dot--5 { animation-delay:0.7s; } [data-reveal].is-visible .b2fu-cal-dot--6 { animation-delay:0.75s; } [data-reveal].is-visible .b2fu-cal-dot--active { animation-delay:0.85s; }
.b2fu-bell-path { stroke:var(--x-primary); stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2fu-bell-path { animation:b2-draw 0.8s ease 0.4s forwards; }
.b2fu-bell-clapper { fill:var(--x-primary); opacity:0; }
[data-reveal].is-visible .b2fu-bell-clapper { animation:b2-badge-pop 0.3s ease 1s forwards; }
.b2fu-nbadge { opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2fu-nbadge { animation:b2-badge-pop 0.35s ease 1.2s forwards; }
.b2fu-task { opacity:0; transform:translateX(-8px); }
[data-reveal].is-visible .b2fu-task--1 { animation:b2-row-in 0.4s ease 1.3s forwards; } [data-reveal].is-visible .b2fu-task--2 { animation:b2-row-in 0.4s ease 1.45s forwards; }
.b2fu-task-bg { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1; }
.b2fu-task-dot--done { fill:var(--x-success); } .b2fu-task-dot--active { fill:var(--x-primary); }
.b2fu-task-l { fill:var(--x-text-muted); opacity:0.3; }
.b2fu-link { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2fu-link { animation:b2-draw 0.5s ease 1s forwards; }

/* Segmentation SVG */
.b2s-label { fill:var(--x-text-muted); font-size:11px; font-weight:700; font-family:var(--x-font-sans); }
.b2s-cluster { fill:none; stroke-width:1.5; stroke-dasharray:4 4; opacity:0; transform-origin:center; transform-box:fill-box; }
.b2s-cluster--src { stroke:var(--x-border); } .b2s-cluster--a { stroke:var(--x-primary); } .b2s-cluster--b { stroke:var(--x-cyan); } .b2s-cluster--c { stroke:var(--x-warn); }
[data-reveal].is-visible .b2s-cluster--src { animation:b2-cluster-in 0.5s ease 0.2s forwards; }
[data-reveal].is-visible .b2s-cluster--a { animation:b2-cluster-in 0.5s ease 0.5s forwards; }
[data-reveal].is-visible .b2s-cluster--b { animation:b2-cluster-in 0.5s ease 0.65s forwards; }
[data-reveal].is-visible .b2s-cluster--c { animation:b2-cluster-in 0.5s ease 0.8s forwards; }
.b2s-node { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2s-node--src { fill:var(--x-text-muted); } .b2s-node--a { fill:var(--x-primary); } .b2s-node--b { fill:var(--x-cyan); } .b2s-node--c { fill:var(--x-warn); }
[data-reveal].is-visible .b2s-node { animation:b2-dot-pop 0.35s ease 0.4s forwards; }
.b2s-flow { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2s-flow--1 { animation:b2-draw 0.6s ease 0.6s forwards; }
[data-reveal].is-visible .b2s-flow--2 { animation:b2-draw 0.6s ease 0.75s forwards; }
[data-reveal].is-visible .b2s-flow--3 { animation:b2-draw 0.6s ease 0.9s forwards; }
[data-reveal].is-visible .b2s-flow--4 { animation:b2-draw 0.5s ease 1.2s forwards; }
[data-reveal].is-visible .b2s-flow--5 { animation:b2-draw 0.5s ease 1.3s forwards; }
[data-reveal].is-visible .b2s-flow--6 { animation:b2-draw 0.5s ease 1.4s forwards; }
.b2s-lbl { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2s-lbl-bg { fill:var(--x-base); stroke:var(--x-border); stroke-width:1; }
.b2s-lbl-t { fill:var(--x-text); font-size:10px; font-weight:700; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2s-lbl--a { animation:b2-badge-pop 0.35s ease 1s forwards; }
[data-reveal].is-visible .b2s-lbl--b { animation:b2-badge-pop 0.35s ease 1.1s forwards; }
[data-reveal].is-visible .b2s-lbl--c { animation:b2-badge-pop 0.35s ease 1.2s forwards; }
.b2s-camp { fill:var(--x-base); stroke:var(--x-primary); stroke-width:1.5; opacity:0; }
.b2s-camp-t { fill:var(--x-text); font-size:12px; font-weight:800; font-family:var(--x-font-sans); }
.b2s-camp-s { fill:var(--x-text-muted); font-size:9px; font-weight:600; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2s-camp { animation:b2-badge-pop 0.4s ease 1.6s forwards; }

/* Analytics SVG — detailed infinite dashboard */
.b2a-frame { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; }
.b2a-header { fill:var(--x-primary); opacity:0.04; }
.b2a-header-t { fill:var(--x-text-muted); font-size:10px; font-weight:700; font-family:var(--x-font-sans); }
.b2a-glow { opacity:0; }
[data-reveal].is-visible .b2a-glow { animation:b2-fade 1.2s ease 0.3s forwards; }

/* KPI cards */
.b2a-kpi { opacity:0; transform:translateY(8px); }
.b2a-kpi-bg { fill:var(--x-surface); stroke:var(--x-border-subtle); stroke-width:1; }
.b2a-kpi-l { fill:var(--x-text-muted); font-size:7.5px; font-weight:600; font-family:var(--x-font-sans); }
.b2a-kpi-v { fill:var(--x-text); font-size:14px; font-weight:800; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2a-kpi--1 { animation:b2-card-in 0.4s ease 0.3s forwards; }
[data-reveal].is-visible .b2a-kpi--2 { animation:b2-card-in 0.4s ease 0.4s forwards; }
[data-reveal].is-visible .b2a-kpi--3 { animation:b2-card-in 0.4s ease 0.5s forwards; }
[data-reveal].is-visible .b2a-kpi--4 { animation:b2-card-in 0.4s ease 0.6s forwards; }
[data-reveal].is-visible .b2a-kpi--5 { animation:b2-card-in 0.4s ease 0.7s forwards; }
[data-reveal].is-visible .b2a-kpi--6 { animation:b2-card-in 0.4s ease 0.8s forwards; }


/* Chart titles */
.b2a-chart-t { fill:var(--x-text-muted); font-size:9px; font-weight:700; font-family:var(--x-font-sans); }
.b2a-axis { stroke:var(--x-border); stroke-width:1; opacity:0.5; }

/* Bars — infinite grow/shrink */
.b2a-bar { transform-origin:center bottom; transform-box:fill-box; opacity:0; animation:b2a-bar-loop 4s ease-in-out infinite; animation-delay:calc(var(--i,0) * 0.15s); }
.b2a-bar--1 { fill:var(--x-primary); opacity:0.4; } .b2a-bar--2 { fill:var(--x-primary); opacity:0.5; }
.b2a-bar--3 { fill:var(--x-info); opacity:0.45; } .b2a-bar--4 { fill:var(--x-primary); opacity:0.6; }
.b2a-bar--5 { fill:var(--x-success); opacity:0.5; } .b2a-bar--6 { fill:var(--x-purple); opacity:0.55; }
.b2a-bar--7 { fill:var(--x-primary); opacity:0.5; }
@keyframes b2a-bar-loop {
  0%,100% { transform:scaleY(0.6); opacity:0.35; }
  50% { transform:scaleY(1); opacity:0.7; }
}

/* Bar labels */
.b2a-bar-l { fill:var(--x-text-muted); font-size:6.5px; font-weight:600; font-family:var(--x-font-sans); }

/* Line chart — infinite redraw */
.b2a-area { opacity:0; }
[data-reveal].is-visible .b2a-area { animation:b2-fade 0.8s ease 1s forwards; }
.b2a-line { stroke-dasharray:1; stroke-dashoffset:1; animation:b2a-line-loop 5s ease-in-out infinite; }
@keyframes b2a-line-loop {
  0% { stroke-dashoffset:1; opacity:0.4; }
  40% { stroke-dashoffset:0; opacity:1; }
  80% { stroke-dashoffset:0; opacity:1; }
  95% { stroke-dashoffset:0; opacity:0.3; }
  100% { stroke-dashoffset:1; opacity:0.3; }
}

/* Line dots — infinite pop */
.b2a-dot { fill:var(--x-cyan); stroke:var(--x-base); stroke-width:2; opacity:0; transform-origin:center; transform-box:fill-box; animation:b2a-dot-loop 5s ease-in-out infinite; animation-delay:calc(var(--i,0) * 0.2s); }
@keyframes b2a-dot-loop {
  0%,5% { opacity:0; transform:scale(0); }
  15% { opacity:1; transform:scale(1.3); }
  25% { opacity:1; transform:scale(1); }
  80% { opacity:1; transform:scale(1); }
  95%,100% { opacity:0; transform:scale(0.5); }
}

/* Pulse on last dot */
.b2a-pulse { fill:none; stroke:var(--x-success); stroke-width:1.5; opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2a-pulse { animation:b2-ring-pulse 2.5s ease-in-out 2s infinite; }

/* Donut chart */
.b2a-donut-bg { fill:none; stroke:var(--x-border-subtle); stroke-width:14; opacity:0.5; }
.b2a-donut { stroke-dasharray:1; stroke-dashoffset:1; opacity:0; }
[data-reveal].is-visible .b2a-donut--1 { animation:b2-draw 0.8s ease 0.8s forwards; }
[data-reveal].is-visible .b2a-donut--2 { animation:b2-draw 0.8s ease 1s forwards; }
[data-reveal].is-visible .b2a-donut--3 { animation:b2-draw 0.8s ease 1.2s forwards; }
[data-reveal].is-visible .b2a-donut--4 { animation:b2-draw 0.8s ease 1.4s forwards; }
.b2a-donut-c { fill:var(--x-text); font-size:16px; font-weight:800; font-family:var(--x-font-sans); }
.b2a-donut-l { fill:var(--x-text-muted); font-size:8px; font-weight:600; font-family:var(--x-font-sans); }

/* Funnel */
.b2a-funnel { opacity:0; transform-origin:right center; transform-box:fill-box; }
.b2a-funnel--1 { fill:var(--x-primary); opacity:0.6; } .b2a-funnel--2 { fill:var(--x-info); opacity:0.5; }
.b2a-funnel--3 { fill:var(--x-warn); opacity:0.5; } .b2a-funnel--4 { fill:var(--x-success); opacity:0.6; }
[data-reveal].is-visible .b2a-funnel--1 { animation:b2a-funnel-loop 3.5s ease-in-out 0.5s infinite; }
[data-reveal].is-visible .b2a-funnel--2 { animation:b2a-funnel-loop 3.5s ease-in-out 0.7s infinite; }
[data-reveal].is-visible .b2a-funnel--3 { animation:b2a-funnel-loop 3.5s ease-in-out 0.9s infinite; }
[data-reveal].is-visible .b2a-funnel--4 { animation:b2a-funnel-loop 3.5s ease-in-out 1.1s infinite; }
@keyframes b2a-funnel-loop {
  0%,100% { transform:scaleX(0.85); opacity:0.35; }
  50% { transform:scaleX(1); opacity:0.7; }
}

/* Communication SVG */
.b2c-core { opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2c-core { animation:b2-badge-pop 0.5s ease 0.2s forwards; }
.b2c-label { fill:var(--x-text-muted); font-size:11px; font-weight:700; font-family:var(--x-font-sans); }
.b2c-chan { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2c-chan-bg { fill:var(--x-base); stroke:var(--x-border); stroke-width:1; }
.b2c-chan-t { fill:var(--x-text); font-size:10px; font-weight:700; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2c-chan--sms { animation:b2-badge-pop 0.4s ease 0.4s forwards; }
[data-reveal].is-visible .b2c-chan--tg { animation:b2-badge-pop 0.4s ease 0.55s forwards; }
[data-reveal].is-visible .b2c-chan--email { animation:b2-badge-pop 0.4s ease 0.7s forwards; }
[data-reveal].is-visible .b2c-chan--push { animation:b2-badge-pop 0.4s ease 0.85s forwards; }
.b2c-flow { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2c-flow--1 { animation:b2-draw 0.7s ease 1s forwards; }
[data-reveal].is-visible .b2c-flow--2 { animation:b2-draw 0.7s ease 1.15s forwards; }
[data-reveal].is-visible .b2c-flow--3 { animation:b2-draw 0.7s ease 1.3s forwards; }
[data-reveal].is-visible .b2c-flow--4 { animation:b2-draw 0.7s ease 1.45s forwards; }

/* Team SVG */
.b2t-role { opacity:0; transform:translateY(8px); }
.b2t-role-bg { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; }
.b2t-line { fill:var(--x-text-muted); opacity:0.3; }
[data-reveal].is-visible .b2t-role--mgr { animation:b2-card-in 0.5s ease 0.15s forwards; }
[data-reveal].is-visible .b2t-role--m1 { animation:b2-card-in 0.5s ease 0.5s forwards; }
[data-reveal].is-visible .b2t-role--m2 { animation:b2-card-in 0.5s ease 0.6s forwards; }
[data-reveal].is-visible .b2t-role--m3 { animation:b2-card-in 0.5s ease 0.7s forwards; }
.b2t-link { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2t-link--1 { animation:b2-draw 0.4s ease 0.35s forwards; }
[data-reveal].is-visible .b2t-link--2 { animation:b2-draw 0.4s ease 0.45s forwards; }
[data-reveal].is-visible .b2t-link--3 { animation:b2-draw 0.3s ease 0.6s forwards; }
[data-reveal].is-visible .b2t-link--4 { animation:b2-draw 0.3s ease 0.7s forwards; }
[data-reveal].is-visible .b2t-link--5 { animation:b2-draw 0.3s ease 0.8s forwards; }
.b2t-pdot { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2t-pdot--y { fill:var(--x-success); } .b2t-pdot--n { fill:var(--x-border); }
[data-reveal].is-visible .b2t-pdot { animation:b2-dot-pop 0.3s ease 0.9s forwards; }
.b2t-label { fill:var(--x-text-muted); font-size:10px; font-weight:700; font-family:var(--x-font-sans); }

/* ══════════════════════════════════════════
   KANBAN
   ══════════════════════════════════════════ */
.xcrm-b2__kanban { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; overflow-x:auto; padding-bottom:8px; }
.xcrm-b2__kcol { background:var(--x-base); border:1px solid var(--x-border-subtle); border-radius:14px; padding:12px 10px; min-width:150px; opacity:0; transform:translateY(16px); }
[data-reveal].is-visible .xcrm-b2__kcol { animation:b2-card-in 0.5s var(--x-ease-standard) forwards; }
[data-reveal].is-visible .xcrm-b2__kcol:nth-child(1) { animation-delay:0.1s; } [data-reveal].is-visible .xcrm-b2__kcol:nth-child(2) { animation-delay:0.2s; } [data-reveal].is-visible .xcrm-b2__kcol:nth-child(3) { animation-delay:0.3s; } [data-reveal].is-visible .xcrm-b2__kcol:nth-child(4) { animation-delay:0.4s; } [data-reveal].is-visible .xcrm-b2__kcol:nth-child(5) { animation-delay:0.5s; }
.xcrm-b2__kcol header { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; padding-bottom:8px; border-bottom:1px solid var(--x-border-subtle); }
.xcrm-b2__kcol header span { font-size:0.72rem; font-weight:800; color:var(--x-text); }
.xcrm-b2__kcol header em { font-style:normal; font-size:0.65rem; font-weight:700; color:var(--x-text-muted); background:var(--x-surface-hover); padding:2px 7px; border-radius:999px; }
.xcrm-b2__kcol--done header span { color:var(--x-accent-success); }
.xcrm-b2__ktask { background:var(--x-surface); border:1px solid var(--x-border-subtle); border-radius:10px; padding:10px; margin-bottom:8px; transition:transform 0.25s ease, border-color 0.3s ease, box-shadow 0.25s ease; }
.xcrm-b2__ktask:last-child { margin-bottom:0; }
.xcrm-b2__ktask:hover { transform:translateX(-3px); border-color:rgba(99,102,241,0.3); box-shadow:var(--x-shadow-soft); }
.xcrm-b2__ktask strong { display:block; font-size:0.76rem; font-weight:700; color:var(--x-text); margin-bottom:3px; }
.xcrm-b2__ktask span { font-size:0.68rem; color:var(--x-text-muted); }
.xcrm-b2__ktask--active { border-color:rgba(99,102,241,0.45); box-shadow:0 0 0 1px rgba(99,102,241,0.15); }

/* ══════════════════════════════════════════
   INDUSTRY CARDS
   ══════════════════════════════════════════ */
.xcrm-b2__ind-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.xcrm-b2__ind-card { background:var(--x-base); border:1px solid var(--x-border-subtle); border-radius:var(--x-radius-xl); overflow:hidden; display:flex; flex-direction:column; transition:border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s var(--x-ease-standard), background-color 0.45s ease; opacity:0; }
[data-reveal].is-visible .xcrm-b2__ind-card { animation:b2-card-in 0.6s var(--x-ease-standard) forwards; }
[data-reveal].is-visible .xcrm-b2__ind-card:nth-child(1) { animation-delay:0.05s; } [data-reveal].is-visible .xcrm-b2__ind-card:nth-child(2) { animation-delay:0.14s; } [data-reveal].is-visible .xcrm-b2__ind-card:nth-child(3) { animation-delay:0.23s; } [data-reveal].is-visible .xcrm-b2__ind-card:nth-child(4) { animation-delay:0.32s; }
.xcrm-b2__ind-card:hover { border-color:rgba(99,102,241,0.35); box-shadow:var(--x-shadow-soft), var(--x-glow-primary-sm); transform:translateY(-4px); }
.xcrm-b2__ind-visual { border-bottom:1px solid var(--x-border-subtle); overflow:hidden; }
.xcrm-b2__ind-body { padding:18px; display:flex; flex-direction:column; gap:8px; flex:1; }
.xcrm-b2__ind-title { font-size:0.95rem; font-weight:800; color:var(--x-text); margin:0; line-height:1.4; }
.xcrm-b2__ind-desc { font-size:0.8rem; color:var(--x-text-highlight); line-height:1.75; margin:0; }
.xcrm-b2__tags { display:flex; flex-wrap:wrap; gap:6px; padding-top:8px; }
.xcrm-b2__tags span { padding:4px 11px; border-radius:999px; background:var(--x-soft-primary); color:var(--x-primary); font-size:0.72rem; font-weight:700; }
.dark .xcrm-b2__tags span { color:#a5b4fc; }

/* Industry SVG shared */
.b2i-frame { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; opacity:0; }
[data-reveal].is-visible .b2i-frame { animation:b2-card-in 0.4s ease 0.1s forwards; }
.b2i-tile { fill:var(--x-surface); stroke:var(--x-border-subtle); stroke-width:1; opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2i-tile--1 { animation:b2-badge-pop 0.35s ease 0.25s forwards; }
[data-reveal].is-visible .b2i-tile--2 { animation:b2-badge-pop 0.35s ease 0.35s forwards; }
[data-reveal].is-visible .b2i-tile--3 { animation:b2-badge-pop 0.35s ease 0.45s forwards; }
.b2i-fbar { opacity:0; transform-origin:right center; transform-box:fill-box; }
.b2i-fbar--1 { fill:var(--x-primary); opacity:0.65; } .b2i-fbar--2 { fill:var(--x-info); opacity:0.55; } .b2i-fbar--3 { fill:var(--x-success); opacity:0.7; }
[data-reveal].is-visible .b2i-fbar--1 { animation:b2-row-in 0.35s ease 0.6s forwards; }
[data-reveal].is-visible .b2i-fbar--2 { animation:b2-row-in 0.35s ease 0.72s forwards; }
[data-reveal].is-visible .b2i-fbar--3 { animation:b2-row-in 0.35s ease 0.84s forwards; }
.b2i-ping { fill:none; stroke:var(--x-success); stroke-width:1.5; opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2i-ping { animation:b2-ring-pulse 2.5s ease-in-out 1s infinite; }
.b2i-cap-top { opacity:0; }
[data-reveal].is-visible .b2i-cap-top { animation:b2-badge-pop 0.45s ease 0.2s forwards; }
.b2i-cap-tassel { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2i-cap-tassel { animation:b2-draw 0.4s ease 0.5s forwards; }
.b2i-cap-ball { opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2i-cap-ball { animation:b2-dot-pop 0.3s ease 0.8s forwards, b2-float-soft 2s ease-in-out 1.2s infinite; }
.b2i-lbar { opacity:0; transform-origin:right center; transform-box:fill-box; }
.b2i-lbar--1 { fill:var(--x-primary); opacity:0.6; } .b2i-lbar--2 { fill:var(--x-info); opacity:0.5; } .b2i-lbar--3 { fill:var(--x-success); opacity:0.65; }
[data-reveal].is-visible .b2i-lbar--1 { animation:b2-row-in 0.35s ease 0.9s forwards; }
[data-reveal].is-visible .b2i-lbar--2 { animation:b2-row-in 0.35s ease 1.02s forwards; }
[data-reveal].is-visible .b2i-lbar--3 { animation:b2-row-in 0.35s ease 1.14s forwards; }
.b2i-deal { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; opacity:0; }
[data-reveal].is-visible .b2i-deal { animation:b2-card-in 0.4s ease 0.15s forwards; }
.b2i-hand { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2i-hand { animation:b2-draw 0.4s ease 0.5s forwards; }
.b2i-ms { opacity:0; transform:translateY(6px); }
[data-reveal].is-visible .b2i-ms--1 { animation:b2-card-in 0.35s ease 0.7s forwards; }
[data-reveal].is-visible .b2i-ms--2 { animation:b2-card-in 0.35s ease 0.85s forwards; }
[data-reveal].is-visible .b2i-ms--3 { animation:b2-card-in 0.35s ease 1s forwards; }
.b2i-ms-bg { fill:var(--x-surface); stroke:var(--x-border); stroke-width:1; }
.b2i-ms-t { fill:var(--x-text); font-size:8px; font-weight:700; font-family:var(--x-font-sans); }
.b2i-ms-a { stroke:var(--x-border); stroke-width:1.5; stroke-linecap:round; stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2i-ms-a--1 { animation:b2-draw 0.25s ease 0.9s forwards; }
[data-reveal].is-visible .b2i-ms-a--2 { animation:b2-draw 0.25s ease 1.05s forwards; }
.b2i-clip { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; opacity:0; }
[data-reveal].is-visible .b2i-clip { animation:b2-card-in 0.4s ease 0.1s forwards; }
.b2i-clip-tab { fill:var(--x-primary); opacity:0; }
[data-reveal].is-visible .b2i-clip-tab { animation:b2-badge-pop 0.3s ease 0.3s forwards; }
.b2i-ct { opacity:0; transform:translateX(-6px); }
[data-reveal].is-visible .b2i-ct--1 { animation:b2-row-in 0.3s ease 0.4s forwards; }
[data-reveal].is-visible .b2i-ct--2 { animation:b2-row-in 0.3s ease 0.5s forwards; }
[data-reveal].is-visible .b2i-ct--3 { animation:b2-row-in 0.3s ease 0.6s forwards; }
[data-reveal].is-visible .b2i-ct--4 { animation:b2-row-in 0.3s ease 0.7s forwards; }
.b2i-ct-dot { fill:none; stroke:var(--x-border); stroke-width:1.5; }
.b2i-ct-dot--done { fill:var(--x-success); stroke:var(--x-success); }
.b2i-ct-dot--active { fill:var(--x-primary); stroke:var(--x-primary); }
.b2i-ct-l { fill:var(--x-text-muted); opacity:0.3; }
.b2i-ring { fill:none; stroke:var(--x-primary); stroke-width:1.5; opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2i-ring { animation:b2-ring-pulse 2.5s ease-in-out 0.8s infinite; }
.b2i-clip-line { stroke:var(--x-border); stroke-width:1.5; stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2i-clip-line { animation:b2-draw 0.4s ease 0.7s forwards; }

/* ══════════════════════════════════════════
   HUB / INTEGRATIONS
   ══════════════════════════════════════════ */
.b2h-core { opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2h-core { animation:b2-badge-pop 0.5s ease 0.2s forwards; }
.b2h-ring { fill:none; stroke:var(--x-primary); stroke-width:1; opacity:0; transform-origin:center; transform-box:fill-box; }
.b2h-ring--2 { stroke-dasharray:4 4; }
[data-reveal].is-visible .b2h-ring { animation:b2-ring-pulse 3s ease-in-out 0.5s infinite; }
[data-reveal].is-visible .b2h-ring--2 { animation-delay:1s; }
.b2h-spoke { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2h-spoke--1 { animation:b2-draw 0.5s ease 0.5s forwards; }
[data-reveal].is-visible .b2h-spoke--2 { animation:b2-draw 0.5s ease 0.6s forwards; }
[data-reveal].is-visible .b2h-spoke--3 { animation:b2-draw 0.5s ease 0.7s forwards; }
[data-reveal].is-visible .b2h-spoke--4 { animation:b2-draw 0.5s ease 0.8s forwards; }
[data-reveal].is-visible .b2h-spoke--5 { animation:b2-draw 0.5s ease 0.9s forwards; }
[data-reveal].is-visible .b2h-spoke--6 { animation:b2-draw 0.5s ease 1s forwards; }
.b2h-node { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2h-node-bg { fill:var(--x-base); stroke:var(--x-border); stroke-width:1; }
.b2h-node-t { fill:var(--x-text); font-size:10px; font-weight:700; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2h-node--1 { animation:b2-badge-pop 0.35s ease 0.7s forwards; }
[data-reveal].is-visible .b2h-node--2 { animation:b2-badge-pop 0.35s ease 0.8s forwards; }
[data-reveal].is-visible .b2h-node--3 { animation:b2-badge-pop 0.35s ease 0.9s forwards; }
[data-reveal].is-visible .b2h-node--4 { animation:b2-badge-pop 0.35s ease 1s forwards; }
[data-reveal].is-visible .b2h-node--5 { animation:b2-badge-pop 0.35s ease 1.1s forwards; }
[data-reveal].is-visible .b2h-node--6 { animation:b2-badge-pop 0.35s ease 1.2s forwards; }

/* ══════════════════════════════════════════
   STEPS
   ══════════════════════════════════════════ */
.xcrm-b2__steps { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; position:relative; }
.xcrm-b2__steps::before { content:''; position:absolute; top:40px; right:12%; left:12%; border-top:2px dashed rgba(99,102,241,0.25); z-index:0; }
.xcrm-b2__step { display:flex; flex-direction:column; gap:14px; background:var(--x-base); border:1px solid var(--x-border-subtle); border-radius:var(--x-radius-lg); padding:24px 20px; position:relative; z-index:1; transition:background-color 0.45s ease, border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease; opacity:0; transform:translateY(18px); }
[data-reveal].is-visible .xcrm-b2__step { animation:b2-card-in 0.6s var(--x-ease-standard) forwards; }
[data-reveal].is-visible .xcrm-b2__step:nth-child(1) { animation-delay:0.1s; } [data-reveal].is-visible .xcrm-b2__step:nth-child(2) { animation-delay:0.22s; } [data-reveal].is-visible .xcrm-b2__step:nth-child(3) { animation-delay:0.34s; } [data-reveal].is-visible .xcrm-b2__step:nth-child(4) { animation-delay:0.46s; }
.xcrm-b2__step:hover { transform:translateY(-4px); border-color:rgba(99,102,241,0.3); box-shadow:var(--x-shadow-soft); }
.xcrm-b2__step-num { width:44px; height:44px; border-radius:13px; background:var(--x-gradient-primary); color:#fff; font-size:1.05rem; font-weight:800; display:flex; align-items:center; justify-content:center; flex-shrink:0; box-shadow:var(--x-shadow-primary); }
.xcrm-b2__step-icon { margin-bottom:4px; }
.b2st-frame { fill:var(--x-soft-primary); stroke:var(--x-border-subtle); stroke-width:1; }
.b2st-draw { stroke:var(--x-primary); stroke-dasharray:1; stroke-dashoffset:1; fill:none; }
[data-reveal].is-visible .b2st-draw { animation:b2-draw 0.6s ease 0.4s forwards; }
.b2st-dot { fill:var(--x-primary); opacity:0.6; }
.xcrm-b2__step h3 { font-size:0.92rem; font-weight:800; color:var(--x-text); margin:0 0 6px; line-height:1.45; }
.xcrm-b2__step p { font-size:0.82rem; color:var(--x-text-highlight); line-height:1.75; margin:0; }

/* ══════════════════════════════════════════
   EMPATHY + SOLUTION
   ══════════════════════════════════════════ */
.xcrm-b2__empathy { max-width:760px; margin:0 auto; text-align:center; background:var(--x-base); border:1px solid var(--x-border-subtle); border-radius:var(--x-radius-2xl); padding:clamp(36px,5vw,56px) clamp(24px,4vw,48px); position:relative; overflow:hidden; }
.xcrm-b2__empathy::before { content:''; position:absolute; top:0; right:0; left:0; height:4px; background:var(--x-gradient-primary); background-size:200% 100%; animation:b2-grad-shift 5s ease infinite; }
.xcrm-b2__empathy .xcrm-b2__h2 { margin-bottom:12px; }
.xcrm-b2__empathy .xcrm-b2__desc { margin:0 auto 24px; max-width:580px; }
.xcrm-b2__empathy-solution { text-align:right; background:var(--x-surface); border:1px solid var(--x-border-subtle); border-radius:var(--x-radius-xl); padding:clamp(20px,3vw,28px); }
.xcrm-b2__empathy-lead { font-size:0.95rem; font-weight:700; color:var(--x-text); line-height:1.9; margin:0 0 16px; }
.xcrm-b2__empathy-lead strong { color:var(--x-primary); }
.xcrm-b2__empathy-solution .xcrm-b2__checklist { margin:0; }
.xcrm-b2__empathy-solution .xcrm-b2__checklist strong { color:var(--x-text); }

/* ══════════════════════════════════════════
   GEN-3 SECRET
   ══════════════════════════════════════════ */
.xcrm-b2__gen3 { max-width:720px; margin:0 auto; background:var(--x-base); border:1px solid var(--x-border-subtle); border-radius:var(--x-radius-2xl); padding:clamp(32px,5vw,48px) clamp(24px,4vw,48px); position:relative; overflow:hidden; }
.xcrm-b2__gen3::before { content:''; position:absolute; top:0; right:0; left:0; height:4px; background:linear-gradient(90deg, #6366F1, #8B5CF6, #06B6D4); background-size:200% 100%; animation:b2-grad-shift 5s ease infinite; }
.xcrm-b2__gen3 p { font-size:0.95rem; color:var(--x-text-highlight); line-height:2; margin:0 0 16px; }
.xcrm-b2__gen3 p:last-of-type { margin-bottom:20px; }
.xcrm-b2__gen3 strong { color:var(--x-text); font-weight:800; }
.xcrm-b2__gen3-result { display:flex; align-items:flex-start; gap:12px; background:var(--x-soft-success, #ECFDF5); border:1px solid rgba(16,185,129,0.25); border-radius:var(--x-radius-lg); padding:16px 18px; }
.xcrm-b2__gen3-badge { flex-shrink:0; width:28px; height:28px; border-radius:50%; background:#10B981; color:#fff; font-size:0.85rem; font-weight:800; display:flex; align-items:center; justify-content:center; }
.xcrm-b2__gen3-result p { margin:0; font-size:0.9rem; color:var(--x-text); line-height:1.8; }
.dark .xcrm-b2__gen3-result { background:rgba(16,185,129,0.08); }

/* ══════════════════════════════════════════
   TWO PATHS
   ══════════════════════════════════════════ */
.xcrm-b2__paths { display:grid; grid-template-columns:1fr 1fr; gap:20px; max-width:900px; margin:0 auto; }
.xcrm-b2__path { background:var(--x-base); border:1px solid var(--x-border-subtle); border-radius:var(--x-radius-xl); padding:clamp(24px,3vw,32px); position:relative; overflow:hidden; transition:transform var(--x-dur-220) var(--x-ease-standard), box-shadow 0.3s ease; }
.xcrm-b2__path:hover { transform:translateY(-3px); box-shadow:var(--x-shadow-card); }
.xcrm-b2__path h3 { font-size:1rem; font-weight:800; color:var(--x-text); margin:0 0 18px; padding-bottom:14px; border-bottom:1px solid var(--x-border-subtle); line-height:1.5; }
.xcrm-b2__path ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.xcrm-b2__path li { position:relative; padding-right:28px; font-size:0.88rem; color:var(--x-text-highlight); line-height:1.7; }
.xcrm-b2__path li::before { position:absolute; right:0; top:0; font-size:0.95rem; font-weight:800; }
.xcrm-b2__path--bad { border-color:rgba(240,68,56,0.25); }
.xcrm-b2__path--bad::before { content:''; position:absolute; top:0; right:0; left:0; height:3px; background:#F04438; opacity:0.6; }
.xcrm-b2__path--bad h3 { color:#DC2626; }
.xcrm-b2__path--bad li::before { content:'✕'; color:#F04438; }
.xcrm-b2__path--good { border-color:rgba(16,185,129,0.3); box-shadow:var(--x-shadow-soft); }
.xcrm-b2__path--good::before { content:''; position:absolute; top:0; right:0; left:0; height:3px; background:linear-gradient(90deg, #10B981, #06B6D4); }
.xcrm-b2__path--good h3 { color:#059669; }
.xcrm-b2__path--good li::before { content:'✓'; color:#10B981; }
.dark .xcrm-b2__path--bad h3 { color:#F87171; }
.dark .xcrm-b2__path--good h3 { color:#34D399; }
@media (max-width:720px) { .xcrm-b2__paths { grid-template-columns:1fr; } }

/* ══════════════════════════════════════════
   PRICING
   ══════════════════════════════════════════ */
.xcrm-b2__pricing-box { max-width:640px; margin:0 auto; text-align:center; background:var(--x-base); border:1px solid var(--x-border-subtle); border-radius:var(--x-radius-2xl); padding:clamp(40px,6vw,64px) clamp(24px,4vw,48px); position:relative; overflow:hidden; }
.xcrm-b2__pricing-box::before { content:''; position:absolute; top:0; right:0; left:0; height:4px; background:var(--x-gradient-primary); background-size:200% 100%; animation:b2-grad-shift 5s ease infinite; }
.xcrm-b2__pricing-box .xcrm-b2__desc { margin:0 auto 28px; }

/* ══════════════════════════════════════════
   FAQ
   ══════════════════════════════════════════ */
.xcrm-b2__faq-wrap { max-width:760px; }
.xcrm-b2__faq { display:flex; flex-direction:column; gap:10px; }
.xcrm-b2__faq-item { background:var(--x-base); border:1px solid var(--x-border-subtle); border-radius:14px; overflow:hidden; transition:border-color var(--x-dur-220) ease, box-shadow 0.3s ease; opacity:0; transform:translateY(12px); }
[data-reveal].is-visible .xcrm-b2__faq-item { animation:b2-rise 0.5s var(--x-ease-standard) forwards; }
[data-reveal].is-visible .xcrm-b2__faq-item:nth-child(1) { animation-delay:0.05s; } [data-reveal].is-visible .xcrm-b2__faq-item:nth-child(2) { animation-delay:0.1s; } [data-reveal].is-visible .xcrm-b2__faq-item:nth-child(3) { animation-delay:0.15s; } [data-reveal].is-visible .xcrm-b2__faq-item:nth-child(4) { animation-delay:0.2s; } [data-reveal].is-visible .xcrm-b2__faq-item:nth-child(5) { animation-delay:0.25s; } [data-reveal].is-visible .xcrm-b2__faq-item:nth-child(6) { animation-delay:0.3s; }
.xcrm-b2__faq-item[open] { border-color:rgba(99,102,241,0.35); box-shadow:var(--x-shadow-soft); }
.xcrm-b2__faq-item summary { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:18px 20px; cursor:pointer; font-size:0.92rem; font-weight:700; color:var(--x-text); list-style:none; transition:color var(--x-dur-180) ease, background-color 0.2s ease; }
.xcrm-b2__faq-item summary::-webkit-details-marker { display:none; }
.xcrm-b2__faq-item summary:hover { color:var(--x-primary); background:var(--x-surface-hover); }
.xcrm-b2__faq-item summary:focus-visible { outline:2px solid var(--x-primary); outline-offset:-2px; border-radius:14px; }
.xcrm-b2__faq-icon { flex-shrink:0; color:var(--x-text-muted); transition:transform var(--x-dur-220) var(--x-ease-standard), color var(--x-dur-220) ease; }
.xcrm-b2__faq-item[open] .xcrm-b2__faq-icon { transform:rotate(180deg); color:var(--x-primary); }
.xcrm-b2__faq-a { padding:0 20px 20px; }
.xcrm-b2__faq-a p { font-size:0.88rem; color:var(--x-text-highlight); line-height:1.9; margin:0; border-top:1px solid var(--x-border-subtle); padding-top:14px; }
.xcrm-b2__faq-a a { color:var(--x-primary); font-weight:700; text-decoration:none; }

/* ══════════════════════════════════════════
   FINAL CTA
   ══════════════════════════════════════════ */
.xcrm-b2__final { padding-bottom:clamp(80px,10vw,120px); }
.xcrm-b2__final-box { text-align:center; max-width:680px; margin:0 auto; padding:clamp(44px,6vw,68px) clamp(24px,4vw,48px); background:linear-gradient(135deg, #6366F1 0%, #8B5CF6 50%, #06B6D4 100%); background-size:200% 200%; animation:b2-grad-shift 8s ease infinite; border-radius:var(--x-radius-2xl); color:#fff; position:relative; overflow:hidden; }
.xcrm-b2__final-deco { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; pointer-events:none; opacity:0.5; }
.xcrm-b2__final-deco .xcrm-b2-svg { width:100%; max-width:400px; }
.b2fc-dot { opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2fc-dot--1 { animation:b2-dot-pop 0.3s ease 0.5s forwards, b2-float-soft 3s ease-in-out 1s infinite; }
[data-reveal].is-visible .b2fc-dot--2 { animation:b2-dot-pop 0.3s ease 0.7s forwards, b2-float-soft 3.5s ease-in-out 1.2s infinite; }
[data-reveal].is-visible .b2fc-dot--3 { animation:b2-dot-pop 0.3s ease 0.9s forwards, b2-float-soft 4s ease-in-out 1.4s infinite; }
[data-reveal].is-visible .b2fc-dot--4 { animation:b2-dot-pop 0.3s ease 1.1s forwards, b2-float-soft 3.8s ease-in-out 1.6s infinite; }
.b2fc-line { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2fc-line--1 { animation:b2-draw 0.5s ease 0.6s forwards; }
[data-reveal].is-visible .b2fc-line--2 { animation:b2-draw 0.5s ease 0.75s forwards; }
[data-reveal].is-visible .b2fc-line--3 { animation:b2-draw 0.5s ease 0.9s forwards; }
[data-reveal].is-visible .b2fc-line--4 { animation:b2-draw 0.5s ease 1.05s forwards; }
.xcrm-b2__final-content { position:relative; z-index:1; max-width:560px; margin:0 auto; }
.xcrm-b2__final-box .xcrm-b2__h2 { color:#fff; }
.xcrm-b2__final-box .xcrm-b2__desc { color:rgba(255,255,255,0.85); margin:0 auto 28px; }
.xcrm-b2__final-actions { display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
.xcrm-b2__final-micro { list-style:none; margin:22px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px 20px; justify-content:center; }
.xcrm-b2__final-micro li { position:relative; padding-right:18px; font-size:0.78rem; font-weight:600; color:rgba(255,255,255,0.75); }
.xcrm-b2__final-micro li::before { content:'✓'; position:absolute; right:0; color:rgba(255,255,255,0.9); font-weight:800; }

/* ══════════════════════════════════════════
   FOOTER
   ══════════════════════════════════════════ */
.xcrm-b2__footer { border-top:1px solid var(--x-border-subtle); padding:26px 0; background:var(--x-base); }
.xcrm-b2__footer-inner { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.xcrm-b2__footer-copy { font-size:0.78rem; color:var(--x-text-muted); margin:0; }
.xcrm-b2__footer-links { display:flex; gap:18px; }
.xcrm-b2__footer-links a { font-size:0.8rem; font-weight:600; color:var(--x-text-highlight); text-decoration:none; transition:color var(--x-dur-180) ease; }
.xcrm-b2__footer-links a:hover { color:var(--x-primary); }

/* ══════════════════════════════════════════
   HERO UPGRADES — mesh, particles, stats, new nodes
   ══════════════════════════════════════════ */
.xcrm-b2__mesh { position:absolute; inset:0; width:100%; height:100%; opacity:0.25; pointer-events:none; }
.b2mesh-line { stroke:var(--x-primary); stroke-width:0.8; opacity:0.15; }
.b2mesh-dot { fill:var(--x-primary); opacity:0.2; animation:b2-float-soft 6s ease-in-out infinite; }
.b2mesh-dot:nth-child(odd) { animation-delay:-2s; }
.b2mesh-dot:nth-child(even) { animation-delay:-4s; }

.b2f-glow { opacity:0; }
.xcrm-b2-anim .b2f-glow { animation:b2-fade 1.5s ease 0.2s forwards; }

.b2f-particle { opacity:0; }
.xcrm-b2-anim .b2f-particle { animation:b2-fade 0.5s ease forwards; }
.xcrm-b2-anim .b2f-particle--1 { animation-delay:1.5s; }
.xcrm-b2-anim .b2f-particle--2 { animation-delay:2s; }
.xcrm-b2-anim .b2f-particle--3 { animation-delay:2.5s; }
.xcrm-b2-anim .b2f-particle--4 { animation-delay:3s; }

.b2f-node-bg--panel { fill:var(--x-base); stroke:var(--x-primary); stroke-width:1.5; }

/* Hero stats strip */
.xcrm-b2__hero-stats { display:flex; align-items:center; gap:20px; margin-top:28px; }
.xcrm-b2__hero-stat { display:flex; flex-direction:column; align-items:center; gap:2px; }
.xcrm-b2__hero-stat-n { font-size:1.4rem; font-weight:800; background:var(--x-gradient-primary); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; line-height:1.2; }
.xcrm-b2__hero-stat-l { font-size:0.72rem; font-weight:600; color:var(--x-text-muted); white-space:nowrap; }
.xcrm-b2__hero-stat-sep { width:1px; height:28px; background:var(--x-border); }

/* ══════════════════════════════════════════
   CHALLENGES UPGRADES — per-card mini SVGs
   ══════════════════════════════════════════ */
.xcrm-b2__card--visual { padding-top:0; }
.xcrm-b2__card-svg { margin:0 -22px 16px; padding:14px 18px 0; border-bottom:1px solid var(--x-border-subtle); overflow:hidden; }
.xcrm-b2__card-svg svg { display:block; width:100%; height:auto; }

/* Card 1: scattered boxes */
.b2ch-box { fill:var(--x-surface); stroke:var(--x-border); stroke-width:1.5; opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2ch-box--1 { animation:b2-badge-pop 0.4s ease 0.2s forwards; }
[data-reveal].is-visible .b2ch-box--2 { animation:b2-badge-pop 0.4s ease 0.3s forwards; }
[data-reveal].is-visible .b2ch-box--3 { animation:b2-badge-pop 0.4s ease 0.4s forwards; }
[data-reveal].is-visible .b2ch-box--4 { animation:b2-badge-pop 0.4s ease 0.5s forwards; }
[data-reveal].is-visible .b2ch-box--5 { animation:b2-badge-pop 0.4s ease 0.6s forwards; }
[data-reveal].is-visible .b2ch-box--6 { animation:b2-badge-pop 0.4s ease 0.7s forwards; }
.b2ch-link { stroke:var(--x-border); stroke-width:1.5; stroke-linecap:round; stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2ch-link--1 { animation:b2-draw 0.5s ease 0.8s forwards; }
[data-reveal].is-visible .b2ch-link--2 { animation:b2-draw 0.5s ease 0.95s forwards; }
[data-reveal].is-visible .b2ch-link--3 { animation:b2-draw 0.5s ease 1.1s forwards; }

/* Card 2: lost opportunity chart */
.b2ch-chart-line { stroke:var(--x-primary); stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2ch-chart-line { animation:b2-draw 1s ease 0.2s forwards; }
.b2ch-chart-dot { fill:var(--x-primary); opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2ch-chart-dot { animation:b2-badge-pop 0.35s ease 1s forwards; }
.b2ch-break { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2ch-break { animation:b2-draw 0.3s ease 1.3s forwards; }
.b2ch-alert-bg { fill:var(--x-error-soft); stroke:var(--x-error); stroke-width:1; opacity:0; }
.b2ch-alert-t { fill:var(--x-error); font-size:7px; font-weight:700; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2ch-alert-bg { animation:b2-badge-pop 0.35s ease 1.5s forwards; }

/* Card 3: wrong targeting */
.b2ch-target-ring { fill:none; stroke:var(--x-border); stroke-width:1.5; opacity:0; transform-origin:center; transform-box:fill-box; }
.b2ch-target-ring--2 { stroke:var(--x-border-subtle); stroke-dasharray:4 4; }
.b2ch-target-center { fill:var(--x-primary); opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2ch-target-ring { animation:b2-ring-pulse 2.5s ease-in-out 0.3s infinite; opacity:0.5; }
[data-reveal].is-visible .b2ch-target-ring--2 { animation-delay:0.8s; }
[data-reveal].is-visible .b2ch-target-center { animation:b2-badge-pop 0.35s ease 0.5s forwards; }
.b2ch-arrow { stroke:var(--x-primary); stroke-dasharray:1; stroke-dashoffset:1; }
.b2ch-arrow--miss { stroke:var(--x-error); }
[data-reveal].is-visible .b2ch-arrow--1 { animation:b2-draw 0.4s ease 0.7s forwards; }
[data-reveal].is-visible .b2ch-arrow--2 { animation:b2-draw 0.4s ease 0.85s forwards; }
[data-reveal].is-visible .b2ch-arrow--3 { animation:b2-draw 0.4s ease 1s forwards; }
[data-reveal].is-visible .b2ch-arrow--miss { animation:b2-draw 0.4s ease 1.2s forwards; }

/* Card 4: blind decisions bars */
.b2ch-bar { opacity:0; transform-origin:center bottom; transform-box:fill-box; }
.b2ch-bar--1 { fill:var(--x-border); } .b2ch-bar--2 { fill:var(--x-border); } .b2ch-bar--3 { fill:var(--x-border); } .b2ch-bar--4 { fill:var(--x-primary); opacity:0.5; }
[data-reveal].is-visible .b2ch-bar { animation:b2-bar-grow 0.6s var(--x-ease-standard) forwards; }
[data-reveal].is-visible .b2ch-bar--1 { animation-delay:0.2s; } [data-reveal].is-visible .b2ch-bar--2 { animation-delay:0.32s; }
[data-reveal].is-visible .b2ch-bar--3 { animation-delay:0.44s; } [data-reveal].is-visible .b2ch-bar--4 { animation-delay:0.56s; }
.b2ch-qmark { stroke:var(--x-warn); stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2ch-qmark { animation:b2-draw 0.6s ease 0.8s forwards; }

/* ══════════════════════════════════════════
   SEGMENTATION — clean 4-phase flow
   ══════════════════════════════════════════ */
.b2s-glow { opacity:0; }
[data-reveal].is-visible .b2s-glow { animation:b2-fade 1.2s ease 0.2s forwards; }

/* Source */
.b2s-src-ring { fill:none; stroke:var(--x-primary); stroke-width:1; opacity:0; transform-origin:center; transform-box:fill-box; }
.b2s-src-ring--2 { stroke-dasharray:6 8; }
[data-reveal].is-visible .b2s-src-ring { animation:b2-ring-pulse 4s ease-in-out 0.3s infinite; opacity:0.35; }
[data-reveal].is-visible .b2s-src-ring--2 { animation-delay:1s; opacity:0.2; }
.b2s-src-core { fill:var(--x-soft-primary); stroke:var(--x-primary); stroke-width:1.5; opacity:0; }
[data-reveal].is-visible .b2s-src-core { animation:b2-badge-pop 0.5s ease 0.2s forwards; }
.b2s-dot { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2s-dot--src { fill:var(--x-primary); opacity:0; }
[data-reveal].is-visible .b2s-dot--src { animation:b2-dot-pop 0.3s ease 0.4s forwards; }
.b2s-dot--a { fill:var(--x-primary); } .b2s-dot--b { fill:var(--x-cyan); } .b2s-dot--c { fill:var(--x-warn); }
.b2s-title { fill:var(--x-text); font-size:12px; font-weight:800; font-family:var(--x-font-sans); }
.b2s-sub { fill:var(--x-text-muted); font-size:9px; font-weight:600; font-family:var(--x-font-sans); }

/* Filter engine */
.b2s-engine-frame { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; opacity:0; }
[data-reveal].is-visible .b2s-engine-frame { animation:b2-card-in 0.5s ease 0.3s forwards; }
.b2s-engine-header { fill:var(--x-primary); opacity:0.1; }
.b2s-engine-t { fill:var(--x-primary); font-size:10px; font-weight:800; font-family:var(--x-font-sans); }
.b2s-cond { opacity:0; transform:translateY(5px); }
.b2s-cond-bg { fill:var(--x-surface); stroke:var(--x-border); stroke-width:1; }
.b2s-cond-t { fill:var(--x-text); font-size:7.5px; font-weight:600; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2s-cond--1 { animation:b2-card-in 0.35s ease 0.5s forwards; }
[data-reveal].is-visible .b2s-cond--2 { animation:b2-card-in 0.35s ease 0.62s forwards; }
[data-reveal].is-visible .b2s-cond--3 { animation:b2-card-in 0.35s ease 0.74s forwards; }
.b2s-and { fill:var(--x-primary); font-size:9px; font-weight:800; font-family:var(--x-font-sans); opacity:0; }
[data-reveal].is-visible .b2s-and { animation:b2-badge-pop 0.3s ease 0.7s forwards; }
[data-reveal].is-visible .b2s-and + .b2s-and { animation-delay:0.82s; }

/* Groups */
.b2s-g-circle { fill:none; stroke-width:1.5; stroke-dasharray:5 5; opacity:0; transform-origin:center; transform-box:fill-box; }
.b2s-group--a .b2s-g-circle { stroke:var(--x-primary); } .b2s-group--b .b2s-g-circle { stroke:var(--x-cyan); } .b2s-group--c .b2s-g-circle { stroke:var(--x-warn); }
[data-reveal].is-visible .b2s-group--a .b2s-g-circle { animation:b2-cluster-in 0.5s ease 0.9s forwards; }
[data-reveal].is-visible .b2s-group--b .b2s-g-circle { animation:b2-cluster-in 0.5s ease 1.05s forwards; }
[data-reveal].is-visible .b2s-group--c .b2s-g-circle { animation:b2-cluster-in 0.5s ease 1.2s forwards; }
.b2s-g-pulse { fill:none; stroke-width:1; opacity:0; transform-origin:center; transform-box:fill-box; }
.b2s-group--a .b2s-g-pulse { stroke:var(--x-primary); } .b2s-group--b .b2s-g-pulse { stroke:var(--x-cyan); } .b2s-group--c .b2s-g-pulse { stroke:var(--x-warn); }
[data-reveal].is-visible .b2s-group--a .b2s-g-pulse { animation:b2-ring-pulse 3s ease-in-out 1.2s infinite; }
[data-reveal].is-visible .b2s-group--b .b2s-g-pulse { animation:b2-ring-pulse 3s ease-in-out 1.6s infinite; }
[data-reveal].is-visible .b2s-group--c .b2s-g-pulse { animation:b2-ring-pulse 3s ease-in-out 2s infinite; }
.b2s-group .b2s-dot { opacity:0; }
[data-reveal].is-visible .b2s-group--a .b2s-dot { animation:b2-dot-pop 0.3s ease 1.1s forwards; }
[data-reveal].is-visible .b2s-group--b .b2s-dot { animation:b2-dot-pop 0.3s ease 1.25s forwards; }
[data-reveal].is-visible .b2s-group--c .b2s-dot { animation:b2-dot-pop 0.3s ease 1.4s forwards; }
.b2s-g-lbl { opacity:0; }
.b2s-g-lbl-bg { fill:var(--x-base); stroke:var(--x-border); stroke-width:1; }
.b2s-g-lbl-t { fill:var(--x-text); font-size:9px; font-weight:700; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2s-group--a .b2s-g-lbl { animation:b2-badge-pop 0.35s ease 1.3s forwards; }
[data-reveal].is-visible .b2s-group--b .b2s-g-lbl { animation:b2-badge-pop 0.35s ease 1.45s forwards; }
[data-reveal].is-visible .b2s-group--c .b2s-g-lbl { animation:b2-badge-pop 0.35s ease 1.6s forwards; }

/* Campaign */
.b2s-camp-frame { fill:var(--x-base); stroke:var(--x-primary); stroke-width:1.5; opacity:0; }
[data-reveal].is-visible .b2s-camp-frame { animation:b2-badge-pop 0.5s ease 1.8s forwards; }
.b2s-camp-header { fill:var(--x-primary); opacity:0.1; }
.b2s-camp-header-t { fill:var(--x-primary); font-size:10px; font-weight:800; font-family:var(--x-font-sans); }
.b2s-c-ch { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2s-c-ch-bg { fill:var(--x-surface); stroke:var(--x-border); stroke-width:1; }
.b2s-c-ch-t { fill:var(--x-text); font-size:7.5px; font-weight:700; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2s-c-ch--1 { animation:b2-badge-pop 0.3s ease 2s forwards; }
[data-reveal].is-visible .b2s-c-ch--2 { animation:b2-badge-pop 0.3s ease 2.1s forwards; }
[data-reveal].is-visible .b2s-c-ch--3 { animation:b2-badge-pop 0.3s ease 2.2s forwards; }
.b2s-camp-status { fill:var(--x-accent-success); font-size:8px; font-weight:700; font-family:var(--x-font-sans); opacity:0; }
[data-reveal].is-visible .b2s-camp-status { animation:b2-fade 0.4s ease 2.4s forwards; }

/* Flow paths */
.b2s-flow { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2s-flow--in { animation:b2-draw 0.5s ease 0.5s forwards; }
[data-reveal].is-visible .b2s-flow--1 { animation:b2-draw 0.6s ease 0.8s forwards; }
[data-reveal].is-visible .b2s-flow--2 { animation:b2-draw 0.6s ease 0.9s forwards; }
[data-reveal].is-visible .b2s-flow--3 { animation:b2-draw 0.6s ease 1s forwards; }
[data-reveal].is-visible .b2s-flow--4 { animation:b2-draw 0.5s ease 1.5s forwards; }
[data-reveal].is-visible .b2s-flow--5 { animation:b2-draw 0.5s ease 1.6s forwards; }
[data-reveal].is-visible .b2s-flow--6 { animation:b2-draw 0.5s ease 1.7s forwards; }

/* Particles */
.b2s-particle { opacity:0; }
[data-reveal].is-visible .b2s-particle { animation:b2-fade 0.4s ease forwards; }
[data-reveal].is-visible .b2s-particle--1 { animation-delay:1s; }
[data-reveal].is-visible .b2s-particle--2 { animation-delay:1.5s; }
[data-reveal].is-visible .b2s-particle--3 { animation-delay:1.2s; }
[data-reveal].is-visible .b2s-particle--4 { animation-delay:1.6s; }
[data-reveal].is-visible .b2s-particle--5 { animation-delay:2s; }
[data-reveal].is-visible .b2s-particle--6 { animation-delay:1.8s; }
[data-reveal].is-visible .b2s-particle--7 { animation-delay:2.2s; }
[data-reveal].is-visible .b2s-particle--8 { animation-delay:2.6s; }

/* ══════════════════════════════════════════
   PIPELINE INFINITE ANIMATIONS
   ══════════════════════════════════════════ */
.xcrm-b2__kanban-wrap { position:relative; }
.xcrm-b2__kanban { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; overflow-x:auto; padding-bottom:8px; position:relative; }
.xcrm-b2__kcol { background:var(--x-base); border:1px solid var(--x-border-subtle); border-radius:14px; padding:12px 10px; min-width:150px; position:relative; overflow:hidden; opacity:0; transform:translateY(16px); }
[data-reveal].is-visible .xcrm-b2__kcol { animation:b2-card-in 0.5s var(--x-ease-standard) forwards; }
[data-reveal].is-visible .xcrm-b2__kcol:nth-child(1) { animation-delay:0.1s; } [data-reveal].is-visible .xcrm-b2__kcol:nth-child(2) { animation-delay:0.2s; } [data-reveal].is-visible .xcrm-b2__kcol:nth-child(3) { animation-delay:0.3s; } [data-reveal].is-visible .xcrm-b2__kcol:nth-child(4) { animation-delay:0.4s; } [data-reveal].is-visible .xcrm-b2__kcol:nth-child(5) { animation-delay:0.5s; }
.xcrm-b2__kcol header { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; padding-bottom:8px; border-bottom:1px solid var(--x-border-subtle); }
.xcrm-b2__kcol header span { font-size:0.72rem; font-weight:800; color:var(--x-text); }
.xcrm-b2__kcol header em { font-style:normal; font-size:0.65rem; font-weight:700; color:var(--x-text-muted); background:var(--x-surface-hover); padding:2px 7px; border-radius:999px; transition:color 0.3s, background 0.3s; }
.xcrm-b2__kcol--done header span { color:var(--x-accent-success); }
.xcrm-b2__ktask { background:var(--x-surface); border:1px solid var(--x-border-subtle); border-radius:10px; padding:10px; margin-bottom:8px; transition:transform 0.25s ease, border-color 0.3s ease, box-shadow 0.25s ease; }
.xcrm-b2__ktask:last-child { margin-bottom:0; }
.xcrm-b2__ktask:hover { transform:translateX(-3px); border-color:rgba(99,102,241,0.3); box-shadow:var(--x-shadow-soft); }
.xcrm-b2__ktask strong { display:block; font-size:0.76rem; font-weight:700; color:var(--x-text); margin-bottom:3px; }
.xcrm-b2__ktask span { font-size:0.68rem; color:var(--x-text-muted); }
.xcrm-b2__ktask--active { border-color:rgba(99,102,241,0.45); box-shadow:0 0 0 1px rgba(99,102,241,0.15); }

/* Infinite card animations */
.b2k-card { opacity:0; transform:translateY(8px); }
[data-reveal].is-visible .b2k-card--a { animation:b2-card-in 0.4s ease 0.6s forwards; }
[data-reveal].is-visible .b2k-card--b { animation:b2-card-in 0.4s ease 0.75s forwards; }
[data-reveal].is-visible .b2k-card--c { animation:b2-card-in 0.4s ease 0.9s forwards; }
[data-reveal].is-visible .b2k-card--d { animation:b2-card-in 0.4s ease 1.05s forwards; }
[data-reveal].is-visible .b2k-card--e { animation:b2-card-in 0.4s ease 1.2s forwards; }
[data-reveal].is-visible .b2k-card--f { animation:b2-card-in 0.4s ease 1.35s forwards; }
[data-reveal].is-visible .b2k-card--g { animation:b2-card-in 0.4s ease 1.5s forwards; }
[data-reveal].is-visible .b2k-card--h { animation:b2-card-in 0.4s ease 1.65s forwards; }
[data-reveal].is-visible .b2k-card--i { animation:b2-card-in 0.4s ease 1.8s forwards; }
[data-reveal].is-visible .b2k-card--j { animation:b2-card-in 0.4s ease 1.95s forwards; }

/* New card sliding in (infinite) */
.b2k-new { opacity:0; transform:translateX(20px); }
[data-reveal].is-visible .b2k-new--1 { animation:b2-knew 5s ease-in-out 2.5s infinite; }

/* Moving card between stages (infinite) */
.b2k-move { opacity:0; }
[data-reveal].is-visible .b2k-move--1 { animation:b2-kmove1 6s ease-in-out 3s infinite; }
[data-reveal].is-visible .b2k-move--2 { animation:b2-kmove2 6s ease-in-out 4.5s infinite; }
[data-reveal].is-visible .b2k-move--3 { animation:b2-kmove3 6s ease-in-out 6s infinite; }

/* Win card (infinite) */
.b2k-win { opacity:0; transform:scale(0.8); }
[data-reveal].is-visible .b2k-win--1 { animation:b2-kwin 5s ease-in-out 5s infinite; }

/* Count badge pulse */
[data-reveal].is-visible .b2k-count--1 { animation:b2-kcount 5s ease-in-out 2.5s infinite; }
[data-reveal].is-visible .b2k-count--2 { animation:b2-kcount 6s ease-in-out 3s infinite; }
[data-reveal].is-visible .b2k-count--5 { animation:b2-kcount 5s ease-in-out 5s infinite; }

/* Flow arrows between columns */
.b2k-arrows { position:absolute; inset:0; pointer-events:none; display:none; }
.b2k-arrow { position:absolute; top:50%; color:var(--x-primary); opacity:0; transform:translateY(-50%); }
.b2k-arrow--1 { right:19%; } .b2k-arrow--2 { right:39%; } .b2k-arrow--3 { right:59%; } .b2k-arrow--4 { right:79%; }
[data-reveal].is-visible .b2k-arrow { animation:b2-karrow 6s ease-in-out infinite; }
[data-reveal].is-visible .b2k-arrow--2 { animation-delay:1.5s; }
[data-reveal].is-visible .b2k-arrow--3 { animation-delay:3s; }
[data-reveal].is-visible .b2k-arrow--4 { animation-delay:4.5s; }

/* New keyframes for pipeline */
@keyframes b2-knew {
  0% { opacity:0; transform:translateX(20px); }
  10% { opacity:1; transform:translateX(0); }
  80% { opacity:1; transform:translateX(0); }
  95% { opacity:0; transform:translateX(-10px); }
  100% { opacity:0; transform:translateX(-10px); }
}
@keyframes b2-kmove1 {
  0%,10% { opacity:0; transform:translateX(0); }
  20% { opacity:1; transform:translateX(0); }
  80% { opacity:1; transform:translateX(0); }
  90%,100% { opacity:0; transform:translateX(-10px); }
}
@keyframes b2-kmove2 {
  0%,15% { opacity:0; transform:translateX(0); }
  25% { opacity:1; transform:translateX(0); }
  80% { opacity:1; transform:translateX(0); }
  90%,100% { opacity:0; transform:translateX(-10px); }
}
@keyframes b2-kmove3 {
  0%,20% { opacity:0; transform:translateX(0); }
  30% { opacity:1; transform:translateX(0); }
  80% { opacity:1; transform:translateX(0); }
  90%,100% { opacity:0; transform:scale(0.9); }
}
@keyframes b2-kwin {
  0%,15% { opacity:0; transform:scale(0.8); }
  25% { opacity:1; transform:scale(1); }
  80% { opacity:1; transform:scale(1); }
  95%,100% { opacity:0; transform:scale(0.85); }
}
@keyframes b2-kcount {
  0%,10% { color:var(--x-text-muted); background:var(--x-surface-hover); }
  15% { color:#fff; background:var(--x-primary); }
  80% { color:#fff; background:var(--x-primary); }
  90%,100% { color:var(--x-text-muted); background:var(--x-surface-hover); }
}
@keyframes b2-karrow {
  0%,100% { opacity:0; transform:translateY(-50%) translateX(0); }
  50% { opacity:0.6; transform:translateY(-50%) translateX(4px); }
}

/* ══════════════════════════════════════════
   CHALLENGES FULL SECTIONS
   ══════════════════════════════════════════ */
.xcrm-b2__chal { display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,64px); align-items:center; margin-bottom:clamp(48px,7vw,80px); }
.xcrm-b2__chal:last-child { margin-bottom:0; }
.xcrm-b2__chal--rev .xcrm-b2__chal-visual { order:2; } .xcrm-b2__chal--rev .xcrm-b2__chal-body { order:1; }
.xcrm-b2__chal-visual { border-radius:var(--x-radius-2xl); overflow:hidden; }
.xcrm-b2__chal-num { display:inline-flex; font-size:0.78rem; font-weight:800; color:var(--x-primary); background:var(--x-soft-primary); border-radius:999px; padding:5px 14px; margin-bottom:14px; }
.dark .xcrm-b2__chal-num { color:#a5b4fc; }
.xcrm-b2__chal-title { font-size:clamp(1.2rem,2.6vw,1.6rem); font-weight:800; color:var(--x-text); line-height:1.4; margin:0 0 14px; }
.xcrm-b2__chal-desc { font-size:clamp(0.9rem,1.6vw,1rem); color:var(--x-text-highlight); line-height:1.9; margin:0 0 20px; }
.xcrm-b2__chal-tags { display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0; padding:0; }
.xcrm-b2__chal-tags li { padding:6px 14px; border-radius:999px; background:var(--x-soft-primary); color:var(--x-primary); font-size:0.76rem; font-weight:700; }
.dark .xcrm-b2__chal-tags li { color:#a5b4fc; }

/* Challenge 1: Scattered windows */
.b2ch1-frame { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; }
.b2ch1-bar { fill:var(--x-surface-hover); }
.b2ch1-line { fill:var(--x-text-muted); opacity:0.25; }
.b2ch1-win { opacity:0; }
[data-reveal].is-visible .b2ch1-win--1 { animation:b2-badge-pop 0.5s ease 0.2s forwards, b2-float-soft 4s ease-in-out 1s infinite; }
[data-reveal].is-visible .b2ch1-win--2 { animation:b2-badge-pop 0.5s ease 0.35s forwards, b2-float-soft 4.5s ease-in-out 1.3s infinite; }
[data-reveal].is-visible .b2ch1-win--3 { animation:b2-badge-pop 0.5s ease 0.5s forwards, b2-float-soft 5s ease-in-out 1.6s infinite; }
[data-reveal].is-visible .b2ch1-win--4 { animation:b2-badge-pop 0.5s ease 0.65s forwards, b2-float-soft 4.2s ease-in-out 1.9s infinite; }
[data-reveal].is-visible .b2ch1-win--5 { animation:b2-badge-pop 0.5s ease 0.8s forwards, b2-float-soft 4.8s ease-in-out 2.2s infinite; }
.b2ch1-link { stroke:var(--x-border); stroke-width:1.5; stroke-linecap:round; stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2ch1-link--1 { animation:b2-draw 0.5s ease 1s forwards; }
[data-reveal].is-visible .b2ch1-link--2 { animation:b2-draw 0.5s ease 1.15s forwards; }
[data-reveal].is-visible .b2ch1-link--3 { animation:b2-draw 0.5s ease 1.3s forwards; }
[data-reveal].is-visible .b2ch1-link--4 { animation:b2-draw 0.5s ease 1.45s forwards; }
.b2ch1-q { opacity:0; }
[data-reveal].is-visible .b2ch1-q--1 { animation:b2-badge-pop 0.4s ease 1.6s forwards, b2-float-soft 3s ease-in-out 2.2s infinite; }
[data-reveal].is-visible .b2ch1-q--2 { animation:b2-badge-pop 0.4s ease 1.8s forwards, b2-float-soft 3.5s ease-in-out 2.5s infinite; }
[data-reveal].is-visible .b2ch1-q--3 { animation:b2-badge-pop 0.4s ease 2s forwards, b2-float-soft 4s ease-in-out 2.8s infinite; }

/* Challenge 2: Lost opportunity */
.b2ch2-line { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2ch2-line { animation:b2-draw 1.2s ease 0.2s forwards; }
.b2ch2-dot { opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2ch2-dot { animation:b2-dot-pop 0.3s ease forwards; }
[data-reveal].is-visible .b2ch2-dot:nth-of-type(1) { animation-delay:0.3s; }
[data-reveal].is-visible .b2ch2-dot:nth-of-type(2) { animation-delay:0.5s; }
[data-reveal].is-visible .b2ch2-dot:nth-of-type(3) { animation-delay:0.7s; }
[data-reveal].is-visible .b2ch2-dot:nth-of-type(4) { animation-delay:0.9s; }
[data-reveal].is-visible .b2ch2-dot:nth-of-type(5) { animation-delay:1.1s; }
.b2ch2-break { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2ch2-break { animation:b2-draw 0.4s ease 1.4s forwards; }
.b2ch2-fade { stroke-dasharray:1; stroke-dashoffset:1; opacity:0.4; }
[data-reveal].is-visible .b2ch2-fade { animation:b2-draw 0.4s ease 1.7s forwards; }
.b2ch2-alert { opacity:0; }
[data-reveal].is-visible .b2ch2-alert { animation:b2-badge-pop 0.4s ease 2s forwards, b2-float-soft 3s ease-in-out 2.6s infinite; }
.b2ch2-alert-bg { fill:var(--x-error-soft); stroke:var(--x-error); stroke-width:1; }
.b2ch2-alert-t { fill:var(--x-error); font-size:10px; font-weight:700; font-family:var(--x-font-sans); }
.b2ch2-clock { opacity:0; }
[data-reveal].is-visible .b2ch2-clock { animation:b2-badge-pop 0.4s ease 0.5s forwards, b2-float-soft 4s ease-in-out 1.2s infinite; }
.b2ch2-clock-face { fill:none; stroke:var(--x-border); stroke-width:1.5; }
.b2ch2-clock-hand { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2ch2-clock-hand { animation:b2-draw 0.5s ease 0.8s forwards; }
.b2ch2-ghost { opacity:0; }
.b2ch2-ghost-bg { fill:var(--x-surface-hover); stroke:var(--x-border); stroke-width:1; stroke-dasharray:3 3; }
.b2ch2-ghost-t { fill:var(--x-text-muted); font-size:7px; font-weight:600; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2ch2-ghost--1 { animation:b2-b2-ghost-fade 4s ease-in-out 1.5s infinite; }
[data-reveal].is-visible .b2ch2-ghost--2 { animation:b2-b2-ghost-fade 4s ease-in-out 2s infinite; }
@keyframes b2-b2-ghost-fade {
  0%,10% { opacity:0; transform:translateY(4px); }
  25% { opacity:0.5; transform:translateY(0); }
  75% { opacity:0.5; transform:translateY(0); }
  90%,100% { opacity:0; transform:translateY(-4px); }
}

/* Challenge 3: Untargeted */
.b2ch3-source { fill:var(--x-primary); opacity:0.85; }
.b2ch3-wave { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2ch3-wave--1 { animation:b2-draw 0.5s ease 0.3s forwards; }
[data-reveal].is-visible .b2ch3-wave--2 { animation:b2-draw 0.5s ease 0.5s forwards; }
[data-reveal].is-visible .b2ch3-wave--3 { animation:b2-draw 0.5s ease 0.7s forwards; }
.b2ch3-user { opacity:0; }
.b2ch3-user-bg { fill:var(--x-surface); stroke:var(--x-border); stroke-width:1.5; }
.b2ch3-user-t { fill:var(--x-text-muted); font-size:10px; font-weight:700; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2ch3-user--1 { animation:b2-badge-pop 0.4s ease 0.9s forwards; }
[data-reveal].is-visible .b2ch3-user--2 { animation:b2-badge-pop 0.4s ease 1.05s forwards; }
[data-reveal].is-visible .b2ch3-user--3 { animation:b2-badge-pop 0.4s ease 1.2s forwards; }
.b2ch3-x { opacity:0; }
.b2ch3-x-ring { fill:none; stroke:var(--x-error); stroke-width:1; opacity:0.3; }
[data-reveal].is-visible .b2ch3-x--1 { animation:b2-badge-pop 0.3s ease 1.5s forwards; }
[data-reveal].is-visible .b2ch3-x--2 { animation:b2-badge-pop 0.3s ease 1.65s forwards; }
[data-reveal].is-visible .b2ch3-x--3 { animation:b2-badge-pop 0.3s ease 1.8s forwards; }
.b2ch3-counter { opacity:0; }
.b2ch3-counter-bg { fill:var(--x-base); stroke:var(--x-border); stroke-width:1; }
.b2ch3-counter-l { fill:var(--x-text-muted); font-size:8px; font-weight:600; font-family:var(--x-font-sans); }
.b2ch3-counter-v { fill:var(--x-error); font-size:14px; font-weight:800; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2ch3-counter { animation:b2-badge-pop 0.4s ease 2s forwards; }

/* Challenge 4: Blind decisions */
.b2ch4-bar { opacity:0; transform-origin:center bottom; transform-box:fill-box; }
.b2ch4-bar--1 { fill:var(--x-border); } .b2ch4-bar--2 { fill:var(--x-border); } .b2ch4-bar--3 { fill:var(--x-border); } .b2ch4-bar--4 { fill:var(--x-primary); opacity:0.4; } .b2ch4-bar--5 { fill:var(--x-border); }
[data-reveal].is-visible .b2ch4-bar { animation:b2-bar-grow 0.7s var(--x-ease-standard) forwards; }
[data-reveal].is-visible .b2ch4-bar--1 { animation-delay:0.2s; } [data-reveal].is-visible .b2ch4-bar--2 { animation-delay:0.32s; }
[data-reveal].is-visible .b2ch4-bar--3 { animation-delay:0.44s; } [data-reveal].is-visible .b2ch4-bar--4 { animation-delay:0.56s; }
[data-reveal].is-visible .b2ch4-bar--5 { animation-delay:0.68s; }
.b2ch4-person { opacity:0; }
[data-reveal].is-visible .b2ch4-person { animation:b2-badge-pop 0.5s ease 0.8s forwards; }
.b2ch4-person-head { fill:var(--x-border); }
.b2ch4-axis-t { fill:var(--x-text-muted); font-size:9px; font-weight:600; font-family:var(--x-font-sans); }

/* ══════════════════════════════════════════
   INDUSTRIES FULL SECTIONS
   ══════════════════════════════════════════ */
.xcrm-b2__ind-sec { display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,64px); align-items:center; margin-bottom:clamp(48px,7vw,80px); }
.xcrm-b2__ind-sec:last-child { margin-bottom:0; }
.xcrm-b2__ind-sec--rev .xcrm-b2__ind-sec-visual { order:2; } .xcrm-b2__ind-sec--rev .xcrm-b2__ind-sec-body { order:1; }
.xcrm-b2__ind-sec-visual { border-radius:var(--x-radius-2xl); overflow:hidden; }
.xcrm-b2__ind-sec-num { display:inline-flex; font-size:0.78rem; font-weight:800; color:var(--x-primary); background:var(--x-soft-primary); border-radius:999px; padding:5px 14px; margin-bottom:14px; }
.dark .xcrm-b2__ind-sec-num { color:#a5b4fc; }
.xcrm-b2__ind-sec-title { font-size:clamp(1.2rem,2.6vw,1.6rem); font-weight:800; color:var(--x-text); line-height:1.4; margin:0 0 14px; }
.xcrm-b2__ind-sec-desc { font-size:clamp(0.9rem,1.6vw,1rem); color:var(--x-text-highlight); line-height:1.9; margin:0 0 20px; }
.xcrm-b2__ind-sec-tags { display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0; padding:0; }
.xcrm-b2__ind-sec-tags li { padding:6px 14px; border-radius:999px; background:var(--x-soft-primary); color:var(--x-primary); font-size:0.76rem; font-weight:700; }
.dark .xcrm-b2__ind-sec-tags li { color:#a5b4fc; }

/* Industry 1: E-commerce infinite */
.b2i1-frame { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; }
.b2i1-tile { fill:var(--x-surface); stroke:var(--x-border-subtle); stroke-width:1; opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2i1-tile--1 { animation:b2-badge-pop 0.4s ease 0.2s forwards, b2-float-soft 4s ease-in-out 1s infinite; }
[data-reveal].is-visible .b2i1-tile--2 { animation:b2-badge-pop 0.4s ease 0.3s forwards, b2-float-soft 4.2s ease-in-out 1.2s infinite; }
[data-reveal].is-visible .b2i1-tile--3 { animation:b2-badge-pop 0.4s ease 0.4s forwards, b2-float-soft 4.4s ease-in-out 1.4s infinite; }
[data-reveal].is-visible .b2i1-tile--4 { animation:b2-badge-pop 0.4s ease 0.5s forwards, b2-float-soft 4.6s ease-in-out 1.6s infinite; }
[data-reveal].is-visible .b2i1-tile--5 { animation:b2-badge-pop 0.4s ease 0.6s forwards, b2-float-soft 4.8s ease-in-out 1.8s infinite; }
[data-reveal].is-visible .b2i1-tile--6 { animation:b2-badge-pop 0.4s ease 0.7s forwards, b2-float-soft 5s ease-in-out 2s infinite; }
.b2i1-cursor { opacity:0; }
[data-reveal].is-visible .b2i1-cursor { animation:b2-badge-pop 0.3s ease 0.9s forwards, b2-float-soft 3s ease-in-out 1.5s infinite; }
.b2i1-fbar { opacity:0; transform-origin:right center; transform-box:fill-box; }
.b2i1-fbar--1 { fill:var(--x-primary); opacity:0.6; } .b2i1-fbar--2 { fill:var(--x-info); opacity:0.5; } .b2i1-fbar--3 { fill:var(--x-success); opacity:0.65; }
[data-reveal].is-visible .b2i1-fbar--1 { animation:b2-row-in 0.4s ease 1s forwards; }
[data-reveal].is-visible .b2i1-fbar--2 { animation:b2-row-in 0.4s ease 1.15s forwards; }
[data-reveal].is-visible .b2i1-fbar--3 { animation:b2-row-in 0.4s ease 1.3s forwards; }
.b2i1-ping { fill:none; stroke:var(--x-success); stroke-width:1.5; opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2i1-ping { animation:b2-ring-pulse 2.5s ease-in-out 1.5s infinite; }
.b2i1-chip { opacity:0; }
.b2i1-chip-bg { fill:var(--x-base); stroke:var(--x-border); stroke-width:1; }
.b2i1-chip-t { fill:var(--x-text-muted); font-size:8px; font-weight:700; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2i1-chip { animation:b2-badge-pop 0.35s ease 0.5s forwards; }

/* Industry 2: Education infinite */
.b2i2-cap-top { opacity:0; }
[data-reveal].is-visible .b2i2-cap-top { animation:b2-badge-pop 0.5s ease 0.2s forwards; }
.b2i2-cap-tassel { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2i2-cap-tassel { animation:b2-draw 0.5s ease 0.5s forwards; }
.b2i2-cap-ball { opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2i2-cap-ball { animation:b2-dot-pop 0.3s ease 0.8s forwards, b2-float-soft 2s ease-in-out 1.2s infinite; }
.b2i2-cap-base { stroke-dasharray:1; stroke-dashoffset:1; opacity:0.6; }
[data-reveal].is-visible .b2i2-cap-base { animation:b2-draw 0.5s ease 0.4s forwards; }
.b2i2-lbar { opacity:0; transform-origin:right center; transform-box:fill-box; }
.b2i2-lbar--1 { fill:var(--x-primary); opacity:0.6; } .b2i2-lbar--2 { fill:var(--x-info); opacity:0.5; } .b2i2-lbar--3 { fill:var(--x-warn); opacity:0.5; } .b2i2-lbar--4 { fill:var(--x-success); opacity:0.65; }
[data-reveal].is-visible .b2i2-lbar--1 { animation:b2-row-in 0.4s ease 1s forwards; }
[data-reveal].is-visible .b2i2-lbar--2 { animation:b2-row-in 0.4s ease 1.15s forwards; }
[data-reveal].is-visible .b2i2-lbar--3 { animation:b2-row-in 0.4s ease 1.3s forwards; }
[data-reveal].is-visible .b2i2-lbar--4 { animation:b2-row-in 0.4s ease 1.45s forwards; }
.b2i2-bell { opacity:0; }
[data-reveal].is-visible .b2i2-bell { animation:b2-badge-pop 0.4s ease 1.2s forwards, b2-bell-ring 1.5s ease 1.8s 2; }
.b2i2-nbadge { opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2i2-nbadge { animation:b2-badge-pop 0.35s ease 1.5s forwards; }
.b2i2-student { opacity:0; }
[data-reveal].is-visible .b2i2-student--1 { animation:b2-badge-pop 0.4s ease 0.5s forwards; }
[data-reveal].is-visible .b2i2-student--2 { animation:b2-badge-pop 0.4s ease 0.65s forwards; }
[data-reveal].is-visible .b2i2-student--3 { animation:b2-badge-pop 0.4s ease 0.8s forwards; }

/* Industry 3: B2B infinite */
.b2i3-deal { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; opacity:0; }
[data-reveal].is-visible .b2i3-deal { animation:b2-card-in 0.5s ease 0.15s forwards; }
.b2i3-hand { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2i3-hand { animation:b2-draw 0.5s ease 0.55s forwards; }
.b2i3-deal-t { fill:var(--x-text-muted); font-size:9px; font-weight:700; font-family:var(--x-font-sans); opacity:0; }
[data-reveal].is-visible .b2i3-deal-t { animation:b2-fade 0.4s ease 0.8s forwards; }
.b2i3-stage { opacity:0; transform:translateY(8px); }
[data-reveal].is-visible .b2i3-stage--1 { animation:b2-card-in 0.4s ease 1s forwards; }
[data-reveal].is-visible .b2i3-stage--2 { animation:b2-card-in 0.4s ease 1.15s forwards; }
[data-reveal].is-visible .b2i3-stage--3 { animation:b2-card-in 0.4s ease 1.3s forwards; }
.b2i3-stage-bg { fill:var(--x-surface); stroke:var(--x-border); stroke-width:1; }
.b2i3-stage-t { fill:var(--x-text); font-size:9px; font-weight:700; font-family:var(--x-font-sans); }
.b2i3-arrow { stroke:var(--x-border); stroke-width:1.5; stroke-linecap:round; stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2i3-arrow--1 { animation:b2-draw 0.3s ease 1.2s forwards; }
[data-reveal].is-visible .b2i3-arrow--2 { animation:b2-draw 0.3s ease 1.35s forwards; }
.b2i3-adot { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2i3-adot--1 { fill:var(--x-primary); } .b2i3-adot--2 { fill:var(--x-info); } .b2i3-adot--3 { fill:var(--x-success); } .b2i3-adot--4 { fill:var(--x-warn); } .b2i3-adot--5 { fill:var(--x-purple); }
[data-reveal].is-visible .b2i3-adot { animation:b2-dot-pop 0.3s ease forwards; }
[data-reveal].is-visible .b2i3-adot--1 { animation-delay:1.5s; } [data-reveal].is-visible .b2i3-adot--2 { animation-delay:1.6s; }
[data-reveal].is-visible .b2i3-adot--3 { animation-delay:1.7s; } [data-reveal].is-visible .b2i3-adot--4 { animation-delay:1.8s; }
[data-reveal].is-visible .b2i3-adot--5 { animation-delay:1.9s; }
.b2i3-timeline { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2i3-timeline { animation:b2-draw 0.8s ease 1.4s forwards; }
.b2i3-check { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2i3-check path { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2i3-check { animation:b2-badge-pop 0.4s ease 0.7s forwards; }
[data-reveal].is-visible .b2i3-check path { animation:b2-draw 0.35s ease 0.9s forwards; }

/* Industry 4: Services infinite */
.b2i4-clip { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; opacity:0; }
[data-reveal].is-visible .b2i4-clip { animation:b2-card-in 0.5s ease 0.1s forwards; }
.b2i4-clip-tab { fill:var(--x-primary); opacity:0; }
[data-reveal].is-visible .b2i4-clip-tab { animation:b2-badge-pop 0.3s ease 0.3s forwards; }
.b2i4-task { opacity:0; transform:translateX(-8px); }
[data-reveal].is-visible .b2i4-task--1 { animation:b2-row-in 0.35s ease 0.4s forwards; }
[data-reveal].is-visible .b2i4-task--2 { animation:b2-row-in 0.35s ease 0.52s forwards; }
[data-reveal].is-visible .b2i4-task--3 { animation:b2-row-in 0.35s ease 0.64s forwards; }
[data-reveal].is-visible .b2i4-task--4 { animation:b2-row-in 0.35s ease 0.76s forwards; }
[data-reveal].is-visible .b2i4-task--5 { animation:b2-row-in 0.35s ease 0.88s forwards; }
.b2i4-tdot { fill:none; stroke:var(--x-border); stroke-width:1.5; }
.b2i4-tdot--done { fill:var(--x-success); stroke:var(--x-success); }
.b2i4-tdot--active { fill:var(--x-primary); stroke:var(--x-primary); }
.b2i4-tline { fill:var(--x-text-muted); opacity:0.25; }
.b2i4-ring { fill:none; stroke:var(--x-primary); stroke-width:1.5; opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2i4-ring { animation:b2-ring-pulse 2.5s ease-in-out 0.8s infinite; }
.b2i4-clip-line { stroke:var(--x-border); stroke-width:1.5; stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2i4-clip-line { animation:b2-draw 0.4s ease 0.7s forwards; }
.b2i4-pill { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2i4-pill-bg { fill:var(--x-soft-primary); }
.b2i4-pill-t { fill:var(--x-primary); font-size:8px; font-weight:700; font-family:var(--x-font-sans); }
.dark .b2i4-pill-t { fill:#a5b4fc; }
[data-reveal].is-visible .b2i4-pill--1 { animation:b2-badge-pop 0.35s ease 1s forwards; }
[data-reveal].is-visible .b2i4-pill--2 { animation:b2-badge-pop 0.35s ease 1.15s forwards; }

/* ══════════════════════════════════════════
   INTEGRATIONS INFINITE HUB
   ══════════════════════════════════════════ */
.b2h-glow { opacity:0; }
[data-reveal].is-visible .b2h-glow { animation:b2-fade 1.2s ease 0.3s forwards; }
.b2h-particle { opacity:0; }
[data-reveal].is-visible .b2h-particle { animation:b2-fade 0.4s ease forwards; }
[data-reveal].is-visible .b2h-particle--1 { animation-delay:1.5s; }
[data-reveal].is-visible .b2h-particle--2 { animation-delay:2s; }
[data-reveal].is-visible .b2h-particle--3 { animation-delay:2.5s; }
[data-reveal].is-visible .b2h-particle--4 { animation-delay:3s; }
.b2h-npulse { fill:none; stroke-width:1; opacity:0; transform-origin:center; transform-box:fill-box; }
.b2h-npulse--1 { stroke:var(--x-primary); } .b2h-npulse--2 { stroke:var(--x-cyan); } .b2h-npulse--3 { stroke:var(--x-success); }
.b2h-npulse--4 { stroke:var(--x-warn); } .b2h-npulse--5 { stroke:var(--x-pink); } .b2h-npulse--6 { stroke:var(--x-purple); }
[data-reveal].is-visible .b2h-npulse--1 { animation:b2-ring-pulse 3s ease-in-out 1s infinite; }
[data-reveal].is-visible .b2h-npulse--2 { animation:b2-ring-pulse 3s ease-in-out 1.5s infinite; }
[data-reveal].is-visible .b2h-npulse--3 { animation:b2-ring-pulse 3s ease-in-out 2s infinite; }
[data-reveal].is-visible .b2h-npulse--4 { animation:b2-ring-pulse 3s ease-in-out 2.5s infinite; }
[data-reveal].is-visible .b2h-npulse--5 { animation:b2-ring-pulse 3s ease-in-out 3s infinite; }
[data-reveal].is-visible .b2h-npulse--6 { animation:b2-ring-pulse 3s ease-in-out 3.5s infinite; }

/* ══════════════════════════════════════════
   GETTING STARTED INFINITE STEPS
   ══════════════════════════════════════════ */
.xcrm-b2__step-body { display:flex; flex-direction:column; gap:12px; }
.xcrm-b2__step-svg { width:100%; max-width:140px; height:auto; }
.b2st-card { fill:var(--x-soft-primary); stroke:var(--x-border-subtle); stroke-width:1; }
.b2st-card--target { fill:var(--x-soft-success); }
.b2st-line { fill:var(--x-text-muted); opacity:0.3; }
.b2st-check { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2st-check { animation:b2-draw 0.5s ease 0.4s forwards; }
.b2st-pulse { fill:none; stroke:var(--x-primary); stroke-width:1.5; opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2st-pulse { animation:b2-ring-pulse 2.5s ease-in-out 0.6s infinite; }
.b2st-arrow { stroke-dasharray:1; stroke-dashoffset:1; }
.b2st-arrow-head { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2st-arrow { animation:b2-draw 0.4s ease 0.3s forwards; }
[data-reveal].is-visible .b2st-arrow-head { animation:b2-draw 0.3s ease 0.6s forwards; }
.b2st-file-t { fill:var(--x-primary); font-size:10px; font-weight:800; font-family:var(--x-font-sans); }
.b2st-ring { fill:none; stroke-width:1; opacity:0; transform-origin:center; transform-box:fill-box; }
.b2st-ring--1 { stroke:var(--x-primary); } .b2st-ring--2 { stroke:var(--x-border); stroke-dasharray:4 4; }
[data-reveal].is-visible .b2st-ring--1 { animation:b2-ring-pulse 2.5s ease-in-out 0.4s infinite; }
[data-reveal].is-visible .b2st-ring--2 { animation:b2-ring-pulse 2.5s ease-in-out 0.8s infinite; }
.b2st-bar { opacity:0; transform-origin:center bottom; transform-box:fill-box; }
.b2st-bar--1 { fill:var(--x-border); } .b2st-bar--2 { fill:var(--x-border); } .b2st-bar--3 { fill:var(--x-border); } .b2st-bar--4 { fill:var(--x-primary); opacity:0.5; }
[data-reveal].is-visible .b2st-bar { animation:b2-bar-grow 0.6s var(--x-ease-standard) forwards; }
[data-reveal].is-visible .b2st-bar--1 { animation-delay:0.2s; } [data-reveal].is-visible .b2st-bar--2 { animation-delay:0.32s; }
[data-reveal].is-visible .b2st-bar--3 { animation-delay:0.44s; } [data-reveal].is-visible .b2st-bar--4 { animation-delay:0.56s; }
.b2st-line-chart { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2st-line-chart { animation:b2-draw 0.8s ease 0.7s forwards; }

/* ══════════════════════════════════════════
   GETTING STARTED FULL SECTIONS
   ══════════════════════════════════════════ */
/* Step 1: Account setup */
.b2s1-card { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; opacity:0; }
[data-reveal].is-visible .b2s1-card { animation:b2-card-in 0.5s ease 0.1s forwards; }
.b2s1-header { fill:var(--x-primary); opacity:0.08; }
.b2s1-header-t { fill:var(--x-text-muted); font-size:9px; font-weight:700; font-family:var(--x-font-sans); }
.b2s1-avatar { opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2s1-avatar { animation:b2-badge-pop 0.5s ease 0.3s forwards; }
.b2s1-ring { fill:none; stroke:var(--x-primary); stroke-width:1.5; opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2s1-ring { animation:b2-ring-pulse 3s ease-in-out 0.5s infinite; }
.b2s1-line { fill:var(--x-text-muted); opacity:0; }
[data-reveal].is-visible .b2s1-line--1 { animation:b2-row-in 0.4s ease 0.45s forwards; }
[data-reveal].is-visible .b2s1-line--2 { animation:b2-row-in 0.4s ease 0.55s forwards; }
.b2s1-field { fill:var(--x-surface); stroke:var(--x-border); stroke-width:1; opacity:0; }
[data-reveal].is-visible .b2s1-field--1 { animation:b2-badge-pop 0.35s ease 0.6s forwards; }
[data-reveal].is-visible .b2s1-field--2 { animation:b2-badge-pop 0.35s ease 0.7s forwards; }
[data-reveal].is-visible .b2s1-field--3 { animation:b2-badge-pop 0.35s ease 0.8s forwards; }
.b2s1-check { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2s1-check path { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2s1-check { animation:b2-badge-pop 0.4s ease 0.9s forwards; }
[data-reveal].is-visible .b2s1-check path { animation:b2-draw 0.35s ease 1.1s forwards; }
.b2s1-gear { opacity:0; }
[data-reveal].is-visible .b2s1-gear { animation:b2-badge-pop 0.4s ease 0.7s forwards, b2-float-soft 4s ease-in-out 1.3s infinite; }
.b2s1-dot { opacity:0; }
[data-reveal].is-visible .b2s1-dot--1 { animation:b2-dot-pop 0.3s ease 1s forwards, b2-float-soft 3s ease-in-out 1.6s infinite; }
[data-reveal].is-visible .b2s1-dot--2 { animation:b2-dot-pop 0.3s ease 1.2s forwards, b2-float-soft 3.5s ease-in-out 1.8s infinite; }
[data-reveal].is-visible .b2s1-dot--3 { animation:b2-dot-pop 0.3s ease 1.4s forwards, b2-float-soft 4s ease-in-out 2s infinite; }

/* Step 2: Import data */
.b2s2-file-bg { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; }
.b2s2-file-fold { fill:var(--x-soft-primary); stroke:var(--x-primary); stroke-width:1.5; stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2s2-file-fold { animation:b2-draw 0.6s ease 0.2s forwards; }
.b2s2-file-t { fill:var(--x-primary); font-size:14px; font-weight:800; font-family:var(--x-font-sans); opacity:0; }
[data-reveal].is-visible .b2s2-file-t { animation:b2-fade 0.4s ease 0.5s forwards; }
.b2s2-arrow { stroke-dasharray:1; stroke-dashoffset:1; }
.b2s2-arrow-head { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2s2-arrow { animation:b2-draw 0.4s ease 0.7s forwards; }
[data-reveal].is-visible .b2s2-arrow-head { animation:b2-draw 0.3s ease 0.9s forwards; }
.b2s2-target { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; opacity:0; }
[data-reveal].is-visible .b2s2-target { animation:b2-card-in 0.5s ease 0.3s forwards; }
.b2s2-target-header { fill:var(--x-primary); opacity:0.08; }
.b2s2-target-t { fill:var(--x-text-muted); font-size:9px; font-weight:700; font-family:var(--x-font-sans); }
.b2s2-row { opacity:0; transform:translateX(-8px); }
.b2s2-row-bg { fill:var(--x-surface); stroke:var(--x-border-subtle); stroke-width:1; }
.b2s2-row-l { fill:var(--x-text-muted); opacity:0.25; }
[data-reveal].is-visible .b2s2-row--1 { animation:b2-row-in 0.35s ease 1.1s forwards; }
[data-reveal].is-visible .b2s2-row--2 { animation:b2-row-in 0.35s ease 1.25s forwards; }
[data-reveal].is-visible .b2s2-row--3 { animation:b2-row-in 0.35s ease 1.4s forwards; }
[data-reveal].is-visible .b2s2-row--4 { animation:b2-row-in 0.35s ease 1.55s forwards; }
.b2s2-progress-bg { fill:var(--x-border-subtle); }
.b2s2-progress-fill { fill:var(--x-primary); opacity:0.7; transform-origin:right center; transform-box:fill-box; transform:scaleX(0); }
[data-reveal].is-visible .b2s2-progress-fill { animation:b2-funnel-fill 1s ease 1.7s forwards; }
.b2s2-chip { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2s2-chip-bg { fill:var(--x-soft-primary); stroke:var(--x-primary); stroke-width:1; }
.b2s2-chip-t { fill:var(--x-primary); font-size:8px; font-weight:700; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2s2-chip--1 { animation:b2-badge-pop 0.35s ease 0.6s forwards; }
[data-reveal].is-visible .b2s2-chip--2 { animation:b2-badge-pop 0.35s ease 0.75s forwards; }
.b2s2-dot { opacity:0; }
[data-reveal].is-visible .b2s2-dot--1 { animation:b2-dot-pop 0.3s ease 1s forwards, b2-float-soft 3s ease-in-out 1.6s infinite; }
[data-reveal].is-visible .b2s2-dot--2 { animation:b2-dot-pop 0.3s ease 1.2s forwards, b2-float-soft 3.5s ease-in-out 1.8s infinite; }

/* Step 3: Configure */
.b2s3-panel { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; opacity:0; }
[data-reveal].is-visible .b2s3-panel { animation:b2-card-in 0.5s ease 0.1s forwards; }
.b2s3-panel-t { fill:var(--x-text-muted); font-size:10px; font-weight:700; font-family:var(--x-font-sans); }
.b2s3-cond { opacity:0; transform:translateY(6px); }
.b2s3-cond-bg { fill:var(--x-surface); stroke:var(--x-border); stroke-width:1; }
.b2s3-cond-t { fill:var(--x-text); font-size:8px; font-weight:600; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2s3-cond--1 { animation:b2-card-in 0.4s ease 0.3s forwards; }
[data-reveal].is-visible .b2s3-cond--2 { animation:b2-card-in 0.4s ease 0.45s forwards; }
[data-reveal].is-visible .b2s3-cond--3 { animation:b2-card-in 0.4s ease 0.6s forwards; }
.b2s3-logic { fill:var(--x-soft-primary); stroke:var(--x-primary); stroke-width:1; opacity:0; transform-origin:center; transform-box:fill-box; }
.b2s3-logic-t { fill:var(--x-primary); font-size:8px; font-weight:800; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2s3-logic { animation:b2-badge-pop 0.3s ease 0.5s forwards; }
[data-reveal].is-visible .b2s3-logic:nth-of-type(2) { animation-delay:0.65s; }
.b2s3-chan { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2s3-chan-bg { fill:var(--x-base); stroke:var(--x-border); stroke-width:1; }
.b2s3-chan-t { fill:var(--x-text); font-size:9px; font-weight:700; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2s3-chan--sms { animation:b2-badge-pop 0.35s ease 0.8s forwards; }
[data-reveal].is-visible .b2s3-chan--tg { animation:b2-badge-pop 0.35s ease 0.95s forwards; }
[data-reveal].is-visible .b2s3-chan--email { animation:b2-badge-pop 0.35s ease 1.1s forwards; }
.b2s3-flow { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2s3-flow--1 { animation:b2-draw 0.4s ease 1.2s forwards; }
[data-reveal].is-visible .b2s3-flow--2 { animation:b2-draw 0.4s ease 1.35s forwards; }
[data-reveal].is-visible .b2s3-flow--3 { animation:b2-draw 0.4s ease 1.5s forwards; }
.b2s3-toggle { opacity:0; }
.b2s3-toggle-bg { fill:var(--x-soft-success); stroke:var(--x-success); stroke-width:1; }
.b2s3-toggle-t { fill:var(--x-accent-success); font-size:8px; font-weight:800; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2s3-toggle { animation:b2-badge-pop 0.4s ease 1.7s forwards; }
.b2s3-dot { opacity:0; }
[data-reveal].is-visible .b2s3-dot--1 { animation:b2-dot-pop 0.3s ease 1.5s forwards, b2-float-soft 3s ease-in-out 2.1s infinite; }
[data-reveal].is-visible .b2s3-dot--2 { animation:b2-dot-pop 0.3s ease 1.7s forwards, b2-float-soft 3.5s ease-in-out 2.3s infinite; }

/* Step 4: Review dashboard */
.b2s4-frame { fill:var(--x-base); stroke:var(--x-border-subtle); stroke-width:1.5; opacity:0; }
[data-reveal].is-visible .b2s4-frame { animation:b2-card-in 0.5s ease 0.1s forwards; }
.b2s4-header { fill:var(--x-primary); opacity:0.06; }
.b2s4-header-t { fill:var(--x-text-muted); font-size:9px; font-weight:700; font-family:var(--x-font-sans); }
.b2s4-kpi { opacity:0; transform:translateY(8px); }
.b2s4-kpi-bg { fill:var(--x-surface); stroke:var(--x-border-subtle); stroke-width:1; }
.b2s4-kpi-l { fill:var(--x-text-muted); font-size:7px; font-weight:600; font-family:var(--x-font-sans); }
.b2s4-kpi-v { fill:var(--x-text); font-size:12px; font-weight:800; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2s4-kpi--1 { animation:b2-card-in 0.4s ease 0.3s forwards; }
[data-reveal].is-visible .b2s4-kpi--2 { animation:b2-card-in 0.4s ease 0.42s forwards; }
[data-reveal].is-visible .b2s4-kpi--3 { animation:b2-card-in 0.4s ease 0.54s forwards; }
.b2s4-bar { transform-origin:center bottom; transform-box:fill-box; opacity:0; animation:b2-bar-grow 0.7s var(--x-ease-standard) forwards; animation-delay:calc(0.6s + var(--i,0)*0.08s); }
.b2s4-line { stroke-dasharray:1; stroke-dashoffset:1; }
[data-reveal].is-visible .b2s4-line { animation:b2-draw 1s ease 1s forwards; }
.b2s4-dot { fill:var(--x-cyan); stroke:var(--x-base); stroke-width:2; opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2s4-dot { animation:b2-dot-pop 0.3s ease forwards; animation-delay:calc(1.1s + var(--i,0)*0.1s); }
.b2s4-pulse { fill:none; stroke:var(--x-success); stroke-width:1.5; opacity:0; transform-origin:center; transform-box:fill-box; }
[data-reveal].is-visible .b2s4-pulse { animation:b2-ring-pulse 2.5s ease-in-out 1.8s infinite; }
.b2s4-badge { opacity:0; transform-origin:center; transform-box:fill-box; }
.b2s4-badge-bg { fill:var(--x-soft-success); stroke:var(--x-success); stroke-width:1; }
.b2s4-badge-t { fill:var(--x-accent-success); font-size:9px; font-weight:800; font-family:var(--x-font-sans); }
[data-reveal].is-visible .b2s4-badge { animation:b2-badge-pop 0.4s ease 2s forwards, b2-float-soft 3s ease-in-out 2.6s infinite; }

/* ── Responsive ── */
@media (max-width:1024px) {
  .xcrm-b2__grid-4, .xcrm-b2__ind-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .xcrm-b2__steps { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .xcrm-b2__steps::before { display:none; }
  .xcrm-b2__ring--3 { display:none; }
  .xcrm-b2__kanban { grid-template-columns:repeat(5,minmax(160px,1fr)); }
  .xcrm-b2__chal, .xcrm-b2__ind-sec { grid-template-columns:1fr; gap:24px; }
  .xcrm-b2__chal--rev .xcrm-b2__chal-visual, .xcrm-b2__ind-sec--rev .xcrm-b2__ind-sec-visual { order:unset; }
  .xcrm-b2__chal--rev .xcrm-b2__chal-body, .xcrm-b2__ind-sec--rev .xcrm-b2__ind-sec-body { order:unset; }
}
@media (max-width:860px) {
  .xcrm-b2__hero-inner, .xcrm-b2__split { grid-template-columns:1fr; }
  .xcrm-b2__split--rev .xcrm-b2__split-copy, .xcrm-b2__split--rev .xcrm-b2__split-visual { order:unset; }
  .xcrm-b2__hero { padding:110px 0 60px; }
  .xcrm-b2__ring--2 { display:none; }
}
@media (max-width:640px) {
  .hp__nav { display:none; }
  .xcrm-b2__grid-4, .xcrm-b2__ind-grid, .xcrm-b2__steps { grid-template-columns:1fr; }
  .xcrm-b2__hero-actions { flex-direction:column; align-items:stretch; }
  .xcrm-b2__hero-actions .xcrm-b2__btn { width:100%; }
  .xcrm-b2__hero-stats { flex-wrap:wrap; gap:14px; justify-content:center; }
  .xcrm-b2__final-actions { flex-direction:column; align-items:stretch; }
  .xcrm-b2__footer-inner { flex-direction:column; text-align:center; }
  .xcrm-b2__mesh { display:none; }
  .xcrm-b2__kanban { grid-template-columns:repeat(5,minmax(140px,1fr)); }
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  .xcrm-b2-anim, .xcrm-b2__card, .xcrm-b2__step, .xcrm-b2__ind-card, .xcrm-b2__kcol, .xcrm-b2__faq-item,
  .xcrm-b2__chal, .xcrm-b2__ind-sec, .xcrm-b2__chal-visual, .xcrm-b2__ind-sec-visual, .xcrm-b2__step-body,
  .b2f-draw, .b2f-node-bg, .b2f-label, .b2f-check, .b2f-dot, .b2f-eye, .b2f-seg-ring,
  .b2p-card, .b2p-avatar, .b2p-ring, .b2p-line, .b2p-pill, .b2p-tag, .b2p-tl-dot, .b2p-tl-line,
  .b2fu-cal, .b2fu-cal-head, .b2fu-cal-dot, .b2fu-bell-path, .b2fu-bell-clapper, .b2fu-nbadge, .b2fu-task, .b2fu-link,
  .b2s-cluster, .b2s-node, .b2s-flow, .b2s-lbl, .b2s-camp, .b2s-funnel, .b2s-cluster-pulse, .b2s-camp-pulse, .b2s-glow,
  .b2s-src-ring, .b2s-src-core, .b2s-dot, .b2s-engine-frame, .b2s-engine-header, .b2s-cond, .b2s-and,
  .b2s-g-circle, .b2s-g-pulse, .b2s-g-lbl, .b2s-camp-frame, .b2s-c-ch, .b2s-camp-status,
  .b2a-bar, .b2a-line, .b2a-dot, .b2a-funnel, .b2a-kpi, .b2a-glow, .b2a-area, .b2a-pulse, .b2a-donut,
  .b2c-core, .b2c-chan, .b2c-flow,
  .b2t-role, .b2t-link, .b2t-pdot,
  .b2h-core, .b2h-ring, .b2h-spoke, .b2h-node, .b2h-npulse, .b2h-glow,
  .b2st-card, .b2st-check, .b2st-pulse, .b2st-arrow, .b2st-arrow-head, .b2st-ring, .b2st-bar, .b2st-line-chart,
  .b2k-card, .b2k-new, .b2k-move, .b2k-win, .b2k-count, .b2k-arrow,
  .b2ch1-win, .b2ch1-link, .b2ch1-q,
  .b2ch2-line, .b2ch2-dot, .b2ch2-break, .b2ch2-fade, .b2ch2-alert, .b2ch2-clock, .b2ch2-clock-hand, .b2ch2-ghost,
  .b2ch3-wave, .b2ch3-user, .b2ch3-x, .b2ch3-counter, .b2ch3-source,
  .b2ch4-bar, .b2ch4-person,
  .b2i1-tile, .b2i1-cursor, .b2i1-fbar, .b2i1-ping, .b2i1-chip,
  .b2i2-cap-top, .b2i2-cap-tassel, .b2i2-cap-ball, .b2i2-cap-base, .b2i2-lbar, .b2i2-bell, .b2i2-nbadge, .b2i2-student,
  .b2i3-deal, .b2i3-hand, .b2i3-deal-t, .b2i3-stage, .b2i3-arrow, .b2i3-adot, .b2i3-timeline, .b2i3-check,
  .b2i4-clip, .b2i4-clip-tab, .b2i4-task, .b2i4-ring, .b2i4-clip-line, .b2i4-pill,
  .xcrm-b2__ring, .xcrm-b2__orb, .xcrm-b2__deco, .xcrm-b2__final-box, .xcrm-b2__pricing-box::before {
    animation:none !important; opacity:1 !important; transform:none !important;
  }
  .b2f-draw, .b2f-check, .b2f-eye, .b2p-tl-line, .b2fu-bell-path, .b2fu-link, .b2s-flow, .b2s-funnel-body, .b2s-funnel-spout, .b2s-camp-check, .b2a-line, .b2a-donut, .b2c-flow, .b2t-link, .b2h-spoke, .b2st-check, .b2st-arrow, .b2st-arrow-head, .b2st-line-chart,
  .b2ch1-link, .b2ch2-line, .b2ch2-break, .b2ch2-fade, .b2ch2-clock-hand, .b2ch3-wave,
  .b2i2-cap-tassel, .b2i2-cap-base, .b2i3-hand, .b2i3-arrow, .b2i3-timeline, .b2i3-check path, .b2i4-clip-line {
    stroke-dashoffset:0 !important;
  }
  .b2f-particle, .b2s-particle, .b2h-particle { display:none; }
  .xcrm-b2__mesh { display:none; }
  .xcrm-b2__card:hover, .xcrm-b2__step:hover, .xcrm-b2__ind-card:hover, .xcrm-b2__btn:hover {
    transform:none !important;
  }
}