/* ═══════════════════════════════════════════
           SECTION 1 — BOOK A DEMO CTA (Split with Flow)
           ═══════════════════════════════════════════ */

        .cta-demo {
            padding: 4rem 4rem;
            margin: 4rem auto;
            max-width: 1280px;
            width: calc(100% - 2.5rem);
            border-radius: 32px;
            background: #09090b;
            position: relative;
            overflow: hidden;
            border: 1px solid rgba(255,255,255,0.05);
        }
        /* Ambient gradient overlays */
        .cta-demo::before {
            content:''; position:absolute; top:-30%; left:-10%; width:60%; height:80%;
            background: radial-gradient(ellipse at 50% 50%, rgba(124,58,237,0.15) 0%, rgba(37,99,235,0.08) 40%, transparent 70%);
            filter: blur(60px); pointer-events:none;
        }
        .cta-demo::after {
            content:''; position:absolute; bottom:-40%; right:-10%; width:70%; height:80%;
            background: radial-gradient(ellipse at 50% 50%, rgba(37,99,235,0.12) 0%, transparent 65%);
            filter: blur(60px); pointer-events:none;
        }
        .cta-demo__in { 
            max-width: 1100px; margin: 0 auto; 
            position: relative; z-index: 1; 
            display: grid; grid-template-columns: 1fr 1.15fr; gap: 3rem; 
            align-items: center; 
        }
        
        .cta-demo__content { display:flex; flex-direction:column; align-items:flex-start; }
        
        .cta-demo__pill {
            display:inline-flex; align-items:center; gap:6px;
            font-size:.6875rem; font-weight:600; text-transform:uppercase; letter-spacing:.08em;
            color:rgba(255,255,255,0.6); background:rgba(255,255,255,0.05); padding:6px 14px; border-radius:100px;
            border:1px solid rgba(255,255,255,0.1); margin-bottom:1.5rem;
        }
        .cta-demo__pill svg { width:12px; height:12px; stroke-width:2.5; }
        .cta-demo__h2 {
            font-size:clamp(2.5rem,4.5vw,3.5rem); font-weight:800; line-height:1.1;
            letter-spacing:-0.03em; color:#fff; margin-bottom:1.25rem; text-align:left;
        }
        .cta-demo__h2 em {
            font-style:normal;
            background:linear-gradient(135deg,#a78bfa,#60a5fa);
            -webkit-background-clip:text; background-clip:text;
            -webkit-text-fill-color:transparent;
        }
        .cta-demo__sub {
            font-size:1.125rem; color:rgba(255,255,255,0.6); line-height:1.6;
            margin-bottom:2.5rem; text-align:left; max-width:480px;
        }
        .cta-demo__btn {
            display:inline-flex; align-items:center; gap:8px;
            padding:16px 36px; border-radius:14px;
            background:linear-gradient(135deg,#2563eb,#7c3aed);
            color:#fff; font-size:1rem; font-weight:700;
            text-decoration:none; letter-spacing:-0.01em;
            transition: transform .25s, box-shadow .25s;
            box-shadow: 0 4px 24px rgba(37,99,235,0.3);
        }
        .cta-demo__btn:hover {
            transform:translateY(-2px);
            box-shadow: 0 8px 32px rgba(37,99,235,0.5);
        }
        .cta-demo__btn svg { width:18px; height:18px; stroke-width:2; }
        .cta-demo__trust {
            margin-top:2rem; display:flex; align-items:center; gap:16px;
            font-size:1rem; color:rgba(255,255,255,0.5); font-weight:500;
        }
        .cta-demo__trust img { width:48px; height:48px; border-radius:50%; object-fit:cover; border:1px solid rgba(255,255,255,0.1); }
        .cta-demo__trust-info { display:flex; flex-direction:column; gap:4px; }
        .cta-demo__trust-n { color:#fff; font-weight:600; font-size:1.125rem; display:flex; align-items:center; gap:8px; }
        .cta-demo__trust-n::after { content:''; display:block; width:8px; height:8px; background:#10b981; border-radius:50%; box-shadow:0 0 10px rgba(16,185,129,0.5); }
        .cta-demo__trust-r { font-size:.875rem; }

        /* Flow / Mockup right side */
        .cta-demo__flow {
            position:relative; width:100%; height:460px;
            border-radius:24px; background:rgba(255,255,255,0.03);
            border:1px solid rgba(255,255,255,0.08);
            box-shadow: 0 25px 50px -12px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.1);
            overflow:hidden; backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
            transform: perspective(1000px) rotateY(-5deg) rotateX(2deg);
            transform-style: preserve-3d;
            transition: transform 0.5s ease;
        }
        .cta-demo__flow:hover {
            transform: perspective(1000px) rotateY(0deg) rotateX(0deg);
        }
        
        .cta-flow__header {
            height:50px; border-bottom:1px solid rgba(255,255,255,0.08);
            display:flex; align-items:center; padding:0 20px; gap:8px;
            background:rgba(255,255,255,0.01);
        }
        .cta-flow__dot { width:10px; height:10px; border-radius:50%; }
        .cta-flow__dot:nth-child(1) { background:#ef4444; }
        .cta-flow__dot:nth-child(2) { background:#eab308; }
        .cta-flow__dot:nth-child(3) { background:#22c55e; }
        
        .cta-flow__body {
            padding:24px; display:flex; gap:20px; height:calc(100% - 50px);
        }
        .cta-flow__sidebar {
            width:60px; display:flex; flex-direction:column; gap:16px; align-items:center;
            padding-right:20px; border-right:1px solid rgba(255,255,255,0.05);
        }
        .cta-flow__nav-item {
            width:36px; height:36px; border-radius:10px; background:rgba(255,255,255,0.03);
            display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,0.3);
        }
        .cta-flow__nav-item.active {
            background:#2563eb; color:#fff; box-shadow:0 0 12px rgba(37,99,235,0.4);
        }
        .cta-flow__nav-item svg { width:18px; height:18px; stroke-width:2; }
        
        .cta-flow__main { flex:1; display:flex; flex-direction:column; gap:20px; }
        .cta-flow__row { display:flex; gap:16px; }
        .cta-flow__card {
            background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.05);
            border-radius:16px; padding:20px; flex:1; position:relative; overflow:hidden;
        }
        .cta-flow__card::before {
            content:''; position:absolute; top:0; left:0; width:100%; height:2px;
        }
        .cta-flow__card.blue::before { background:linear-gradient(90deg,#2563eb,transparent); }
        .cta-flow__card.purple::before { background:linear-gradient(90deg,#7c3aed,transparent); }
        
        .cta-flow__val { font-size:1.75rem; font-weight:800; color:#fff; letter-spacing:-0.02em; margin-bottom:4px; }
        .cta-flow__lbl { font-size:.75rem; color:rgba(255,255,255,0.4); font-weight:500; text-transform:uppercase; letter-spacing:.05em; }
        
        
        /* ═══════════════════════════════════════════════════════
           CHART & CURSOR ANIMATION
           ═══════════════════════════════════════════════════════ */
        
        /* ═══════════════════════════════════════════════════════
           CHART & CURSOR ANIMATION
           ═══════════════════════════════════════════════════════ */
        .cta-flow__chart {
            background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.05);
            border-radius:16px; padding:20px; flex:1; display:flex; flex-direction:column; justify-content:flex-end; gap:8px;
            position: relative; overflow: hidden;
            margin-top: 20px; /* added margin just in case */
        }
        .cta-flow__t { font-size:.875rem; font-weight:600; color:#fff; margin-bottom:auto; position: relative; z-index: 2; }
        /* Grid line */
        .cta-flow__chart::after {
            content:''; position:absolute; bottom:20px; left:20px; right:20px; height: 1px; background: rgba(255,255,255,0.1); z-index: 1;
        }

        /* Fake Cursor */
        .cta-fake-cursor {
            position: absolute;
            width: 32px; height: 32px;
            background: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22white%22%20stroke%3D%22black%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m3%203%207.07%2016.97%202.51-7.39%207.39-2.51L3%203z%22/%3E%3C/svg%3E') no-repeat center center;
            background-size: contain;
            z-index: 999;
            pointer-events: none;
            opacity: 0;
            top: 60%; left: 90%; /* Initial position */
            transform: translate(0, 0);
            transition: opacity 0.5s ease;
        }

        /* Classes for animation */
        /* 1. Cursor moves in */
        .cta-demo.anim-step-1 .cta-fake-cursor {
            opacity: 1;
            /* Move directly to the first active nav item or one of cards */
            animation: moveCursor 1.2s cubic-bezier(0.25, 1, 0.5, 1) forwards;
        }
        @keyframes moveCursor {
            0% { top: 60%; left: 90%; }
            100% { top: 40%; left: 60%; } /* Approximate position over the dashboard mockup cards */
        }
        
        /* 2. Cursor clicks (shrink) */
        .cta-demo.anim-step-2 .cta-fake-cursor {
            top: 40%; left: 60%;
            transform: scale(0.85);
            transition: transform 0.1s;
        }
        
        /* 3. Button ripple effect on click (fake on the card) */
        .cta-flow__card.blue { position: relative; overflow: hidden; }
        .cta-flow__card.blue::after {
            content:''; position: absolute; top:50%; left:50%; width:0; height:0; 
            background: rgba(255,255,255,0.2); border-radius: 50%; 
            transform: translate(-50%, -50%); opacity: 0;
        }
        .cta-demo.anim-step-2 .cta-flow__card.blue::after {
            animation: btnRipple 0.6s ease-out forwards;
        }
        @keyframes btnRipple {
            0% { width:0; height:0; opacity: 1; }
            100% { width:300px; height:300px; opacity: 0; }
        }

        /* 4. Numbers count up via JS, Bars grow */
        .cta-demo.anim-step-3 .cta-flow__bar-group:nth-child(1) .sales .cta-flow__bar-fill { height: 40%; transition-delay: 0.1s; }
        .cta-demo.anim-step-3 .cta-flow__bar-group:nth-child(1) .costs .cta-flow__bar-fill { height: 15%; transition-delay: 0.15s; }
        .cta-demo.anim-step-3 .cta-flow__bar-group:nth-child(2) .sales .cta-flow__bar-fill { height: 55%; transition-delay: 0.2s; }
        .cta-demo.anim-step-3 .cta-flow__bar-group:nth-child(2) .costs .cta-flow__bar-fill { height: 20%; transition-delay: 0.25s; }
        .cta-demo.anim-step-3 .cta-flow__bar-group:nth-child(3) .sales .cta-flow__bar-fill { height: 45%; transition-delay: 0.3s; }
        .cta-demo.anim-step-3 .cta-flow__bar-group:nth-child(3) .costs .cta-flow__bar-fill { height: 12%; transition-delay: 0.35s; }
        .cta-demo.anim-step-3 .cta-flow__bar-group:nth-child(4) .sales .cta-flow__bar-fill { height: 70%; transition-delay: 0.4s; }
        .cta-demo.anim-step-3 .cta-flow__bar-group:nth-child(4) .costs .cta-flow__bar-fill { height: 25%; transition-delay: 0.45s; }
        .cta-demo.anim-step-3 .cta-flow__bar-group:nth-child(5) .sales .cta-flow__bar-fill { height: 85%; transition-delay: 0.5s; }
        .cta-demo.anim-step-3 .cta-flow__bar-group:nth-child(5) .costs .cta-flow__bar-fill { height: 22%; transition-delay: 0.55s; }
        .cta-demo.anim-step-3 .cta-flow__bar-group:nth-child(6) .sales .cta-flow__bar-fill { height: 100%; transition-delay: 0.6s; }
        .cta-demo.anim-step-3 .cta-flow__bar-group:nth-child(6) .costs .cta-flow__bar-fill { height: 26%; transition-delay: 0.65s; }
        
        .cta-demo.anim-step-3 .cta-fake-cursor {
            opacity: 0; /* Fade out cursor after click */
        }
        @media (max-width:900px) {
            .cta-demo__in { grid-template-columns:1fr; gap:3rem; }
            .cta-demo__content { align-items:center; text-align:center; }
            .cta-demo__h2, .cta-demo__sub { text-align:center; }
            .cta-demo__flow { transform:none; }
            .cta-fake-cursor { display:none; }
        }

    
        /* ═══════════════════════════════════════════════════════
           SECTION 2 — TESTIMONIALS (Bento)
           ═══════════════════════════════════════════════════════ */
        .testi {
            padding: 8rem 1.25rem;
            background: #fff;
            position: relative;
        }
        .testi__in {
            max-width: 1200px; margin: 0 auto;
        }
        
        .testi__hd { margin-bottom: 4rem; text-align: center; }
        .testi__pill {
            display:inline-flex; align-items:center; gap:6px;
            font-size:.6875rem; font-weight:600; text-transform:uppercase; letter-spacing:.08em;
            color:#2563eb; background:#eff6ff; padding:6px 14px; border-radius:100px;
            border:1px solid #dbeafe; margin-bottom:1.5rem;
            justify-content: center;
        }
        .testi__pill svg { width:14px; height:14px; stroke-width:2.5; }
        .testi__h2 {
            font-size:clamp(2rem,4vw,3.5rem); font-weight:800; letter-spacing:-0.03em; color:#111; line-height: 1.1;
        }
        .testi__h2 em { font-style:normal; color:#2563eb; }
        
        /* Grid system - Bento Box */
        .testi__grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 1.5rem;
            margin-bottom: 1.5rem;
        }
        
        /* Main Testimonial (Spans 2 cols, 2 rows) */
        .testi__main {
            grid-column: span 2;
            grid-row: span 2;
            background: linear-gradient(145deg, #ffffff, #f8fafc);
            color: #111;
            padding: 4rem;
            border-radius: 24px;
            display: flex; flex-direction: column; justify-content: space-between;
            position: relative;
            box-shadow: 0 20px 40px -10px rgba(0,0,0,0.06), 0 0 0 1px rgba(0,0,0,0.04);
        }
        .testi__main::before {
            content:'"'; position:absolute; top:20px; left:40px;
            font-size: 10rem; font-weight:900; color:rgba(37,99,235,0.05); font-family:serif; line-height:1; pointer-events:none;
        }
        .testi__stars { display:flex; gap:4px; margin-bottom:2rem; color:#f59e0b; }
        .testi__stars svg { width:20px; height:20px; fill:currentColor; }
        .testi__quote {
            font-size: 1.75rem; line-height: 1.5; font-weight: 500; letter-spacing: -0.01em;
            margin-bottom: 3rem; color: #374151;
        }
        .testi__quote strong { color: #fff; background: rgba(37,99,235,1); padding: 2px 4px; border-radius: 4px; }
        .testi__author { display:flex; align-items:center; gap:16px; margin-top: auto; }
        .testi__avatar { width:64px; height:64px; border-radius:50%; overflow:hidden; border:2px solid #eff6ff; flex-shrink:0;}
        .testi__name { font-weight:700; font-size:1.125rem; color: #111; }
        .testi__role { font-size:.875rem; color:#6b7280; margin-top:2px; font-weight: 500;}
        
        /* Metric Cards (1 col, 1 row each - stack vertically on right) */
        .testi__metric {
            background: #fff;
            border-radius: 24px;
            padding: 2.5rem 2rem;
            border: 1px solid rgba(0,0,0,0.06);
            display: flex; flex-direction: column; justify-content: center;
            text-align: center;
            box-shadow: 0 10px 30px -10px rgba(0,0,0,0.03);
            transition: transform 0.3s, box-shadow 0.3s;
        }
        .testi__metric:hover { transform: translateY(-4px); box-shadow: 0 15px 35px -10px rgba(0,0,0,0.08); }
        .testi__metric-val {
            font-size: 4rem; font-weight: 900; letter-spacing: -0.05em; margin-bottom: 8px; line-height: 1;
        }
        .testi__metric-label {
            font-size: .9375rem; color: #4b5563; font-weight: 500; line-height: 1.5; margin-bottom: 1.5rem; flex-grow:1;
        }
        .testi__metric-source {
            font-size: .75rem; color: #9ca3af; display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: auto; font-weight: 500;
        }
        .testi__metric-source svg { width: 14px; height: 14px; stroke-width: 2.5; }
        
        /* Small cards (bottom row) */
        .testi__row {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 1.5rem;
        }
        .testi__small {
            background: #fff;
            border-radius: 24px;
            padding: 2.5rem;
            border: 1px solid rgba(0,0,0,0.06);
            box-shadow: 0 10px 30px -10px rgba(0,0,0,0.03);
            display: flex; flex-direction: column;
            transition: transform 0.3s, box-shadow 0.3s;
        }
        .testi__small:hover { transform: translateY(-4px); box-shadow: 0 15px 35px -10px rgba(0,0,0,0.08); }
        .testi__small-quote {
            font-size: 1.0625rem; color: #374151; line-height: 1.6; font-weight: 500;
            margin-bottom: 2rem; flex-grow: 1;
        }
        .testi__small-author { display:flex; align-items:center; gap:16px; }
        .testi__small-avatar { width:48px; height:48px; border-radius:50%; overflow:hidden; flex-shrink:0; }
        .testi__small-name { font-weight:700; font-size:1rem; color:#111; margin-bottom:2px; }
        .testi__small-role { font-size:.8125rem; color:#6b7280; font-weight:500; }
        
        @media (max-width: 1024px) {
            .testi__grid { grid-template-columns: 1fr; }
            .testi__main { grid-column: 1 / -1; grid-row: auto; padding: 2.5rem; }
            .testi__main::before { display: none; }
            .testi__quote { font-size: 1.25rem; max-width: 100%; }
            .testi__metric { flex-direction:row; align-items:center; justify-content:space-between; text-align:left; padding:2rem;}
            .testi__metric-val { font-size: 2.5rem; margin-bottom:0; }
            .testi__metric-label { margin-bottom:0; max-width: 50%; }
            .testi__row { grid-template-columns: 1fr; }
        }

        @media (max-width: 640px) {
            .testi { padding: 4rem 1.25rem; }
            .testi__main { padding: 1.5rem; }
            .testi__quote { font-size: 1.125rem; }
            
            .testi__metric { flex-direction: column; align-items: flex-start; gap: 1rem; }
            .testi__metric-label { max-width: 100%; }
            
            /* Horizontal scrolling carousel for small cards */
            .testi__row {
                display: flex;
                flex-wrap: nowrap;
                overflow-x: auto;
                scroll-snap-type: x mandatory;
                padding-bottom: 1rem; 
                margin-left: -1.25rem;
                margin-right: -1.25rem;
                padding-left: 1.25rem;
                padding-right: 1.25rem;
                gap: 1rem;
                /* Hide scrollbar for cleaner look */
                -ms-overflow-style: none;  
                scrollbar-width: none;  
            }
            .testi__row::-webkit-scrollbar { display: none; }
            
            .testi__small {
                flex: 0 0 calc(90vw - 2.5rem);
                scroll-snap-align: center;
                padding: 1.75rem 1.5rem;
            }
        }

        /* ═══════════════════════════════════════════════════════
           SECTION 3 — FREE MIGRATION / RISK REVERSAL
           ═══════════════════════════════════════════════════════ */
        .migrate {
            padding: 8rem 1.25rem;
            background: #f8fafc;
            border-top: 1px solid rgba(0,0,0,0.04);
            position: relative; overflow: hidden;
        }
        /* Soft blue gradient background */
        .migrate::before {
            content:''; position:absolute; top:-30%; right:-10%; width:60%; height:80%;
            background: radial-gradient(ellipse at 50% 50%, rgba(37,99,235,0.06) 0%, rgba(124,58,237,0.04) 40%, transparent 70%);
            filter: blur(60px); pointer-events:none;
        }
        .migrate__in { max-width:1200px; margin:0 auto; position:relative; z-index:1; display:grid; grid-template-columns: 0.95fr 1.05fr; gap: 6rem; align-items: center; }
        
        /* Left: Image side */
        .migrate__visual { position:relative; padding-right: 2rem; }
        .migrate__visual-inner { border-radius:32px; overflow:hidden; aspect-ratio:4/5; box-shadow:0 30px 60px -12px rgba(0,0,0,0.15); border: 1px solid rgba(0,0,0,0.04); }
        .migrate__visual-inner img { width:100%; height:100%; object-fit:cover; }
        
        .migrate__card-float {
            position:absolute; bottom:3rem; right:-1rem;
            background:rgba(255,255,255,0.95); border-radius:24px; padding:1.5rem 2rem;
            display:flex; align-items:center; gap:16px;
            box-shadow: 0 20px 40px -10px rgba(0,0,0,0.1), 0 0 0 1px rgba(0,0,0,0.02);
            animation: float 6s ease-in-out infinite;
            backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
        }
        .migrate__cf-ic {
            width:56px; height:56px; border-radius:50%; background:#eff6ff;
            color:#2563eb; display:flex; align-items:center; justify-content:center;
            flex-shrink:0; border:1px solid #dbeafe;
        }
        .migrate__cf-ic svg { width:28px; height:28px; stroke-width:2; }
        .migrate__cf-t { font-weight:700; font-size:1.0625rem; color:#111; margin-bottom:2px; }
        .migrate__cf-d { font-size:.875rem; color:#4b5563; font-weight:500; }
        
        /* Right: Content side */
        .migrate__content { display:flex; flex-direction:column; }
        .migrate__pill {
            display:inline-flex; align-items:center; gap:6px; align-self:flex-start;
            font-size:.6875rem; font-weight:600; text-transform:uppercase; letter-spacing:.08em;
            color:#2563eb; background:#eff6ff; padding:6px 14px; border-radius:100px;
            border:1px solid #dbeafe; margin-bottom:1.5rem;
        }
        .migrate__pill svg { width:12px; height:12px; stroke-width:2.5; }
        .migrate__h2 {
            font-size:clamp(2.5rem,4.5vw,3.5rem); font-weight:800; line-height:1.1;
            letter-spacing:-0.03em; color:#111; margin-bottom:1.25rem;
        }
        .migrate__h2 em {
            font-style:normal;
            background:linear-gradient(135deg,#2563eb,#7c3aed);
            -webkit-background-clip:text; background-clip:text;
            -webkit-text-fill-color:transparent;
        }
        .migrate__sub {
            font-size:1.125rem; color:#4b5563; line-height:1.6;
            margin-bottom:3rem; max-width:480px; font-weight: 500;
        }
        
        /* Stepper */
        .migrate__steps { display:flex; flex-direction:column; gap:2.5rem; margin-bottom:3.5rem; position:relative; }
        
        .migrate__step { display:flex; gap:1.75rem; position:relative; z-index:2; }
        .migrate__step-icon {
            width:50px; height:50px; border-radius:50%; background:#fff; border:2px solid #e5e7eb;
            display:flex; align-items:center; justify-content:center; color:#9ca3af;
            flex-shrink:0; transition: border-color .3s, color .3s, box-shadow .3s, background .3s;
        }
        .migrate__step:hover .migrate__step-icon { 
            border-color:#2563eb; color:#2563eb; 
            background: #eff6ff;
            box-shadow: 0 0 0 4px #eff6ff; 
        }
        .migrate__step-icon svg { width:22px; height:22px; stroke-width:2; }
        
        .migrate__step-text { padding-top: 2px; }
        .migrate__step-t { font-weight:700; color:#111; margin-bottom:8px; font-size:1.125rem; letter-spacing: -0.01em; }
        .migrate__step-d { font-size:.9375rem; color:#4b5563; line-height:1.6; font-weight: 500; }
        
        .migrate__btn {
            display:inline-flex; align-items:center; justify-content: center; gap:12px; align-self:flex-start;
            padding:18px 40px; border-radius:14px;
            background:linear-gradient(135deg,#2563eb,#7c3aed);
            color:#fff; font-size:1rem; font-weight:700;
            text-decoration:none; letter-spacing:-0.01em;
            transition: transform .25s, box-shadow .25s;
            box-shadow: 0 8px 30px rgba(37,99,235,0.25);
        }
        .migrate__btn svg { width:24px; height:24px; flex-shrink: 0; }
        .migrate__btn:hover {
            transform:translateY(-2px);
            box-shadow: 0 12px 40px rgba(37,99,235,0.4);
        }
        
        @media (max-width:900px) {
            .migrate__in { grid-template-columns:1fr; gap:4rem; }
            .migrate__visual { order:2; padding-right:0; padding-bottom: 2rem;}
            .migrate__content { order:1; }
            .migrate__card-float { right: 1rem; bottom: -1rem; padding: 1.25rem; }
        }
        
        @media (max-width: 900px) {
            .cta-demo { padding: 3rem 1.5rem; border-radius: 24px; }
            .cta-demo__in { grid-template-columns: 1fr; gap: 3rem; }
        }

        /* ── Mobile-specific refinements (phones) ─── */
        @media (max-width: 640px) {
            /* CTA Demo: tighter padding, smaller type */
            .cta-demo { 
                padding: 2rem 1rem; 
                border-radius: 20px; 
                margin: 2rem auto; 
                width: calc(100% - 1.5rem); 
            }
            .cta-demo__in { gap: 2rem; }
            .cta-demo__h2 { font-size: 1.75rem; }
            .cta-demo__sub { font-size: 1rem; margin-bottom: 1.5rem; }
            .cta-demo__btn { 
                width: 100%; 
                justify-content: center; 
                padding: 14px 24px; 
            }
            .cta-demo__trust { 
                flex-wrap: wrap; 
                font-size: .875rem; 
                gap: 12px; 
            }
            .cta-demo__trust img { width: 40px; height: 40px; }
            
            /* CTA Flow mockup: shorter on phones, no sidebar */
            .cta-demo__flow { 
                height: auto; 
                min-height: 260px;
                transform: none; 
                border-radius: 16px; 
            }
            .cta-demo__flow:hover { transform: none; }
            .cta-flow__sidebar { display: none; }
            .cta-flow__body { padding: 16px; gap: 12px; flex-direction: column; }
            .cta-flow__row { flex-direction: column; gap: 10px; }
            .cta-flow__val { font-size: 1.25rem; }
            .cta-flow__card { padding: 14px; border-radius: 12px; }
            .cta-flow__header { height: 40px; padding: 0 14px; }
            .cta-flow__dot { width: 8px; height: 8px; }
            
            /* Migrate: tighter spacing */
            .migrate { padding: 4rem 1rem; }
            .migrate__in { gap: 2.5rem; }
            .migrate__h2 { font-size: 1.75rem; }
            .migrate__sub { font-size: 1rem; margin-bottom: 2rem; }
            .migrate__steps { gap: 1.75rem; margin-bottom: 2.5rem; }
            .migrate__step { gap: 1rem; }
            .migrate__step-icon { width: 40px; height: 40px; }
            .migrate__step-icon svg { width: 18px; height: 18px; }
            .migrate__step-t { font-size: 1rem; }
            .migrate__step-d { font-size: .875rem; }
            .migrate__btn { 
                width: 100%; 
                justify-content: center; 
                padding: 16px 24px; 
            }
            .migrate__visual-inner { 
                aspect-ratio: 3/4; 
                border-radius: 20px; 
            }
            .migrate__card-float { 
                padding: 1rem; 
                gap: 10px; 
                border-radius: 16px; 
            }
            .migrate__cf-ic { width: 40px; height: 40px; }
            .migrate__cf-ic svg { width: 20px; height: 20px; }
            .migrate__cf-t { font-size: .9375rem; }
            .migrate__cf-d { font-size: .8125rem; }
        }

        /* 5. Chart Animation */
        .cta-demo.anim-step-3 .chart-costs-group,
        .cta-demo.anim-step-3 .chart-sales-group {
            opacity: 1 !important;
            clip-path: inset(0 0 0 0) !important;
        }