{"id":29444,"date":"2026-07-23T14:10:14","date_gmt":"2026-07-23T06:10:14","guid":{"rendered":"https:\/\/www.lucas-admedia.com\/?page_id=29444"},"modified":"2026-07-30T16:10:48","modified_gmt":"2026-07-30T08:10:48","slug":"social-media-example","status":"publish","type":"page","link":"https:\/\/www.lucas-admedia.com\/index.php\/social-media-example\/","title":{"rendered":"Social Media Example"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"29444\" class=\"elementor elementor-29444\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-57d81235 e-flex e-con-boxed e-con e-parent\" data-id=\"57d81235\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5ffef5a6 elementor-widget elementor-widget-heading\" data-id=\"5ffef5a6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">SOCIAL PROOF<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-22ab2a27 elementor-widget elementor-widget-text-editor\" data-id=\"22ab2a27\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>\u201cThey didn\u2019t just improve performance \u2014 they rebuilt how our business grows.\u201d<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5659928d elementor-align-center elementor-widget elementor-widget-button\" data-id=\"5659928d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"#\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Find your growth path \u2014 and let\u2019s build your system<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-798648f7 e-flex e-con-boxed e-con e-parent\" data-id=\"798648f7\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5fd22851 elementor-widget elementor-widget-heading\" data-id=\"5fd22851\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">SERVICE-BASED GROUPING<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2627fb5a elementor-widget elementor-widget-heading\" data-id=\"2627fb5a\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"full\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">The Revenue Engine\n<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-45e5d825 elementor-widget elementor-widget-html\" data-id=\"45e5d825\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ==================== Case 1: @Sumi Lash ==================== -->\r\n<style>\r\n.UNIQUE-notch {\r\n        position: absolute;\r\n        top: 12px;\r\n        left: 50%;\r\n        transform: translateX(-50%);\r\n        width: 120px;\r\n        height: 28px;\r\n        background-color: #000;\r\n        border-radius: 20px;\r\n        z-index: 20;\r\n    }\r\n    .UNIQUE-scrolly-container-1 { display: flex; position: relative; max-width: 1200px; margin: 0 auto; }\r\n\r\n    .UNIQUE-left-sticky-1 {\r\n        width: 50%; height: 100vh; position: sticky; top: 0;\r\n        display: flex; align-items: center; justify-content: center;\r\n    }\r\n\r\n    .UNIQUE-phone-frame-1 {\r\n        width: 320px; height: 650px; background-color: #111; border-radius: 45px;\r\n        box-shadow: 0 0 0 10px #27272A; overflow: hidden; position: relative;\r\n    }\r\n\r\n    .UNIQUE-phone-screen-1 { width: 100%; height: 100%; overflow: hidden; background: #fff; }\r\n\r\n    .UNIQUE-phone-inner-content-1 {\r\n        width: 100%;\r\n        height: 300%;\r\n        transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);\r\n        display: flex;\r\n        flex-direction: column;\r\n    }\r\n\r\n    .UNIQUE-mockup-ui-1 {\r\n        width: 100%;\r\n        height: calc(100% \/ 3);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        padding: 0;\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    .ui-1-bg { background: linear-gradient(135deg, #F8FAFC, #E2E8F0); }\r\n\r\n    .UNIQUE-ui-box-1 { width: 100%; text-align: center; padding-top: 60px; }\r\n    .UNIQUE-ui-box-1 img {\r\n        width: 100%;\r\n        height: auto;\r\n        max-height: 577px;\r\n        object-fit: cover;\r\n        border-radius: 12px;\r\n        box-shadow: 0 10px 30px rgba(0,0,0,0.2);\r\n    }\r\n\r\n    .UNIQUE-step-num-1 {\r\n        font-size: 1.1rem;\r\n        color: #3B82F6;\r\n        font-weight: 700;\r\n        margin-bottom: 8px;\r\n        letter-spacing: 2px;\r\n        text-transform: uppercase;\r\n    }\r\n\r\n    .UNIQUE-right-scroll-1 { width: 50%; }\r\n    .UNIQUE-text-step-1 {\r\n        height: 100vh;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        opacity: 0.1;\r\n        transition: all 0.5s;\r\n        padding-left: 50px;\r\n    }\r\n    .UNIQUE-text-step-1.active { opacity: 1; transform: scale(1.05); }\r\n    .UNIQUE-text-step-1 p { font-weight: 300; }\r\n    .UNIQUE-text-step-1 p b { font-weight: 600; }\r\n\r\n    .yyfw-1 {\r\n        background-color: #8C7DFF;\r\n        width: 140px;\r\n        text-align: center;\r\n        color: white;\r\n        border-radius: 360px;\r\n        line-height: 40px;\r\n        margin-top: 25px;\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .UNIQUE-scrolly-container-1 { flex-direction: column; }\r\n        .UNIQUE-left-sticky-1 { width: 100%; height: 45vh; top: 10vh; z-index: 100; background: #fff; }\r\n        .UNIQUE-phone-frame-1 { transform: scale(0.5); transform-origin: center; }\r\n        .UNIQUE-right-scroll-1 { width: 100%; padding: 0 20px; }\r\n        .UNIQUE-text-step-1 { height: 80vh; text-align: center; padding-left: 0; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"UNIQUE-scrolly-container-1\">\r\n    <div class=\"UNIQUE-left-sticky-1\">\r\n        <div class=\"UNIQUE-phone-frame-1\">\r\n            <div class=\"UNIQUE-notch\"><\/div>\r\n            <div class=\"UNIQUE-phone-screen-1\">\r\n                <div class=\"UNIQUE-phone-inner-content-1\" id=\"js-scroll-engine-track-1\">\r\n                    <div class=\"UNIQUE-mockup-ui-1 ui-1-bg\"><div class=\"UNIQUE-ui-box-1\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/03\/\u56fe\u72471-1.png\"><\/div><\/div>\r\n                    <div class=\"UNIQUE-mockup-ui-1 ui-1-bg\"><div class=\"UNIQUE-ui-box-1\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/03\/\u56fe\u72472-1.png\"><\/div><\/div>\r\n                    <div class=\"UNIQUE-mockup-ui-1 ui-1-bg\"><div class=\"UNIQUE-ui-box-1\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/03\/\u56fe\u72473-1.png\"><\/div><\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"UNIQUE-right-scroll-1\">\r\n        <div class=\"UNIQUE-text-step-1\" data-index=\"0\">\r\n            <div class=\"UNIQUE-step-num-1\">case 1<\/div>\r\n            <p><b>@Sumi Lash<\/b><br> A U.S. lash brand chain with 10+ offline stores and hundreds of trainees through its academy.<br><br>\r\n            We provide comprehensive services that integrate social media and website strategies, designed to drive measurable online-to-offline (O2O) conversions and seamlessly connect every campaign to tangible business results.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-1\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"UNIQUE-text-step-1\" data-index=\"1\">\r\n            <p><b>@Sumi Lash<\/b><br> A U.S. lash brand chain with 10+ offline stores and hundreds of trainees through its academy.<br><br>\r\n            We provide comprehensive services that integrate social media and website strategies, designed to drive measurable online-to-offline (O2O) conversions and seamlessly connect every campaign to tangible business results.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-1\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"UNIQUE-text-step-1\" data-index=\"2\">\r\n            <p><b>@Sumi Lash<\/b><br> A U.S. lash brand chain with 10+ offline stores and hundreds of trainees through its academy.<br><br>\r\n            We provide comprehensive services that integrate social media and website strategies, designed to drive measurable online-to-offline (O2O) conversions and seamlessly connect every campaign to tangible business results.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-1\">Contact Us<\/a>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    (function() {\r\n        const textNodes = document.querySelectorAll('.UNIQUE-text-step-1');\r\n        const slideTrack = document.getElementById('js-scroll-engine-track-1');\r\n\r\n        if (!textNodes.length || !slideTrack) return;\r\n\r\n        const observerConfig = {\r\n            rootMargin: \"-45% 0px -45% 0px\",\r\n            threshold: 0\r\n        };\r\n\r\n        const intersectionCallback = (entries) => {\r\n            entries.forEach(entry => {\r\n                if (entry.isIntersecting) {\r\n                    textNodes.forEach(node => node.classList.remove('active'));\r\n                    entry.target.classList.add('active');\r\n\r\n                    let targetIndex = parseInt(entry.target.getAttribute('data-index') || \"0\", 10);\r\n                    let scrollPercentage = targetIndex * -(100 \/ 3);\r\n\r\n                    slideTrack.style.transform = `translateY(${scrollPercentage}%)`;\r\n                }\r\n            });\r\n        };\r\n\r\n        const scrollRadar = new IntersectionObserver(intersectionCallback, observerConfig);\r\n        textNodes.forEach(node => { scrollRadar.observe(node); });\r\n    })();\r\n});\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3311cd7 elementor-widget elementor-widget-html\" data-id=\"3311cd7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ==================== Case 2: @parrot.UNCLE ==================== -->\n<style>\n    .UNIQUE-scrolly-container-2 { display: flex; position: relative; max-width: 1200px; margin: 0 auto; }\n\n    .UNIQUE-left-sticky-2 {\n        width: 50%; height: 100vh; position: sticky; top: 0;\n        display: flex; align-items: center; justify-content: center;\n    }\n\n    .UNIQUE-phone-frame-2 {\n        width: 320px; height: 650px; background-color: #111; border-radius: 45px;\n        box-shadow: 0 0 0 10px #27272A; overflow: hidden; position: relative;\n    }\n\n    .UNIQUE-phone-screen-2 { width: 100%; height: 100%; overflow: hidden; background: #fff; }\n\n    .UNIQUE-phone-inner-content-2 {\n        width: 100%;\n        height: 400%;\n        transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);\n        display: flex;\n        flex-direction: column;\n    }\n\n    .UNIQUE-mockup-ui-2 {\n        width: 100%;\n        height: calc(100% \/ 4);\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        padding: 0;\n        box-sizing: border-box;\n    }\n\n    .ui-2-bg { background: linear-gradient(135deg, #1E293B, #0F172A); }\n\n    .UNIQUE-ui-box-2 { width: 100%; text-align: center; padding-top: 60px; }\n    .UNIQUE-ui-box-2 img {\n        width: 100%;\n        height: auto;\n        max-height: 577px;\n        object-fit: cover;\n        border-radius: 12px;\n        box-shadow: 0 10px 30px rgba(0,0,0,0.2);\n    }\n\n    .UNIQUE-step-num-2 {\n        font-size: 1.1rem;\n        color: #3B82F6;\n        font-weight: 700;\n        margin-bottom: 8px;\n        letter-spacing: 2px;\n        text-transform: uppercase;\n    }\n\n    .UNIQUE-right-scroll-2 { width: 50%; }\n    .UNIQUE-text-step-2 {\n        height: 100vh;\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        opacity: 0.1;\n        transition: all 0.5s;\n        padding-left: 50px;\n    }\n    .UNIQUE-text-step-2.active { opacity: 1; transform: scale(1.05); }\n    .UNIQUE-text-step-2 p { font-weight: 300; }\n    .UNIQUE-text-step-2 p b { font-weight: 600; }\n\n    .yyfw-2 {\n        background-color: #8C7DFF;\n        width: 140px;\n        text-align: center;\n        color: white;\n        border-radius: 360px;\n        line-height: 40px;\n        margin-top: 25px;\n    }\n\n    @media (max-width: 768px) {\n        .UNIQUE-scrolly-container-2 { flex-direction: column; }\n        .UNIQUE-left-sticky-2 { width: 100%; height: 45vh; top: 10vh; z-index: 100; background: #fff; }\n        .UNIQUE-phone-frame-2 { transform: scale(0.5); transform-origin: center; }\n        .UNIQUE-right-scroll-2 { width: 100%; padding: 0 20px; }\n        .UNIQUE-text-step-2 { height: 80vh; text-align: center; padding-left: 0; }\n    }\n<\/style>\n\n<div class=\"UNIQUE-scrolly-container-2\">\n    <div class=\"UNIQUE-left-sticky-2\">\n        <div class=\"UNIQUE-phone-frame-2\">\n            <div class=\"UNIQUE-notch\"><\/div>\n            <div class=\"UNIQUE-phone-screen-2\">\n                <div class=\"UNIQUE-phone-inner-content-2\" id=\"js-scroll-engine-track-2\">\n                    <div class=\"UNIQUE-mockup-ui-2 ui-2-bg\"><div class=\"UNIQUE-ui-box-2\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u72473.png\"><\/div><\/div>\n                    <div class=\"UNIQUE-mockup-ui-2 ui-2-bg\"><div class=\"UNIQUE-ui-box-2\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u72474.png\"><\/div><\/div>\n                    <div class=\"UNIQUE-mockup-ui-2 ui-2-bg\"><div class=\"UNIQUE-ui-box-2\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u72475.png\"><\/div><\/div>\n                    <div class=\"UNIQUE-mockup-ui-2 ui-2-bg\"><div class=\"UNIQUE-ui-box-2\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u72476-1.png\"><\/div><\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n    <div class=\"UNIQUE-right-scroll-2\">\n        <div class=\"UNIQUE-text-step-2\" data-index=\"0\">\n            <p><b>@parrot.UNCLE \u2013<\/b><br>\n            A Los Angeles\u2013based online retailer specializing in lighting and home d\u00e9cor. Since joining TikTok in March 2023, we have supported end-to-end collaboration from content strategy to production, with simultaneous cross-platform promotion on TikTok and Facebook.<\/p>\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-2\">Contact Us<\/a>\n        <\/div>\n        <div class=\"UNIQUE-text-step-2\" data-index=\"1\">\n            <p><b>@parrot.UNCLE \u2013<\/b><br>\n            A Los Angeles\u2013based online retailer specializing in lighting and home d\u00e9cor. Since joining TikTok in March 2023, we have supported end-to-end collaboration from content strategy to production, with simultaneous cross-platform promotion on TikTok and Facebook.<\/p>\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-2\">Contact Us<\/a>\n        <\/div>\n        <div class=\"UNIQUE-text-step-2\" data-index=\"2\">\n            <p><b>@parrot.UNCLE \u2013<\/b><br>\n            A Los Angeles\u2013based online retailer specializing in lighting and home d\u00e9cor. Since joining TikTok in March 2023, we have supported end-to-end collaboration from content strategy to production, with simultaneous cross-platform promotion on TikTok and Facebook.<\/p>\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-2\">Contact Us<\/a>\n        <\/div>\n        <div class=\"UNIQUE-text-step-2\" data-index=\"3\">\n            <p><b>@parrot.UNCLE \u2013<\/b><br>\n            A Los Angeles\u2013based online retailer specializing in lighting and home d\u00e9cor. Since joining TikTok in March 2023, we have supported end-to-end collaboration from content strategy to production, with simultaneous cross-platform promotion on TikTok and Facebook.<\/p>\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-2\">Contact Us<\/a>\n        <\/div>\n    <\/div>\n<\/div>\n\n<script>\ndocument.addEventListener('DOMContentLoaded', function() {\n    (function() {\n        const textNodes = document.querySelectorAll('.UNIQUE-text-step-2');\n        const slideTrack = document.getElementById('js-scroll-engine-track-2');\n\n        if (!textNodes.length || !slideTrack) return;\n\n        const observerConfig = {\n            rootMargin: \"-45% 0px -45% 0px\",\n            threshold: 0\n        };\n\n        const intersectionCallback = (entries) => {\n            entries.forEach(entry => {\n                if (entry.isIntersecting) {\n                    textNodes.forEach(node => node.classList.remove('active'));\n                    entry.target.classList.add('active');\n\n                    let targetIndex = parseInt(entry.target.getAttribute('data-index') || \"0\", 10);\n                    let scrollPercentage = targetIndex * -(100 \/ 4);\n\n                    slideTrack.style.transform = `translateY(${scrollPercentage}%)`;\n                }\n            });\n        };\n\n        const scrollRadar = new IntersectionObserver(intersectionCallback, observerConfig);\n        textNodes.forEach(node => { scrollRadar.observe(node); });\n    })();\n});\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-53ac14a elementor-widget elementor-widget-html\" data-id=\"53ac14a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ==================== Case 3: @vgo_beauty ==================== -->\r\n<style>\r\n    .UNIQUE-scrolly-container-3 { display: flex; position: relative; max-width: 1200px; margin: 0 auto; }\r\n\r\n    .UNIQUE-left-sticky-3 {\r\n        width: 50%; height: 100vh; position: sticky; top: 0;\r\n        display: flex; align-items: center; justify-content: center;\r\n    }\r\n\r\n    .UNIQUE-phone-frame-3 {\r\n        width: 320px; height: 650px; background-color: #111; border-radius: 45px;\r\n        box-shadow: 0 0 0 10px #27272A; overflow: hidden; position: relative;\r\n    }\r\n\r\n    .UNIQUE-phone-screen-3 { width: 100%; height: 100%; overflow: hidden; background: #fff; }\r\n\r\n    .UNIQUE-phone-inner-content-3 {\r\n        width: 100%;\r\n        height: 400%;\r\n        transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);\r\n        display: flex;\r\n        flex-direction: column;\r\n    }\r\n\r\n    .UNIQUE-mockup-ui-3 {\r\n        width: 100%;\r\n        height: calc(100% \/ 4);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        padding: 0;\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    .ui-3-bg { background: linear-gradient(135deg, #3B82F6, #8B5CF6); }\r\n\r\n    .UNIQUE-ui-box-3 { width: 100%; text-align: center; padding-top: 60px; }\r\n    .UNIQUE-ui-box-3 img {\r\n        width: 100%;\r\n        height: auto;\r\n        max-height: 577px;\r\n        object-fit: cover;\r\n        border-radius: 12px;\r\n        box-shadow: 0 10px 30px rgba(0,0,0,0.2);\r\n    }\r\n\r\n    .UNIQUE-step-num-3 {\r\n        font-size: 1.1rem;\r\n        color: #3B82F6;\r\n        font-weight: 700;\r\n        margin-bottom: 8px;\r\n        letter-spacing: 2px;\r\n        text-transform: uppercase;\r\n    }\r\n\r\n    .UNIQUE-right-scroll-3 { width: 50%; }\r\n    .UNIQUE-text-step-3 {\r\n        height: 100vh;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        opacity: 0.1;\r\n        transition: all 0.5s;\r\n        padding-left: 50px;\r\n    }\r\n    .UNIQUE-text-step-3.active { opacity: 1; transform: scale(1.05); }\r\n    .UNIQUE-text-step-3 p { font-weight: 300; }\r\n    .UNIQUE-text-step-3 p b { font-weight: 600; }\r\n\r\n    .yyfw-3 {\r\n        background-color: #8C7DFF;\r\n        width: 140px;\r\n        text-align: center;\r\n        color: white;\r\n        border-radius: 360px;\r\n        line-height: 40px;\r\n        margin-top: 25px;\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .UNIQUE-scrolly-container-3 { flex-direction: column; }\r\n        .UNIQUE-left-sticky-3 { width: 100%; height: 45vh; top: 10vh; z-index: 100; background: #fff; }\r\n        .UNIQUE-phone-frame-3 { transform: scale(0.5); transform-origin: center; }\r\n        .UNIQUE-right-scroll-3 { width: 100%; padding: 0 20px; }\r\n        .UNIQUE-text-step-3 { height: 80vh; text-align: center; padding-left: 0; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"UNIQUE-scrolly-container-3\">\r\n    <div class=\"UNIQUE-left-sticky-3\">\r\n        <div class=\"UNIQUE-phone-frame-3\">\r\n            <div class=\"web-notch-1\"><\/div>\r\n            <div class=\"UNIQUE-phone-screen-3\">\r\n                <div class=\"UNIQUE-phone-inner-content-3\" id=\"js-scroll-engine-track-3\">\r\n                    <div class=\"UNIQUE-mockup-ui-3 ui-3-bg\"><div class=\"UNIQUE-ui-box-3\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u72477-1.png\"><\/div><\/div>\r\n                    <div class=\"UNIQUE-mockup-ui-3 ui-3-bg\"><div class=\"UNIQUE-ui-box-3\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u72478-1.png\"><\/div><\/div>\r\n                    <div class=\"UNIQUE-mockup-ui-3 ui-3-bg\"><div class=\"UNIQUE-ui-box-3\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u72479-1.png\"><\/div><\/div>\r\n                    <div class=\"UNIQUE-mockup-ui-3 ui-3-bg\"><div class=\"UNIQUE-ui-box-3\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724710-1.png\"><\/div><\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"UNIQUE-right-scroll-3\">\r\n        <div class=\"UNIQUE-text-step-3\" data-index=\"0\">\r\n            <p><b>@vgo_beauty \u2013<\/b><br> An emerging skincare brand with multiple categories consistently exceeding $10K in monthly sales, and total TikTok Shop revenue reaching $378.1K+, demonstrating strong growth momentum.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-3\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"UNIQUE-text-step-3\" data-index=\"1\">\r\n            <p><b>@vgo_beauty \u2013<\/b><br> An emerging skincare brand with multiple categories consistently exceeding $10K in monthly sales, and total TikTok Shop revenue reaching $378.1K+, demonstrating strong growth momentum.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-3\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"UNIQUE-text-step-3\" data-index=\"2\">\r\n            <p><b>@vgo_beauty \u2013<\/b><br> An emerging skincare brand with multiple categories consistently exceeding $10K in monthly sales, and total TikTok Shop revenue reaching $378.1K+, demonstrating strong growth momentum.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-3\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"UNIQUE-text-step-3\" data-index=\"3\">\r\n            <p><b>@vgo_beauty \u2013<\/b><br> An emerging skincare brand with multiple categories consistently exceeding $10K in monthly sales, and total TikTok Shop revenue reaching $378.1K+, demonstrating strong growth momentum.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-3\">Contact Us<\/a>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    (function() {\r\n        const textNodes = document.querySelectorAll('.UNIQUE-text-step-3');\r\n        const slideTrack = document.getElementById('js-scroll-engine-track-3');\r\n\r\n        if (!textNodes.length || !slideTrack) return;\r\n\r\n        const observerConfig = {\r\n            rootMargin: \"-45% 0px -45% 0px\",\r\n            threshold: 0\r\n        };\r\n\r\n        const intersectionCallback = (entries) => {\r\n            entries.forEach(entry => {\r\n                if (entry.isIntersecting) {\r\n                    textNodes.forEach(node => node.classList.remove('active'));\r\n                    entry.target.classList.add('active');\r\n\r\n                    let targetIndex = parseInt(entry.target.getAttribute('data-index') || \"0\", 10);\r\n                    let scrollPercentage = targetIndex * -(100 \/ 4);\r\n\r\n                    slideTrack.style.transform = `translateY(${scrollPercentage}%)`;\r\n                }\r\n            });\r\n        };\r\n\r\n        const scrollRadar = new IntersectionObserver(intersectionCallback, observerConfig);\r\n        textNodes.forEach(node => { scrollRadar.observe(node); });\r\n    })();\r\n});\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3055ceda elementor-widget elementor-widget-heading\" data-id=\"3055ceda\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"FirstWeb\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Conversion-First Web<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-740020f9 elementor-widget elementor-widget-html\" data-id=\"740020f9\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"dz\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ==================== Web Case 1: @LanySpace ==================== -->\n<style>\n    .web-scrolly-container-1 {\n        display: flex;\n        position: relative;\n        max-width: 1200px;\n        margin: 0 auto;\n        padding: 0 20px;\n    }\n\n    .web-left-sticky-1 {\n        width: 50%;\n        height: 100vh;\n        position: sticky;\n        top: 0;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        z-index: 10;\n    }\n\n    .web-phone-frame-1 {\n        position: relative;\n        width: 320px;\n        height: 650px;\n        background-color: #111;\n        border-radius: 45px;\n        box-shadow: 0 0 0 10px #27272A, 0 0 0 12px #18181B, 0 30px 60px rgba(0,0,0,0.8);\n        overflow: hidden;\n        transition: transform 0.3s ease;\n    }\n\n    .web-notch-1 {\n        position: absolute;\n        top: 12px;\n        left: 50%;\n        transform: translateX(-50%);\n        width: 120px;\n        height: 28px;\n        background-color: #000;\n        border-radius: 20px;\n        z-index: 20;\n    }\n\n    .web-phone-screen-1 {\n        width: 100%;\n        height: 100%;\n        border-radius: 35px;\n        overflow: hidden;\n        position: relative;\n        background: #fff;\n    }\n\n    \/* 4\u5f20\u56fe\uff0c\u603b\u9ad8\u5ea6 400% *\/\n    .web-phone-inner-content-1 {\n        width: 100%;\n        height: 400%;\n        transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);\n        display: flex;\n        flex-direction: column;\n    }\n\n    .web-mockup-ui-1 {\n        width: 100%;\n        height: calc(100% \/ 4);\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        padding: 0;\n        box-sizing: border-box;\n    }\n\n    .web-ui-1-bg { background: linear-gradient(135deg, #F8FAFC, #E2E8F0); }\n\n    .web-ui-box-1 {\n        width: 100%;\n        height: 100%;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        padding-top: 67px;\n    }\n    .web-ui-box-1 img {\n        width: 100%;\n        height: 583px;\n        max-height: 583px;\n        object-fit: cover;\n        border-radius: 8px;\n        box-shadow: 0 5px 15px rgba(0,0,0,0.1);\n    }\n\n    .web-right-scroll-1 { width: 50%; padding: 0; }\n\n    .web-text-step-1 {\n        height: 100vh;\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        opacity: 0.2;\n        transition: opacity 0.6s ease, transform 0.6s ease;\n        max-width: 400px;\n        padding-left: 50px;\n    }\n    .web-text-step-1.active { opacity: 1; }\n    .web-text-step-1 p { font-size: 1.05rem; color: #555; line-height: 1.6; font-weight: 300; }\n    .web-text-step-1 p b { font-weight: 600; }\n\n    .web-step-num-1 {\n        font-size: 1.1rem;\n        color: #3B82F6;\n        font-weight: 700;\n        margin-bottom: 8px;\n        letter-spacing: 2px;\n        text-transform: uppercase;\n    }\n\n    .yyfw-1 {\n        background-color: #8C7DFF;\n        width: 140px;\n        text-align: center;\n        color: white;\n        border-radius: 360px;\n        line-height: 40px;\n        margin-top: 25px;\n    }\n\n    @media (max-width: 768px) {\n        .web-scrolly-container-1 { flex-direction: column-reverse; padding: 0; }\n        .web-left-sticky-1 { width: 100%; height: 50vh; top: 12vh; background: #fff; z-index: 100; }\n        .web-phone-frame-1 { transform: scale(0.5); transform-origin: center center; margin-top: -60px; }\n        .web-right-scroll-1 { width: 100%; padding: 0 20px; z-index: 20; }\n        .web-text-step-1 { height: 80vh; justify-content: flex-end; padding-bottom: 8vh; align-items: center; text-align: center; max-width: 100%; padding-left: 0; }\n    }\n<\/style>\n\n<div class=\"web-scrolly-container-1\">\n    <div class=\"web-right-scroll-1\">\n        <div class=\"web-text-step-1\" data-index=\"0\">\n            <div class=\"web-step-num-1\">case 2<\/div>\n            <p><b>@LanySpace <\/b><br>California's Original Rug Brand, Featuring Artistic and Machine-Washable Designs.<br><br>\n            Our TikTok content has reached 40K+ views, and Instagram has grown to 24K+ followers. By strategically leveraging multiple accounts across parenting, DIY, and home d\u00e9cor communities, we connected content directly to lead capture and bookings\u2014turning brand awareness into measurable conversions within a closed-loop marketing system.<\/p>\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-1\">Contact Us<\/a>\n        <\/div>\n        <div class=\"web-text-step-1\" data-index=\"1\">\n            <div class=\"web-step-num-1\">case 2<\/div>\n            <p><b>@LanySpace <\/b><br>California's Original Rug Brand, Featuring Artistic and Machine-Washable Designs.<br><br>\n            Our TikTok content has reached 40K+ views, and Instagram has grown to 24K+ followers. By strategically leveraging multiple accounts across parenting, DIY, and home d\u00e9cor communities, we connected content directly to lead capture and bookings\u2014turning brand awareness into measurable conversions within a closed-loop marketing system.<\/p>\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-1\">Contact Us<\/a>\n        <\/div>\n        <div class=\"web-text-step-1\" data-index=\"2\">\n            <div class=\"web-step-num-1\">case 2<\/div>\n            <p><b>@LanySpace <\/b><br>California's Original Rug Brand, Featuring Artistic and Machine-Washable Designs.<br><br>\n            Our TikTok content has reached 40K+ views, and Instagram has grown to 24K+ followers. By strategically leveraging multiple accounts across parenting, DIY, and home d\u00e9cor communities, we connected content directly to lead capture and bookings\u2014turning brand awareness into measurable conversions within a closed-loop marketing system.<\/p>\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-1\">Contact Us<\/a>\n        <\/div>\n        <div class=\"web-text-step-1\" data-index=\"3\">\n            <div class=\"web-step-num-1\">case 2<\/div>\n            <p><b>@LanySpace <\/b><br>California's Original Rug Brand, Featuring Artistic and Machine-Washable Designs.<br><br>\n            Our TikTok content has reached 40K+ views, and Instagram has grown to 24K+ followers. By strategically leveraging multiple accounts across parenting, DIY, and home d\u00e9cor communities, we connected content directly to lead capture and bookings\u2014turning brand awareness into measurable conversions within a closed-loop marketing system.<\/p>\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-1\">Contact Us<\/a>\n        <\/div>\n    <\/div>\n    <div class=\"web-left-sticky-1\">\n        <div class=\"web-phone-frame-1\">\n            <div class=\"web-notch-1\"><\/div>\n            <div class=\"web-phone-screen-1\">\n                <div class=\"web-phone-inner-content-1\" id=\"js-web-phone-scroller-track-1\">\n                    <div class=\"web-mockup-ui-1 web-ui-1-bg\"><div class=\"web-ui-box-1\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724711-1.png\" alt=\"LanySpace Rug 1\"><\/div><\/div>\n                    <div class=\"web-mockup-ui-1 web-ui-1-bg\"><div class=\"web-ui-box-1\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724712-1.png\" alt=\"LanySpace Rug 2\"><\/div><\/div>\n                    <div class=\"web-mockup-ui-1 web-ui-1-bg\"><div class=\"web-ui-box-1\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724713-1.png\" alt=\"LanySpace Rug 3\"><\/div><\/div>\n                    <div class=\"web-mockup-ui-1 web-ui-1-bg\"><div class=\"web-ui-box-1\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724714-1.png\" alt=\"LanySpace Rug 4\"><\/div><\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n\n<script>\ndocument.addEventListener('DOMContentLoaded', function() {\n    (function() {\n        const webTextSteps = document.querySelectorAll('.web-text-step-1');\n        const webPhoneTrack = document.getElementById('js-web-phone-scroller-track-1');\n        if (!webTextSteps.length || !webPhoneTrack) return;\n\n        const webObserverOptions = { rootMargin: \"-45% 0px -45% 0px\", threshold: 0 };\n\n        const webIntersectionHandler = (entries) => {\n            entries.forEach(entry => {\n                if (entry.isIntersecting) {\n                    webTextSteps.forEach(step => step.classList.remove('active'));\n                    entry.target.classList.add('active');\n                    const currentStepIndex = parseInt(entry.target.getAttribute('data-index'), 10);\n                    const totalScreens = 4;\n                    const slidePercentPerScreen = 100 \/ totalScreens;\n                    const scrollOffset = currentStepIndex * -slidePercentPerScreen;\n                    webPhoneTrack.style.transform = `translateY(${scrollOffset}%)`;\n                }\n            });\n        };\n\n        const webVisualObserver = new IntersectionObserver(webIntersectionHandler, webObserverOptions);\n        webTextSteps.forEach(stepItem => { webVisualObserver.observe(stepItem); });\n    })();\n});\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-cfc62a4 elementor-widget elementor-widget-html\" data-id=\"cfc62a4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ==================== Web Case 2: @Lany Space TARGET ==================== -->\r\n<style>\r\n    .web-scrolly-container-2 {\r\n        display: flex;\r\n        position: relative;\r\n        max-width: 1200px;\r\n        margin: 0 auto;\r\n        padding: 0 20px;\r\n    }\r\n\r\n    .web-left-sticky-2 {\r\n        width: 50%;\r\n        height: 100vh;\r\n        position: sticky;\r\n        top: 0;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        z-index: 10;\r\n    }\r\n\r\n    .web-phone-frame-2 {\r\n        position: relative;\r\n        width: 320px;\r\n        height: 650px;\r\n        background-color: #111;\r\n        border-radius: 45px;\r\n        box-shadow: 0 0 0 10px #27272A, 0 0 0 12px #18181B, 0 30px 60px rgba(0,0,0,0.8);\r\n        overflow: hidden;\r\n        transition: transform 0.3s ease;\r\n    }\r\n\r\n    .web-notch-2 {\r\n        position: absolute;\r\n        top: 12px;\r\n        left: 50%;\r\n        transform: translateX(-50%);\r\n        width: 120px;\r\n        height: 28px;\r\n        background-color: #000;\r\n        border-radius: 20px;\r\n        z-index: 20;\r\n    }\r\n\r\n    .web-phone-screen-2 {\r\n        width: 100%;\r\n        height: 100%;\r\n        border-radius: 35px;\r\n        overflow: hidden;\r\n        position: relative;\r\n        background: #fff;\r\n    }\r\n\r\n    \/* 2\u5f20\u56fe\uff0c\u603b\u9ad8\u5ea6 200% *\/\r\n    .web-phone-inner-content-2 {\r\n        width: 100%;\r\n        height: 200%;\r\n        transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);\r\n        display: flex;\r\n        flex-direction: column;\r\n    }\r\n\r\n    .web-mockup-ui-2 {\r\n        width: 100%;\r\n        height: calc(100% \/ 2);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        padding: 0;\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    .web-ui-2-bg { background: linear-gradient(135deg, #1E293B, #0F172A); }\r\n\r\n    .web-ui-box-2 {\r\n        width: 100%;\r\n        height: 100%;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        padding-top: 67px;\r\n    }\r\n    .web-ui-box-2 img {\r\n        width: 100%;\r\n        height: 583px;\r\n        max-height: 583px;\r\n        object-fit: cover;\r\n        border-radius: 8px;\r\n        box-shadow: 0 5px 15px rgba(0,0,0,0.1);\r\n    }\r\n\r\n    .web-right-scroll-2 { width: 50%; padding: 0; }\r\n\r\n    .web-text-step-2 {\r\n        height: 100vh;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        opacity: 0.2;\r\n        transition: opacity 0.6s ease, transform 0.6s ease;\r\n        max-width: 400px;\r\n        padding-left: 50px;\r\n    }\r\n    .web-text-step-2.active { opacity: 1; }\r\n    .web-text-step-2 p { font-size: 1.05rem; color: #555; line-height: 1.6; font-weight: 300; }\r\n    .web-text-step-2 p b { font-weight: 600; }\r\n\r\n    .yyfw-2 {\r\n        background-color: #8C7DFF;\r\n        width: 140px;\r\n        text-align: center;\r\n        color: white;\r\n        border-radius: 360px;\r\n        line-height: 40px;\r\n        margin-top: 25px;\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .web-scrolly-container-2 { flex-direction: column-reverse; padding: 0; }\r\n        .web-left-sticky-2 { width: 100%; height: 50vh; top: 12vh; background: #fff; z-index: 100; }\r\n        .web-phone-frame-2 { transform: scale(0.5); transform-origin: center center; margin-top: -60px; }\r\n        .web-right-scroll-2 { width: 100%; padding: 0 20px; z-index: 20; }\r\n        .web-text-step-2 { height: 80vh; justify-content: flex-end; padding-bottom: 8vh; align-items: center; text-align: center; max-width: 100%; padding-left: 0; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"web-scrolly-container-2\">\r\n    <div class=\"web-right-scroll-2\">\r\n        <div class=\"web-text-step-2\" data-index=\"0\">\r\n            <p><b>@Lany Space TARGET<\/b><br>\r\n            Beyond social media, we support brands in managing online stores for offline retail chains.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-2\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"web-text-step-2\" data-index=\"1\">\r\n            <p><b>@Lany Space TARGET<\/b><br>\r\n            Beyond social media, we support brands in managing online stores for offline retail chains.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-2\">Contact Us<\/a>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"web-left-sticky-2\">\r\n        <div class=\"web-phone-frame-2\">\r\n            <div class=\"web-notch-2\"><\/div>\r\n            <div class=\"web-phone-screen-2\">\r\n                <div class=\"web-phone-inner-content-2\" id=\"js-web-phone-scroller-track-2\">\r\n                    <div class=\"web-mockup-ui-2 web-ui-2-bg\"><div class=\"web-ui-box-2\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724715-1.png\" alt=\"LanySpace Website 1\"><\/div><\/div>\r\n                    <div class=\"web-mockup-ui-2 web-ui-2-bg\"><div class=\"web-ui-box-2\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724716.png\" alt=\"LanySpace Website 2\"><\/div><\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    (function() {\r\n        const webTextSteps = document.querySelectorAll('.web-text-step-2');\r\n        const webPhoneTrack = document.getElementById('js-web-phone-scroller-track-2');\r\n        if (!webTextSteps.length || !webPhoneTrack) return;\r\n\r\n        const webObserverOptions = { rootMargin: \"-45% 0px -45% 0px\", threshold: 0 };\r\n\r\n        const webIntersectionHandler = (entries) => {\r\n            entries.forEach(entry => {\r\n                if (entry.isIntersecting) {\r\n                    webTextSteps.forEach(step => step.classList.remove('active'));\r\n                    entry.target.classList.add('active');\r\n                    const currentStepIndex = parseInt(entry.target.getAttribute('data-index'), 10);\r\n                    const totalScreens = 2;\r\n                    const slidePercentPerScreen = 100 \/ totalScreens;\r\n                    const scrollOffset = currentStepIndex * -slidePercentPerScreen;\r\n                    webPhoneTrack.style.transform = `translateY(${scrollOffset}%)`;\r\n                }\r\n            });\r\n        };\r\n\r\n        const webVisualObserver = new IntersectionObserver(webIntersectionHandler, webObserverOptions);\r\n        webTextSteps.forEach(stepItem => { webVisualObserver.observe(stepItem); });\r\n    })();\r\n});\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a188a01 elementor-widget elementor-widget-html\" data-id=\"a188a01\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ==================== Web Case 3: @dommei Inc ==================== -->\r\n<style>\r\n    .web-scrolly-container-3 {\r\n        display: flex;\r\n        position: relative;\r\n        max-width: 1200px;\r\n        margin: 0 auto;\r\n        padding: 0 20px;\r\n    }\r\n\r\n    .web-left-sticky-3 {\r\n        width: 50%;\r\n        height: 100vh;\r\n        position: sticky;\r\n        top: 0;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        z-index: 10;\r\n    }\r\n\r\n    .web-phone-frame-3 {\r\n        position: relative;\r\n        width: 320px;\r\n        height: 650px;\r\n        background-color: #111;\r\n        border-radius: 45px;\r\n        box-shadow: 0 0 0 10px #27272A, 0 0 0 12px #18181B, 0 30px 60px rgba(0,0,0,0.8);\r\n        overflow: hidden;\r\n        transition: transform 0.3s ease;\r\n    }\r\n\r\n    .web-notch-3 {\r\n        position: absolute;\r\n        top: 12px;\r\n        left: 50%;\r\n        transform: translateX(-50%);\r\n        width: 120px;\r\n        height: 28px;\r\n        background-color: #000;\r\n        border-radius: 20px;\r\n        z-index: 20;\r\n    }\r\n\r\n    .web-phone-screen-3 {\r\n        width: 100%;\r\n        height: 100%;\r\n        border-radius: 35px;\r\n        overflow: hidden;\r\n        position: relative;\r\n        background: #fff;\r\n    }\r\n\r\n    \/* 4\u5f20\u56fe\uff0c\u603b\u9ad8\u5ea6 400% *\/\r\n    .web-phone-inner-content-3 {\r\n        width: 100%;\r\n        height: 400%;\r\n        transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);\r\n        display: flex;\r\n        flex-direction: column;\r\n    }\r\n\r\n    .web-mockup-ui-3 {\r\n        width: 100%;\r\n        height: calc(100% \/ 4);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        padding: 0;\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    .web-ui-3-bg { background: linear-gradient(135deg, #3B82F6, #8B5CF6); }\r\n\r\n    .web-ui-box-3 {\r\n        width: 100%;\r\n        height: 100%;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        padding-top: 67px;\r\n    }\r\n    .web-ui-box-3 img {\r\n        width: 100%;\r\n        height: 583px;\r\n        max-height: 583px;\r\n        object-fit: cover;\r\n        border-radius: 8px;\r\n        box-shadow: 0 5px 15px rgba(0,0,0,0.1);\r\n    }\r\n\r\n    .web-right-scroll-3 { width: 50%; padding: 0; }\r\n\r\n    .web-text-step-3 {\r\n        height: 100vh;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        opacity: 0.2;\r\n        transition: opacity 0.6s ease, transform 0.6s ease;\r\n        max-width: 400px;\r\n        padding-left: 50px;\r\n    }\r\n    .web-text-step-3.active { opacity: 1; }\r\n    .web-text-step-3 p { font-size: 1.05rem; color: #555; line-height: 1.6; font-weight: 300; }\r\n    .web-text-step-3 p b { font-weight: 600; }\r\n\r\n    .yyfw-3 {\r\n        background-color: #8C7DFF;\r\n        width: 140px;\r\n        text-align: center;\r\n        color: white;\r\n        border-radius: 360px;\r\n        line-height: 40px;\r\n        margin-top: 25px;\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .web-scrolly-container-3 { flex-direction: column-reverse; padding: 0; }\r\n        .web-left-sticky-3 { width: 100%; height: 50vh; top: 12vh; background: #fff; z-index: 100; }\r\n        .web-phone-frame-3 { transform: scale(0.5); transform-origin: center center; margin-top: -60px; }\r\n        .web-right-scroll-3 { width: 100%; padding: 0 20px; z-index: 20; }\r\n        .web-text-step-3 { height: 80vh; justify-content: flex-end; padding-bottom: 8vh; align-items: center; text-align: center; max-width: 100%; padding-left: 0; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"web-scrolly-container-3\">\r\n    <div class=\"web-right-scroll-3\">\r\n        <div class=\"web-text-step-3\" data-index=\"0\">\r\n            <p><b>@dommei Inc<\/b><br> Innovative backpack brand integrating toys, display, and storage in one.<br><br>\r\n            TikTok account with 10K+ engaged followers and growing, paired with an Instagram audience of nearly 11K, consistently driving content seeding and parenting-focused campaign activation.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-3\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"web-text-step-3\" data-index=\"1\">\r\n            <p><b>@dommei Inc<\/b><br> Innovative backpack brand integrating toys, display, and storage in one.<br><br>\r\n            TikTok account with 10K+ engaged followers and growing, paired with an Instagram audience of nearly 11K, consistently driving content seeding and parenting-focused campaign activation.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-3\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"web-text-step-3\" data-index=\"2\">\r\n            <p><b>@dommei Inc<\/b><br> Innovative backpack brand integrating toys, display, and storage in one.<br><br>\r\n            TikTok account with 10K+ engaged followers and growing, paired with an Instagram audience of nearly 11K, consistently driving content seeding and parenting-focused campaign activation.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-3\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"web-text-step-3\" data-index=\"3\">\r\n            <p><b>@dommei Inc<\/b><br> Innovative backpack brand integrating toys, display, and storage in one.<br><br>\r\n            TikTok account with 10K+ engaged followers and growing, paired with an Instagram audience of nearly 11K, consistently driving content seeding and parenting-focused campaign activation.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-3\">Contact Us<\/a>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"web-left-sticky-3\">\r\n        <div class=\"web-phone-frame-3\">\r\n            <div class=\"web-notch-3\"><\/div>\r\n            <div class=\"web-phone-screen-3\">\r\n                <div class=\"web-phone-inner-content-3\" id=\"js-web-phone-scroller-track-3\">\r\n                    <div class=\"web-mockup-ui-3 web-ui-3-bg\"><div class=\"web-ui-box-3\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724718.png\" alt=\"dommei backpack 1\"><\/div><\/div>\r\n                    <div class=\"web-mockup-ui-3 web-ui-3-bg\"><div class=\"web-ui-box-3\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724719.png\" alt=\"dommei backpack 2\"><\/div><\/div>\r\n                    <div class=\"web-mockup-ui-3 web-ui-3-bg\"><div class=\"web-ui-box-3\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724720.png\" alt=\"dommei backpack 3\"><\/div><\/div>\r\n                    <div class=\"web-mockup-ui-3 web-ui-3-bg\"><div class=\"web-ui-box-3\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724721.png\" alt=\"dommei backpack 4\"><\/div><\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    (function() {\r\n        const webTextSteps = document.querySelectorAll('.web-text-step-3');\r\n        const webPhoneTrack = document.getElementById('js-web-phone-scroller-track-3');\r\n        if (!webTextSteps.length || !webPhoneTrack) return;\r\n\r\n        const webObserverOptions = { rootMargin: \"-45% 0px -45% 0px\", threshold: 0 };\r\n\r\n        const webIntersectionHandler = (entries) => {\r\n            entries.forEach(entry => {\r\n                if (entry.isIntersecting) {\r\n                    webTextSteps.forEach(step => step.classList.remove('active'));\r\n                    entry.target.classList.add('active');\r\n                    const currentStepIndex = parseInt(entry.target.getAttribute('data-index'), 10);\r\n                    const totalScreens = 4;\r\n                    const slidePercentPerScreen = 100 \/ totalScreens;\r\n                    const scrollOffset = currentStepIndex * -slidePercentPerScreen;\r\n                    webPhoneTrack.style.transform = `translateY(${scrollOffset}%)`;\r\n                }\r\n            });\r\n        };\r\n\r\n        const webVisualObserver = new IntersectionObserver(webIntersectionHandler, webObserverOptions);\r\n        webTextSteps.forEach(stepItem => { webVisualObserver.observe(stepItem); });\r\n    })();\r\n});\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7aea2b77 elementor-widget elementor-widget-heading\" data-id=\"7aea2b77\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Full-Stack Execution<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3ccd785d elementor-widget elementor-widget-html\" data-id=\"3ccd785d\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"dtc\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ==================== Stack Case 1: @Kizuki Ramen ==================== -->\r\n<style>\r\n    .Stack-scrolly-container-1 { display: flex; position: relative; max-width: 1200px; margin: 0 auto; }\r\n\r\n    .Stack-left-sticky-1 {\r\n        width: 50%; height: 100vh; position: sticky; top: 0;\r\n        display: flex; align-items: center; justify-content: center;\r\n    }\r\n\r\n    .Stack-phone-frame-1 {\r\n        width: 320px; height: 650px; background-color: #111; border-radius: 45px;\r\n        box-shadow: 0 0 0 10px #27272A, 0 30px 60px rgba(0,0,0,0.5); overflow: hidden; position: relative;\r\n    }\r\n\r\n    .Stack-phone-screen-1 { width: 100%; height: 100%; overflow: hidden; background: #fff; border-radius: 35px; }\r\n\r\n    .Stack-phone-inner-content-1 {\r\n        width: 100%;\r\n        height: 500%;\r\n        transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.1, 1);\r\n        display: flex;\r\n        flex-direction: column;\r\n    }\r\n\r\n    .Stack-mockup-ui-1 {\r\n        width: 100%;\r\n        height: calc(100% \/ 5);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    .Stack-ui-1-bg { background: #f8fafc; }\r\n\r\n    .Stack-ui-box-1 { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 0; box-sizing: border-box; }\r\n    .Stack-ui-box-1 img {\r\n        width: 100%;\r\n        height: 100%;\r\n        object-fit: contain;\r\n        border-radius: 12px;\r\n        box-shadow: 0 10px 30px rgba(0,0,0,0.1);\r\n    }\r\n\r\n    .Stack-right-scroll-1 { width: 50%; }\r\n    .Stack-text-step-1 {\r\n        height: 100vh;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        opacity: 0.15;\r\n        transition: all 0.6s ease;\r\n        padding-left: 50px;\r\n    }\r\n    .Stack-text-step-1 p { font-weight: 300; }\r\n    .Stack-text-step-1 p b { font-weight: 600; }\r\n    .Stack-text-step-1.active { opacity: 1; transform: translateX(10px); }\r\n    .Stack-step-num-1 { font-size: 1.2rem; color: #3b82f6; font-weight: 700; margin-bottom: 12px; }\r\n    .Stack-text-step-1 p { font-size: 1.1rem; color: #4b5563; line-height: 1.6; max-width: 400px; }\r\n\r\n    .yyfw-s1 {\r\n        background-color: #8C7DFF;\r\n        width: 140px;\r\n        text-align: center;\r\n        color: white;\r\n        border-radius: 360px;\r\n        line-height: 40px;\r\n        margin-top: 25px;\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .Stack-scrolly-container-1 { flex-direction: column; }\r\n        .Stack-left-sticky-1 { width: 100%; height: 60vh; z-index: 30; background: #fff; }\r\n        .Stack-phone-frame-1 { transform: scale(0.5); margin-top: 60px; }\r\n        .Stack-right-scroll-1 { width: 100%; padding: 0 20px; }\r\n        .Stack-text-step-1 { height: 70vh; text-align: center; padding-left: 0; align-items: center; }\r\n        .Stack-text-step-1.active { transform: none; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"Stack-scrolly-container-1\">\r\n    <div class=\"Stack-left-sticky-1\">\r\n        <div class=\"Stack-phone-frame-1\">\r\n            <div class=\"Stack-notch\"><\/div>\r\n            <div class=\"Stack-phone-screen-1\">\r\n                <div class=\"Stack-phone-inner-content-1\" id=\"js-Stack-scroller-track-1\">\r\n                    <div class=\"Stack-mockup-ui-1 Stack-ui-1-bg\"><div class=\"Stack-ui-box-1\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724732.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-1 Stack-ui-1-bg\"><div class=\"Stack-ui-box-1\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724733.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-1 Stack-ui-1-bg\"><div class=\"Stack-ui-box-1\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724734.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-1 Stack-ui-1-bg\"><div class=\"Stack-ui-box-1\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724772.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-1 Stack-ui-1-bg\"><div class=\"Stack-ui-box-1\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724771.png\"><\/div><\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"Stack-right-scroll-1\">\r\n        <div class=\"Stack-text-step-1\" data-index=\"0\">\r\n            <div class=\"Stack-step-num-1\">case 4<\/div>\r\n            <p><b>@KizukiRamen  <\/b><br>U.S.store content operations integrated with offline customer acquisition, while developing new online product lines.<br><br>\r\n            As part of the ongoing marketing plan for the launch of new frozen products, we are supporting the U.S. market with full-stack, multi-platform execution, coordinating strategy, creative, and media to drive customer acquisition and achieve seamless outreach across all channels.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s1\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-1\" data-index=\"1\">\r\n            <p><b>@KizukiRamen  <\/b><br>U.S.store content operations integrated with offline customer acquisition, while developing new online product lines.<br><br>\r\n            As part of the ongoing marketing plan for the launch of new frozen products, we are supporting the U.S. market with full-stack, multi-platform execution, coordinating strategy, creative, and media to drive customer acquisition and achieve seamless outreach across all channels.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s1\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-1\" data-index=\"2\">\r\n            <p><b>@KizukiRamen  <\/b><br>U.S.store content operations integrated with offline customer acquisition, while developing new online product lines.<br><br>\r\n            As part of the ongoing marketing plan for the launch of new frozen products, we are supporting the U.S. market with full-stack, multi-platform execution, coordinating strategy, creative, and media to drive customer acquisition and achieve seamless outreach across all channels.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s1\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-1\" data-index=\"3\">\r\n            <p><b>@KizukiRamen  <\/b><br>U.S.store content operations integrated with offline customer acquisition, while developing new online product lines.<br><br>\r\n            As part of the ongoing marketing plan for the launch of new frozen products, we are supporting the U.S. market with full-stack, multi-platform execution, coordinating strategy, creative, and media to drive customer acquisition and achieve seamless outreach across all channels.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s1\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-1\" data-index=\"4\">\r\n            <p><b>@KizukiRamen  <\/b><br>U.S.store content operations integrated with offline customer acquisition, while developing new online product lines.<br><br>\r\n            As part of the ongoing marketing plan for the launch of new frozen products, we are supporting the U.S. market with full-stack, multi-platform execution, coordinating strategy, creative, and media to drive customer acquisition and achieve seamless outreach across all channels.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s1\">Contact Us<\/a>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    (function() {\r\n        const stackSteps = document.querySelectorAll('.Stack-text-step-1');\r\n        const stackTrack = document.getElementById('js-Stack-scroller-track-1');\r\n        if (!stackSteps.length || !stackTrack) return;\r\n\r\n        const stackOptions = { rootMargin: \"-45% 0px -45% 0px\", threshold: 0 };\r\n        const stackCallback = (entries) => {\r\n            entries.forEach(entry => {\r\n                if (entry.isIntersecting) {\r\n                    stackSteps.forEach(s => s.classList.remove('active'));\r\n                    entry.target.classList.add('active');\r\n                    const idx = parseInt(entry.target.getAttribute('data-index'), 10);\r\n                    const offset = idx * -(100 \/ 5);\r\n                    stackTrack.style.transform = `translateY(${offset}%)`;\r\n                }\r\n            });\r\n        };\r\n        const stackObs = new IntersectionObserver(stackCallback, stackOptions);\r\n        stackSteps.forEach(step => stackObs.observe(step));\r\n    })();\r\n});\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e604df3 elementor-widget elementor-widget-html\" data-id=\"e604df3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ==================== Stack Case 2: @Virscend University ==================== -->\r\n<style>\r\n    .Stack-scrolly-container-2 { display: flex; position: relative; max-width: 1200px; margin: 0 auto; }\r\n\r\n    .Stack-left-sticky-2 {\r\n        width: 50%; height: 100vh; position: sticky; top: 0;\r\n        display: flex; align-items: center; justify-content: center;\r\n    }\r\n\r\n    .Stack-phone-frame-2 {\r\n        width: 320px; height: 650px; background-color: #111; border-radius: 45px;\r\n        box-shadow: 0 0 0 10px #27272A, 0 30px 60px rgba(0,0,0,0.5); overflow: hidden; position: relative;\r\n    }\r\n\r\n    .Stack-phone-screen-2 { width: 100%; height: 100%; overflow: hidden; background: #fff; border-radius: 35px; }\r\n\r\n    .Stack-phone-inner-content-2 {\r\n        width: 100%;\r\n        height: 400%;\r\n        transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.1, 1);\r\n        display: flex;\r\n        flex-direction: column;\r\n    }\r\n\r\n    .Stack-mockup-ui-2 {\r\n        width: 100%;\r\n        height: calc(100% \/ 4);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    .Stack-ui-2-bg { background: #1e293b; }\r\n\r\n    .Stack-ui-box-2 { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 0; box-sizing: border-box; }\r\n    .Stack-ui-box-2 img {\r\n        width: 100%;\r\n        height: 100%;\r\n        object-fit: contain;\r\n        border-radius: 12px;\r\n        box-shadow: 0 10px 30px rgba(0,0,0,0.1);\r\n    }\r\n\r\n    .Stack-right-scroll-2 { width: 50%; }\r\n    .Stack-text-step-2 {\r\n        height: 100vh;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        opacity: 0.15;\r\n        transition: all 0.6s ease;\r\n        padding-left: 50px;\r\n    }\r\n    .Stack-text-step-2 p { font-weight: 300; }\r\n    .Stack-text-step-2 p b { font-weight: 600; }\r\n    .Stack-text-step-2.active { opacity: 1; transform: translateX(10px); }\r\n    .Stack-step-num-2 { font-size: 1.2rem; color: #3b82f6; font-weight: 700; margin-bottom: 12px; }\r\n    .Stack-text-step-2 p { font-size: 1.1rem; color: #4b5563; line-height: 1.6; max-width: 400px; }\r\n\r\n    .yyfw-s2 {\r\n        background-color: #8C7DFF;\r\n        width: 140px;\r\n        text-align: center;\r\n        color: white;\r\n        border-radius: 360px;\r\n        line-height: 40px;\r\n        margin-top: 25px;\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .Stack-scrolly-container-2 { flex-direction: column; }\r\n        .Stack-left-sticky-2 { width: 100%; height: 60vh; z-index: 30; background: #fff; }\r\n        .Stack-phone-frame-2 { transform: scale(0.5); margin-top: 60px; }\r\n        .Stack-right-scroll-2 { width: 100%; padding: 0 20px; }\r\n        .Stack-text-step-2 { height: 70vh; text-align: center; padding-left: 0; align-items: center; }\r\n        .Stack-text-step-2.active { transform: none; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"Stack-scrolly-container-2\">\r\n    <div class=\"Stack-left-sticky-2\">\r\n        <div class=\"Stack-phone-frame-2\">\r\n            <div class=\"Stack-notch\"><\/div>\r\n            <div class=\"Stack-phone-screen-2\">\r\n                <div class=\"Stack-phone-inner-content-2\" id=\"js-Stack-scroller-track-2\">\r\n                    <div class=\"Stack-mockup-ui-2 Stack-ui-2-bg\"><div class=\"Stack-ui-box-2\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724735.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-2 Stack-ui-2-bg\"><div class=\"Stack-ui-box-2\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724736.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-2 Stack-ui-2-bg\"><div class=\"Stack-ui-box-2\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724737.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-2 Stack-ui-2-bg\"><div class=\"Stack-ui-box-2\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724738.png\"><\/div><\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"Stack-right-scroll-2\">\r\n        <div class=\"Stack-text-step-2\" data-index=\"0\">\r\n            <p><b>@Virscend University <\/b><br>is a business school located in Irvine, California.<br><br>\r\n            We handle full-stack, multi-platform online enrollment marketing for Virscend University. While the follower base is modest, engagement and conversion rates are strong. Content is adapted across platforms to maximize reach, effectively connecting with the target audience in China.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s2\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-2\" data-index=\"1\">\r\n            <p><b>@Virscend University <\/b><br>is a business school located in Irvine, California.<br><br>\r\n            We handle full-stack, multi-platform online enrollment marketing for Virscend University. While the follower base is modest, engagement and conversion rates are strong. Content is adapted across platforms to maximize reach, effectively connecting with the target audience in China.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s2\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-2\" data-index=\"2\">\r\n            <p><b>@Virscend University <\/b><br>is a business school located in Irvine, California.<br><br>\r\n            We handle full-stack, multi-platform online enrollment marketing for Virscend University. While the follower base is modest, engagement and conversion rates are strong. Content is adapted across platforms to maximize reach, effectively connecting with the target audience in China.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s2\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-2\" data-index=\"3\">\r\n            <p><b>@Virscend University <\/b><br>is a business school located in Irvine, California.<br><br>\r\n            We handle full-stack, multi-platform online enrollment marketing for Virscend University. While the follower base is modest, engagement and conversion rates are strong. Content is adapted across platforms to maximize reach, effectively connecting with the target audience in China.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s2\">Contact Us<\/a>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    (function() {\r\n        const stackSteps = document.querySelectorAll('.Stack-text-step-2');\r\n        const stackTrack = document.getElementById('js-Stack-scroller-track-2');\r\n        if (!stackSteps.length || !stackTrack) return;\r\n\r\n        const stackOptions = { rootMargin: \"-45% 0px -45% 0px\", threshold: 0 };\r\n        const stackCallback = (entries) => {\r\n            entries.forEach(entry => {\r\n                if (entry.isIntersecting) {\r\n                    stackSteps.forEach(s => s.classList.remove('active'));\r\n                    entry.target.classList.add('active');\r\n                    const idx = parseInt(entry.target.getAttribute('data-index'), 10);\r\n                    const offset = idx * -(100 \/ 4);\r\n                    stackTrack.style.transform = `translateY(${offset}%)`;\r\n                }\r\n            });\r\n        };\r\n        const stackObs = new IntersectionObserver(stackCallback, stackOptions);\r\n        stackSteps.forEach(step => stackObs.observe(step));\r\n    })();\r\n});\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-36aa477 elementor-widget elementor-widget-html\" data-id=\"36aa477\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ==================== Stack Case 3: @faeriesty_shop ==================== -->\r\n<style>\r\n    .Stack-scrolly-container-3 { display: flex; position: relative; max-width: 1200px; margin: 0 auto; }\r\n\r\n    .Stack-left-sticky-3 {\r\n        width: 50%; height: 100vh; position: sticky; top: 0;\r\n        display: flex; align-items: center; justify-content: center;\r\n    }\r\n\r\n    .Stack-phone-frame-3 {\r\n        width: 320px; height: 650px; background-color: #111; border-radius: 45px;\r\n        box-shadow: 0 0 0 10px #27272A, 0 30px 60px rgba(0,0,0,0.5); overflow: hidden; position: relative;\r\n    }\r\n\r\n    .Stack-phone-screen-3 { width: 100%; height: 100%; overflow: hidden; background: #fff; border-radius: 35px; }\r\n\r\n    .Stack-phone-inner-content-3 {\r\n        width: 100%;\r\n        height: 400%;\r\n        transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.1, 1);\r\n        display: flex;\r\n        flex-direction: column;\r\n    }\r\n\r\n    .Stack-mockup-ui-3 {\r\n        width: 100%;\r\n        height: calc(100% \/ 4);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    .Stack-ui-3-bg { background: #eff6ff; }\r\n\r\n    .Stack-ui-box-3 { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 0; box-sizing: border-box; }\r\n    .Stack-ui-box-3 img {\r\n        width: 100%;\r\n        height: 100%;\r\n        object-fit: contain;\r\n        border-radius: 12px;\r\n        box-shadow: 0 10px 30px rgba(0,0,0,0.1);\r\n    }\r\n\r\n    .Stack-right-scroll-3 { width: 50%; }\r\n    .Stack-text-step-3 {\r\n        height: 100vh;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        opacity: 0.15;\r\n        transition: all 0.6s ease;\r\n        padding-left: 50px;\r\n    }\r\n    .Stack-text-step-3 p { font-weight: 300; }\r\n    .Stack-text-step-3 p b { font-weight: 600; }\r\n    .Stack-text-step-3.active { opacity: 1; transform: translateX(10px); }\r\n    .Stack-step-num-3 { font-size: 1.2rem; color: #3b82f6; font-weight: 700; margin-bottom: 12px; }\r\n    .Stack-text-step-3 p { font-size: 1.1rem; color: #4b5563; line-height: 1.6; max-width: 400px; }\r\n\r\n    .yyfw-s3 {\r\n        background-color: #8C7DFF;\r\n        width: 140px;\r\n        text-align: center;\r\n        color: white;\r\n        border-radius: 360px;\r\n        line-height: 40px;\r\n        margin-top: 25px;\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .Stack-scrolly-container-3 { flex-direction: column; }\r\n        .Stack-left-sticky-3 { width: 100%; height: 60vh; z-index: 30; background: #fff; }\r\n        .Stack-phone-frame-3 { transform: scale(0.5); margin-top: 60px; }\r\n        .Stack-right-scroll-3 { width: 100%; padding: 0 20px; }\r\n        .Stack-text-step-3 { height: 70vh; text-align: center; padding-left: 0; align-items: center; }\r\n        .Stack-text-step-3.active { transform: none; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"Stack-scrolly-container-3\">\r\n    <div class=\"Stack-left-sticky-3\">\r\n        <div class=\"Stack-phone-frame-3\">\r\n            <div class=\"Stack-notch\"><\/div>\r\n            <div class=\"Stack-phone-screen-3\">\r\n                <div class=\"Stack-phone-inner-content-3\" id=\"js-Stack-scroller-track-3\">\r\n                    <div class=\"Stack-mockup-ui-3 Stack-ui-3-bg\"><div class=\"Stack-ui-box-3\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724740.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-3 Stack-ui-3-bg\"><div class=\"Stack-ui-box-3\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724741.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-3 Stack-ui-3-bg\"><div class=\"Stack-ui-box-3\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724742.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-3 Stack-ui-3-bg\"><div class=\"Stack-ui-box-3\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724743.png\"><\/div><\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"Stack-right-scroll-3\">\r\n        <div class=\"Stack-text-step-3\" data-index=\"0\">\r\n            <p><b>@faeriesty_shop<\/b><br>\r\n            Full-stack execution driving both content and commerce: 100K+ TikTok Shop sales achieved through integrated strategy, creative, and live operations, with daily promotions up to 50% off.<br>\r\n            260K+ Instagram followers; positioned as a leading occasion dress brand, ensuring consistent messaging and seamless coordination across platforms to support one unified growth objective.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s3\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-3\" data-index=\"1\">\r\n            <p><b>@faeriesty_shop<\/b><br>\r\n            Full-stack execution driving both content and commerce: 100K+ TikTok Shop sales achieved through integrated strategy, creative, and live operations, with daily promotions up to 50% off.<br>\r\n            260K+ Instagram followers; positioned as a leading occasion dress brand, ensuring consistent messaging and seamless coordination across platforms to support one unified growth objective.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s3\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-3\" data-index=\"2\">\r\n            <p><b>@faeriesty_shop<\/b><br>\r\n            Full-stack execution driving both content and commerce: 100K+ TikTok Shop sales achieved through integrated strategy, creative, and live operations, with daily promotions up to 50% off.<br>\r\n            260K+ Instagram followers; positioned as a leading occasion dress brand, ensuring consistent messaging and seamless coordination across platforms to support one unified growth objective.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s3\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-3\" data-index=\"3\">\r\n            <p><b>@faeriesty_shop<\/b><br>\r\n            Full-stack execution driving both content and commerce: 100K+ TikTok Shop sales achieved through integrated strategy, creative, and live operations, with daily promotions up to 50% off.<br>\r\n            260K+ Instagram followers; positioned as a leading occasion dress brand, ensuring consistent messaging and seamless coordination across platforms to support one unified growth objective.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s3\">Contact Us<\/a>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    (function() {\r\n        const stackSteps = document.querySelectorAll('.Stack-text-step-3');\r\n        const stackTrack = document.getElementById('js-Stack-scroller-track-3');\r\n        if (!stackSteps.length || !stackTrack) return;\r\n\r\n        const stackOptions = { rootMargin: \"-45% 0px -45% 0px\", threshold: 0 };\r\n        const stackCallback = (entries) => {\r\n            entries.forEach(entry => {\r\n                if (entry.isIntersecting) {\r\n                    stackSteps.forEach(s => s.classList.remove('active'));\r\n                    entry.target.classList.add('active');\r\n                    const idx = parseInt(entry.target.getAttribute('data-index'), 10);\r\n                    const offset = idx * -(100 \/ 4);\r\n                    stackTrack.style.transform = `translateY(${offset}%)`;\r\n                }\r\n            });\r\n        };\r\n        const stackObs = new IntersectionObserver(stackCallback, stackOptions);\r\n        stackSteps.forEach(step => stackObs.observe(step));\r\n    })();\r\n});\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-411a5ea elementor-widget elementor-widget-html\" data-id=\"411a5ea\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ==================== Stack Case 4: @supremedumplings ==================== -->\r\n<style>\r\n    .Stack-scrolly-container-4 { display: flex; position: relative; max-width: 1200px; margin: 0 auto; }\r\n\r\n    .Stack-left-sticky-4 {\r\n        width: 50%; height: 100vh; position: sticky; top: 0;\r\n        display: flex; align-items: center; justify-content: center;\r\n    }\r\n\r\n    .Stack-phone-frame-4 {\r\n        width: 320px; height: 650px; background-color: #111; border-radius: 45px;\r\n        box-shadow: 0 0 0 10px #27272A, 0 30px 60px rgba(0,0,0,0.5); overflow: hidden; position: relative;\r\n    }\r\n\r\n    .Stack-phone-screen-4 { width: 100%; height: 100%; overflow: hidden; background: #fff; border-radius: 35px; }\r\n\r\n    .Stack-phone-inner-content-4 {\r\n        width: 100%;\r\n        height: 400%;\r\n        transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.1, 1);\r\n        display: flex;\r\n        flex-direction: column;\r\n    }\r\n\r\n    .Stack-mockup-ui-4 {\r\n        width: 100%;\r\n        height: calc(100% \/ 4);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    .Stack-ui-4-bg { background: #fffbeb; }\r\n\r\n    .Stack-ui-box-4 { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 0; box-sizing: border-box; }\r\n    .Stack-ui-box-4 img {\r\n        width: 100%;\r\n        height: 100%;\r\n        object-fit: contain;\r\n        border-radius: 12px;\r\n        box-shadow: 0 10px 30px rgba(0,0,0,0.1);\r\n    }\r\n\r\n    .Stack-right-scroll-4 { width: 50%; }\r\n    .Stack-text-step-4 {\r\n        height: 100vh;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        opacity: 0.15;\r\n        transition: all 0.6s ease;\r\n        padding-left: 50px;\r\n    }\r\n    .Stack-text-step-4 p { font-weight: 300; }\r\n    .Stack-text-step-4 p b { font-weight: 600; }\r\n    .Stack-text-step-4.active { opacity: 1; transform: translateX(10px); }\r\n    .Stack-step-num-4 { font-size: 1.2rem; color: #3b82f6; font-weight: 700; margin-bottom: 12px; }\r\n    .Stack-text-step-4 p { font-size: 1.1rem; color: #4b5563; line-height: 1.6; max-width: 400px; }\r\n\r\n    .yyfw-s4 {\r\n        background-color: #8C7DFF;\r\n        width: 140px;\r\n        text-align: center;\r\n        color: white;\r\n        border-radius: 360px;\r\n        line-height: 40px;\r\n        margin-top: 25px;\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .Stack-scrolly-container-4 { flex-direction: column; }\r\n        .Stack-left-sticky-4 { width: 100%; height: 60vh; z-index: 30; background: #fff; }\r\n        .Stack-phone-frame-4 { transform: scale(0.5); margin-top: 60px; }\r\n        .Stack-right-scroll-4 { width: 100%; padding: 0 20px; }\r\n        .Stack-text-step-4 { height: 70vh; text-align: center; padding-left: 0; align-items: center; }\r\n        .Stack-text-step-4.active { transform: none; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"Stack-scrolly-container-4\">\r\n    <div class=\"Stack-left-sticky-4\">\r\n        <div class=\"Stack-phone-frame-4\">\r\n            <div class=\"Stack-notch\"><\/div>\r\n            <div class=\"Stack-phone-screen-4\">\r\n                <div class=\"Stack-phone-inner-content-4\" id=\"js-Stack-scroller-track-4\">\r\n                    <div class=\"Stack-mockup-ui-4 Stack-ui-4-bg\"><div class=\"Stack-ui-box-4\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724744.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-4 Stack-ui-4-bg\"><div class=\"Stack-ui-box-4\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724745.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-4 Stack-ui-4-bg\"><div class=\"Stack-ui-box-4\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724746.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-4 Stack-ui-4-bg\"><div class=\"Stack-ui-box-4\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/d.png\"><\/div><\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"Stack-right-scroll-4\">\r\n        <div class=\"Stack-text-step-4\" data-index=\"0\">\r\n            <p><b>@supremedumplings<\/b><br>\r\n            One team managing TikTok, Instagram, Facebook, and Xiaohongshu accounts end-to-end.<br>\r\n            Unified Objective: Coordinating creative, content, and media strategies to ensure every platform drives brand growth and audience engagement.<br>\r\n            Seamless Integration: Streamlined cross-platform operations, eliminating inefficiencies from multiple vendors.<br>\r\n            Full Accountability: Consistent brand voice, rapid trend responsiveness, and measurable performance across all channels.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s4\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-4\" data-index=\"1\">\r\n            <p><b>@supremedumplings<\/b><br>\r\n            One team managing TikTok, Instagram, Facebook, and Xiaohongshu accounts end-to-end.<br>\r\n            Unified Objective: Coordinating creative, content, and media strategies to ensure every platform drives brand growth and audience engagement.<br>\r\n            Seamless Integration: Streamlined cross-platform operations, eliminating inefficiencies from multiple vendors.<br>\r\n            Full Accountability: Consistent brand voice, rapid trend responsiveness, and measurable performance across all channels.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s4\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-4\" data-index=\"2\">\r\n            <p><b>@supremedumplings<\/b><br>\r\n            One team managing TikTok, Instagram, Facebook, and Xiaohongshu accounts end-to-end.<br>\r\n            Unified Objective: Coordinating creative, content, and media strategies to ensure every platform drives brand growth and audience engagement.<br>\r\n            Seamless Integration: Streamlined cross-platform operations, eliminating inefficiencies from multiple vendors.<br>\r\n            Full Accountability: Consistent brand voice, rapid trend responsiveness, and measurable performance across all channels.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s4\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-4\" data-index=\"3\">\r\n            <p><b>@supremedumplings<\/b><br>\r\n            One team managing TikTok, Instagram, Facebook, and Xiaohongshu accounts end-to-end.<br>\r\n            Unified Objective: Coordinating creative, content, and media strategies to ensure every platform drives brand growth and audience engagement.<br>\r\n            Seamless Integration: Streamlined cross-platform operations, eliminating inefficiencies from multiple vendors.<br>\r\n            Full Accountability: Consistent brand voice, rapid trend responsiveness, and measurable performance across all channels.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s4\">Contact Us<\/a>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    (function() {\r\n        const stackSteps = document.querySelectorAll('.Stack-text-step-4');\r\n        const stackTrack = document.getElementById('js-Stack-scroller-track-4');\r\n        if (!stackSteps.length || !stackTrack) return;\r\n\r\n        const stackOptions = { rootMargin: \"-45% 0px -45% 0px\", threshold: 0 };\r\n        const stackCallback = (entries) => {\r\n            entries.forEach(entry => {\r\n                if (entry.isIntersecting) {\r\n                    stackSteps.forEach(s => s.classList.remove('active'));\r\n                    entry.target.classList.add('active');\r\n                    const idx = parseInt(entry.target.getAttribute('data-index'), 10);\r\n                    const offset = idx * -(100 \/ 4);\r\n                    stackTrack.style.transform = `translateY(${offset}%)`;\r\n                }\r\n            });\r\n        };\r\n        const stackObs = new IntersectionObserver(stackCallback, stackOptions);\r\n        stackSteps.forEach(step => stackObs.observe(step));\r\n    })();\r\n});\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e696905 elementor-widget elementor-widget-html\" data-id=\"e696905\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ==================== Stack Case 5: @joyoflifesurrogacy ==================== -->\r\n<style>\r\n    .Stack-scrolly-container-5 { display: flex; position: relative; max-width: 1200px; margin: 0 auto; }\r\n\r\n    .Stack-left-sticky-5 {\r\n        width: 50%; height: 100vh; position: sticky; top: 0;\r\n        display: flex; align-items: center; justify-content: center;\r\n    }\r\n\r\n    .Stack-phone-frame-5 {\r\n        width: 320px; height: 650px; background-color: #111; border-radius: 45px;\r\n        box-shadow: 0 0 0 10px #27272A, 0 30px 60px rgba(0,0,0,0.5); overflow: hidden; position: relative;\r\n    }\r\n\r\n    .Stack-phone-screen-5 { width: 100%; height: 100%; overflow: hidden; background: #fff; border-radius: 35px; }\r\n\r\n    .Stack-phone-inner-content-5 {\r\n        width: 100%;\r\n        height: 500%;\r\n        transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.1, 1);\r\n        display: flex;\r\n        flex-direction: column;\r\n    }\r\n\r\n    .Stack-mockup-ui-5 {\r\n        width: 100%;\r\n        height: calc(100% \/ 5);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    .Stack-ui-5-bg { background: #fef2f2; }\r\n    .Stack-ui-5b-bg { background: #f5f3ff; }\r\n\r\n    .Stack-ui-box-5 { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 0; box-sizing: border-box; }\r\n    .Stack-ui-box-5 img {\r\n        width: 100%;\r\n        height: 100%;\r\n        object-fit: contain;\r\n        border-radius: 12px;\r\n        box-shadow: 0 10px 30px rgba(0,0,0,0.1);\r\n    }\r\n\r\n    .Stack-right-scroll-5 { width: 50%; }\r\n    .Stack-text-step-5 {\r\n        height: 100vh;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        opacity: 0.15;\r\n        transition: all 0.6s ease;\r\n        padding-left: 50px;\r\n    }\r\n    .Stack-text-step-5 p { font-weight: 300; }\r\n    .Stack-text-step-5 p b { font-weight: 600; }\r\n    .Stack-text-step-5.active { opacity: 1; transform: translateX(10px); }\r\n    .Stack-step-num-5 { font-size: 1.2rem; color: #3b82f6; font-weight: 700; margin-bottom: 12px; }\r\n    .Stack-text-step-5 p { font-size: 1.1rem; color: #4b5563; line-height: 1.6; max-width: 400px; }\r\n\r\n    .yyfw-s5 {\r\n        background-color: #8C7DFF;\r\n        width: 140px;\r\n        text-align: center;\r\n        color: white;\r\n        border-radius: 360px;\r\n        line-height: 40px;\r\n        margin-top: 25px;\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .Stack-scrolly-container-5 { flex-direction: column; }\r\n        .Stack-left-sticky-5 { width: 100%; height: 60vh; z-index: 30; background: #fff; }\r\n        .Stack-phone-frame-5 { transform: scale(0.5); margin-top: 60px; }\r\n        .Stack-right-scroll-5 { width: 100%; padding: 0 20px; }\r\n        .Stack-text-step-5 { height: 70vh; text-align: center; padding-left: 0; align-items: center; }\r\n        .Stack-text-step-5.active { transform: none; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"Stack-scrolly-container-5\">\r\n    <div class=\"Stack-left-sticky-5\">\r\n        <div class=\"Stack-phone-frame-5\">\r\n            <div class=\"Stack-notch\"><\/div>\r\n            <div class=\"Stack-phone-screen-5\">\r\n                <div class=\"Stack-phone-inner-content-5\" id=\"js-Stack-scroller-track-5\">\r\n                    <div class=\"Stack-mockup-ui-5 Stack-ui-5-bg\"><div class=\"Stack-ui-box-5\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724770-scaled.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-5 Stack-ui-5-bg\"><div class=\"Stack-ui-box-5\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724747.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-5 Stack-ui-5-bg\"><div class=\"Stack-ui-box-5\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724748.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-5 Stack-ui-5b-bg\"><div class=\"Stack-ui-box-5\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724749.png\"><\/div><\/div>\r\n                    <div class=\"Stack-mockup-ui-5 Stack-ui-5b-bg\"><div class=\"Stack-ui-box-5\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724750.png\"><\/div><\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"Stack-right-scroll-5\">\r\n        <div class=\"Stack-text-step-5\" data-index=\"0\">\r\n            <p><b>@joyoflifesurrogacyPremium <\/b><br>premium postpartum care and wellness center, providing elite maternal and newborn services with a commitment to excellence.<br><br>\r\n            A prime example of full-stack execution, integrating high-performance web architecture, SEO-driven search visibility, and cohesive social branding. By eliminating cross-vendor friction, we ensure a unified visual identity and consistent messaging across every digital touchpoint to maximize conversion.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s5\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-5\" data-index=\"1\">\r\n            <p><b>@joyoflifesurrogacyPremium <\/b><br>premium postpartum care and wellness center, providing elite maternal and newborn services with a commitment to excellence.<br><br>\r\n            A prime example of full-stack execution, integrating high-performance web architecture, SEO-driven search visibility, and cohesive social branding. By eliminating cross-vendor friction, we ensure a unified visual identity and consistent messaging across every digital touchpoint to maximize conversion.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s5\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-5\" data-index=\"2\">\r\n            <p><b>@joyoflifesurrogacyPremium <\/b><br>premium postpartum care and wellness center, providing elite maternal and newborn services with a commitment to excellence.<br><br>\r\n            A prime example of full-stack execution, integrating high-performance web architecture, SEO-driven search visibility, and cohesive social branding. By eliminating cross-vendor friction, we ensure a unified visual identity and consistent messaging across every digital touchpoint to maximize conversion.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s5\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-5\" data-index=\"3\">\r\n            <p><b>@joyoflifesurrogacyPremium <\/b><br>premium postpartum care and wellness center, providing elite maternal and newborn services with a commitment to excellence.<br><br>\r\n            A prime example of full-stack execution, integrating high-performance web architecture, SEO-driven search visibility, and cohesive social branding. By eliminating cross-vendor friction, we ensure a unified visual identity and consistent messaging across every digital touchpoint to maximize conversion.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s5\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Stack-text-step-5\" data-index=\"4\">\r\n            <p><b>@joyoflifesurrogacyPremium <\/b><br>premium postpartum care and wellness center, providing elite maternal and newborn services with a commitment to excellence.<br><br>\r\n            A prime example of full-stack execution, integrating high-performance web architecture, SEO-driven search visibility, and cohesive social branding. By eliminating cross-vendor friction, we ensure a unified visual identity and consistent messaging across every digital touchpoint to maximize conversion.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-s5\">Contact Us<\/a>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    (function() {\r\n        const stackSteps = document.querySelectorAll('.Stack-text-step-5');\r\n        const stackTrack = document.getElementById('js-Stack-scroller-track-5');\r\n        if (!stackSteps.length || !stackTrack) return;\r\n\r\n        const stackOptions = { rootMargin: \"-45% 0px -45% 0px\", threshold: 0 };\r\n        const stackCallback = (entries) => {\r\n            entries.forEach(entry => {\r\n                if (entry.isIntersecting) {\r\n                    stackSteps.forEach(s => s.classList.remove('active'));\r\n                    entry.target.classList.add('active');\r\n                    const idx = parseInt(entry.target.getAttribute('data-index'), 10);\r\n                    const offset = idx * -(100 \/ 5);\r\n                    stackTrack.style.transform = `translateY(${offset}%)`;\r\n                }\r\n            });\r\n        };\r\n        const stackObs = new IntersectionObserver(stackCallback, stackOptions);\r\n        stackSteps.forEach(step => stackObs.observe(step));\r\n    })();\r\n});\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2f069c8e elementor-widget elementor-widget-heading\" data-id=\"2f069c8e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Modern Commerce +tiktok<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5aec872e elementor-widget elementor-widget-html\" data-id=\"5aec872e\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"TikTokm\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"Modern-scrolly-container\">\r\n  \r\n    \r\n    <!-- \u53f3\u4fa7\uff1a\u9f20\u6807\u6eda\u52a8\u6587\u6848 (10\u6bb5) -->\r\n    <div class=\"Modern-right-scroll\">\r\n        <!-- LERRO \u6587\u6848\u7ec4 -->\r\n      \r\n        \r\n\r\n        <!-- AmpAura \u6587\u6848\u7ec4 -->\r\n        <div class=\"Modern-text-step\" data-index=\"0\">\r\n            <div class=\"Modern-step-num\">case 5<\/div>\r\n              <p><b>@PITAKA<\/b><br>\r\n High-performance mobile accessories brand, leveraging a creator matrix to build a full funnel from awareness to conversion. Collaborated with 4 top-tier photography KOLs and 14 mid-tier creators to establish layered content distribution and trust signals. Achieved a 3.75% engagement rate and 2.23M+ total impressions, consistently feeding high-intent traffic into live commerce and e-commerce channels to support downstream conversions.\r\n<\/p><a href=\"\/index.php\/contact\/\" class=\"yyfw\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Modern-text-step\" data-index=\"1\">\r\n              <p><b>@PITAKA<\/b><br>\r\n High-performance mobile accessories brand, leveraging a creator matrix to build a full funnel from awareness to conversion. Collaborated with 4 top-tier photography KOLs and 14 mid-tier creators to establish layered content distribution and trust signals. Achieved a 3.75% engagement rate and 2.23M+ total impressions, consistently feeding high-intent traffic into live commerce and e-commerce channels to support downstream conversions.\r\n<\/p><a href=\"\/index.php\/contact\/\" class=\"yyfw\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"Modern-text-step\" data-index=\"2\">\r\n              <p><b>@PITAKA<\/b><br>\r\n High-performance mobile accessories brand, leveraging a creator matrix to build a full funnel from awareness to conversion. Collaborated with 4 top-tier photography KOLs and 14 mid-tier creators to establish layered content distribution and trust signals. Achieved a 3.75% engagement rate and 2.23M+ total impressions, consistently feeding high-intent traffic into live commerce and e-commerce channels to support downstream conversions.\r\n<\/p><a href=\"\/index.php\/contact\/\" class=\"yyfw\">Contact Us<\/a>\r\n        <\/div>\r\n\r\n        \r\n    <\/div>\r\n      <!-- \u5de6\u4fa7\uff1a\u5438\u9876\u624b\u673a -->\r\n    <div class=\"Modern-left-sticky\">\r\n        <div class=\"Modern-phone-frame\">\r\n            <div class=\"Modern-notch\"><\/div>\r\n            <div class=\"Modern-phone-screen\">\r\n                <!-- 10\u5c4f\u6eda\u52a8\u8f68\u9053 -->\r\n                <div class=\"Modern-phone-inner\" id=\"Modern-phone-track\">\r\n                    \r\n                    <!-- \u3010LERRO \u7cfb\u5217 - 2\u5c4f\u3011 -->\r\n                 \r\n                   \r\n                    <div class=\"Modern-mockup-ui Modern-ui-2\"><div class=\"Modern-ui-box\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724767.png\"><\/div><\/div>\r\n                    <div class=\"Modern-mockup-ui Modern-ui-2\"><div class=\"Modern-ui-box\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724768.png\"><\/div><\/div>\r\n\r\n                    <!-- \u3010PITAKA \u7cfb\u5217 - 4\u5c4f\u3011 -->\r\n                    <div class=\"Modern-mockup-ui Modern-ui-3\"><div class=\"Modern-ui-box\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724769.png\"><\/div><\/div>\r\n                    \r\n\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<style>\r\n    \/* \u4e3b\u5bb9\u5668 *\/\r\n    .Modern-scrolly-container { display: flex; position: relative; max-width: 1200px; margin: 0 auto; }\r\n    \r\n    \/* \u5de6\u4fa7\u5438\u9876 *\/\r\n    .Modern-left-sticky {\r\n        position: sticky; top: 0; width: 50%; height: 100vh;\r\n        display: flex; align-items: center; justify-content: center;\r\n    }\r\n    \r\n    .Modern-phone-frame {\r\n        width: 320px; height: 650px; background: #111; border-radius: 45px;\r\n        box-shadow: 0 0 0 10px #27272A, 0 30px 60px rgba(0,0,0,0.5); position: relative; overflow: hidden;\r\n    }\r\n    \r\n    .Modern-notch {\r\n        position: absolute; top: 0; left: 50%; transform: translateX(-50%);\r\n        width: 150px; height: 26px; background: #111; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; z-index: 10;\r\n    }\r\n    \r\n    .Modern-phone-screen {\r\n        position: absolute; top: 15px; left: 10px; right: 10px; bottom: 10px;\r\n        background: #fff; border-radius: 35px; overflow: hidden;\r\n    }\r\n    \r\n    \/* \u6838\u5fc3\u6eda\u52a8\uff1a6\u5c4f = 1000% *\/\r\n    .Modern-phone-inner {\r\n        width: 100%; height: 300%;\r\n        transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);\r\n        display: flex; flex-direction: column;\r\n    }\r\n    \r\n    \/* \u6bcf\u5c4f\u5360 10% *\/\r\n    .Modern-mockup-ui {\r\n        width: 100%; height: calc(100% \/ 3);\r\n        display: flex; align-items: center; justify-content: center;\r\n        box-sizing: border-box;\r\n    }\r\n    \r\n    .Modern-ui-1 { background: #f8fafc; }\r\n    .Modern-ui-2 { background: #1e293b; }\r\n    .Modern-ui-3 { background: #eff6ff; }\r\n    \r\n    .Modern-ui-box { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 0 }\r\n    .Modern-ui-box img { \r\n        width: 100%; height: 580px; object-fit: contain; \r\n        border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,0.15);\r\n    }\r\n    \r\n    \/* \u53f3\u4fa7\u6587\u6848 *\/\r\n    .Modern-right-scroll { width: 50%; }\r\n    .Modern-text-step {\r\n        height: 100vh; display: flex; flex-direction: column; justify-content: center;\r\n        opacity: 0.15; transition: all 0.6s ease; padding-left: 50px;\r\n    }\r\n    .Modern-text-step p{\r\n    font-weight: 300;\r\n}\r\n\r\n.Modern-text-step p b{\r\n    font-weight: 600;\r\n}\r\n    .Modern-text-step.active { opacity: 1; transform: translateX(10px); }\r\n    .Modern-step-num { font-size: 1.1rem; color: #3b82f6; font-weight: 700; margin-bottom: 12px; letter-spacing: 2px; }\r\n    .Modern-text-step h2 { font-size: 2.5rem; font-weight: 700; margin-bottom: 20px; color: #111; line-height: 1.2; }\r\n    .Modern-text-step p { font-size: 1.1rem; color: #555; line-height: 1.6; max-width: 400px; }\r\n    .Modern-text-step b { color: #000; font-weight: 600; }\r\n\r\n    \/* \u79fb\u52a8\u7aef\u9002\u914d *\/\r\n    @media (max-width: 768px) {\r\n        .Modern-scrolly-container { flex-direction: column-reverse; }\r\n        .Modern-left-sticky { width: 100%; height: 55vh; top: 0; background: #fff; z-index: 30; }\r\n        .Modern-phone-frame { transform: scale(0.5);  margin-top: 80px; }\r\n        .Modern-right-scroll { width: 100%; padding: 0 20px; }\r\n        .Modern-text-step { height: 75vh; text-align: center; padding-left: 0; align-items: center; }\r\n        .Modern-text-step.active { transform: none; }\r\n    }\r\n<\/style>\r\n\r\n<script>\r\n    document.addEventListener('DOMContentLoaded', function() {\r\n        (function() {\r\n            const textSteps = document.querySelectorAll('.Modern-text-step');\r\n            const phoneTrack = document.getElementById('Modern-phone-track');\r\n\r\n            if (!textSteps.length || !phoneTrack) return;\r\n\r\n            const observerOptions = {\r\n                rootMargin: \"-45% 0px -45% 0px\",\r\n                threshold: 0\r\n            };\r\n\r\n            const observerCallback = (entries) => {\r\n                entries.forEach(entry => {\r\n                    if (entry.isIntersecting) {\r\n                        textSteps.forEach(s => s.classList.remove('active'));\r\n                        entry.target.classList.add('active');\r\n\r\n                        const idx = parseInt(entry.target.getAttribute('data-index'), 10);\r\n                        \/\/ \u6bcf\u4e00\u8df3\u504f\u79fb 100\/10 = 10%\r\n                        const offset = idx * -(100 \/ textSteps.length);\r\n                        phoneTrack.style.transform = `translateY(${offset}%)`;\r\n                    }\r\n                });\r\n            };\r\n\r\n            const ModernObs = new IntersectionObserver(observerCallback, observerOptions);\r\n            textSteps.forEach(step => ModernObs.observe(step));\r\n        })();\r\n    });\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-51784375 elementor-widget elementor-widget-html\" data-id=\"51784375\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"re\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ==================== Case 1: @AmpAura ==================== -->\r\n<style>\r\n    .five-scrolly-container-1 {\r\n        display: flex;\r\n        position: relative;\r\n        max-width: 1400px;\r\n        margin: 0 auto;\r\n        padding: 0 20px;\r\n        gap: 180px;\r\n    }\r\n\r\n    .five-left-sticky-1 {\r\n        width: 48%;\r\n        height: 100vh;\r\n        position: sticky;\r\n        top: 0;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        z-index: 10;\r\n        overflow: hidden;\r\n    }\r\n\r\n    .five-display-frame-1 {\r\n        position: relative;\r\n        width: 800px;\r\n        height: 336px;\r\n        background-color: #333;\r\n        border-radius: 15px;\r\n        box-shadow: 21px -3px 25px -16px rgba(0,0,0,0.6);\r\n        overflow: hidden;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: space-between;\r\n    }\r\n\r\n    .five-top-bar-1 {\r\n        display: flex;\r\n        align-items: center;\r\n        padding: 0 10px;\r\n        box-sizing: border-box;\r\n        position: relative;\r\n        z-index: 20;\r\n    }\r\n    .five-top-bar-1::before {\r\n        content: url('data:image\/svg+xml;utf8,<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"50\" height=\"12\" viewBox=\"0 0 50 12\"><circle cx=\"6\" cy=\"6\" r=\"5\" fill=\"#FF5E5B\"\/><circle cx=\"20\" cy=\"6\" r=\"5\" fill=\"#FFBB40\"\/><circle cx=\"34\" cy=\"6\" r=\"5\" fill=\"#34C84A\"\/><\/svg>');\r\n        position: absolute;\r\n        left: 10px;\r\n        top: 50%;\r\n        transform: translateY(-50%);\r\n    }\r\n\r\n    .five-screen-1 {\r\n        flex-grow: 1;\r\n        background: #fff;\r\n        overflow: hidden;\r\n        position: relative;\r\n        border-radius: 0 0 10px 10px;\r\n    }\r\n\r\n    .five-base-1 {\r\n        position: absolute;\r\n        bottom: -40px;\r\n        left: 50%;\r\n        transform: translateX(-50%);\r\n        width: 80%;\r\n        height: 50px;\r\n        z-index: -1;\r\n    }\r\n    .five-base-stand-1 {\r\n        width: 80px;\r\n        height: 40px;\r\n        background-color: #A1A1AA;\r\n        border-radius: 5px 5px 0 0;\r\n        margin: 0 auto;\r\n    }\r\n    .five-base-foot-1 {\r\n        width: 150px;\r\n        height: 10px;\r\n        background-color: #A1A1AA;\r\n        border-radius: 0 0 5px 5px;\r\n        margin: 0 auto;\r\n    }\r\n\r\n    \/* 2\u5f20\u56fe\uff0c\u603b\u9ad8\u5ea6 200% *\/\r\n    .five-screen-content-1 {\r\n        width: 100%;\r\n        height: 200%;\r\n        transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);\r\n        display: flex;\r\n        flex-direction: column;\r\n    }\r\n\r\n    .five-mockup-ui-1 {\r\n        width: 100%;\r\n        height: 50%;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        padding: 0;\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    .five-ui-1-bg { background: linear-gradient(135deg, #EBF5F8, #D6EEF5); }\r\n\r\n    .five-ui-box-1 {\r\n        width: 100%;\r\n        height: 100%;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        padding: 0;\r\n        box-sizing: border-box;\r\n    }\r\n    .five-ui-box-1 img {\r\n        width: 100%;\r\n        height: 100%;\r\n        object-fit: contain;\r\n        padding: 10px;\r\n        border-radius: 5px;\r\n    }\r\n\r\n    .five-right-scroll-1 { width: 40%; padding: 0; }\r\n\r\n    .five-text-step-1 {\r\n        height: 100vh;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        opacity: 0.2;\r\n        transition: opacity 0.6s ease;\r\n        max-width: 400px;\r\n        padding-left: 50px;\r\n    }\r\n    .five-text-step-1 p { font-weight: 300; }\r\n    .five-text-step-1 p b { font-weight: 600; }\r\n    .five-text-step-1.active { opacity: 1; }\r\n\r\n    .yyfw-f1 {\r\n        background-color: #8C7DFF;\r\n        width: 140px;\r\n        text-align: center;\r\n        color: white;\r\n        border-radius: 360px;\r\n        line-height: 40px;\r\n        margin-top: 25px;\r\n    }\r\n\r\n    @media (max-width: 1024px) {\r\n        .five-display-frame-1 { width: 600px; height: 400px; }\r\n        .five-right-scroll-1 { width: 50%; }\r\n        .five-right-scroll-1 .five-text-step-1 { padding-left: 20px; }\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .five-scrolly-container-1 { flex-direction: column; padding: 0; gap: 0; }\r\n        .five-left-sticky-1 { width: 100%; height: 400px; top: 0; padding-top: 60px; box-sizing: border-box; background: #fff; z-index: 30; }\r\n        .five-display-frame-1 { transform: scale(0.7); transform-origin: bottom center; width: 100%; max-width: 400px; height: 250px; border-radius: 10px; box-shadow: 0 5px 20px rgba(0,0,0,0.4); margin: 0 auto; }\r\n        .five-top-bar-1 { height: 20px; }\r\n        .five-top-bar-1::before { transform: scale(0.8) translateY(-50%); left: 5px; }\r\n        .five-base-1 { display: none; }\r\n        .five-right-scroll-1 { width: 100%; padding: 0 20px; z-index: 20; margin-top: -80px; }\r\n        .five-text-step-1 { height: 80vh; justify-content: flex-end; padding-bottom: 8vh; align-items: center; text-align: center; max-width: 100%; padding-left: 0; }\r\n        .five-text-step-1 p { font-size: 0.9rem; color: #666; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"five-scrolly-container-1\">\r\n    <div class=\"five-left-sticky-1\">\r\n        <div class=\"five-display-frame-1\">\r\n            <div class=\"five-top-bar-1\"><\/div>\r\n            <div class=\"five-screen-1\">\r\n                <div class=\"five-screen-content-1\" id=\"js-five-scroller-track-1\">\r\n                    <div class=\"five-mockup-ui-1 five-ui-1-bg\"><div class=\"five-ui-box-1\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724759.png\"><\/div><\/div>\r\n                    <div class=\"five-mockup-ui-1 five-ui-1-bg\"><div class=\"five-ui-box-1\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724761.png\" alt=\"Mac Display 2\"><\/div><\/div>\r\n                <\/div>\r\n            <\/div>\r\n            <div class=\"five-base-1\">\r\n                <div class=\"five-base-stand-1\"><\/div>\r\n                <div class=\"five-base-foot-1\"><\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"five-right-scroll-1\">\r\n        <div class=\"five-text-step-1\" data-index=\"0\">\r\n            <p><b>@AmpAura<\/b><br> Portable Power Station partnered with 20+ creators across TikTok and Instagram, generating 3M+ cross-platform impressions. Leveraging trending events, the campaign sparked viral discussions around product \"endurance\" and \"charging methods,\" with a single influencer video achieving 880K+ organic views. This creator-driven approach helped the product reach #1 in online pre-orders within its category, demonstrating a scalable model that converts engagement into immediate sales.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-f1\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"five-text-step-1\" data-index=\"1\">\r\n            <p><b>@AmpAura<\/b><br> Portable Power Station partnered with 20+ creators across TikTok and Instagram, generating 3M+ cross-platform impressions. Leveraging trending events, the campaign sparked viral discussions around product \"endurance\" and \"charging methods,\" with a single influencer video achieving 880K+ organic views. This creator-driven approach helped the product reach #1 in online pre-orders within its category, demonstrating a scalable model that converts engagement into immediate sales.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-f1\">Contact Us<\/a>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    (function() {\r\n        const fiveTextSteps = document.querySelectorAll('.five-text-step-1');\r\n        const fiveScrollerTrack = document.getElementById('js-five-scroller-track-1');\r\n        if (!fiveTextSteps.length || !fiveScrollerTrack) return;\r\n\r\n        const fiveObserverOptions = { rootMargin: \"-45% 0px -45% 0px\", threshold: 0 };\r\n\r\n        const fiveIntersectionHandler = (entries) => {\r\n            entries.forEach(entry => {\r\n                if (entry.isIntersecting) {\r\n                    fiveTextSteps.forEach(step => step.classList.remove('active'));\r\n                    entry.target.classList.add('active');\r\n                    const currentStepIndex = parseInt(entry.target.getAttribute('data-index'), 10);\r\n                    const totalScreens = 2;\r\n                    const slidePercentPerScreen = 100 \/ totalScreens;\r\n                    const scrollOffset = currentStepIndex * -slidePercentPerScreen;\r\n                    fiveScrollerTrack.style.transform = `translateY(${scrollOffset}%)`;\r\n                }\r\n            });\r\n        };\r\n\r\n        const fiveVisualObserver = new IntersectionObserver(fiveIntersectionHandler, fiveObserverOptions);\r\n        fiveTextSteps.forEach(stepItem => { fiveVisualObserver.observe(stepItem); });\r\n    })();\r\n});\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7e36226 elementor-widget elementor-widget-html\" data-id=\"7e36226\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ==================== Case 2: @PITAKA ==================== -->\r\n<style>\r\n    .five-scrolly-container-2 {\r\n        display: flex;\r\n        position: relative;\r\n        max-width: 1400px;\r\n        margin: 0 auto;\r\n        padding: 0 20px;\r\n        gap: 180px;\r\n    }\r\n\r\n    .five-left-sticky-2 {\r\n        width: 48%;\r\n        height: 100vh;\r\n        position: sticky;\r\n        top: 0;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        z-index: 10;\r\n        overflow: hidden;\r\n    }\r\n\r\n    .five-display-frame-2 {\r\n        position: relative;\r\n        width: 800px;\r\n        height: 336px;\r\n        background-color: #333;\r\n        border-radius: 15px;\r\n        box-shadow: 21px -3px 25px -16px rgba(0,0,0,0.6);\r\n        overflow: hidden;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: space-between;\r\n    }\r\n\r\n    .five-top-bar-2 {\r\n        display: flex;\r\n        align-items: center;\r\n        padding: 0 10px;\r\n        box-sizing: border-box;\r\n        position: relative;\r\n        z-index: 20;\r\n    }\r\n    .five-top-bar-2::before {\r\n        content: url('data:image\/svg+xml;utf8,<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"50\" height=\"12\" viewBox=\"0 0 50 12\"><circle cx=\"6\" cy=\"6\" r=\"5\" fill=\"#FF5E5B\"\/><circle cx=\"20\" cy=\"6\" r=\"5\" fill=\"#FFBB40\"\/><circle cx=\"34\" cy=\"6\" r=\"5\" fill=\"#34C84A\"\/><\/svg>');\r\n        position: absolute;\r\n        left: 10px;\r\n        top: 50%;\r\n        transform: translateY(-50%);\r\n    }\r\n\r\n    .five-screen-2 {\r\n        flex-grow: 1;\r\n        background: #fff;\r\n        overflow: hidden;\r\n        position: relative;\r\n        border-radius: 0 0 10px 10px;\r\n    }\r\n\r\n    .five-base-2 {\r\n        position: absolute;\r\n        bottom: -40px;\r\n        left: 50%;\r\n        transform: translateX(-50%);\r\n        width: 80%;\r\n        height: 50px;\r\n        z-index: -1;\r\n    }\r\n    .five-base-stand-2 {\r\n        width: 80px;\r\n        height: 40px;\r\n        background-color: #A1A1AA;\r\n        border-radius: 5px 5px 0 0;\r\n        margin: 0 auto;\r\n    }\r\n    .five-base-foot-2 {\r\n        width: 150px;\r\n        height: 10px;\r\n        background-color: #A1A1AA;\r\n        border-radius: 0 0 5px 5px;\r\n        margin: 0 auto;\r\n    }\r\n\r\n    \/* 3\u5f20\u56fe\uff0c\u603b\u9ad8\u5ea6 300% *\/\r\n    .five-screen-content-2 {\r\n        width: 100%;\r\n        height: 300%;\r\n        transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);\r\n        display: flex;\r\n        flex-direction: column;\r\n    }\r\n\r\n    .five-mockup-ui-2 {\r\n        width: 100%;\r\n        height: calc(100% \/ 3);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        padding: 0;\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    .five-ui-2a-bg { background: linear-gradient(135deg, #F0F9E8, #DDEBCE); }\r\n    .five-ui-2b-bg { background: linear-gradient(135deg, #F9EEFB, #EDD7F1); }\r\n\r\n    .five-ui-box-2 {\r\n        width: 100%;\r\n        height: 100%;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        padding: 0;\r\n        box-sizing: border-box;\r\n    }\r\n    .five-ui-box-2 img {\r\n        width: 100%;\r\n        height: 100%;\r\n        object-fit: contain;\r\n        padding: 10px;\r\n        border-radius: 5px;\r\n    }\r\n\r\n    .five-right-scroll-2 { width: 40%; padding: 0; }\r\n\r\n    .five-text-step-2 {\r\n        height: 100vh;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        opacity: 0.2;\r\n        transition: opacity 0.6s ease;\r\n        max-width: 400px;\r\n        padding-left: 50px;\r\n    }\r\n    .five-text-step-2 p { font-weight: 300; }\r\n    .five-text-step-2 p b { font-weight: 600; }\r\n    .five-text-step-2.active { opacity: 1; }\r\n\r\n    .yyfw-f2 {\r\n        background-color: #8C7DFF;\r\n        width: 140px;\r\n        text-align: center;\r\n        color: white;\r\n        border-radius: 360px;\r\n        line-height: 40px;\r\n        margin-top: 25px;\r\n    }\r\n\r\n    @media (max-width: 1024px) {\r\n        .five-display-frame-2 { width: 600px; height: 400px; }\r\n        .five-right-scroll-2 { width: 50%; }\r\n        .five-right-scroll-2 .five-text-step-2 { padding-left: 20px; }\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .five-scrolly-container-2 { flex-direction: column; padding: 0; gap: 0; }\r\n        .five-left-sticky-2 { width: 100%; height: 400px; top: 0; padding-top: 60px; box-sizing: border-box; background: #fff; z-index: 30; }\r\n        .five-display-frame-2 { transform: scale(0.7); transform-origin: bottom center; width: 100%; max-width: 400px; height: 250px; border-radius: 10px; box-shadow: 0 5px 20px rgba(0,0,0,0.4); margin: 0 auto; }\r\n        .five-top-bar-2 { height: 20px; }\r\n        .five-top-bar-2::before { transform: scale(0.8) translateY(-50%); left: 5px; }\r\n        .five-base-2 { display: none; }\r\n        .five-right-scroll-2 { width: 100%; padding: 0 20px; z-index: 20; margin-top: -80px; }\r\n        .five-text-step-2 { height: 80vh; justify-content: flex-end; padding-bottom: 8vh; align-items: center; text-align: center; max-width: 100%; padding-left: 0; }\r\n        .five-text-step-2 p { font-size: 0.9rem; color: #666; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"five-scrolly-container-2\">\r\n    <div class=\"five-left-sticky-2\">\r\n        <div class=\"five-display-frame-2\">\r\n            <div class=\"five-top-bar-2\"><\/div>\r\n            <div class=\"five-screen-2\">\r\n                <div class=\"five-screen-content-2\" id=\"js-five-scroller-track-2\">\r\n                    <div class=\"five-mockup-ui-2 five-ui-2a-bg\"><div class=\"five-ui-box-2\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/\u56fe\u724774.png\" alt=\"Mac Display 3\"><\/div><\/div>\r\n                    <div class=\"five-mockup-ui-2 five-ui-2a-bg\"><div class=\"five-ui-box-2\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/ScreenShot_2026-04-03_182314_908.png\" alt=\"Mac Display 4\"><\/div><\/div>\r\n                    <div class=\"five-mockup-ui-2 five-ui-2b-bg\"><div class=\"five-ui-box-2\"><img decoding=\"async\" src=\"\/wp-content\/uploads\/2026\/04\/ScreenShot_2026-04-03_182323_781.png\" alt=\"Mac Display 5\"><\/div><\/div>\r\n                <\/div>\r\n            <\/div>\r\n            <div class=\"five-base-2\">\r\n                <div class=\"five-base-stand-2\"><\/div>\r\n                <div class=\"five-base-foot-2\"><\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"five-right-scroll-2\">\r\n        <div class=\"five-text-step-2\" data-index=\"0\">\r\n            <p><b>@PITAKA<\/b><br>\r\n            High-performance mobile accessories brand, leveraging a creator matrix to build a full funnel from awareness to conversion. Collaborated with 4 top-tier photography KOLs and 14 mid-tier creators to establish layered content distribution and trust signals. Achieved a 3.75% engagement rate and 2.23M+ total impressions, consistently feeding high-intent traffic into live commerce and e-commerce channels to support downstream conversions.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-f2\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"five-text-step-2\" data-index=\"1\">\r\n            <p><b>@PITAKA<\/b><br>\r\n            High-performance mobile accessories brand, leveraging a creator matrix to build a full funnel from awareness to conversion. Collaborated with 4 top-tier photography KOLs and 14 mid-tier creators to establish layered content distribution and trust signals. Achieved a 3.75% engagement rate and 2.23M+ total impressions, consistently feeding high-intent traffic into live commerce and e-commerce channels to support downstream conversions.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-f2\">Contact Us<\/a>\r\n        <\/div>\r\n        <div class=\"five-text-step-2\" data-index=\"2\">\r\n            <p><b>@PITAKA<\/b><br>\r\n            High-performance mobile accessories brand, leveraging a creator matrix to build a full funnel from awareness to conversion. Collaborated with 4 top-tier photography KOLs and 14 mid-tier creators to establish layered content distribution and trust signals. Achieved a 3.75% engagement rate and 2.23M+ total impressions, consistently feeding high-intent traffic into live commerce and e-commerce channels to support downstream conversions.<\/p>\r\n            <a href=\"\/index.php\/contact\/\" class=\"yyfw-f2\">Contact Us<\/a>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    (function() {\r\n        const fiveTextSteps = document.querySelectorAll('.five-text-step-2');\r\n        const fiveScrollerTrack = document.getElementById('js-five-scroller-track-2');\r\n        if (!fiveTextSteps.length || !fiveScrollerTrack) return;\r\n\r\n        const fiveObserverOptions = { rootMargin: \"-45% 0px -45% 0px\", threshold: 0 };\r\n\r\n        const fiveIntersectionHandler = (entries) => {\r\n            entries.forEach(entry => {\r\n                if (entry.isIntersecting) {\r\n                    fiveTextSteps.forEach(step => step.classList.remove('active'));\r\n                    entry.target.classList.add('active');\r\n                    const currentStepIndex = parseInt(entry.target.getAttribute('data-index'), 10);\r\n                    const totalScreens = 3;\r\n                    const slidePercentPerScreen = 100 \/ totalScreens;\r\n                    const scrollOffset = currentStepIndex * -slidePercentPerScreen;\r\n                    fiveScrollerTrack.style.transform = `translateY(${scrollOffset}%)`;\r\n                }\r\n            });\r\n        };\r\n\r\n        const fiveVisualObserver = new IntersectionObserver(fiveIntersectionHandler, fiveObserverOptions);\r\n        fiveTextSteps.forEach(stepItem => { fiveVisualObserver.observe(stepItem); });\r\n    })();\r\n});\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>SOCIAL PROOF \u201cThey didn\u2019t just improve performance \u2014 they rebuilt how our business grows.\u201d Find your growth path \u2014 and let\u2019s build your system SERVICE-BASED GROUPING The Revenue Engine case 1 @Sumi Lash A U.S. lash brand chain with 10+ offline stores and hundreds of trainees through its academy. We provide comprehensive services that integrate [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-29444","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.lucas-admedia.com\/index.php\/wp-json\/wp\/v2\/pages\/29444","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.lucas-admedia.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.lucas-admedia.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.lucas-admedia.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.lucas-admedia.com\/index.php\/wp-json\/wp\/v2\/comments?post=29444"}],"version-history":[{"count":118,"href":"https:\/\/www.lucas-admedia.com\/index.php\/wp-json\/wp\/v2\/pages\/29444\/revisions"}],"predecessor-version":[{"id":29665,"href":"https:\/\/www.lucas-admedia.com\/index.php\/wp-json\/wp\/v2\/pages\/29444\/revisions\/29665"}],"wp:attachment":[{"href":"https:\/\/www.lucas-admedia.com\/index.php\/wp-json\/wp\/v2\/media?parent=29444"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}